npm - igniteui-webcomponents - Versions diffs - 4.5.0 → 4.6.0 - Mend

igniteui-webcomponents 4.5.0 → 4.6.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 (2058) hide show

package/components/select/themes/light/select.material.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select.material.css.js","sourceRoot":"","sources":["../../../../../src/components/select/themes/light/select.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8MvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --search-resting-elevation: var(--ig-input-search-resting-elevation, var(--ig-elevation-1));\n --search-hover-elevation: var(--ig-input-search-hover-elevation, var(--ig-elevation-2));\n --search-disabled-elevation: var(--ig-input-search-disabled-elevation, var(--ig-elevation-0));\n --helper-text-color: var(--ig-input-helper-text-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n --input-prefix-background: var(--ig-input-input-prefix-background, transparent);\n --input-prefix-color: var(--ig-input-input-prefix-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n --input-prefix-background--filled: var(--ig-input-input-prefix-background--filled, inherit);\n --input-prefix-color--filled: var(--ig-input-input-prefix-color--filled, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --input-prefix-background--focused: var(--ig-input-input-prefix-background--focused, inherit);\n --input-prefix-color--focused: var(--ig-input-input-prefix-color--focused, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --input-suffix-background: var(--ig-input-input-suffix-background, transparent);\n --input-suffix-color: var(--ig-input-input-suffix-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n --input-suffix-background--filled: var(--ig-input-input-suffix-background--filled, inherit);\n --input-suffix-color--filled: var(--ig-input-input-suffix-color--filled, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --input-suffix-background--focused: var(--ig-input-input-suffix-background--focused, inherit);\n --input-suffix-color--focused: var(--ig-input-input-suffix-color--focused, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --idle-text-color: var(--ig-input-idle-text-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n --filled-text-color: var(--ig-input-filled-text-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --focused-text-color: var(--ig-input-focused-text-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --disabled-text-color: var(--ig-input-disabled-text-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --idle-secondary-color: var(--ig-input-idle-secondary-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n --filled-secondary-color: var(--ig-input-filled-secondary-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));\n --focused-secondary-color: var(--ig-input-focused-secondary-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --idle-bottom-line-color: var(--ig-input-idle-bottom-line-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --hover-bottom-line-color: var(--ig-input-hover-bottom-line-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --focused-bottom-line-color: var(--ig-input-focused-bottom-line-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --interim-bottom-line-color: var(--ig-input-interim-bottom-line-color, hsla(var(--ig-primary-500), 0.12));\n --disabled-bottom-line-color: var(--ig-input-disabled-bottom-line-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --disabled-border-color: var(--ig-input-disabled-border-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --border-color: var(--ig-input-border-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));\n --hover-border-color: var(--ig-input-hover-border-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --focused-border-color: var(--ig-input-focused-border-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n --border-background: var(--ig-input-border-background, transparent);\n --border-disabled-background: var(--ig-input-border-disabled-background, transparent);\n --search-background: var(--ig-input-search-background, hsla(var(--ig-gray-50), var(--ig-gray-a)));\n --search-disabled-background: var(--ig-input-search-disabled-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n --success-secondary-color: var(--ig-input-success-secondary-color, hsla(var(--ig-success-500), var(--ig-success-a)));\n --warning-secondary-color: var(--ig-input-warning-secondary-color, hsla(var(--ig-warn-500), var(--ig-warn-a)));\n --error-secondary-color: var(--ig-input-error-secondary-color, hsla(var(--ig-error-500), var(--ig-error-a)));\n --placeholder-color: var(--ig-input-placeholder-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n --disabled-placeholder-color: var(--ig-input-disabled-placeholder-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --box-background: var(--ig-input-box-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n --box-background-hover: var(--ig-input-box-background-hover, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n --box-background-focus: var(--ig-input-box-background-focus, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n --box-disabled-background: var(--ig-input-box-disabled-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n --box-border-radius: var(--ig-input-box-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));\n --border-border-radius: var(--ig-input-border-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));\n --search-border-radius: var(--ig-input-search-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));\n --success-shadow-color: var(--ig-input-success-shadow-color, hsla(var(--ig-success-500), 0.38));\n --error-shadow-color: var(--ig-input-error-shadow-color, hsla(var(--ig-error-500), 0.38));\n --size: var(--ig-input-size, max(var(--is-large, 1) * max(3.5rem, -1 * 3.5rem), var(--is-medium, 1) * max(3rem, -1 * 3rem), var(--is-small, 1) * max(2.5rem, -1 * 2.5rem)));\n --toggle-button-background-focus--border: var(--ig-select-toggle-button-background-focus--border, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n --toggle-button-background: var(--ig-select-toggle-button-background, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n --toggle-button-background-focus: var(--ig-select-toggle-button-background-focus, hsla(var(--ig-gray-400), 0.3));\n --toggle-button-foreground: var(--ig-select-toggle-button-foreground, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n --toggle-button-foreground-focus: var(--ig-select-toggle-button-foreground-focus, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n --toggle-button-foreground-filled: var(--ig-select-toggle-button-foreground-filled, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n --toggle-button-background-disabled: var(--ig-select-toggle-button-background-disabled, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n --toggle-button-foreground-disabled: var(--ig-select-toggle-button-foreground-disabled, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n --elevation: var(--ig-drop-down-elevation, var(--ig-elevation-8));\n --background-color: var(--ig-drop-down-background-color, hsla(var(--ig-surface-500), var(--ig-surface-a)));\n --header-text-color: var(--ig-drop-down-header-text-color, hsla(var(--ig-secondary-500), var(--ig-secondary-a)));\n --item-text-color: var(--ig-drop-down-item-text-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --hover-item-text-color: var(--ig-drop-down-hover-item-text-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --hover-item-background: var(--ig-drop-down-hover-item-background, hsla(var(--ig-gray-100), 0.8));\n --focused-item-background: var(--ig-drop-down-focused-item-background, hsla(var(--ig-gray-100), 0.8));\n --focused-item-text-color: var(--ig-drop-down-focused-item-text-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n --selected-item-background: var(--ig-drop-down-selected-item-background, hsla(var(--ig-secondary-100), var(--ig-secondary-a)));\n --selected-item-text-color: var(--ig-drop-down-selected-item-text-color, var(--ig-secondary-100-contrast));\n --selected-hover-item-background: var(--ig-drop-down-selected-hover-item-background, hsla(var(--ig-secondary-200), var(--ig-secondary-a)));\n --selected-hover-item-text-color: var(--ig-drop-down-selected-hover-item-text-color, var(--ig-secondary-200-contrast));\n --selected-focus-item-background: var(--ig-drop-down-selected-focus-item-background, hsla(var(--ig-secondary-200), var(--ig-secondary-a)));\n --selected-focus-item-text-color: var(--ig-drop-down-selected-focus-item-text-color, var(--ig-secondary-200-contrast));\n --disabled-item-background: var(--ig-drop-down-disabled-item-background, hsla(var(--ig-gray-50), 0));\n --disabled-item-text-color: var(--ig-drop-down-disabled-item-text-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n --border-color: var(--ig-drop-down-border-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n --border-width: var(--ig-drop-down-border-width, 0);\n --border-radius: var(--ig-drop-down-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));\n --item-border-radius: var(--ig-drop-down-item-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 1.25rem), 1.25rem));\n --size: var(--ig-drop-down-size, max(var(--is-large, 1) * max(2.5rem, -1 * 2.5rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.75rem, -1 * 1.75rem)));\n}\n\n[part=base] {\n background: var(--background-color);\n border-radius: var(--border-radius);\n -webkit-box-shadow: var(--ig-elevation-8);\n box-shadow: var(--ig-elevation-8);\n padding: 0.5rem 0;\n}\n\n:host([outlined]:focus-within) igc-input[readonly]:not([disabled])::part(start) {\n border-color: var(--focused-border-color);\n border-inline-start-width: 0.125rem;\n border-block-start-width: 0.125rem;\n border-block-end-width: 0.125rem;\n}\n:host([outlined]:focus-within) igc-input[readonly]:not([disabled])::part(filler) {\n border-width: 0.125rem;\n border-color: var(--focused-border-color);\n}\n:host([outlined]:focus-within) igc-input:not([invalid])::part(notch) {\n border-bottom-width: 0.125rem;\n border-bottom-color: var(--focused-border-color);\n}\n:host([outlined]:focus-within) igc-input[readonly]:not([disabled])::part(end) {\n border-color: var(--focused-border-color);\n border-inline-end-width: 0.125rem;\n border-block-start-width: 0.125rem;\n border-block-end-width: 0.125rem;\n}\n:host([outlined]:focus-within) igc-input[readonly]:not([disabled])::part(label) {\n color: var(--focused-border-color);\n}\n:host([outlined]:focus-within) [part~=toggle-icon] {\n background: var(--toggle-button-background-focus--border);\n}\n\n:host([outlined][invalid]:focus-within) igc-input[readonly]:not([disabled])::part(start) {\n border-color: var(--error-secondary-color);\n border-inline-start-width: 0.125rem;\n border-block-start-width: 0.125rem;\n border-block-end-width: 0.125rem;\n}\n:host([outlined][invalid]:focus-within) igc-input[readonly]:not([disabled])::part(filler) {\n border-width: 0.125rem;\n border-color: var(--error-secondary-color);\n}\n:host([outlined][invalid]:focus-within) igc-input[readonly]:not([disabled])::part(end) {\n border-color: var(--error-secondary-color);\n border-inline-end-width: 0.125rem;\n border-block-start-width: 0.125rem;\n border-block-end-width: 0.125rem;\n}\n:host([outlined][invalid]:focus-within) igc-input[readonly]:not([disabled])::part(label) {\n color: var(--error-secondary-color);\n}\n\n:host(:not([outlined]):focus-within) igc-input::part(container) {\n background: var(--box-background-focus);\n border-bottom-color: var(--focused-bottom-line-color);\n}\n:host(:not([outlined]):focus-within) [part~=toggle-icon] {\n background: var(--toggle-button-background-focus);\n}\n\n:host(:focus-within) [part~=toggle-icon] {\n background: var(--toggle-button-background-focus--border);\n color: var(--toggle-button-foreground-focus);\n}\n:host(:focus-within) [part~=toggle-icon] igc-icon {\n color: inherit;\n}\n\n:host(:not([outlined])[invalid]:focus-within) igc-input::part(container) {\n border-bottom-color: var(--error-secondary-color);\n}\n\n[part~=toggle-icon] {\n background: var(--toggle-button-background);\n color: var(--toggle-button-foreground);\n}\n[part~=toggle-icon] igc-icon {\n color: inherit;\n}\n\n[part=\"toggle-icon filled\"] {\n color: var(--toggle-button-foreground-filled);\n}\n\n[part=helper-text] {\n color: var(--helper-text-color);\n margin-top: 0.3125rem;\n padding-inline: max(var(--is-large, 1) * max(1.125rem, -1 * 1.125rem) * var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)), var(--is-medium, 1) * max(1rem, -1 * 1rem) * var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem) * var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)));\n}\n\n:host([invalid]) [part=helper-text] {\n color: var(--error-secondary-color);\n}\n\n:host([disabled]) igc-input::part(input)::-moz-selection, :host(:disabled) igc-input::part(input)::-moz-selection {\n background: transparent;\n}\n\n:host([disabled]) igc-input::part(input)::selection,\n:host(:disabled) igc-input::part(input)::selection {\n background: transparent;\n}\n:host([disabled]) [part~=toggle-icon],\n:host(:disabled) [part~=toggle-icon] {\n background: var(--toggle-button-background-disabled);\n color: var(--toggle-button-foreground-disabled);\n}\n:host([disabled]) [part~=toggle-icon] igc-icon,\n:host(:disabled) [part~=toggle-icon] igc-icon {\n color: inherit;\n}\n:host([disabled]) [part=helper-text],\n:host(:disabled) [part=helper-text] {\n color: var(--disabled-text-color);\n}\n\n:host(:disabled[outlined]) igc-input::part(filled) + igc-input::part(notch),\n:host([outlined][disabled]) igc-input::part(filled) + igc-input::part(notch),\n:host([outlined][invalid]) igc-input::part(filled) + igc-input::part(notch) {\n border-top-color: transparent;\n}`;\n"]}
1	+ {"version":3,"file":"select.material.css.js","sourceRoot":"","sources":["../../../../../src/components/select/themes/light/select.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,0+GAA0+G,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--toggle-button-background-focus--border: var(--ig-select-toggle-button-background-focus--border, hsla(var(--ig-gray-300), var(--ig-gray-a)));--toggle-button-background: var(--ig-select-toggle-button-background, hsla(var(--ig-gray-300), var(--ig-gray-a)));--toggle-button-background-focus: var(--ig-select-toggle-button-background-focus, hsla(var(--ig-gray-400), 0.3));--toggle-button-foreground: var(--ig-select-toggle-button-foreground, hsla(var(--ig-gray-700), var(--ig-gray-a)));--toggle-button-foreground-focus: var(--ig-select-toggle-button-foreground-focus, hsla(var(--ig-gray-700), var(--ig-gray-a)));--toggle-button-foreground-filled: var(--ig-select-toggle-button-foreground-filled, hsla(var(--ig-gray-900), var(--ig-gray-a)));--toggle-button-background-disabled: var(--ig-select-toggle-button-background-disabled, hsla(var(--ig-gray-100), var(--ig-gray-a)));--toggle-button-foreground-disabled: var(--ig-select-toggle-button-foreground-disabled, hsla(var(--ig-gray-500), var(--ig-gray-a)));--default-size: var(--ig-select-default-size, 2);--elevation: var(--ig-dropdown-elevation, var(--ig-elevation-8));--background-color: var(--ig-dropdown-background-color, hsla(var(--ig-surface-500), var(--ig-surface-a)));--header-text-color: var(--ig-dropdown-header-text-color, hsla(var(--ig-secondary-500), var(--ig-secondary-a)));--item-text-color: var(--ig-dropdown-item-text-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));--hover-item-text-color: var(--ig-dropdown-hover-item-text-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));--hover-item-background: var(--ig-dropdown-hover-item-background, hsla(var(--ig-gray-100), 0.8));--focused-item-background: var(--ig-dropdown-focused-item-background, hsla(var(--ig-gray-100), 0.8));--focused-item-text-color: var(--ig-dropdown-focused-item-text-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));--selected-item-background: var(--ig-dropdown-selected-item-background, hsla(var(--ig-secondary-100), var(--ig-secondary-a)));--selected-item-text-color: var(--ig-dropdown-selected-item-text-color, var(--ig-secondary-100-contrast));--selected-hover-item-background: var(--ig-dropdown-selected-hover-item-background, hsla(var(--ig-secondary-200), var(--ig-secondary-a)));--selected-hover-item-text-color: var(--ig-dropdown-selected-hover-item-text-color, var(--ig-secondary-200-contrast));--selected-focus-item-background: var(--ig-dropdown-selected-focus-item-background, hsla(var(--ig-secondary-200), var(--ig-secondary-a)));--selected-focus-item-text-color: var(--ig-dropdown-selected-focus-item-text-color, var(--ig-secondary-200-contrast));--disabled-item-background: var(--ig-dropdown-disabled-item-background, hsla(var(--ig-gray-50), 0));--disabled-item-text-color: var(--ig-dropdown-disabled-item-text-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--border-color: var(--ig-dropdown-border-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));--border-width: var(--ig-dropdown-border-width, 0);--border-radius: var(--ig-dropdown-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--item-border-radius: var(--ig-dropdown-item-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 1.25rem), 1.25rem));--size: var(--ig-dropdown-size, max(var(--is-large, 1) * max(2.5rem, -1 * 2.5rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.75rem, -1 * 1.75rem)));--default-size: var(--ig-dropdown-default-size, 2);--dd-background-color: var(--background-color);--dd-border-radius:var(--border-radius);--dd-border-color: var(--border-color)}`;\n"]}

package/components/select/themes/select.base.css.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export declare const styles: import("lit").CSSResult;

package/components/select/themes/select.base.css.js ADDED Viewed

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size);height:var(--ig-scrollbar-size);background:var(--ig-scrollbar-track-background)}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background)}:host([hidden]),[hidden]{display:none !important}:host{display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--ig-font-family)}[part=base]{overflow:hidden auto;min-width:7rem;z-index:10005}:host{display:block}[role=combobox]{outline-style:none}:host([disabled]) [role=combobox]{pointer-events:none}igc-input,igc-icon{--component-size: var(--select-size) !important;cursor:pointer}igc-input::part(input){cursor:pointer}igc-input::part(input)::-moz-selection{background:rgba(0,0,0,0)}igc-input::part(input)::selection{background:rgba(0,0,0,0)}[part=helper-text]{line-height:1}[part=helper-text] ::slotted([slot=helper-text]){font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);line-height:inherit}[name=prefix]::slotted(*),[name=suffix]::slotted(*){display:-webkit-box;display:-ms-flexbox;display:flex}`;
+//# sourceMappingURL=select.base.css.js.map

package/components/select/themes/select.base.css.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"select.base.css.js","sourceRoot":"","sources":["../../../../src/components/select/themes/select.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,i9DAAi9D,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size);height:var(--ig-scrollbar-size);background:var(--ig-scrollbar-track-background)}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background)}:host([hidden]),[hidden]{display:none !important}:host{display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--ig-font-family)}[part=base]{overflow:hidden auto;min-width:7rem;z-index:10005}:host{display:block}[role=combobox]{outline-style:none}:host([disabled]) [role=combobox]{pointer-events:none}igc-input,igc-icon{--component-size: var(--select-size) !important;cursor:pointer}igc-input::part(input){cursor:pointer}igc-input::part(input)::-moz-selection{background:rgba(0,0,0,0)}igc-input::part(input)::selection{background:rgba(0,0,0,0)}[part=helper-text]{line-height:1}[part=helper-text] ::slotted([slot=helper-text]){font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);line-height:inherit}[name=prefix]::slotted(*),[name=suffix]::slotted(*){display:-webkit-box;display:-ms-flexbox;display:flex}`;\n"]}

package/components/select/themes/shared/select.bootstrap.css.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export declare const styles: import("lit").CSSResult;

package/components/select/themes/shared/select.bootstrap.css.js ADDED Viewed

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `:host{--component-size: var(--ig-size, var(--default-size));--select-size: var(--component-size);--dropdown-size: var(--component-size)}:host [part=helper-text]{margin-top:.25rem}:host ::slotted([slot=helper-text]){font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);color:var(--helper-text-color)}[part=base]{background:var(--dd-background-color);border-radius:var(--dd-border-radius);border:.0625rem solid var(--dd-border-color);padding:.5rem 0}[part~=toggle-icon]{background:var(--toggle-button-background);color:var(--toggle-button-foreground)}[part~=toggle-icon] igc-icon{color:inherit}:host(:focus-within) igc-input[readonly]:not([disabled])::part(input){-webkit-box-shadow:0 0 0 .25rem var(--focused-secondary-color);box-shadow:0 0 0 .25rem var(--focused-secondary-color);border-color:var(--focused-border-color)}:host(:focus-within) [part~=toggle-icon]{background:var(--toggle-button-background-focus--border);color:var(--toggle-button-foreground-focus)}:host(:focus-within) [part~=toggle-icon] igc-icon{color:inherit}:host([invalid]) igc-input[readonly]:not([disabled])::part(input),:host([invalid]:focus-within) igc-input[readonly]:not([disabled])::part(input){-webkit-box-shadow:0 0 0 .25rem var(--error-shadow-color);box-shadow:0 0 0 .25rem var(--error-shadow-color);border-color:var(--error-secondary-color)}:host([invalid]) ::slotted([slot=helper-text]){color:var(--error-secondary-color)}:host([disabled]) ::slotted([slot=helper-text]),:host(:disabled) ::slotted([slot=helper-text]){color:var(--disabled-text-color)}:host([disabled]) [part~=toggle-icon],:host(:disabled) [part~=toggle-icon]{background:var(--toggle-button-background-disabled);color:var(--toggle-button-foreground-disabled)}:host([disabled]) [part~=toggle-icon] igc-icon,:host(:disabled) [part~=toggle-icon] igc-icon{color:inherit}`;
+//# sourceMappingURL=select.bootstrap.css.js.map

package/components/select/themes/shared/select.bootstrap.css.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"select.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/select/themes/shared/select.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,knEAAknE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--component-size: var(--ig-size, var(--default-size));--select-size: var(--component-size);--dropdown-size: var(--component-size)}:host [part=helper-text]{margin-top:.25rem}:host ::slotted([slot=helper-text]){font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);color:var(--helper-text-color)}[part=base]{background:var(--dd-background-color);border-radius:var(--dd-border-radius);border:.0625rem solid var(--dd-border-color);padding:.5rem 0}[part~=toggle-icon]{background:var(--toggle-button-background);color:var(--toggle-button-foreground)}[part~=toggle-icon] igc-icon{color:inherit}:host(:focus-within) igc-input[readonly]:not([disabled])::part(input){-webkit-box-shadow:0 0 0 .25rem var(--focused-secondary-color);box-shadow:0 0 0 .25rem var(--focused-secondary-color);border-color:var(--focused-border-color)}:host(:focus-within) [part~=toggle-icon]{background:var(--toggle-button-background-focus--border);color:var(--toggle-button-foreground-focus)}:host(:focus-within) [part~=toggle-icon] igc-icon{color:inherit}:host([invalid]) igc-input[readonly]:not([disabled])::part(input),:host([invalid]:focus-within) igc-input[readonly]:not([disabled])::part(input){-webkit-box-shadow:0 0 0 .25rem var(--error-shadow-color);box-shadow:0 0 0 .25rem var(--error-shadow-color);border-color:var(--error-secondary-color)}:host([invalid]) ::slotted([slot=helper-text]){color:var(--error-secondary-color)}:host([disabled]) ::slotted([slot=helper-text]),:host(:disabled) ::slotted([slot=helper-text]){color:var(--disabled-text-color)}:host([disabled]) [part~=toggle-icon],:host(:disabled) [part~=toggle-icon]{background:var(--toggle-button-background-disabled);color:var(--toggle-button-foreground-disabled)}:host([disabled]) [part~=toggle-icon] igc-icon,:host(:disabled) [part~=toggle-icon] igc-icon{color:inherit}`;\n"]}

package/components/select/themes/shared/select.fluent.css.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export declare const styles: import("lit").CSSResult;

package/components/select/themes/shared/select.fluent.css.js ADDED Viewed

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `:host{--component-size: var(--ig-size, var(--default-size));--select-size: var(--component-size);--dropdown-size: var(--component-size)}[part=base]{background:var(--dd-background-color);border-radius:var(--dd-border-radius);-webkit-box-shadow:var(--ig-elevation-4);box-shadow:var(--ig-elevation-4)}[part=helper-text]{margin-top:.3125rem}[part=helper-text] ::slotted([slot=helper-text]){color:var(--helper-text-color)}[part~=toggle-icon]{background:var(--toggle-button-background);color:var(--toggle-button-foreground)}[part~=toggle-icon] igc-icon{color:inherit}:host(:focus-within) igc-input[readonly]:not([disabled])::part(container){border-width:0.125rem}:host(:focus-within) [part~=toggle-icon]{background:var(--toggle-button-background-focus--border);color:var(--toggle-button-foreground-focus)}:host(:focus-within) [part~=toggle-icon] igc-icon{color:inherit}:host(:not([invalid]):focus-within) igc-input[readonly]:not([disabled])::part(container){border-color:var(--focused-border-color);border-width:0.125rem}:host(:not([invalid]):focus-within) igc-input[readonly]:not([disabled])::part(prefix){-webkit-margin-start:-0.0625rem;margin-inline-start:-0.0625rem}:host(:not([invalid]):focus-within) igc-input[readonly]:not([disabled])::part(suffix){-webkit-margin-end:-0.0625rem;margin-inline-end:-0.0625rem}:host(:disabled) [part=helper-text] ::slotted([slot=helper-text]),:host([disabled]) [part=helper-text] ::slotted([slot=helper-text]){color:var(--disabled-text-color)}:host(:disabled) [part~=toggle-icon],:host([disabled]) [part~=toggle-icon]{background:var(--toggle-button-background-disabled);color:var(--toggle-button-foreground-disabled)}:host(:disabled) [part~=toggle-icon] igc-icon,:host([disabled]) [part~=toggle-icon] igc-icon{color:inherit}`;
+//# sourceMappingURL=select.fluent.css.js.map

package/components/select/themes/shared/select.fluent.css.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"select.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/select/themes/shared/select.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,8tDAA8tD,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--component-size: var(--ig-size, var(--default-size));--select-size: var(--component-size);--dropdown-size: var(--component-size)}[part=base]{background:var(--dd-background-color);border-radius:var(--dd-border-radius);-webkit-box-shadow:var(--ig-elevation-4);box-shadow:var(--ig-elevation-4)}[part=helper-text]{margin-top:.3125rem}[part=helper-text] ::slotted([slot=helper-text]){color:var(--helper-text-color)}[part~=toggle-icon]{background:var(--toggle-button-background);color:var(--toggle-button-foreground)}[part~=toggle-icon] igc-icon{color:inherit}:host(:focus-within) igc-input[readonly]:not([disabled])::part(container){border-width:0.125rem}:host(:focus-within) [part~=toggle-icon]{background:var(--toggle-button-background-focus--border);color:var(--toggle-button-foreground-focus)}:host(:focus-within) [part~=toggle-icon] igc-icon{color:inherit}:host(:not([invalid]):focus-within) igc-input[readonly]:not([disabled])::part(container){border-color:var(--focused-border-color);border-width:0.125rem}:host(:not([invalid]):focus-within) igc-input[readonly]:not([disabled])::part(prefix){-webkit-margin-start:-0.0625rem;margin-inline-start:-0.0625rem}:host(:not([invalid]):focus-within) igc-input[readonly]:not([disabled])::part(suffix){-webkit-margin-end:-0.0625rem;margin-inline-end:-0.0625rem}:host(:disabled) [part=helper-text] ::slotted([slot=helper-text]),:host([disabled]) [part=helper-text] ::slotted([slot=helper-text]){color:var(--disabled-text-color)}:host(:disabled) [part~=toggle-icon],:host([disabled]) [part~=toggle-icon]{background:var(--toggle-button-background-disabled);color:var(--toggle-button-foreground-disabled)}:host(:disabled) [part~=toggle-icon] igc-icon,:host([disabled]) [part~=toggle-icon] igc-icon{color:inherit}`;\n"]}

package/components/select/themes/shared/select.indigo.css.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export declare const styles: import("lit").CSSResult;

package/components/select/themes/shared/select.indigo.css.js ADDED Viewed

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `:host{--component-size: var(--ig-size, var(--default-size));--select-size: var(--component-size);--dropdown-size: var(--component-size)}:host ::slotted([slot=helper-text]){color:var(--helper-text-color)}:host igc-input::part(input){color:var(--filled-text-color)}:host igc-input::part(container){padding-inline:0}:host [part=helper-text]{margin-top:.375rem;padding-inline:max(var(--is-large, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)),var(--is-medium, 1)*max(0.75rem, -1 * 0.75rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)),var(--is-small, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)))}[part=base]{background:var(--dd-background-color);border-radius:var(--dd-border-radius);-webkit-box-shadow:var(--ig-elevation-3);box-shadow:var(--ig-elevation-3)}[part~=toggle-icon]{background:var(--toggle-button-background);color:var(--toggle-button-foreground)}[part~=toggle-icon] igc-icon{color:inherit}:host(:focus-within) igc-input::part(label){color:var(--focused-secondary-color)}:host(:focus-within) igc-input::part(container){background:var(--box-background-hover)}:host(:focus-within) igc-input::part(container)::after{-webkit-transform:scaleY(1);-ms-transform:scaleY(1);transform:scaleY(1)}:host(:focus-within) [part~=toggle-icon]{background:var(--toggle-button-background-focus--border);color:var(--toggle-button-foreground-focus)}:host(:focus-within) [part~=toggle-icon] igc-icon{color:inherit}:host([invalid]) ::slotted([slot=helper-text]){color:var(--error-secondary-color)}:host([invalid]:focus-within) igc-input::part(label){color:var(--error-secondary-color)}:host(:disabled) igc-input::part(input),:host([disabled]) igc-input::part(input){color:var(--disabled-text-color)}:host(:disabled) ::slotted([slot=helper-text]),:host([disabled]) ::slotted([slot=helper-text]){color:var(--disabled-text-color)}:host(:disabled) [part~=toggle-icon],:host([disabled]) [part~=toggle-icon]{background:var(--toggle-button-background-disabled);color:var(--toggle-button-foreground-disabled)}:host(:disabled) [part~=toggle-icon] igc-icon,:host([disabled]) [part~=toggle-icon] igc-icon{color:inherit}`;
+//# sourceMappingURL=select.indigo.css.js.map

package/components/select/themes/shared/select.indigo.css.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"select.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/select/themes/shared/select.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,grEAAgrE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--component-size: var(--ig-size, var(--default-size));--select-size: var(--component-size);--dropdown-size: var(--component-size)}:host ::slotted([slot=helper-text]){color:var(--helper-text-color)}:host igc-input::part(input){color:var(--filled-text-color)}:host igc-input::part(container){padding-inline:0}:host [part=helper-text]{margin-top:.375rem;padding-inline:max(var(--is-large, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)),var(--is-medium, 1)*max(0.75rem, -1 * 0.75rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)),var(--is-small, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)))}[part=base]{background:var(--dd-background-color);border-radius:var(--dd-border-radius);-webkit-box-shadow:var(--ig-elevation-3);box-shadow:var(--ig-elevation-3)}[part~=toggle-icon]{background:var(--toggle-button-background);color:var(--toggle-button-foreground)}[part~=toggle-icon] igc-icon{color:inherit}:host(:focus-within) igc-input::part(label){color:var(--focused-secondary-color)}:host(:focus-within) igc-input::part(container){background:var(--box-background-hover)}:host(:focus-within) igc-input::part(container)::after{-webkit-transform:scaleY(1);-ms-transform:scaleY(1);transform:scaleY(1)}:host(:focus-within) [part~=toggle-icon]{background:var(--toggle-button-background-focus--border);color:var(--toggle-button-foreground-focus)}:host(:focus-within) [part~=toggle-icon] igc-icon{color:inherit}:host([invalid]) ::slotted([slot=helper-text]){color:var(--error-secondary-color)}:host([invalid]:focus-within) igc-input::part(label){color:var(--error-secondary-color)}:host(:disabled) igc-input::part(input),:host([disabled]) igc-input::part(input){color:var(--disabled-text-color)}:host(:disabled) ::slotted([slot=helper-text]),:host([disabled]) ::slotted([slot=helper-text]){color:var(--disabled-text-color)}:host(:disabled) [part~=toggle-icon],:host([disabled]) [part~=toggle-icon]{background:var(--toggle-button-background-disabled);color:var(--toggle-button-foreground-disabled)}:host(:disabled) [part~=toggle-icon] igc-icon,:host([disabled]) [part~=toggle-icon] igc-icon{color:inherit}`;\n"]}

package/components/select/themes/shared/select.material.css.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export declare const styles: import("lit").CSSResult;

package/components/select/themes/shared/select.material.css.js ADDED Viewed

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `[part=base]{background:var(--dd-background-color);border-radius:var(--dd-border-radius);-webkit-box-shadow:var(--ig-elevation-8);box-shadow:var(--ig-elevation-8);padding:.5rem 0}:host{--component-size: var(--ig-size, var(--default-size));--select-size: var(--component-size);--dropdown-size: var(--component-size)}:host([outlined]:focus-within) igc-input[readonly]:not([disabled])::part(start){border-color:var(--focused-border-color);border-inline-start-width:.125rem;border-block-start-width:.125rem;border-block-end-width:.125rem}:host([outlined]:focus-within) igc-input[readonly]:not([disabled])::part(filler){border-width:.125rem;border-color:var(--focused-border-color)}:host([outlined]:focus-within) igc-input:not([invalid])::part(notch){border-bottom-width:.125rem;border-bottom-color:var(--focused-border-color)}:host([outlined]:focus-within) igc-input[readonly]:not([disabled])::part(end){border-color:var(--focused-border-color);border-inline-end-width:.125rem;border-block-start-width:.125rem;border-block-end-width:.125rem}:host([outlined]:focus-within) igc-input[readonly]:not([disabled])::part(label){color:var(--focused-border-color)}:host([outlined]:focus-within) [part~=toggle-icon]{background:var(--toggle-button-background-focus--border)}:host([outlined][invalid]:focus-within) igc-input[readonly]:not([disabled])::part(start){border-color:var(--error-secondary-color);border-inline-start-width:.125rem;border-block-start-width:.125rem;border-block-end-width:.125rem}:host([outlined][invalid]:focus-within) igc-input[readonly]:not([disabled])::part(filler){border-width:.125rem;border-color:var(--error-secondary-color)}:host([outlined][invalid]:focus-within) igc-input[readonly]:not([disabled])::part(end){border-color:var(--error-secondary-color);border-inline-end-width:.125rem;border-block-start-width:.125rem;border-block-end-width:.125rem}:host([outlined][invalid]:focus-within) igc-input[readonly]:not([disabled])::part(label){color:var(--error-secondary-color)}:host(:not([outlined]):focus-within) igc-input::part(container){background:var(--box-background-focus);border-bottom-color:var(--focused-bottom-line-color)}:host(:not([outlined]):focus-within) [part~=toggle-icon]{background:var(--toggle-button-background-focus)}:host(:focus-within) [part~=toggle-icon]{background:var(--toggle-button-background-focus--border);color:var(--toggle-button-foreground-focus)}:host(:focus-within) [part~=toggle-icon] igc-icon{color:inherit}:host(:not([outlined])[invalid]:focus-within) igc-input::part(container){border-bottom-color:var(--error-secondary-color)}[part~=toggle-icon]{background:var(--toggle-button-background);color:var(--toggle-button-foreground)}[part~=toggle-icon] igc-icon{color:inherit}[part="toggle-icon filled"]{color:var(--toggle-button-foreground-filled)}[part=helper-text]{color:var(--helper-text-color);margin-top:.3125rem;padding-inline:max(var(--is-large, 1)*max(1.125rem, -1 * 1.125rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)),var(--is-medium, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)),var(--is-small, 1)*max(0.875rem, -1 * 0.875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)))}:host([invalid]) [part=helper-text]{color:var(--error-secondary-color)}:host([disabled]) igc-input::part(input)::-moz-selection, :host(:disabled) igc-input::part(input)::-moz-selection{background:rgba(0,0,0,0)}:host([disabled]) igc-input::part(input)::selection,:host(:disabled) igc-input::part(input)::selection{background:rgba(0,0,0,0)}:host([disabled]) [part~=toggle-icon],:host(:disabled) [part~=toggle-icon]{background:var(--toggle-button-background-disabled);color:var(--toggle-button-foreground-disabled)}:host([disabled]) [part~=toggle-icon] igc-icon,:host(:disabled) [part~=toggle-icon] igc-icon{color:inherit}:host([disabled]) [part=helper-text],:host(:disabled) [part=helper-text]{color:var(--disabled-text-color)}:host(:disabled[outlined]) igc-input::part(filled)+igc-input::part(notch),:host([outlined][disabled]) igc-input::part(filled)+igc-input::part(notch),:host([outlined][invalid]) igc-input::part(filled)+igc-input::part(notch){border-top-color:rgba(0,0,0,0)}`;
+//# sourceMappingURL=select.material.css.js.map

package/components/select/themes/shared/select.material.css.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"select.material.css.js","sourceRoot":"","sources":["../../../../../src/components/select/themes/shared/select.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,0nIAA0nI,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`[part=base]{background:var(--dd-background-color);border-radius:var(--dd-border-radius);-webkit-box-shadow:var(--ig-elevation-8);box-shadow:var(--ig-elevation-8);padding:.5rem 0}:host{--component-size: var(--ig-size, var(--default-size));--select-size: var(--component-size);--dropdown-size: var(--component-size)}:host([outlined]:focus-within) igc-input[readonly]:not([disabled])::part(start){border-color:var(--focused-border-color);border-inline-start-width:.125rem;border-block-start-width:.125rem;border-block-end-width:.125rem}:host([outlined]:focus-within) igc-input[readonly]:not([disabled])::part(filler){border-width:.125rem;border-color:var(--focused-border-color)}:host([outlined]:focus-within) igc-input:not([invalid])::part(notch){border-bottom-width:.125rem;border-bottom-color:var(--focused-border-color)}:host([outlined]:focus-within) igc-input[readonly]:not([disabled])::part(end){border-color:var(--focused-border-color);border-inline-end-width:.125rem;border-block-start-width:.125rem;border-block-end-width:.125rem}:host([outlined]:focus-within) igc-input[readonly]:not([disabled])::part(label){color:var(--focused-border-color)}:host([outlined]:focus-within) [part~=toggle-icon]{background:var(--toggle-button-background-focus--border)}:host([outlined][invalid]:focus-within) igc-input[readonly]:not([disabled])::part(start){border-color:var(--error-secondary-color);border-inline-start-width:.125rem;border-block-start-width:.125rem;border-block-end-width:.125rem}:host([outlined][invalid]:focus-within) igc-input[readonly]:not([disabled])::part(filler){border-width:.125rem;border-color:var(--error-secondary-color)}:host([outlined][invalid]:focus-within) igc-input[readonly]:not([disabled])::part(end){border-color:var(--error-secondary-color);border-inline-end-width:.125rem;border-block-start-width:.125rem;border-block-end-width:.125rem}:host([outlined][invalid]:focus-within) igc-input[readonly]:not([disabled])::part(label){color:var(--error-secondary-color)}:host(:not([outlined]):focus-within) igc-input::part(container){background:var(--box-background-focus);border-bottom-color:var(--focused-bottom-line-color)}:host(:not([outlined]):focus-within) [part~=toggle-icon]{background:var(--toggle-button-background-focus)}:host(:focus-within) [part~=toggle-icon]{background:var(--toggle-button-background-focus--border);color:var(--toggle-button-foreground-focus)}:host(:focus-within) [part~=toggle-icon] igc-icon{color:inherit}:host(:not([outlined])[invalid]:focus-within) igc-input::part(container){border-bottom-color:var(--error-secondary-color)}[part~=toggle-icon]{background:var(--toggle-button-background);color:var(--toggle-button-foreground)}[part~=toggle-icon] igc-icon{color:inherit}[part=\"toggle-icon filled\"]{color:var(--toggle-button-foreground-filled)}[part=helper-text]{color:var(--helper-text-color);margin-top:.3125rem;padding-inline:max(var(--is-large, 1)*max(1.125rem, -1 * 1.125rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)),var(--is-medium, 1)*max(1rem, -1 * 1rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)),var(--is-small, 1)*max(0.875rem, -1 * 0.875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)))}:host([invalid]) [part=helper-text]{color:var(--error-secondary-color)}:host([disabled]) igc-input::part(input)::-moz-selection, :host(:disabled) igc-input::part(input)::-moz-selection{background:rgba(0,0,0,0)}:host([disabled]) igc-input::part(input)::selection,:host(:disabled) igc-input::part(input)::selection{background:rgba(0,0,0,0)}:host([disabled]) [part~=toggle-icon],:host(:disabled) [part~=toggle-icon]{background:var(--toggle-button-background-disabled);color:var(--toggle-button-foreground-disabled)}:host([disabled]) [part~=toggle-icon] igc-icon,:host(:disabled) [part~=toggle-icon] igc-icon{color:inherit}:host([disabled]) [part=helper-text],:host(:disabled) [part=helper-text]{color:var(--disabled-text-color)}:host(:disabled[outlined]) igc-input::part(filled)+igc-input::part(notch),:host([outlined][disabled]) igc-input::part(filled)+igc-input::part(notch),:host([outlined][invalid]) igc-input::part(filled)+igc-input::part(notch){border-top-color:rgba(0,0,0,0)}`;\n"]}

package/components/select/themes/themes.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import { Themes } from '../../../theming/types.js';
2	+ export declare const all: Themes;

package/components/select/themes/themes.js ADDED Viewed

@@ -0,0 +1,43 @@
+import { css } from 'lit';
+import { styles as bootstrapDark } from './dark/select.bootstrap.css.js';
+import { styles as fluentDark } from './dark/select.fluent.css.js';
+import { styles as indigoDark } from './dark/select.indigo.css.js';
+import { styles as materialDark } from './dark/select.material.css.js';
+import { styles as bootstrapLight } from './light/select.bootstrap.css.js';
+import { styles as fluentLight } from './light/select.fluent.css.js';
+import { styles as indigoLight } from './light/select.indigo.css.js';
+import { styles as materialLight } from './light/select.material.css.js';
+import { styles as bootstrap } from './shared/select.bootstrap.css.js';
+import { styles as fluent } from './shared/select.fluent.css.js';
+import { styles as indigo } from './shared/select.indigo.css.js';
+import { styles as material } from './shared/select.material.css.js';
+const light = {
+    bootstrap: css `
+    ${bootstrap} ${bootstrapLight}
+  `,
+    material: css `
+    ${material} ${materialLight}
+  `,
+    fluent: css `
+    ${fluent} ${fluentLight}
+  `,
+    indigo: css `
+    ${indigo} ${indigoLight}
+  `,
+};
+const dark = {
+    bootstrap: css `
+    ${bootstrap} ${bootstrapDark}
+  `,
+    material: css `
+    ${material} ${materialDark}
+  `,
+    fluent: css `
+    ${fluent} ${fluentDark}
+  `,
+    indigo: css `
+    ${indigo} ${indigoDark}
+  `,
+};
+export const all = { light, dark };
+//# sourceMappingURL=themes.js.map

package/components/select/themes/themes.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../../src/components/select/themes/themes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAG1B,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,gCAAgC,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAEvE,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAC3E,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,8BAA8B,CAAC;AACrE,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,8BAA8B,CAAC;AACrE,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAEzE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,kCAAkC,CAAC;AACvE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,MAAM,IAAI,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAGrE,MAAM,KAAK,GAAG;IACZ,SAAS,EAAE,GAAG,CAAA;MACV,SAAS,IAAI,cAAc;GAC9B;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,QAAQ,IAAI,aAAa;GAC5B;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,WAAW;GACxB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,WAAW;GACxB;CACF,CAAC;AAEF,MAAM,IAAI,GAAG;IACX,SAAS,EAAE,GAAG,CAAA;MACV,SAAS,IAAI,aAAa;GAC7B;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,QAAQ,IAAI,YAAY;GAC3B;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,UAAU;GACvB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,UAAU;GACvB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,GAAG,GAAW,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\n// Dark Overrides\nimport { styles as bootstrapDark } from './dark/select.bootstrap.css.js';\nimport { styles as fluentDark } from './dark/select.fluent.css.js';\nimport { styles as indigoDark } from './dark/select.indigo.css.js';\nimport { styles as materialDark } from './dark/select.material.css.js';\n// Light Overrides\nimport { styles as bootstrapLight } from './light/select.bootstrap.css.js';\nimport { styles as fluentLight } from './light/select.fluent.css.js';\nimport { styles as indigoLight } from './light/select.indigo.css.js';\nimport { styles as materialLight } from './light/select.material.css.js';\n// Shared Styles\nimport { styles as bootstrap } from './shared/select.bootstrap.css.js';\nimport { styles as fluent } from './shared/select.fluent.css.js';\nimport { styles as indigo } from './shared/select.indigo.css.js';\nimport { styles as material } from './shared/select.material.css.js';\nimport { Themes } from '../../../theming/types.js';\n\nconst light = {\n bootstrap: css`\n ${bootstrap} ${bootstrapLight}\n `,\n material: css`\n ${material} ${materialLight}\n `,\n fluent: css`\n ${fluent} ${fluentLight}\n `,\n indigo: css`\n ${indigo} ${indigoLight}\n `,\n};\n\nconst dark = {\n bootstrap: css`\n ${bootstrap} ${bootstrapDark}\n `,\n material: css`\n ${material} ${materialDark}\n `,\n fluent: css`\n ${fluent} ${fluentDark}\n `,\n indigo: css`\n ${indigo} ${indigoDark}\n `,\n};\n\nexport const all: Themes = { light, dark };\n"]}

package/components/slider/range-slider.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import { Constructor } from '../common/mixins/constructor.js';
 import { IgcSliderBaseComponent } from './slider-base.js';
+import { Constructor } from '../common/mixins/constructor.js';
 export interface IgcRangeSliderValue {
     lower: number;
     upper: number;

package/components/slider/range-slider.js CHANGED Viewed

@@ -8,10 +8,10 @@ import { html } from 'lit';
 import { property, query } from 'lit/decorators.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { styleMap } from 'lit/directives/style-map.js';
-import { registerComponent } from '../common/definitions/register.js';
-import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
 import { IgcSliderBaseComponent } from './slider-base.js';
 import IgcSliderLabelComponent from './slider-label.js';
+import { registerComponent } from '../common/definitions/register.js';
+import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
 class IgcRangeSliderComponent extends EventEmitterMixin(IgcSliderBaseComponent) {
     constructor() {
         super(...arguments);
@@ -122,18 +122,16 @@ class IgcRangeSliderComponent extends EventEmitterMixin(IgcSliderBaseComponent)
         thumb.focus();
     }
     handleFocus(ev) {
-        var _a, _b;
         this.activeThumb = ev.target;
-        const thumbId = (_a = this.activeThumb) === null || _a === void 0 ? void 0 : _a.id;
-        const thumbs = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll('div[part="thumb"]');
-        thumbs === null || thumbs === void 0 ? void 0 : thumbs.forEach((t) => {
-            var _a;
+        const thumbId = this.activeThumb?.id;
+        const thumbs = this.shadowRoot?.querySelectorAll('div[part="thumb"]');
+        thumbs?.forEach((t) => {
             if (t.id !== thumbId) {
                 const activeThumbVal = parseFloat(this.activeThumb.ariaValueNow);
                 const thumbVal = parseFloat(t.ariaValueNow);
                 const rangeFrom = Math.min(activeThumbVal, thumbVal);
                 const rangeTo = Math.max(activeThumbVal, thumbVal);
-                (_a = this.activeThumb) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-valuetext', `${this.formatValue(rangeFrom)} - ${this.formatValue(rangeTo)}`);
+                this.activeThumb?.setAttribute('aria-valuetext', `${this.formatValue(rangeFrom)} - ${this.formatValue(rangeTo)}`);
             }
         });
     }
@@ -161,11 +159,8 @@ class IgcRangeSliderComponent extends EventEmitterMixin(IgcSliderBaseComponent)
         @pointerenter=${this.handleThumbPointerEnter}
         @pointerleave=${this.handleThumbPointerLeave}
         @focus=${(ev) => this.handleFocus(ev)}
-        @blur=${() => {
-            var _a;
-            return ((_a = this.activeThumb) === null || _a === void 0 ? void 0 : _a.part.remove('focused'),
-                (this.activeThumb = undefined));
-        }}
+        @blur=${() => (this.activeThumb?.part.remove('focused'),
+            (this.activeThumb = undefined))}
       ></div>
       ${this.hideTooltip
             ? html ``
@@ -190,6 +185,7 @@ class IgcRangeSliderComponent extends EventEmitterMixin(IgcSliderBaseComponent)
     }
 }
 IgcRangeSliderComponent.tagName = 'igc-range-slider';
+export default IgcRangeSliderComponent;
 __decorate([
     query(`#thumbFrom`)
 ], IgcRangeSliderComponent.prototype, "thumbFrom", void 0);
@@ -208,5 +204,4 @@ __decorate([
 __decorate([
     property({ attribute: 'aria-label-upper' })
 ], IgcRangeSliderComponent.prototype, "ariaLabelUpper", void 0);
-export default IgcRangeSliderComponent;
 //# sourceMappingURL=range-slider.js.map

package/components/slider/range-slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"range-slider.js","sourceRoot":"","sources":["../../../src/components/slider/range-slider.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { IgcSliderBaseComponent } from './slider-base.js';\nimport IgcSliderLabelComponent from './slider-label.js';\n\n/* blazorSuppress /\nexport interface IgcRangeSliderValue {\n lower: number;\n upper: number;\n}\n\nexport interface IgcRangeSliderEventMap {\n /\n Emitted when a value is changed via thumb drag or keyboard interaction.\n /\n igcInput: CustomEvent<IgcRangeSliderValue>;\n /\n Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n /\n igcChange: CustomEvent<IgcRangeSliderValue>;\n}\n\n/\n A range slider component used to select two numeric values within a range.\n \n @element igc-range-slider\n \n @fires igcInput - Emitted when a value is changed via thumb drag or keyboard interaction.\n * @fires igcChange - Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n \n @csspart base - The base wrapper of the slider.\n * @csspart ticks - The ticks container.\n * @csspart tick-group - The tick group container.\n * @csspart tick - The tick element.\n * @csspart tick-label - The tick label element.\n * @csspart tick-label-inner - The inner element of the tick label.\n * @csspart thumbs - The thumbs container.\n * @csspart thumb - The thumb element.\n * @csspart thumb-label - The thumb tooltip label container.\n * @csspart thumb-label-inner - The thumb tooltip label inner element.\n * @csspart track - The track container.\n * @csspart steps - The track steps element.\n * @csspart inactive - The inactive element of the track.\n * @csspart fill - The filled part of the track.\n /\nexport default class IgcRangeSliderComponent extends EventEmitterMixin<\n IgcRangeSliderEventMap,\n Constructor<IgcSliderBaseComponent>\n>(IgcSliderBaseComponent) {\n public static readonly tagName = 'igc-range-slider';\n\n public static register() {\n registerComponent(this, IgcSliderLabelComponent);\n }\n\n @query(`#thumbFrom`)\n private thumbFrom!: HTMLElement;\n\n @query(`#thumbTo`)\n private thumbTo!: HTMLElement;\n\n private _lower = 0;\n private _upper = 0;\n\n public set lower(val: number) {\n const oldVal = this._lower;\n this._lower = this.validateValue(val);\n this.requestUpdate('lower', oldVal);\n }\n\n /\n The current value of the lower thumb.\n * @attr\n /\n @property({ type: Number })\n public get lower() {\n return this._lower;\n }\n\n public set upper(val: number) {\n const oldVal = this._upper;\n this._upper = this.validateValue(val);\n this.requestUpdate('upper', oldVal);\n }\n\n /\n The current value of the upper thumb.\n * @attr\n /\n @property({ type: Number })\n public get upper() {\n return this._upper;\n }\n\n /\n The aria label of the lower thumb.\n * @attr aria-label-lower\n /\n @property({ attribute: 'aria-label-lower' })\n public ariaLabelLower!: string;\n\n /\n The aria label of the upper thumb.\n * @attr aria-label-upper\n /\n @property({ attribute: 'aria-label-upper' })\n public ariaLabelUpper!: string;\n\n protected override get activeValue(): number {\n return this.activeThumb === this.thumbFrom ? this.lower : this.upper;\n }\n\n protected override normalizeValue(): void {\n this._lower = this.validateValue(this._lower);\n this._upper = this.validateValue(this._upper);\n }\n\n protected override getTrackStyle() {\n const toPosition = this.valueToFraction(this.upper);\n const fromPosition = this.valueToFraction(this.lower);\n const positionGap = toPosition - fromPosition;\n\n const filledTrackStyle = {\n width: `${positionGap 100}%`,\n insetInlineStart: `${fromPosition * 100}%`,\n };\n\n return filledTrackStyle;\n }\n\n private closestTo(goal: number, positions: number[]): number {\n return positions.reduce((previous, current) =>\n Math.abs(goal - current) < Math.abs(goal - previous) ? current : previous\n );\n }\n\n protected override closestHandle(event: PointerEvent): HTMLElement {\n const fromOffset =\n this.thumbFrom.offsetLeft + this.thumbFrom.offsetWidth / 2;\n const toOffset = this.thumbTo.offsetLeft + this.thumbTo.offsetWidth / 2;\n const xPointer = event.clientX - this.getBoundingClientRect().left;\n const match = this.closestTo(xPointer, [fromOffset, toOffset]);\n\n if (fromOffset === toOffset && toOffset < xPointer) {\n return this.thumbTo;\n } else if (fromOffset === toOffset && toOffset > xPointer) {\n return this.thumbFrom;\n } else if (match === fromOffset) {\n return this.thumbFrom;\n } else {\n return this.thumbTo;\n }\n }\n\n protected override updateValue(increment: number) {\n const oldValue = this.activeValue;\n\n let lower = this.lower;\n let upper = this.upper;\n\n if (this.activeThumb === this.thumbFrom) {\n lower += increment;\n } else {\n upper += increment;\n }\n\n if (lower >= upper) {\n this.swapValues(lower, upper);\n this.toggleActiveThumb();\n } else {\n if (this.activeThumb === this.thumbFrom) {\n this.lower = lower;\n } else {\n this.upper = upper;\n }\n }\n\n if (oldValue === this.activeValue) {\n return false;\n }\n\n this.emitInputEvent();\n return true;\n }\n\n protected override emitInputEvent() {\n this.emitEvent('igcInput', {\n detail: { lower: this.lower, upper: this.upper },\n });\n }\n\n protected override emitChangeEvent() {\n this.emitEvent('igcChange', {\n detail: { lower: this.lower, upper: this.upper },\n });\n }\n\n private swapValues(lower: number, upper: number) {\n this.lower = upper;\n this.upper = lower;\n }\n\n private toggleActiveThumb() {\n const thumb =\n this.activeThumb === this.thumbFrom ? this.thumbTo : this.thumbFrom;\n thumb.focus();\n }\n\n private handleFocus(ev: Event) {\n this.activeThumb = ev.target as HTMLElement;\n const thumbId = this.activeThumb?.id;\n const thumbs = this.shadowRoot?.querySelectorAll('div[part=\"thumb\"]');\n\n thumbs?.forEach((t) => {\n if (t.id !== thumbId) {\n const activeThumbVal = parseFloat(this.activeThumb!.ariaValueNow!);\n const thumbVal = parseFloat(t.ariaValueNow!);\n const rangeFrom = Math.min(activeThumbVal, thumbVal);\n const rangeTo = Math.max(activeThumbVal, thumbVal);\n\n this.activeThumb?.setAttribute(\n 'aria-valuetext',\n `${this.formatValue(rangeFrom)} - ${this.formatValue(rangeTo)}`\n );\n }\n });\n }\n\n protected override renderThumb(\n value: number,\n ariaLabel?: string,\n thumbId?: string\n ) {\n const percent = `${this.valueToFraction(value) * 100}%`;\n const ariaValueText =\n thumbId === 'thumbFrom' ? `min ${this.lower}` : `max ${this.upper}`;\n\n const textValue = this.labels\n ? this.labels[value]\n : this.valueFormat \|\| this.valueFormatOptions\n ? this.formatValue(value)\n : ariaValueText;\n\n return html`\n <div\n part=\"thumb\"\n id=${ifDefined(thumbId)}\n tabindex=${this.disabled ? -1 : 0}\n style=${styleMap({ insetInlineStart: percent })}\n role=\"slider\"\n aria-valuemin=${this.actualMin}\n aria-valuemax=${this.actualMax}\n aria-valuenow=${value}\n aria-valuetext=${ifDefined(textValue)}\n aria-label=${ifDefined(ariaLabel)}\n aria-disabled=${this.disabled ? 'true' : 'false'}\n @pointerenter=${this.handleThumbPointerEnter}\n @pointerleave=${this.handleThumbPointerLeave}\n @focus=${(ev: Event) => this.handleFocus(ev)}\n @blur=${() => (\n this.activeThumb?.part.remove('focused'),\n (this.activeThumb = undefined)\n )}\n ></div>\n ${this.hideTooltip\n ? html``\n : html`\n <div\n part=\"thumb-label\"\n style=${styleMap({\n opacity: this.thumbLabelsVisible ? '1' : '0',\n insetInlineStart: percent,\n })}\n >\n <div part=\"thumb-label-inner\">\n ${this.labels ? this.labels[value] : this.formatValue(value)}\n </div>\n </div>\n `}\n `;\n }\n\n protected override renderThumbs() {\n return html`${this.renderThumb(\n this.lower,\n this.ariaLabelLower,\n 'thumbFrom'\n )}\n ${this.renderThumb(this.upper, this.ariaLabelUpper, 'thumbTo')}`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-range-slider': IgcRangeSliderComponent;\n }\n}\n"]}
1	+ {"version":3,"file":"range-slider.js","sourceRoot":"","sources":["../../../src/components/slider/range-slider.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { styleMap } from 'lit/directives/style-map.js';\n\nimport { IgcSliderBaseComponent } from './slider-base.js';\nimport IgcSliderLabelComponent from './slider-label.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\n\n/* blazorSuppress /\nexport interface IgcRangeSliderValue {\n lower: number;\n upper: number;\n}\n\nexport interface IgcRangeSliderEventMap {\n /\n Emitted when a value is changed via thumb drag or keyboard interaction.\n /\n igcInput: CustomEvent<IgcRangeSliderValue>;\n /\n Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n /\n igcChange: CustomEvent<IgcRangeSliderValue>;\n}\n\n/\n A range slider component used to select two numeric values within a range.\n \n @element igc-range-slider\n \n @fires igcInput - Emitted when a value is changed via thumb drag or keyboard interaction.\n * @fires igcChange - Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n \n @csspart base - The base wrapper of the slider.\n * @csspart ticks - The ticks container.\n * @csspart tick-group - The tick group container.\n * @csspart tick - The tick element.\n * @csspart tick-label - The tick label element.\n * @csspart tick-label-inner - The inner element of the tick label.\n * @csspart thumbs - The thumbs container.\n * @csspart thumb - The thumb element.\n * @csspart thumb-label - The thumb tooltip label container.\n * @csspart thumb-label-inner - The thumb tooltip label inner element.\n * @csspart track - The track container.\n * @csspart steps - The track steps element.\n * @csspart inactive - The inactive element of the track.\n * @csspart fill - The filled part of the track.\n /\nexport default class IgcRangeSliderComponent extends EventEmitterMixin<\n IgcRangeSliderEventMap,\n Constructor<IgcSliderBaseComponent>\n>(IgcSliderBaseComponent) {\n public static readonly tagName = 'igc-range-slider';\n\n public static register() {\n registerComponent(this, IgcSliderLabelComponent);\n }\n\n @query(`#thumbFrom`)\n private thumbFrom!: HTMLElement;\n\n @query(`#thumbTo`)\n private thumbTo!: HTMLElement;\n\n private _lower = 0;\n private _upper = 0;\n\n public set lower(val: number) {\n const oldVal = this._lower;\n this._lower = this.validateValue(val);\n this.requestUpdate('lower', oldVal);\n }\n\n /\n The current value of the lower thumb.\n * @attr\n /\n @property({ type: Number })\n public get lower(): number {\n return this._lower;\n }\n\n public set upper(val: number) {\n const oldVal = this._upper;\n this._upper = this.validateValue(val);\n this.requestUpdate('upper', oldVal);\n }\n\n /\n The current value of the upper thumb.\n * @attr\n /\n @property({ type: Number })\n public get upper(): number {\n return this._upper;\n }\n\n /\n The aria label of the lower thumb.\n * @attr aria-label-lower\n /\n @property({ attribute: 'aria-label-lower' })\n public ariaLabelLower!: string;\n\n /\n The aria label of the upper thumb.\n * @attr aria-label-upper\n /\n @property({ attribute: 'aria-label-upper' })\n public ariaLabelUpper!: string;\n\n protected override get activeValue(): number {\n return this.activeThumb === this.thumbFrom ? this.lower : this.upper;\n }\n\n protected override normalizeValue(): void {\n this._lower = this.validateValue(this._lower);\n this._upper = this.validateValue(this._upper);\n }\n\n protected override getTrackStyle() {\n const toPosition = this.valueToFraction(this.upper);\n const fromPosition = this.valueToFraction(this.lower);\n const positionGap = toPosition - fromPosition;\n\n const filledTrackStyle = {\n width: `${positionGap 100}%`,\n insetInlineStart: `${fromPosition * 100}%`,\n };\n\n return filledTrackStyle;\n }\n\n private closestTo(goal: number, positions: number[]): number {\n return positions.reduce((previous, current) =>\n Math.abs(goal - current) < Math.abs(goal - previous) ? current : previous\n );\n }\n\n protected override closestHandle(event: PointerEvent): HTMLElement {\n const fromOffset =\n this.thumbFrom.offsetLeft + this.thumbFrom.offsetWidth / 2;\n const toOffset = this.thumbTo.offsetLeft + this.thumbTo.offsetWidth / 2;\n const xPointer = event.clientX - this.getBoundingClientRect().left;\n const match = this.closestTo(xPointer, [fromOffset, toOffset]);\n\n if (fromOffset === toOffset && toOffset < xPointer) {\n return this.thumbTo;\n } else if (fromOffset === toOffset && toOffset > xPointer) {\n return this.thumbFrom;\n } else if (match === fromOffset) {\n return this.thumbFrom;\n } else {\n return this.thumbTo;\n }\n }\n\n protected override updateValue(increment: number) {\n const oldValue = this.activeValue;\n\n let lower = this.lower;\n let upper = this.upper;\n\n if (this.activeThumb === this.thumbFrom) {\n lower += increment;\n } else {\n upper += increment;\n }\n\n if (lower >= upper) {\n this.swapValues(lower, upper);\n this.toggleActiveThumb();\n } else {\n if (this.activeThumb === this.thumbFrom) {\n this.lower = lower;\n } else {\n this.upper = upper;\n }\n }\n\n if (oldValue === this.activeValue) {\n return false;\n }\n\n this.emitInputEvent();\n return true;\n }\n\n protected override emitInputEvent() {\n this.emitEvent('igcInput', {\n detail: { lower: this.lower, upper: this.upper },\n });\n }\n\n protected override emitChangeEvent() {\n this.emitEvent('igcChange', {\n detail: { lower: this.lower, upper: this.upper },\n });\n }\n\n private swapValues(lower: number, upper: number) {\n this.lower = upper;\n this.upper = lower;\n }\n\n private toggleActiveThumb() {\n const thumb =\n this.activeThumb === this.thumbFrom ? this.thumbTo : this.thumbFrom;\n thumb.focus();\n }\n\n private handleFocus(ev: Event) {\n this.activeThumb = ev.target as HTMLElement;\n const thumbId = this.activeThumb?.id;\n const thumbs = this.shadowRoot?.querySelectorAll('div[part=\"thumb\"]');\n\n thumbs?.forEach((t) => {\n if (t.id !== thumbId) {\n const activeThumbVal = parseFloat(this.activeThumb!.ariaValueNow!);\n const thumbVal = parseFloat(t.ariaValueNow!);\n const rangeFrom = Math.min(activeThumbVal, thumbVal);\n const rangeTo = Math.max(activeThumbVal, thumbVal);\n\n this.activeThumb?.setAttribute(\n 'aria-valuetext',\n `${this.formatValue(rangeFrom)} - ${this.formatValue(rangeTo)}`\n );\n }\n });\n }\n\n protected override renderThumb(\n value: number,\n ariaLabel?: string,\n thumbId?: string\n ) {\n const percent = `${this.valueToFraction(value) * 100}%`;\n const ariaValueText =\n thumbId === 'thumbFrom' ? `min ${this.lower}` : `max ${this.upper}`;\n\n const textValue = this.labels\n ? this.labels[value]\n : this.valueFormat \|\| this.valueFormatOptions\n ? this.formatValue(value)\n : ariaValueText;\n\n return html`\n <div\n part=\"thumb\"\n id=${ifDefined(thumbId)}\n tabindex=${this.disabled ? -1 : 0}\n style=${styleMap({ insetInlineStart: percent })}\n role=\"slider\"\n aria-valuemin=${this.actualMin}\n aria-valuemax=${this.actualMax}\n aria-valuenow=${value}\n aria-valuetext=${ifDefined(textValue)}\n aria-label=${ifDefined(ariaLabel)}\n aria-disabled=${this.disabled ? 'true' : 'false'}\n @pointerenter=${this.handleThumbPointerEnter}\n @pointerleave=${this.handleThumbPointerLeave}\n @focus=${(ev: Event) => this.handleFocus(ev)}\n @blur=${() => (\n this.activeThumb?.part.remove('focused'),\n (this.activeThumb = undefined)\n )}\n ></div>\n ${this.hideTooltip\n ? html``\n : html`\n <div\n part=\"thumb-label\"\n style=${styleMap({\n opacity: this.thumbLabelsVisible ? '1' : '0',\n insetInlineStart: percent,\n })}\n >\n <div part=\"thumb-label-inner\">\n ${this.labels ? this.labels[value] : this.formatValue(value)}\n </div>\n </div>\n `}\n `;\n }\n\n protected override renderThumbs() {\n return html`${this.renderThumb(\n this.lower,\n this.ariaLabelLower,\n 'thumbFrom'\n )}\n ${this.renderThumb(this.upper, this.ariaLabelUpper, 'thumbTo')}`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-range-slider': IgcRangeSliderComponent;\n }\n}\n"]}

package/components/slider/slider-base.d.ts CHANGED Viewed

@@ -109,8 +109,10 @@ export declare class IgcSliderBaseComponent extends LitElement {
     protected constraintsChange(): void;
     protected labelsChange(): void;
     constructor();
+    private handleArrowKeys;
+    private handlePageKeys;
+    private handleKeyboardIncrement;
     connectedCallback(): void;
-    disconnectedCallback(): void;
     protected handleKeyUp(): void;
     protected handleSlotChange(): void;
     protected get activeValue(): number;
@@ -138,7 +140,6 @@ export declare class IgcSliderBaseComponent extends LitElement {
     private pointerDown;
     private pointerMove;
     private lostPointerCapture;
-    private handleKeydown;
     protected handleThumbPointerEnter: () => void;
     protected handleThumbPointerLeave: () => void;
     protected renderTicks(): TemplateResult<1>[];

package/components/slider/slider-base.js CHANGED Viewed

@@ -4,20 +4,18 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { html, LitElement } from 'lit';
+import { LitElement, html } from 'lit';
 import { property, query, queryAssignedElements, state, } from 'lit/decorators.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { styleMap } from 'lit/directives/style-map.js';
+import { styles } from './themes/slider.base.css.js';
+import { all } from './themes/themes.js';
 import { themes } from '../../theming/theming-decorator.js';
+import { addKeybindings, arrowDown, arrowLeft, arrowRight, arrowUp, endKey, homeKey, pageDownKey, pageUpKey, } from '../common/controllers/key-bindings.js';
 import { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';
 import { blazorTypeOverride } from '../common/decorators/blazorTypeOverride.js';
 import { watch } from '../common/decorators/watch.js';
 import { isLTR } from '../common/util.js';
-import { styles } from './themes/light/slider.base.css.js';
-import { styles as bootstrap } from './themes/light/slider.bootstrap.css.js';
-import { styles as fluent } from './themes/light/slider.fluent.css.js';
-import { styles as indigo } from './themes/light/slider.indigo.css.js';
-import { styles as material } from './themes/light/slider.material.css.js';
 let IgcSliderBaseComponent = class IgcSliderBaseComponent extends LitElement {
     set min(value) {
         if (value < this.max) {
@@ -107,7 +105,6 @@ let IgcSliderBaseComponent = class IgcSliderBaseComponent extends LitElement {
         this.locale = 'en';
         this.tickLabelRotation = 0;
         this.pointerDown = (event) => {
-            var _a;
             const thumb = this.closestHandle(event);
             thumb.focus();
             this.startValue = this.activeValue;
@@ -116,7 +113,7 @@ let IgcSliderBaseComponent = class IgcSliderBaseComponent extends LitElement {
             this.pointerCaptured = true;
             this.showThumbLabels();
             event.preventDefault();
-            (_a = this.activeThumb) === null || _a === void 0 ? void 0 : _a.part.remove('focused');
+            this.activeThumb?.part.remove('focused');
         };
         this.pointerMove = (event) => {
             if (this.pointerCaptured) {
@@ -131,52 +128,6 @@ let IgcSliderBaseComponent = class IgcSliderBaseComponent extends LitElement {
             }
             this.startValue = undefined;
         };
-        this.handleKeydown = (event) => {
-            if (this.disabled) {
-                return;
-            }
-            const { key } = event;
-            let increment = 0;
-            const value = this.activeValue;
-            const step = this.step ? this.step : 1;
-            const ltr = isLTR(this);
-            switch (key) {
-                case 'ArrowLeft':
-                    increment += ltr ? -step : step;
-                    break;
-                case 'ArrowRight':
-                    increment += ltr ? step : -step;
-                    break;
-                case 'ArrowUp':
-                    increment = step;
-                    break;
-                case 'ArrowDown':
-                    increment = -step;
-                    break;
-                case 'Home':
-                    increment = this.actualMin - value;
-                    break;
-                case 'End':
-                    increment = this.actualMax - value;
-                    break;
-                case 'PageUp':
-                    increment = Math.max((this.actualMax - this.actualMin) / 10, step);
-                    break;
-                case 'PageDown':
-                    increment = -Math.max((this.actualMax - this.actualMin) / 10, step);
-                    break;
-                default:
-                    return;
-            }
-            if (increment) {
-                const updated = this.updateValue(increment);
-                this.showThumbLabels();
-                this.hideThumbLabels();
-                if (updated) {
-                    this.emitChangeEvent();
-                }
-            }
-        };
         this.handleThumbPointerEnter = () => {
             this.showThumbLabels();
         };
@@ -186,20 +137,44 @@ let IgcSliderBaseComponent = class IgcSliderBaseComponent extends LitElement {
         this.addEventListener('pointerdown', this.pointerDown);
         this.addEventListener('pointermove', this.pointerMove);
         this.addEventListener('lostpointercapture', this.lostPointerCapture);
-        this.addEventListener('keydown', this.handleKeydown);
+        this.addEventListener('keyup', this.handleKeyUp);
+        addKeybindings(this, {
+            skip: () => this.disabled,
+            bindingDefaults: { preventDefault: true },
+        })
+            .set(arrowLeft, () => this.handleArrowKeys(isLTR(this) ? -1 : 1))
+            .set(arrowRight, () => this.handleArrowKeys(isLTR(this) ? 1 : -1))
+            .set(arrowUp, () => this.handleArrowKeys(1))
+            .set(arrowDown, () => this.handleArrowKeys(-1))
+            .set(homeKey, () => this.handleKeyboardIncrement(this.actualMin - this.activeValue))
+            .set(endKey, () => this.handleKeyboardIncrement(this.actualMax - this.activeValue))
+            .set(pageUpKey, () => this.handlePageKeys(1))
+            .set(pageDownKey, () => this.handlePageKeys(-1));
+    }
+    handleArrowKeys(delta) {
+        const step = this.step ? this.step : 1;
+        this.handleKeyboardIncrement(step * delta);
+    }
+    handlePageKeys(delta) {
+        const step = this.step ? this.step : 1;
+        this.handleKeyboardIncrement(delta * Math.max((this.actualMax - this.actualMin) / 10, step));
+    }
+    handleKeyboardIncrement(increment) {
+        if (increment) {
+            const updated = this.updateValue(increment);
+            this.showThumbLabels();
+            this.hideThumbLabels();
+            if (updated) {
+                this.emitChangeEvent();
+            }
+        }
     }
     connectedCallback() {
         super.connectedCallback();
         this.normalizeValue();
-        this.addEventListener('keyup', this.handleKeyUp);
-    }
-    disconnectedCallback() {
-        this.removeEventListener('keyup', this.handleKeyUp);
-        super.disconnectedCallback();
     }
     handleKeyUp() {
-        var _a;
-        (_a = this.activeThumb) === null || _a === void 0 ? void 0 : _a.part.add('focused');
+        this.activeThumb?.part.add('focused');
     }
     handleSlotChange() {
         this.labels =
@@ -380,11 +355,8 @@ let IgcSliderBaseComponent = class IgcSliderBaseComponent extends LitElement {
         @pointerenter=${this.handleThumbPointerEnter}
         @pointerleave=${this.handleThumbPointerLeave}
         @focus=${(ev) => (this.activeThumb = ev.target)}
-        @blur=${() => {
-            var _a;
-            return ((_a = this.activeThumb) === null || _a === void 0 ? void 0 : _a.part.remove('focused'),
-                (this.activeThumb = undefined));
-        }}
+        @blur=${() => (this.activeThumb?.part.remove('focused'),
+            (this.activeThumb = undefined))}
       ></div>
       ${this.hideTooltip
             ? html ``
@@ -522,10 +494,7 @@ __decorate([
     watch('labels')
 ], IgcSliderBaseComponent.prototype, "labelsChange", null);
 IgcSliderBaseComponent = __decorate([
-    themes({
-        light: { material, bootstrap, fluent, indigo },
-        dark: { material, bootstrap, fluent, indigo },
-    }),
+    themes(all, true),
     blazorDeepImport
 ], IgcSliderBaseComponent);
 export { IgcSliderBaseComponent };