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

wabtec-internal-volt-basic-components 1.0.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 (1131) hide show

package/dist/volt-basic-components/p-d3b73a1b.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as o,c as a,h as t,H as r,a as e}from"./p-DTZC-zXo.js";import{c as i}from"./p-B23UkaEC.js";const c='@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__notification--container{display:flex;justify-content:space-between;gap:var(--spacing-03);padding:var(--spacing-04) var(--spacing-05) var(--spacing-04) var(--spacing-03);border-radius:var(--radius-medium);min-width:fit-content}:host .vds__notification--container-body{display:flex;gap:var(--spacing-03)}:host .vds__notification--information{display:flex;align-items:center;align-content:center;flex:1 1 auto;flex-wrap:wrap}:host .vds__notification--information.vds-notification__information--toast{flex-direction:column;align-items:start}:host .vds__notification--information.vds-notification__information--toast .vds__notification--message,:host .vds__notification--information.vds-notification__information--toast .vds__notification--title{width:100%}:host .vds__notification--information .vds__notification--title{font-family:"Roboto Flex", sans-serif;font-size:1rem;font-weight:600;line-height:1.5rem;letter-spacing:normal;padding-right:var(--spacing-02);align-self:flex-start}:host .vds__notification--information .vds__notification--title ::slotted(h1),:host .vds__notification--information .vds__notification--title ::slotted(h2),:host .vds__notification--information .vds__notification--title ::slotted(h3),:host .vds__notification--information .vds__notification--title ::slotted(h4),:host .vds__notification--information .vds__notification--title ::slotted(h5),:host .vds__notification--information .vds__notification--title ::slotted(h6){margin-block-start:0;margin-block-end:0;margin-inline-start:0;margin-inline-end:0}:host .vds__notification--information .vds__notification--message{flex:1 1 auto;overflow-wrap:break-word;font-family:"Roboto Flex", sans-serif;font-size:0.875rem;font-weight:300;line-height:1.25rem;letter-spacing:normal;color:var(--color-text-medium);box-sizing:border-box;min-height:var(--spacing-06)}:host .vds__notification--icon{align-self:flex-start}:host .vds__notification--content{display:flex;flex-direction:column}:host .vds__notification--content ::slotted([slot=actions]){padding-top:var(--spacing-07)}:host .vds__notification--actions{color:var(--color-text-medium);padding:var(--spacing-00) var(--spacing-03) var(--spacing-00) var(--spacing-05);align-self:flex-start;font-family:"Roboto Flex", sans-serif;font-size:0.875rem;font-weight:300;line-height:1.25rem;letter-spacing:normal}:host .vds__notification--actions.vds-notification__actions--toast{padding:var(--spacing-00)}:host .vds__notification--close-btn{color:var(--color-text-medium);padding:0;align-self:flex-start;display:flex}:host .vds__notification--status-informative{background-color:var(--color-background-information-lowest-default);box-shadow:inset 0 0 0 0.0625rem var(--color-border-information)}:host .vds__notification--status-informative .vds__notification--title{color:var(--color-text-information-high)}:host .vds__notification--status-warning{background-color:var(--color-background-warning-lowest-default);box-shadow:inset 0 0 0 0.0625rem var(--color-border-warning)}:host .vds__notification--status-warning .vds__notification--title{color:var(--color-text-warning-high)}:host .vds__notification--status-danger{background-color:var(--color-background-danger-lowest-default);box-shadow:inset 0 0 0 0.0625rem var(--color-border-danger)}:host .vds__notification--status-danger .vds__notification--title{color:var(--color-text-danger-high)}:host .vds__notification--status-healthy{background-color:var(--color-background-healthy-lowest-default);box-shadow:inset 0 0 0 0.0625rem var(--color-border-healthy)}:host .vds__notification--status-healthy .vds__notification--title{color:var(--color-text-healthy-high)}:host .vds__notification--status-custom{background-color:var(--notification-background);box-shadow:inset 0 0 0 0.0625rem var(--notification-border)}:host .vds-notification__close-area{display:flex}';const n=class{constructor(t){o(this,t);this.closed=a(this,"closed");this.variant="inline";this.status="informative";this.showCloseButton=true;this.removeOnClose=true;this.currentIcon=undefined;this.currentColor=undefined}setCustomBackground(o){return(o===null\|\|o===void 0?void 0:o.background)?{"--notification-background":`var(--${o.background})`}:{}}setCustomBorder(o){return(o===null\|\|o===void 0?void 0:o.border)?{"--notification-border":`var(--${o.border})`}:{}}setCustomIcon(o){return(o===null\|\|o===void 0?void 0:o.icon)?{"--notification-icon-color":`var(--${o.icon})`}:{}}setCustomColors(){const o=this.colors;if(!o){return null}return Object.assign(Object.assign(Object.assign({},this.setCustomBackground(o)),this.setCustomBorder(o)),this.setCustomIcon(o))}setIcon(){var o;switch(this.status){case"informative":this.currentIcon="information";this.currentColor="color-icon-information";break;case"danger":this.currentIcon="information";this.currentColor="color-icon-danger";break;case"warning":this.currentIcon="caution";this.currentColor="color-icon-warning";break;case"healthy":this.currentIcon="healthy";this.currentColor="color-icon-healthy";break;case"custom":this.currentIcon=this.icon;this.currentColor=((o=this.colors)===null\|\|o===void 0?void 0:o.icon)?this.colors.icon:null;break;default:this.currentIcon="unknown";this.currentColor="color-icon-information";break}}handleClose(){this.closed.emit();if(this.removeOnClose){this.hostEl.remove()}}async close(){this.handleClose()}showCloseBtn(){return this.showCloseButton?t("div",{class:"vds__notification--close-btn"},t("vds-icon-button",{size:"medium",variant:"secondary",icon:"close",setAriaLabel:"close",onClick:()=>this.handleClose()})):null}renderActions(){return t("div",{class:`vds__notification--actions ${this.variant==="toast"?"vds-notification__actions--toast":""}`},t("slot",{name:"actions"}))}render(){const o=this.colors?this.setCustomColors():null;this.setIcon();return t(r,{key:"34a9cc0d1aa39e81409fd7b002d358548e11365b",style:o},t("div",{key:"6804c9a9938e8ddc654b192b9a6c69db1f246157",class:i("vds__notification--container","vds__notification--status-"+this.status)},t("div",{key:"1cdb8e02d564d8fa67fcbc7dabede906cf259cbf",class:"vds__notification--container-body"},t("div",{key:"789fa386981325f569b6f2a47aa9522d0174b11f",class:"vds__notification--icon"},t("vds-icon",{key:"c0183258cded2a0cc2641bbf84785ce17771433d",size:"1.5rem",svgIcon:this.currentIcon,color:this.currentColor})),t("div",{key:"621a8a173b820030162db668b9279977b39e6885",class:"vds__notification--content"},t("div",{key:"61d004a8104ce79ef0ab5d207f8deba68b3f1182",class:`vds__notification--information ${this.variant==="toast"?"vds-notification__information--toast":""}`},t("div",{key:"bf48b7e1c1230a2f0f50de8cf2c0706bfe5a1343",class:"vds__notification--title"},t("slot",{key:"e6be9e59f243758191ac60280e388d915d196706",name:"header"})),t("div",{key:"66543b96d6ad825c841738157f0a7a97999f4cb4",class:"vds__notification--message"},t("slot",{key:"3c8be0959ecef894664edf0e054db783e054a5d8",name:"body"}))),this.variant==="toast"&&this.renderActions())),t("div",{key:"279a75abe9ad12f6c6cde6dfb7754e0ee35bc27e",class:"vds-notification__close-area"},this.variant==="inline"&&this.renderActions(),this.showCloseBtn())))}get hostEl(){return e(this)}};n.style=c;export{n as vds_notification};
2	+ //# sourceMappingURL=p-d3b73a1b.entry.js.map

package/dist/volt-basic-components/p-d3b73a1b.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["vdsNotificationCss","VdsNotification","constructor","hostRef","this","variant","status","showCloseButton","removeOnClose","currentIcon","undefined","currentColor","setCustomBackground","customization","background","setCustomBorder","border","setCustomIcon","icon","setCustomColors","colors","Object","assign","setIcon","_a","handleClose","closed","emit","hostEl","remove","close","showCloseBtn","h","class","size","setAriaLabel","onClick","renderActions","name","render","custom","Host","key","style","combineClasses","svgIcon","color"],"sources":["src/components/notification/vds-notification.scss?tag=vds-notification&encapsulation=shadow","src/components/notification/vds-notification.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n .vds__notification--container {\n display: flex;\n justify-content: space-between;\n gap: var(--spacing-03);\n padding: var(--spacing-04) var(--spacing-05) var(--spacing-04) var(--spacing-03);\n border-radius: var(--radius-medium);\n min-width: fit-content;\n }\n .vds__notification--container-body {\n display: flex;\n gap: var(--spacing-03);\n }\n .vds__notification--information{\n display: flex;\n align-items: center;\n align-content: center;\n flex: 1 1 auto;\n flex-wrap: wrap;\n\n &.vds-notification__information--toast {\n flex-direction: column;\n align-items: start;\n .vds__notification--message,\n .vds__notification--title {\n width: 100%;\n }\n }\n .vds__notification--title{ \n @include font-style(title, medium);\n padding-right: var(--spacing-02);\n align-self: flex-start;\n ::slotted(h1),\n ::slotted(h2),\n ::slotted(h3),\n ::slotted(h4),\n ::slotted(h5),\n ::slotted(h6) {\n margin-block-start: 0;\n margin-block-end: 0;\n margin-inline-start: 0;\n margin-inline-end: 0;\n }\n }\n .vds__notification--message{\n flex: 1 1 auto;\n overflow-wrap: break-word;\n @include font-style(body, medium);\n color: var(--color-text-medium);\n box-sizing: border-box;\n min-height: var(--spacing-06);\n }\n }\n .vds__notification--icon{\n align-self: flex-start;\n }\n .vds__notification--content{\n display: flex;\n flex-direction: column;\n\n ::slotted([slot=\"actions\"]) {\n padding-top: var(--spacing-07);\n }\n }\n .vds__notification--actions{\n color: var(--color-text-medium);\n padding: var(--spacing-00) var(--spacing-03) var(--spacing-00) var(--spacing-05);\n align-self: flex-start;\n @include font-style(body, medium);\n\n &.vds-notification__actions--toast {\n padding: var(--spacing-00);\n }\n }\n .vds__notification--close-btn{\n color: var(--color-text-medium);\n padding: 0;\n align-self: flex-start;\n display: flex;\n }\n .vds__notification--status-informative{\n background-color: var(--color-background-information-lowest-default);\n box-shadow: inset 0 0 0 0.0625rem var(--color-border-information);\n .vds__notification--title{\n color: var(--color-text-information-high);\n }\n }\n .vds__notification--status-warning{\n background-color: var(--color-background-warning-lowest-default);\n box-shadow: inset 0 0 0 0.0625rem var(--color-border-warning);\n .vds__notification--title{\n color: var(--color-text-warning-high);\n }\n }\n .vds__notification--status-danger{\n background-color: var(--color-background-danger-lowest-default);\n box-shadow: inset 0 0 0 0.0625rem var(--color-border-danger);\n\n .vds__notification--title{\n color: var(--color-text-danger-high);\n }\n }\n .vds__notification--status-healthy{\n background-color: var(--color-background-healthy-lowest-default);\n box-shadow: inset 0 0 0 0.0625rem var(--color-border-healthy);\n .vds__notification--title{\n color: var(--color-text-healthy-high);\n }\n }\n .vds__notification--status-custom{\n background-color: var(--notification-background);\n box-shadow: inset 0 0 0 0.0625rem var(--notification-border);\n }\n .vds-notification__close-area {\n display: flex;\n }\n}","import { Component, Host, h, Prop, State,Element, Event, EventEmitter, Method } from '@stencil/core';\nimport { HTMLStencilElement } from '@stencil/core/internal';\nimport { Colors } from '../../definitions/colors';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { NotificationsCustomColors, NotificationStatus } from './vds-notification-utils';\n\n@Component({\n tag: 'vds-notification',\n styleUrl: 'vds-notification.scss',\n shadow: true,\n})\nexport class VdsNotification {\n/** Define variant of the notification */\n@Prop({mutable: true}) variant: \"toast\" | \"inline\" = \"inline\";\n/** Define status type of the notification */\n@Prop({mutable: true}) status: NotificationStatus = \"informative\";\n/** Define custom status color of notification */\n@Prop({mutable: true}) colors?: NotificationsCustomColors;\n/** Define custom Icon for the notification */ \n@Prop({mutable: true}) icon?: string;\n/** Show / Hide the notification close button */\n@Prop({mutable: true}) showCloseButton: boolean = true;\n/** When set to true, the element will be removed from DOM when pressing the close button. */\n@Prop({mutable: true}) removeOnClose: boolean = true;\n\n@State() currentIcon: string = undefined;\n@State() currentColor: Colors = undefined;\n\n@Element() hostEl: HTMLElement;\n\n/** Emits event when popover gets closed */\n@Event() closed: EventEmitter<void>;\n\n\nprivate setCustomBackground(customization): { [key: string]: string } {\n return customization?.background ? { '--notification-background': `var(--${customization.background})` } : {};\n}\n\nprivate setCustomBorder(customization): { [key: string]: string } {\n return customization?.border ? { '--notification-border': `var(--${customization.border})` } : {};\n}\nprivate setCustomIcon(customization): { [key: string]: string } {\n return customization?.icon ? { '--notification-icon-color': `var(--${customization.icon})` } : {};\n}\nprivate setCustomColors(): { [key: string]: string } {\n const customization = this.colors;\n if (!customization) {\n return null;\n }\n return {\n ...this.setCustomBackground(customization),\n ...this.setCustomBorder(customization),\n ...this.setCustomIcon(customization)\n };\n}\n\nprivate setIcon(){\n switch (this.status) {\n case 'informative':\n this.currentIcon = 'information';\n this.currentColor = \"color-icon-information\";\n break;\n case 'danger':\n this.currentIcon = 'information';\n this.currentColor= 'color-icon-danger';\n break;\n case 'warning':\n this.currentIcon = 'caution';\n this.currentColor= 'color-icon-warning';\n break;\n case 'healthy':\n this.currentIcon = 'healthy';\n this.currentColor= 'color-icon-healthy';\n break;\n case 'custom':\n this.currentIcon = this.icon;\n this.currentColor= this.colors?.icon? this.colors.icon : null;\n break;\n default:\n this.currentIcon = 'unknown';\n this.currentColor= 'color-icon-information';\n break;\n }\n}\n\nprivate handleClose(){\n this.closed.emit();\n if (this.removeOnClose) {\n this.hostEl.remove();\n }\n}\n/* Close the Notification from other element */ \n@Method()\npublic async close(): Promise<void> {\n this.handleClose();\n}\n\nprivate showCloseBtn(){\n return (this.showCloseButton ?\n (<div class=\"vds__notification--close-btn\">\n <vds-icon-button \n size=\"medium\" \n variant=\"secondary\" \n icon='close'\n setAriaLabel='close'\n onClick={() => this.handleClose()}\n > \n </vds-icon-button>\n </div>)\n :null);\n}\n private renderActions(): HTMLStencilElement {\n return (\n <div\n class={`vds__notification--actions ${this.variant === \"toast\" ? \"vds-notification__actions--toast\" : \"\"}`}\n >\n <slot name=\"actions\"></slot>\n </div>\n );\n }\n\nrender(): HTMLStencilElement {\n const custom = this.colors? this.setCustomColors() : null;\n this.setIcon();\n\n return (\n <Host style={custom}>\n <div class={combineClasses(\n 'vds__notification--container',\n 'vds__notification--status-'+ this.status,\n )}\n >\n <div class={\"vds__notification--container-body\"}>\n <div class=\"vds__notification--icon\">\n <vds-icon size=\"1.5rem\" svgIcon={this.currentIcon} color={this.currentColor}></vds-icon>\n </div>\n <div class=\"vds__notification--content\">\n <div class={`vds__notification--information ${this.variant === \"toast\" ? \"vds-notification__information--toast\" : \"\"}`}>\n <div class=\"vds__notification--title\">\n <slot name=\"header\"></slot>\n </div>\n <div class=\"vds__notification--message\">\n <slot name=\"body\"></slot>\n </div>\n </div>\n {this.variant === \"toast\" && this.renderActions()}\n </div>\n </div>\n <div class=\"vds-notification__close-area\">\n {this.variant === \"inline\" && this.renderActions()}\n {this.showCloseBtn()}\n </div>\n </div>\n </Host>\n );\n}\n}"],"mappings":"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","ignoreList":[]}

package/dist/volt-basic-components/p-da70a993.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as o,c as t,h as e,H as a,a as r}from"./p-DTZC-zXo.js";import{c as i}from"./p-B23UkaEC.js";import{c as s,t as c}from"./p-BMJUPaKN.js";import{u as l}from"./p-BqkUBR_p.js";import{c as n}from"./p-CqHfuEQc.js";import{g as d}from"./p-C1rbpvgj.js";const h=(o,t,e=false)=>{try{return o.filter((o=>{var a,r,i;if(e){return((a=o.textContent)===null\|\|a===void 0?void 0:a.includes(t))\|\|((r=o.value)===null\|\|r===void 0?void 0:r.includes(t))\|\|((i=o.label)===null\|\|i===void 0?void 0:i.includes(t))}return g(o,t)}))}catch(o){console.warn("[getFilteredOptions]",o);return[]}};const g=(o,t)=>{var e,a,r;try{const i=(t===null\|\|t===void 0?void 0:t.toLowerCase())\|\|"";return o.textContent&&((e=o.textContent)===null\|\|e===void 0?void 0:e.toLowerCase().includes(i))\|\|o.label&&((a=o.label)===null\|\|a===void 0?void 0:a.toLowerCase().includes(i))\|\|o.value&&((r=o.value)===null\|\|r===void 0?void 0:r.toLowerCase().includes(i))}catch(o){console.warn("[findOptionByValue]",o);return false}};const b=(o,t)=>{var e,a,r;try{const i=(t===null\|\|t===void 0?void 0:t.toLowerCase())\|\|"";return o.textContent&&((e=o.textContent)===null\|\|e===void 0?void 0:e.toLowerCase())===i\|\|o.label&&((a=o.label)===null\|\|a===void 0?void 0:a.toLowerCase())===i\|\|o.value&&((r=o.value)===null\|\|r===void 0?void 0:r.toLowerCase())===i}catch(o){console.warn("[findOptionByValue]",o);return false}};const u='@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;--vds-basic-autocomplete-input-min-width:7.5rem;--vds-basic-autocomplete-input-min-width-large:9.25rem}:host .vds-basic-autocomplete__container{display:flex;flex-direction:column;gap:1rem}:host .vds-basic-autocomplete__container vds-basic-input{--vds-input-min-width:var(--vds-basic-autocomplete-input-min-width);--vds-input-min-width-large:var(--vds-basic-autocomplete-input-min-width-large)}:host .vds-basic-autocomplete__container .vds-basic-autocomplete__content{display:none;flex-direction:column;align-items:flex-start;align-self:stretch;min-width:max-content;max-height:fit-content !important;border-radius:var(--radius-medium);background:var(--surface-medium);box-shadow:var(--elevation-shadow-2);box-sizing:border-box;border:0.0625rem solid var(--color-border-lowest);margin-top:0.25rem;z-index:var(--elevation-layer-5)}:host .vds-basic-autocomplete__container .vds-basic-autocomplete__content.no-shadow{box-shadow:none;border:none}:host .vds-basic-autocomplete__container .vds-basic-autocomplete__content.no-shadow .vds-basic-autocomplete__content__header{box-shadow:var(--elevation-shadow-2)}:host .vds-basic-autocomplete__container .vds-basic-autocomplete__content.has-scroll{padding-right:var(--spacing-01)}:host .vds-basic-autocomplete__container .vds-basic-autocomplete__content.match-width{width:var(--trigger-width);min-width:var(--trigger-width)}:host .vds-basic-autocomplete__container .vds-basic-autocomplete__content .vds-basic-autocomplete__content-options{overflow-y:auto;display:flex;flex-direction:column;border-radius:var(--radius-medium)}:host .vds-basic-autocomplete__container .vds-basic-autocomplete__content .vds-basic-autocomplete__content-options.scrollable{padding-right:var(--spacing-01)}:host .vds-basic-autocomplete__container .vds-basic-autocomplete__content .vds-basic-autocomplete__content-options::-webkit-scrollbar{background-color:var(--surface-medium);width:0.375rem}:host .vds-basic-autocomplete__container .vds-basic-autocomplete__content .vds-basic-autocomplete__content-options::-webkit-scrollbar-thumb{background-color:var(--color-background-neutral-press);border-radius:1rem}:host .vds-basic-autocomplete__container .vds-basic-autocomplete__primary-action,:host .vds-basic-autocomplete__container .vds-basic-autocomplete__secondary-action{display:inline-flex;align-items:center}: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 .non-clickable{pointer-events:none}:host(.vds-basic-autocomplete--disabled){pointer-events:none}';const f=class{constructor(e){o(this,e);this.opened=t(this,"opened");this.closed=t(this,"closed");this.valueChanged=t(this,"valueChanged");this.cleared=t(this,"cleared");this.actionIconClick=t(this,"actionIconClick");this.changeInput=t(this,"changeInput");this.size="medium";this.multipleValues=[];this.selectedDropdownValue="";this.isRequired=false;this.allowedStyles=[];this.matchWidth=true;this.actionIcon="zoom";this.showClearButton=true;this.dropdown=false;this.showDropdownIcon=true;this.showEmptyMessage=false;this.emptyMessage="No options";this.multiple=false;this.autoPosition=false;this.clearSelection=false;this.backdrop=false;this.floatingCleanUp=()=>{};this.isOpened=false;this.options=[];this.debounceTimeTracker=null;this.showUnfilteredOptions=false;this.updateContainerWidth=s;this.setAutoCompleteStyles=o=>{let t={};t={maxHeight:o?o:undefined};return t}}componentWillLoad(){this.multiselectValues=this.multipleValues;this.validateDropdownValue=true}componentWillRender(){if(this.multiple){this.dropdown=false}}componentDidLoad(){this.options=Array.from(this.hostEl.querySelectorAll("vds-autocomplete-item"));this.setPreselection()}componentDidRender(){this.options=Array.from(this.hostEl.querySelectorAll("vds-autocomplete-item"));l(this.basicInput,this.autocompleteContent,null,"bottom",false);this.updateContainerWidth(this.basicInput,this.matchWidth,this.autocompleteContent);this.setPreselection()}setMulitpleValueHandler(){this.valueChanged.emit(this.multiselectValues)}setDisabledState(){this.close()}setDropdownValueValidation(){this.validateDropdownValue=true}async toggleAutocomplete(){if(this.isOpened){c(this.autocompleteContent,true);this.opened.emit();this.floatingCleanUp=await l(this.basicInput,this.autocompleteContent,null,"bottom",this.autoPosition)}else{c(this.autocompleteContent,false);this.closed.emit();this.floatingCleanUp()}}async open(){if(!this.isReadonly&&!this.disabled){setTimeout((()=>{this.isOpened=true}))}}async close(){this.isOpened=false}async setFocus(){this.basicInput.setFocus();setTimeout((()=>{this.open()}))}async setValue(o){this.value=o}async setSelectionValue(o){if(this.multiple&&Array.isArray(o)){this.multipleValues=this.multiselectValues=o}if(typeof o==="string"){if(this.dropdown){this.selectedDropdownValue=o}this.value=o}}async getValue(){if(this.multiple){return this.multipleValues}if(this.dropdown){return this.selectedDropdownValue}return this.value}async clear(){this.value="";if(this.dropdown){this.clearOptions()}if(this.clearSelection&&this.multiple){this.multipleValues=this.multiselectValues=[];this.setOptionsMultiple()}this.cleared.emit()}handleSelectOption(o){const t=this.options.find((t=>b(t,o.detail.value)));const e=t!==null&&t!==undefined;if(e&&this.multiple){t.isSelected=o.detail.selected}this.handleValueAssignment(o);if(e&&this.dropdown){this.setOptionsSingle(o.detail.value)}}handleClickOut(o){o.stopPropagation();const t=o.target;const e=this.hostEl.contains(t);const a=t.nodeName==="VDS-AUTOCOMPLETE"&&t.shadowRoot&&o.target.shadowRoot.contains(this.hostEl);if(!e&&!a){this.isOpened=false}}handleEscPress(o){if(this.isOpened&&o.code==="Escape"){this.close();this.basicInput.blur()}}handleMultiselection(o){if(o.selected&&!this.multipleValues.find((t=>t.toLowerCase()===o.value.toLowerCase()))){this.multipleValues.push(o.value)}else{this.multipleValues=this.multipleValues.filter((t=>t.toLowerCase()!==o.value.toLowerCase()))}this.multiselectValues=Array.from(this.multipleValues);this.basicInput.setFocus()}handleValueAssignment(o){if(this.multiple){this.handleMultiselection(o.detail)}else{this.value=o.detail.value;this.setSelectionValue(o.detail.value);this.valueChanged.emit(this.value);this.close()}}handleChange(o){o.stopPropagation();this.changeInput.emit(o.detail);if(this.debounce!==undefined&&this.debounce>0){this.handleDebounceValueChange(o.detail)}else{this.value=o.detail}if(this.dropdown){this.showUnfilteredOptions=false}}hasFocus(){this.open();if(this.hasValue()&&this.dropdown){this.showUnfilteredOptions=true;this.validateDropdownValue=false}}lostFocus(){if(this.dropdown){this.showUnfilteredOptions=false;this.validateDropdownValue=true}}emitActionIcon(){this.actionIconClick.emit()}handleDebounceValueChange(o){if(this.debounceTimeTracker!==null){clearTimeout(this.debounceTimeTracker);this.debounceTimeTracker=null}this.debounceTimeTracker=setTimeout((()=>{this.value=o;this.debounceTimeTracker=null}),this.debounce)}hasValue(){return this.value!==null&&this.value!==undefined&&this.value!=="undefined"&&this.value!==""}setPreselection(){if(this.multiple){this.setOptionsMultiple()}if(this.dropdown){this.setDropdownOption()}}setOptionsMultiple(){try{this.options.forEach((o=>{var t;o.hasCheckmark=true;const e=(t=this.multipleValues)===null\|\|t===void 0?void 0:t.find((t=>b(o,t)));o.isSelected=!!e}))}catch(o){console.warn("[setOptionsMultiple]",o)}}setOptionsSingle(o){try{this.selectedDropdownValue=o;this.options.forEach((o=>{o.hasCheckmark=false;o.isSelected=b(o,this.selectedDropdownValue)}))}catch(o){console.warn("[setOptionsSingle]",o)}}setDropdownOption(){var o;try{const t=(o=this.options)===null\|\|o===void 0?void 0:o.some((o=>b(o,this.selectedDropdownValue)));if(t&&this.selectedDropdownValue!==undefined&&this.selectedDropdownValue!=="undefined"&&this.selectedDropdownValue!==""){this.setOptionsSingle(this.selectedDropdownValue);if(this.validateDropdownValue){this.value=this.selectedDropdownValue;this.validateDropdownValue=false}}}catch(o){console.warn("[setOptionsMultiple]",o)}}clearOptions(){try{this.selectedDropdownValue=null;this.options.forEach((o=>{o.hasCheckmark=o.isSelected=false}))}catch(o){console.warn("[clearOptions]",o)}}renderUnfilteredOptions(){return e("div",{class:i("vds-basic-autocomplete__content-options",this.maxHeight?"scrollable":""),style:this.setAutoCompleteStyles(this.maxHeight)},e("slot",{name:"items"}),e("slot",null))}renderItem(o){var t;let a=false;if(this.multiple){a=(t=this.multipleValues)===null\|\|t===void 0?void 0:t.some((t=>g(o,t)))}return e("vds-autocomplete-item",Object.assign({isSelected:a,hasCheckmark:this.multiple},n(o),{innerHTML:o.innerHTML}))}renderFilteredOptions(){const o=this.hasValue()?this.value:"";const t=h(this.options,o);if(t.length===0){return this.showEmptyMessage&&this.emptyMessage?this.renderEmptyOption():null}return e("div",{class:i("vds-basic-autocomplete__content-options",this.maxHeight?"scrollable":""),style:this.setAutoCompleteStyles(this.maxHeight)},t.map((o=>this.renderItem(o))))}renderEmptyOption(){if(!this.autocompleteItemEmptyOption){this.autocompleteItemEmptyOption=document.createElement("vds-autocomplete-item");this.autocompleteItemEmptyOption.classList.add("non-clickable");this.autocompleteItemEmptyOption.value="";this.autocompleteItemEmptyOption.setAttribute("value","")}this.autocompleteItemEmptyOption.setAttribute("size",this.size);this.autocompleteItemEmptyOption.setAttribute("label",this.emptyMessage);return this.renderItem(this.autocompleteItemEmptyOption)}renderClearIcon(){const o=this.disabled\|\|this.isReadonly;return e("vds-icon-button",{tabIndex:o?-1:undefined,disabled:o,variant:"secondary",size:this.size==="medium"?"small":this.size==="small"?"extra-small":"medium",icon:"close",onClick:o?undefined:()=>{this.clear();this.basicInput.setFocus()}})}renderActionIcon(){const o=this.disabled\|\|this.isReadonly;if(this.dropdown&&this.showDropdownIcon){return e("vds-icon",{svgIcon:this.isOpened?"chevron-up":"chevron-down",color:o?"color-icon-disabled":"color-icon-high",size:d(this.size),onClick:o?undefined:()=>this.isOpened?this.close():this.open()})}if(this.actionIcon){return e("vds-icon-button",{tabIndex:o?-1:undefined,disabled:o,variant:"secondary",size:this.size==="medium"?"small":this.size==="small"?"extra-small":"medium",icon:this.actionIcon,onClick:o?undefined:()=>this.emitActionIcon()})}}renderOptions(){if(this.dropdown&&this.showUnfilteredOptions){return this.renderUnfilteredOptions()}if(this.hasValue()){return this.renderFilteredOptions()}return this.renderUnfilteredOptions()}render(){const o=h(this.options,this.value\|\|"");return e(a,{key:"9b035fb33aa14173337829378d0b4024d30e6358",class:this.disabled?"vds-basic-autocomplete--disabled":"",title:this.value},e("div",{key:"3d19e70ce7783ab0b6dc46e1405e1223505db622",class:i("vds-basic-autocomplete__container")},e("vds-basic-input",{key:"d7235b7b4cf781dbe72d6076f080e3f2e0ef1e31",ref:o=>{if(o){this.basicInput=o}},type:"text",placeholder:this.placeholder,value:this.value,size:this.size,disabled:this.disabled,isReadonly:this.isReadonly,error:this.error,isRequired:this.isRequired,formatter:this.formatter,informativeIcon:this.informativeIcon,allowedStyles:this.allowedStyles,onChangeInput:o=>this.handleChange(o),onFocus:()=>this.hasFocus(),onBlur:()=>this.lostFocus()},this.showClearButton&&this.hasValue()&&e("div",{key:"637bd881af823a444595ff826b2aa6521452e020",class:"vds-basic-autocomplete__secondary-action",slot:"secondaryActionIcon"},this.renderClearIcon()),(this.dropdown&&this.showDropdownIcon\|\|this.actionIcon)&&e("div",{key:"2042f0659fdaad6855f797b6b79596a90b77bec1",class:"vds-basic-autocomplete__primary-action",slot:"primaryActionIcon"},this.renderActionIcon())),this.backdrop&&this.isOpened?e("div",{class:"vds-floating-backdrop",onClick:this.close.bind(this)}):"",e("div",{key:"4f0893d4476df5bc5723127528101dac34c0d697",ref:o=>{if(o)this.autocompleteContent=o},class:i("vds-basic-autocomplete__content",this.maxHeight?"has-scroll":"",(!this.emptyMessage\|\|this.emptyMessage==="")&&o.length===0?"no-shadow":"",!this.showEmptyMessage&&o.length===0?"no-shadow":"",!this.value&&this.options.length===0?"no-shadow":"")},e("div",{key:"33047b025c6d88f2ff8bf550f4a6090ebf198ec0",class:"vds-basic-autocomplete__content__header"},e("slot",{key:"55ce34e7e2233e14a819a1c79288f3ffa5550ebe",name:"header"})),this.renderOptions())))}get hostEl(){return r(this)}static get watchers(){return{multiselectValues:["setMulitpleValueHandler"],disabled:["setDisabledState"],selectedDropdownValue:["setDropdownValueValidation"],isOpened:["toggleAutocomplete"]}}};f.style=u;export{f as vds_basic_autocomplete};
2	+ //# sourceMappingURL=p-da70a993.entry.js.map

package/dist/volt-basic-components/p-da70a993.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["getFilteredOptions","options","value","validateCasing","filter","item","_a","textContent","includes","_b","_c","label","findOptionByValue","error","console","warn","option","searchValue","lowerCaseSearchValue","toLowerCase","findOptionByExactValue","vdsBasicAutocompleteCss","VdsBasicAutocomplete","constructor","hostRef","this","size","multipleValues","selectedDropdownValue","isRequired","allowedStyles","matchWidth","actionIcon","showClearButton","dropdown","showDropdownIcon","showEmptyMessage","emptyMessage","multiple","autoPosition","clearSelection","backdrop","floatingCleanUp","isOpened","debounceTimeTracker","showUnfilteredOptions","updateContainerWidth","setAutoCompleteStyles","maxHeight","styles","undefined","componentWillLoad","multiselectValues","validateDropdownValue","componentWillRender","componentDidLoad","Array","from","hostEl","querySelectorAll","setPreselection","componentDidRender","updateFloatingBoxPosition","basicInput","autocompleteContent","setMulitpleValueHandler","valueChanged","emit","setDisabledState","close","setDropdownValueValidation","toggleAutocomplete","toggleContainerDisplay","opened","closed","open","isReadonly","disabled","setTimeout","setFocus","setValue","setSelectionValue","isArray","getValue","clear","clearOptions","setOptionsMultiple","cleared","handleSelectOption","evt","selectedOption","find","detail","isValidOption","isSelected","selected","handleValueAssignment","setOptionsSingle","handleClickOut","stopPropagation","target","isClickInside","contains","isClickInsideParentAutocomplete","nodeName","shadowRoot","handleEscPress","code","blur","handleMultiselection","selection","push","handleChange","changeInput","debounce","handleDebounceValueChange","hasFocus","hasValue","lostFocus","emitActionIcon","actionIconClick","newValue","clearTimeout","setDropdownOption","forEach","hasCheckmark","selectedValue","hasValidValue","some","opt","renderUnfilteredOptions","h","class","combineClasses","style","name","renderItem","Object","assign","cloneAttributes","innerHTML","renderFilteredOptions","filteredOptions","length","renderEmptyOption","map","autocompleteItemEmptyOption","document","createElement","classList","add","setAttribute","renderClearIcon","tabIndex","variant","icon","onClick","renderActionIcon","svgIcon","color","getIconSize","renderOptions","render","Host","key","title","ref","el","type","placeholder","formatter","informativeIcon","onChangeInput","onFocus","onBlur","slot","bind"],"sources":["src/components/autocomplete/vds-basic-autocomplete.utils.ts","src/components/autocomplete/vds-basic-autocomplete.scss?tag=vds-basic-autocomplete&encapsulation=shadow","src/components/autocomplete/vds-basic-autocomplete.tsx"],"sourcesContent":["export const getFilteredOptions = (options: HTMLVdsAutocompleteItemElement[], value: string, validateCasing: boolean = false) => {\n try {\n return options.filter(item => {\n if (validateCasing) {\n return (item.textContent?.includes(value) || item.value?.includes(value) || item.label?.includes(value));\n }\n return findOptionByValue(item, value);\n });\n } catch (error) {\n console.warn(\"[getFilteredOptions]\", error);\n return [];\n }\n}\n\n/**\n * Checks if an option object matches the given search value.\n * @param {Object} option - The option object to be checked in a HTMLVdsAutocompleteItemElement\n * @param {string} searchValue - The value to search for within the option.\n * @returns {boolean} - \n * True if the searchValue is found within the option's `textContent`, `label`, or `value`.\n * False otherwise.\n */\nexport const findOptionByValue = (option: HTMLVdsAutocompleteItemElement, searchValue: string): boolean => {\n try {\n const lowerCaseSearchValue = searchValue?.toLowerCase() || \"\";\n return (\n option.textContent && option.textContent?.toLowerCase().includes(lowerCaseSearchValue) ||\n option.label && option.label?.toLowerCase().includes(lowerCaseSearchValue) ||\n option.value && option.value?.toLowerCase().includes(lowerCaseSearchValue)\n );\n }catch (error) {\n console.warn(\"[findOptionByValue]\", error);\n return false;\n }\n};\n\n/**\n * Checks if an option object matches the given search value exactly.\n * @param {Object} option - The option object to be checked in a HTMLVdsAutocompleteItemElement\n * @param {string} searchValue - The value to search for within the option.\n * @returns {boolean} - \n * True if the searchValue is exactly the same to one of the option's `textContent`, `label`, or `value`.\n * False otherwise.\n */\nexport const findOptionByExactValue = (option: HTMLVdsAutocompleteItemElement, searchValue: string): boolean => {\n try {\n const lowerCaseSearchValue = searchValue?.toLowerCase() || \"\";\n return (\n option.textContent && option.textContent?.toLowerCase() === lowerCaseSearchValue ||\n option.label && option.label?.toLowerCase() === lowerCaseSearchValue ||\n option.value && option.value?.toLowerCase() === lowerCaseSearchValue\n );\n }catch (error) {\n console.warn(\"[findOptionByValue]\", error);\n return false;\n }\n};",":host {\n display: block;\n \n --vds-basic-autocomplete-input-min-width: 7.5rem;\n --vds-basic-autocomplete-input-min-width-large: 9.25rem;\n\n .vds-basic-autocomplete__container {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n\n vds-basic-input {\n --vds-input-min-width: var(--vds-basic-autocomplete-input-min-width);\n --vds-input-min-width-large: var(--vds-basic-autocomplete-input-min-width-large);\n }\n\n .vds-basic-autocomplete__content {\n display: none;\n flex-direction: column;\n align-items: flex-start;\n align-self: stretch;\n min-width: max-content;\n max-height: fit-content !important;\n border-radius: var(--radius-medium);\n background: var(--surface-medium);\n box-shadow: var(--elevation-shadow-2);\n box-sizing: border-box;\n border: 0.0625rem solid var(--color-border-lowest);\n margin-top: 0.25rem;\n z-index: var(--elevation-layer-5);\n\n &.no-shadow {\n box-shadow: none;\n border: none;\n\n .vds-basic-autocomplete__content__header {\n box-shadow: var(--elevation-shadow-2);\n }\n }\n\n &.has-scroll {\n padding-right: var(--spacing-01);\n }\n\n &.match-width {\n width: var(--trigger-width);\n min-width: var(--trigger-width);\n }\n\n .vds-basic-autocomplete__content-options {\n overflow-y: auto;\n display: flex;\n flex-direction: column;\n border-radius: var(--radius-medium);\n\n &.scrollable {\n padding-right: var(--spacing-01);\n }\n\n &::-webkit-scrollbar {\n background-color: var(--surface-medium);\n width: 0.375rem;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: var(--color-background-neutral-press);\n border-radius: 1rem;\n }\n }\n }\n\n .vds-basic-autocomplete__primary-action,\n .vds-basic-autocomplete__secondary-action {\n display: inline-flex;\n align-items: center;\n }\n }\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 .non-clickable {\n pointer-events: none;\n }\n}\n\n:host(.vds-basic-autocomplete--disabled) {\n pointer-events: none;\n}","import { Component, Host, Prop, Watch, h, Event, EventEmitter, Method, State, Element } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { toggleContainerDisplay, updateContainerWidth } from '../basic-dropdown/vds-basic-dropdown.utils';\nimport { updateFloatingBoxPosition } from '../../utils/floating-engine-utils';\nimport { HTMLStencilElement, Listen } from '@stencil/core/internal';\nimport { cloneAttributes } from '../../utils/clone-attributes';\nimport { findOptionByExactValue, findOptionByValue, getFilteredOptions } from './vds-basic-autocomplete.utils';\nimport { getIconSize } from '../../utils/icon-attr.utils';\n\n@Component({\n tag: 'vds-basic-autocomplete',\n styleUrl: 'vds-basic-autocomplete.scss',\n shadow: true,\n})\nexport class VdsBasicAutocomplete {\n\n /** \n * Sets the internal input size.\n * If multiple property is true, This will only set the basic-input text value.\n * If multiple property is false and the value prop matches with an option, the option will be selected,\n * Otherwise text will be set in the basic-input.\n */\n @Prop({ mutable: true }) size: \"small\" | \"medium\" | \"large\" = \"medium\";\n /** Sets the internal input value */\n @Prop({ mutable: true, reflect: true }) value: string;\n /** Sets the selected options when multiple is activated */\n @Prop({ mutable: true, reflect: true }) multipleValues: Array<string> = [];\n /** Sets the selected dropdown value when dropdown is activated */\n @Prop() selectedDropdownValue = \"\";\n /** Sets the internal input placeholder. */\n @Prop({ mutable: true, reflect: true }) placeholder: string;\n /** Sets the internal input in disabled state. */\n @Prop({ mutable: true, reflect: true }) disabled: boolean;\n /** Sets the internal input in readonly state. */\n @Prop({ mutable: true, reflect: true }) isReadonly: boolean;\n /** Sets the internal input in error state. */\n @Prop({ mutable: true, reflect: true }) error: boolean;\n /** Toggles the required sign in the internal input */\n @Prop({ mutable: true, reflect: true }) isRequired: boolean = false;\n /** Allows user to define a information icon inside the input at its left . */\n @Prop() informativeIcon: string;\n /** Sets character formatting for user input. Useful for adding a mask to the input. */\n @Prop({ mutable: true }) formatter: Function;\n /** Sets custom allowed styles to input (text-align, text-transform, unicode-bidi, direction) */\n @Prop({ mutable: true }) allowedStyles: { [key: string]: string }[] = [];\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 items list width */\n @Prop({ mutable: true }) matchWidth: boolean = true;\n /** Debounce time for key inputs before the search */\n @Prop() debounce: number;\n /** Allows user to define a search icon inside the input at its right (zoom by default) . */\n @Prop() actionIcon: string = \"zoom\";\n /** Sets the autocomplete clear button visibility. */\n @Prop() showClearButton: boolean = true;\n /** \n * Shows a dropdown chevron arrow that flips up/down when change state open/close.\n * Also enables the selectedDropdownValue prop to be able to select an option from dropdown\n * When multiple is true, this prop will be set to false.\n */\n @Prop() dropdown: boolean = false;\n /** Sets the autocomplete dropdown chevron icon visibility. */\n @Prop() showDropdownIcon: boolean = true;\n /** Enables a message when there's no match options. */\n @Prop() showEmptyMessage: boolean = false;\n /** Allow to set the text message in the 'emptyMessage' state. */\n @Prop() emptyMessage: string = \"No options\";\n /** \n * Allow multiple values to be selected.\n * Also enables the multipleValues prop to be able to select multiple options\n * When multiple is true, dropdown prop will be set to false.\n * When multiple is true, valueChanged will emit an array of strings\n */\n @Prop() multiple: 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 /** \n * Clear selection and input on clicking the close button.\n * Only works when multiple is true.\n */\n @Prop() clearSelection: 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(s) */\n @Event() valueChanged: EventEmitter<string | string[]>;\n /** Emits an event when the clear button is clicked */\n @Event() cleared: EventEmitter<void>;\n /** Emits an event when the user click the actionIcon (the magnifying glass) */\n @Event() actionIconClick: EventEmitter<void>;\n /** Emits updated inputed value from the vds-basic-input similar to the input event */\n\t@Event() changeInput: EventEmitter<string>;\n\n @Element() hostEl: HTMLElement;\n\n autocompleteContent: HTMLDivElement;\n basicInput: HTMLVdsBasicInputElement;\n \n floatingCleanUp: () => void = () => {};\n @State() isOpened: boolean = false;\n @State() multiselectValues: Array<string>;\n options: HTMLVdsAutocompleteItemElement[] = [];\n autocompleteItemEmptyOption: HTMLVdsAutocompleteItemElement;\n debounceTimeTracker: NodeJS.Timeout = null;\n showUnfilteredOptions: boolean = false;\n private updateContainerWidth = updateContainerWidth;\n validateDropdownValue: boolean;\n\n componentWillLoad(): void {\n this.multiselectValues = this.multipleValues;\n this.validateDropdownValue = true;\n }\n\n componentWillRender(): void {\n if (this.multiple) {\n this.dropdown = false;\n }\n }\n \n componentDidLoad(): void {\n this.options = Array.from(this.hostEl.querySelectorAll(\"vds-autocomplete-item\"));\n this.setPreselection();\n }\n\n componentDidRender(): void {\n this.options = Array.from(this.hostEl.querySelectorAll(\"vds-autocomplete-item\"));\n updateFloatingBoxPosition(this.basicInput, this.autocompleteContent, null, 'bottom', false);\n this.updateContainerWidth(this.basicInput, this.matchWidth, this.autocompleteContent);\n this.setPreselection();\n }\n\n @Watch(\"multiselectValues\")\n setMulitpleValueHandler() {\n this.valueChanged.emit(this.multiselectValues);\n }\n\n @Watch(\"disabled\")\n setDisabledState() {\n this.close();\n }\n\n @Watch(\"selectedDropdownValue\")\n setDropdownValueValidation() {\n this.validateDropdownValue = true;\n }\n\n @Watch(\"isOpened\")\n async toggleAutocomplete(): Promise<void> {\n if (this.isOpened) {\n toggleContainerDisplay(this.autocompleteContent, true);\n this.opened.emit();\n this.floatingCleanUp = await updateFloatingBoxPosition(this.basicInput, this.autocompleteContent, null, \"bottom\", this.autoPosition);\n } else {\n toggleContainerDisplay(this.autocompleteContent, false);\n this.closed.emit();\n this.floatingCleanUp();\n }\n }\n\n /* Open the floating element(menu) of the autocomplete. */\n @Method()\n public async open(): Promise<void> {\n if (!this.isReadonly && !this.disabled) {\n setTimeout(() => {\n this.isOpened = true;\n });\n }\n }\n\n /* Close the floating element(menu) of the autocomplete. */\n @Method()\n public async close(): Promise<void> {\n this.isOpened = false;\n }\n\n /* Sets focus to the input element */\n @Method()\n public async setFocus(): Promise<void> {\n this.basicInput.setFocus();\n setTimeout(() => {\n this.open();\n });\n }\n\n /**\n * Sets the autocomplete input value to handle filtering.\n *\n * @returns {Promise<void>} \n */\n @Method()\n public async setValue(value: string): Promise<void> {\n this.value = value;\n }\n\n /**\n * Sets the autocomplete selection value to handle.\n * When multiple is true, sets the selected values from the list\n * When dropdown is true and multiple is false, sets a single selected value.\n * When dropdown is false and When multiple is false, set the input value\n *\n * @returns {Promise<void>} \n */\n @Method()\n public async setSelectionValue(value: string | string[]): Promise<void> {\n if (this.multiple && Array.isArray(value)) {\n this.multipleValues = this.multiselectValues = value;\n }\n if (typeof value === \"string\") {\n if (this.dropdown) {\n this.selectedDropdownValue = value;\n }\n this.value = value;\n }\n }\n\n /**\n * Return the autocomplete value.\n *\n * @returns {Promise<string>} A promise that resolves by returning the autocomplete value.\n */\n @Method()\n public async getValue(): Promise<string | string[]> {\n if (this.multiple) {\n return this.multipleValues;\n }\n if (this.dropdown) {\n return this.selectedDropdownValue;\n }\n return this.value;\n }\n\n /**\n * Clears the selected options and resets the value of the autocomplete.\n *\n * @returns {Promise<void>} A promise that resolves when the clearing operation is complete.\n */\n @Method()\n public async clear(): Promise<void> {\n this.value = '';\n if (this.dropdown) {\n this.clearOptions();\n }\n if (this.clearSelection && this.multiple) {\n this.multipleValues = this.multiselectValues = [];\n this.setOptionsMultiple();\n }\n this.cleared.emit();\n }\n\n @Listen(\"autocompleteClicked\")\n handleSelectOption(evt: CustomEvent<{value: string, selected: boolean}>): void {\n const selectedOption = this.options.find((option) => findOptionByExactValue(option, evt.detail.value));\n const isValidOption: boolean = selectedOption !== null && selectedOption !== undefined;\n \n if (isValidOption && this.multiple) {\n selectedOption.isSelected = evt.detail.selected;\n }\n\n this.handleValueAssignment(evt);\n\n if (isValidOption && this.dropdown) {\n this.setOptionsSingle(evt.detail.value);\n }\n }\n\n /* Close the autocomplete when click outside */\n @Listen('click', { target: 'window' })\n handleClickOut(evt: MouseEvent): void {\n evt.stopPropagation();\n const target = evt.target as HTMLElement;\n const isClickInside = this.hostEl.contains(target as Node);\n const isClickInsideParentAutocomplete = target.nodeName === \"VDS-AUTOCOMPLETE\" && target.shadowRoot && (evt.target as HTMLElement).shadowRoot.contains(this.hostEl);\n if (!isClickInside && !isClickInsideParentAutocomplete) {\n this.isOpened = false;\n }\n }\n\n @Listen('keyup', { target: 'window' })\n handleEscPress(evt: any) {\n if (this.isOpened && evt.code === \"Escape\") {\n this.close();\n this.basicInput.blur();\n }\n }\n\n handleMultiselection(selection: {value: string, selected: boolean}): void {\n if (selection.selected && !this.multipleValues.find(value => value.toLowerCase() === selection.value.toLowerCase())) {\n this.multipleValues.push(selection.value);\n } else {\n this.multipleValues = this.multipleValues.filter(value => value.toLowerCase() !== selection.value.toLowerCase());\n }\n this.multiselectValues = Array.from(this.multipleValues);\n this.basicInput.setFocus();\n }\n\n handleValueAssignment(evt: CustomEvent<{value: string, selected: boolean}>): void {\n if (this.multiple) {\n this.handleMultiselection(evt.detail)\n } else {\n this.value = evt.detail.value;\n this.setSelectionValue(evt.detail.value);\n this.valueChanged.emit(this.value);\n this.close();\n }\n }\n\n handleChange(evt: CustomEvent<string>) {\n evt.stopPropagation();\n this.changeInput.emit(evt.detail);\n if (this.debounce !== undefined && this.debounce > 0) {\n this.handleDebounceValueChange(evt.detail);\n } else {\n this.value = evt.detail;\n }\n if (this.dropdown) {\n this.showUnfilteredOptions = false;\n }\n }\n\n hasFocus(): void {\n this.open();\n if (this.hasValue() && this.dropdown) {\n this.showUnfilteredOptions = true;\n this.validateDropdownValue = false;\n }\n }\n\n lostFocus(): void {\n if (this.dropdown) {\n this.showUnfilteredOptions = false;\n this.validateDropdownValue = true;\n }\n }\n\n emitActionIcon(): void {\n this.actionIconClick.emit();\n }\n\n handleDebounceValueChange(newValue: string): void {\n\t\tif (this.debounceTimeTracker !== null) {\n\t\t\tclearTimeout(this.debounceTimeTracker);\n\t\t\tthis.debounceTimeTracker = null;\n\t\t}\n\t\tthis.debounceTimeTracker = setTimeout(() => {\n this.value = newValue;\n\t\t\tthis.debounceTimeTracker = null;\n\t\t}, this.debounce);\n\t}\n\n\n private hasValue(): boolean {\n return this.value !== null && this.value !== undefined && this.value !== \"undefined\" && this.value !== \"\";\n }\n\n /**\n * Sets autocomplete styles for JSX.style property\n *\n * @param maxHeight string\n * @returns { [key: string]: string }\n */\n private setAutoCompleteStyles = (maxHeight: string): { [key: string]: string } => {\n let styles = {};\n\n styles = {\n maxHeight: maxHeight ? maxHeight : undefined,\n }\n\n return styles;\n }\n\n setPreselection(): void {\n if (this.multiple) {\n this.setOptionsMultiple();\n }\n if (this.dropdown) {\n this.setDropdownOption();\n }\n }\n\n private setOptionsMultiple(): void {\n try {\n this.options.forEach(item => {\n item.hasCheckmark = true;\n const selection = this.multipleValues?.find(value => findOptionByExactValue(item, value));\n item.isSelected = !!selection;\n });\n } \n catch (error) {\n console.warn(\"[setOptionsMultiple]\", error);\n }\n }\n\n /**\n * Sets the selected value for a autocomplete type dropdown and updates the options accordingly.\n * @private\n * @param {string} selectedValue - The value of the selected option.\n */\n private setOptionsSingle(selectedValue: string): void {\n try {\n this.selectedDropdownValue = selectedValue;\n this.options.forEach(item => {\n item.hasCheckmark = false;\n item.isSelected = findOptionByExactValue(item, this.selectedDropdownValue);\n });\n } \n catch (error) {\n console.warn(\"[setOptionsSingle]\", error);\n }\n }\n\n private setDropdownOption(): void {\n try {\n const hasValidValue = this.options?.some(opt => findOptionByExactValue(opt, this.selectedDropdownValue));\n if (\n hasValidValue &&\n this.selectedDropdownValue !== undefined &&\n this.selectedDropdownValue !== \"undefined\" &&\n this.selectedDropdownValue !== \"\"\n ) {\n this.setOptionsSingle(this.selectedDropdownValue);\n\n if (this.validateDropdownValue) {\n this.value = this.selectedDropdownValue;\n this.validateDropdownValue = false;\n }\n }\n } \n catch (error) {\n console.warn(\"[setOptionsMultiple]\", error);\n }\n }\n\n /**\n * Sets the all the options to unselected state\n * @private\n * @param {string} selectedValue - The value of the selected option.\n */\n private clearOptions(): void {\n try {\n this.selectedDropdownValue = null;\n this.options.forEach(item => {\n item.hasCheckmark = item.isSelected = false;\n });\n } \n catch (error) {\n console.warn(\"[clearOptions]\", error);\n }\n }\n\n private renderUnfilteredOptions(): HTMLStencilElement {\n return (\n <div \n class={combineClasses('vds-basic-autocomplete__content-options', this.maxHeight ? 'scrollable' : '')}\n style={this.setAutoCompleteStyles(this.maxHeight)}\n >\n <slot name={\"items\"}></slot>\n <slot></slot>\n </div>\n );\n }\n\n private renderItem(item: HTMLVdsAutocompleteItemElement): HTMLStencilElement {\n let isSelected = false;\n if (this.multiple) {\n isSelected = this.multipleValues?.some(value => findOptionByValue(item, value));\n }\n return (\n <vds-autocomplete-item isSelected={isSelected} hasCheckmark={this.multiple} {...cloneAttributes(item)} innerHTML={item.innerHTML}></vds-autocomplete-item>\n );\n }\n\n private renderFilteredOptions(): HTMLStencilElement {\n const value = this.hasValue() ? this.value : \"\";\n const filteredOptions = getFilteredOptions(this.options, value);\n if (filteredOptions.length === 0) {\n return this.showEmptyMessage && this.emptyMessage ? this.renderEmptyOption() : null;\n }\n \n return (\n <div\n class={combineClasses('vds-basic-autocomplete__content-options', this.maxHeight ? 'scrollable' : '')}\n style={this.setAutoCompleteStyles(this.maxHeight)}\n >\n {filteredOptions.map(item => this.renderItem(item))}\n </div>\n );\n }\n\n private renderEmptyOption(): HTMLStencilElement {\n if (!this.autocompleteItemEmptyOption) {\n this.autocompleteItemEmptyOption = document.createElement(\"vds-autocomplete-item\");\n this.autocompleteItemEmptyOption.classList.add(\"non-clickable\");\n this.autocompleteItemEmptyOption.value = \"\";\n this.autocompleteItemEmptyOption.setAttribute(\"value\", \"\");\n }\n\n this.autocompleteItemEmptyOption.setAttribute(\"size\", this.size);\n this.autocompleteItemEmptyOption.setAttribute(\"label\", this.emptyMessage);\n\n return this.renderItem(this.autocompleteItemEmptyOption);\n }\n\n private renderClearIcon(): HTMLStencilElement {\n const disabled = this.disabled || this.isReadonly;\n return (\n <vds-icon-button\n tabIndex={disabled ? -1 : undefined}\n disabled={disabled}\n variant=\"secondary\"\n size={this.size === \"medium\" ? \"small\" : this.size === \"small\" ? \"extra-small\" : \"medium\"}\n icon={\"close\"}\n onClick={disabled ? undefined : () => { this.clear(); this.basicInput.setFocus();}}\n ></vds-icon-button>\n );\n }\n\n private renderActionIcon(): HTMLStencilElement {\n const disabled = this.disabled || this.isReadonly;\n if (this.dropdown && this.showDropdownIcon) {\n return (\n <vds-icon\n svgIcon={this.isOpened ? 'chevron-up' : 'chevron-down'}\n color={disabled ? 'color-icon-disabled' : 'color-icon-high'}\n size={getIconSize(this.size)}\n onClick={disabled ? undefined : () => this.isOpened ? this.close() : this.open()}\n ></vds-icon>\n );\n } \n if (this.actionIcon) {\n return (\n <vds-icon-button\n tabIndex={disabled ? -1 : undefined}\n disabled={disabled}\n variant=\"secondary\"\n size={this.size === \"medium\" ? \"small\" : this.size === \"small\" ? \"extra-small\" : \"medium\"}\n icon={this.actionIcon}\n onClick={disabled ? undefined : () => this.emitActionIcon()}\n ></vds-icon-button>\n )\n }\n }\n\n private renderOptions(): HTMLStencilElement {\n if (this.dropdown && this.showUnfilteredOptions) {\n return this.renderUnfilteredOptions();\n }\n\n if (this.hasValue()) {\n return this.renderFilteredOptions();\n }\n\n return this.renderUnfilteredOptions();\n }\n\n render(): HTMLStencilElement {\n const filteredOptions = getFilteredOptions(this.options, this.value || \"\");\n return (\n <Host class={this.disabled ? \"vds-basic-autocomplete--disabled\" : \"\"} title={this.value}>\n <div class={combineClasses(\"vds-basic-autocomplete__container\")}>\n <vds-basic-input\n ref={(el) => {\n if (el) {\n this.basicInput = el; \n }\n }}\n type=\"text\"\n placeholder={this.placeholder}\n value={this.value}\n size={this.size}\n disabled={this.disabled}\n isReadonly={this.isReadonly}\n error={this.error}\n isRequired={this.isRequired}\n formatter={this.formatter}\n informativeIcon={this.informativeIcon}\n allowedStyles={this.allowedStyles}\n onChangeInput={(evt): void => this.handleChange(evt)}\n onFocus={(): void => this.hasFocus()}\n onBlur={(): void => this.lostFocus()}\n >\n {this.showClearButton && this.hasValue() && (\n <div class=\"vds-basic-autocomplete__secondary-action\" slot=\"secondaryActionIcon\">\n {this.renderClearIcon()}\n </div>\n )}\n {((this.dropdown && this.showDropdownIcon) || this.actionIcon) && (\n <div class=\"vds-basic-autocomplete__primary-action\" slot=\"primaryActionIcon\">\n {this.renderActionIcon()}\n </div>\n )}\n </vds-basic-input>\n {this.backdrop && this.isOpened ? <div class=\"vds-floating-backdrop\" onClick={this.close.bind(this)}></div> : ''}\n <div \n ref={(el): void => { if (el) this.autocompleteContent = el;}}\n class={\n combineClasses(\n \"vds-basic-autocomplete__content\",\n this.maxHeight ? \"has-scroll\" : \"\",\n (!this.emptyMessage || this.emptyMessage === \"\") && filteredOptions.length === 0 ? \"no-shadow\" : \"\",\n !this.showEmptyMessage && filteredOptions.length === 0 ? \"no-shadow\" : \"\",\n !this.value && this.options.length === 0 ? \"no-shadow\" : \"\"\n )}\n >\n <div class={\"vds-basic-autocomplete__content__header\"}>\n <slot name=\"header\"></slot>\n </div>\n {this.renderOptions()}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/volt-basic-components/p-e518fe0e.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as o,h as r,H as a}from"./p-DTZC-zXo.js";import{c as e}from"./p-B23UkaEC.js";import{B as t}from"./p-0Hrrk76k.js";const i='@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:inline-block}:host .vds-badge-dot__container{position:relative}:host .vds-badge-dot__container .vds-badge-dot__thumb{border-radius:var(--spacing-04);position:absolute}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--size-medium{width:var(--spacing-04);height:var(--spacing-04);--position-x:-0.68rem;--position-y:-0.68rem}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--size-medium.vds-badge-dot__thumb--overlap{--position-x:-0.368rem;--position-y:-0.368rem}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--size-small{width:var(--spacing-03);height:var(--spacing-03);--position-x:-0.5rem;--position-y:-0.5rem}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--size-small.vds-badge-dot__thumb--overlap{--position-x:-0.25rem;--position-y:-0.25rem}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--no-overlap{transform:translate(-0.05rem, -0.05rem)}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--position-top-right{top:var(--position-y);right:var(--position-x)}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--position-top-left{top:var(--position-y);left:var(--position-x)}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--position-bottom-right{bottom:var(--position-y);right:var(--position-x)}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--position-bottom-left{bottom:var(--position-y);left:var(--position-x)}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--color-warning{background-color:var(--color-border-warning)}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--color-danger{background-color:var(--color-border-danger)}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--color-healthy{background-color:var(--color-background-healthy-default)}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--color-information{background-color:var(--color-background-information-default)}:host .vds-badge-dot__container .vds-badge-dot__thumb.vds-badge-dot__thumb--color-neutral{background-color:var(--color-background-general-default)}';const c=class{constructor(r){o(this,r);this.size="medium";this.statusColor="neutral";this.overlap=false;this.position="top-right"}componentWillRender(){this.isCustom=!t.includes(this.statusColor)}setCustomColorStyle(){let o={};if(this.isCustom){return{backgroundColor:`var(--${this.statusColor})`}}return o}render(){return r(a,{key:"de76ac7e9e12e4480987ededeaf22561527ad5f1","aria-label":this.setAriaLabel},r("div",{key:"28f648e19c03b19e50b07abedb7dd3d98618aa59",class:e("vds-badge-dot__container"),"aria-label":this.setAriaLabel},r("div",{key:"16e6fbfb0b6181f85ddbbdb0e6e9ccb9390d1af9",class:e("vds-badge-dot__thumb",this.overlap?"vds-badge-dot__thumb--overlap":"vds-badge-dot__thumb--no-overlap",`vds-badge-dot__thumb--size-${this.size}`,`vds-badge-dot__thumb--color-${this.statusColor}`,`vds-badge-dot__thumb--position-${this.position}`),style:this.setCustomColorStyle()}),r("slot",{key:"47a7c1bfb988c28d8af3aaac707fa4a92a851f76"})))}};c.style=i;export{c as vds_badge_dot};
2	+ //# sourceMappingURL=p-e518fe0e.entry.js.map

package/dist/volt-basic-components/p-e518fe0e.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["vdsBadgeDotCss","VdsBadgeDot","constructor","hostRef","this","size","statusColor","overlap","position","componentWillRender","isCustom","BADGE_VARIANTS","includes","setCustomColorStyle","style","backgroundColor","render","h","Host","key","setAriaLabel","class","combineClasses"],"sources":["src/components/badge-dot/vds-badge-dot.scss?tag=vds-badge-dot&encapsulation=shadow","src/components/badge-dot/vds-badge-dot.tsx"],"sourcesContent":[":host {\n display: inline-block;\n .vds-badge-dot__container {\n position: relative;\n .vds-badge-dot__thumb {\n border-radius: var(--spacing-04);\n position: absolute;\n\n &.vds-badge-dot__thumb--size-medium {\n width: var(--spacing-04);\n height: var(--spacing-04);\n --position-x: -0.68rem;\n --position-y: -0.68rem;\n &.vds-badge-dot__thumb--overlap {\n --position-x: -0.368rem;\n --position-y: -0.368rem;\n }\n }\n &.vds-badge-dot__thumb--size-small {\n width: var(--spacing-03);\n height: var(--spacing-03);\n --position-x: -0.5rem;\n --position-y: -0.5rem;\n &.vds-badge-dot__thumb--overlap {\n --position-x: -0.25rem;\n --position-y: -0.25rem;\n }\n }\n &.vds-badge-dot__thumb--no-overlap {\n transform: translate(-0.05rem, -0.05rem);\n }\n &.vds-badge-dot__thumb--position-top-right {\n top: var(--position-y);\n right: var(--position-x);\n }\n &.vds-badge-dot__thumb--position-top-left {\n top: var(--position-y);\n left: var(--position-x);\n }\n &.vds-badge-dot__thumb--position-bottom-right {\n bottom: var(--position-y);\n right: var(--position-x);\n }\n &.vds-badge-dot__thumb--position-bottom-left {\n bottom: var(--position-y);\n left: var(--position-x);\n }\n &.vds-badge-dot__thumb--color-warning {\n background-color: var(--color-border-warning);\n }\n &.vds-badge-dot__thumb--color-danger {\n background-color: var(--color-border-danger);\n }\n &.vds-badge-dot__thumb--color-healthy {\n background-color: var(--color-background-healthy-default);\n }\n &.vds-badge-dot__thumb--color-information {\n background-color: var(--color-background-information-default);\n }\n &.vds-badge-dot__thumb--color-neutral {\n background-color: var(--color-background-general-default);\n }\n }\n }\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { Colors } from '../../definitions/colors';\nimport { BADGE_VARIANTS } from '../badge-pill/vds-badge-pill.utils';\n\n@Component({\n tag: 'vds-badge-dot',\n styleUrl: 'vds-badge-dot.scss',\n shadow: true,\n})\nexport class VdsBadgeDot {\n /** Sets the badge's size */\n @Prop() size: \"small\" | \"medium\" = \"medium\"\n /** Sets the color of the badge, it provides special colors such as warning, danger, healthy, information, neutral \n * If you pass a color from out pallete it will consider as custom. The color will be applied as background color. */\n @Prop() statusColor: \"warning\" | \"danger\" | \"healthy\" | \"information\" | \"neutral\" | Colors = \"neutral\";\n /** Sets the aria label in badge */\n @Prop() setAriaLabel:string \n /** Sets to overlap component content */\n @Prop() overlap : boolean = false\n /** Sets the position of the badge */\n @Prop() position: \"top-right\" | \"top-left\" | \"bottom-right\" | \"bottom-left\" = \"top-right\"\n \n \n private isCustom: boolean;\n\n componentWillRender(): void {\n this.isCustom = !BADGE_VARIANTS.includes(this.statusColor);\n }\n\n setCustomColorStyle() {\n let style = {};\n\n if (this.isCustom) {\n return {\n backgroundColor: `var(--${this.statusColor})`\n };\n }\n\n return style;\n }\n\n render() {\n return (\n <Host aria-label={this.setAriaLabel}>\n <div class={combineClasses(\"vds-badge-dot__container\")} aria-label={this.setAriaLabel}>\n <div class={combineClasses(\n \"vds-badge-dot__thumb\",\n this.overlap ? \"vds-badge-dot__thumb--overlap\" : \"vds-badge-dot__thumb--no-overlap\",\n `vds-badge-dot__thumb--size-${this.size}`,\n `vds-badge-dot__thumb--color-${this.statusColor}`,\n `vds-badge-dot__thumb--position-${this.position}`\n )}\n style={this.setCustomColorStyle()}\n ></div>\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"0HAAA,MAAMA,EAAiB,u4hC,MCUVC,EAAW,MALxB,WAAAC,CAAAC,G,UAOUC,KAAIC,KAAuB,SAG3BD,KAAWE,YAA0E,UAIpFF,KAAOG,QAAe,MAEvBH,KAAQI,SAA8D,WAuC/E,CAlCC,mBAAAC,GACEL,KAAKM,UAAYC,EAAeC,SAASR,KAAKE,Y,CAGhD,mBAAAO,GACE,IAAIC,EAAQ,GAEZ,GAAIV,KAAKM,SAAU,CACjB,MAAO,CACLK,gBAAiB,SAASX,KAAKE,e,CAInC,OAAOQ,C,CAGT,MAAAE,GACE,OACEC,EAACC,EAAiB,CAAAC,IAAA,wDAAAf,KAAKgB,cACrBH,EAAK,OAAAE,IAAA,2CAAAE,MAAOC,EAAe,4BAA2B,aAAclB,KAAKgB,cACvEH,EAAA,OAAAE,IAAA,2CAAKE,MAAOC,EACV,uBACAlB,KAAKG,QAAU,gCAAkC,mCACjD,8BAA8BH,KAAKC,OACnC,+BAA+BD,KAAKE,cACpC,kCAAkCF,KAAKI,YAEvCM,MAAOV,KAAKS,wBAEdI,EAAa,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/volt-basic-components/p-e851fb62.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as o,c as e,h as t,H as r,a}from"./p-DTZC-zXo.js";import{c as i}from"./p-B23UkaEC.js";const c='@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:fit-content;--vds-segmented-button-background:var(--transparent, transparent);--vds-segmented-button-border:var(--radius-medium);--vds-segmented-button-text-color:var(--color-link-default);--vds-segmented-button-icon-color:var(--color-icon-brand-default);--vds-segmented-button-disabled-background:var(--transparent, transparent);--vds-segmented-button-disabled-border:var(--radius-medium);--vds-segmented-button-disabled-text-color:var(--color-text-disabled);--vds-segmented-button-disabled-icon-color:var(--color-icon-disabled);--vds-segmented-button-active-background:var(--color-interaction-brand-lower);--vds-segmented-button-active-border:var(--radius-medium);--vds-segmented-button-active-text-color:var(--color-link-press);--vds-segmented-button-active-icon-color:var(--color-icon-brand-press);--vds-segmented-button-hover-background:var(--color-interaction-brand-lowest);--vds-segmented-button-hover-border:var(--radius-medium);--vds-segmented-button-hover-text-color:var(--color-link-hover);--vds-segmented-button-hover-icon-color:var(--color-icon-brand-hover);--vds-segmented-button-focus-background:transparent;--vds-segmented-button-focus-border:var(--radius-medium);--vds-segmented-button-focus-text-color:var(--color-link-default);--vds-segmented-button-focus-icon-color:var(--color-icon-brand-default)}:host button{border:none;box-sizing:border-box;box-shadow:none;cursor:pointer}:host .vds-segmented-button{border:none;box-sizing:border-box;box-shadow:none;width:fit-content;background:var(--vds-segmented-button-background);height:var(--spacing-08);display:flex;padding:var(--spacing-02) var(--spacing-03);justify-content:center;align-items:center;gap:var(--spacing-02);border-radius:var(--vds-segmented-button-border)}:host .vds-segmented-button .vds-segmented-button__text{color:var(--vds-segmented-button-text-color);font-family:"Roboto Flex", sans-serif;font-size:0.875rem;font-weight:600;line-height:1.25rem;letter-spacing:normal;text-align:center;font-feature-settings:"liga" off, "clig" off}:host .vds-segmented-button .vds-segmented-button__informative-icon,:host .vds-segmented-button ::slotted(vds-icon){color:var(--vds-segmented-button-icon-color);fill:var(--vds-segmented-button-icon-color)}:host .vds-segmented-button:hover{background-color:var(--vds-segmented-button-hover-background);border-radius:var(--vds-segmented-button-hover-border)}:host .vds-segmented-button:hover .vds-segmented-button__text{color:var(--vds-segmented-button-hover-text-color)}:host .vds-segmented-button:hover .vds-segmented-button__informative-icon,:host .vds-segmented-button:hover ::slotted(vds-icon){color:var(--vds-segmented-button-hover-icon-color);fill:var(--vds-segmented-button-hover-icon-color)}:host .vds-segmented-button:focus-visible{background-color:var(--vds-segmented-button-focus-background);border-radius:var(--vds-segmented-button-focus-border);outline:0.125rem solid var(--color-border-focus-2);outline-offset:0.125rem}:host .vds-segmented-button:focus-visible .vds-segmented-button__text{color:var(--vds-segmented-button-focus-text-color)}:host .vds-segmented-button:focus-visible .vds-segmented-button__informative-icon,:host .vds-segmented-button:focus-visible ::slotted(vds-icon){color:var(--vds-segmented-button-focus-icon-color);fill:var(--vds-segmented-button-focus-icon-color)}:host .vds-segmented-button.vds-segmented-button--active{background-color:var(--vds-segmented-button-active-background);border-radius:var(--vds-segmented-button-active-border)}:host .vds-segmented-button.vds-segmented-button--active .vds-segmented-button__text{color:var(--vds-segmented-button-active-text-color)}:host .vds-segmented-button.vds-segmented-button--active .vds-segmented-button__informative-icon,:host .vds-segmented-button.vds-segmented-button--active ::slotted(vds-icon){color:var(--vds-segmented-button-active-icon-color);fill:var(--vds-segmented-button-active-icon-color)}:host .vds-segmented-button.vds-segmented-button--disabled{pointer-events:none;background-color:var(--vds-segmented-button-disabled-background);border-radius:var(--vds-segmented-button-disabled-border)}:host .vds-segmented-button.vds-segmented-button--disabled .vds-segmented-button__text{color:var(--vds-segmented-button-disabled-text-color)}:host .vds-segmented-button.vds-segmented-button--disabled .vds-segmented-button__informative-icon,:host .vds-segmented-button.vds-segmented-button--disabled ::slotted(vds-icon){color:var(--vds-segmented-button-disabled-icon-color);fill:var(--vds-segmented-button-disabled-icon-color)}:host(.vds-segmented-button--full-width){width:100%}:host(.vds-segmented-button--full-width) .vds-segmented-button{width:100%}:host(.vds-segmented-button--disabled){pointer-events:none}';const s=class{constructor(t){o(this,t);this.segmentedButtonClicked=e(this,"segmentedButtonClicked");this.selected=e(this,"selected");this.deselected=e(this,"deselected");this.isActive=false;this.hasCheckmark=false;this.disabled=false;this.fullWidth=false}setActiveProp(){if(this.isActive){this.selected.emit()}else{this.deselected.emit()}}handleClick(o){o.preventDefault();this.segmentedButtonClicked.emit({value:this.value,selected:this.isActive})}generateInformativeIcon(){return t("vds-icon",{class:"vds-segmented-button__informative-icon","svg-icon":this.isActive&&this.hasCheckmark?"good":this.informativeIcon,size:"1.25rem",alt:this.value})}render(){return t(r,{key:"667325f36f9bba31175f0a52c36a33c42981ec77",class:i(this.disabled?"vds-segmented-button--disabled":"",this.fullWidth?"vds-segmented-button--full-width":"")},t("button",{key:"c25d9d7e9db5b638d01bc0f2bb70ca44ce2726f6",class:i("vds-segmented-button",this.disabled?"vds-segmented-button--disabled":"",this.isActive?"vds-segmented-button--active":""),title:this.value,disabled:this.disabled,onClick:o=>this.handleClick(o)},(this.informativeIcon\|\|this.isActive&&this.hasCheckmark)&&this.generateInformativeIcon(),t("span",{key:"50258b210cb86e63c866f1daba637c929f6a77be",class:"vds-segmented-button__text"},t("slot",{key:"14997013726895ef2d96694845f5beac14381e8d"}))))}get hostEl(){return a(this)}static get watchers(){return{isActive:["setActiveProp"]}}};s.style=c;export{s as vds_segmented_button};
2	+ //# sourceMappingURL=p-e851fb62.entry.js.map

package/dist/volt-basic-components/p-e851fb62.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["vdsSegmentedButtonCss","VdsSegmentedButton","constructor","hostRef","this","isActive","hasCheckmark","disabled","fullWidth","setActiveProp","selected","emit","deselected","handleClick","evt","preventDefault","segmentedButtonClicked","value","generateInformativeIcon","h","class","informativeIcon","size","alt","render","Host","key","combineClasses","title","onClick"],"sources":["src/components/segmented-button/vds-segmented-button.scss?tag=vds-segmented-button&encapsulation=shadow","src/components/segmented-button/vds-segmented-button.tsx"],"sourcesContent":[":host {\n display: block;\n width: fit-content;\n\n --vds-segmented-button-background: var(--transparent, transparent);\n --vds-segmented-button-border: var(--radius-medium);\n --vds-segmented-button-text-color: var(--color-link-default);\n --vds-segmented-button-icon-color: var(--color-icon-brand-default);\n\n --vds-segmented-button-disabled-background: var(--transparent, transparent);\n --vds-segmented-button-disabled-border: var(--radius-medium);\n --vds-segmented-button-disabled-text-color: var(--color-text-disabled);\n --vds-segmented-button-disabled-icon-color: var(--color-icon-disabled);\n\n --vds-segmented-button-active-background: var(--color-interaction-brand-lower);\n --vds-segmented-button-active-border: var(--radius-medium);\n --vds-segmented-button-active-text-color: var(--color-link-press);\n --vds-segmented-button-active-icon-color: var(--color-icon-brand-press);\n\n --vds-segmented-button-hover-background: var(--color-interaction-brand-lowest);\n --vds-segmented-button-hover-border: var(--radius-medium);\n --vds-segmented-button-hover-text-color: var(--color-link-hover);\n --vds-segmented-button-hover-icon-color: var(--color-icon-brand-hover);\n\n --vds-segmented-button-focus-background: transparent;\n --vds-segmented-button-focus-border: var(--radius-medium);\n --vds-segmented-button-focus-text-color: var(--color-link-default);\n --vds-segmented-button-focus-icon-color: var(--color-icon-brand-default);\n\n button {\n border: none;\n box-sizing: border-box;\n box-shadow: none;\n cursor: pointer;\n }\n .vds-segmented-button {\n border: none;\n box-sizing: border-box;\n box-shadow: none;\n width: fit-content;\n \n background: var(--vds-segmented-button-background);\n height: var(--spacing-08);\n\n display: flex;\n padding: var(--spacing-02) var(--spacing-03);\n justify-content: center;\n align-items: center;\n gap: var(--spacing-02);\n\n border-radius: var(--vds-segmented-button-border);\n\n .vds-segmented-button__text {\n color: var(--vds-segmented-button-text-color);\n @include font-style(title, small);\n text-align: center;\n font-feature-settings: 'liga' off, 'clig' off;\n }\n\n .vds-segmented-button__informative-icon,\n ::slotted(vds-icon) {\n color: var(--vds-segmented-button-icon-color);\n fill: var(--vds-segmented-button-icon-color);\n }\n\n &:hover {\n background-color: var(--vds-segmented-button-hover-background);\n border-radius: var(--vds-segmented-button-hover-border);\n .vds-segmented-button__text {\n color: var(--vds-segmented-button-hover-text-color);\n }\n .vds-segmented-button__informative-icon,\n ::slotted(vds-icon) {\n color: var(--vds-segmented-button-hover-icon-color);\n fill: var(--vds-segmented-button-hover-icon-color);\n }\n }\n\n &:focus-visible {\n background-color: var(--vds-segmented-button-focus-background);\n border-radius: var(--vds-segmented-button-focus-border);\n outline: 0.125rem solid var(--color-border-focus-2);\n outline-offset: 0.125rem;\n .vds-segmented-button__text {\n color: var(--vds-segmented-button-focus-text-color);\n }\n .vds-segmented-button__informative-icon,\n ::slotted(vds-icon) {\n color: var(--vds-segmented-button-focus-icon-color);\n fill: var(--vds-segmented-button-focus-icon-color);\n }\n }\n\n &.vds-segmented-button--active {\n background-color: var(--vds-segmented-button-active-background);\n border-radius: var(--vds-segmented-button-active-border);\n .vds-segmented-button__text {\n color: var(--vds-segmented-button-active-text-color);\n }\n .vds-segmented-button__informative-icon,\n ::slotted(vds-icon) {\n color: var(--vds-segmented-button-active-icon-color);\n fill: var(--vds-segmented-button-active-icon-color);\n }\n }\n\n &.vds-segmented-button--disabled {\n pointer-events: none;\n background-color: var(--vds-segmented-button-disabled-background);\n border-radius: var(--vds-segmented-button-disabled-border);\n .vds-segmented-button__text {\n color: var(--vds-segmented-button-disabled-text-color);\n }\n .vds-segmented-button__informative-icon,\n ::slotted(vds-icon) {\n color: var(--vds-segmented-button-disabled-icon-color);\n fill: var(--vds-segmented-button-disabled-icon-color);\n }\n }\n }\n}\n\n:host(.vds-segmented-button--full-width) {\n width: 100%;\n .vds-segmented-button {\n width: 100%;\n }\n}\n\n:host(.vds-segmented-button--disabled) {\n pointer-events: none;\n}\n","import { Component, Host, Prop, h, Event, EventEmitter, Element, Watch } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { HTMLStencilElement } from '@stencil/core/internal';\n\n@Component({\n tag: 'vds-segmented-button',\n styleUrl: 'vds-segmented-button.scss',\n shadow: true,\n})\nexport class VdsSegmentedButton {\n /** Sets the icon at the left of the segment button */\n @Prop() informativeIcon: string\n /** Sets the segment button in active state */\n @Prop({ reflect: true }) isActive: boolean = false;\n /** When is-active is true, shows checkmark */\n @Prop() hasCheckmark: boolean = false;\n /** Set the segmented-button to disabled state */\n @Prop({ reflect: true }) disabled: boolean = false;\n /** Set the segmented-button value */\n @Prop({ reflect: true }) value: string;\n /** Allows the component to be adaptable to the container available horizontal space */\n @Prop() fullWidth: boolean = false\n\n /** Emits event when item gets clicked */\n @Event() segmentedButtonClicked: EventEmitter<{ value: string, selected: boolean }>;\n /** Emits event when item is selected */\n @Event() selected: EventEmitter<void>;\n /** Emits event when item is deselected */\n @Event() deselected: EventEmitter<void>;\n\n @Element() hostEl: HTMLElement;\n\n @Watch(\"isActive\")\n setActiveProp(): void {\n if (this.isActive) {\n this.selected.emit();\n } else {\n this.deselected.emit();\n }\n }\n\n handleClick(evt: MouseEvent): void {\n evt.preventDefault();\n\n this.segmentedButtonClicked.emit({\n value: this.value,\n selected: this.isActive\n })\n }\n\n generateInformativeIcon(): HTMLStencilElement {\n return (\n <vds-icon\n class={\"vds-segmented-button__informative-icon\"}\n svg-icon={this.isActive && this.hasCheckmark ? \"good\" : this.informativeIcon}\n size={\"1.25rem\"}\n alt={this.value}\n />\n )\n }\n\n render() {\n return (\n <Host\n class={combineClasses(\n this.disabled ? \"vds-segmented-button--disabled\" : \"\",\n this.fullWidth ? \"vds-segmented-button--full-width\" : \"\",\n )}\n >\n <button\n class={combineClasses(\n \"vds-segmented-button\",\n this.disabled ? \"vds-segmented-button--disabled\" : \"\",\n this.isActive ? \"vds-segmented-button--active\" : \"\",\n )}\n title={this.value}\n disabled={this.disabled}\n onClick={(evt): void => this.handleClick(evt)}\n >\n {(this.informativeIcon || (this.isActive && this.hasCheckmark)) && this.generateInformativeIcon()}\n <span class={\"vds-segmented-button__text\"}>{<slot></slot>}</span>\n </button>\n </Host>\n );\n }\n}\n"],"mappings":"+FAAA,MAAMA,EAAwB,qymC,MCSjBC,EAAkB,MAL/B,WAAAC,CAAAC,G,6IAS2BC,KAAQC,SAAY,MAErCD,KAAYE,aAAY,MAEPF,KAAQG,SAAY,MAIrCH,KAASI,UAAY,KAgE9B,CApDC,aAAAC,GACE,GAAIL,KAAKC,SAAU,CACjBD,KAAKM,SAASC,M,KACT,CACLP,KAAKQ,WAAWD,M,EAIpB,WAAAE,CAAYC,GACVA,EAAIC,iBAEJX,KAAKY,uBAAuBL,KAAK,CAC/BM,MAAOb,KAAKa,MACZP,SAAUN,KAAKC,U,CAInB,uBAAAa,GACE,OACEC,EAAA,YACEC,MAAO,yCACG,WAAAhB,KAAKC,UAAYD,KAAKE,aAAe,OAASF,KAAKiB,gBAC7DC,KAAM,UACNC,IAAKnB,KAAKa,O,CAKhB,MAAAO,GACE,OACEL,EAACM,EAAI,CAAAC,IAAA,2CACHN,MAAOO,EACLvB,KAAKG,SAAW,iCAAmC,GACnDH,KAAKI,UAAY,mCAAqC,KAGxDW,EACE,UAAAO,IAAA,2CAAAN,MAAOO,EACL,uBACAvB,KAAKG,SAAW,iCAAmC,GACnDH,KAAKC,SAAW,+BAAiC,IAEnDuB,MAAOxB,KAAKa,MACZV,SAAUH,KAAKG,SACfsB,QAAUf,GAAcV,KAAKS,YAAYC,KAEvCV,KAAKiB,iBAAoBjB,KAAKC,UAAYD,KAAKE,eAAkBF,KAAKc,0BACxEC,EAAM,QAAAO,IAAA,2CAAAN,MAAO,8BAA+BD,EAAA,QAAAO,IAAA,+C","ignoreList":[]}