wabtec-internal-volt-basic-components 1.0.0

package/dist/components/vds-upload-item.js

@@ -0,0 +1,95 @@
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { c as combineClasses } from './combine-classes.js';
+import { b as generateInformativeIcon, c as generateLabel } from './base-item.js';
+import { d as defineCustomElement$4 } from './vds-icon2.js';
+import { d as defineCustomElement$3 } from './vds-icon-button2.js';
+import { d as defineCustomElement$2 } from './vds-progress-circular2.js';
+
+const vdsUploadItemCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto+Flex:opsz,wght@8..144,100..1000&display=swap\");:root{font-family:\"Roboto Flex\", sans-serif, sans-serif;box-sizing:border-box}:root body{--color-background-disabled:rgba(33, 49, 66, 0.3215686275);--color-background-brand-default:#007DBA;--color-background-brand-hover:#056CA0;--color-background-brand-press:#095B87;--color-background-caution-default:#D0A60B;--color-background-caution-lowest-default:#FFF9E5;--color-background-caution-lowest-hover:#FEF3CC;--color-background-caution-lowest-press:#FEE899;--color-background-danger-default:#F34336;--color-background-danger-high-default:#F34336;--color-background-danger-high-hover:#C83E38;--color-background-danger-high-press:#9D3A3A;--color-background-danger-lowest-default:#FEECEB;--color-background-danger-lowest-hover:#FCD9D6;--color-background-danger-lowest-press:#FAB3AE;--color-background-general-default:#8F9295;--color-background-general-lowest-default:#f7f7f7;--color-background-general-lowest-hover:#EEEEEE;--color-background-general-lowest-press:#DEDEDE;--color-background-healthy-default:#7FAE1B;--color-background-healthy-lowest-default:#F2F7E8;--color-background-healthy-lowest-hover:#E5EED1;--color-background-healthy-lowest-press:#CBDEA3;--color-background-information-default:#056CA0;--color-background-information-lowest-default:#E6F2F8;--color-background-information-lowest-hover:#CCE5F1;--color-background-information-lowest-press:#99CBE3;--color-background-neutral-default:#E8E9EB;--color-background-neutral-hover:#CFD3D7;--color-background-neutral-press:#C4C8CE;--color-background-neutral-lowest-default:#F9FAFA;--color-background-neutral-lowest-hover:#E8E9EB;--color-background-neutral-lowest-press:#CFD3D7;--color-background-warning-default:#D17739;--color-background-warning-lowest-default:#FFF3EB;--color-background-warning-lowest-hover:#FFE7D7;--color-background-warning-lowest-press:#FFD0B0;--color-border-high:#041821;--color-border-medium:rgba(4, 24, 33, 0.6392156863);--color-border-low:rgba(4, 24, 33, 0.3215686275);--color-border-lower:rgba(4, 24, 33, 0.1607843137);--color-border-lowest:rgba(4, 24, 33, 0.0784313725);--color-border-brand:#007DBA;--color-border-brand-hover:#CCE5F1;--color-border-disabled:rgba(33, 49, 66, 0.3215686275);--color-border-danger:#C83E38;--color-border-healthy:#6B9321;--color-border-caution:#D0A60B;--color-border-warning:#D17739;--color-border-information:#056CA0;--color-border-general:#8F9295;--color-border-focus-1:#ffffff;--color-border-focus-2:#133953;--color-border-white-high:#ffffff;--color-border-white-medium:rgba(255, 255, 255, 0.6392156863);--color-border-white-low:rgba(255, 255, 255, 0.3215686275);--color-border-white-lower:rgba(255, 255, 255, 0.1607843137);--color-border-white-lowest:rgba(255, 255, 255, 0.1215686275);--color-icon-high:#041821;--color-icon-medium:rgba(4, 24, 33, 0.6392156863);--color-icon-low:rgba(4, 24, 33, 0.3215686275);--color-icon-disabled:rgba(33, 49, 66, 0.3215686275);--color-icon-healthy:#6B9321;--color-icon-caution:#D0A60B;--color-icon-warning:#D17739;--color-icon-danger:#C83E38;--color-icon-information:#056CA0;--color-icon-general:#8F9295;--color-icon-brand-default:#007DBA;--color-icon-brand-hover:#056CA0;--color-icon-brand-press:#095B87;--color-icon-white-high:#ffffff;--color-icon-white-medium:rgba(255, 255, 255, 0.6392156863);--color-icon-white-low:rgba(255, 255, 255, 0.3215686275);--color-interaction-black-medium:rgba(16, 25, 36, 0.6392156863);--color-interaction-black-low:rgba(16, 25, 36, 0.3215686275);--color-interaction-black-lower:rgba(16, 25, 36, 0.1607843137);--color-interaction-black-lowest:rgba(16, 25, 36, 0.1215686275);--color-interaction-brand-medium:rgba(0, 125, 186, 0.6392156863);--color-interaction-brand-low:rgba(0, 122, 184, 0.3215686275);--color-interaction-brand-lower:rgba(0, 125, 186, 0.1607843137);--color-interaction-brand-lowest:rgba(0, 125, 186, 0.1215686275);--color-interaction-danger-medium:rgba(200, 62, 56, 0.6392156863);--color-interaction-danger-low:rgba(200, 62, 56, 0.3215686275);--color-interaction-danger-lower:rgba(200, 62, 56, 0.1607843137);--color-interaction-danger-lowest:rgba(200, 62, 56, 0.1215686275);--color-interaction-white-medium:rgba(255, 255, 255, 0.6392156863);--color-interaction-white-low:rgba(255, 255, 255, 0.3215686275);--color-interaction-white-lower:rgba(255, 255, 255, 0.1607843137);--color-interaction-white-lowest:rgba(255, 255, 255, 0.1215686275);--color-interaction-backdrop:rgba(0, 0, 0, 0.3215686275);--color-link-default:#007DBA;--color-link-hover:#056CA0;--color-link-press:#095B87;--color-text-high:#041821;--color-text-medium:rgba(4, 24, 33, 0.6392156863);--color-text-low:rgba(4, 24, 33, 0.3215686275);--color-text-disabled:rgba(33, 49, 66, 0.3215686275);--color-text-brand:#007DBA;--color-text-caution-high:#46482E;--color-text-caution-medium:#D0A60B;--color-text-danger-high:#47323D;--color-text-danger-medium:#C83E38;--color-text-general-high:#364351;--color-text-general-medium:#8F9295;--color-text-healthy-high:#2C4333;--color-text-healthy-medium:#6B9321;--color-text-information-high:#133953;--color-text-information-medium:#056CA0;--color-text-warning-high:#463C3A;--color-text-warning-medium:#D17739;--color-text-white-high:#ffffff;--color-text-white-medium:rgba(255, 255, 255, 0.6392156863);--color-text-white-low:rgba(255, 255, 255, 0.3215686275);--surface-higher:#ffffff;--surface-high:#ffffff;--surface-medium:#ffffff;--surface-low:#FBFBFB;--surface-lower:#F2F3F5;--surface-neutral-default:#ffffff;--surface-neutral-hover:#E8E9EB;--surface-neutral-press:#CFD3D7;--surface-overlay-default:#213142;--surface-overlay-hover:#334152;--surface-overlay-press:#6F7986;--surface-elevation-01:0px 0px 3px 0px rgba(29, 46, 64, 0.1), 0px 3px 3px 0px rgba(29, 46, 64, 0.1);--surface-elevation-02:0px 0px 6px 0px rgba(29, 46, 64, 0.1), 0px 6px 6px 0px rgba(29, 46, 64, 0.1);--surface-elevation-03:0px 0px 12px 0px rgba(29, 46, 64, 0.1), 0px 12px 12px 0px rgba(29, 46, 64, 0.1);--surface-elevation-04:0px 0px 24px 0px rgba(29, 46, 64, 0.1), 0px 24px 24px 0px rgba(29, 46, 64, 0.1);--box-shadow-color-01:rgba(0, 0, 0, 0.12);--box-shadow-color-02:rgba(0, 0, 0, 0.14);--size-56:3.5rem;--size-44:2.75rem;--size-36:2.25rem;--size-32:2rem;--size-28:1.75rem;--size-24:1.5rem;--size-20:1.25rem;--size-16:1rem;--size-14:0.875rem;--size-12:0.75rem;--size-10:0.625rem;--font-light:300;--font-semibold:600;--font-bold:800;--height-64:4rem;--height-52:3.25rem;--height-44:2.75rem;--height-40:2.5rem;--height-36:2.25rem;--height-32:2rem;--height-28:1.75rem;--height-24:1.5rem;--height-20:1.25rem;--height-16:1rem;--height-12:0.75rem}:root .theme-light{--color-background-disabled:rgba(33, 49, 66, 0.3215686275);--color-background-brand-default:#007DBA;--color-background-brand-hover:#056CA0;--color-background-brand-press:#095B87;--color-background-caution-default:#D0A60B;--color-background-caution-lowest-default:#FFF9E5;--color-background-caution-lowest-hover:#FEF3CC;--color-background-caution-lowest-press:#FEE899;--color-background-danger-default:#F34336;--color-background-danger-high-default:#F34336;--color-background-danger-high-hover:#C83E38;--color-background-danger-high-press:#9D3A3A;--color-background-danger-lowest-default:#FEECEB;--color-background-danger-lowest-hover:#FCD9D6;--color-background-danger-lowest-press:#FAB3AE;--color-background-general-default:#8F9295;--color-background-general-lowest-default:#f7f7f7;--color-background-general-lowest-hover:#EEEEEE;--color-background-general-lowest-press:#DEDEDE;--color-background-healthy-default:#7FAE1B;--color-background-healthy-lowest-default:#F2F7E8;--color-background-healthy-lowest-hover:#E5EED1;--color-background-healthy-lowest-press:#CBDEA3;--color-background-information-default:#056CA0;--color-background-information-lowest-default:#E6F2F8;--color-background-information-lowest-hover:#CCE5F1;--color-background-information-lowest-press:#99CBE3;--color-background-neutral-default:#E8E9EB;--color-background-neutral-hover:#CFD3D7;--color-background-neutral-press:#C4C8CE;--color-background-neutral-lowest-default:#F9FAFA;--color-background-neutral-lowest-hover:#E8E9EB;--color-background-neutral-lowest-press:#CFD3D7;--color-background-warning-default:#D17739;--color-background-warning-lowest-default:#FFF3EB;--color-background-warning-lowest-hover:#FFE7D7;--color-background-warning-lowest-press:#FFD0B0;--color-border-high:#041821;--color-border-medium:rgba(4, 24, 33, 0.6392156863);--color-border-low:rgba(4, 24, 33, 0.3215686275);--color-border-lower:rgba(4, 24, 33, 0.1607843137);--color-border-lowest:rgba(4, 24, 33, 0.0784313725);--color-border-brand:#007DBA;--color-border-brand-hover:#CCE5F1;--color-border-disabled:rgba(33, 49, 66, 0.3215686275);--color-border-danger:#C83E38;--color-border-healthy:#6B9321;--color-border-caution:#D0A60B;--color-border-warning:#D17739;--color-border-information:#056CA0;--color-border-general:#8F9295;--color-border-focus-1:#ffffff;--color-border-focus-2:#133953;--color-border-white-high:#ffffff;--color-border-white-medium:rgba(255, 255, 255, 0.6392156863);--color-border-white-low:rgba(255, 255, 255, 0.3215686275);--color-border-white-lower:rgba(255, 255, 255, 0.1607843137);--color-border-white-lowest:rgba(255, 255, 255, 0.1215686275);--color-icon-high:#041821;--color-icon-medium:rgba(4, 24, 33, 0.6392156863);--color-icon-low:rgba(4, 24, 33, 0.3215686275);--color-icon-disabled:rgba(33, 49, 66, 0.3215686275);--color-icon-healthy:#6B9321;--color-icon-caution:#D0A60B;--color-icon-warning:#D17739;--color-icon-danger:#C83E38;--color-icon-information:#056CA0;--color-icon-general:#8F9295;--color-icon-brand-default:#007DBA;--color-icon-brand-hover:#056CA0;--color-icon-brand-press:#095B87;--color-icon-white-high:#ffffff;--color-icon-white-medium:rgba(255, 255, 255, 0.6392156863);--color-icon-white-low:rgba(255, 255, 255, 0.3215686275);--color-interaction-black-medium:rgba(16, 25, 36, 0.6392156863);--color-interaction-black-low:rgba(16, 25, 36, 0.3215686275);--color-interaction-black-lower:rgba(16, 25, 36, 0.1607843137);--color-interaction-black-lowest:rgba(16, 25, 36, 0.1215686275);--color-interaction-brand-medium:rgba(0, 125, 186, 0.6392156863);--color-interaction-brand-low:rgba(0, 122, 184, 0.3215686275);--color-interaction-brand-lower:rgba(0, 125, 186, 0.1607843137);--color-interaction-brand-lowest:rgba(0, 125, 186, 0.1215686275);--color-interaction-danger-medium:rgba(200, 62, 56, 0.6392156863);--color-interaction-danger-low:rgba(200, 62, 56, 0.3215686275);--color-interaction-danger-lower:rgba(200, 62, 56, 0.1607843137);--color-interaction-danger-lowest:rgba(200, 62, 56, 0.1215686275);--color-interaction-white-medium:rgba(255, 255, 255, 0.6392156863);--color-interaction-white-low:rgba(255, 255, 255, 0.3215686275);--color-interaction-white-lower:rgba(255, 255, 255, 0.1607843137);--color-interaction-white-lowest:rgba(255, 255, 255, 0.1215686275);--color-interaction-backdrop:rgba(0, 0, 0, 0.3215686275);--color-link-default:#007DBA;--color-link-hover:#056CA0;--color-link-press:#095B87;--color-text-high:#041821;--color-text-medium:rgba(4, 24, 33, 0.6392156863);--color-text-low:rgba(4, 24, 33, 0.3215686275);--color-text-disabled:rgba(33, 49, 66, 0.3215686275);--color-text-brand:#007DBA;--color-text-caution-high:#46482E;--color-text-caution-medium:#D0A60B;--color-text-danger-high:#47323D;--color-text-danger-medium:#C83E38;--color-text-general-high:#364351;--color-text-general-medium:#8F9295;--color-text-healthy-high:#2C4333;--color-text-healthy-medium:#6B9321;--color-text-information-high:#133953;--color-text-information-medium:#056CA0;--color-text-warning-high:#463C3A;--color-text-warning-medium:#D17739;--color-text-white-high:#ffffff;--color-text-white-medium:rgba(255, 255, 255, 0.6392156863);--color-text-white-low:rgba(255, 255, 255, 0.3215686275);--surface-higher:#ffffff;--surface-high:#ffffff;--surface-medium:#ffffff;--surface-low:#FBFBFB;--surface-lower:#F2F3F5;--surface-neutral-default:#ffffff;--surface-neutral-hover:#E8E9EB;--surface-neutral-press:#CFD3D7;--surface-overlay-default:#213142;--surface-overlay-hover:#334152;--surface-overlay-press:#6F7986;--surface-elevation-01:0px 0px 3px 0px rgba(29, 46, 64, 0.1), 0px 3px 3px 0px rgba(29, 46, 64, 0.1);--surface-elevation-02:0px 0px 6px 0px rgba(29, 46, 64, 0.1), 0px 6px 6px 0px rgba(29, 46, 64, 0.1);--surface-elevation-03:0px 0px 12px 0px rgba(29, 46, 64, 0.1), 0px 12px 12px 0px rgba(29, 46, 64, 0.1);--surface-elevation-04:0px 0px 24px 0px rgba(29, 46, 64, 0.1), 0px 24px 24px 0px rgba(29, 46, 64, 0.1);--box-shadow-color-01:rgba(0, 0, 0, 0.12);--box-shadow-color-02:rgba(0, 0, 0, 0.14);--size-56:3.5rem;--size-44:2.75rem;--size-36:2.25rem;--size-32:2rem;--size-28:1.75rem;--size-24:1.5rem;--size-20:1.25rem;--size-16:1rem;--size-14:0.875rem;--size-12:0.75rem;--size-10:0.625rem;--font-light:300;--font-semibold:600;--font-bold:800;--height-64:4rem;--height-52:3.25rem;--height-44:2.75rem;--height-40:2.5rem;--height-36:2.25rem;--height-32:2rem;--height-28:1.75rem;--height-24:1.5rem;--height-20:1.25rem;--height-16:1rem;--height-12:0.75rem}:root .theme-dark{--color-background-disabled:rgba(161, 167, 176, 0.3215686275);--color-background-brand-default:#056CA0;--color-background-brand-hover:#095B87;--color-background-brand-press:#0E4A6C;--color-background-caution-default:#FED133;--color-background-caution-lowest-default:#2F3834;--color-background-caution-lowest-hover:#46482E;--color-background-caution-lowest-press:#746722;--color-background-danger-default:#C83E38;--color-background-danger-high-default:#C83E38;--color-background-danger-high-hover:#9D3A3A;--color-background-danger-high-press:#72363B;--color-background-danger-lowest-default:#72363B;--color-background-danger-lowest-hover:#47323D;--color-background-danger-lowest-press:#2E2B3A;--color-background-general-default:#BDBDBD;--color-background-general-lowest-default:#273646;--color-background-general-lowest-hover:#364351;--color-background-general-lowest-press:#535D67;--color-background-healthy-default:#B2CE76;--color-background-healthy-lowest-default:#223637;--color-background-healthy-lowest-hover:#2C4333;--color-background-healthy-lowest-press:#415E2D;--color-background-information-default:#3397C7;--color-background-information-lowest-default:#153147;--color-background-information-lowest-hover:#133953;--color-background-information-lowest-press:#0E4A6C;--color-background-neutral-default:#101924;--color-background-neutral-hover:#213142;--color-background-neutral-press:#334152;--color-background-neutral-lowest-default:#0B121A;--color-background-neutral-lowest-hover:#101924;--color-background-neutral-lowest-press:#213142;--color-background-warning-default:#FFA261;--color-background-warning-lowest-default:#2F323A;--color-background-warning-lowest-hover:#463C3A;--color-background-warning-lowest-press:#745039;--color-border-high:#ffffff;--color-border-medium:rgba(255, 255, 255, 0.6392156863);--color-border-low:rgba(255, 255, 255, 0.3215686275);--color-border-lower:rgba(255, 255, 255, 0.1607843137);--color-border-lowest:rgba(255, 255, 255, 0.1215686275);--color-border-brand:#66B1D5;--color-border-brand-hover:#133953;--color-border-disabled:rgba(161, 167, 176, 0.3215686275);--color-border-danger:#F78E86;--color-border-healthy:#98BE48;--color-border-warning:#FFA261;--color-border-caution:#FED133;--color-border-information:#66B1D5;--color-border-general:#CDCDCD;--color-border-focus-1:#041821;--color-border-focus-2:#CCE5F1;--color-border-white-high:#041821;--color-border-white-medium:rgba(4, 24, 33, 0.6392156863);--color-border-white-low:rgba(4, 24, 33, 0.3215686275);--color-border-white-lower:rgba(4, 24, 33, 0.1607843137);--color-border-white-lowest:rgba(4, 24, 33, 0.0784313725);--color-icon-high:#ffffff;--color-icon-medium:rgba(255, 255, 255, 0.6392156863);--color-icon-low:rgba(255, 255, 255, 0.3215686275);--color-icon-disabled:rgba(161, 167, 176, 0.3215686275);--color-icon-healthy:#98BE48;--color-icon-caution:#FED133;--color-icon-warning:#FFA261;--color-icon-danger:#F78E86;--color-icon-information:#66B1D5;--color-icon-general:#CDCDCD;--color-icon-brand-default:#66B1D5;--color-icon-brand-hover:#99CBE3;--color-icon-brand-press:#CCE5F1;--color-icon-white-high:#041821;--color-icon-white-medium:rgba(4, 24, 33, 0.6392156863);--color-icon-white-low:rgba(4, 24, 33, 0.3215686275);--color-interaction-black-medium:rgba(255, 255, 255, 0.6392156863);--color-interaction-black-low:rgba(255, 255, 255, 0.3215686275);--color-interaction-black-lower:rgba(255, 255, 255, 0.1607843137);--color-interaction-black-lowest:rgba(255, 255, 255, 0.1215686275);--color-interaction-brand-medium:rgba(102, 177, 213, 0.6392156863);--color-interaction-brand-low:rgba(102, 177, 213, 0.3215686275);--color-interaction-brand-lower:rgba(102, 177, 213, 0.1607843137);--color-interaction-brand-lowest:rgba(102, 177, 213, 0.1215686275);--color-interaction-danger-medium:rgba(245, 104, 94, 0.6392156863);--color-interaction-danger-low:rgba(245, 104, 94, 0.3215686275);--color-interaction-danger-lower:rgba(245, 104, 94, 0.1607843137);--color-interaction-danger-lowest:rgba(245, 104, 94, 0.1215686275);--color-interaction-white-medium:rgba(16, 25, 36, 0.6392156863);--color-interaction-white-low:rgba(16, 25, 36, 0.3215686275);--color-interaction-white-lower:rgba(16, 25, 36, 0.1607843137);--color-interaction-white-lowest:rgba(16, 25, 36, 0.1215686275);--color-interaction-backdrop:rgba(0, 0, 0, 0.6392156863);--color-link-default:#66B1D5;--color-link-hover:#99CBE3;--color-link-press:#CCE5F1;--color-text-high:#ffffff;--color-text-medium:rgba(255, 255, 255, 0.6392156863);--color-text-low:rgba(255, 255, 255, 0.3215686275);--color-text-disabled:rgba(161, 167, 176, 0.6392156863);--color-text-brand:#007DBA;--color-text-caution-high:#FEE899;--color-text-caution-medium:#FEDC66;--color-text-danger-high:#FAB3AE;--color-text-danger-medium:#F78E86;--color-text-general-high:#DEDEDE;--color-text-general-medium:#CDCDCD;--color-text-healthy-high:#CBDEA3;--color-text-healthy-medium:#B2CE76;--color-text-information-high:#99CBE3;--color-text-information-medium:#66B1D5;--color-text-warning-high:#FFD0B0;--color-text-warning-medium:#FFB988;--color-text-white-high:#041821;--color-text-white-medium:rgba(4, 24, 33, 0.6392156863);--color-text-white-low:rgba(4, 24, 33, 0.3215686275);--surface-higher:#192938;--surface-high:#162431;--surface-medium:#0E0E0E;--surface-low:#000000;--surface-lower:#0E0E0E;--surface-neutral-default:#101924;--surface-neutral-hover:#213142;--surface-neutral-press:#6F7986;--surface-overlay-default:#ffffff;--surface-overlay-hover:#E8E9EB;--surface-overlay-press:#CFD3D7;--surface-elevation-01:0px 0px 3px 0px rgba(0, 0, 0, 0.3), 0px 3px 3px 0px rgba(0, 0, 0, 0.3);--surface-elevation-02:0px 0px 6px 0px rgba(0, 0, 0, 0.3), 0px 6px 6px 0px rgba(0, 0, 0, 0.3);--surface-elevation-03:0px 0px 12px 0px rgba(0, 0, 0, 0.3), 0px 12px 12px 0px rgba(0, 0, 0, 0.3);--surface-elevation-04:0px 0px 24px 0px rgba(0, 0, 0, 0.3), 0px 24px 24px 0px rgba(0, 0, 0, 0.3);--box-shadow-color-01:rgba(0, 0, 0, 0.24);--box-shadow-color-02:rgba(0, 0, 0, 0.28);--size-56:3.5rem;--size-44:2.75rem;--size-36:2.25rem;--size-32:2rem;--size-28:1.75rem;--size-24:1.5rem;--size-20:1.25rem;--size-16:1rem;--size-14:0.875rem;--size-12:0.75rem;--size-10:0.625rem;--font-light:300;--font-semibold:600;--font-bold:800;--height-64:4rem;--height-52:3.25rem;--height-44:2.75rem;--height-40:2.5rem;--height-36:2.25rem;--height-32:2rem;--height-28:1.75rem;--height-24:1.5rem;--height-20:1.25rem;--height-16:1rem;--height-12:0.75rem}:root body{--spacing-00:0rem;--spacing-01:0.125rem;--spacing-02:0.25rem;--spacing-03:0.5rem;--spacing-04:0.75rem;--spacing-05:1rem;--spacing-06:1.25rem;--spacing-07:1.5rem;--spacing-08:1.75rem;--spacing-09:2rem;--spacing-10:2.25rem;--spacing-11:2.5rem;--spacing-12:2.75rem;--spacing-13:3rem;--spacing-14:3.25rem;--spacing-15:3.5rem;--spacing-16:3.75rem;--spacing-17:4rem;--spacing-18:4.25rem;--spacing-19:4.5rem;--spacing-20:4.75rem;--opacity-64:0.64;--opacity-32:0.32;--opacity-16:0.16;--opacity-08:0.08;--radius-sharp:var(--spacing-00);--radius-medium:var(--spacing-02);--radius-large:var(--spacing-03);--radius-pill:var(--spacing-16);--radius-circle:50%;--static-brand-0:#ffffff;--static-brand-50:#E6F2F8;--static-brand-100:#CCE5F1;--static-brand-200:#99CBE3;--static-brand-300:#66B1D5;--static-brand-400:#3397C7;--static-brand-500:#007DBA;--static-brand-main:#007DBA;--static-brand-600:#056CA0;--static-brand-700:#095B87;--static-brand-800:#0E4A6C;--static-brand-900:#133953;--static-brand-950:#153147;--static-brand-1000:#041821;--static-brand-1000-medium:rgba(4, 24, 33, 0.6392156863);--static-brand-1000-low:rgba(4, 24, 33, 0.3215686275);--static-brand-1000-lower:rgba(4, 24, 33, 0.1607843137);--static-brand-1000-lowest:rgba(4, 24, 33, 0.0784313725);--static-green-0:#ffffff;--static-green-50:#F2F7E8;--static-green-100:#E5EED1;--static-green-200:#CBDEA3;--static-green-300:#B2CE76;--static-green-400:#98BE48;--static-green-500:#7FAE1B;--static-green-main:#7FAE1B;--static-green-600:#6B9321;--static-green-700:#557827;--static-green-800:#415E2D;--static-green-900:#2C4333;--static-green-950:#223637;--static-yellow-0:#ffffff;--static-yellow-50:#FFF9E5;--static-yellow-100:#FEF3CC;--static-yellow-200:#FEE899;--static-yellow-300:#FEDC66;--static-yellow-400:#FED133;--static-yellow-500:#FEC600;--static-yellow-main:#FEC600;--static-yellow-600:#D0A60B;--static-yellow-700:#A18717;--static-yellow-800:#746722;--static-yellow-900:#46482E;--static-yellow-950:#2F3834;--static-red-0:#ffffff;--static-red-50:#FEECEB;--static-red-100:#FCD9D6;--static-red-200:#FAB3AE;--static-red-300:#F78E86;--static-red-400:#F5685E;--static-red-500:#F34336;--static-red-main:#F34336;--static-red-600:#C83E38;--static-red-700:#9D3A3A;--static-red-800:#72363B;--static-red-900:#47323D;--static-red-950:#2E2B3A;--static-grey-0:#ffffff;--static-grey-50:#f7f7f7;--static-grey-100:#EEEEEE;--static-grey-200:#DEDEDE;--static-grey-300:#CDCDCD;--static-grey-400:#BDBDBD;--static-grey-500:#ADADAD;--static-grey-main:#ADADAD;--static-grey-600:#8F9295;--static-grey-700:#71787F;--static-grey-800:#535D67;--static-grey-900:#364351;--static-grey-950:#273646;--static-orange-0:#ffffff;--static-orange-50:#FFF3EB;--static-orange-100:#FFE7D7;--static-orange-200:#FFD0B0;--static-orange-300:#FFB988;--static-orange-400:#FFA261;--static-orange-500:#FF8B3A;--static-orange-main:#FF8B3A;--static-orange-600:#D17739;--static-orange-700:#A2633A;--static-orange-800:#745039;--static-orange-900:#463C3A;--static-orange-950:#2F323A;--static-dataviz-cat-sea-green:#0FB5AE;--static-dataviz-cat-palatinate-blue:#4046CA;--static-dataviz-cat-tangerine:#F68511;--static-dataviz-cat-magenta:#DE3D82;--static-dataviz-cat-tropical-indigo:#7E84FA;--static-dataviz-cat-malachite:#72E06A;--static-dataviz-cat-azure:#147AF3;--static-dataviz-cat-violet:#7326D3;--static-dataviz-cat-yellow:#E8C600;--static-dataviz-cat-alloy-orange:#CB5D00;--static-dataviz-cat-green:#008F5D;--static-dataviz-cat-lime:#BCE931;--static-dataviz-seq-viridis-50:#FDE725;--static-dataviz-seq-viridis-100:#D2E21B;--static-dataviz-seq-viridis-150:#A5DB36;--static-dataviz-seq-viridis-200:#7AD151;--static-dataviz-seq-viridis-250:#54C568;--static-dataviz-seq-viridis-300:#35B779;--static-dataviz-seq-viridis-350:#22A884;--static-dataviz-seq-viridis-400:#1F988B;--static-dataviz-seq-viridis-450:#23888E;--static-dataviz-seq-viridis-500:#2A788E;--static-dataviz-seq-viridis-550:#31688E;--static-dataviz-seq-viridis-600:#39568C;--static-dataviz-seq-viridis-650:#414487;--static-dataviz-seq-viridis-700:#472F7D;--static-dataviz-seq-viridis-750:#481A6C;--static-dataviz-seq-viridis-800:#440154;--static-dataviz-seq-magma-50:#FCFDBF;--static-dataviz-seq-magma-100:#FDDEA0;--static-dataviz-seq-magma-150:#FEBF84;--static-dataviz-seq-magma-200:#FE9F6D;--static-dataviz-seq-magma-250:#FA7F5E;--static-dataviz-seq-magma-300:#F1605D;--static-dataviz-seq-magma-350:#DE4968;--static-dataviz-seq-magma-400:#C43C75;--static-dataviz-seq-magma-450:#A8327D;--static-dataviz-seq-magma-500:#8C2981;--static-dataviz-seq-magma-550:#721F81;--static-dataviz-seq-magma-600:#57157E;--static-dataviz-seq-magma-650:#3B0F70;--static-dataviz-seq-magma-700:#20114B;--static-dataviz-seq-magma-750:#0B0924;--static-dataviz-seq-magma-800:#000004;--static-dataviz-seq-rose-50:#FFF4DE;--static-dataviz-seq-rose-100:#FFDDD8;--static-dataviz-seq-rose-150:#FFC6D2;--static-dataviz-seq-rose-200:#FCAFCB;--static-dataviz-seq-rose-250:#F898C4;--static-dataviz-seq-rose-300:#F380BC;--static-dataviz-seq-rose-350:#ED67B4;--static-dataviz-seq-rose-400:#E64BAC;--static-dataviz-seq-rose-450:#D03EA0;--static-dataviz-seq-rose-500:#B93495;--static-dataviz-seq-rose-550:#A12A8B;--static-dataviz-seq-rose-600:#892282;--static-dataviz-seq-rose-650:#701C7A;--static-dataviz-seq-rose-700:#551672;--static-dataviz-seq-rose-750:#37126C;--static-dataviz-seq-rose-800:#001066;--static-dataviz-seq-forest-50:#FFFFE0;--static-dataviz-seq-forest-100:#E2F5BD;--static-dataviz-seq-forest-150:#C5EA99;--static-dataviz-seq-forest-200:#A6DF73;--static-dataviz-seq-forest-250:#8FD16C;--static-dataviz-seq-forest-300:#79C365;--static-dataviz-seq-forest-350:#62B55E;--static-dataviz-seq-forest-400:#4CA658;--static-dataviz-seq-forest-450:#3B9752;--static-dataviz-seq-forest-500:#31884F;--static-dataviz-seq-forest-550:#28794C;--static-dataviz-seq-forest-600:#1E6A48;--static-dataviz-seq-forest-650:#155B45;--static-dataviz-seq-forest-700:#0E4D41;--static-dataviz-seq-forest-750:#073F3E;--static-dataviz-seq-forest-800:#00313A;--static-dataviz-seq-cerulean-50:#EAFFF1;--static-dataviz-seq-cerulean-100:#C9F1E4;--static-dataviz-seq-cerulean-150:#A7E3D7;--static-dataviz-seq-cerulean-200:#85D5CA;--static-dataviz-seq-cerulean-250:#6CC5C0;--static-dataviz-seq-cerulean-300:#58B4B9;--static-dataviz-seq-cerulean-350:#44A2B1;--static-dataviz-seq-cerulean-400:#3091AA;--static-dataviz-seq-cerulean-450:#2880A0;--static-dataviz-seq-cerulean-500:#246E96;--static-dataviz-seq-cerulean-550:#215D8B;--static-dataviz-seq-cerulean-600:#1D4C81;--static-dataviz-seq-cerulean-650:#1C3B77;--static-dataviz-seq-cerulean-700:#1B296D;--static-dataviz-seq-cerulean-750:#1A1662;--static-dataviz-seq-cerulean-800:#180055;--static-dataviz-div-orange-yellow-seafoam-0:#580000;--static-dataviz-div-orange-yellow-seafoam-50:#79260B;--static-dataviz-div-orange-yellow-seafoam-100:#9C4511;--static-dataviz-div-orange-yellow-seafoam-150:#BD651A;--static-dataviz-div-orange-yellow-seafoam-200:#DD8629;--static-dataviz-div-orange-yellow-seafoam-250:#F5AD52;--static-dataviz-div-orange-yellow-seafoam-300:#FED693;--static-dataviz-div-orange-yellow-seafoam-350:#FFFFE0;--static-dataviz-div-orange-yellow-seafoam-400:#BBE4D1;--static-dataviz-div-orange-yellow-seafoam-450:#76C7BE;--static-dataviz-div-orange-yellow-seafoam-500:#3EA8A6;--static-dataviz-div-orange-yellow-seafoam-550:#208288;--static-dataviz-div-orange-yellow-seafoam-600:#076769;--static-dataviz-div-orange-yellow-seafoam-650:#00494B;--static-dataviz-div-orange-yellow-seafoam-700:#002C2D;--static-dataviz-div-red-yellow-blue-0:#4A001E;--static-dataviz-div-red-yellow-blue-50:#751232;--static-dataviz-div-red-yellow-blue-100:#A52747;--static-dataviz-div-red-yellow-blue-150:#C65154;--static-dataviz-div-red-yellow-blue-200:#E47961;--static-dataviz-div-red-yellow-blue-250:#F0A882;--static-dataviz-div-red-yellow-blue-300:#FAD4AC;--static-dataviz-div-red-yellow-blue-350:#FFFFE0;--static-dataviz-div-red-yellow-blue-400:#BCE2CF;--static-dataviz-div-red-yellow-blue-450:#89C0C4;--static-dataviz-div-red-yellow-blue-500:#579EB9;--static-dataviz-div-red-yellow-blue-550:#397AA8;--static-dataviz-div-red-yellow-blue-600:#1C5796;--static-dataviz-div-red-yellow-blue-650:#163771;--static-dataviz-div-red-yellow-blue-700:#10194D;--static-dataviz-div-red-blue-0:#4A001E;--static-dataviz-div-red-blue-50:#731331;--static-dataviz-div-red-blue-100:#9F2945;--static-dataviz-div-red-blue-150:#CC415A;--static-dataviz-div-red-blue-200:#E06E85;--static-dataviz-div-red-blue-250:#ED9AB0;--static-dataviz-div-red-blue-300:#F8C3D9;--static-dataviz-div-red-blue-350:#FAF0FF;--static-dataviz-div-red-blue-400:#C6D0F2;--static-dataviz-div-red-blue-450:#92B2DE;--static-dataviz-div-red-blue-500:#5D94CB;--static-dataviz-div-red-blue-550:#2F74B3;--static-dataviz-div-red-blue-600:#265191;--static-dataviz-div-red-blue-650:#163670;--static-dataviz-div-red-blue-700:#0B194C;--static-white:#ffffff;--static-black:#000000;--elevation-shadow-0:none;--elevation-shadow-1:0 0 2px var(--box-shadow-color-01), 0 1px 2px var(--box-shadow-color-02);--elevation-shadow-2:0 0 2px var(--box-shadow-color-01), 0 2px 4px var(--box-shadow-color-02);--elevation-shadow-3:0 0 2px var(--box-shadow-color-01), 0 4px 8px var(--box-shadow-color-02);--elevation-shadow-5:0 0 2px var(--box-shadow-color-01), 0 8px 16px var(--box-shadow-color-02);--elevation-shadow-8:0 0 8px var(--box-shadow-color-01), 0 14px 28px var(--box-shadow-color-02);--elevation-shadow-17:0 0 8px var(--box-shadow-color-01), 0 32px 64px var(--box-shadow-color-02);--elevation-layer-0:0;--elevation-layer-1:1;--elevation-layer-2:3;--elevation-layer-3:6;--elevation-layer-4:8;--elevation-layer-5:12;--border-thickness-01:0.0625rem;--border-thickness-02:0.078125rem;--border-thickness-03:0.09375rem;--border-thickness-04:0.109375rem;--border-thickness-05:0.125rem;--border-thickness-06:0.140625rem;--border-thickness-07:0.15625rem;--border-thickness-08:0.171875rem;--border-thickness-09:0.1875rem}:root body .vds-font-display-large{font-size:3.5rem;font-weight:300;line-height:4rem;letter-spacing:normal}:root body .vds-font-display-medium{font-size:2.75rem;font-weight:300;line-height:3.25rem;letter-spacing:normal}:root body .vds-font-display-small{font-size:2.25rem;font-weight:300;line-height:2.75rem;letter-spacing:normal}:root body .vds-font-headline-large{font-size:2rem;font-weight:600;line-height:2.5rem;letter-spacing:normal}:root body .vds-font-headline-medium{font-size:1.75rem;font-weight:600;line-height:2.25rem;letter-spacing:normal}:root body .vds-font-headline-small{font-size:1.5rem;font-weight:600;line-height:2rem;letter-spacing:normal}:root body .vds-font-title-large{font-size:1.25rem;font-weight:600;line-height:1.75rem;letter-spacing:0.00875rem}:root body .vds-font-title-medium{font-size:1rem;font-weight:600;line-height:1.5rem;letter-spacing:normal}:root body .vds-font-title-small{font-size:0.875rem;font-weight:600;line-height:1.25rem;letter-spacing:normal}:root body .vds-font-title-extra-small{font-size:0.75rem;font-weight:600;line-height:1rem;letter-spacing:0.00875rem}:root body .vds-font-title-2x-small{font-size:0.625rem;font-weight:600;line-height:0.75rem;letter-spacing:0.00875rem}:root body .vds-font-body-large{font-size:1rem;font-weight:300;line-height:1.5rem;letter-spacing:normal}:root body .vds-font-body-medium{font-size:0.875rem;font-weight:300;line-height:1.25rem;letter-spacing:normal}:root body .vds-font-body-small{font-size:0.75rem;font-weight:300;line-height:1rem;letter-spacing:normal}.vds__divider{width:0.0625rem;height:1rem;margin:var(--spacing-01);background-color:var(--color-border-low)}.content_divider_vertical{opacity:0.16;background:var(--color-border-high);height:1rem;width:1px}.vds-header_content-section{display:flex;gap:var(--spacing-03)}.vds__menu--backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.5);backdrop-filter:grayscale(100%) opacity(0.5);pointer-events:auto}.vds-base-item__label{flex:1 0 0;word-break:break-word}vds-checkbox::part(checkbox-container){padding:0}.checkbox-item-medium::part(svg-icon){display:flex;justify-content:center;align-items:center;width:0.8125rem !important;height:0.8125rem !important}.checkbox-item-large::part(svg-icon){display:flex;justify-content:center;align-items:center;width:1rem !important;height:1rem !important}.checkbox-icon-checked{scale:1.25}.vds-base-item__checkmark-icon--empty-small{width:0.75rem;height:0.75rem}.vds-base-item__checkmark-icon--empty-medium{width:1rem;height:1rem}.vds-base-item__checkmark-icon--empty-large{width:1.25rem;height:1.25rem}.vds-base-item__checkbox-icon-medium{width:1.25rem;height:1.25rem;display:flex;justify-content:center;align-items:center}.vds-base-item__checkbox-icon-large{width:1.5rem;height:1.5rem;display:flex;justify-content:center;align-items:center}:host{display:block}:host .vds-upload-item{border-radius:var(--radius-sharp);background:var(--surface-medium);border:none;text-align:left;box-shadow:none;box-sizing:border-box;cursor:pointer;width:100%;color:var(--color-text-high);cursor:default;border-radius:var(--radius-medium)}:host .vds-upload-item:focus:not(:focus-visible){outline:none;border-radius:var(--radius-sharp);box-shadow:none}:host .vds-upload-item:focus,:host .vds-upload-item:focus-within,:host .vds-upload-item:focus-visible{outline:none;border-radius:var(--radius-medium);box-shadow:0 0 0 0.125rem inset var(--color-border-focus-2)}:host .vds-upload-item:hover{background-color:var(--color-interaction-black-lowest)}:host .vds-upload-item.vds-upload-item--size-medium{min-height:var(--spacing-10);padding:var(--spacing-03) var(--spacing-04);font-family:\"Roboto Flex\", sans-serif;font-size:0.875rem;font-weight:300;line-height:1.25rem;letter-spacing:normal}:host .vds-upload-item.vds-upload-item--size-medium .vds-upload-item__content{display:flex;align-items:center;flex:1 0 0;gap:var(--spacing-02)}:host .vds-upload-item.vds-upload-item--size-large{min-height:var(--spacing-13);padding:var(--spacing-04) var(--spacing-05);font-family:\"Roboto Flex\", sans-serif;font-size:1rem;font-weight:300;line-height:1.5rem;letter-spacing:normal}:host .vds-upload-item.vds-upload-item--size-large .vds-upload-item__content{display:flex;align-items:center;flex:1 0 0;gap:var(--spacing-03)}:host .vds-upload-item.vds-upload-item--error{color:var(--color-text-danger-medium)}:host .vds-upload-item.vds-upload-item--error:hover{background-color:var(--color-interaction-danger-lowest)}:host .vds-upload-item .vds-upload-item__remove-icon{opacity:0;pointer-events:none;display:flex;align-items:center}.vds-upload-item--error :host .vds-upload-item .vds-upload-item__remove-icon{opacity:1}:host .vds-upload-item:hover .vds-upload-item__remove-icon,:host .vds-upload-item:focus-within .vds-upload-item__remove-icon{opacity:1;pointer-events:auto}";
+
+const VdsUploadItem$1 = /*@__PURE__*/ proxyCustomElement(class VdsUploadItem extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.actionIconClick = createEvent(this, "actionIconClick", 7);
+        /** Sets the item text value */
+        this.value = '';
+        /** Sets the item size */
+        this.size = 'medium';
+        /** Sets the item informative icon */
+        this.informativeIcon = 'link-closed';
+        /** Sets the item state */
+        this.status = 'default';
+        /** Sets the percentage filled value from 0 to 100 */
+        this.loadingValue = 75;
+        /**
+         * Sets the loop duration time for the indeterminate loop progress in miliseconds.
+         * Determinate and indeterminate state will be defined by adding or not the duration.
+         */
+        this.loadingDuration = 500;
+    }
+    renderInformativeIcon() {
+        if (this.status === 'loading') {
+            return (h("div", { class: "vds-upload-item__loading-indicator" }, h("vds-progress-circular", { value: this.loadingValue, duration: this.loadingDuration, scale: this.size === 'medium' ? 0.286 : 0.3575 })));
+        }
+        return generateInformativeIcon(this.informativeIcon, this.value, this.size, false, false, this.status === 'error');
+    }
+    generateLabel() {
+        return generateLabel(this.value, this.size, false, false, this.status === 'error');
+    }
+    handleIconButtonClick(event) {
+        event.stopPropagation();
+        this.actionIconClick.emit();
+    }
+    renderRemoveButton() {
+        return (h("div", { class: "vds-upload-item__remove-icon" }, h("vds-icon-button", { icon: this.status === 'loading' ? 'close' : 'trash', size: this.size === 'medium' ? 'small' : 'medium', variant: "secondary", setAriaLabel: "Remove item", onClick: (event => this.handleIconButtonClick(event)) })));
+    }
+    render() {
+        return (h(Host, { key: 'ab0650e6312bfe5faee20377f4325fd7467c5bb2' }, h("div", { key: 'fe0779f9529d0ad9e796ea1f1139c606a74ae908', class: combineClasses('vds-upload-item', `vds-upload-item--size-${this.size}`, `vds-upload-item--${this.status}`) }, h("div", { key: '690ea9fe83c861bc6dc7713c2625c731206c5e51', class: "vds-upload-item__content" }, this.renderInformativeIcon(), this.generateLabel(), this.renderRemoveButton()))));
+    }
+    static get style() { return vdsUploadItemCss; }
+}, [1, "vds-upload-item", {
+        "value": [1],
+        "size": [1],
+        "informativeIcon": [1, "informative-icon"],
+        "status": [1],
+        "loadingValue": [2, "loading-value"],
+        "loadingDuration": [2, "loading-duration"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["vds-upload-item", "vds-icon", "vds-icon-button", "vds-progress-circular"];
+    components.forEach(tagName => { switch (tagName) {
+        case "vds-upload-item":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, VdsUploadItem$1);
+            }
+            break;
+        case "vds-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "vds-icon-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "vds-progress-circular":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const VdsUploadItem = VdsUploadItem$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { VdsUploadItem, defineCustomElement };
+//# sourceMappingURL=vds-upload-item.js.map
+
+//# sourceMappingURL=vds-upload-item.js.map

package/dist/components/vds-upload-item.js.map

@@ -0,0 +1 @@
+{"file":"vds-upload-item.js","mappings":";;;;;;;AAAA,MAAM,gBAAgB,GAAG,49iCAA49iC;;MCUx+iCA,eAAa,iBAAAC,kBAAA,CAAA,MAAA,aAAA,SAAA,WAAA,CAAA;AAL1B,IAAA,WAAA,GAAA;;;;;;AAOU,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE;;AAElB,QAAA,IAAI,CAAA,IAAA,GAAuB,QAAQ;;AAEnC,QAAA,IAAe,CAAA,eAAA,GAAW,aAAa;;AAEvC,QAAA,IAAM,CAAA,MAAA,GAAoC,SAAS;;AAEnD,QAAA,IAAY,CAAA,YAAA,GAAW,EAAE;AACjC;;;AAGG;AACK,QAAA,IAAe,CAAA,eAAA,GAAW,GAAG;AA4DtC;IAvDS,qBAAqB,GAAA;AAC3B,QAAA,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,EAAE;YAC7B,QACE,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,oCAAoC,EAAA,EAC7C,CAAA,CAAA,uBAAA,EAAA,EACE,KAAK,EAAE,IAAI,CAAC,YAAY,EACxB,QAAQ,EAAE,IAAI,CAAC,eAAe,EAC9B,KAAK,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ,GAAG,KAAK,GAAG,MAAM,EAC9C,CAAA,CACE;;QAGV,OAAO,uBAAuB,CAAC,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,KAAK,OAAO,CAAC;;IAG5G,aAAa,GAAA;QACnB,OAAO,aAAa,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,KAAK,OAAO,CAAC;;AAG5E,IAAA,qBAAqB,CAAC,KAAY,EAAA;QACxC,KAAK,CAAC,eAAe,EAAE;AACvB,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE;;IAGrB,kBAAkB,GAAA;AACxB,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,8BAA8B,EAAA,EACvC,CACE,CAAA,iBAAA,EAAA,EAAA,IAAI,EAAE,IAAI,CAAC,MAAM,KAAK,SAAS,GAAG,OAAO,GAAG,OAAO,EACnD,IAAI,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ,GAAG,OAAO,GAAG,QAAQ,EACjD,OAAO,EAAC,WAAW,EACnB,YAAY,EAAC,aAAa,EAC1B,OAAO,GAAG,KAAK,IAAI,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,CAAC,EAAA,CACrD,CACE;;IAIV,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,cAAc,CACxB,iBAAiB,EACjB,CAAyB,sBAAA,EAAA,IAAI,CAAC,IAAI,CAAA,CAAE,EACpC,CAAA,iBAAA,EAAoB,IAAI,CAAC,MAAM,CAAE,CAAA,CAClC,EAAA,EACC,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,0BAA0B,EAAA,EAClC,IAAI,CAAC,qBAAqB,EAAE,EAC5B,IAAI,CAAC,aAAa,EAAE,EACpB,IAAI,CAAC,kBAAkB,EAAE,CACtB,CACF,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["VdsUploadItem","__stencil_proxyCustomElement"],"sources":["src/components/upload-item/vds-upload-item.scss?tag=vds-upload-item&encapsulation=shadow","src/components/upload-item/vds-upload-item.tsx"],"sourcesContent":["@import '~@volt/volt-foundations/dist/volt-foundations/volt-foundations';\n@import '../base-item/base-item.scss';\n\n:host {\n  display: block;\n  .vds-upload-item {\n    @include baseItem();\n    cursor: default;\n    border-radius: var(--radius-medium);\n    &.vds-upload-item--size-medium {\n      @include baseItemSizeMedium();\n      .vds-upload-item__content {\n        @include baseItemContent(medium);\n      }\n    }\n    &.vds-upload-item--size-large {\n      @include baseItemSizeLarge();\n      .vds-upload-item__content {\n        @include baseItemContent(large);\n      }\n    }\n    &.vds-upload-item--error {\n      @include baseItemDanger();\n    }\n    .vds-upload-item__remove-icon {\n      opacity: 0;\n      pointer-events: none; \n      display: flex;\n      align-items: center;\n      .vds-upload-item--error & {\n        opacity: 1;\n      }\n    }\n    &:hover,\n    &:focus-within {\n      .vds-upload-item__remove-icon {\n        opacity: 1;\n        pointer-events: auto;\n      }\n    }\n  }\n}\n","import { Component, Host, h, Prop, Event } from '@stencil/core';\nimport { EventEmitter, HTMLStencilElement } from '@stencil/core/internal';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { generateInformativeIcon, generateLabel } from '../base-item/base-item';\n\n@Component({\n  tag: 'vds-upload-item',\n  styleUrl: 'vds-upload-item.scss',\n  shadow: true,\n})\nexport class VdsUploadItem {\n  /** Sets the item text value */\n  @Prop() value: string = '';\n  /** Sets the item size */\n  @Prop() size: 'large' | 'medium' = 'medium';\n  /** Sets the item informative icon */\n  @Prop() informativeIcon: string = 'link-closed';\n  /** Sets the item state */\n  @Prop() status: 'loading' | 'error' | 'default' = 'default';\n  /** Sets the percentage filled value from 0 to 100 */\n  @Prop() loadingValue: number = 75;\n  /**\n   * Sets the loop duration time for the indeterminate loop progress in miliseconds.\n   * Determinate and indeterminate state will be defined by adding or not the duration.\n   */\n  @Prop() loadingDuration: number = 500;\n\n  /** Event emitted when the icon button is clicked */\n  @Event() actionIconClick: EventEmitter<void>;\n\n  private renderInformativeIcon() {\n    if (this.status === 'loading') {\n      return (\n        <div class=\"vds-upload-item__loading-indicator\">\n          <vds-progress-circular\n            value={this.loadingValue}\n            duration={this.loadingDuration}\n            scale={this.size === 'medium' ? 0.286 : 0.3575}\n          />\n        </div>\n      );\n    }\n    return generateInformativeIcon(this.informativeIcon, this.value, this.size, false, false, this.status === 'error');\n  }\n\n  private generateLabel() {\n    return generateLabel(this.value, this.size, false, false, this.status === 'error');\n  }\n\n  private handleIconButtonClick(event: Event) {\n    event.stopPropagation();\n    this.actionIconClick.emit();\n  }\n\n  private renderRemoveButton() {\n    return (\n      <div class=\"vds-upload-item__remove-icon\">\n        <vds-icon-button\n          icon={this.status === 'loading' ? 'close' : 'trash'}\n          size={this.size === 'medium' ? 'small' : 'medium'}\n          variant=\"secondary\"\n          setAriaLabel=\"Remove item\"\n          onClick={(event => this.handleIconButtonClick(event))}\n        />\n      </div>\n    );\n  }\n\n  render(): HTMLStencilElement {\n    return (\n      <Host>\n        <div class={combineClasses(\n          'vds-upload-item',\n          `vds-upload-item--size-${this.size}`,\n          `vds-upload-item--${this.status}`\n        )}>\n          <div class=\"vds-upload-item__content\">\n            {this.renderInformativeIcon()}\n            {this.generateLabel()}\n            {this.renderRemoveButton()}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/base-group-header-BuuRc-nw.js

@@ -0,0 +1,20 @@
+import { h } from './index-DTZC-zXo.js';
+import { c as combineClasses } from './combine-classes-B23UkaEC.js';
+
+/**
+ * Generates a group header container with a label.
+ *
+ * @param {GroupHeaderSize} size - The size of the group header.
+ * @param {string} value - The text value to display in the group header.
+ *
+ * @returns {HTMLStencilElement} The generated group header container.
+ */
+const generateGroupHeaderContainer = (size, value) => {
+    return (h("div", { class: combineClasses('vds-base-group-header', `vds-base-group-header--${size}`) },
+        h("span", { class: combineClasses('vds-base-group-header__label', `vds-base-group-header__label--${size}`) }, value ? value : h("slot", null))));
+};
+
+export { generateGroupHeaderContainer as g };
+//# sourceMappingURL=base-group-header-BuuRc-nw.js.map
+
+//# sourceMappingURL=base-group-header-BuuRc-nw.js.map

package/dist/esm/base-group-header-BuuRc-nw.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base-group-header-BuuRc-nw.js","sources":["src/components/base-group-header/base-group-header.tsx"],"sourcesContent":["import { h, HTMLStencilElement } from '@stencil/core/internal';\nimport { combineClasses } from '../../utils/combine-classes';\n\nexport type GroupHeaderSize = 'small' | 'medium' | 'large';\n\n/**\n * Generates a group header container with a label.\n *\n * @param {GroupHeaderSize} size - The size of the group header.\n * @param {string} value - The text value to display in the group header.\n * \n * @returns {HTMLStencilElement} The generated group header container.\n */\nexport const generateGroupHeaderContainer = (\n  size: GroupHeaderSize,\n  value?: string\n): HTMLStencilElement => {\n  return (\n    <div class={combineClasses(\n      'vds-base-group-header',\n      `vds-base-group-header--${size}`\n    )}>\n      <span class={combineClasses(\n        'vds-base-group-header__label',\n        `vds-base-group-header__label--${size}`\n      )}>\n        {value ? value : <slot></slot>}\n      </span>\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;AAKA;;;;;;;AAOG;MACU,4BAA4B,GAAG,CAC1C,IAAqB,EACrB,KAAc,KACQ;IACtB,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,cAAc,CACxB,uBAAuB,EACvB,CAAA,uBAAA,EAA0B,IAAI,CAAA,CAAE,CACjC,EAAA;QACC,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAE,cAAc,CACzB,8BAA8B,EAC9B,CAAA,8BAAA,EAAiC,IAAI,CAAA,CAAE,CACxC,EAAA,EACE,KAAK,GAAG,KAAK,GAAG,CAAa,CAAA,MAAA,EAAA,IAAA,CAAA,CACzB,CACH;AAEV;;;;"}

package/dist/esm/base-item-D7eOT-ts.js

@@ -0,0 +1,115 @@
+import { h } from './index-DTZC-zXo.js';
+import { c as combineClasses } from './combine-classes-B23UkaEC.js';
+
+/**
+ * Gets the appropriate icon color based on the provided conditions.
+ *
+ * @param {boolean} disabled - Whether the icon is disabled.
+ * @param {boolean} isActive - Whether the icon is active.
+ * @param {boolean} [danger=false] - Whether the icon should indicate danger.
+ * @param {boolean} [isCheckbox=false] - Whether the icon is for a checkbox.
+ *
+ * @returns {IconColors} The CSS variable name for the icon color.
+ */
+const getIconColor = (disabled, isActive, danger = false, isCheckbox = false) => {
+    switch (true) {
+        case disabled:
+            return "color-icon-disabled";
+        case danger:
+            return "color-icon-danger";
+        case isActive:
+            return isCheckbox ? "color-icon-brand-default" : "color-icon-brand-press";
+        default:
+            return "color-icon-high";
+    }
+};
+/**
+ * Gets the appropriate icon size based on the provided size.
+ *
+ * @param {"small" | "medium" | "large"} size - The desired size of the icon.
+ *
+ * @returns {string} The CSS size value for the icon.
+ */
+const getIconSize = (size) => size === "medium" ? "1rem" : size === "small" ? "0.75rem" : "1.25rem";
+/**
+ * Generates a checkmark icon button based on the provided parameters.
+ *
+ * @param {boolean} isSelected - Whether the item is selected.
+ * @param {"medium" | "large"} size - The desired size of the icon.
+ * @param {boolean} disabled - Whether the icon is disabled.
+ * @param {boolean} isActive - Whether the icon is active.
+ * @param {boolean} danger - Whether the icon should indicate danger.
+ *
+ * @returns {HTMLStencilElement} The generated checkmark icon button.
+ */
+const generateCheckmarkIconButton = (isSelected, size, disabled, isActive, danger) => {
+    if (isSelected) {
+        return (h("div", { class: "vds-base-item__checkmark-icon" },
+            h("vds-icon", { "svg-icon": "good", size: getIconSize(size), color: getIconColor(disabled, isSelected || isActive, danger), alt: "Selected Item" })));
+    }
+    return (h("div", { class: `vds-base-item__checkmark-icon--empty-${size}` }));
+};
+/**
+ * Generates an informative icon based on the provided parameters.
+ *
+ * @param {string} icon - The name of the SVG icon to use.
+ * @param {string} value - The value associated with the icon.
+ * @param {"medium" | "large"} size - The desired size of the icon.
+ * @param {boolean} disabled - Whether the icon is disabled.
+ * @param {boolean} isActive - Whether the icon is active.
+ * @param {boolean} danger - Whether the icon should indicate danger.
+ *
+ * @returns {HTMLStencilElement} The generated informative icon.
+ */
+const generateInformativeIcon = (icon, value, size, disabled, isActive, danger) => {
+    return (h("div", { class: "vds-base-item__informative-icon" },
+        h("vds-icon", { "svg-icon": icon, size: getIconSize(size), color: getIconColor(disabled, isActive, danger), alt: value })));
+};
+/**
+ * Generates a checkbox icon based on the provided parameters.
+ *
+ * @param {boolean} isSelected - Whether the checkbox is selected.
+ * @param {"medium" | "large"} size - The desired size of the checkbox.
+ * @param {boolean} disabled - Whether the checkbox is disabled.
+ * @param {boolean} isActive - Whether the checkbox is active.
+ * @param {boolean} danger - Whether the checkbox should indicate danger.
+ *
+ * @returns {HTMLStencilElement} The generated checkbox icon.
+ */
+const generateCheckbox = (isSelected, size, disabled, isActive, danger) => {
+    return (h("div", { class: `vds-base-item__checkbox-icon-${size}` },
+        h("vds-icon", { "svg-icon": isSelected ? "checked" : "unchecked", class: combineClasses(isSelected ? "checkbox-icon-checked" : "", `checkbox-item-${size}`), size: getIconSize(size), color: getIconColor(disabled, isSelected || isActive, danger, true), alt: "checkbox-element" })));
+};
+/**
+ * Generates a label element based on the provided parameters.
+
+ * @param {string} label - The text content of the label.
+ * @param {"medium" | "large"} size - The desired size of the label.
+ * @param {boolean} disabled - Whether the label is disabled.
+ * @param {boolean} isActive - Whether the label is active.
+ * @param {boolean} danger - Whether the label should indicate danger.
+ *
+ * @returns {HTMLStencilElement} The generated label element.
+ */
+const generateLabel = (label, size, disabled, isActive, danger) => {
+    return (h("span", { class: combineClasses("vds-base-item__label", `vds-base-item__label--size-${size}`, disabled ? "vds-base-item__label--disabled" : "", isActive ? "vds-base-item__label--active" : "", danger ? "vds-base-item__label--danger" : "") }, label ? label : h("slot", null)));
+};
+/**
+ * Generates a children icon button based on the provided parameters.
+
+ * @param {"medium" | "large"} size - The desired size of the icon.
+ * @param {boolean} disabled - Whether the icon is disabled.
+ * @param {boolean} isActive - Whether the icon is active.
+ * @param {boolean} danger - Whether the icon should indicate danger.
+ *
+ * @returns {HTMLStencilElement} The generated children icon button.
+ */
+const generateChildrenIconButton = (size, disabled, isActive, danger) => {
+    return (h("div", { class: "vds-base-item__has-children-icon" },
+        h("vds-icon", { "svg-icon": "chevron-right", size: getIconSize(size), color: getIconColor(disabled, isActive, danger), alt: "Open menu" })));
+};
+
+export { generateCheckbox as a, generateInformativeIcon as b, generateLabel as c, generateChildrenIconButton as d, generateCheckmarkIconButton as g };
+//# sourceMappingURL=base-item-D7eOT-ts.js.map
+
+//# sourceMappingURL=base-item-D7eOT-ts.js.map

package/dist/esm/base-item-D7eOT-ts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base-item-D7eOT-ts.js","sources":["src/components/base-item/base-item.tsx"],"sourcesContent":["import { h } from \"@stencil/core\";\nimport { HTMLStencilElement } from \"@stencil/core/internal\";\nimport { combineClasses } from \"../../utils/combine-classes\";\nimport { IconColors } from \"../../components\";\n\n/**\n * Gets the appropriate icon color based on the provided conditions.\n *\n * @param {boolean} disabled - Whether the icon is disabled.\n * @param {boolean} isActive - Whether the icon is active.\n * @param {boolean} [danger=false] - Whether the icon should indicate danger.\n * @param {boolean} [isCheckbox=false] - Whether the icon is for a checkbox.\n * \n * @returns {IconColors} The CSS variable name for the icon color.\n */\nconst getIconColor = (\n    disabled: boolean,\n    isActive: boolean,\n    danger: boolean = false,\n    isCheckbox: boolean = false\n): IconColors => {\n    switch(true) {\n        case disabled:\n            return \"color-icon-disabled\";\n        case danger:\n            return \"color-icon-danger\";\n        case isActive:\n            return isCheckbox ? \"color-icon-brand-default\" : \"color-icon-brand-press\";\n        default: \n            return \"color-icon-high\";\n    }\n}\n\n/**\n * Gets the appropriate icon size based on the provided size.\n *\n * @param {\"small\" | \"medium\" | \"large\"} size - The desired size of the icon.\n * \n * @returns {string} The CSS size value for the icon.\n */\nconst getIconSize = (size: \"small\" | \"medium\" | \"large\"): string => size === \"medium\" ? \"1rem\" : size === \"small\" ? \"0.75rem\" : \"1.25rem\"\n\n/**\n * Generates a checkmark icon button based on the provided parameters.\n *\n * @param {boolean} isSelected - Whether the item is selected.\n * @param {\"medium\" | \"large\"} size - The desired size of the icon.\n * @param {boolean} disabled - Whether the icon is disabled.\n * @param {boolean} isActive - Whether the icon is active.\n * @param {boolean} danger - Whether the icon should indicate danger.\n * \n * @returns {HTMLStencilElement} The generated checkmark icon button.\n */\nexport const generateCheckmarkIconButton = (\n    isSelected: boolean,\n    size: \"small\" | \"medium\" | \"large\",\n    disabled: boolean,\n    isActive: boolean,\n    danger: boolean\n): HTMLStencilElement => {\n    if (isSelected) {\n        return (\n            <div class=\"vds-base-item__checkmark-icon\">\n              <vds-icon\n                svg-icon=\"good\"\n                size={getIconSize(size)}\n                color={getIconColor(disabled, isSelected || isActive, danger)}\n                alt=\"Selected Item\"\n              />\n            </div>\n          );\n    }\n\n    return (\n        <div class={`vds-base-item__checkmark-icon--empty-${size}`}></div>\n    );\n}\n\n/**\n * Generates an informative icon based on the provided parameters.\n *\n * @param {string} icon - The name of the SVG icon to use.\n * @param {string} value - The value associated with the icon.\n * @param {\"medium\" | \"large\"} size - The desired size of the icon.\n * @param {boolean} disabled - Whether the icon is disabled.\n * @param {boolean} isActive - Whether the icon is active.\n * @param {boolean} danger - Whether the icon should indicate danger.\n * \n * @returns {HTMLStencilElement} The generated informative icon.\n */\nexport const generateInformativeIcon = (\n    icon: string,\n    value: string,\n    size: \"small\" | \"medium\" | \"large\",\n    disabled: boolean,\n    isActive: boolean,\n    danger: boolean\n): HTMLStencilElement => {\n    return (\n        <div class=\"vds-base-item__informative-icon\">            \n          <vds-icon\n            svg-icon={icon}\n            size={getIconSize(size)}\n            color={getIconColor(disabled, isActive, danger)}\n            alt={value}\n          />\n        </div>\n      );\n}\n\n/**\n * Generates a checkbox icon based on the provided parameters.\n *\n * @param {boolean} isSelected - Whether the checkbox is selected.\n * @param {\"medium\" | \"large\"} size - The desired size of the checkbox.\n * @param {boolean} disabled - Whether the checkbox is disabled.\n * @param {boolean} isActive - Whether the checkbox is active.\n * @param {boolean} danger - Whether the checkbox should indicate danger.\n * \n * @returns {HTMLStencilElement} The generated checkbox icon.\n */\nexport const generateCheckbox = (\n    isSelected: boolean,\n    size: \"small\" | \"medium\" | \"large\",\n    disabled: boolean,\n    isActive: boolean,\n    danger: boolean\n): HTMLStencilElement  => {\n    return (\n        <div class={`vds-base-item__checkbox-icon-${size}`}>\n          <vds-icon\n            svg-icon={isSelected ? \"checked\" : \"unchecked\"}\n            class={combineClasses(isSelected ? \"checkbox-icon-checked\" : \"\", `checkbox-item-${size}`)}\n            size={getIconSize(size)}\n            color={getIconColor(disabled, isSelected || isActive, danger, true)}\n            alt={\"checkbox-element\"}\n          />\n        </div>\n    );\n}\n\n/**\n * Generates a label element based on the provided parameters.\n\n * @param {string} label - The text content of the label.\n * @param {\"medium\" | \"large\"} size - The desired size of the label.\n * @param {boolean} disabled - Whether the label is disabled.\n * @param {boolean} isActive - Whether the label is active.\n * @param {boolean} danger - Whether the label should indicate danger.\n * \n * @returns {HTMLStencilElement} The generated label element.\n */\nexport const generateLabel = (\n    label: string,\n    size: \"small\" | \"medium\" | \"large\",\n    disabled: boolean,\n    isActive: boolean,\n    danger: boolean\n): HTMLStencilElement => {\n    return (\n        <span\n            class={combineClasses(\n                \"vds-base-item__label\",\n                `vds-base-item__label--size-${size}`,\n                disabled ? \"vds-base-item__label--disabled\" : \"\",\n                isActive ? \"vds-base-item__label--active\" : \"\",\n                danger ? \"vds-base-item__label--danger\" : \"\",\n          )}\n        >\n          { label ? label :  <slot></slot> }\n        </span>\n    );\n}\n\n/**\n * Generates a children icon button based on the provided parameters.\n\n * @param {\"medium\" | \"large\"} size - The desired size of the icon.\n * @param {boolean} disabled - Whether the icon is disabled.\n * @param {boolean} isActive - Whether the icon is active.\n * @param {boolean} danger - Whether the icon should indicate danger.\n * \n * @returns {HTMLStencilElement} The generated children icon button.\n */\nexport const generateChildrenIconButton = (\n    size: \"small\" | \"medium\" | \"large\",\n    disabled: boolean,\n    isActive: boolean,\n    danger: boolean\n): HTMLStencilElement => {\n    return(\n        <div class=\"vds-base-item__has-children-icon\">\n          <vds-icon\n            svg-icon=\"chevron-right\"\n            size={getIconSize(size)}\n            color={getIconColor(disabled, isActive, danger)}\n            alt=\"Open menu\"\n          />\n        </div>\n    );\n}\n"],"names":[],"mappings":";;;AAKA;;;;;;;;;AASG;AACH,MAAM,YAAY,GAAG,CACjB,QAAiB,EACjB,QAAiB,EACjB,MAAA,GAAkB,KAAK,EACvB,UAAsB,GAAA,KAAK,KACf;IACZ,QAAO,IAAI;AACP,QAAA,KAAK,QAAQ;AACT,YAAA,OAAO,qBAAqB;AAChC,QAAA,KAAK,MAAM;AACP,YAAA,OAAO,mBAAmB;AAC9B,QAAA,KAAK,QAAQ;YACT,OAAO,UAAU,GAAG,0BAA0B,GAAG,wBAAwB;AAC7E,QAAA;AACI,YAAA,OAAO,iBAAiB;;AAEpC,CAAC;AAED;;;;;;AAMG;AACH,MAAM,WAAW,GAAG,CAAC,IAAkC,KAAa,IAAI,KAAK,QAAQ,GAAG,MAAM,GAAG,IAAI,KAAK,OAAO,GAAG,SAAS,GAAG,SAAS;AAEzI;;;;;;;;;;AAUG;AACI,MAAM,2BAA2B,GAAG,CACvC,UAAmB,EACnB,IAAkC,EAClC,QAAiB,EACjB,QAAiB,EACjB,MAAe,KACK;IACpB,IAAI,UAAU,EAAE;AACZ,QAAA,QACI,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,+BAA+B,EAAA;AACxC,YAAA,CAAA,CAAA,UAAA,EAAA,EAAA,UAAA,EACW,MAAM,EACf,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC,EACvB,KAAK,EAAE,YAAY,CAAC,QAAQ,EAAE,UAAU,IAAI,QAAQ,EAAE,MAAM,CAAC,EAC7D,GAAG,EAAC,eAAe,EAAA,CACnB,CACE;;IAId,QACI,WAAK,KAAK,EAAE,wCAAwC,IAAI,CAAA,CAAE,EAAQ,CAAA;AAE1E;AAEA;;;;;;;;;;;AAWG;AACU,MAAA,uBAAuB,GAAG,CACnC,IAAY,EACZ,KAAa,EACb,IAAkC,EAClC,QAAiB,EACjB,QAAiB,EACjB,MAAe,KACK;AACpB,IAAA,QACI,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,iCAAiC,EAAA;QAC1C,CACY,CAAA,UAAA,EAAA,EAAA,UAAA,EAAA,IAAI,EACd,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC,EACvB,KAAK,EAAE,YAAY,CAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,CAAC,EAC/C,GAAG,EAAE,KAAK,EAAA,CACV,CACE;AAEd;AAEA;;;;;;;;;;AAUG;AACI,MAAM,gBAAgB,GAAG,CAC5B,UAAmB,EACnB,IAAkC,EAClC,QAAiB,EACjB,QAAiB,EACjB,MAAe,KACM;AACrB,IAAA,QACI,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,CAAA,6BAAA,EAAgC,IAAI,CAAE,CAAA,EAAA;QAChD,CACY,CAAA,UAAA,EAAA,EAAA,UAAA,EAAA,UAAU,GAAG,SAAS,GAAG,WAAW,EAC9C,KAAK,EAAE,cAAc,CAAC,UAAU,GAAG,uBAAuB,GAAG,EAAE,EAAE,CAAiB,cAAA,EAAA,IAAI,CAAE,CAAA,CAAC,EACzF,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC,EACvB,KAAK,EAAE,YAAY,CAAC,QAAQ,EAAE,UAAU,IAAI,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,EACnE,GAAG,EAAE,kBAAkB,EAAA,CACvB,CACE;AAEd;AAEA;;;;;;;;;;AAUG;AACI,MAAM,aAAa,GAAG,CACzB,KAAa,EACb,IAAkC,EAClC,QAAiB,EACjB,QAAiB,EACjB,MAAe,KACK;IACpB,QACI,CACI,CAAA,MAAA,EAAA,EAAA,KAAK,EAAE,cAAc,CACjB,sBAAsB,EACtB,CAA8B,2BAAA,EAAA,IAAI,CAAE,CAAA,EACpC,QAAQ,GAAG,gCAAgC,GAAG,EAAE,EAChD,QAAQ,GAAG,8BAA8B,GAAG,EAAE,EAC9C,MAAM,GAAG,8BAA8B,GAAG,EAAE,CACjD,EAEC,EAAA,KAAK,GAAG,KAAK,GAAI,CAAA,CAAA,MAAA,EAAA,IAAA,CAAa,CAC3B;AAEf;AAEA;;;;;;;;;AASG;AACI,MAAM,0BAA0B,GAAG,CACtC,IAAkC,EAClC,QAAiB,EACjB,QAAiB,EACjB,MAAe,KACK;AACpB,IAAA,QACI,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,kCAAkC,EAAA;QAC3C,CACW,CAAA,UAAA,EAAA,EAAA,UAAA,EAAA,eAAe,EACxB,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC,EACvB,KAAK,EAAE,YAAY,CAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,CAAC,EAC/C,GAAG,EAAC,WAAW,EAAA,CACf,CACE;AAEd;;;;"}

package/dist/esm/clone-attributes-CqHfuEQc.js

@@ -0,0 +1,13 @@
+const cloneAttributes = (el, ...excludedKeys) => {
+    return Object.values(el.attributes)
+        .filter(({ name: keyName }) => !(excludedKeys === null || excludedKeys === void 0 ? void 0 : excludedKeys.some(exKey => exKey === keyName)))
+        .reduce((acc, attr) => {
+        acc = Object.assign(Object.assign({}, acc), { [attr.name]: attr.value });
+        return acc;
+    }, {});
+};
+
+export { cloneAttributes as c };
+//# sourceMappingURL=clone-attributes-CqHfuEQc.js.map
+
+//# sourceMappingURL=clone-attributes-CqHfuEQc.js.map

package/dist/esm/clone-attributes-CqHfuEQc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"clone-attributes-CqHfuEQc.js","sources":["src/utils/clone-attributes.ts"],"sourcesContent":["import { JSXBase } from \"@stencil/core/internal\";\n\nexport const cloneAttributes = <\n\tX extends HTMLElement,\n\tT = JSXBase.HTMLAttributes | NamedNodeMap\n>(\n\tel: X,\n\t...excludedKeys: string[]\n): { [P in keyof T]?: T[P] } => {\n\treturn Object.values(el.attributes)\n\t\t.filter(\n\t\t\t({ name: keyName }) => !excludedKeys?.some(exKey => exKey === keyName)\n\t\t)\n\t\t.reduce((acc: { [P in keyof T]: T[P] }, attr: Attr): T => {\n\t\t\tacc = { ...acc, [attr.name]: attr.value };\n\t\t\treturn acc;\n\t\t}, {});\n};\n"],"names":[],"mappings":"AAEa,MAAA,eAAe,GAAG,CAI9B,EAAK,EACL,GAAG,YAAsB,KACK;AAC9B,IAAA,OAAO,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,UAAU;AAChC,SAAA,MAAM,CACN,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAC,YAAY,KAAA,IAAA,IAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,IAAI,CAAC,KAAK,IAAI,KAAK,KAAK,OAAO,CAAC,CAAA;AAEtE,SAAA,MAAM,CAAC,CAAC,GAA6B,EAAE,IAAU,KAAO;AACxD,QAAA,GAAG,GAAQ,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,GAAG,CAAE,EAAA,EAAA,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,GAAE;AACzC,QAAA,OAAO,GAAG;KACV,EAAE,EAAE,CAAC;AACR;;;;"}

package/dist/esm/combine-classes-B23UkaEC.js

@@ -0,0 +1,6 @@
+const combineClasses = (...classes) => classes.join(" ").trim();
+
+export { combineClasses as c };
+//# sourceMappingURL=combine-classes-B23UkaEC.js.map
+
+//# sourceMappingURL=combine-classes-B23UkaEC.js.map

package/dist/esm/combine-classes-B23UkaEC.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"combine-classes-B23UkaEC.js","sources":["src/utils/combine-classes.ts"],"sourcesContent":["export const combineClasses = (...classes: string[]): string =>\n\tclasses.join(\" \").trim();\n"],"names":[],"mappings":"AAAa,MAAA,cAAc,GAAG,CAAC,GAAG,OAAiB,KAClD,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI;;;;"}