npm - wabtec-internal-volt-basic-components - Versions diffs - 1.0.0 → 1.2.0 - Mend

wabtec-internal-volt-basic-components 1.0.0 → 1.2.0

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 (773) hide show

package/dist/components/vds-basic-dropdown.js CHANGED Viewed

@@ -1,17 +1,20 @@
-import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h, Host } from '@stencil/core/internal/client';
+import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h, Host, transformTag } from '@stencil/core/internal/client';
 import { c as combineClasses } from './combine-classes.js';
 import { u as updateFloatingBoxPosition } from './floating-engine-utils.js';
-import { b as getIconSize } from './icon-attr.utils.js';
+import { a as getIconColor, c as getIconSize, b as getActionIconButtonSize } from './icon-attr.utils.js';
 import { t as toggleContainerDisplay, s as scrollToSelectedValue, b as unselectNonSelectedItems, c as selectSelectedItems, g as getSelectedLabel, u as unselectAllItems, a as updateContainerWidth, d as setDropdownStyles } from './vds-basic-dropdown.utils.js';
+import { e as emitInputEvent } from './form.js';
 import { d as defineCustomElement$3 } from './vds-icon2.js';
 import { d as defineCustomElement$2 } from './vds-icon-button2.js';
-const vdsBasicDropdownCss = "@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}:host{display:block;width:100%}:host .vds__dropdown--trigger{box-sizing:border-box;display:inline-flex;width:100%;text-align:left;align-items:center;justify-content:space-between;gap:0.25rem;align-self:stretch;border-radius:var(--radius-medium);border:none;box-shadow:0 0 0 0.0625rem inset var(--color-border-low);background:var(--surface-medium)}:host .vds__dropdown--trigger:active,:host .vds__dropdown--trigger:hover{cursor:pointer;box-shadow:0 0 0 0.0625rem inset var(--color-border-brand)}:host .vds__dropdown--trigger:focus-visible{outline:0.125rem solid var(--color-border-focus-2);outline-offset:0.125rem}:host .vds__dropdown--trigger.vds__dropdown--trigger--size-small{padding:var(--spacing-02) var(--spacing-03);height:var(--spacing-07)}:host .vds__dropdown--trigger.vds__dropdown--trigger--size-medium{padding:var(--spacing-03) var(--spacing-04);height:var(--spacing-10)}:host .vds__dropdown--trigger.vds__dropdown--trigger--size-large{padding:var(--spacing-04) var(--spacing-05);height:var(--spacing-13)}:host .vds__dropdown--trigger-disabled{cursor:none;pointer-events:none;color:var(--color-text-disabled);box-shadow:0 0 0 0.0625rem inset var(--color-border-disabled);background:var(--surface-medium)}:host .vds__dropdown--trigger-disabled .vds__dropdown--value{color:var(--color-text-disabled)}:host .vds__dropdown--trigger-error{box-shadow:0 0 0 0.0625rem inset var(--color-border-danger)}:host .vds__dropdown--trigger-error:focus,:host .vds__dropdown--trigger-error:active,:host .vds__dropdown--trigger-error:hover{box-shadow:0 0 0 0.0625rem inset var(--color-border-danger)}:host .vds__dropdown--trigger-error .vds__dropdown--value-label{color:var(--color-text-danger-medium)}:host .vds__dropdown--value{padding-right:var(--spacing-02);font-feature-settings:\"clig\" off, \"liga\" off;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .vds__dropdown--value-small{font-family:\"Roboto Flex\", sans-serif;font-size:0.75rem;font-weight:300;line-height:1rem;letter-spacing:normal}:host .vds__dropdown--value-medium{font-family:\"Roboto Flex\", sans-serif;font-size:0.875rem;font-weight:300;line-height:1.25rem;letter-spacing:normal}:host .vds__dropdown--value-large{font-family:\"Roboto Flex\", sans-serif;font-size:1rem;font-weight:300;line-height:1.5rem;letter-spacing:normal}:host .vds__dropdown--value-label{color:var(--color-text-high)}:host .vds__dropdown--value-placeholder{color:var(--color-text-medium)}:host .vds__dropdown--container{display:none;width:fit-content;min-width:max-content;max-height:fit-content !important;flex-direction:column;align-items:flex-start;align-self:stretch;border-radius:var(--radius-medium);background:var(--surface-medium);z-index:var(--elevation-layer-5);box-shadow:var(--elevation-shadow-2);box-sizing:border-box;border:0.0625rem solid var(--color-border-lowest)}:host .vds__dropdown--container.no-shadow{box-shadow:none;border:none}:host .vds__dropdown--container.has-scroll{padding-right:var(--spacing-01)}:host .vds__dropdown--container.match-width{width:var(--trigger-width);min-width:var(--trigger-width)}:host .vds-dropdown__content{overflow-y:auto;display:flex;flex-direction:column;border-radius:var(--radius-medium)}:host .vds-dropdown__content.scrollable{padding-right:var(--spacing-01)}:host .vds-dropdown__content::-webkit-scrollbar{background-color:var(--surface-medium);width:0.375rem}:host .vds-dropdown__content::-webkit-scrollbar-thumb{background-color:var(--color-background-neutral-press);border-radius:1rem}:host .vds__dropdown--left-content{display:inline-flex;column-gap:var(--spacing-02);align-items:center;overflow:hidden}:host .vds__dropdown--left-content .vds-dropdown__informative-icon{display:flex;align-items:center;justify-content:center}:host .vds__dropdown--trigger--size-large .vds__dropdown--left-content{column-gap:var(--spacing-03)}:host .vds__dropdown--right-actions{display:inline-flex;align-items:center}:host .vds-basic-dropdown__container{display:block}:host .vds-floating-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--color-interaction-black-lower);opacity:0.06;z-index:var(--elevation-layer-4)}:host-context(.vds-basic-dropdown--disabled){pointer-events:none}";
+const vdsBasicDropdownCss = () => `: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}@font-face{font-family:"Roboto Flex";src:url("../assets/fonts/Roboto_Flex/RobotoFlex-VariableFont_GRAD,XOPQ,XTRA,YOPQ,YTAS,YTDE,YTFI,YTLC,YTUC,opsz,slnt,wdth,wght.ttf") format("truetype");font-weight:100 1000;font-stretch:25% 151%;font-style:normal}: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-white-medium:rgba(255, 255, 255, 0.6392156863);--static-white-low:rgba(255, 255, 255, 0.3215686275);--static-white-lower:rgba(255, 255, 255, 0.1607843137);--static-white-lowest:rgba(255, 255, 255, 0.1215686275);--static-black:#000000;--static-black-medium:rgba(0, 0, 0, 0.6392156863);--static-black-low:rgba(0, 0, 0, 0.3215686275);--static-black-lower:rgba(0, 0, 0, 0.1607843137);--static-black-lowest:rgba(0, 0, 0, 0.1215686275);--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}:host{display:block;width:100%}:host .vds__dropdown--trigger{box-sizing:border-box;display:inline-flex;width:100%;text-align:left;align-items:center;justify-content:space-between;gap:0.25rem;align-self:stretch;border-radius:var(--radius-medium);border:none;box-shadow:0 0 0 0.0625rem inset var(--color-border-low);background:var(--surface-medium)}:host .vds__dropdown--trigger:active,:host .vds__dropdown--trigger:hover{cursor:pointer;box-shadow:0 0 0 0.0625rem inset var(--color-border-brand)}:host .vds__dropdown--trigger:focus-visible{outline:0.125rem solid var(--color-border-focus-2);outline-offset:0.125rem}:host .vds__dropdown--trigger.vds__dropdown--trigger--size-small{padding:var(--spacing-02) var(--spacing-03);height:var(--spacing-07)}:host .vds__dropdown--trigger.vds__dropdown--trigger--size-medium{padding:var(--spacing-03) var(--spacing-04);height:var(--spacing-10)}:host .vds__dropdown--trigger.vds__dropdown--trigger--size-large{padding:var(--spacing-04) var(--spacing-05);height:var(--spacing-13)}:host .vds__dropdown--trigger.vds__dropdown--trigger-error{box-shadow:0 0 0 0.0625rem inset var(--color-border-danger)}:host .vds__dropdown--trigger.vds__dropdown--trigger-error .vds__dropdown--value-label{color:var(--color-text-danger-medium)}:host .vds__dropdown--trigger.vds__dropdown--trigger--readonly{pointer-events:none;box-shadow:0 0 0 0.0625rem inset var(--color-border-low);background:var(--color-interaction-black-lowest)}:host .vds__dropdown--trigger.vds__dropdown--trigger--readonly:focus-visible{outline:none}:host .vds__dropdown--trigger.vds__dropdown--trigger--readonly .vds__dropdown--value-label{color:var(--color-text-medium)}:host .vds__dropdown--trigger.vds__dropdown--trigger-disabled{pointer-events:none;color:var(--color-text-disabled);box-shadow:0 0 0 0.0625rem inset var(--color-border-disabled);background:var(--surface-medium)}:host .vds__dropdown--trigger.vds__dropdown--trigger-disabled .vds__dropdown--value{color:var(--color-text-disabled)}:host .vds__dropdown--value{padding-right:var(--spacing-02);font-feature-settings:"clig" off, "liga" off;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .vds__dropdown--value-small{font-family:"Roboto Flex", sans-serif;font-size:0.75rem;font-weight:300;line-height:1rem;letter-spacing:normal}:host .vds__dropdown--value-medium{font-family:"Roboto Flex", sans-serif;font-size:0.875rem;font-weight:300;line-height:1.25rem;letter-spacing:normal}:host .vds__dropdown--value-large{font-family:"Roboto Flex", sans-serif;font-size:1rem;font-weight:300;line-height:1.5rem;letter-spacing:normal}:host .vds__dropdown--value-label{color:var(--color-text-high)}:host .vds__dropdown--value-placeholder{color:var(--color-text-medium)}:host .vds__dropdown--container{display:none;width:fit-content;min-width:max-content;max-height:fit-content !important;flex-direction:column;align-items:flex-start;align-self:stretch;border-radius:var(--radius-medium);background:var(--surface-medium);z-index:var(--elevation-layer-5);box-shadow:var(--elevation-shadow-2);box-sizing:border-box;border:0.0625rem solid var(--color-border-lowest)}:host .vds__dropdown--container.no-shadow{box-shadow:none;border:none}:host .vds__dropdown--container.has-scroll{padding-right:var(--spacing-01)}:host .vds__dropdown--container.match-width{width:var(--trigger-width);min-width:var(--trigger-width)}:host .vds-dropdown__content{overflow-y:auto;display:flex;flex-direction:column;border-radius:var(--radius-medium)}:host .vds-dropdown__content.scrollable{padding-right:var(--spacing-01)}:host .vds-dropdown__content::-webkit-scrollbar{background-color:var(--surface-medium);width:0.375rem}:host .vds-dropdown__content::-webkit-scrollbar-thumb{background-color:var(--color-background-neutral-press);border-radius:1rem}:host .vds__dropdown--left-content{display:inline-flex;column-gap:var(--spacing-02);align-items:center;overflow:hidden}:host .vds__dropdown--left-content .vds-dropdown__informative-icon{display:flex;align-items:center;justify-content:center}:host .vds__dropdown--trigger--size-large .vds__dropdown--left-content{column-gap:var(--spacing-03)}:host .vds__dropdown--right-actions{display:inline-flex;align-items:center;gap:var(--spacing-02)}:host .vds-basic-dropdown__container{display:block}:host .vds-floating-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--color-interaction-black-lower);opacity:0.06;z-index:var(--elevation-layer-4)}:host-context(.vds-basic-dropdown--disabled){pointer-events:none}`;
 const VdsBasicDropdown$1 = /*@__PURE__*/ proxyCustomElement(class VdsBasicDropdown extends HTMLElement {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.opened = createEvent(this, "opened", 7);
         this.closed = createEvent(this, "closed", 7);
@@ -32,7 +35,8 @@ const VdsBasicDropdown$1 = /*@__PURE__*/ proxyCustomElement(class VdsBasicDropdo
         this.showClearButton = true;
         /** Sets the width value for the floating container of the items to match the dropdown width */
         this.matchWidth = false;
-        /** Toggles the floating container auto-positioning based on available window space.
+        /**
+         * Toggles the floating container auto-positioning based on available window space.
          * False by default as it may cause positioning issues in some situations, use with caution
          */
         this.autoPosition = false;
@@ -60,6 +64,7 @@ const VdsBasicDropdown$1 = /*@__PURE__*/ proxyCustomElement(class VdsBasicDropdo
         }
     }
     setValueHandler() {
+        emitInputEvent(this.hostEl, this.value);
         unselectNonSelectedItems(this.dropdownContentElementRef, this.value);
         selectSelectedItems(this.dropdownContentElementRef, this.value);
         this.defineValue();
@@ -106,6 +111,8 @@ const VdsBasicDropdown$1 = /*@__PURE__*/ proxyCustomElement(class VdsBasicDropdo
     handleDropdownItemClicked(event) {
         this.handleSelection(event);
         this.valueChanged.emit(this.value);
+        const inputEvent = new InputEvent("input");
+        this.hostEl.dispatchEvent(inputEvent);
         this.dynamicInformativeIcon ? (this.informativeIcon = event.detail.icon) : null;
         this.close();
     }
@@ -205,7 +212,7 @@ const VdsBasicDropdown$1 = /*@__PURE__*/ proxyCustomElement(class VdsBasicDropdo
         }
     }
     componentDidRender() {
-        this.options = Array.from(this.hostEl.querySelectorAll("vds-dropdown-item"));
+        this.options = Array.from(this.hostEl.querySelectorAll('vds-dropdown-item'));
         updateFloatingBoxPosition(this.actionElementRef, this.dropdownContentElementRef, null, 'bottom', false);
         updateContainerWidth(this.actionElementRef, this.matchWidth, this.dropdownContentElementRef);
     }
@@ -221,7 +228,7 @@ const VdsBasicDropdown$1 = /*@__PURE__*/ proxyCustomElement(class VdsBasicDropdo
         (_a = this.actionElementRef) === null || _a === void 0 ? void 0 : _a.addEventListener('keydown', this.handleFloatingKeydown.bind(this));
         (_b = this.dropdownContentElementRef) === null || _b === void 0 ? void 0 : _b.addEventListener('keydown', this.handleFloatingKeydown.bind(this));
         if (!this.dropdownContentElementRef) {
-            this.dropdownContentElementRef = this.hostEl.shadowRoot.querySelector(".vds__dropdown--container");
+            this.dropdownContentElementRef = this.hostEl.shadowRoot.querySelector('.vds__dropdown--container');
         }
         if (this.value) {
             this.setPredefinedItem();
@@ -249,10 +256,10 @@ const VdsBasicDropdown$1 = /*@__PURE__*/ proxyCustomElement(class VdsBasicDropdo
     setListenerForChildren() {
         const config = {
             childList: true,
-            subtree: true
+            subtree: true,
         };
         this.observer = new MutationObserver(() => {
-            this.options = Array.from(this.hostEl.querySelectorAll("vds-dropdown-item"));
+            this.options = Array.from(this.hostEl.querySelectorAll('vds-dropdown-item'));
             forceUpdate(this);
         });
         this.observer.observe(this.hostEl, config);
@@ -262,14 +269,14 @@ const VdsBasicDropdown$1 = /*@__PURE__*/ proxyCustomElement(class VdsBasicDropdo
      * @returns string
      */
     getIconColor() {
-        return this.disabled ? 'color-icon-disabled' : 'color-icon-high';
+        return getIconColor(this.disabled, this.isReadonly);
     }
     setDropdownIcon() {
-        return (h("span", null, h("vds-icon", { svgIcon: this.dropdownOpened ? 'chevron-up' : 'chevron-down', color: this.disabled ? 'color-icon-disabled' : 'color-icon-high', size: getIconSize(this.size) })));
+        return h("vds-icon", { svgIcon: this.dropdownOpened ? 'chevron-up' : 'chevron-down', color: this.getIconColor(), size: getIconSize(this.size) });
     }
     setInformativeIcon() {
         if (this.informativeIcon) {
-            return (h("span", null, h("vds-icon", { class: "vds-dropdown__informative-icon", svgIcon: this.informativeIcon, color: this.getIconColor(), size: getIconSize(this.size) })));
+            return h("vds-icon", { class: 'vds-dropdown__informative-icon', svgIcon: this.informativeIcon, color: this.getIconColor(), size: getIconSize(this.size) });
         }
         else {
             return null;
@@ -280,26 +287,26 @@ const VdsBasicDropdown$1 = /*@__PURE__*/ proxyCustomElement(class VdsBasicDropdo
     }
     setClearValueButtonIcon() {
         if (this.value && this.valueLabel && this.showClearButton) {
-            return (h("span", null, h("vds-icon-button", { icon: "close", variant: "secondary", size: this.size, onClick: !this.disabled && !this.isReadonly
+            return (h("vds-icon-button", { icon: "close", variant: "secondary", size: getActionIconButtonSize(this.size), onClick: !this.disabled && !this.isReadonly
                     ? event => {
                         this.clearValue(event);
                     }
-                    : null, disabled: this.disabled || this.isReadonly, setAriaLabel: "clear" })));
+                    : null, disabled: this.disabled || this.isReadonly, setAriaLabel: "clear" }));
         }
         else {
             return null;
         }
     }
     render() {
-        return (h(Host, { key: '8aec128863f8c4adc5fca7bbbed5dffacb6b8451', class: combineClasses(this.disabled ? "vds-basic-dropdown--disabled" : ""), onClicked: event => this.handleDropdownItemClicked(event.detail) }, h("div", { key: 'd06c359d8395fda9079fdf6e1f90c16ba2d95834', class: "vds-basic-dropdown__container" }, h("button", { key: 'fd909d282c7b86aa78f3e386853bd34b76c19707', tabIndex: 0, disabled: this.disabled, value: this.value, class: combineClasses('vds__dropdown--trigger', this.disabled ? 'vds__dropdown--trigger-disabled' : '', this.error ? 'vds__dropdown--trigger-error' : '', `vds__dropdown--trigger--size-${this.size}`), onClick: (evt) => {
+        return (h(Host, { key: '616eedd8c799a2409d88874ba0758448edd0285d', class: combineClasses(this.disabled ? 'vds-basic-dropdown--disabled' : ''), onClicked: event => this.handleDropdownItemClicked(event.detail) }, h("div", { key: '2aabe96aaa92a9255e282883b280b09a8749baed', class: 'vds-basic-dropdown__container' }, h("button", { key: 'f3d0fcf355f30dd0c29bffb677937481c89515ae', tabIndex: 0, disabled: this.disabled, value: this.value, class: combineClasses('vds__dropdown--trigger', this.disabled ? 'vds__dropdown--trigger-disabled' : '', this.isReadonly ? 'vds__dropdown--trigger--readonly' : '', this.error ? 'vds__dropdown--trigger-error' : '', `vds__dropdown--trigger--size-${this.size}`), onClick: (evt) => {
                 this.handleClick(evt);
             }, ref: triggerEl => {
                 if (triggerEl)
                     this.actionElementRef = triggerEl;
-            } }, h("span", { key: '2848f9bc0db70b8e87c0fef709fd01b7424eb461', class: "vds__dropdown--left-content" }, this.setInformativeIcon(), this.setLabelValue()), h("span", { key: '643260effea4a2079f1fdb6bf7fee2af8f620af3', class: "vds__dropdown--right-actions" }, this.setClearValueButtonIcon(), this.setDropdownIcon())), this.backdrop && this.dropdownOpened ? h("div", { class: "vds-floating-backdrop", onClick: this.close.bind(this) }) : '', h("div", { key: '1fa1365e65f584ac54968825d480d73998e6c863', class: combineClasses('vds__dropdown--container', this.maxHeight ? 'has-scroll' : '', this.options.length === 0 ? "no-shadow" : ""), ref: dropdownEl => {
+            } }, h("span", { key: '539454912726ea7446220d9fa87c6e9bc5484acc', class: "vds__dropdown--left-content" }, this.setInformativeIcon(), this.setLabelValue()), h("span", { key: '5e0b393ef2558a1a7ef3a7769989dae2128654f8', class: "vds__dropdown--right-actions" }, this.setClearValueButtonIcon(), this.setDropdownIcon())), this.backdrop && this.dropdownOpened ? h("div", { class: "vds-floating-backdrop", onClick: this.close.bind(this) }) : '', h("div", { key: '0749713281a272b18799f399f5fbc5511e3c9407', class: combineClasses('vds__dropdown--container', this.maxHeight ? 'has-scroll' : '', this.options.length === 0 ? 'no-shadow' : ''), ref: dropdownEl => {
                 if (dropdownEl)
                     this.dropdownContentElementRef = dropdownEl;
-            } }, h("div", { key: '435d3f12c6ee95cc22a31dc4523f0f1b399b4b11', class: combineClasses('vds-dropdown__content', this.maxHeight ? 'scrollable' : ''), style: setDropdownStyles(this.maxHeight) }, h("slot", { key: '62a1f25cffa23e577fba89a2b02dd91a7c82f6f9' }))))));
+            } }, h("div", { key: 'fcb82abe92dc75927d15e40bdcd323addcb58bf2', class: combineClasses('vds-dropdown__content', this.maxHeight ? 'scrollable' : ''), style: setDropdownStyles(this.maxHeight) }, h("slot", { key: '6e0b66bbd2fda0dc66d43fd48b6a229440310b66' }))))));
     }
     static get formAssociated() { return true; }
     get hostEl() { return this; }
@@ -307,10 +314,10 @@ const VdsBasicDropdown$1 = /*@__PURE__*/ proxyCustomElement(class VdsBasicDropdo
         "dropdownOpened": ["emitValue"],
         "value": ["setValueHandler"]
     }; }
-    static get style() { return vdsBasicDropdownCss; }
-}, [65, "vds-basic-dropdown", {
+    static get style() { return vdsBasicDropdownCss(); }
+}, [321, "vds-basic-dropdown", {
         "size": [1025],
-        "value": [1025],
+        "value": [1537],
         "informativeIcon": [1025, "informative-icon"],
         "dynamicInformativeIcon": [1028, "dynamic-informative-icon"],
         "placeholder": [1025],
@@ -342,17 +349,17 @@ function defineCustomElement$1() {
     const components = ["vds-basic-dropdown", "vds-icon", "vds-icon-button"];
     components.forEach(tagName => { switch (tagName) {
         case "vds-basic-dropdown":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, VdsBasicDropdown$1);
+            if (!customElements.get(transformTag(tagName))) {
+                customElements.define(transformTag(tagName), VdsBasicDropdown$1);
             }
             break;
         case "vds-icon":
-            if (!customElements.get(tagName)) {
+            if (!customElements.get(transformTag(tagName))) {
                 defineCustomElement$3();
             }
             break;
         case "vds-icon-button":
-            if (!customElements.get(tagName)) {
+            if (!customElements.get(transformTag(tagName))) {
                 defineCustomElement$2();
             }
             break;

package/dist/components/vds-basic-dropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"vds-basic-dropdown.js","mappings":"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","names":["VdsBasicDropdown","__stencil_proxyCustomElement"],"sources":["src/components/basic-dropdown/vds-basic-dropdown.scss?tag=vds-basic-dropdown&encapsulation=shadow","src/components/basic-dropdown/vds-basic-dropdown.tsx"],"sourcesContent":["@import \"~@volt/volt-foundations/dist/volt-foundations/volt-foundations\";\n\n:host {\n display: block;\n width: 100%; \n .vds__dropdown--trigger{\n box-sizing: border-box;\n display: inline-flex;\n width: 100%;\n text-align: left;\n align-items: center;\n justify-content: space-between;\n gap: 0.25rem;\n align-self: stretch;\n border-radius: var(--radius-medium);\n border: none;\n box-shadow: 0 0 0 0.0625rem inset var(--color-border-low);\n background: var(--surface-medium);\n &:active, &:hover {\n cursor: pointer;\n box-shadow: 0 0 0 0.0625rem inset var(--color-border-brand);\n }\n\n &:focus-visible {\n outline: 0.125rem solid var(--color-border-focus-2);\n outline-offset: 0.125rem;\n }\n &.vds__dropdown--trigger--size-small {\n padding: var(--spacing-02) var(--spacing-03);\n height: var(--spacing-07);\n }\n &.vds__dropdown--trigger--size-medium {\n padding: var(--spacing-03) var(--spacing-04);\n height: var(--spacing-10);\n }\n &.vds__dropdown--trigger--size-large {\n padding: var(--spacing-04) var(--spacing-05);\n height: var(--spacing-13);\n }\n }\n .vds__dropdown--trigger-disabled{\n cursor: none;\n pointer-events: none;\n color: var(--color-text-disabled);\n box-shadow: 0 0 0 0.0625rem inset var(--color-border-disabled);\n background: var(--surface-medium);\n .vds__dropdown--value{\n color: var(--color-text-disabled);\n }\n }\n .vds__dropdown--trigger-error{\n box-shadow: 0 0 0 0.0625rem inset var(--color-border-danger);\n &:focus, &:active, &:hover {\n box-shadow: 0 0 0 0.0625rem inset var(--color-border-danger);\n } \n .vds__dropdown--value-label{\n color: var(--color-text-danger-medium);\n }\n }\n .vds__dropdown--value{\n padding-right: var(--spacing-02);\n font-feature-settings: 'clig' off, 'liga' off;\n overflow: hidden; \n text-overflow: ellipsis;\n white-space: nowrap;\n }\n .vds__dropdown--value-small{\n @include font-style(body, small);\n }\n .vds__dropdown--value-medium{\n @include font-style(body, medium);\n }\n .vds__dropdown--value-large{\n @include font-style(body, large);\n } \n .vds__dropdown--value-label{\n color: var(--color-text-high);\n } \n .vds__dropdown--value-placeholder{\n color: var(--color-text-medium);\n } \n .vds__dropdown--container {\n display: none;\n width: fit-content;\n min-width: max-content;\n max-height: fit-content !important;\n flex-direction: column;\n align-items: flex-start;\n align-self: stretch;\n border-radius: var(--radius-medium);\n background: var(--surface-medium);\n z-index: var(--elevation-layer-5);\n box-shadow: var(--elevation-shadow-2);\n box-sizing: border-box;\n border: 0.0625rem solid var(--color-border-lowest);\n &.no-shadow {\n box-shadow: none;\n border: none;\n }\n &.has-scroll {\n padding-right: var(--spacing-01);\n }\n &.match-width {\n width: var(--trigger-width);\n min-width: var(--trigger-width);\n }\n }\n .vds-dropdown__content {\n overflow-y: auto;\n display: flex;\n flex-direction: column;\n border-radius: var(--radius-medium);\n &.scrollable {\n padding-right: var(--spacing-01);\n }\n &::-webkit-scrollbar {\n background-color: var(--surface-medium);\n width: 0.375rem;\n }\n &::-webkit-scrollbar-thumb {\n background-color: var(--color-background-neutral-press);\n border-radius: 1rem;\n }\n }\n .vds__dropdown--left-content{\n display: inline-flex;\n column-gap: var(--spacing-02);\n align-items: center;\n overflow: hidden;\n .vds-dropdown__informative-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n }\n .vds__dropdown--trigger--size-large .vds__dropdown--left-content {\n column-gap: var(--spacing-03);\n }\n .vds__dropdown--right-actions{\n display: inline-flex;\n align-items: center;\n }\n .vds-basic-dropdown__container {\n display: block;\n }\n .vds-floating-backdrop {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: var(--color-interaction-black-lower);\n opacity: 0.06;\n z-index: var(--elevation-layer-4);\n }\n}\n\n:host-context(.vds-basic-dropdown--disabled) {\n pointer-events: none;\n}","import { Component, Host, Prop, h, Method, Listen, Element, Event, EventEmitter, State, Watch, AttachInternals, forceUpdate } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { updateFloatingBoxPosition } from '../../utils/floating-engine-utils';\nimport { DropdownItemClickedEvent } from '../dropdown-item/vds-dropdown-item-clicked-event';\nimport { getIconSize } from '../../utils/icon-attr.utils';\nimport { getSelectedLabel, scrollToSelectedValue, selectSelectedItems, setDropdownStyles, toggleContainerDisplay, unselectAllItems, unselectNonSelectedItems, updateContainerWidth } from './vds-basic-dropdown.utils';\n\n@Component({\n tag: 'vds-basic-dropdown',\n styleUrl: 'vds-basic-dropdown.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class VdsBasicDropdown {\n @Element() hostEl: HTMLElement;\n /** Sets the dropdown's size. /\n @Prop({ mutable: true }) size: 'small' \| 'medium' \| 'large' = 'medium';\n /* Sets the dropdown's value. /\n @Prop({ mutable: true }) value: string;\n /* Allows user to define a information icon to the left of the dropdown. /\n @Prop({ mutable: true }) informativeIcon: string;\n /* Allows dropdown-item informativeIcon reflect dynamically as informativeIcon of the dropdown. /\n @Prop({ mutable: true }) dynamicInformativeIcon: boolean = false;\n /* Sets the dropdown's placeholder. /\n @Prop({ mutable: true }) placeholder: string;\n /* Sets the dropdown in disabled state. /\n @Prop({ mutable: true }) disabled: boolean = false;\n /* Sets the dropdown in readonly state. /\n @Prop({ mutable: true }) isReadonly: boolean = false;\n /* Sets the dropdown in error state. /\n @Prop({ mutable: true, reflect: true }) error: boolean;\n /* Sets the dropdown's trigger event. /\n @Prop({ mutable: true }) event: 'click' \| 'hover' = 'click';\n /* Sets the dropdown's clear button visibility. /\n @Prop({ mutable: true }) showClearButton: boolean = true;\n /* Set the max height value for the floating container of the items /\n @Prop({ mutable: true }) maxHeight: string;\n /* Sets the width value for the floating container of the items to match the dropdown width /\n @Prop({ mutable: true }) matchWidth: boolean = false;\n /* Toggles the floating container auto-positioning based on available window space. \n * False by default as it may cause positioning issues in some situations, use with caution \n /\n @Prop({mutable: true}) autoPosition: boolean = false;\n /* Toggles the overlay element, allowing interaction only with this element when active /\n @Prop() backdrop: boolean = false;\n \n \n\n /* Emits event when floating element gets opens /\n @Event() opened: EventEmitter<void>;\n /* Emits event when floating element gets closes /\n @Event() closed: EventEmitter<void>;\n /* Emits event when an item is selected, this event contains the value of the selected item /\n @Event() valueChanged: EventEmitter<string>;\n /* Emits an event when the clear button is clicked /\n @Event() cleared: EventEmitter<boolean>;\n \n /* Dropdown's status. /\n @State() dropdownOpened: boolean = false;\n /* Dropdown's label of the current value. /\n @State() private valueLabel: string = undefined;\n\n @AttachInternals() internals: ElementInternals;\n\n private actionElementRef: HTMLButtonElement;\n private dropdownContentElementRef: HTMLDivElement;\n private defaultInformativeIcon: string;\n private options: HTMLVdsDropdownItemElement[] = [];\n\n private floatingCleanUp: () => void;\n observer: any;\n\n @Watch('dropdownOpened')\n async emitValue(): Promise<void> {\n if (this.dropdownOpened) {\n this.floatingCleanUp = await updateFloatingBoxPosition(this.actionElementRef, this.dropdownContentElementRef, null, 'bottom', this.autoPosition);\n toggleContainerDisplay(this.dropdownContentElementRef, true);\n if (this.value) {\n scrollToSelectedValue(this.dropdownContentElementRef, this.value);\n }\n this.opened.emit();\n } else {\n toggleContainerDisplay(this.dropdownContentElementRef, false);\n this.floatingCleanUp();\n this.closed.emit();\n }\n }\n\n @Watch('value')\n setValueHandler(): void {\n unselectNonSelectedItems(this.dropdownContentElementRef, this.value);\n selectSelectedItems(this.dropdownContentElementRef, this.value);\n this.defineValue();\n this.setFormValue();\n this.valueLabel = getSelectedLabel(this.dropdownContentElementRef, this.value);\n }\n \n private setFormValue(): void {\n if (this.internals && !!this.internals.setFormValue) {\n this.internals.setFormValue(this.value);\n }\n }\n\n / Close the floating element when click outside /\n @Listen('click', { target: 'window' })\n private handleClickOut(evt: MouseEvent): void {\n evt.stopPropagation();\n const isClickInside = this.hostEl.contains(evt.target as Node);\n if (!isClickInside) {\n this.close();\n }\n }\n\n / Close the floating element with keydown on the trigger element /\n private handleFloatingKeydown(event: KeyboardEvent): void {\n event.stopImmediatePropagation();\n if (event.key === 'Escape' \|\| event.key === 'Esc') {\n this.close();\n }\n }\n\n / Open the floating element with click on the trigger element /\n private handleClick(evt: Event): void {\n evt.stopImmediatePropagation();\n if (this.event === 'click') {\n const clickedElement = evt.target as HTMLElement;\n if (clickedElement && !this.disabled && !this.isReadonly) {\n this.dropdownOpened = !this.dropdownOpened;\n }\n }\n }\n / Clear selected value from the Dropdown /\n private clearValue(evt: Event): void {\n evt.stopImmediatePropagation();\n this.clear();\n this.close();\n }\n / Listen when Dropdown Item element is clicked to close Dropdown Items window /\n @Listen('dropdownItemClicked')\n private handleDropdownItemClicked(event: CustomEvent<DropdownItemClickedEvent>): void {\n this.handleSelection(event);\n this.valueChanged.emit(this.value);\n this.dynamicInformativeIcon ? (this.informativeIcon = event.detail.icon) : null;\n this.close();\n }\n\n / Checks if the item is already selected and if so clears the selection, otherwise sets the value /\n private handleSelection(event: CustomEvent<DropdownItemClickedEvent>): void {\n this.value = event.detail.value;\n this.valueLabel = event.detail.label;\n }\n\n / Open the floating element(menu) of the Dropdown. /\n @Method()\n public async open(): Promise<void> {\n this.dropdownOpened = true;\n }\n\n / Close the floating element(menu) of the Dropdown. /\n @Method()\n public async close(): Promise<void> {\n this.dropdownOpened = false;\n }\n / Clear the selected value from the Dropdown. /\n @Method()\n public async clear(): Promise<void> {\n this.value = null;\n this.valueLabel = null;\n this.valueChanged.emit(this.value);\n this.dynamicInformativeIcon ? (this.informativeIcon = this.defaultInformativeIcon) : null;\n unselectAllItems(this.dropdownContentElementRef);\n this.cleared.emit(true);\n }\n /\n Gets the target that will manage the menu\n * returns a promise with the target HTMLElement.\n /\n @Method()\n public async getTarget(): Promise<HTMLElement \| null> {\n return document.querySelector('.vds__dropdown--trigger') as HTMLElement;\n }\n /\n Gets the selected value of the dropdown\n * returns a promise with the value.\n /\n @Method()\n public async getValue(): Promise<String \| null> {\n return this.value;\n }\n\n /\n Set the value of the dropdown\n /\n @Method()\n public async setValue(value: string): Promise<void> {\n this.clear();\n this.value = value;\n }\n\n private handleHover(event: Event): void {\n const hoveredElement = event.target as HTMLElement;\n if (this.event === 'hover' && hoveredElement) {\n this.dropdownOpened = true;\n }\n }\n private handleHoverOut(event: Event): void {\n const hoveredElement = event.target as HTMLElement;\n if (this.event === 'hover' && hoveredElement) {\n this.close();\n }\n }\n\n private setPredefinedItem() {\n const slotElement = this.dropdownContentElementRef?.querySelector('slot');\n const items = typeof slotElement?.assignedElements === 'function' && slotElement?.assignedElements();\n let preselectedItem = Array.from(items \|\| []).filter(item => item.tagName.toLowerCase() === 'vds-dropdown-item' && item.getAttribute('value') === this.value)[0];\n if (preselectedItem) {\n preselectedItem.setAttribute('is-selected', 'true');\n preselectedItem.setAttribute('is-active', 'true');\n this.valueLabel = preselectedItem.getAttribute('label');\n }\n }\n\n private findAndSetPredefinedItem() {\n let getPreselectedItem = undefined;\n const slotElement = this.dropdownContentElementRef?.querySelector('slot');\n if (slotElement && typeof slotElement.assignedElements === 'function' && slotElement.assignedElements().length > 0) {\n getPreselectedItem = Array.from(slotElement.assignedElements()).find(\n item =>\n item.tagName.toLowerCase() === 'vds-dropdown-item' &&\n item.hasAttribute('is-selected') &&\n item.getAttribute('is-selected') === 'true' &&\n item.hasAttribute('is-active') &&\n item.getAttribute('is-active') === 'true',\n );\n }\n if (getPreselectedItem !== undefined) {\n this.value = getPreselectedItem.getAttribute('value');\n this.valueLabel = getPreselectedItem.getAttribute('label');\n }\n }\n\n private defineValue() {\n if (this.value && !this.valueLabel) {\n this.setPredefinedItem();\n }\n if (this.value) {\n this.findAndSetPredefinedItem();\n }\n }\n\n componentWillLoad() {\n if (this.dynamicInformativeIcon && this.defaultInformativeIcon === undefined) {\n this.defaultInformativeIcon = this.informativeIcon;\n }\n }\n\n componentDidRender() {\n this.options = Array.from(this.hostEl.querySelectorAll(\"vds-dropdown-item\"));\n updateFloatingBoxPosition(this.actionElementRef, this.dropdownContentElementRef, null, 'bottom', false);\n updateContainerWidth(this.actionElementRef, this.matchWidth, this.dropdownContentElementRef);\n }\n\n componentDidLoad() {\n if (this.event === 'click') {\n this.actionElementRef.addEventListener('click', this.handleClick.bind(this));\n } else if (this.event === 'hover') {\n this.actionElementRef.addEventListener('mouseenter', this.handleHover.bind(this));\n this.dropdownContentElementRef.addEventListener('mouseleave', this.handleHoverOut.bind(this));\n }\n this.actionElementRef?.addEventListener('keydown', this.handleFloatingKeydown.bind(this));\n this.dropdownContentElementRef?.addEventListener('keydown', this.handleFloatingKeydown.bind(this));\n if (!this.dropdownContentElementRef) {\n this.dropdownContentElementRef = this.hostEl.shadowRoot.querySelector(\".vds__dropdown--container\");\n }\n if (this.value) {\n this.setPredefinedItem();\n } else\n {\n this.findAndSetPredefinedItem();\n }\n this.setFormValue();\n this.setListenerForChildren();\n }\n\n disconnectedCallback() {\n window.removeEventListener('click', this.handleClickOut.bind(this));\n if (this.event === 'click') {\n this.actionElementRef.removeEventListener('click', this.handleClick.bind(this));\n } else if (this.event === 'hover') {\n this.actionElementRef.removeEventListener('mouseenter', this.handleHover.bind(this));\n this.dropdownContentElementRef.removeEventListener('mouseleave', this.handleHoverOut.bind(this));\n this.actionElementRef.removeEventListener('keydown', this.handleFloatingKeydown.bind(this));\n this.dropdownContentElementRef.removeEventListener('keydown', this.handleFloatingKeydown.bind(this));\n }\n\n this.observer?.disconnect();\n }\n\n private setListenerForChildren(): void {\n\t\tconst config = {\n\t\t\tchildList: true,\n\t\t\tsubtree: true\n\t\t};\n\n\t\tthis.observer = new MutationObserver(() => {\n\t\t\tthis.options = Array.from(this.hostEl.querySelectorAll(\"vds-dropdown-item\"));\n\t\t\tforceUpdate(this);\n\t\t});\n\n\t\tthis.observer.observe(this.hostEl, config);\n\t}\n\n /* Gets the icon color.\n \n @returns string\n */\n private getIconColor() {\n return this.disabled ? 'color-icon-disabled' : 'color-icon-high';\n }\n\n private setDropdownIcon() {\n return (\n <span>\n <vds-icon\n svgIcon={this.dropdownOpened ? 'chevron-up' : 'chevron-down'}\n color={this.disabled ? 'color-icon-disabled' : 'color-icon-high'}\n size={getIconSize(this.size)}\n ></vds-icon>\n </span>\n );\n }\n private setInformativeIcon() {\n if (this.informativeIcon) {\n return (\n <span>\n <vds-icon class={\"vds-dropdown__informative-icon\"} svgIcon={this.informativeIcon} color={this.getIconColor()} size={getIconSize(this.size)}></vds-icon>\n </span>\n );\n } else {\n return null;\n }\n }\n\n private setLabelValue() {\n return (\n <span\n class={combineClasses('vds__dropdown--value', 'vds__dropdown--value-' + this.size, 'vds__dropdown--value-' + (this.value && this.valueLabel ? 'label' : 'placeholder'))}\n >\n {this.value && this.valueLabel ? this.valueLabel : this.placeholder}\n </span>\n );\n }\n\n private setClearValueButtonIcon() {\n if (this.value && this.valueLabel && this.showClearButton) {\n return (\n <span>\n <vds-icon-button\n icon=\"close\"\n variant=\"secondary\"\n size={this.size}\n onClick={\n !this.disabled && !this.isReadonly\n ? event => {\n this.clearValue(event);\n }\n : null\n }\n disabled={this.disabled \|\| this.isReadonly}\n setAriaLabel=\"clear\"\n ></vds-icon-button>\n </span>\n );\n } else {\n return null;\n }\n }\n render() {\n return (\n <Host class={combineClasses(this.disabled ? \"vds-basic-dropdown--disabled\" : \"\")} onClicked={event => this.handleDropdownItemClicked(event.detail)}>\n <div class={\"vds-basic-dropdown__container\"}>\n <button\n tabIndex={0}\n disabled={this.disabled}\n value={this.value}\n class={combineClasses('vds__dropdown--trigger', this.disabled ? 'vds__dropdown--trigger-disabled' : '', this.error ? 'vds__dropdown--trigger-error' : '', `vds__dropdown--trigger--size-${this.size}`,)}\n onClick={(evt: MouseEvent) => {\n this.handleClick(evt);\n }}\n ref={triggerEl => {\n if (triggerEl) this.actionElementRef = triggerEl;\n }}\n >\n <span class=\"vds__dropdown--left-content\">\n {this.setInformativeIcon()}\n {this.setLabelValue()}\n </span>\n <span class=\"vds__dropdown--right-actions\">\n {this.setClearValueButtonIcon()}\n {this.setDropdownIcon()}\n </span>\n </button>\n {this.backdrop && this.dropdownOpened ? <div class=\"vds-floating-backdrop\" onClick={this.close.bind(this)}></div> : ''}\n <div\n class={combineClasses(\n 'vds__dropdown--container',\n this.maxHeight ? 'has-scroll' : '',\n this.options.length === 0 ? \"no-shadow\" : \"\"\n )}\n ref={dropdownEl => {\n if (dropdownEl) this.dropdownContentElementRef = dropdownEl;\n }}\n >\n <div class={combineClasses('vds-dropdown__content', this.maxHeight ? 'scrollable' : '')} style={setDropdownStyles(this.maxHeight)}>\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"vds-basic-dropdown.js","mappings":"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","names":["VdsBasicDropdown","__stencil_proxyCustomElement"],"sources":["src/components/basic-dropdown/vds-basic-dropdown.scss?tag=vds-basic-dropdown&encapsulation=shadow","src/components/basic-dropdown/vds-basic-dropdown.tsx"],"sourcesContent":["@import '~wabtec-internal-volt-foundations/dist/volt-foundations/volt-foundations';\n\n:host {\n display: block;\n width: 100%;\n .vds__dropdown--trigger {\n box-sizing: border-box;\n display: inline-flex;\n width: 100%;\n text-align: left;\n align-items: center;\n justify-content: space-between;\n gap: 0.25rem;\n align-self: stretch;\n border-radius: var(--radius-medium);\n border: none;\n box-shadow: 0 0 0 0.0625rem inset var(--color-border-low);\n background: var(--surface-medium);\n &:active,\n &:hover {\n cursor: pointer;\n box-shadow: 0 0 0 0.0625rem inset var(--color-border-brand);\n }\n &:focus-visible {\n outline: 0.125rem solid var(--color-border-focus-2);\n outline-offset: 0.125rem;\n }\n &.vds__dropdown--trigger--size-small {\n padding: var(--spacing-02) var(--spacing-03);\n height: var(--spacing-07);\n }\n &.vds__dropdown--trigger--size-medium {\n padding: var(--spacing-03) var(--spacing-04);\n height: var(--spacing-10);\n }\n &.vds__dropdown--trigger--size-large {\n padding: var(--spacing-04) var(--spacing-05);\n height: var(--spacing-13);\n }\n &.vds__dropdown--trigger-error {\n box-shadow: 0 0 0 0.0625rem inset var(--color-border-danger);\n .vds__dropdown--value-label {\n color: var(--color-text-danger-medium);\n }\n }\n &.vds__dropdown--trigger--readonly {\n pointer-events: none;\n box-shadow: 0 0 0 0.0625rem inset var(--color-border-low);\n background: var(--color-interaction-black-lowest);\n &:focus-visible {\n outline: none;\n }\n .vds__dropdown--value-label {\n color: var(--color-text-medium);\n }\n }\n &.vds__dropdown--trigger-disabled {\n pointer-events: none;\n color: var(--color-text-disabled);\n box-shadow: 0 0 0 0.0625rem inset var(--color-border-disabled);\n background: var(--surface-medium);\n .vds__dropdown--value {\n color: var(--color-text-disabled);\n }\n }\n }\n .vds__dropdown--value {\n padding-right: var(--spacing-02);\n font-feature-settings:\n 'clig' off,\n 'liga' off;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n .vds__dropdown--value-small {\n @include font-style(body, small);\n }\n .vds__dropdown--value-medium {\n @include font-style(body, medium);\n }\n .vds__dropdown--value-large {\n @include font-style(body, large);\n }\n .vds__dropdown--value-label {\n color: var(--color-text-high);\n }\n .vds__dropdown--value-placeholder {\n color: var(--color-text-medium);\n }\n .vds__dropdown--container {\n display: none;\n width: fit-content;\n min-width: max-content;\n max-height: fit-content !important;\n flex-direction: column;\n align-items: flex-start;\n align-self: stretch;\n border-radius: var(--radius-medium);\n background: var(--surface-medium);\n z-index: var(--elevation-layer-5);\n box-shadow: var(--elevation-shadow-2);\n box-sizing: border-box;\n border: 0.0625rem solid var(--color-border-lowest);\n &.no-shadow {\n box-shadow: none;\n border: none;\n }\n &.has-scroll {\n padding-right: var(--spacing-01);\n }\n &.match-width {\n width: var(--trigger-width);\n min-width: var(--trigger-width);\n }\n }\n .vds-dropdown__content {\n overflow-y: auto;\n display: flex;\n flex-direction: column;\n border-radius: var(--radius-medium);\n &.scrollable {\n padding-right: var(--spacing-01);\n }\n &::-webkit-scrollbar {\n background-color: var(--surface-medium);\n width: 0.375rem;\n }\n &::-webkit-scrollbar-thumb {\n background-color: var(--color-background-neutral-press);\n border-radius: 1rem;\n }\n }\n .vds__dropdown--left-content {\n display: inline-flex;\n column-gap: var(--spacing-02);\n align-items: center;\n overflow: hidden;\n .vds-dropdown__informative-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n }\n .vds__dropdown--trigger--size-large .vds__dropdown--left-content {\n column-gap: var(--spacing-03);\n }\n .vds__dropdown--right-actions {\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-02);\n }\n .vds-basic-dropdown__container {\n display: block;\n }\n .vds-floating-backdrop {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: var(--color-interaction-black-lower);\n opacity: 0.06;\n z-index: var(--elevation-layer-4);\n }\n}\n\n:host-context(.vds-basic-dropdown--disabled) {\n pointer-events: none;\n}\n","import { Component, Host, Prop, h, Method, Listen, Element, Event, EventEmitter, State, Watch, AttachInternals, forceUpdate } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { updateFloatingBoxPosition } from '../../utils/floating-engine-utils';\nimport { DropdownItemClickedEvent } from '../dropdown-item/vds-dropdown-item-clicked-event';\nimport { getIconSize, getIconColor, getActionIconButtonSize } from '../../utils/icon-attr.utils';\nimport {\n getSelectedLabel,\n scrollToSelectedValue,\n selectSelectedItems,\n setDropdownStyles,\n toggleContainerDisplay,\n unselectAllItems,\n unselectNonSelectedItems,\n updateContainerWidth,\n} from './vds-basic-dropdown.utils';\nimport { emitInputEvent } from '../../utils/form';\n\n@Component({\n tag: 'vds-basic-dropdown',\n styleUrl: 'vds-basic-dropdown.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class VdsBasicDropdown {\n @Element() hostEl: HTMLElement;\n /** Sets the dropdown's size. /\n @Prop({ mutable: true }) size: 'small' \| 'medium' \| 'large' = 'medium';\n /* Sets the dropdown's value. /\n @Prop({ mutable: true, reflect: true }) value: string;\n /* Allows user to define a information icon to the left of the dropdown. /\n @Prop({ mutable: true }) informativeIcon: string;\n /* Allows dropdown-item informativeIcon reflect dynamically as informativeIcon of the dropdown. /\n @Prop({ mutable: true }) dynamicInformativeIcon: boolean = false;\n /* Sets the dropdown's placeholder. /\n @Prop({ mutable: true }) placeholder: string;\n /* Sets the dropdown in disabled state. /\n @Prop({ mutable: true }) disabled: boolean = false;\n /* Sets the dropdown in readonly state. /\n @Prop({ mutable: true }) isReadonly: boolean = false;\n /* Sets the dropdown in error state. /\n @Prop({ mutable: true, reflect: true }) error: boolean;\n /* Sets the dropdown's trigger event. /\n @Prop({ mutable: true }) event: 'click' \| 'hover' = 'click';\n /* Sets the dropdown's clear button visibility. /\n @Prop({ mutable: true }) showClearButton: boolean = true;\n /* Set the max height value for the floating container of the items /\n @Prop({ mutable: true }) maxHeight: string;\n /* Sets the width value for the floating container of the items to match the dropdown width /\n @Prop({ mutable: true }) matchWidth: boolean = false;\n /\n Toggles the floating container auto-positioning based on available window space.\n * False by default as it may cause positioning issues in some situations, use with caution\n /\n @Prop({ mutable: true }) autoPosition: boolean = false;\n /* Toggles the overlay element, allowing interaction only with this element when active /\n @Prop() backdrop: boolean = false;\n\n /* Emits event when floating element gets opens /\n @Event() opened: EventEmitter<void>;\n /* Emits event when floating element gets closes /\n @Event() closed: EventEmitter<void>;\n /* Emits event when an item is selected, this event contains the value of the selected item /\n @Event() valueChanged: EventEmitter<string>;\n /* Emits an event when the clear button is clicked /\n @Event() cleared: EventEmitter<boolean>;\n\n /* Dropdown's status. /\n @State() dropdownOpened: boolean = false;\n /* Dropdown's label of the current value. /\n @State() private valueLabel: string = undefined;\n\n @AttachInternals() internals: ElementInternals;\n\n private actionElementRef: HTMLButtonElement;\n private dropdownContentElementRef: HTMLDivElement;\n private defaultInformativeIcon: string;\n private options: HTMLVdsDropdownItemElement[] = [];\n\n private floatingCleanUp: () => void;\n observer: any;\n\n @Watch('dropdownOpened')\n async emitValue(): Promise<void> {\n if (this.dropdownOpened) {\n this.floatingCleanUp = await updateFloatingBoxPosition(this.actionElementRef, this.dropdownContentElementRef, null, 'bottom', this.autoPosition);\n toggleContainerDisplay(this.dropdownContentElementRef, true);\n if (this.value) {\n scrollToSelectedValue(this.dropdownContentElementRef, this.value);\n }\n this.opened.emit();\n } else {\n toggleContainerDisplay(this.dropdownContentElementRef, false);\n this.floatingCleanUp();\n this.closed.emit();\n }\n }\n\n @Watch('value')\n setValueHandler(): void {\n emitInputEvent(this.hostEl, this.value);\n unselectNonSelectedItems(this.dropdownContentElementRef, this.value);\n selectSelectedItems(this.dropdownContentElementRef, this.value);\n this.defineValue();\n this.setFormValue();\n this.valueLabel = getSelectedLabel(this.dropdownContentElementRef, this.value);\n }\n\n private setFormValue(): void {\n if (this.internals && !!this.internals.setFormValue) {\n this.internals.setFormValue(this.value);\n }\n }\n\n / Close the floating element when click outside /\n @Listen('click', { target: 'window' })\n private handleClickOut(evt: MouseEvent): void {\n evt.stopPropagation();\n const isClickInside = this.hostEl.contains(evt.target as Node);\n if (!isClickInside) {\n this.close();\n }\n }\n\n / Close the floating element with keydown on the trigger element /\n private handleFloatingKeydown(event: KeyboardEvent): void {\n event.stopImmediatePropagation();\n if (event.key === 'Escape' \|\| event.key === 'Esc') {\n this.close();\n }\n }\n\n / Open the floating element with click on the trigger element /\n private handleClick(evt: Event): void {\n evt.stopImmediatePropagation();\n if (this.event === 'click') {\n const clickedElement = evt.target as HTMLElement;\n if (clickedElement && !this.disabled && !this.isReadonly) {\n this.dropdownOpened = !this.dropdownOpened;\n }\n }\n }\n\n / Clear selected value from the Dropdown /\n private clearValue(evt: Event): void {\n evt.stopImmediatePropagation();\n this.clear();\n this.close();\n }\n\n / Listen when Dropdown Item element is clicked to close Dropdown Items window /\n @Listen('dropdownItemClicked')\n private handleDropdownItemClicked(event: CustomEvent<DropdownItemClickedEvent>): void {\n this.handleSelection(event);\n this.valueChanged.emit(this.value);\n const inputEvent = new InputEvent(\"input\");\n this.hostEl.dispatchEvent(inputEvent);\n this.dynamicInformativeIcon ? (this.informativeIcon = event.detail.icon) : null;\n this.close();\n }\n\n / Checks if the item is already selected and if so clears the selection, otherwise sets the value /\n private handleSelection(event: CustomEvent<DropdownItemClickedEvent>): void {\n this.value = event.detail.value;\n this.valueLabel = event.detail.label;\n }\n\n / Open the floating element(menu) of the Dropdown. /\n @Method()\n public async open(): Promise<void> {\n this.dropdownOpened = true;\n }\n\n / Close the floating element(menu) of the Dropdown. /\n @Method()\n public async close(): Promise<void> {\n this.dropdownOpened = false;\n }\n\n / Clear the selected value from the Dropdown. /\n @Method()\n public async clear(): Promise<void> {\n this.value = null;\n this.valueLabel = null;\n this.valueChanged.emit(this.value);\n this.dynamicInformativeIcon ? (this.informativeIcon = this.defaultInformativeIcon) : null;\n unselectAllItems(this.dropdownContentElementRef);\n this.cleared.emit(true);\n }\n\n /\n Gets the target that will manage the menu\n * returns a promise with the target HTMLElement.\n /\n @Method()\n public async getTarget(): Promise<HTMLElement \| null> {\n return document.querySelector('.vds__dropdown--trigger') as HTMLElement;\n }\n\n /\n Gets the selected value of the dropdown\n * returns a promise with the value.\n /\n @Method()\n public async getValue(): Promise<String \| null> {\n return this.value;\n }\n\n /\n Set the value of the dropdown\n /\n @Method()\n public async setValue(value: string): Promise<void> {\n this.clear();\n this.value = value;\n }\n\n private handleHover(event: Event): void {\n const hoveredElement = event.target as HTMLElement;\n if (this.event === 'hover' && hoveredElement) {\n this.dropdownOpened = true;\n }\n }\n private handleHoverOut(event: Event): void {\n const hoveredElement = event.target as HTMLElement;\n if (this.event === 'hover' && hoveredElement) {\n this.close();\n }\n }\n\n private setPredefinedItem() {\n const slotElement = this.dropdownContentElementRef?.querySelector('slot');\n const items = typeof slotElement?.assignedElements === 'function' && slotElement?.assignedElements();\n let preselectedItem = Array.from(items \|\| []).filter(item => item.tagName.toLowerCase() === 'vds-dropdown-item' && item.getAttribute('value') === this.value)[0];\n if (preselectedItem) {\n preselectedItem.setAttribute('is-selected', 'true');\n preselectedItem.setAttribute('is-active', 'true');\n this.valueLabel = preselectedItem.getAttribute('label');\n }\n }\n\n private findAndSetPredefinedItem() {\n let getPreselectedItem = undefined;\n const slotElement = this.dropdownContentElementRef?.querySelector('slot');\n if (slotElement && typeof slotElement.assignedElements === 'function' && slotElement.assignedElements().length > 0) {\n getPreselectedItem = Array.from(slotElement.assignedElements()).find(\n item =>\n item.tagName.toLowerCase() === 'vds-dropdown-item' &&\n item.hasAttribute('is-selected') &&\n item.getAttribute('is-selected') === 'true' &&\n item.hasAttribute('is-active') &&\n item.getAttribute('is-active') === 'true',\n );\n }\n if (getPreselectedItem !== undefined) {\n this.value = getPreselectedItem.getAttribute('value');\n this.valueLabel = getPreselectedItem.getAttribute('label');\n }\n }\n\n private defineValue() {\n if (this.value && !this.valueLabel) {\n this.setPredefinedItem();\n }\n if (this.value) {\n this.findAndSetPredefinedItem();\n }\n }\n\n componentWillLoad() {\n if (this.dynamicInformativeIcon && this.defaultInformativeIcon === undefined) {\n this.defaultInformativeIcon = this.informativeIcon;\n }\n }\n\n componentDidRender() {\n this.options = Array.from(this.hostEl.querySelectorAll('vds-dropdown-item'));\n updateFloatingBoxPosition(this.actionElementRef, this.dropdownContentElementRef, null, 'bottom', false);\n updateContainerWidth(this.actionElementRef, this.matchWidth, this.dropdownContentElementRef);\n }\n\n componentDidLoad() {\n if (this.event === 'click') {\n this.actionElementRef.addEventListener('click', this.handleClick.bind(this));\n } else if (this.event === 'hover') {\n this.actionElementRef.addEventListener('mouseenter', this.handleHover.bind(this));\n this.dropdownContentElementRef.addEventListener('mouseleave', this.handleHoverOut.bind(this));\n }\n this.actionElementRef?.addEventListener('keydown', this.handleFloatingKeydown.bind(this));\n this.dropdownContentElementRef?.addEventListener('keydown', this.handleFloatingKeydown.bind(this));\n if (!this.dropdownContentElementRef) {\n this.dropdownContentElementRef = this.hostEl.shadowRoot.querySelector('.vds__dropdown--container');\n }\n if (this.value) {\n this.setPredefinedItem();\n } else {\n this.findAndSetPredefinedItem();\n }\n this.setFormValue();\n this.setListenerForChildren();\n }\n\n disconnectedCallback() {\n window.removeEventListener('click', this.handleClickOut.bind(this));\n if (this.event === 'click') {\n this.actionElementRef.removeEventListener('click', this.handleClick.bind(this));\n } else if (this.event === 'hover') {\n this.actionElementRef.removeEventListener('mouseenter', this.handleHover.bind(this));\n this.dropdownContentElementRef.removeEventListener('mouseleave', this.handleHoverOut.bind(this));\n this.actionElementRef.removeEventListener('keydown', this.handleFloatingKeydown.bind(this));\n this.dropdownContentElementRef.removeEventListener('keydown', this.handleFloatingKeydown.bind(this));\n }\n\n this.observer?.disconnect();\n }\n\n private setListenerForChildren(): void {\n const config = {\n childList: true,\n subtree: true,\n };\n\n this.observer = new MutationObserver(() => {\n this.options = Array.from(this.hostEl.querySelectorAll('vds-dropdown-item'));\n forceUpdate(this);\n });\n\n this.observer.observe(this.hostEl, config);\n }\n\n /* Gets the icon color.\n \n @returns string\n */\n private getIconColor() {\n return getIconColor(this.disabled, this.isReadonly);\n }\n\n private setDropdownIcon() {\n return <vds-icon svgIcon={this.dropdownOpened ? 'chevron-up' : 'chevron-down'} color={this.getIconColor()} size={getIconSize(this.size)}></vds-icon>;\n }\n\n private setInformativeIcon() {\n if (this.informativeIcon) {\n return <vds-icon class={'vds-dropdown__informative-icon'} svgIcon={this.informativeIcon} color={this.getIconColor()} size={getIconSize(this.size)}></vds-icon>;\n } else {\n return null;\n }\n }\n\n private setLabelValue() {\n return (\n <span\n class={combineClasses('vds__dropdown--value', 'vds__dropdown--value-' + this.size, 'vds__dropdown--value-' + (this.value && this.valueLabel ? 'label' : 'placeholder'))}\n >\n {this.value && this.valueLabel ? this.valueLabel : this.placeholder}\n </span>\n );\n }\n\n private setClearValueButtonIcon() {\n if (this.value && this.valueLabel && this.showClearButton) {\n return (\n <vds-icon-button\n icon=\"close\"\n variant=\"secondary\"\n size={getActionIconButtonSize(this.size)}\n onClick={\n !this.disabled && !this.isReadonly\n ? event => {\n this.clearValue(event);\n }\n : null\n }\n disabled={this.disabled \|\| this.isReadonly}\n setAriaLabel=\"clear\"\n ></vds-icon-button>\n );\n } else {\n return null;\n }\n }\n\n render() {\n return (\n <Host class={combineClasses(this.disabled ? 'vds-basic-dropdown--disabled' : '')} onClicked={event => this.handleDropdownItemClicked(event.detail)}>\n <div class={'vds-basic-dropdown__container'}>\n <button\n tabIndex={0}\n disabled={this.disabled}\n value={this.value}\n class={combineClasses(\n 'vds__dropdown--trigger',\n this.disabled ? 'vds__dropdown--trigger-disabled' : '',\n this.isReadonly ? 'vds__dropdown--trigger--readonly' : '',\n this.error ? 'vds__dropdown--trigger-error' : '',\n `vds__dropdown--trigger--size-${this.size}`,\n )}\n onClick={(evt: MouseEvent) => {\n this.handleClick(evt);\n }}\n ref={triggerEl => {\n if (triggerEl) this.actionElementRef = triggerEl;\n }}\n >\n <span class=\"vds__dropdown--left-content\">\n {this.setInformativeIcon()}\n {this.setLabelValue()}\n </span>\n <span class=\"vds__dropdown--right-actions\">\n {this.setClearValueButtonIcon()}\n {this.setDropdownIcon()}\n </span>\n </button>\n {this.backdrop && this.dropdownOpened ? <div class=\"vds-floating-backdrop\" onClick={this.close.bind(this)}></div> : ''}\n <div\n class={combineClasses('vds__dropdown--container', this.maxHeight ? 'has-scroll' : '', this.options.length === 0 ? 'no-shadow' : '')}\n ref={dropdownEl => {\n if (dropdownEl) this.dropdownContentElementRef = dropdownEl;\n }}\n >\n <div class={combineClasses('vds-dropdown__content', this.maxHeight ? 'scrollable' : '')} style={setDropdownStyles(this.maxHeight)}>\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/vds-basic-dropdown.utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"vds-basic-dropdown.utils.js","mappings":"AAAA;;;;;;;;AAQG;MACU,sBAAsB,GAAG,CAAC,UAAuB,EAAE,MAAe,KAAU;IACrF,IAAI,CAAC,UAAU,EAAE;QACb;;AAGJ,IAAA,UAAU,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM;AACxD;AAEA;;;;;AAKG;MACU,wBAAwB,GAAG,CAAC,eAA4B,EAAE,KAAwB,KAAI;IAC/F,IAAI,CAAC,eAAe,EAAE;QAClB;;IAGJ,MAAM,SAAS,GAAG,eAAe,CAAC,aAAa,CAAC,MAAM,CAAC;IACvD,MAAM,aAAa,GAAG,SAAS,IAAI,QAAO,SAAS,KAAT,IAAA,IAAA,SAAS,KAAT,MAAA,GAAA,MAAA,GAAA,SAAS,CAAE,gBAAgB,CAAC,KAAK,UAAU,GAAG,SAAS,CAAC,gBAAgB,EAAE,GAAG,IAAI;AAC3H,IAAA,KAAK,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,IAAI,IAAG;QAC3C,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,mBAAmB,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,KAAK,KAAK,EAAE;AACzH,YAAA,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,OAAO,CAAC;AACzC,YAAA,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,OAAO,CAAC;;AAE3C,QAAA,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,mBAAmB,IAAI,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,EAAE;AACjI,YAAA,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,OAAO,CAAC;AACzC,YAAA,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,OAAO,CAAC;;AAE/C,KAAC,CAAC;AACN;AAEA;;;;;AAKG;MACU,mBAAmB,GAAG,CAAC,eAA4B,EAAE,KAAwB,KAAI;IAC1F,IAAI,CAAC,eAAe,EAAE;QAClB;;AAEJ,IAAA,IAAI;QACA,MAAM,SAAS,GAAG,eAAe,CAAC,aAAa,CAAC,MAAM,CAAC;QACvD,MAAM,aAAa,GAAG,SAAS,IAAI,QAAO,SAAS,KAAT,IAAA,IAAA,SAAS,KAAT,MAAA,GAAA,MAAA,GAAA,SAAS,CAAE,gBAAgB,CAAC,KAAK,UAAU,GAAG,SAAS,CAAC,gBAAgB,EAAE,GAAG,IAAI;AAC3H,QAAA,KAAK,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,IAAI,IAAG;YAC3C,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,mBAAmB,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,KAAK,KAAK,EAAE;AACzH,gBAAA,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC;AACxC,gBAAA,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,MAAM,CAAC;;AAE1C,YAAA,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,mBAAmB,IAAI,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,EAAE;AACjI,gBAAA,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC;AACxC,gBAAA,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,MAAM,CAAC;;AAE9C,SAAC,CAAC;;IACJ,OAAO,KAAK,EAAE;AACZ,QAAA,OAAO,CAAC,IAAI,CAAC,uBAAuB,EAAE,KAAK,CAAC;;AAEpD;AAEA;;;;;AAKG;MACU,gBAAgB,GAAG,CAAC,eAA4B,EAAE,KAAa,KAAI;IAC5E,IAAI,CAAC,eAAe,EAAE;QAClB;;AAEJ,IAAA,IAAI;QACA,IAAI,QAAQ,GAAG,EAAE;QACjB,MAAM,SAAS,GAAG,eAAe,CAAC,aAAa,CAAC,MAAM,CAAC;QACvD,MAAM,aAAa,GAAG,SAAS,IAAI,QAAO,SAAS,KAAT,IAAA,IAAA,SAAS,KAAT,MAAA,GAAA,MAAA,GAAA,SAAS,CAAE,gBAAgB,CAAC,KAAK,UAAU,GAAG,SAAS,CAAC,gBAAgB,EAAE,GAAG,IAAI;AAC3H,QAAA,KAAK,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,IAAI,IAAG;YAC3C,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,mBAAmB,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,KAAK,KAAK,EAAE;AACzH,gBAAA,QAAQ,GAAG,CAAC,IAAmC,aAAnC,IAAI,KAAA,MAAA,GAAA,MAAA,GAAJ,IAAI,CAAiC,KAAK,MAAK,IAAmC,aAAnC,IAAI,KAAA,MAAA,GAAA,MAAA,GAAJ,IAAI,CAAiC,WAAW,CAAA;;AAEnH,SAAC,CAAC;AACF,QAAA,OAAO,QAAQ;;IACjB,OAAO,KAAK,EAAE;AACZ,QAAA,OAAO,CAAC,IAAI,CAAC,oBAAoB,EAAE,KAAK,CAAC;;AAEjD;MAEa,qBAAqB,GAAG,CAAC,eAA4B,EAAE,KAAwB,KAAI;IAC5F,IAAI,CAAC,eAAe,EAAE;QAClB;;AAEJ,IAAA,IAAI;QACA,MAAM,SAAS,GAAG,eAAe,CAAC,aAAa,CAAC,MAAM,CAAC;QACvD,MAAM,aAAa,GAAG,SAAS,IAAI,QAAO,SAAS,KAAT,IAAA,IAAA,SAAS,KAAT,MAAA,GAAA,MAAA,GAAA,SAAS,CAAE,gBAAgB,CAAC,KAAK,UAAU,GAAG,SAAS,CAAC,gBAAgB,EAAE,GAAG,IAAI;QAC3H,IAAI,YAAY,GAAmB,IAAI;AACvC,QAAA,KAAK,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,IAAI,IAAG;YAC3C,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,mBAAmB,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,KAAK,KAAK,EAAE;gBACzH,YAAY,GAAG,IAAI;;AAE3B,SAAC,CAAC;;AAGF,QAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,YAAY,EAAE;YAC3C,YAAY,CAAC,cAAc,CAAC;AACxB,gBAAA,QAAQ,EAAE,SAAS;AACnB,gBAAA,KAAK,EAAE,QAAQ;AACf,gBAAA,MAAM,EAAE,QAAQ;AACnB,aAAA,CAAC;;;IAER,OAAO,KAAK,EAAE;AACZ,QAAA,OAAO,CAAC,IAAI,CAAC,yBAAyB,EAAE,KAAK,CAAC;;AAEtD;AAEA;;;;;AAKG;MACU,oBAAoB,GAAG,CAAC,eAA4B,EAAE,KAAe,KAAc;IAC5F,IAAI,CAAC,eAAe,EAAE;AAClB,QAAA,OAAO,EAAE;;IAGb,MAAM,SAAS,GAAG,eAAe,CAAC,aAAa,CAAC,MAAM,CAAC;IACvD,MAAM,aAAa,GAAG,SAAS,IAAI,QAAO,SAAS,KAAT,IAAA,IAAA,SAAS,KAAT,MAAA,GAAA,MAAA,GAAA,SAAS,CAAE,gBAAgB,CAAC,KAAK,UAAU,GAAG,SAAS,CAAC,gBAAgB,EAAE,GAAG,IAAI;AAC3H,IAAA,OAAO,KAAK,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE;AACxB,SAAA,MAAM,CAAC,KAAK,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,mBAAmB,IAAI,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;AACzH,SAAA,GAAG,CAAC,IAAI,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;AACxD;AAEA;;;;;AAKG;AACU,MAAA,gBAAgB,GAAG,CAAC,eAA4B,KAAI;IAC7D,IAAI,CAAC,eAAe,EAAE;QAClB;;IAGJ,MAAM,SAAS,GAAG,eAAe,CAAC,aAAa,CAAC,MAAM,CAAC;IACvD,MAAM,aAAa,GAAG,SAAS,IAAI,QAAO,SAAS,KAAT,IAAA,IAAA,SAAS,KAAT,MAAA,GAAA,MAAA,GAAA,SAAS,CAAE,gBAAgB,CAAC,KAAK,UAAU,GAAG,SAAS,CAAC,gBAAgB,EAAE,GAAG,IAAI;AAC3H,IAAA,KAAK,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,IAAI,IAAG;AAC3C,QAAA,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,OAAO,CAAC;AACzC,QAAA,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,OAAO,CAAC;AAC3C,KAAC,CAAC;AACN;AAEA;;;;AAIG;AACU,MAAA,oBAAoB,GAAG,CAAC,MAAmB,KAAU;IAC9D,IAAI,CAAC,MAAM,EAAE;QACT;;AAGJ,IAAA,MAAM,UAAU,GAAG,IAAI,UAAU,CAAC,OAAO,CAAC;AAC1C,IAAA,MAAM,CAAC,aAAa,CAAC,UAAU,CAAC;AACpC;AAEA;;;;;;;;;AASG;AACI,MAAM,aAAa,GAAG,CAAC,eAA4B,EAAE,KAAa,KAAa;IAClF,IAAI,CAAC,eAAe,EAAE;QAClB;;IAGJ,MAAM,SAAS,GAAG,eAAe,CAAC,aAAa,CAAC,MAAM,CAAC;IACvD,MAAM,aAAa,GAAG,SAAS,IAAI,QAAO,SAAS,KAAT,IAAA,IAAA,SAAS,KAAT,MAAA,GAAA,MAAA,GAAA,SAAS,CAAE,gBAAgB,CAAC,KAAK,UAAU,GAAG,SAAS,CAAC,gBAAgB,EAAE,GAAG,IAAI;IAC3H,OAAO,KAAK,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,KAAK,KAAK,CAAC;AAC7F,CAAC;AAED;;;;;;;;;AASG;MACU,eAAe,GAAG,CAAC,MAAmB,EAAE,OAAiB,KAAc;IAChF,MAAM,YAAY,GAAG,EAAE;AACvB,IAAA,OAAO,CAAC,OAAO,CAAC,EAAE,IAAG;AACjB,QAAA,IAAI,aAAa,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE;AAC/B,YAAA,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC;;AAEzB,KAAC,CAAC;AACF,IAAA,OAAO,YAAY;AACvB;AAEA;;;;;AAKG;AACU,MAAA,iBAAiB,GAAG,CAAC,SAAiB,KAA+B;IAC9E,IAAI,MAAM,GAAG,EAAE;AAEf,IAAA,MAAM,GAAG;QACL,SAAS,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS;KAC/C;AAED,IAAA,OAAO,MAAM;AACjB;AAEA;;;;;;AAMG;AACU,MAAA,oBAAoB,GAAG,CAAC,eAA4B,EAAE,UAAmB,EAAE,eAA+B,KAAI;AACvH,IAAA,IAAI;AACA,QAAA,IAAI,UAAU,IAAI,eAAe,IAAI,eAAe,EAAE;AAClD,YAAA,MAAM,YAAY,GAAG,eAAe,CAAC,WAAW;YAChD,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,CAAG,EAAA,YAAY,CAAI,EAAA,CAAA,CAAC;AACzE,YAAA,eAAe,CAAC,SAAS,CAAC,GAAG,CAAC,aAAa,CAAC;;aACzC,IAAI,eAAe,EAAC;AACvB,YAAA,eAAe,CAAC,SAAS,CAAC,MAAM,CAAC,aAAa,CAAC;;;IAErD,OAAO,KAAK,EAAE;AACZ,QAAA,OAAO,CAAC,IAAI,CAAC,wBAAwB,EAAE,KAAK,CAAC;;AAErD;;;;","names":[],"sources":["src/components/basic-dropdown/vds-basic-dropdown.utils.ts"],"sourcesContent":["/*\n Toggles the display style of an HTML element.\n * \n * @param {HTMLElement} contentBox The HTML element to toggle the display for.\n * @param {boolean} toggle A boolean value to control the display. \n * - True: Sets the display to \"block\".\n * - False: Sets the display to \"none\".\n * @returns {void}\n /\nexport const toggleContainerDisplay = (contentBox: HTMLElement, toggle: boolean): void => {\n if (!contentBox) {\n return;\n }\n\n contentBox.style.display = toggle ? \"block\" : \"none\";\n}\n\n/\n Unselects non-selected items in a dropdown.\n \n @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]\|string} value The selected value or an array of selected values.\n /\nexport const unselectNonSelectedItems = (dropdownContent: HTMLElement, value: string[] \| string) => {\n if (!dropdownContent) {\n return;\n }\n\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n Array.from(dropdownItems \|\| []).forEach(item => {\n if (typeof value === \"string\" && item.tagName.toLowerCase() === \"vds-dropdown-item\" && item.getAttribute(\"value\") !== value) {\n item.setAttribute(\"is-selected\", \"false\");\n item.setAttribute(\"is-active\", \"false\");\n }\n if (Array.isArray(value) && item.tagName.toLowerCase() === \"vds-dropdown-item\" && value.some(v => v !== item.getAttribute(\"value\"))) {\n item.setAttribute(\"is-selected\", \"false\");\n item.setAttribute(\"is-active\", \"false\");\n }\n });\n}\n\n/\n Selects selected items in a dropdown.\n \n @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]\|string} value The selected value or an array of selected values.\n /\nexport const selectSelectedItems = (dropdownContent: HTMLElement, value: string[] \| string) => {\n if (!dropdownContent) {\n return;\n }\n try {\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n Array.from(dropdownItems \|\| []).forEach(item => {\n if (typeof value === \"string\" && item.tagName.toLowerCase() === \"vds-dropdown-item\" && item.getAttribute(\"value\") === value) {\n item.setAttribute(\"is-selected\", \"true\");\n item.setAttribute(\"is-active\", \"true\");\n }\n if (Array.isArray(value) && item.tagName.toLowerCase() === \"vds-dropdown-item\" && value.some(v => v === item.getAttribute(\"value\"))) {\n item.setAttribute(\"is-selected\", \"true\");\n item.setAttribute(\"is-active\", \"true\");\n }\n });\n } catch (error) {\n console.warn(\"[selectSelectedItems]\", error);\n }\n}\n\n/\n Gets selected label in single dropdown using value\n \n @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]\|string} value The selected value or an array of selected values.\n /\nexport const getSelectedLabel = (dropdownContent: HTMLElement, value: string) => {\n if (!dropdownContent) {\n return;\n }\n try {\n let response = \"\";\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n Array.from(dropdownItems \|\| []).forEach(item => {\n if (typeof value === \"string\" && item.tagName.toLowerCase() === \"vds-dropdown-item\" && item.getAttribute(\"value\") === value) {\n response = (item as HTMLVdsDropdownItemElement)?.label \|\| (item as HTMLVdsDropdownItemElement)?.textContent;\n }\n });\n return response;\n } catch (error) {\n console.warn(\"[getSelectedLabel]\", error);\n }\n}\n\nexport const scrollToSelectedValue = (dropdownContent: HTMLElement, value: string[] \| string) => {\n if (!dropdownContent) {\n return;\n }\n try {\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n let selectedItem: Element \| null = null;\n Array.from(dropdownItems \|\| []).forEach(item => {\n if (typeof value === \"string\" && item.tagName.toLowerCase() === \"vds-dropdown-item\" && item.getAttribute(\"value\") === value) {\n selectedItem = item;\n }\n });\n \n // Scroll to option when is single value\n if (typeof value === \"string\" && selectedItem) {\n selectedItem.scrollIntoView({\n behavior: \"instant\",\n block: \"center\",\n inline: \"center\",\n });\n }\n } catch (error) {\n console.warn(\"[ScrollToSelectedValue]\", error);\n }\n}\n\n/\n Gets thje selected text items in a dropdown.\n \n @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]\|string} value The selected value or an array of selected values.\n /\nexport const getSelectedItemsText = (dropdownContent: HTMLElement, value: string[]): string[] => {\n if (!dropdownContent) {\n return [];\n }\n\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n return Array.from(dropdownItems \|\| [])\n .filter(ditem => ditem.tagName.toLowerCase() === \"vds-dropdown-item\" && value.some(v => v === ditem.getAttribute(\"value\")))\n .map(item => item.getAttribute(\"label\"))\n}\n\n/\n Unselects all items in a dropdown.\n \n @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]\|string} value The selected value or an array of selected values.\n /\nexport const unselectAllItems = (dropdownContent: HTMLElement) => {\n if (!dropdownContent) {\n return;\n }\n\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n Array.from(dropdownItems \|\| []).forEach(item => {\n item.setAttribute(\"is-selected\", \"false\");\n item.setAttribute(\"is-active\", \"false\");\n });\n}\n\n/\n Emits a native \"input\" event on the specified host element.\n \n @param {HTMLElement} hostEl The host element to emit the event on.\n /\nexport const emitNativeInputEvent = (hostEl: HTMLElement): void => {\n if (!hostEl) {\n return;\n }\n\n const inputEvent = new InputEvent(\"input\");\n hostEl.dispatchEvent(inputEvent);\n}\n\n/\n Checks if a given value is a valid option within a dropdown content element.\n \n @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string} value The value to check for validity.\n * @returns {boolean} True if the value is a valid option, false otherwise.\n \n Validity criteria:\n * - The value must match the `value` attribute of at least one `vds-dropdown-item` element within the dropdown content.\n /\nexport const isValidOption = (dropdownContent: HTMLElement, value: string): boolean => {\n if (!dropdownContent) {\n return;\n }\n\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n return Array.from(dropdownItems \|\| []).some(item => item.getAttribute(\"value\") === value);\n}\n\n/\n Filters a list of options to only include those that are valid within a specified host element.\n \n @param {HTMLElement} hostEl The host element to validate options against.\n * @param {string[]} options The list of options to filter.\n * @returns {string[]} A new array containing only the valid options from the input list.\n \n Validity criteria:\n * - An option is considered valid if it matches the `value` attribute of at least one `vds-dropdown-item` element within the host element's dropdown content.\n /\nexport const getValidOptions = (hostEl: HTMLElement, options: string[]): string[] => {\n const validOptions = [];\n options.forEach(nv => {\n if (isValidOption(hostEl, nv)) {\n validOptions.push(nv);\n }\n })\n return validOptions;\n}\n\n/\n Sets dropdown styles for JSX.style property\n \n @param maxHeight string\n * @returns { [key: string]: string }\n /\nexport const setDropdownStyles = (maxHeight: string): { [key: string]: string } => {\n let styles = {};\n\n styles = {\n maxHeight: maxHeight ? maxHeight : undefined,\n }\n\n return styles;\n}\n\n/\n Updates the container width to match the trigger width when matchWidth is true.\n \n @param {HTMLElement} dropdownTrigger - The HTML button element that triggers the dropdown.\n * @param {boolean} matchWidth - A flag indicating whether to match the width of the dropdown content to the trigger.\n * @param {HTMLDivElement} dropdownContent - The dropdown content element whose width is to be updated.\n */\nexport const updateContainerWidth = (dropdownTrigger: HTMLElement, matchWidth: boolean, dropdownContent: HTMLDivElement) => {\n try {\n if (matchWidth && dropdownTrigger && dropdownContent) {\n const triggerWidth = dropdownTrigger.offsetWidth;\n dropdownContent.style.setProperty('--trigger-width', `${triggerWidth}px`);\n dropdownContent.classList.add('match-width');\n } else if (dropdownContent){\n dropdownContent.classList.remove('match-width');\n }\n } catch (error) {\n console.warn(\"[updateContainerWidth]\", error);\n }\n};"],"version":3}
1	+ {"file":"vds-basic-dropdown.utils.js","mappings":"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","names":[],"sources":["src/components/basic-dropdown/vds-basic-dropdown.utils.ts"],"sourcesContent":["/*\n Toggles the display style of an HTML element.\n * \n * @param {HTMLElement} contentBox The HTML element to toggle the display for.\n * @param {boolean} toggle A boolean value to control the display. \n * - True: Sets the display to \"block\".\n * - False: Sets the display to \"none\".\n * @returns {void}\n /\nexport const toggleContainerDisplay = (contentBox: HTMLElement, toggle: boolean): void => {\n if (!contentBox) {\n return;\n }\n\n contentBox.style.display = toggle ? \"block\" : \"none\";\n}\n\n/\n Unselects non-selected items in a dropdown.\n \n @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]\|string} value The selected value or an array of selected values.\n /\nexport const unselectNonSelectedItems = (dropdownContent: HTMLElement, value: string[] \| string) => {\n if (!dropdownContent) {\n return;\n }\n\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n Array.from(dropdownItems \|\| []).forEach(item => {\n if (typeof value === \"string\" && item.tagName.toLowerCase() === \"vds-dropdown-item\" && item.getAttribute(\"value\") !== value) {\n item.setAttribute(\"is-selected\", \"false\");\n item.setAttribute(\"is-active\", \"false\");\n }\n if (Array.isArray(value) && item.tagName.toLowerCase() === \"vds-dropdown-item\" && value.some(v => v !== item.getAttribute(\"value\"))) {\n item.setAttribute(\"is-selected\", \"false\");\n item.setAttribute(\"is-active\", \"false\");\n }\n });\n}\n\n/\n Selects selected items in a dropdown.\n \n @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]\|string} value The selected value or an array of selected values.\n /\nexport const selectSelectedItems = (dropdownContent: HTMLElement, value: string[] \| string) => {\n if (!dropdownContent) {\n return;\n }\n try {\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n Array.from(dropdownItems \|\| []).forEach(item => {\n if (typeof value === \"string\" && item.tagName.toLowerCase() === \"vds-dropdown-item\" && item.getAttribute(\"value\") === value) {\n item.setAttribute(\"is-selected\", \"true\");\n item.setAttribute(\"is-active\", \"true\");\n }\n if (Array.isArray(value) && item.tagName.toLowerCase() === \"vds-dropdown-item\" && value.some(v => v === item.getAttribute(\"value\"))) {\n item.setAttribute(\"is-selected\", \"true\");\n item.setAttribute(\"is-active\", \"true\");\n }\n });\n } catch (error) {\n console.warn(\"[selectSelectedItems]\", error);\n }\n}\n\n/\n Gets selected label in single dropdown using value\n \n @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]\|string} value The selected value or an array of selected values.\n /\nexport const getSelectedLabel = (dropdownContent: HTMLElement, value: string) => {\n if (!dropdownContent) {\n return;\n }\n try {\n let response = \"\";\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n Array.from(dropdownItems \|\| []).forEach(item => {\n if (typeof value === \"string\" && item.tagName.toLowerCase() === \"vds-dropdown-item\" && item.getAttribute(\"value\") === value) {\n response = (item as HTMLVdsDropdownItemElement)?.label \|\| (item as HTMLVdsDropdownItemElement)?.textContent;\n }\n });\n return response;\n } catch (error) {\n console.warn(\"[getSelectedLabel]\", error);\n }\n}\n\nexport const scrollToSelectedValue = (dropdownContent: HTMLElement, value: string[] \| string) => {\n if (!dropdownContent) {\n return;\n }\n try {\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n let selectedItem: Element \| null = null;\n Array.from(dropdownItems \|\| []).forEach(item => {\n if (typeof value === \"string\" && item.tagName.toLowerCase() === \"vds-dropdown-item\" && item.getAttribute(\"value\") === value) {\n selectedItem = item;\n }\n });\n \n // Scroll to option when is single value\n if (typeof value === \"string\" && selectedItem) {\n selectedItem.scrollIntoView({\n behavior: \"instant\",\n block: \"center\",\n inline: \"center\",\n });\n }\n } catch (error) {\n console.warn(\"[ScrollToSelectedValue]\", error);\n }\n}\n\n/\n Gets thje selected text items in a dropdown.\n \n @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]\|string} value The selected value or an array of selected values.\n /\nexport const getSelectedItemsText = (dropdownContent: HTMLElement, value: string[]): string[] => {\n if (!dropdownContent) {\n return [];\n }\n\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n return Array.from(dropdownItems \|\| [])\n .filter(ditem => ditem.tagName.toLowerCase() === \"vds-dropdown-item\" && value.some(v => v === ditem.getAttribute(\"value\")))\n .map(item => item.getAttribute(\"label\"))\n}\n\n/\n Unselects all items in a dropdown.\n \n @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string[]\|string} value The selected value or an array of selected values.\n /\nexport const unselectAllItems = (dropdownContent: HTMLElement) => {\n if (!dropdownContent) {\n return;\n }\n\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n Array.from(dropdownItems \|\| []).forEach(item => {\n item.setAttribute(\"is-selected\", \"false\");\n item.setAttribute(\"is-active\", \"false\");\n });\n}\n\n/\n Emits a native \"input\" event on the specified host element.\n \n @param {HTMLElement} hostEl The host element to emit the event on.\n /\nexport const emitNativeInputEvent = (hostEl: HTMLElement): void => {\n if (!hostEl) {\n return;\n }\n\n const inputEvent = new InputEvent(\"input\");\n hostEl.dispatchEvent(inputEvent);\n}\n\n/\n Checks if a given value is a valid option within a dropdown content element.\n \n @param {HTMLElement} dropdownContent The dropdown content element.\n * @param {string} value The value to check for validity.\n * @returns {boolean} True if the value is a valid option, false otherwise.\n \n Validity criteria:\n * - The value must match the `value` attribute of at least one `vds-dropdown-item` element within the dropdown content.\n /\nexport const isValidOption = (dropdownContent: HTMLElement, value: string): boolean => {\n if (!dropdownContent) {\n return;\n }\n\n const container = dropdownContent.querySelector(\"slot\");\n const dropdownItems = container && typeof(container?.assignedElements) === \"function\" ? container.assignedElements() : null;\n return Array.from(dropdownItems \|\| []).some(item => item.getAttribute(\"value\") === value);\n}\n\n/\n Filters a list of options to only include those that are valid within a specified host element.\n \n @param {HTMLElement} hostEl The host element to validate options against.\n * @param {string[]} options The list of options to filter.\n * @returns {string[]} A new array containing only the valid options from the input list.\n \n Validity criteria:\n * - An option is considered valid if it matches the `value` attribute of at least one `vds-dropdown-item` element within the host element's dropdown content.\n /\nexport const getValidOptions = (hostEl: HTMLElement, options: string[]): string[] => {\n const validOptions = [];\n options.forEach(nv => {\n if (isValidOption(hostEl, nv)) {\n validOptions.push(nv);\n }\n })\n return validOptions;\n}\n\n/\n Sets dropdown styles for JSX.style property\n \n @param maxHeight string\n * @returns { [key: string]: string }\n /\nexport const setDropdownStyles = (maxHeight: string): { [key: string]: string } => {\n let styles = {};\n\n styles = {\n maxHeight: maxHeight ? maxHeight : undefined,\n }\n\n return styles;\n}\n\n/\n Updates the container width to match the trigger width when matchWidth is true.\n \n @param {HTMLElement} dropdownTrigger - The HTML button element that triggers the dropdown.\n * @param {boolean} matchWidth - A flag indicating whether to match the width of the dropdown content to the trigger.\n * @param {HTMLDivElement} dropdownContent - The dropdown content element whose width is to be updated.\n */\nexport const updateContainerWidth = (dropdownTrigger: HTMLElement, matchWidth: boolean, dropdownContent: HTMLDivElement) => {\n try {\n if (matchWidth && dropdownTrigger && dropdownContent) {\n const triggerWidth = dropdownTrigger.offsetWidth;\n dropdownContent.style.setProperty('--trigger-width', `${triggerWidth}px`);\n dropdownContent.classList.add('match-width');\n } else if (dropdownContent){\n dropdownContent.classList.remove('match-width');\n }\n } catch (error) {\n console.warn(\"[updateContainerWidth]\", error);\n }\n};"],"version":3}