igniteui-webcomponents 4.4.0 → 4.5.0

package/components/chip/themes/light/chip.indigo.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chip.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/chip/themes/light/chip.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyKvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  --ghost-elevation: var(--ig-chip-ghost-elevation, var(--ig-elevation-1));\n  --remove-icon-color: var(--ig-chip-remove-icon-color, 'currentColor');\n  --focus-outline-color: var(--ig-chip-focus-outline-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n  --focus-selected-outline-color: var(--ig-chip-focus-selected-outline-color, hsla(var(--ig-primary-200), var(--ig-primary-a)));\n  --remove-icon-color-focus: var(--ig-chip-remove-icon-color-focus, 'currentColor');\n  --text-color: var(--ig-chip-text-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n  --background: var(--ig-chip-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));\n  --border-color: var(--ig-chip-border-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n  --ghost-background: var(--ig-chip-ghost-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));\n  --hover-text-color: var(--ig-chip-hover-text-color, var(--ig-gray-400-contrast));\n  --hover-background: var(--ig-chip-hover-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n  --hover-border-color: var(--ig-chip-hover-border-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n  --focus-text-color: var(--ig-chip-focus-text-color, var(--ig-gray-500-contrast));\n  --focus-background: var(--ig-chip-focus-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));\n  --focus-border-color: var(--ig-chip-focus-border-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n  --selected-text-color: var(--ig-chip-selected-text-color, var(--ig-primary-500-contrast));\n  --selected-background: var(--ig-chip-selected-background, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n  --selected-border-color: var(--ig-chip-selected-border-color, transparent);\n  --hover-selected-text-color: var(--ig-chip-hover-selected-text-color, var(--ig-primary-400-contrast));\n  --hover-selected-background: var(--ig-chip-hover-selected-background, hsla(var(--ig-primary-400), var(--ig-primary-a)));\n  --hover-selected-border-color: var(--ig-chip-hover-selected-border-color, transparent);\n  --focus-selected-text-color: var(--ig-chip-focus-selected-text-color, var(--ig-primary-500-contrast));\n  --focus-selected-background: var(--ig-chip-focus-selected-background, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n  --focus-selected-border-color: var(--ig-chip-focus-selected-border-color, transparent);\n  --border-radius: var(--ig-chip-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1rem), 1rem));\n  --disabled-text-color: var(--ig-chip-disabled-text-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n  --disabled-background: var(--ig-chip-disabled-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));\n  --disabled-border-color: var(--ig-chip-disabled-border-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n  --size: var(--ig-chip-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.5rem, -1 * 1.5rem), var(--is-small, 1) * max(1.25rem, -1 * 1.25rem)));\n}\n\n:host button {\n  border-radius: var(--border-radius);\n  border: 0.0625rem solid var(--border-color);\n  background: var(--background);\n  color: var(--text-color);\n  height: var(--size);\n}\n:host button:hover {\n  background: var(--hover-background);\n  color: var(--hover-text-color);\n}\n:host button:focus {\n  background: var(--focus-background);\n  color: var(--focus-text-color);\n  outline: 0.1875rem solid var(--focus-outline-color);\n}\n:host button[disabled] {\n  border-color: var(--disabled-border-color);\n  background: var(--disabled-background);\n  color: var(--disabled-text-color);\n}\n\n:host([selected]) button:not([disabled]) {\n  border-color: transparent;\n  background: var(--selected-background);\n  color: var(--selected-text-color);\n}\n:host([selected]) button:not([disabled]):hover {\n  background: var(--hover-selected-background);\n}\n:host([selected]) button:not([disabled]):focus {\n  outline: 0.1875rem solid var(--focus-selected-outline-color);\n}\n\n:host([variant=primary]) button,\n:host([selected][variant=primary]) button:not([disabled]) {\n  border-color: transparent;\n}\n:host([variant=primary]) button:hover,\n:host([selected][variant=primary]) button:not([disabled]):hover {\n  background: hsla(var(--ig-primary-400), var(--ig-primary-a));\n  color: var(--ig-primary-400-contrast);\n}\n:host([variant=primary]) button:focus,\n:host([selected][variant=primary]) button:not([disabled]):focus {\n  background: hsla(var(--ig-primary-500), var(--ig-primary-a));\n  color: var(--ig-primary-500-contrast);\n  outline: 0.1875rem solid var(--focus-selected-outline-color);\n}\n\n:host([variant=primary]) button[disabled] {\n  background: hsla(var(--ig-primary-200), var(--ig-primary-a));\n  color: var(--ig-primary-400-contrast);\n}\n\n:host([variant=info]) button,\n:host([selected][variant=info]) button:not([disabled]) {\n  border-color: transparent;\n}\n:host([variant=info]) button:hover,\n:host([selected][variant=info]) button:not([disabled]):hover {\n  background: hsla(var(--ig-info-400), var(--ig-info-a));\n  color: var(--ig-info-400-contrast);\n}\n:host([variant=info]) button:focus,\n:host([selected][variant=info]) button:not([disabled]):focus {\n  background: hsla(var(--ig-info-500), var(--ig-info-a));\n  color: var(--ig-info-500-contrast);\n  outline: 0.1875rem solid hsla(var(--ig-info-200), var(--ig-info-a));\n}\n\n:host([variant=info]) button[disabled] {\n  background: hsla(var(--ig-info-200), var(--ig-info-a));\n  color: var(--ig-info-400-contrast);\n}\n\n:host([variant=success]) button,\n:host([selected][variant=success]) button:not([disabled]) {\n  border-color: transparent;\n}\n:host([variant=success]) button:hover,\n:host([selected][variant=success]) button:not([disabled]):hover {\n  background: hsla(var(--ig-success-400), var(--ig-success-a));\n  color: var(--ig-success-400-contrast);\n}\n:host([variant=success]) button:focus,\n:host([selected][variant=success]) button:not([disabled]):focus {\n  background: hsla(var(--ig-success-500), var(--ig-success-a));\n  color: var(--ig-success-500-contrast);\n  outline: 0.1875rem solid hsla(var(--ig-success-200), var(--ig-success-a));\n}\n\n:host([variant=success]) button[disabled] {\n  background: hsla(var(--ig-success-200), var(--ig-success-a));\n  color: var(--ig-success-800-contrast);\n}\n\n:host([variant=warning]) button,\n:host([selected][variant=warning]) button:not([disabled]) {\n  border-color: transparent;\n}\n:host([variant=warning]) button:hover,\n:host([selected][variant=warning]) button:not([disabled]):hover {\n  background: hsla(var(--ig-warn-400), var(--ig-warn-a));\n  color: var(--ig-warn-400-contrast);\n}\n:host([variant=warning]) button:focus,\n:host([selected][variant=warning]) button:not([disabled]):focus {\n  background: hsla(var(--ig-warn-500), var(--ig-warn-a));\n  color: var(--ig-warn-500-contrast);\n  outline: 0.1875rem solid hsla(var(--ig-warn-200), var(--ig-warn-a));\n}\n\n:host([variant=warning]) button[disabled] {\n  background: hsla(var(--ig-warn-200), var(--ig-warn-a));\n  color: var(--ig-warn-900-contrast);\n}\n\n:host([variant=danger]) button,\n:host([selected][variant=danger]) button:not([disabled]) {\n  border-color: transparent;\n}\n:host([variant=danger]) button:hover,\n:host([selected][variant=danger]) button:not([disabled]):hover {\n  background: hsla(var(--ig-error-400), var(--ig-error-a));\n  color: var(--ig-error-400-contrast);\n}\n:host([variant=danger]) button:focus,\n:host([selected][variant=danger]) button:not([disabled]):focus {\n  background: hsla(var(--ig-error-500), var(--ig-error-a));\n  color: var(--ig-error-500-contrast);\n  outline: 0.1875rem solid hsla(var(--ig-error-200), var(--ig-error-a));\n}\n\n:host([variant=danger]) button[disabled] {\n  background: hsla(var(--ig-error-200), var(--ig-error-a));\n  color: var(--ig-error-400-contrast);\n}`;\n"]}

package/components/chip/themes/light/chip.material.css.d.ts

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

package/components/chip/themes/light/chip.material.css.js

@@ -0,0 +1,53 @@
+import { css } from 'lit';
+export const styles = css `:host {
+  --ghost-elevation: var(--ig-chip-ghost-elevation, var(--ig-elevation-8));
+  --remove-icon-color: var(--ig-chip-remove-icon-color, 'currentColor');
+  --focus-outline-color: var(--ig-chip-focus-outline-color, transparent);
+  --focus-selected-outline-color: var(--ig-chip-focus-selected-outline-color, transparent);
+  --remove-icon-color-focus: var(--ig-chip-remove-icon-color-focus, 'currentColor');
+  --text-color: var(--ig-chip-text-color, var(--ig-gray-300-contrast));
+  --background: var(--ig-chip-background, hsla(var(--ig-gray-300), var(--ig-gray-a)));
+  --border-color: var(--ig-chip-border-color, transparent);
+  --ghost-background: var(--ig-chip-ghost-background, hsla(var(--ig-gray-400), var(--ig-gray-a)));
+  --hover-text-color: var(--ig-chip-hover-text-color, var(--ig-gray-400-contrast));
+  --hover-background: var(--ig-chip-hover-background, hsla(var(--ig-gray-400), var(--ig-gray-a)));
+  --hover-border-color: var(--ig-chip-hover-border-color, transparent);
+  --focus-text-color: var(--ig-chip-focus-text-color, var(--ig-gray-500-contrast));
+  --focus-background: var(--ig-chip-focus-background, hsla(var(--ig-gray-500), var(--ig-gray-a)));
+  --focus-border-color: var(--ig-chip-focus-border-color, transparent);
+  --selected-text-color: var(--ig-chip-selected-text-color, var(--ig-gray-300-contrast));
+  --selected-background: var(--ig-chip-selected-background, hsla(var(--ig-gray-300), var(--ig-gray-a)));
+  --selected-border-color: var(--ig-chip-selected-border-color, transparent);
+  --hover-selected-text-color: var(--ig-chip-hover-selected-text-color, var(--ig-gray-400-contrast));
+  --hover-selected-background: var(--ig-chip-hover-selected-background, hsla(var(--ig-gray-400), var(--ig-gray-a)));
+  --hover-selected-border-color: var(--ig-chip-hover-selected-border-color, transparent);
+  --focus-selected-text-color: var(--ig-chip-focus-selected-text-color, var(--ig-gray-500-contrast));
+  --focus-selected-background: var(--ig-chip-focus-selected-background, hsla(var(--ig-gray-500), var(--ig-gray-a)));
+  --focus-selected-border-color: var(--ig-chip-focus-selected-border-color, transparent);
+  --border-radius: var(--ig-chip-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1rem), 1rem));
+  --disabled-text-color: var(--ig-chip-disabled-text-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));
+  --disabled-background: var(--ig-chip-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  --disabled-border-color: var(--ig-chip-disabled-border-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  --size: var(--ig-chip-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.5rem, -1 * 1.5rem), var(--is-small, 1) * max(1.25rem, -1 * 1.25rem)));
+}
+
+:host button {
+  border-radius: var(--border-radius);
+  background: var(--background);
+  color: var(--text-color);
+  outline: none;
+  height: var(--size);
+}
+:host button:hover {
+  background: var(--hover-background);
+  color: var(--hover-text-color);
+}
+:host button:focus {
+  background: var(--focus-background);
+  color: var(--focus-text-color);
+}
+:host button[disabled] {
+  background: var(--disabled-background);
+  color: var(--disabled-text-color);
+}`;
+//# sourceMappingURL=chip.material.css.js.map

package/components/chip/themes/light/chip.material.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chip.material.css.js","sourceRoot":"","sources":["../../../../../src/components/chip/themes/light/chip.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkDvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  --ghost-elevation: var(--ig-chip-ghost-elevation, var(--ig-elevation-8));\n  --remove-icon-color: var(--ig-chip-remove-icon-color, 'currentColor');\n  --focus-outline-color: var(--ig-chip-focus-outline-color, transparent);\n  --focus-selected-outline-color: var(--ig-chip-focus-selected-outline-color, transparent);\n  --remove-icon-color-focus: var(--ig-chip-remove-icon-color-focus, 'currentColor');\n  --text-color: var(--ig-chip-text-color, var(--ig-gray-300-contrast));\n  --background: var(--ig-chip-background, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n  --border-color: var(--ig-chip-border-color, transparent);\n  --ghost-background: var(--ig-chip-ghost-background, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n  --hover-text-color: var(--ig-chip-hover-text-color, var(--ig-gray-400-contrast));\n  --hover-background: var(--ig-chip-hover-background, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n  --hover-border-color: var(--ig-chip-hover-border-color, transparent);\n  --focus-text-color: var(--ig-chip-focus-text-color, var(--ig-gray-500-contrast));\n  --focus-background: var(--ig-chip-focus-background, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n  --focus-border-color: var(--ig-chip-focus-border-color, transparent);\n  --selected-text-color: var(--ig-chip-selected-text-color, var(--ig-gray-300-contrast));\n  --selected-background: var(--ig-chip-selected-background, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n  --selected-border-color: var(--ig-chip-selected-border-color, transparent);\n  --hover-selected-text-color: var(--ig-chip-hover-selected-text-color, var(--ig-gray-400-contrast));\n  --hover-selected-background: var(--ig-chip-hover-selected-background, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n  --hover-selected-border-color: var(--ig-chip-hover-selected-border-color, transparent);\n  --focus-selected-text-color: var(--ig-chip-focus-selected-text-color, var(--ig-gray-500-contrast));\n  --focus-selected-background: var(--ig-chip-focus-selected-background, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n  --focus-selected-border-color: var(--ig-chip-focus-selected-border-color, transparent);\n  --border-radius: var(--ig-chip-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1rem), 1rem));\n  --disabled-text-color: var(--ig-chip-disabled-text-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n  --disabled-background: var(--ig-chip-disabled-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n  --disabled-border-color: var(--ig-chip-disabled-border-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n  --size: var(--ig-chip-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.5rem, -1 * 1.5rem), var(--is-small, 1) * max(1.25rem, -1 * 1.25rem)));\n}\n\n:host button {\n  border-radius: var(--border-radius);\n  background: var(--background);\n  color: var(--text-color);\n  outline: none;\n  height: var(--size);\n}\n:host button:hover {\n  background: var(--hover-background);\n  color: var(--hover-text-color);\n}\n:host button:focus {\n  background: var(--focus-background);\n  color: var(--focus-text-color);\n}\n:host button[disabled] {\n  background: var(--disabled-background);\n  color: var(--disabled-text-color);\n}`;\n"]}

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

@@ -2,6 +2,7 @@ import { LitElement } from 'lit';
 export default class IgcComboHeaderComponent extends LitElement {
     static readonly tagName: string;
     static styles: import("lit").CSSResult;
+    static register(): void;
     protected render(): import("lit-html").TemplateResult<1>;
 }
 declare global {

package/components/combo/combo-header.js

@@ -6,12 +6,15 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { html, LitElement } from 'lit';
 import { themes } from '../../theming/theming-decorator.js';
-import { styles } from './themes/light/header/combo-header.base.css.js';
+import { registerComponent } from '../common/definitions/register.js';
 import { styles as bootstrap } from '../dropdown/themes/light/header/dropdown-header.bootstrap.css.js';
 import { styles as fluent } from '../dropdown/themes/light/header/dropdown-header.fluent.css.js';
-import { styles as indigo } from '../dropdown/themes/light/header/dropdown-header.material.css.js';
-import { styles as material } from '../dropdown/themes/light/header/dropdown-header.material.css.js';
+import { styles as indigo, styles as material, } from '../dropdown/themes/light/header/dropdown-header.material.css.js';
+import { styles } from './themes/light/header/combo-header.base.css.js';
 let IgcComboHeaderComponent = class IgcComboHeaderComponent extends LitElement {
+    static register() {
+        registerComponent(this);
+    }
     render() {
         return html `<slot></slot>`;
     }
@@ -19,7 +22,10 @@ let IgcComboHeaderComponent = class IgcComboHeaderComponent extends LitElement {
 IgcComboHeaderComponent.tagName = 'igc-combo-header';
 IgcComboHeaderComponent.styles = styles;
 IgcComboHeaderComponent = __decorate([
-    themes({ bootstrap, fluent, indigo, material })
+    themes({
+        light: { bootstrap, fluent, indigo, material },
+        dark: { bootstrap, fluent, indigo, material },
+    })
 ], IgcComboHeaderComponent);
 export default IgcComboHeaderComponent;
 //# sourceMappingURL=combo-header.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"combo-header.js","sourceRoot":"","sources":["../../../src/components/combo/combo-header.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,gDAAgD,CAAC;AACxE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,kEAAkE,CAAC;AACvG,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,+DAA+D,CAAC;AACjG,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,iEAAiE,CAAC;AACnG,OAAO,EAAE,MAAM,IAAI,QAAQ,EAAE,MAAM,iEAAiE,CAAC;AAIrG,IAAqB,uBAAuB,GAA5C,MAAqB,uBAAwB,SAAQ,UAAU;IAI1C,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AALsB,+BAAO,GAAW,kBAAkB,AAA7B,CAA8B;AACrC,8BAAM,GAAG,MAAM,AAAT,CAAU;AAFpB,uBAAuB;IAD3C,MAAM,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC;GAC3B,uBAAuB,CAO3C;eAPoB,uBAAuB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { styles } from './themes/light/header/combo-header.base.css.js';\nimport { styles as bootstrap } from '../dropdown/themes/light/header/dropdown-header.bootstrap.css.js';\nimport { styles as fluent } from '../dropdown/themes/light/header/dropdown-header.fluent.css.js';\nimport { styles as indigo } from '../dropdown/themes/light/header/dropdown-header.material.css.js';\nimport { styles as material } from '../dropdown/themes/light/header/dropdown-header.material.css.js';\n\n/* blazorSuppress */\n@themes({ bootstrap, fluent, indigo, material })\nexport default class IgcComboHeaderComponent extends LitElement {\n  public static readonly tagName: string = 'igc-combo-header';\n  public static override styles = styles;\n\n  protected override render() {\n    return html`<slot></slot>`;\n  }\n}\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-combo-header': IgcComboHeaderComponent;\n  }\n}\n"]}
+{"version":3,"file":"combo-header.js","sourceRoot":"","sources":["../../../src/components/combo/combo-header.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,kEAAkE,CAAC;AACvG,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,+DAA+D,CAAC;AACjG,OAAO,EACL,MAAM,IAAI,MAAM,EAChB,MAAM,IAAI,QAAQ,GACnB,MAAM,iEAAiE,CAAC;AACzE,OAAO,EAAE,MAAM,EAAE,MAAM,gDAAgD,CAAC;AAOxE,IAAqB,uBAAuB,GAA5C,MAAqB,uBAAwB,SAAQ,UAAU;IAItD,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AATsB,+BAAO,GAAW,kBAAkB,AAA7B,CAA8B;AACrC,8BAAM,GAAG,MAAM,AAAT,CAAU;AAFpB,uBAAuB;IAJ3C,MAAM,CAAC;QACN,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;QAC9C,IAAI,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;KAC9C,CAAC;GACmB,uBAAuB,CAW3C;eAXoB,uBAAuB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { styles as bootstrap } from '../dropdown/themes/light/header/dropdown-header.bootstrap.css.js';\nimport { styles as fluent } from '../dropdown/themes/light/header/dropdown-header.fluent.css.js';\nimport {\n  styles as indigo,\n  styles as material,\n} from '../dropdown/themes/light/header/dropdown-header.material.css.js';\nimport { styles } from './themes/light/header/combo-header.base.css.js';\n\n/* blazorSuppress */\n@themes({\n  light: { bootstrap, fluent, indigo, material },\n  dark: { bootstrap, fluent, indigo, material },\n})\nexport default class IgcComboHeaderComponent extends LitElement {\n  public static readonly tagName: string = 'igc-combo-header';\n  public static override styles = styles;\n\n  public static register() {\n    registerComponent(this);\n  }\n\n  protected override render() {\n    return html`<slot></slot>`;\n  }\n}\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-combo-header': IgcComboHeaderComponent;\n  }\n}\n"]}

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

@@ -2,6 +2,7 @@ import { LitElement } from 'lit';
 export default class IgcComboItemComponent extends LitElement {
     static readonly tagName: string;
     static styles: import("lit").CSSResult;
+    static register(): void;
     index: number;
     /**
      * Determines whether the item is selected.

package/components/combo/combo-item.js

@@ -5,17 +5,16 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { html, LitElement, nothing } from 'lit';
+import { property } from 'lit/decorators.js';
 import { themes } from '../../theming/theming-decorator.js';
-import { styles } from './themes/light/item/combo-item.base.css.js';
+import IgcCheckboxComponent from '../checkbox/checkbox.js';
+import { watch } from '../common/decorators/watch.js';
+import { registerComponent } from '../common/definitions/register.js';
 import { styles as bootstrap } from '../dropdown/themes/light/item/dropdown-item.bootstrap.css.js';
 import { styles as fluent } from '../dropdown/themes/light/item/dropdown-item.fluent.css.js';
 import { styles as indigo } from '../dropdown/themes/light/item/dropdown-item.indigo.css.js';
 import { styles as material } from '../dropdown/themes/light/item/dropdown-item.material.css.js';
-import { property } from 'lit/decorators.js';
-import { watch } from '../common/decorators/watch.js';
-import IgcCheckboxComopnent from '../checkbox/checkbox.js';
-import { defineComponents } from '../common/definitions/defineComponents.js';
-defineComponents(IgcCheckboxComopnent);
+import { styles } from './themes/light/item/combo-item.base.css.js';
 let IgcComboItemComponent = class IgcComboItemComponent extends LitElement {
     constructor() {
         super(...arguments);
@@ -23,6 +22,9 @@ let IgcComboItemComponent = class IgcComboItemComponent extends LitElement {
         this.active = false;
         this.hideCheckbox = false;
     }
+    static register() {
+        registerComponent(this, IgcCheckboxComponent);
+    }
     selectedChange() {
         this.selected
             ? this.setAttribute('aria-selected', 'true')
@@ -69,7 +71,10 @@ __decorate([
     watch('selected')
 ], IgcComboItemComponent.prototype, "selectedChange", null);
 IgcComboItemComponent = __decorate([
-    themes({ bootstrap, fluent, indigo, material })
+    themes({
+        light: { bootstrap, fluent, indigo, material },
+        dark: { bootstrap, fluent, indigo, material },
+    })
 ], IgcComboItemComponent);
 export default IgcComboItemComponent;
 //# sourceMappingURL=combo-item.js.map

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,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,4CAA4C,CAAC;AACpE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,8DAA8D,CAAC;AACnG,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,2DAA2D,CAAC;AAC7F,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,2DAA2D,CAAC;AAC7F,OAAO,EAAE,MAAM,IAAI,QAAQ,EAAE,MAAM,6DAA6D,CAAC;AACjG,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AACtD,OAAO,oBAAoB,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,2CAA2C,CAAC;AAE7E,gBAAgB,CAAC,oBAAoB,CAAC,CAAC;AAGvC,IAAqB,qBAAqB,GAA1C,MAAqB,qBAAsB,SAAQ,UAAU;IAA7D;;QAYS,aAAQ,GAAG,KAAK,CAAC;QAMjB,WAAM,GAAG,KAAK,CAAC;QAOf,iBAAY,GAAG,KAAK,CAAC;IAiC9B,CAAC;IA9BW,cAAc;QACtB,IAAI,CAAC,QAAQ;YACX,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC;YAC5C,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;IAC5C,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;;;;eAIjB,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;;AAxDsB,6BAAO,GAAW,gBAAgB,AAA3B,CAA4B;AACnC,4BAAM,GAAG,MAAM,AAAT,CAAU;AAGhC;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;2DAKjB;AAhCkB,qBAAqB;IADzC,MAAM,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC;GAC3B,qBAAqB,CA0DzC;eA1DoB,qBAAqB","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { styles } from './themes/light/item/combo-item.base.css.js';\nimport { styles as bootstrap } from '../dropdown/themes/light/item/dropdown-item.bootstrap.css.js';\nimport { styles as fluent } from '../dropdown/themes/light/item/dropdown-item.fluent.css.js';\nimport { styles as indigo } from '../dropdown/themes/light/item/dropdown-item.indigo.css.js';\nimport { styles as material } from '../dropdown/themes/light/item/dropdown-item.material.css.js';\nimport { property } from 'lit/decorators.js';\nimport { watch } from '../common/decorators/watch.js';\nimport IgcCheckboxComopnent from '../checkbox/checkbox.js';\nimport { defineComponents } from '../common/definitions/defineComponents.js';\n\ndefineComponents(IgcCheckboxComopnent);\n/* blazorSuppress */\n@themes({ bootstrap, fluent, indigo, material })\nexport default class IgcComboItemComponent extends LitElement {\n  public static readonly tagName: string = 'igc-combo-item';\n  public static override styles = styles;\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.selected\n      ? this.setAttribute('aria-selected', 'true')\n      : this.removeAttribute('aria-selected');\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        aria-hidden=\"true\"\n        ?checked=${this.selected}\n        tabindex=\"-1\"\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,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,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,MAAM,IAAI,SAAS,EAAE,MAAM,8DAA8D,CAAC;AACnG,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,2DAA2D,CAAC;AAC7F,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,2DAA2D,CAAC;AAC7F,OAAO,EAAE,MAAM,IAAI,QAAQ,EAAE,MAAM,6DAA6D,CAAC;AACjG,OAAO,EAAE,MAAM,EAAE,MAAM,4CAA4C,CAAC;AAOpE,IAAqB,qBAAqB,GAA1C,MAAqB,qBAAsB,SAAQ,UAAU;IAA7D;;QAgBS,aAAQ,GAAG,KAAK,CAAC;QAMjB,WAAM,GAAG,KAAK,CAAC;QAOf,iBAAY,GAAG,KAAK,CAAC;IAiC9B,CAAC;IA1DQ,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,IAAI,EAAE,oBAAoB,CAAC,CAAC;IAChD,CAAC;IA0BS,cAAc;QACtB,IAAI,CAAC,QAAQ;YACX,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC;YAC5C,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;IAC5C,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;;;;eAIjB,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;;AA5DsB,6BAAO,GAAW,gBAAgB,AAA3B,CAA4B;AACnC,4BAAM,GAAG,MAAM,AAAT,CAAU;AAOhC;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;2DAKjB;AApCkB,qBAAqB;IAJzC,MAAM,CAAC;QACN,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;QAC9C,IAAI,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;KAC9C,CAAC;GACmB,qBAAqB,CA8DzC;eA9DoB,qBAAqB","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\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 { styles as bootstrap } from '../dropdown/themes/light/item/dropdown-item.bootstrap.css.js';\nimport { styles as fluent } from '../dropdown/themes/light/item/dropdown-item.fluent.css.js';\nimport { styles as indigo } from '../dropdown/themes/light/item/dropdown-item.indigo.css.js';\nimport { styles as material } from '../dropdown/themes/light/item/dropdown-item.material.css.js';\nimport { styles } from './themes/light/item/combo-item.base.css.js';\n\n/* blazorSuppress */\n@themes({\n  light: { bootstrap, fluent, indigo, material },\n  dark: { bootstrap, fluent, indigo, material },\n})\nexport default class IgcComboItemComponent extends LitElement {\n  public static readonly tagName: string = 'igc-combo-item';\n  public static override styles = styles;\n\n  public static register() {\n    registerComponent(this, IgcCheckboxComponent);\n  }\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.selected\n      ? this.setAttribute('aria-selected', 'true')\n      : this.removeAttribute('aria-selected');\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        aria-hidden=\"true\"\n        ?checked=${this.selected}\n        tabindex=\"-1\"\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"]}

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

@@ -2,6 +2,7 @@ import { LitVirtualizer } from '@lit-labs/virtualizer';
 export default class IgcComboListComponent extends LitVirtualizer {
     static readonly tagName = "igc-combo-list";
     scroller: boolean;
+    static register(): void;
     connectedCallback(): Promise<void>;
 }
 declare global {

package/components/combo/combo-list.js

@@ -1,9 +1,13 @@
 import { LitVirtualizer } from '@lit-labs/virtualizer';
+import { registerComponent } from '../common/definitions/register.js';
 class IgcComboListComponent extends LitVirtualizer {
     constructor() {
         super(...arguments);
         this.scroller = true;
     }
+    static register() {
+        registerComponent(this);
+    }
     async connectedCallback() {
         await super.layoutComplete;
         super.connectedCallback();

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

@@ -1 +1 @@
-{"version":3,"file":"combo-list.js","sourceRoot":"","sources":["../../../src/components/combo/combo-list.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAIvD,MAAqB,qBAAsB,SAAQ,cAAc;IAAjE;;QAEkB,aAAQ,GAAG,IAAI,CAAC;IASlC,CAAC;IAPiB,KAAK,CAAC,iBAAiB;QACrC,MAAM,KAAK,CAAC,cAAc,CAAC;QAE3B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC;QACnC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IACvC,CAAC;;AATsB,6BAAO,GAAG,gBAAgB,AAAnB,CAAoB;eAD/B,qBAAqB","sourcesContent":["import { LitVirtualizer } from '@lit-labs/virtualizer';\n\n/* blazorSuppress */\n/* blazorAlternateBaseType: BaseElement */\nexport default class IgcComboListComponent extends LitVirtualizer {\n  public static readonly tagName = 'igc-combo-list';\n  public override scroller = true;\n\n  public override async connectedCallback() {\n    await super.layoutComplete;\n\n    super.connectedCallback();\n    this.setAttribute('tabindex', '0');\n    this.setAttribute('role', 'listbox');\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-combo-list': IgcComboListComponent;\n  }\n}\n"]}
+{"version":3,"file":"combo-list.js","sourceRoot":"","sources":["../../../src/components/combo/combo-list.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AAItE,MAAqB,qBAAsB,SAAQ,cAAc;IAAjE;;QAEkB,aAAQ,GAAG,IAAI,CAAC;IAalC,CAAC;IAXQ,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IAEe,KAAK,CAAC,iBAAiB;QACrC,MAAM,KAAK,CAAC,cAAc,CAAC;QAE3B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC;QACnC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IACvC,CAAC;;AAbsB,6BAAO,GAAG,gBAAgB,AAAnB,CAAoB;eAD/B,qBAAqB","sourcesContent":["import { LitVirtualizer } from '@lit-labs/virtualizer';\nimport { registerComponent } from '../common/definitions/register.js';\n\n/* blazorSuppress */\n/* blazorAlternateBaseType: BaseElement */\nexport default class IgcComboListComponent extends LitVirtualizer {\n  public static readonly tagName = 'igc-combo-list';\n  public override scroller = true;\n\n  public static register() {\n    registerComponent(this);\n  }\n\n  public override async connectedCallback() {\n    await super.layoutComplete;\n\n    super.connectedCallback();\n    this.setAttribute('tabindex', '0');\n    this.setAttribute('role', 'listbox');\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-combo-list': IgcComboListComponent;\n  }\n}\n"]}

package/components/combo/combo.d.ts

@@ -1,14 +1,14 @@
 import { LitElement, TemplateResult } from 'lit';
 import { themeSymbol } from '../../theming/theming-decorator.js';
+import { Constructor } from '../common/mixins/constructor.js';
+import type { Validator } from '../common/validators.js';
 import IgcInputComponent from '../input/input.js';
-import { NavigationController } from './controllers/navigation.js';
-import { SelectionController } from './controllers/selection.js';
 import { IgcToggleController } from '../toggle/toggle.controller.js';
-import { DataController } from './controllers/data.js';
 import { IgcToggleComponent } from '../toggle/types.js';
-import type { Keys, ComboRecord, GroupingDirection, FilteringOptions, IgcComboEventMap, ComboItemTemplate, ComboRenderFunction, Item, ComboValue } from './types.js';
-import { Constructor } from '../common/mixins/constructor.js';
-import type { Validator } from '../common/validators.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, IgcComboEventMap, Item, Keys } from './types.js';
 declare const IgcComboComponent_base: Constructor<import("../common/mixins/form-associated-required.js").FormRequiredInterface & import("../common/mixins/form-associated.js").FormAssociatedElementInterface> & import("../common/mixins/constructor.js").AbstractConstructor<import("../common/mixins/event-emitter.js").EventEmitterInterface<IgcComboEventMap>> & Constructor<LitElement>;
 /**
  * @element igc-combo
@@ -55,6 +55,7 @@ declare const IgcComboComponent_base: Constructor<import("../common/mixins/form-
 export default class IgcComboComponent<T extends object = any> extends IgcComboComponent_base implements Partial<IgcToggleComponent> {
     static readonly tagName = "igc-combo";
     static styles: import("lit").CSSResult;
+    static register(): void;
     private _value;
     private _displayValue;
     private _filteringOptions;

package/components/combo/combo.js

@@ -5,35 +5,37 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { html, LitElement } from 'lit';
-import { styleMap } from 'lit/directives/style-map.js';
-import { themes, themeSymbol } from '../../theming/theming-decorator.js';
-import { styles } from './themes/light/combo.base.css.js';
-import { styles as bootstrap } from './themes/light/combo.bootstrap.css.js';
-import { styles as material } from './themes/light/combo.material.css.js';
-import { styles as fluent } from './themes/light/combo.fluent.css.js';
-import { styles as indigo } from './themes/light/combo.indigo.css.js';
 import { property, query, queryAssignedElements, state, } from 'lit/decorators.js';
-import { watch } from '../common/decorators/watch.js';
-import { defineComponents } from '../common/definitions/defineComponents.js';
-import IgcComboListComponent from './combo-list.js';
-import IgcComboItemComponent from './combo-item.js';
-import IgcComboHeaderComponent from './combo-header.js';
-import IgcInputComponent from '../input/input.js';
-import IgcIconComponent from '../icon/icon.js';
-import { NavigationController } from './controllers/navigation.js';
-import { SelectionController } from './controllers/selection.js';
-import { IgcToggleController } from '../toggle/toggle.controller.js';
-import { DataController } from './controllers/data.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { live } from 'lit/directives/live.js';
-import { partNameMap } from '../common/util.js';
-import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
+import { styleMap } from 'lit/directives/style-map.js';
+import { themes, themeSymbol } from '../../theming/theming-decorator.js';
 import { blazorAdditionalDependencies } from '../common/decorators/blazorAdditionalDependencies.js';
 import { blazorIndirectRender } from '../common/decorators/blazorIndirectRender.js';
-import { FormAssociatedRequiredMixin } from '../common/mixins/form-associated-required.js';
+import { watch } from '../common/decorators/watch.js';
+import { registerComponent } from '../common/definitions/register.js';
 import messages from '../common/localization/validation-en.js';
-defineComponents(IgcIconComponent, IgcComboListComponent, IgcComboItemComponent, IgcComboHeaderComponent, IgcInputComponent);
+import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
+import { FormAssociatedRequiredMixin } from '../common/mixins/form-associated-required.js';
+import { partNameMap } from '../common/util.js';
+import IgcIconComponent from '../icon/icon.js';
+import IgcInputComponent from '../input/input.js';
+import { IgcToggleController } from '../toggle/toggle.controller.js';
+import IgcComboHeaderComponent from './combo-header.js';
+import IgcComboItemComponent from './combo-item.js';
+import IgcComboListComponent from './combo-list.js';
+import { DataController } from './controllers/data.js';
+import { NavigationController } from './controllers/navigation.js';
+import { SelectionController } from './controllers/selection.js';
+import { styles } from './themes/light/combo.base.css.js';
+import { styles as bootstrap } from './themes/light/combo.bootstrap.css.js';
+import { styles as fluent } from './themes/light/combo.fluent.css.js';
+import { styles as indigo } from './themes/light/combo.indigo.css.js';
+import { styles as material } from './themes/light/combo.material.css.js';
 let IgcComboComponent = class IgcComboComponent extends FormAssociatedRequiredMixin(EventEmitterMixin(LitElement)) {
+    static register() {
+        registerComponent(this, IgcIconComponent, IgcComboListComponent, IgcComboItemComponent, IgcComboHeaderComponent, IgcInputComponent);
+    }
     get filteringOptions() {
         return this._filteringOptions;
     }
@@ -42,10 +44,13 @@ let IgcComboComponent = class IgcComboComponent extends FormAssociatedRequiredMi
         this.requestUpdate('pipeline');
     }
     dataChanged() {
+        if (this.data.length === 0)
+            return;
         this.dataState = structuredClone(this.data);
         if (this.hasUpdated) {
             this.pipeline();
         }
+        this.requestUpdate('value');
     }
     updateDisplayKey() {
         var _a;
@@ -216,6 +221,8 @@ let IgcComboComponent = class IgcComboComponent extends FormAssociatedRequiredMi
         super.setFormValue(data);
     }
     async updateValue() {
+        if (this.data.length === 0)
+            return;
         const selected = Array.from(this.selectionController.selected);
         this._value = this.selectionController.getValue(selected, this.valueKey);
         this._displayValue = this.selectionController
@@ -647,7 +654,10 @@ __decorate([
     property({ attribute: true, type: Array })
 ], IgcComboComponent.prototype, "value", null);
 IgcComboComponent = __decorate([
-    themes({ material, bootstrap, fluent, indigo }, true),
+    themes({
+        light: { material, bootstrap, fluent, indigo },
+        dark: { material, bootstrap, fluent, indigo },
+    }, true),
     blazorAdditionalDependencies('IgcIconComponent, IgcInputComponent'),
     blazorIndirectRender
 ], IgcComboComponent);