npm - @duetds/components - Versions diffs - 6.8.5 → 6.8.6 - Mend

@duetds/components 6.8.5 → 6.8.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (527) hide show

package/hydrate/index.js CHANGED Viewed

@@ -9935,6 +9935,7 @@ class DuetEditableTable {
     this.groupId = "";
     this.theme = "";
     this.accessibleRole = undefined;
+    this.hideHeadVisually = false;
   }
   /**
    * Component lifecycle events.
@@ -9998,7 +9999,7 @@ class DuetEditableTable {
     }
     // iterate through actions and add them in the sidebar
     return (hAsync("td", { class: "duet-text-right" }, this.actions.map(actionItem => {
-      return (hAsync("duet-action-button", { actionMeta: Object.assign({}, (rowItem === null || rowItem === void 0 ? void 0 : rowItem.meta) || {}, { index }), actionId: (rowItem === null || rowItem === void 0 ? void 0 : rowItem.uid) || (rowItem === null || rowItem === void 0 ? void 0 : rowItem.id) || null, actionName: actionItem.name, theme: this.theme, iconName: actionItem.icon, iconColor: actionItem.color, iconSize: actionItem.size, background: actionItem.background, "accessible-label": `${getLocaleString(actionItem.label)} ${rowItem.name || ""}` }));
+      return (hAsync("duet-action-button", { actionMeta: Object.assign({}, (rowItem === null || rowItem === void 0 ? void 0 : rowItem.meta) || {}, { index }), actionId: (rowItem === null || rowItem === void 0 ? void 0 : rowItem.uid) || (rowItem === null || rowItem === void 0 ? void 0 : rowItem.id) || null, actionName: actionItem.name, theme: this.theme, iconName: actionItem.icon, iconColor: actionItem.color, iconSize: actionItem.size, background: actionItem.background, "accessible-label": `${rowItem.actionDescription || ""} ${getLocaleString(actionItem.label)} ` }));
     })));
   }
   renderTableBody() {
@@ -10032,7 +10033,7 @@ class DuetEditableTable {
         "duet-editable-table-actions": !!this.actions,
         "duet-m-0": this.margin === "none",
         "duet-theme-turva": this.theme === "turva",
-      } }, hAsync("duet-table", { class: "duet-editable-table-table", sticky: this.sticky, stickyDistance: this.stickyDistance, margin: this.margin, theme: this.theme, variation: this.variation, breakpoint: this.breakpoint }, hAsync("table", { role: this.accessibleRole }, hAsync("caption", null, hAsync("slot", { name: "tcaption" })), hAsync("thead", null, hAsync("tr", null, hAsync("td", { class: "duet-editable-table-actions-menu", colSpan: 99 }, hAsync("slot", { name: "thead-first" }))), this.renderTableHeader(), hAsync("tr", null, hAsync("td", { class: "duet-editable-table-actions-menu", colSpan: 99 }, hAsync("slot", { name: "thead-last" })))), hAsync("tbody", null, this.renderTableBody()), hAsync("tfoot", null, hAsync("tr", null, hAsync("th", { class: "duet-editable-table-footer-menu", colSpan: 99 }, hAsync("slot", { name: "tfoot" }))))))));
+      } }, hAsync("duet-table", { class: "duet-editable-table-table", sticky: this.sticky, stickyDistance: this.stickyDistance, margin: this.margin, theme: this.theme, variation: this.variation, breakpoint: this.breakpoint, "hide-head-visually": this.hideHeadVisually }, hAsync("table", { role: this.accessibleRole }, hAsync("caption", null, hAsync("slot", { name: "tcaption" })), hAsync("thead", null, hAsync("tr", null, hAsync("td", { class: "duet-editable-table-actions-menu", colSpan: 99 }, hAsync("slot", { name: "thead-first" }))), this.renderTableHeader(), hAsync("tr", null, hAsync("td", { class: "duet-editable-table-actions-menu", colSpan: 99 }, hAsync("slot", { name: "thead-last" })))), hAsync("tbody", null, this.renderTableBody()), hAsync("tfoot", null, hAsync("tr", null, hAsync("th", { class: "duet-editable-table-footer-menu", colSpan: 99 }, hAsync("slot", { name: "tfoot" }))))))));
   }
   get element() { return getElement(this); }
   static get style() { return duetEditableTableCss; }
@@ -10051,7 +10052,8 @@ class DuetEditableTable {
       "sortable": [4],
       "groupId": [1, "group-id"],
       "theme": [1025],
-      "accessibleRole": [1, "accessible-role"]
+      "accessibleRole": [1, "accessible-role"],
+      "hideHeadVisually": [4, "hide-head-visually"]
     },
     "$listeners$": undefined,
     "$lazyBundleId$": "-",
@@ -18028,9 +18030,10 @@ const ErrorItem = ({ data, errorCodes }) => {
 };
 const ProgressItem = ({ progress, name }) => (hAsync("span", { class: "duet-upload-item-name" },
-  hAsync("duet-icon", { margin: "none", size: "x-small", name: "messaging-attachment" }),
-  hAsync("duet-spacer", { size: "xx-small", direction: "horizontal" }),
-  name,
+  hAsync("duet-paragraph", { class: "duet-upload-item-name", color: "gray-darker", margin: "none", weight: "semi-bold" },
+    hAsync("duet-icon", { margin: "none", size: "x-small", name: "messaging-attachment" }),
+    hAsync("duet-spacer", { size: "xx-small", direction: "horizontal" }),
+    name),
   hAsync("br", null),
   hAsync("duet-progress", { progress: Math.ceil(progress), "aria-hidden": true })));
@@ -18051,7 +18054,7 @@ const formatBytes = (bytes, decimals = 2) => {
 };
 const SuccessItem = ({ data, showLinks }) => {
-  const { item, size, uploaded, url, meta } = data;
+  const { item, size, uploaded, url } = data;
   const { name } = item;
   const ContentName = (hAsync("span", { class: "duet-upload-item-name" },
     hAsync("duet-icon", { margin: "none", size: "x-small", name: "messaging-attachment" }),
@@ -18068,12 +18071,24 @@ const SuccessItem = ({ data, showLinks }) => {
     ContentName,
     hAsync("duet-spacer", { size: "xx-small", direction: "horizontal" }),
     SizeText));
+  // const Badges =
+  //   meta && meta.badges ? (
+  //     <span>
+  //       <duet-spacer size="xx-small"></duet-spacer>
+  //       {meta.badges.map(badgeText => (
+  //         <duet-badge color="primary">{badgeText}</duet-badge>
+  //       ))}
+  //     </span>
+  //   ) : undefined
+  return (hAsync("span", { class: "duet-upload-item-success" },
+    hAsync("div", null, FilenameLine)));
+};
+const UploadCategory = ({ meta }) => {
   const Badges = meta && meta.badges ? (hAsync("span", null,
     hAsync("duet-spacer", { size: "xx-small" }),
-    meta.badges.map(badgeText => (hAsync("duet-badge", { color: "primary" }, badgeText))))) : undefined;
-  return (hAsync("span", { class: "duet-upload-item-success" },
-    hAsync("div", null, FilenameLine),
-    Badges));
+    meta.badges.map(badgeText => (hAsync("duet-badge", { color: "primary" }, badgeText))))) : (hAsync("span", null));
+  return Badges;
 };
 const validateFileExtension = (name, allowedExtensions) => {
@@ -18199,12 +18214,14 @@ const makeXhrRequest = ({ payload, options, onFailure, onSuccess, onProgress })
   return xhr;
 };
-const duetUploadCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-upload,*.sc-duet-upload::after,*.sc-duet-upload::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-upload-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@::slotted([slot=header])*/.sc-duet-upload-s>[slot=header]{margin-bottom:16px}/*!@::slotted([slot=fileheader])*/.sc-duet-upload-s>[slot=fileheader]{margin:16px 0 0 0}/*!@::slotted([slot=filefooter])*/.sc-duet-upload-s>[slot=filefooter]{margin-top:16px}/*!@.duet-upload*/.duet-upload.sc-duet-upload{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@.duet-upload-item-size*/.duet-upload-item-size.sc-duet-upload{font-size:0.75rem;font-weight:400}/*!@.duet-upload-filelist*/.duet-upload-filelist.sc-duet-upload{margin-bottom:25px}/*!@.duet-upload-filelist-empty*/.duet-upload-filelist-empty.sc-duet-upload{display:flex;align-items:center;justify-content:center;width:100%;height:75px;margin:0 auto;font-size:1rem;font-weight:400;background-color:rgb(245, 248, 250)}/*!@.duet-upload-filelist-empty-label*/.duet-upload-filelist-empty-label.sc-duet-upload{font-size:1rem;font-weight:400}/*!@.duet-upload-editable-table-header-hidden*/.duet-upload-editable-table-header-hidden.sc-duet-upload{display:none}/*!@.duet-upload-editable-table tbody .duet-upload-editable-table-data*/.duet-upload-editable-table.sc-duet-upload tbody.sc-duet-upload .duet-upload-editable-table-data.sc-duet-upload{padding:0 !important;border:0}/*!@.duet-upload-editable-table duet-editable-table tfoot,\n.duet-upload-editable-table duet-editable-table thead*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload tfoot.sc-duet-upload,.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload thead.sc-duet-upload{display:none}/*!@.duet-upload-editable-table duet-editable-table .duet-editable-table-content*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-content.sc-duet-upload{padding-right:0 !important;padding-left:0 !important}/*!@.duet-upload-editable-table duet-editable-table duet-table .duet-table-action-row td*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload duet-table.sc-duet-upload .duet-table-action-row.sc-duet-upload td.sc-duet-upload{padding:1rem 0 !important}/*!@.duet-upload-editable-table duet-editable-table duet-table .duet-table-action-row td:last-child*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload duet-table.sc-duet-upload .duet-table-action-row.sc-duet-upload td.sc-duet-upload:last-child{padding-right:0 !important}/*!@.duet-upload-editable-table duet-editable-table .duet-editable-table-row-inprogress, .duet-upload-editable-table duet-editable-table .duet-editable-table-row-pending*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-row-inprogress.sc-duet-upload,.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-row-pending.sc-duet-upload{position:relative}/*!@.duet-upload-editable-table duet-editable-table .duet-editable-table-row-inprogress duet-progress, .duet-upload-editable-table duet-editable-table .duet-editable-table-row-pending duet-progress*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-row-inprogress.sc-duet-upload duet-progress.sc-duet-upload,.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-row-pending.sc-duet-upload duet-progress.sc-duet-upload{position:absolute;bottom:0;width:100%}/*!@.duet-upload-editable-table duet-editable-table .duet-editable-table-row-inprogress duet-action-button::part(button), .duet-upload-editable-table duet-editable-table .duet-editable-table-row-pending duet-action-button::part(button)*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-row-inprogress.sc-duet-upload duet-action-button.sc-duet-upload::part(button),.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-row-pending.sc-duet-upload duet-action-button.sc-duet-upload::part(button){border:0}/*!@.duet-upload-editable-table .duet-upload-item-name duet-icon*/.duet-upload-editable-table.sc-duet-upload .duet-upload-item-name.sc-duet-upload duet-icon.sc-duet-upload{position:relative;top:2px}/*!@duet-paragraph::part(duet-paragraph)*/duet-paragraph.sc-duet-upload::part(duet-paragraph){word-break:break-word}";
+const duetUploadCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-upload,*.sc-duet-upload::after,*.sc-duet-upload::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-upload-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@::slotted([slot=header])*/.sc-duet-upload-s>[slot=header]{margin-bottom:16px}/*!@::slotted([slot=fileheader])*/.sc-duet-upload-s>[slot=fileheader]{margin:16px 0 0 0}/*!@::slotted([slot=filefooter])*/.sc-duet-upload-s>[slot=filefooter]{margin-top:16px}/*!@.duet-upload*/.duet-upload.sc-duet-upload{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@.duet-upload-item-size*/.duet-upload-item-size.sc-duet-upload{font-size:0.75rem;font-weight:400}/*!@.duet-upload-filelist*/.duet-upload-filelist.sc-duet-upload{margin-bottom:25px}/*!@.duet-upload-filelist-empty*/.duet-upload-filelist-empty.sc-duet-upload{display:flex;align-items:center;justify-content:center;width:100%;height:75px;margin:0 auto;font-size:1rem;font-weight:400;background-color:rgb(245, 248, 250)}/*!@.duet-upload-filelist-empty-label*/.duet-upload-filelist-empty-label.sc-duet-upload{font-size:1rem;font-weight:400}/*!@.duet-upload-editable-table-header-hidden*/.duet-upload-editable-table-header-hidden.sc-duet-upload{display:none}/*!@.duet-upload-editable-table tbody .duet-upload-editable-table-data*/.duet-upload-editable-table.sc-duet-upload tbody.sc-duet-upload .duet-upload-editable-table-data.sc-duet-upload{padding:0 !important;border:0}/*!@.duet-upload-editable-table duet-editable-table tfoot,\n.duet-upload-editable-table duet-editable-table thead*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload tfoot.sc-duet-upload,.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload thead.sc-duet-upload{display:none}/*!@.duet-upload-editable-table duet-editable-table .duet-editable-table-content*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-content.sc-duet-upload{padding-right:0 !important;padding-left:0 !important}/*!@.duet-upload-editable-table duet-editable-table duet-table .duet-table-action-row td*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload duet-table.sc-duet-upload .duet-table-action-row.sc-duet-upload td.sc-duet-upload{padding:1rem 0 !important}/*!@.duet-upload-editable-table duet-editable-table duet-table .duet-table-action-row td:last-child*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload duet-table.sc-duet-upload .duet-table-action-row.sc-duet-upload td.sc-duet-upload:last-child{padding-right:0 !important}/*!@.duet-upload-editable-table duet-editable-table .duet-editable-table-row-inprogress, .duet-upload-editable-table duet-editable-table .duet-editable-table-row-pending*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-row-inprogress.sc-duet-upload,.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-row-pending.sc-duet-upload{position:relative}/*!@.duet-upload-editable-table duet-editable-table .duet-editable-table-row-inprogress duet-progress, .duet-upload-editable-table duet-editable-table .duet-editable-table-row-pending duet-progress*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-row-inprogress.sc-duet-upload duet-progress.sc-duet-upload,.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-row-pending.sc-duet-upload duet-progress.sc-duet-upload{position:absolute;bottom:0;width:100%}/*!@.duet-upload-editable-table duet-editable-table .duet-editable-table-row-inprogress duet-action-button::part(button), .duet-upload-editable-table duet-editable-table .duet-editable-table-row-pending duet-action-button::part(button)*/.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-row-inprogress.sc-duet-upload duet-action-button.sc-duet-upload::part(button),.duet-upload-editable-table.sc-duet-upload duet-editable-table.sc-duet-upload .duet-editable-table-row-pending.sc-duet-upload duet-action-button.sc-duet-upload::part(button){border:0}/*!@.duet-upload-editable-table .duet-upload-item-name duet-icon*/.duet-upload-editable-table.sc-duet-upload .duet-upload-item-name.sc-duet-upload duet-icon.sc-duet-upload{position:relative;top:2px}/*!@duet-paragraph::part(duet-paragraph)*/duet-paragraph.sc-duet-upload::part(duet-paragraph){word-break:break-word}/*!@duet-editable-table tfoot*/duet-editable-table.sc-duet-upload tfoot.sc-duet-upload{display:none}/*!@.upload-bottom-caption*/.upload-bottom-caption.sc-duet-upload{margin-bottom:12px}/*!@.test*/.test.sc-duet-upload{display:flex;flex-direction:row}/*!@.test .item-categories*/.test.sc-duet-upload .item-categories.sc-duet-upload{flex-grow:1}/*!@.test .item-label*/.test.sc-duet-upload .item-label.sc-duet-upload{flex-grow:2}/*!@.test .item-actions*/.test.sc-duet-upload .item-actions.sc-duet-upload{flex-grow:1}";
 /**
- * @slot header  - named slot - to place content after description / caption
+ * @slot header  - named slot - to place content after description / caption (if caption is on top)
  * @slot fileheader - named slot - to place content above "filelist" (only displayed when "filelist" contains items)
  * @slot filefooter - named slot - to place content below "filelist" (only displayed when "filelist" contains items)
+ * @slot footer - named slot - to place content below filefooter
+ * @slot afterfooter - named slot - to place content below "footer" / caption (if caption is on bottom)
  * @part ${this.identifier}-empty-state : duet-upload-empty-state - named part - can be used to style the empty notification area or hide it completely
  * @part ${this.identifier}-editable-table : duet-upload-editable-table - named part - can be used to style the editable-table
  * @part ${this.identifier}-error-notification : duet-upload-error-notification - named part - can be used to style any error notifications occurring internally
@@ -18581,46 +18598,59 @@ class DuetUpload {
       const pending = [];
       const success = [];
       all.forEach(data => {
+        var _a, _b;
         const group = this.getGroupFromItemData(data);
         const item = this.getItemHTMLFromItemData(data, group);
+        const category = hAsync(UploadCategory, { meta: data.meta });
+        const categories = (_b = (_a = data.meta) === null || _a === void 0 ? void 0 : _a.badges) === null || _b === void 0 ? void 0 : _b.join(",");
         if (group === this.DefaultGroups.success) {
           success.push({
             uid: data.uid,
             item,
+            hasCategory: data.meta && !!data.meta.badges,
+            category,
             group,
-            name: data.item.name,
+            actionDescription: `${categories || ""} ${data.item.name}`,
           });
         }
         else if (group === this.DefaultGroups.inprogress) {
           inprogress.push({
             uid: data.uid,
             item,
+            hasCategory: data.meta && !!data.meta.badges,
+            category,
             group,
-            name: data.item.name,
+            actionDescription: `category ${data.item.name}`,
           });
         }
         else if (group === this.DefaultGroups.pending) {
           pending.push({
             uid: data.uid,
             item,
+            hasCategory: data.meta && !!data.meta.badges,
+            category,
             group,
-            name: data.item.name,
+            actionDescription: `category ${data.item.name}`,
           });
         }
         else if (group === this.DefaultGroups.failure) {
           failure.push({
             uid: data.uid,
             item,
+            hasCategory: data.meta && !!data.meta.badges,
+            category,
             group,
-            name: data.item.name,
+            actionDescription: `category ${data.item.name}`,
           });
         }
         else if (data.group) {
           inprogress.push({
             uid: data.uid,
             item,
+            hasCategory: data.meta && !!data.meta.badges,
+            category,
             group: data.group,
-            name: data.item.name,
+            actionDescription: `category ${data.item.name}`,
           });
         }
       });
@@ -18631,14 +18661,27 @@ class DuetUpload {
         inprogress,
       };
     };
-    this.getColumns = (group) => {
+    this.getColumns = (group, hasCategory) => {
       return [
         {
           sort_order: 1,
           direction: -1,
           index: 0,
+          key: "category",
+          label: {
+            fi: "Kategoria",
+            sv: "Kategori",
+            en: "Category",
+          },
+          display: hasCategory,
+        },
+        {
+          sort_order: 1,
+          direction: -1,
+          index: 1,
           key: group.id,
           label: group.label,
+          display: true,
         },
       ];
     };
@@ -18652,9 +18695,8 @@ class DuetUpload {
         if (!(currentItems === null || currentItems === void 0 ? void 0 : currentItems.length)) {
           return;
         }
-        return (hAsync("duet-table", { variation: "plain", breakpoint: "none", role: "log", margin: this.hideGroups ? "none" : "auto" }, hAsync("table", { class: "duet-upload-editable-table" }, hAsync("thead", { class: "duet-upload-editable-table-header" }, hAsync("tr", null, hAsync("th", { class: {
-            "duet-upload-editable-table-header-hidden": this.hideGroups,
-          } }, !this.hideGroups ? (getLocaleString(group.label)) : (hAsync("duet-visually-hidden", null, getLocaleString(group.label)))))), hAsync("tbody", null, hAsync("tr", null, hAsync("td", { class: "duet-upload-editable-table-data" }, hAsync("duet-editable-table", { breakpoint: "none", variation: "plain", groupId: group.id, columns: this.getColumns(group), actions: this.getActions(group.id), margin: "none", rows: currentItems })))))));
+        const hasCategory = currentItems.some(item => item.hasCategory);
+        return (hAsync("duet-editable-table", { variation: "plain", groupId: group.id, columns: this.getColumns(group, hasCategory), actions: this.getActions(group.id), margin: "none", rows: currentItems, "hide-head-visually": this.hideGroups || group.id !== this.DefaultGroups.success }));
       });
       return EditableTables;
     };
@@ -18770,15 +18812,9 @@ class DuetUpload {
     this.multiple = true;
     this.limitSelection = false;
     this.value = undefined;
+    this.externalUploadButtonId = undefined;
+    this.captionOnBottom = false;
     this.groups = [
-      {
-        id: this.DefaultGroups.pending,
-        label: {
-          en: "Files to upload",
-          sv: "Filer att ladda",
-          fi: "Ladattavat tiedostot",
-        },
-      },
       {
         id: this.DefaultGroups.success,
         label: {
@@ -18803,6 +18839,14 @@ class DuetUpload {
           en: "Files inprogress",
         },
       },
+      {
+        id: this.DefaultGroups.pending,
+        label: {
+          en: "Files to upload",
+          sv: "Filer att ladda",
+          fi: "Ladattavat tiedostot",
+        },
+      },
     ];
   }
   watchValidHandler(newValue, oldValue) {
@@ -18823,6 +18867,7 @@ class DuetUpload {
     inheritGlobalTheme(this);
     this.listenForActionEvents();
     this.onReady();
+    this.externalUploadButton = document.querySelector(`#${this.externalUploadButtonId}`);
   }
   componentWillRender() {
     // listen to the events from the component
@@ -18889,14 +18934,17 @@ class DuetUpload {
     caption = caption.replace(/{maxbytes}/g, `${maxMegaBytesPrFile.toString()} MB`);
     caption = caption.replace(/{maxbytestotal}/g, `${maxMegaBytesTotal.toString()} MB`);
     caption = caption.replace(/{filetypes}/g, this.allowedExtensions.split(",").join(", "));
+    if (this.externalUploadButton) {
+      this.externalUploadButton.ariaLabel = caption;
+    }
     // @ts-ignore
-    return (hAsync(Host, { class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { label: this.label, caption: caption }, hAsync("slot", { name: "header" }), !this.files.size && (hAsync("duet-label", { part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", theme: this.theme === "turva" ? "turva" : "default", size: "small", class: {
+    return (hAsync(Host, { class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { label: this.label, caption: !this.captionOnBottom ? caption : undefined }, hAsync("slot", { name: "header" }), !this.files.size && (hAsync("duet-label", { part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", theme: this.theme === "turva" ? "turva" : "default", size: "small", class: {
         "duet-upload-filelist-empty": !this.files.size,
         "duet-upload-filelist": true,
         "duet-upload-filelist-filled": this.files.size,
       }, id: this.labelId, for: identifier }, hAsync("span", { class: {
         "duet-upload-filelist-empty-label": !this.files.size,
-      } }, this.fileListEmpty))), !!this.files.size && hAsync("slot", { name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderEditableTableGroups(), !!this.files.size && hAsync("slot", { name: "filefooter" }), hAsync("duet-spacer", { size: "large" }), !this.hideButton && (hAsync("duet-button", { id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel)), hAsync("duet-spacer", { size: "medium" }), (this.fileMaxReached || this.bytesMaxReached) && (hAsync("duet-alert", { part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes))), hAsync("duet-spacer", { size: "medium" }), hAsync("duet-visually-hidden", { "aria-hidden": "true" }, hAsync("input", { ref: input => {
+      } }, this.fileListEmpty))), !!this.files.size && hAsync("slot", { name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderEditableTableGroups(), !!this.files.size && hAsync("slot", { name: "filefooter" }), hAsync("slot", { name: "footer" }), this.captionOnBottom && (hAsync("duet-caption", { size: "small" }, hAsync("div", { class: "upload-bottom-caption" }, caption))), hAsync("slot", { name: "afterfooter" }), hAsync("duet-spacer", { size: "large" }), !this.hideButton && (hAsync("duet-button", { id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel)), hAsync("duet-spacer", { size: "medium" }), (this.fileMaxReached || this.bytesMaxReached) && (hAsync("duet-alert", { part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes))), hAsync("duet-spacer", { size: "medium" }), hAsync("duet-visually-hidden", { "aria-hidden": "true" }, hAsync("input", { ref: input => {
         this.nativeInput = input;
       }, accept: !this.limitSelection ? undefined : `${this.allowedMimetypes},${this.allowedExtensions}`, onBlur: this.onBlur, onFocus: this.onFocus, onChange: e => this.onChange(e), type: "file", class: {
         "duet-upload": true,
@@ -19079,6 +19127,8 @@ class DuetUpload {
       "multiple": [4],
       "limitSelection": [4, "limit-selection"],
       "value": [1025],
+      "externalUploadButtonId": [1, "external-upload-button-id"],
+      "captionOnBottom": [4, "caption-on-bottom"],
       "groups": [16],
       "tick": [32],
       "setFocus": [64],

package/lib/cjs/duet-action-button.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const createId = require('./create-id-c3b984b1.js');
 const jsUtils = require('./js-utils-134e0318.js');

package/lib/cjs/duet-alert.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const createId = require('./create-id-c3b984b1.js');
 const languageUtils = require('./language-utils-44df1d37.js');

package/lib/cjs/duet-badge.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const duetBadgeCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:4px !important;margin-bottom:2px !important;display:inline-block;width:auto;vertical-align:middle}:host:last-child,:host:last-of-type{margin-right:0 !important}:host(.duet-m-0){margin:0 !important}.duet-badge{width:100%;padding:4.4444444444px 12px 5.4444444444px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.75rem;font-style:normal;font-weight:600;line-height:1.25;color:rgb(0, 41, 77);text-align:center;word-break:break-word;vertical-align:middle;background:#e6f1f7;border-radius:20rem}.duet-badge.duet-p-0{padding:0 !important}.duet-badge.duet-m-0{margin:0 !important}.duet-badge.duet-theme-turva{padding:5.4444444444px 12px 4.4444444444px;font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-weight:700;color:rgb(23, 28, 58);background:#e8e8eb}.duet-badge.warning{background:#fef3df}.duet-badge.warning.duet-theme-turva{background:#fef1db}.duet-badge.danger{background:#fce9ef}.duet-badge.danger.duet-theme-turva{background:#fceae7}.duet-badge.success{background:#e6f3ef}.duet-badge.success.duet-theme-turva{background:#e6f3ed}";

package/lib/cjs/duet-breadcrumb.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const duetBreadcrumbCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%}.duet-breadcrumb{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;height:100%;font-size:0.875rem;font-weight:inherit;color:rgb(0, 41, 77);text-decoration:none}.duet-breadcrumb:hover{color:rgb(0, 77, 128)}.duet-breadcrumb.duet-theme-turva{color:rgb(23, 28, 58)}.duet-breadcrumb.duet-theme-turva:hover{color:rgb(148, 9, 37)}.duet-breadcrumb:focus{outline:0}.duet-breadcrumb:active{opacity:0.75}:host(.user-is-tabbing) .duet-breadcrumb:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179)}:host(.user-is-tabbing) .duet-breadcrumb.duet-theme-turva:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58)}.duet-breadcrumb.duet-breadcrumb-without-href:hover{color:rgb(0, 41, 77)}.duet-breadcrumb.duet-breadcrumb-without-href.duet-theme-turva:hover{color:rgb(23, 28, 58)}.duet-breadcrumb.duet-breadcrumb-without-href:active{opacity:1}";

package/lib/cjs/duet-breadcrumbs.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const languageUtils = require('./language-utils-44df1d37.js');
 require('./string-utils-5cadd058.js');

package/lib/cjs/duet-button_2.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const commonStrings = require('./common-strings-de17f887.js');
 const languageUtils = require('./language-utils-44df1d37.js');

package/lib/cjs/duet-caption_4.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const stringUtils = require('./string-utils-5cadd058.js');
 const tokenUtils = require('./token-utils-2e10264d.js');

package/lib/cjs/duet-card.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const createId = require('./create-id-c3b984b1.js');
 const keyboardUtils = require('./keyboard-utils-bb32119b.js');

package/lib/cjs/duet-checkbox.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const createId = require('./create-id-c3b984b1.js');

package/lib/cjs/duet-checkmark.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const duetCheckmarkCss = ".duet-checkmark-container{position:relative;width:20px;height:20px;margin-left:auto;border:1px solid rgb(144, 149, 153);border-radius:4px;transition:border 300ms ease}.duet-checkmark-container.center{margin-right:auto}.duet-theme-turva .duet-checkmark-container{border-color:rgb(116, 116, 117)}.checked .duet-checkmark-container{background:rgb(0, 119, 179);border-color:rgb(0, 119, 179);transition:none}.duet-theme-turva .checked .duet-checkmark-container{background:rgb(23, 28, 58);border-color:rgb(23, 28, 58) !important}.duet-checkmark-container.duet-checkmark-radio{border-radius:50%}[disabled]+label .duet-checkmark-container{border-color:rgb(207, 210, 212) !important}.duet-theme-turva [disabled]+label .duet-checkmark-container{border-color:rgb(207, 207, 209) !important}.checked [disabled]+label .duet-checkmark-container{background:rgb(207, 210, 212) !important}.duet-theme-turva .checked [disabled]+label .duet-checkmark-container{background:rgb(207, 207, 209) !important}.duet-checkmark{position:absolute;top:10px;left:3px;width:5.3333333333px;height:11.8518518519px;border-top:2px solid rgb(255, 255, 255);border-right:2px solid rgb(255, 255, 255);opacity:1;transform:scaleX(-1) rotate(135deg) translateZ(0);transform-origin:left top;animation-name:duet-checkmark;animation-duration:600ms;animation-timing-function:ease-out;animation-fill-mode:forwards}@keyframes duet-checkmark{0%{width:0;height:0;opacity:1}20%{width:5.3333333333px;height:0;opacity:1}40%,100%{width:5.3333333333px;height:11.8518518519px;opacity:1}}";

package/lib/cjs/duet-choice_2.cjs.entry.js CHANGED Viewed

@@ -5,11 +5,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const commonStrings = require('./common-strings-de17f887.js');
 const createId = require('./create-id-c3b984b1.js');
-const focusUtils = require('./focus-utils-37a486af.js');
+const focusUtils = require('./focus-utils-e3004898.js');
 const keyboardUtils = require('./keyboard-utils-bb32119b.js');
 const languageUtils = require('./language-utils-44df1d37.js');
 const watchOptions = require('./watch-options-d88afac0.js');

package/lib/cjs/duet-collapsible.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const actionArrowDownSmall = require('./action-arrow-down-small-ef77a2d1.js');
 const tokens = require('./tokens-21b244ee.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');

package/lib/cjs/duet-combobox.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const jsUtils = require('./js-utils-134e0318.js');
 const keyboardUtils = require('./keyboard-utils-bb32119b.js');

package/lib/cjs/duet-contact-card.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const languageUtils = require('./language-utils-44df1d37.js');
 require('./string-utils-5cadd058.js');

package/lib/cjs/duet-cookie-consent.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const duetCookieConsentCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:fixed;right:0;bottom:0;left:0;z-index:950;display:block;width:100%;box-shadow:0 2px 20px 0 rgba(0, 0, 0, 0.2)}@media (min-width: 48em){:host{right:28px;bottom:28px;left:auto;width:25rem}}:host(:focus){outline:0}:host(.user-is-tabbing:focus){border-radius:4px;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179)}:host(.user-is-tabbing.duet-theme-turva:focus){box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58)}.duet-cookie-consent{padding:20px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;color:rgb(255, 255, 255) !important;background-color:rgba(0, 21, 39, 0.9)}@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none){.duet-cookie-consent{background:rgba(0, 21, 39, 0.8);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}.duet-cookie-consent.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";background-color:rgba(12, 14, 29, 0.9)}@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none){.duet-cookie-consent.duet-theme-turva{background:rgba(12, 14, 29, 0.8)}}@media (min-width: 48em){.duet-cookie-consent{padding:20px;border-radius:4px}}.duet-cookie-consent-content{display:flex;align-items:center;max-width:1110px;margin:0 auto}.duet-cookie-consent-content .expand{flex:1}::slotted(a){font-weight:600;color:rgb(255, 255, 255) !important;text-decoration:underline;white-space:nowrap}::slotted(a[target=_blank]){padding-right:16px;background:url(\"data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjZmZmIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEwLjUgMmExLjUgMS41IDAgMDEuMTQgM0gzLjc1Yy0uMzggMC0uNy4yOC0uNzQuNjVsLS4wMS4xdjE0LjVjMCAuMzguMjguNy42NS43NGwuMS4wMWgxNC41Yy4zOCAwIC43LS4yOC43NC0uNjVsLjAxLS4xdi02Ljg5YTEuNSAxLjUgMCAwMTMgMHY2Ljg5QTMuNzUgMy43NSAwIDAxMTguMjUgMjRIMy43NUEzLjc1IDMuNzUgMCAwMTAgMjAuMjVWNS43NUEzLjc1IDMuNzUgMCAwMTMuNzUgMnptMTItMmMuNzggMCAxLjQyLjYgMS41IDEuMzZWNy41YTEuNSAxLjUgMCAwMS0zIC4xNFY1LjEybC01LjQ0IDUuNDRhMS41IDEuNSAwIDAxLTIuMjItMmwuMS0uMTJMMTguODggM0gxNi41QTEuNSAxLjUgMCAwMTE1IDEuNjRWMS41YzAtLjc4LjYtMS40MiAxLjM2LTEuNWguMTR6Ii8+PC9zdmc+\") no-repeat right 50%;background-size:12px 10px}::slotted(a:focus){outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179)}.duet-theme-turva ::slotted(a:focus){outline:0;box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58)}";

package/lib/cjs/duet-date-picker.cjs.entry.js CHANGED Viewed

@@ -5,10 +5,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const createId = require('./create-id-c3b984b1.js');
-const focusUtils = require('./focus-utils-37a486af.js');
+const focusUtils = require('./focus-utils-e3004898.js');
 const languageUtils = require('./language-utils-44df1d37.js');
 require('./string-utils-5cadd058.js');

package/lib/cjs/duet-divider_2.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-6f5a3a97.js');
+const index = require('./index-1d72531b.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const tokenUtils = require('./token-utils-2e10264d.js');
 require('./tokens.module-69170ddd.js');