igniteui-webcomponents 5.1.1 → 5.2.0

package/components/checkbox/themes/switch.base.css.js

@@ -1,3 +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;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}: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 *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;flex-direction:column;font-family:var(--ig-font-family)}input[type=checkbox]{position:absolute;width:1px;height:1px;margin:-1px;border:none;clip:rect(0, 0, 0, 0);outline:0;pointer-events:none;overflow:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}[part~=base]{display:flex;flex-flow:row nowrap;align-items:center;cursor:pointer;gap:var(--label-gap)}[part~=control]{display:flex;flex-shrink:0;align-items:center;-webkit-user-select:none;-moz-user-select:none;user-select:none}[part~=thumb]{position:relative;animation-duration:.2s;animation-fill-mode:none}[part~=control],[part~=thumb]{transition:all .2s ease-in-out}[part~=thumb][part~=checked]{animation-duration:.2s;animation-fill-mode:forwards}[part~=label]{display:inline-block;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;word-wrap:break-word}:host([disabled]),:host(:disabled){-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none;cursor:initial}:host([label-position=before]) [part~=label]{order:-1}@keyframes thumb-on{from{margin-inline-start:var(--thumb-offset)}to{margin-inline-start:calc(var(--size) - var(--thumb-size))}}@keyframes thumb-off{from{margin-inline-start:calc(var(--size) - var(--thumb-size))}to{margin-inline-start:var(--thumb-offset)}}`;
+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;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;flex-direction:column;font-family:var(--ig-font-family)}input[type=checkbox]{position:absolute;width:1px;height:1px;margin:-1px;border:none;clip:rect(0, 0, 0, 0);outline:0;pointer-events:none;overflow:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}[part~=base]{display:flex;flex-flow:row nowrap;align-items:center;cursor:pointer;gap:var(--label-gap)}[part~=control]{display:flex;flex-shrink:0;align-items:center;-webkit-user-select:none;-moz-user-select:none;user-select:none}[part~=thumb]{position:relative;animation-duration:.2s;animation-fill-mode:none}[part~=control],[part~=thumb]{transition:all .2s ease-in-out}[part~=thumb][part~=checked]{animation-duration:.2s;animation-fill-mode:forwards}[part~=label]{display:inline-block;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;word-wrap:break-word}:host([disabled]),:host(:disabled){-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none;cursor:initial}:host([label-position=before]) [part~=label]{order:-1}@keyframes thumb-on{from{margin-inline-start:var(--thumb-offset)}to{margin-inline-start:calc(var(--size) - var(--thumb-size))}}@keyframes thumb-off{from{margin-inline-start:calc(var(--size) - var(--thumb-size))}to{margin-inline-start:var(--thumb-offset)}}`;
 //# sourceMappingURL=switch.base.css.js.map

package/components/checkbox/themes/switch.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"switch.base.css.js","sourceRoot":"","sources":["../../../../src/components/checkbox/themes/switch.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,6lEAA6lE,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;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}: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 *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;flex-direction:column;font-family:var(--ig-font-family)}input[type=checkbox]{position:absolute;width:1px;height:1px;margin:-1px;border:none;clip:rect(0, 0, 0, 0);outline:0;pointer-events:none;overflow:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}[part~=base]{display:flex;flex-flow:row nowrap;align-items:center;cursor:pointer;gap:var(--label-gap)}[part~=control]{display:flex;flex-shrink:0;align-items:center;-webkit-user-select:none;-moz-user-select:none;user-select:none}[part~=thumb]{position:relative;animation-duration:.2s;animation-fill-mode:none}[part~=control],[part~=thumb]{transition:all .2s ease-in-out}[part~=thumb][part~=checked]{animation-duration:.2s;animation-fill-mode:forwards}[part~=label]{display:inline-block;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;word-wrap:break-word}:host([disabled]),:host(:disabled){-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none;cursor:initial}:host([label-position=before]) [part~=label]{order:-1}@keyframes thumb-on{from{margin-inline-start:var(--thumb-offset)}to{margin-inline-start:calc(var(--size) - var(--thumb-size))}}@keyframes thumb-off{from{margin-inline-start:calc(var(--size) - var(--thumb-size))}to{margin-inline-start:var(--thumb-offset)}}`;\n"]}
+{"version":3,"file":"switch.base.css.js","sourceRoot":"","sources":["../../../../src/components/checkbox/themes/switch.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,qvEAAqvE,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;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;flex-direction:column;font-family:var(--ig-font-family)}input[type=checkbox]{position:absolute;width:1px;height:1px;margin:-1px;border:none;clip:rect(0, 0, 0, 0);outline:0;pointer-events:none;overflow:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}[part~=base]{display:flex;flex-flow:row nowrap;align-items:center;cursor:pointer;gap:var(--label-gap)}[part~=control]{display:flex;flex-shrink:0;align-items:center;-webkit-user-select:none;-moz-user-select:none;user-select:none}[part~=thumb]{position:relative;animation-duration:.2s;animation-fill-mode:none}[part~=control],[part~=thumb]{transition:all .2s ease-in-out}[part~=thumb][part~=checked]{animation-duration:.2s;animation-fill-mode:forwards}[part~=label]{display:inline-block;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;word-wrap:break-word}:host([disabled]),:host(:disabled){-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none;cursor:initial}:host([label-position=before]) [part~=label]{order:-1}@keyframes thumb-on{from{margin-inline-start:var(--thumb-offset)}to{margin-inline-start:calc(var(--size) - var(--thumb-size))}}@keyframes thumb-off{from{margin-inline-start:calc(var(--size) - var(--thumb-size))}to{margin-inline-start:var(--thumb-offset)}}`;\n"]}

package/components/chip/themes/chip.base.css.js

@@ -1,3 +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;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}: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 *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;vertical-align:top}:host button{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);display:flex;justify-content:center;align-items:center;font-family:var(--ig-font-family);border-style:none;box-shadow:none;cursor:pointer;padding:max(var(--is-large, 1)*max(12px, -1 * 12px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(6px, -1 * 6px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(2px, -1 * 2px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host button[disabled]{pointer-events:none}:host([variant=primary]) button,:host([selected][variant=primary]) button:not([disabled]){background:hsl(from var(--ig-primary-500) h s l/1);color:color-mix(in oklch, var(--ig-primary-500-contrast) 100%, transparent)}:host([variant=primary]) button:focus,:host([selected][variant=primary]) button:not([disabled]):focus{background:hsl(from var(--ig-primary-800) h s l/1);color:color-mix(in oklch, var(--ig-primary-800-contrast) 100%, transparent)}:host([variant=primary]) button:hover,:host([selected][variant=primary]) button:not([disabled]):hover{background:hsl(from var(--ig-primary-600) h s l/1);color:color-mix(in oklch, var(--ig-primary-600-contrast) 100%, transparent)}:host([variant=info]) button,:host([selected][variant=info]) button:not([disabled]){background:hsl(from var(--ig-info-500) h s l/1);color:color-mix(in oklch, var(--ig-info-500-contrast) 100%, transparent)}:host([variant=info]) button:focus,:host([selected][variant=info]) button:not([disabled]):focus{background:hsl(from var(--ig-info-800) h s l/1);color:color-mix(in oklch, var(--ig-info-800-contrast) 100%, transparent)}:host([variant=info]) button:hover,:host([selected][variant=info]) button:not([disabled]):hover{background:hsl(from var(--ig-info-600) h s l/1);color:color-mix(in oklch, var(--ig-info-600-contrast) 100%, transparent)}:host([variant=success]) button,:host([selected][variant=success]) button:not([disabled]){background:hsl(from var(--ig-success-500) h s l/1);color:color-mix(in oklch, var(--ig-success-500-contrast) 100%, transparent)}:host([variant=success]) button:focus,:host([selected][variant=success]) button:not([disabled]):focus{background:hsl(from var(--ig-success-800) h s l/1);color:color-mix(in oklch, var(--ig-success-800-contrast) 100%, transparent)}:host([variant=success]) button:hover,:host([selected][variant=success]) button:not([disabled]):hover{background:hsl(from var(--ig-success-600) h s l/1);color:color-mix(in oklch, var(--ig-success-600-contrast) 100%, transparent)}:host([variant=warning]) button,:host([selected][variant=warning]) button:not([disabled]){background:hsl(from var(--ig-warn-500) h s l/1);color:color-mix(in oklch, var(--ig-warn-500-contrast) 100%, transparent)}:host([variant=warning]) button:focus,:host([selected][variant=warning]) button:not([disabled]):focus{background:hsl(from var(--ig-warn-800) h s l/1);color:color-mix(in oklch, var(--ig-warn-800-contrast) 100%, transparent)}:host([variant=warning]) button:hover,:host([selected][variant=warning]) button:not([disabled]):hover{background:hsl(from var(--ig-warn-600) h s l/1);color:color-mix(in oklch, var(--ig-warn-600-contrast) 100%, transparent)}:host([variant=danger]) button,:host([selected][variant=danger]) button:not([disabled]){background:hsl(from var(--ig-error-500) h s l/1);color:color-mix(in oklch, var(--ig-error-500-contrast) 100%, transparent)}:host([variant=danger]) button:focus,:host([selected][variant=danger]) button:not([disabled]):focus{background:hsl(from var(--ig-error-800) h s l/1);color:color-mix(in oklch, var(--ig-error-800-contrast) 100%, transparent)}:host([variant=danger]) button:hover,:host([selected][variant=danger]) button:not([disabled]):hover{background:hsl(from var(--ig-error-600) h s l/1);color:color-mix(in oklch, var(--ig-error-600-contrast) 100%, transparent)}[part=prefix],[part=suffix]{display:flex;align-items:center;justify-content:center}[part=prefix]{margin-inline-end:max(var(--is-large, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)),var(--is-medium, 1)*max(0.375rem, -1 * 0.375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)),var(--is-small, 1)*max(0.1875rem, -1 * 0.1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)))}[part=suffix]{margin-inline-start:max(var(--is-large, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)),var(--is-medium, 1)*max(0.375rem, -1 * 0.375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)),var(--is-small, 1)*max(0.1875rem, -1 * 0.1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)))}::slotted(*){display:flex}`;
+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;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;vertical-align:top}:host button{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);display:flex;justify-content:center;align-items:center;font-family:var(--ig-font-family);border-style:none;box-shadow:none;cursor:pointer;padding:max(var(--is-large, 1)*max(12px, -1 * 12px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(6px, -1 * 6px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(2px, -1 * 2px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host button[disabled]{pointer-events:none}:host([variant=primary]) button,:host([selected][variant=primary]) button:not([disabled]){background:hsl(from var(--ig-primary-500) h s l/1);color:color-mix(in oklch, var(--ig-primary-500-contrast) 100%, transparent)}:host([variant=primary]) button:focus,:host([selected][variant=primary]) button:not([disabled]):focus{background:hsl(from var(--ig-primary-800) h s l/1);color:color-mix(in oklch, var(--ig-primary-800-contrast) 100%, transparent)}:host([variant=primary]) button:hover,:host([selected][variant=primary]) button:not([disabled]):hover{background:hsl(from var(--ig-primary-600) h s l/1);color:color-mix(in oklch, var(--ig-primary-600-contrast) 100%, transparent)}:host([variant=info]) button,:host([selected][variant=info]) button:not([disabled]){background:hsl(from var(--ig-info-500) h s l/1);color:color-mix(in oklch, var(--ig-info-500-contrast) 100%, transparent)}:host([variant=info]) button:focus,:host([selected][variant=info]) button:not([disabled]):focus{background:hsl(from var(--ig-info-800) h s l/1);color:color-mix(in oklch, var(--ig-info-800-contrast) 100%, transparent)}:host([variant=info]) button:hover,:host([selected][variant=info]) button:not([disabled]):hover{background:hsl(from var(--ig-info-600) h s l/1);color:color-mix(in oklch, var(--ig-info-600-contrast) 100%, transparent)}:host([variant=success]) button,:host([selected][variant=success]) button:not([disabled]){background:hsl(from var(--ig-success-500) h s l/1);color:color-mix(in oklch, var(--ig-success-500-contrast) 100%, transparent)}:host([variant=success]) button:focus,:host([selected][variant=success]) button:not([disabled]):focus{background:hsl(from var(--ig-success-800) h s l/1);color:color-mix(in oklch, var(--ig-success-800-contrast) 100%, transparent)}:host([variant=success]) button:hover,:host([selected][variant=success]) button:not([disabled]):hover{background:hsl(from var(--ig-success-600) h s l/1);color:color-mix(in oklch, var(--ig-success-600-contrast) 100%, transparent)}:host([variant=warning]) button,:host([selected][variant=warning]) button:not([disabled]){background:hsl(from var(--ig-warn-500) h s l/1);color:color-mix(in oklch, var(--ig-warn-500-contrast) 100%, transparent)}:host([variant=warning]) button:focus,:host([selected][variant=warning]) button:not([disabled]):focus{background:hsl(from var(--ig-warn-800) h s l/1);color:color-mix(in oklch, var(--ig-warn-800-contrast) 100%, transparent)}:host([variant=warning]) button:hover,:host([selected][variant=warning]) button:not([disabled]):hover{background:hsl(from var(--ig-warn-600) h s l/1);color:color-mix(in oklch, var(--ig-warn-600-contrast) 100%, transparent)}:host([variant=danger]) button,:host([selected][variant=danger]) button:not([disabled]){background:hsl(from var(--ig-error-500) h s l/1);color:color-mix(in oklch, var(--ig-error-500-contrast) 100%, transparent)}:host([variant=danger]) button:focus,:host([selected][variant=danger]) button:not([disabled]):focus{background:hsl(from var(--ig-error-800) h s l/1);color:color-mix(in oklch, var(--ig-error-800-contrast) 100%, transparent)}:host([variant=danger]) button:hover,:host([selected][variant=danger]) button:not([disabled]):hover{background:hsl(from var(--ig-error-600) h s l/1);color:color-mix(in oklch, var(--ig-error-600-contrast) 100%, transparent)}[part=prefix],[part=suffix]{display:flex;align-items:center;justify-content:center}[part=prefix]{margin-inline-end:max(var(--is-large, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)),var(--is-medium, 1)*max(0.375rem, -1 * 0.375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)),var(--is-small, 1)*max(0.1875rem, -1 * 0.1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)))}[part=suffix]{margin-inline-start:max(var(--is-large, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)),var(--is-medium, 1)*max(0.375rem, -1 * 0.375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)),var(--is-small, 1)*max(0.1875rem, -1 * 0.1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)))}::slotted(*){display:flex}`;
 //# sourceMappingURL=chip.base.css.js.map

package/components/chip/themes/chip.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.base.css.js","sourceRoot":"","sources":["../../../../src/components/chip/themes/chip.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,y0LAAy0L,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;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}: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 *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;vertical-align:top}:host button{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);display:flex;justify-content:center;align-items:center;font-family:var(--ig-font-family);border-style:none;box-shadow:none;cursor:pointer;padding:max(var(--is-large, 1)*max(12px, -1 * 12px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(6px, -1 * 6px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(2px, -1 * 2px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host button[disabled]{pointer-events:none}:host([variant=primary]) button,:host([selected][variant=primary]) button:not([disabled]){background:hsl(from var(--ig-primary-500) h s l/1);color:color-mix(in oklch, var(--ig-primary-500-contrast) 100%, transparent)}:host([variant=primary]) button:focus,:host([selected][variant=primary]) button:not([disabled]):focus{background:hsl(from var(--ig-primary-800) h s l/1);color:color-mix(in oklch, var(--ig-primary-800-contrast) 100%, transparent)}:host([variant=primary]) button:hover,:host([selected][variant=primary]) button:not([disabled]):hover{background:hsl(from var(--ig-primary-600) h s l/1);color:color-mix(in oklch, var(--ig-primary-600-contrast) 100%, transparent)}:host([variant=info]) button,:host([selected][variant=info]) button:not([disabled]){background:hsl(from var(--ig-info-500) h s l/1);color:color-mix(in oklch, var(--ig-info-500-contrast) 100%, transparent)}:host([variant=info]) button:focus,:host([selected][variant=info]) button:not([disabled]):focus{background:hsl(from var(--ig-info-800) h s l/1);color:color-mix(in oklch, var(--ig-info-800-contrast) 100%, transparent)}:host([variant=info]) button:hover,:host([selected][variant=info]) button:not([disabled]):hover{background:hsl(from var(--ig-info-600) h s l/1);color:color-mix(in oklch, var(--ig-info-600-contrast) 100%, transparent)}:host([variant=success]) button,:host([selected][variant=success]) button:not([disabled]){background:hsl(from var(--ig-success-500) h s l/1);color:color-mix(in oklch, var(--ig-success-500-contrast) 100%, transparent)}:host([variant=success]) button:focus,:host([selected][variant=success]) button:not([disabled]):focus{background:hsl(from var(--ig-success-800) h s l/1);color:color-mix(in oklch, var(--ig-success-800-contrast) 100%, transparent)}:host([variant=success]) button:hover,:host([selected][variant=success]) button:not([disabled]):hover{background:hsl(from var(--ig-success-600) h s l/1);color:color-mix(in oklch, var(--ig-success-600-contrast) 100%, transparent)}:host([variant=warning]) button,:host([selected][variant=warning]) button:not([disabled]){background:hsl(from var(--ig-warn-500) h s l/1);color:color-mix(in oklch, var(--ig-warn-500-contrast) 100%, transparent)}:host([variant=warning]) button:focus,:host([selected][variant=warning]) button:not([disabled]):focus{background:hsl(from var(--ig-warn-800) h s l/1);color:color-mix(in oklch, var(--ig-warn-800-contrast) 100%, transparent)}:host([variant=warning]) button:hover,:host([selected][variant=warning]) button:not([disabled]):hover{background:hsl(from var(--ig-warn-600) h s l/1);color:color-mix(in oklch, var(--ig-warn-600-contrast) 100%, transparent)}:host([variant=danger]) button,:host([selected][variant=danger]) button:not([disabled]){background:hsl(from var(--ig-error-500) h s l/1);color:color-mix(in oklch, var(--ig-error-500-contrast) 100%, transparent)}:host([variant=danger]) button:focus,:host([selected][variant=danger]) button:not([disabled]):focus{background:hsl(from var(--ig-error-800) h s l/1);color:color-mix(in oklch, var(--ig-error-800-contrast) 100%, transparent)}:host([variant=danger]) button:hover,:host([selected][variant=danger]) button:not([disabled]):hover{background:hsl(from var(--ig-error-600) h s l/1);color:color-mix(in oklch, var(--ig-error-600-contrast) 100%, transparent)}[part=prefix],[part=suffix]{display:flex;align-items:center;justify-content:center}[part=prefix]{margin-inline-end:max(var(--is-large, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)),var(--is-medium, 1)*max(0.375rem, -1 * 0.375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)),var(--is-small, 1)*max(0.1875rem, -1 * 0.1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)))}[part=suffix]{margin-inline-start:max(var(--is-large, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)),var(--is-medium, 1)*max(0.375rem, -1 * 0.375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)),var(--is-small, 1)*max(0.1875rem, -1 * 0.1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)))}::slotted(*){display:flex}`;\n"]}
+{"version":3,"file":"chip.base.css.js","sourceRoot":"","sources":["../../../../src/components/chip/themes/chip.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,i+LAAi+L,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;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;vertical-align:top}:host button{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);display:flex;justify-content:center;align-items:center;font-family:var(--ig-font-family);border-style:none;box-shadow:none;cursor:pointer;padding:max(var(--is-large, 1)*max(12px, -1 * 12px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(6px, -1 * 6px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(2px, -1 * 2px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host button[disabled]{pointer-events:none}:host([variant=primary]) button,:host([selected][variant=primary]) button:not([disabled]){background:hsl(from var(--ig-primary-500) h s l/1);color:color-mix(in oklch, var(--ig-primary-500-contrast) 100%, transparent)}:host([variant=primary]) button:focus,:host([selected][variant=primary]) button:not([disabled]):focus{background:hsl(from var(--ig-primary-800) h s l/1);color:color-mix(in oklch, var(--ig-primary-800-contrast) 100%, transparent)}:host([variant=primary]) button:hover,:host([selected][variant=primary]) button:not([disabled]):hover{background:hsl(from var(--ig-primary-600) h s l/1);color:color-mix(in oklch, var(--ig-primary-600-contrast) 100%, transparent)}:host([variant=info]) button,:host([selected][variant=info]) button:not([disabled]){background:hsl(from var(--ig-info-500) h s l/1);color:color-mix(in oklch, var(--ig-info-500-contrast) 100%, transparent)}:host([variant=info]) button:focus,:host([selected][variant=info]) button:not([disabled]):focus{background:hsl(from var(--ig-info-800) h s l/1);color:color-mix(in oklch, var(--ig-info-800-contrast) 100%, transparent)}:host([variant=info]) button:hover,:host([selected][variant=info]) button:not([disabled]):hover{background:hsl(from var(--ig-info-600) h s l/1);color:color-mix(in oklch, var(--ig-info-600-contrast) 100%, transparent)}:host([variant=success]) button,:host([selected][variant=success]) button:not([disabled]){background:hsl(from var(--ig-success-500) h s l/1);color:color-mix(in oklch, var(--ig-success-500-contrast) 100%, transparent)}:host([variant=success]) button:focus,:host([selected][variant=success]) button:not([disabled]):focus{background:hsl(from var(--ig-success-800) h s l/1);color:color-mix(in oklch, var(--ig-success-800-contrast) 100%, transparent)}:host([variant=success]) button:hover,:host([selected][variant=success]) button:not([disabled]):hover{background:hsl(from var(--ig-success-600) h s l/1);color:color-mix(in oklch, var(--ig-success-600-contrast) 100%, transparent)}:host([variant=warning]) button,:host([selected][variant=warning]) button:not([disabled]){background:hsl(from var(--ig-warn-500) h s l/1);color:color-mix(in oklch, var(--ig-warn-500-contrast) 100%, transparent)}:host([variant=warning]) button:focus,:host([selected][variant=warning]) button:not([disabled]):focus{background:hsl(from var(--ig-warn-800) h s l/1);color:color-mix(in oklch, var(--ig-warn-800-contrast) 100%, transparent)}:host([variant=warning]) button:hover,:host([selected][variant=warning]) button:not([disabled]):hover{background:hsl(from var(--ig-warn-600) h s l/1);color:color-mix(in oklch, var(--ig-warn-600-contrast) 100%, transparent)}:host([variant=danger]) button,:host([selected][variant=danger]) button:not([disabled]){background:hsl(from var(--ig-error-500) h s l/1);color:color-mix(in oklch, var(--ig-error-500-contrast) 100%, transparent)}:host([variant=danger]) button:focus,:host([selected][variant=danger]) button:not([disabled]):focus{background:hsl(from var(--ig-error-800) h s l/1);color:color-mix(in oklch, var(--ig-error-800-contrast) 100%, transparent)}:host([variant=danger]) button:hover,:host([selected][variant=danger]) button:not([disabled]):hover{background:hsl(from var(--ig-error-600) h s l/1);color:color-mix(in oklch, var(--ig-error-600-contrast) 100%, transparent)}[part=prefix],[part=suffix]{display:flex;align-items:center;justify-content:center}[part=prefix]{margin-inline-end:max(var(--is-large, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)),var(--is-medium, 1)*max(0.375rem, -1 * 0.375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)),var(--is-small, 1)*max(0.1875rem, -1 * 0.1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)))}[part=suffix]{margin-inline-start:max(var(--is-large, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, --ig-spacing)),var(--is-medium, 1)*max(0.375rem, -1 * 0.375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, --ig-spacing)),var(--is-small, 1)*max(0.1875rem, -1 * 0.1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, --ig-spacing)))}::slotted(*){display:flex}`;\n"]}

package/components/combo/combo-item.d.ts

@@ -4,12 +4,15 @@ export default class IgcComboItemComponent extends LitElement {
     static styles: import("lit").CSSResult[];
     static register(): void;
     private _internals;
+    private _selected;
     index: number;
     /**
      * Determines whether the item is selected.
      * @attr selected
+     * @default false
      */
-    selected: boolean;
+    set selected(value: boolean);
+    get selected(): boolean;
     /**
      * Determines whether the item is active.
      */
@@ -19,7 +22,6 @@ export default class IgcComboItemComponent extends LitElement {
      * @attr hide-checkbox
      */
     hideCheckbox: boolean;
-    protected selectedChange(): void;
     constructor();
     connectedCallback(): void;
     private renderCheckbox;

package/components/combo/combo-item.js

@@ -9,7 +9,6 @@ import { LitElement, html, nothing } from 'lit';
 import { property } from 'lit/decorators.js';
 import { themes } from '../../theming/theming-decorator.js';
 import IgcCheckboxComponent from '../checkbox/checkbox.js';
-import { watch } from '../common/decorators/watch.js';
 import { registerComponent } from '../common/definitions/register.js';
 import { all } from '../dropdown/themes/item.js';
 import { styles as shared } from '../dropdown/themes/shared/item/dropdown-item.common.css.js';
@@ -18,29 +17,36 @@ let IgcComboItemComponent = IgcComboItemComponent_1 = class IgcComboItemComponen
     static register() {
         registerComponent(IgcComboItemComponent_1, IgcCheckboxComponent);
     }
-    selectedChange() {
-        this._internals.ariaSelected = `${this.selected}`;
+    set selected(value) {
+        this._selected = value;
+        this._internals.ariaSelected = this._selected.toString();
+    }
+    get selected() {
+        return this._selected;
     }
     constructor() {
         super();
-        this.selected = false;
+        this._selected = false;
         this.active = false;
         this.hideCheckbox = false;
         this._internals = this.attachInternals();
         this._internals.role = 'option';
+        this._internals.ariaSelected = 'false';
     }
     connectedCallback() {
         super.connectedCallback();
         this.setAttribute('role', 'option');
     }
     renderCheckbox() {
-        return html `<section part="prefix">
-      <igc-checkbox
-        inert
-        ?checked=${this.selected}
-        exportparts="control: checkbox, indicator: checkbox-indicator, checked"
-      ></igc-checkbox>
-    </section>`;
+        return html `
+      <section part="prefix">
+        <igc-checkbox
+          .inert=${true}
+          ?checked=${this.selected}
+          exportparts="control: checkbox, indicator: checkbox-indicator, checked"
+        ></igc-checkbox>
+      </section>
+    `;
     }
     render() {
         return html `
@@ -58,16 +64,13 @@ __decorate([
 ], IgcComboItemComponent.prototype, "index", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
-], IgcComboItemComponent.prototype, "selected", void 0);
+], IgcComboItemComponent.prototype, "selected", null);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], IgcComboItemComponent.prototype, "active", void 0);
 __decorate([
-    property({ attribute: 'hide-checkbox', type: Boolean, reflect: false })
+    property({ type: Boolean, attribute: 'hide-checkbox' })
 ], IgcComboItemComponent.prototype, "hideCheckbox", void 0);
-__decorate([
-    watch('selected')
-], IgcComboItemComponent.prototype, "selectedChange", null);
 IgcComboItemComponent = IgcComboItemComponent_1 = __decorate([
     themes(all)
 ], IgcComboItemComponent);

package/components/combo/combo-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"combo-item.js","sourceRoot":"","sources":["../../../src/components/combo/combo-item.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,oBAAoB,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,GAAG,EAAE,MAAM,4BAA4B,CAAC;AACjD,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,4DAA4D,CAAC;AAC9F,OAAO,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AAI1C,IAAM,qBAAqB,6BAA3B,MAAM,qBAAsB,SAAQ,UAAU;IAKpD,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,uBAAqB,EAAE,oBAAoB,CAAC,CAAC;IACjE,CAAC;IA4BS,cAAc;QACtB,IAAI,CAAC,UAAU,CAAC,YAAY,GAAG,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;IACpD,CAAC;IAED;QACE,KAAK,EAAE,CAAC;QArBH,aAAQ,GAAG,KAAK,CAAC;QAMjB,WAAM,GAAG,KAAK,CAAC;QAOf,iBAAY,GAAG,KAAK,CAAC;QAU1B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QACzC,IAAI,CAAC,UAAU,CAAC,IAAI,GAAG,QAAQ,CAAC;IAClC,CAAC;IAEe,iBAAiB;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IACtC,CAAC;IAEO,cAAc;QACpB,OAAO,IAAI,CAAA;;;mBAGI,IAAI,CAAC,QAAQ;;;eAGjB,CAAC;IACd,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;QACP,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,OAAO;;;;KAIvD,CAAC;IACJ,CAAC;;AAnEsB,6BAAO,GAAW,gBAAgB,AAA3B,CAA4B;AACnC,4BAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;AAU1C;IADN,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;oDACT;AAOf;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDACnB;AAMjB;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qDACrB;AAOf;IADN,QAAQ,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;2DAC5C;AAGlB;IADT,KAAK,CAAC,UAAU,CAAC;2DAGjB;AArCkB,qBAAqB;IADzC,MAAM,CAAC,GAAG,CAAC;GACS,qBAAqB,CAqEzC;eArEoB,qBAAqB","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\n\nimport { themes } from '../../theming/theming-decorator.js';\nimport IgcCheckboxComponent from '../checkbox/checkbox.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { all } from '../dropdown/themes/item.js';\nimport { styles as shared } from '../dropdown/themes/shared/item/dropdown-item.common.css.js';\nimport { styles } from './themes/combo-item.base.css.js';\n\n/* blazorSuppress */\n@themes(all)\nexport default class IgcComboItemComponent extends LitElement {\n  public static readonly tagName: string = 'igc-combo-item';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register() {\n    registerComponent(IgcComboItemComponent, IgcCheckboxComponent);\n  }\n\n  private _internals: ElementInternals;\n\n  @property({ attribute: false })\n  public index!: number;\n\n  /**\n   * Determines whether the item is selected.\n   * @attr selected\n   */\n  @property({ type: Boolean, reflect: true })\n  public selected = false;\n\n  /**\n   * Determines whether the item is active.\n   */\n  @property({ type: Boolean, reflect: true })\n  public active = false;\n\n  /**\n   * Determines whether the item is active.\n   * @attr hide-checkbox\n   */\n  @property({ attribute: 'hide-checkbox', type: Boolean, reflect: false })\n  public hideCheckbox = false;\n\n  @watch('selected')\n  protected selectedChange() {\n    this._internals.ariaSelected = `${this.selected}`;\n  }\n\n  constructor() {\n    super();\n\n    this._internals = this.attachInternals();\n    this._internals.role = 'option';\n  }\n\n  public override connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'option');\n  }\n\n  private renderCheckbox() {\n    return html`<section part=\"prefix\">\n      <igc-checkbox\n        inert\n        ?checked=${this.selected}\n        exportparts=\"control: checkbox, indicator: checkbox-indicator, checked\"\n      ></igc-checkbox>\n    </section>`;\n  }\n\n  protected override render() {\n    return html`\n      ${!this.hideCheckbox ? this.renderCheckbox() : nothing}\n      <section id=\"content\" part=\"content\">\n        <slot></slot>\n      </section>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-combo-item': IgcComboItemComponent;\n  }\n}\n"]}
+{"version":3,"file":"combo-item.js","sourceRoot":"","sources":["../../../src/components/combo/combo-item.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,oBAAoB,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,GAAG,EAAE,MAAM,4BAA4B,CAAC;AACjD,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,4DAA4D,CAAC;AAC9F,OAAO,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AAI1C,IAAM,qBAAqB,6BAA3B,MAAM,qBAAsB,SAAQ,UAAU;IAKpD,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,uBAAqB,EAAE,oBAAoB,CAAC,CAAC;IACjE,CAAC;IAcD,IAAW,QAAQ,CAAC,KAAc;QAChC,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;QACvB,IAAI,CAAC,UAAU,CAAC,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC;IAC3D,CAAC;IAED,IAAW,QAAQ;QACjB,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IAeD;QACE,KAAK,EAAE,CAAC;QAlCF,cAAS,GAAG,KAAK,CAAC;QAwBnB,WAAM,GAAG,KAAK,CAAC;QAOf,iBAAY,GAAG,KAAK,CAAC;QAK1B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QACzC,IAAI,CAAC,UAAU,CAAC,IAAI,GAAG,QAAQ,CAAC;QAChC,IAAI,CAAC,UAAU,CAAC,YAAY,GAAG,OAAO,CAAC;IACzC,CAAC;IAEe,iBAAiB;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IACtC,CAAC;IAEO,cAAc;QACpB,OAAO,IAAI,CAAA;;;mBAGI,IAAI;qBACF,IAAI,CAAC,QAAQ;;;;KAI7B,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;QACP,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,OAAO;;;;KAIvD,CAAC;IACJ,CAAC;;AA1EsB,6BAAO,GAAW,gBAAgB,AAA3B,CAA4B;AACnC,4BAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;AAW1C;IADN,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;oDACT;AAQtB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qDAI1C;AAUM;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qDACrB;AAOf;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;2DAC5B;AAzCT,qBAAqB;IADzC,MAAM,CAAC,GAAG,CAAC;GACS,qBAAqB,CA4EzC;eA5EoB,qBAAqB","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\n\nimport { themes } from '../../theming/theming-decorator.js';\nimport IgcCheckboxComponent from '../checkbox/checkbox.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { all } from '../dropdown/themes/item.js';\nimport { styles as shared } from '../dropdown/themes/shared/item/dropdown-item.common.css.js';\nimport { styles } from './themes/combo-item.base.css.js';\n\n/* blazorSuppress */\n@themes(all)\nexport default class IgcComboItemComponent extends LitElement {\n  public static readonly tagName: string = 'igc-combo-item';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register() {\n    registerComponent(IgcComboItemComponent, IgcCheckboxComponent);\n  }\n\n  private _internals: ElementInternals;\n  private _selected = false;\n\n  @property({ attribute: false })\n  public index!: number;\n\n  /**\n   * Determines whether the item is selected.\n   * @attr selected\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public set selected(value: boolean) {\n    this._selected = value;\n    this._internals.ariaSelected = this._selected.toString();\n  }\n\n  public get selected(): boolean {\n    return this._selected;\n  }\n\n  /**\n   * Determines whether the item is active.\n   */\n  @property({ type: Boolean, reflect: true })\n  public active = false;\n\n  /**\n   * Determines whether the item is active.\n   * @attr hide-checkbox\n   */\n  @property({ type: Boolean, attribute: 'hide-checkbox' })\n  public hideCheckbox = false;\n\n  constructor() {\n    super();\n\n    this._internals = this.attachInternals();\n    this._internals.role = 'option';\n    this._internals.ariaSelected = 'false';\n  }\n\n  public override connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'option');\n  }\n\n  private renderCheckbox() {\n    return html`\n      <section part=\"prefix\">\n        <igc-checkbox\n          .inert=${true}\n          ?checked=${this.selected}\n          exportparts=\"control: checkbox, indicator: checkbox-indicator, checked\"\n        ></igc-checkbox>\n      </section>\n    `;\n  }\n\n  protected override render() {\n    return html`\n      ${!this.hideCheckbox ? this.renderCheckbox() : nothing}\n      <section id=\"content\" part=\"content\">\n        <slot></slot>\n      </section>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-combo-item': IgcComboItemComponent;\n  }\n}\n"]}

package/components/combo/combo.d.ts

@@ -1,10 +1,11 @@
 import { LitElement, type TemplateResult } from 'lit';
 import type { Constructor } from '../common/mixins/constructor.js';
+import { type FormValue } from '../common/mixins/forms/form-value.js';
 import IgcInputComponent from '../input/input.js';
 import { DataController } from './controllers/data.js';
 import { NavigationController } from './controllers/navigation.js';
 import { SelectionController } from './controllers/selection.js';
-import type { ComboItemTemplate, ComboRecord, ComboRenderFunction, ComboValue, FilteringOptions, GroupingDirection, IgcComboComponentEventMap, Item, Keys } from './types.js';
+import type { ComboItemTemplate, ComboRenderFunction, ComboValue, FilteringOptions, GroupingDirection, IgcComboComponentEventMap, Item, Keys } from './types.js';
 declare const IgcComboComponent_base: Constructor<import("../common/mixins/forms/types.js").FormRequiredInterface & import("../common/mixins/forms/types.js").FormAssociatedElementInterface> & Constructor<import("../common/mixins/event-emitter.js").EventEmitterInterface<IgcComboComponentEventMap>> & Constructor<LitElement>;
 /**
  * The Combo component is similar to the Select component in that it provides a list of options from which the user can make a selection.
@@ -59,21 +60,29 @@ export default class IgcComboComponent<T extends object = any> extends IgcComboC
     static readonly tagName = "igc-combo";
     static styles: import("lit").CSSResult[];
     static register(): void;
-    private _value;
+    protected get __validators(): import("../common/validators.js").Validator<IgcComboComponent<any>>[];
+    protected _formValue: FormValue<ComboValue<T>[]>;
+    private _data;
+    private _valueKey?;
+    private _displayKey?;
+    private _groupKey?;
+    private _disableFiltering;
+    private _singleSelect;
+    private _groupSorting;
+    private _filteringOptions;
     private _activeDescendant;
     private _displayValue;
-    private _filteringOptions;
-    protected get __validators(): import("../common/validators.js").Validator<IgcComboComponent<any>>[];
-    protected navigationController: NavigationController<T>;
-    protected selectionController: SelectionController<T>;
-    protected dataController: DataController<T>;
+    protected _state: DataController<T>;
+    protected _selection: SelectionController<T>;
+    protected _navigation: NavigationController<T>;
     protected inputSuffix: Array<HTMLElement>;
     protected inputPrefix: Array<HTMLElement>;
-    protected input: IgcInputComponent;
-    private target;
-    private list;
+    protected _searchInput: IgcInputComponent;
+    private _input;
+    private _list;
     /** The data source used to generate the list of options. */
-    data: Array<T>;
+    set data(value: T[]);
+    get data(): T[];
     /**
      * The outlined attribute of the control.
      * @attr outlined
@@ -82,8 +91,10 @@ export default class IgcComboComponent<T extends object = any> extends IgcComboC
     /**
      * Enables single selection mode and moves item filtering to the main input.
      * @attr single-select
+     * @default false
      */
-    singleSelect: boolean;
+    set singleSelect(value: boolean);
+    get singleSelect(): boolean;
     /**
      * The autofocus attribute of the control.
      * @attr autofocus
@@ -118,23 +129,28 @@ export default class IgcComboComponent<T extends object = any> extends IgcComboC
      * The key in the data source used when selecting items.
      * @attr value-key
      */
-    valueKey?: Keys<T>;
+    set valueKey(value: Keys<T> | undefined);
+    get valueKey(): Keys<T> | undefined;
     /**
      * The key in the data source used to display items in the list.
      * @attr display-key
      */
-    displayKey?: Keys<T>;
+    set displayKey(value: Keys<T> | undefined);
+    get displayKey(): Keys<T> | undefined;
     /**
      * The key in the data source used to group items in the list.
      * @attr group-key
      */
-    groupKey?: Keys<T>;
+    set groupKey(value: Keys<T> | undefined);
+    get groupKey(): Keys<T> | undefined;
     /**
      * Sorts the items in each group by ascending or descending order.
      * @attr group-sorting
+     * @default asc
      * @type {"asc" | "desc" | "none"}
      */
-    groupSorting: GroupingDirection;
+    set groupSorting(value: GroupingDirection);
+    get groupSorting(): GroupingDirection;
     /**
      * An object that configures the filtering of the combo.
      * @attr filtering-options
@@ -143,8 +159,8 @@ export default class IgcComboComponent<T extends object = any> extends IgcComboC
      * @param caseSensitive - Determines whether the filtering operation should be case sensitive.
      * @param matchDiacritics -If true, the filter distinguishes between accented letters and their base letters.
      */
-    get filteringOptions(): FilteringOptions<T>;
     set filteringOptions(value: Partial<FilteringOptions<T>>);
+    get filteringOptions(): FilteringOptions<T>;
     /**
      * Enables the case sensitive search icon in the filtering input.
      * @attr case-sensitive-icon
@@ -153,8 +169,10 @@ export default class IgcComboComponent<T extends object = any> extends IgcComboC
     /**
      * Disables the filtering of the list of options.
      * @attr disable-filtering
+     * @default false
      */
-    disableFiltering: boolean;
+    set disableFiltering(value: boolean);
+    get disableFiltering(): boolean;
     /**
      * The template used for the content of each combo item.
      * @type {ComboItemTemplate<T>}
@@ -165,18 +183,6 @@ export default class IgcComboComponent<T extends object = any> extends IgcComboC
      * @type {ComboItemTemplate<T>}
      */
     groupHeaderTemplate: ComboItemTemplate<T>;
-    protected dataState: Array<ComboRecord<T>>;
-    protected dataChanged(): void;
-    protected updateDisplayKey(): void;
-    protected updateFilterKey(): void;
-    protected pipeline(): Promise<void>;
-    protected toggleDirectiveChange(): void;
-    protected updateOnDisableFiltering(): void;
-    private _rootClickController;
-    constructor();
-    protected resetSearchTerm(): void;
-    protected resetState(): void;
-    protected selectItems(): void;
     /**
      * Sets the value (selected items). The passed value must be a valid JSON array.
      * If the data source is an array of complex objects, the `valueKey` attribute must be set.
@@ -209,18 +215,24 @@ export default class IgcComboComponent<T extends object = any> extends IgcComboC
      * represented by the value key, when provided.
      */
     get value(): ComboValue<T>[];
-    protected _setDefaultValue(_: string | null, current: string | null): void;
+    protected _updateSelection(): void;
+    protected toggleDirectiveChange(): void;
+    private _rootClickController;
+    constructor();
+    protected firstUpdated(): Promise<void>;
+    protected _restoreDefaultValue(): void;
+    protected _setDefaultValue(current: string | null): void;
     protected _setFormValue(): void;
-    protected updateValue(): Promise<void>;
+    protected resetSearchTerm(): void;
+    protected updateValue(initial?: boolean): void;
     /** Sets focus on the component. */
     focus(options?: FocusOptions): void;
     /** Removes focus from the component. */
     blur(): void;
-    protected normalizeSelection(items?: Item<T> | Item<T>[]): Item<T>[];
     /**
      * Returns the current selection as an array of objects as provided in the `data` source.
      */
-    get selection(): Array<T>;
+    get selection(): T[];
     /**
      * Selects option(s) in the list by either reference or valueKey.
      * If not argument is provided all items will be selected.
@@ -267,8 +279,9 @@ export default class IgcComboComponent<T extends object = any> extends IgcComboC
      * ```
      */
     deselect(items?: Item<T> | Item<T>[]): void;
-    protected handleMainInput(e: CustomEvent): Promise<void>;
-    protected handleSearchInput(e: CustomEvent): void;
+    protected handleMainInput({ detail }: CustomEvent<string>): Promise<void>;
+    private _handleBlur;
+    protected handleSearchInput({ detail }: CustomEvent<string>): void;
     protected handleOpening(): boolean;
     protected handleClosing(): boolean;
     protected _show(emitEvent?: boolean): Promise<boolean>;
@@ -280,19 +293,17 @@ export default class IgcComboComponent<T extends object = any> extends IgcComboC
     protected _toggle(emit?: boolean): Promise<boolean>;
     /** Toggles the list of options. */
     toggle(): Promise<boolean>;
+    private _getActiveDescendantId;
     protected itemRenderer: ComboRenderFunction<T>;
     protected listKeydownHandler(event: KeyboardEvent): void;
-    protected itemClickHandler(event: MouseEvent): void;
+    protected itemClickHandler(event: PointerEvent): void;
     protected toggleSelect(index: number): void;
     protected selectByIndex(index: number): void;
-    protected navigateTo(item: T): void;
     protected clearSingleSelection(): void;
-    protected handleClearIconClick(e: MouseEvent): void;
+    protected handleClearIconClick(e: PointerEvent): void;
     protected handleMainInputKeydown(e: KeyboardEvent): void;
     protected handleSearchInputKeydown(e: KeyboardEvent): void;
     protected toggleCaseSensitivity(): void;
-    protected get hasPrefixes(): boolean;
-    protected get hasSuffixes(): boolean;
     private _stopPropagation;
     private renderToggleIcon;
     private renderClearIcon;