igniteui-webcomponents 6.1.1-alpha.0 → 6.1.1

package/components/date-range-picker/predefined-ranges-area.d.ts

@@ -24,6 +24,7 @@ export default class IgcPredefinedRangesAreaComponent extends LitElement {
     customRanges: CustomDateRange[];
     /** The resource strings of the date range area component. */
     resourceStrings: IgcDateRangePickerResourceStrings;
+    constructor();
     protected _updatePredefinedRanges(): void;
     private _handleRangeSelect;
     protected _renderDateRanges(): Generator<import("lit-html").TemplateResult<1>, void, unknown>;

package/components/date-range-picker/predefined-ranges-area.js

@@ -4,10 +4,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-var IgcPredefinedRangesAreaComponent_1;
 import { html, LitElement } from 'lit';
 import { property, state } from 'lit/decorators.js';
-import { themes } from '../../theming/theming-decorator.js';
+import { addThemingController } from '../../theming/theming-controller.js';
 import { CalendarDay } from '../calendar/model.js';
 import IgcChipComponent from '../chip/chip.js';
 import { watch } from '../common/decorators/watch.js';
@@ -16,16 +15,17 @@ import { IgcDateRangePickerResourceStringsEN, } from '../common/i18n/date-range-
 import { styles } from './predefined-ranges-area.base.css.js';
 import { all } from './themes/ranges-themes.js';
 import { styles as shared } from './themes/shared/predefined-ranges-area.common.css.js';
-let IgcPredefinedRangesAreaComponent = IgcPredefinedRangesAreaComponent_1 = class IgcPredefinedRangesAreaComponent extends LitElement {
+class IgcPredefinedRangesAreaComponent extends LitElement {
+    static register() {
+        registerComponent(IgcPredefinedRangesAreaComponent, IgcChipComponent);
+    }
     constructor() {
-        super(...arguments);
+        super();
         this._predefinedRanges = [];
         this.usePredefinedRanges = false;
         this.customRanges = [];
         this.resourceStrings = IgcDateRangePickerResourceStringsEN;
-    }
-    static register() {
-        registerComponent(IgcPredefinedRangesAreaComponent_1, IgcChipComponent);
+        addThemingController(this, all);
     }
     _updatePredefinedRanges() {
         this._predefinedRanges = getPredefinedRanges(this.resourceStrings);
@@ -48,9 +48,10 @@ let IgcPredefinedRangesAreaComponent = IgcPredefinedRangesAreaComponent_1 = clas
     render() {
         return html `<div part="ranges">${this._renderDateRanges()}</div>`;
     }
-};
+}
 IgcPredefinedRangesAreaComponent.tagName = 'igc-predefined-ranges-area';
 IgcPredefinedRangesAreaComponent.styles = [styles, shared];
+export default IgcPredefinedRangesAreaComponent;
 __decorate([
     state()
 ], IgcPredefinedRangesAreaComponent.prototype, "_predefinedRanges", void 0);
@@ -70,10 +71,6 @@ __decorate([
 __decorate([
     watch('resourceStrings')
 ], IgcPredefinedRangesAreaComponent.prototype, "_updatePredefinedRanges", null);
-IgcPredefinedRangesAreaComponent = IgcPredefinedRangesAreaComponent_1 = __decorate([
-    themes(all)
-], IgcPredefinedRangesAreaComponent);
-export default IgcPredefinedRangesAreaComponent;
 function getPredefinedRanges(resourceStrings) {
     const today = CalendarDay.today;
     const ranges = [

package/components/date-range-picker/predefined-ranges-area.js.map

@@ -1 +1 @@
-{"version":3,"file":"predefined-ranges-area.js","sourceRoot":"","sources":["../../../src/components/date-range-picker/predefined-ranges-area.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { CalendarDay } from '../calendar/model.js';\nimport IgcChipComponent from '../chip/chip.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport {\n  type IgcDateRangePickerResourceStrings,\n  IgcDateRangePickerResourceStringsEN,\n} from '../common/i18n/date-range-picker.resources.js';\nimport type { CustomDateRange, DateRangeValue } from './date-range-picker.js';\nimport { styles } from './predefined-ranges-area.base.css.js';\nimport { all } from './themes/ranges-themes.js';\nimport { styles as shared } from './themes/shared/predefined-ranges-area.common.css.js';\n\n/* blazorSuppress */\n/**\n * The predefined ranges area component is used within the `igc-date-range picker` element and it\n * displays a set of chips with predefined date ranges. The component allows users to quickly select\n * a predefined date range value. Users can also provide custom ranges to be displayed as chips.\n *\n * @element igc-predefined-ranges-area\n */\n@themes(all)\nexport default class IgcPredefinedRangesAreaComponent extends LitElement {\n  public static readonly tagName = 'igc-predefined-ranges-area';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcPredefinedRangesAreaComponent, IgcChipComponent);\n  }\n\n  @state()\n  private _predefinedRanges: CustomDateRange[] = [];\n\n  /**\n   * Whether the control will show chips with predefined ranges.\n   * @attr use-predefined-ranges\n   */\n  @property({\n    type: Boolean,\n    reflect: true,\n    attribute: 'use-predefined-ranges',\n  })\n  public usePredefinedRanges = false;\n\n  /**\n   * Renders chips with custom ranges based on the elements of the array.\n   */\n  @property({ attribute: false })\n  public customRanges: CustomDateRange[] = [];\n\n  /** The resource strings of the date range area component. */\n  @property({ attribute: false })\n  public resourceStrings: IgcDateRangePickerResourceStrings =\n    IgcDateRangePickerResourceStringsEN;\n\n  @watch('resourceStrings')\n  protected _updatePredefinedRanges(): void {\n    this._predefinedRanges = getPredefinedRanges(this.resourceStrings);\n  }\n\n  private _handleRangeSelect(range: DateRangeValue): void {\n    this.dispatchEvent(new CustomEvent('igcRangeSelect', { detail: range }));\n  }\n\n  protected *_renderDateRanges() {\n    const ranges = this.usePredefinedRanges\n      ? [...this._predefinedRanges, ...this.customRanges]\n      : this.customRanges;\n\n    for (const { label, dateRange } of ranges) {\n      yield html`\n        <igc-chip @click=${() => this._handleRangeSelect(dateRange)}>\n          ${label}\n        </igc-chip>\n      `;\n    }\n  }\n\n  protected override render() {\n    return html`<div part=\"ranges\">${this._renderDateRanges()}</div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-predefined-ranges-area': IgcPredefinedRangesAreaComponent;\n  }\n}\n\ntype PredefinedRangeKey =\n  | 'last7Days'\n  | 'currentMonth'\n  | 'last30Days'\n  | 'yearToDate';\n\nfunction getPredefinedRanges(\n  resourceStrings: IgcDateRangePickerResourceStrings\n): CustomDateRange[] {\n  const today = CalendarDay.today;\n\n  const ranges: {\n    key: PredefinedRangeKey;\n    getDateRange: () => { start: Date; end: Date };\n  }[] = [\n    {\n      key: 'last7Days',\n      getDateRange: () => ({\n        start: today.add('day', -7).native,\n        end: today.native,\n      }),\n    },\n    {\n      key: 'currentMonth',\n      getDateRange: () => ({\n        start: today.set({ date: 1 }).native,\n        end: today.set({ date: 1 }).add('month', 1).add('day', -1).native,\n      }),\n    },\n    {\n      key: 'last30Days',\n      getDateRange: () => ({\n        start: today.add('day', -29).native,\n        end: today.native,\n      }),\n    },\n    {\n      key: 'yearToDate',\n      getDateRange: () => ({\n        start: today.set({ year: today.year, month: 0, date: 1 }).native,\n        end: today.native,\n      }),\n    },\n  ];\n\n  return ranges.map((range) => ({\n    label:\n      resourceStrings[range.key] ||\n      IgcDateRangePickerResourceStringsEN[range.key],\n    dateRange: range.getDateRange(),\n  }));\n}\n"]}
+{"version":3,"file":"predefined-ranges-area.js","sourceRoot":"","sources":["../../../src/components/date-range-picker/predefined-ranges-area.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport { CalendarDay } from '../calendar/model.js';\nimport IgcChipComponent from '../chip/chip.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport {\n  type IgcDateRangePickerResourceStrings,\n  IgcDateRangePickerResourceStringsEN,\n} from '../common/i18n/date-range-picker.resources.js';\nimport type { CustomDateRange, DateRangeValue } from './date-range-picker.js';\nimport { styles } from './predefined-ranges-area.base.css.js';\nimport { all } from './themes/ranges-themes.js';\nimport { styles as shared } from './themes/shared/predefined-ranges-area.common.css.js';\n\n/* blazorSuppress */\n/**\n * The predefined ranges area component is used within the `igc-date-range picker` element and it\n * displays a set of chips with predefined date ranges. The component allows users to quickly select\n * a predefined date range value. Users can also provide custom ranges to be displayed as chips.\n *\n * @element igc-predefined-ranges-area\n */\nexport default class IgcPredefinedRangesAreaComponent extends LitElement {\n  public static readonly tagName = 'igc-predefined-ranges-area';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcPredefinedRangesAreaComponent, IgcChipComponent);\n  }\n\n  @state()\n  private _predefinedRanges: CustomDateRange[] = [];\n\n  /**\n   * Whether the control will show chips with predefined ranges.\n   * @attr use-predefined-ranges\n   */\n  @property({\n    type: Boolean,\n    reflect: true,\n    attribute: 'use-predefined-ranges',\n  })\n  public usePredefinedRanges = false;\n\n  /**\n   * Renders chips with custom ranges based on the elements of the array.\n   */\n  @property({ attribute: false })\n  public customRanges: CustomDateRange[] = [];\n\n  /** The resource strings of the date range area component. */\n  @property({ attribute: false })\n  public resourceStrings: IgcDateRangePickerResourceStrings =\n    IgcDateRangePickerResourceStringsEN;\n\n  constructor() {\n    super();\n    addThemingController(this, all);\n  }\n\n  @watch('resourceStrings')\n  protected _updatePredefinedRanges(): void {\n    this._predefinedRanges = getPredefinedRanges(this.resourceStrings);\n  }\n\n  private _handleRangeSelect(range: DateRangeValue): void {\n    this.dispatchEvent(new CustomEvent('igcRangeSelect', { detail: range }));\n  }\n\n  protected *_renderDateRanges() {\n    const ranges = this.usePredefinedRanges\n      ? [...this._predefinedRanges, ...this.customRanges]\n      : this.customRanges;\n\n    for (const { label, dateRange } of ranges) {\n      yield html`\n        <igc-chip @click=${() => this._handleRangeSelect(dateRange)}>\n          ${label}\n        </igc-chip>\n      `;\n    }\n  }\n\n  protected override render() {\n    return html`<div part=\"ranges\">${this._renderDateRanges()}</div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-predefined-ranges-area': IgcPredefinedRangesAreaComponent;\n  }\n}\n\ntype PredefinedRangeKey =\n  | 'last7Days'\n  | 'currentMonth'\n  | 'last30Days'\n  | 'yearToDate';\n\nfunction getPredefinedRanges(\n  resourceStrings: IgcDateRangePickerResourceStrings\n): CustomDateRange[] {\n  const today = CalendarDay.today;\n\n  const ranges: {\n    key: PredefinedRangeKey;\n    getDateRange: () => { start: Date; end: Date };\n  }[] = [\n    {\n      key: 'last7Days',\n      getDateRange: () => ({\n        start: today.add('day', -7).native,\n        end: today.native,\n      }),\n    },\n    {\n      key: 'currentMonth',\n      getDateRange: () => ({\n        start: today.set({ date: 1 }).native,\n        end: today.set({ date: 1 }).add('month', 1).add('day', -1).native,\n      }),\n    },\n    {\n      key: 'last30Days',\n      getDateRange: () => ({\n        start: today.add('day', -29).native,\n        end: today.native,\n      }),\n    },\n    {\n      key: 'yearToDate',\n      getDateRange: () => ({\n        start: today.set({ year: today.year, month: 0, date: 1 }).native,\n        end: today.native,\n      }),\n    },\n  ];\n\n  return ranges.map((range) => ({\n    label:\n      resourceStrings[range.key] ||\n      IgcDateRangePickerResourceStringsEN[range.key],\n    dateRange: range.getDateRange(),\n  }));\n}\n"]}

package/components/dialog/dialog.d.ts

@@ -70,6 +70,7 @@ export default class IgcDialogComponent extends IgcDialogComponent_base {
     /** Sets the return value for the dialog. */
     returnValue: string;
     protected handleOpenState(): void;
+    constructor();
     protected createRenderRoot(): HTMLElement | DocumentFragment;
     protected firstUpdated(): void;
     private toggleAnimation;

package/components/dialog/dialog.js

@@ -11,7 +11,7 @@ import { ifDefined } from 'lit/directives/if-defined.js';
 import { createRef, ref } from 'lit/directives/ref.js';
 import { addAnimationController } from '../../animations/player.js';
 import { fadeIn, fadeOut } from '../../animations/presets/fade/index.js';
-import { themes } from '../../theming/theming-decorator.js';
+import { addThemingController } from '../../theming/theming-controller.js';
 import IgcButtonComponent from '../button/button.js';
 import { blazorAdditionalDependencies } from '../common/decorators/blazorAdditionalDependencies.js';
 import { watch } from '../common/decorators/watch.js';
@@ -23,8 +23,17 @@ import { styles } from './themes/dialog.base.css.js';
 import { styles as shared } from './themes/shared/dialog.common.css.js';
 import { all } from './themes/themes.js';
 let IgcDialogComponent = IgcDialogComponent_1 = class IgcDialogComponent extends EventEmitterMixin(LitElement) {
+    static register() {
+        registerComponent(IgcDialogComponent_1, IgcButtonComponent);
+    }
+    get dialog() {
+        return this.dialogRef.value;
+    }
+    handleOpenState() {
+        this.open ? this.dialog.showModal() : this.dialog.close();
+    }
     constructor() {
-        super(...arguments);
+        super();
         this.titleId = `title-${IgcDialogComponent_1.increment()}`;
         this.dialogRef = createRef();
         this.animationPlayer = addAnimationController(this, this.dialogRef);
@@ -41,15 +50,7 @@ let IgcDialogComponent = IgcDialogComponent_1 = class IgcDialogComponent extends
                 this._hide(true);
             }
         };
-    }
-    static register() {
-        registerComponent(IgcDialogComponent_1, IgcButtonComponent);
-    }
-    get dialog() {
-        return this.dialogRef.value;
-    }
-    handleOpenState() {
-        this.open ? this.dialog.showModal() : this.dialog.close();
+        addThemingController(this, all);
     }
     createRenderRoot() {
         const root = super.createRenderRoot();
@@ -203,7 +204,6 @@ __decorate([
     watch('open', { waitUntilFirstUpdate: true })
 ], IgcDialogComponent.prototype, "handleOpenState", null);
 IgcDialogComponent = IgcDialogComponent_1 = __decorate([
-    themes(all),
     blazorAdditionalDependencies('IgcButtonComponent')
 ], IgcDialogComponent);
 export default IgcDialogComponent;

package/components/dialog/dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../../src/components/dialog/dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, queryAssignedElements, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { createRef, type Ref, ref } from 'lit/directives/ref.js';\n\nimport { addAnimationController } from '../../animations/player.js';\nimport { fadeIn, fadeOut } from '../../animations/presets/fade/index.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport IgcButtonComponent from '../button/button.js';\nimport { blazorAdditionalDependencies } from '../common/decorators/blazorAdditionalDependencies.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { partMap } from '../common/part-map.js';\nimport {\n  createCounter,\n  isEmpty,\n  numberInRangeInclusive,\n} from '../common/util.js';\nimport { styles } from './themes/dialog.base.css.js';\nimport { styles as shared } from './themes/shared/dialog.common.css.js';\nimport { all } from './themes/themes.js';\n\nexport interface IgcDialogComponentEventMap {\n  igcClosing: CustomEvent<void>;\n  igcClosed: CustomEvent<void>;\n}\n\n/**\n * Represents a Dialog component.\n *\n * @element igc-dialog\n *\n * @fires igcClosing - Emitter just before the dialog is closed.\n * @fires igcClosed - Emitted after closing the dialog.\n *\n * @slot - Renders content inside the default slot.\n * @slot title - Renders the title of the dialog header.\n * @slot message - Renders the message content of the dialog.\n * @slot footer - Renders the dialog footer.\n *\n * @csspart base - The base wrapper of the dialog.\n * @csspart title - The title container.\n * @csspart footer - The footer container.\n * @csspart overlay - The overlay.\n */\n@themes(all)\n@blazorAdditionalDependencies('IgcButtonComponent')\nexport default class IgcDialogComponent extends EventEmitterMixin<\n  IgcDialogComponentEventMap,\n  Constructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-dialog';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register() {\n    registerComponent(IgcDialogComponent, IgcButtonComponent);\n  }\n\n  private static readonly increment = createCounter();\n  private titleId = `title-${IgcDialogComponent.increment()}`;\n\n  private dialogRef: Ref<HTMLDialogElement> = createRef();\n  private animationPlayer = addAnimationController(this, this.dialogRef);\n\n  /**\n   * Backdrop animation helper.\n   */\n  @state()\n  private animating = false;\n\n  private get dialog() {\n    return this.dialogRef.value!;\n  }\n\n  @queryAssignedElements({ slot: 'title' })\n  private titleElements!: Array<HTMLElement>;\n\n  @queryAssignedElements({ slot: 'message' })\n  private messageElements!: Array<HTMLElement>;\n\n  @queryAssignedElements({ slot: 'footer' })\n  private footerElements!: Array<HTMLElement>;\n\n  /**\n   * Whether the dialog should be kept open when pressing the 'ESCAPE' button.\n   * @attr keep-open-on-escape\n   */\n  @property({ type: Boolean, attribute: 'keep-open-on-escape' })\n  public keepOpenOnEscape = false;\n\n  /**\n   * Whether the dialog should be closed when clicking outside of it.\n   * @attr close-on-outside-click\n   */\n  @property({ type: Boolean, attribute: 'close-on-outside-click' })\n  public closeOnOutsideClick = false;\n\n  /**\n   * Whether to hide the default action button for the dialog.\n   *\n   * When there is projected content in the `footer` slot this property\n   * has no effect.\n   * @attr hide-default-action\n   */\n  @property({ type: Boolean, attribute: 'hide-default-action' })\n  public hideDefaultAction = false;\n\n  /**\n   * Whether the dialog is opened.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public open = false;\n\n  /**\n   * Sets the title of the dialog.\n   * @attr\n   */\n  @property()\n  public override title!: string;\n\n  /** Sets the return value for the dialog. */\n  @property({ attribute: false })\n  public returnValue!: string;\n\n  @watch('open', { waitUntilFirstUpdate: true })\n  protected handleOpenState() {\n    this.open ? this.dialog.showModal() : this.dialog.close();\n  }\n\n  protected override createRenderRoot() {\n    const root = super.createRenderRoot();\n    root.addEventListener('slotchange', () => this.requestUpdate());\n    return root;\n  }\n\n  protected override firstUpdated() {\n    if (this.open) {\n      this.dialog.showModal();\n    }\n  }\n\n  private async toggleAnimation(dir: 'open' | 'close') {\n    const animation = dir === 'open' ? fadeIn : fadeOut;\n\n    const [_, event] = await Promise.all([\n      this.animationPlayer.stopAll(),\n      this.animationPlayer.play(animation()),\n    ]);\n\n    return event.type === 'finish';\n  }\n\n  private async _hide(emitEvent = false) {\n    if (!this.open || (emitEvent && !this.emitClosing())) {\n      return false;\n    }\n\n    this.animating = true;\n    await this.toggleAnimation('close');\n    this.open = false;\n    this.animating = false;\n\n    if (emitEvent) {\n      await this.updateComplete;\n      this.emitEvent('igcClosed');\n    }\n\n    return true;\n  }\n\n  /** Opens the dialog. */\n  public async show(): Promise<boolean> {\n    if (this.open) {\n      return false;\n    }\n\n    this.open = true;\n    await this.toggleAnimation('open');\n    return true;\n  }\n\n  /** Closes the dialog. */\n  public async hide(): Promise<boolean> {\n    return this._hide();\n  }\n\n  /** Toggles the open state of the dialog. */\n  public async toggle(): Promise<boolean> {\n    return this.open ? this.hide() : this.show();\n  }\n\n  private handleCancel(event: Event) {\n    event.preventDefault();\n\n    if (!this.keepOpenOnEscape) {\n      this._hide(true);\n    }\n  }\n\n  private handleClick({ clientX, clientY, target }: PointerEvent) {\n    if (this.closeOnOutsideClick && this.dialog === target) {\n      const rect = this.dialog.getBoundingClientRect();\n      const inX = numberInRangeInclusive(clientX, rect.left, rect.right);\n      const inY = numberInRangeInclusive(clientY, rect.top, rect.bottom);\n\n      if (!(inX && inY)) {\n        this._hide(true);\n      }\n    }\n  }\n\n  private emitClosing(): boolean {\n    return this.emitEvent('igcClosing', { cancelable: true });\n  }\n\n  protected formSubmitHandler = (e: SubmitEvent) => {\n    if (e.submitter) {\n      this.returnValue = (e.submitter as any)?.value ?? '';\n    }\n\n    if (!e.defaultPrevented) {\n      this._hide(true);\n    }\n  };\n\n  private handleContentChange() {\n    // Setup submit handling for forms\n    const forms = this.querySelectorAll<HTMLFormElement>(\n      'form[method=\"dialog\"]'\n    );\n\n    for (const form of forms) {\n      form.removeEventListener('submit', this.formSubmitHandler);\n      form.addEventListener('submit', this.formSubmitHandler);\n    }\n  }\n\n  protected override render() {\n    const label = this.ariaLabel ? this.ariaLabel : undefined;\n    const labelledBy = label ? undefined : this.titleId;\n    const backdropParts = {\n      backdrop: true,\n      animating: this.animating,\n    };\n    const baseParts = {\n      base: true,\n      titled: this.titleElements.length > 0 || !!this.title,\n      footed: this.footerElements.length > 0 || !this.hideDefaultAction,\n    };\n\n    return html`\n      <div part=${partMap(backdropParts)} aria-hidden=${!this.open}></div>\n      <dialog\n        ${ref(this.dialogRef)}\n        part=${partMap(baseParts)}\n        role=\"dialog\"\n        @click=${this.handleClick}\n        @cancel=${this.handleCancel}\n        aria-label=${ifDefined(label)}\n        aria-labelledby=${ifDefined(labelledBy)}\n      >\n        <header part=\"title\" id=${this.titleId}>\n          <slot name=\"title\"><span>${this.title}</span></slot>\n        </header>\n        <section part=\"content\">\n          <slot name=\"message\" .hidden=${isEmpty(this.messageElements)}></slot>\n          <slot @slotchange=${this.handleContentChange}></slot>\n        </section>\n        <footer part=\"footer\">\n          <slot name=\"footer\">\n            ${this.hideDefaultAction\n              ? nothing\n              : html`<igc-button variant=\"flat\" @click=${() => this._hide(true)}\n                  >OK</igc-button\n                >`}\n          </slot>\n        </footer>\n      </dialog>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-dialog': IgcDialogComponent;\n  }\n}\n"]}
+{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../../src/components/dialog/dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, queryAssignedElements, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { createRef, type Ref, ref } from 'lit/directives/ref.js';\n\nimport { addAnimationController } from '../../animations/player.js';\nimport { fadeIn, fadeOut } from '../../animations/presets/fade/index.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.js';\nimport { blazorAdditionalDependencies } from '../common/decorators/blazorAdditionalDependencies.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { partMap } from '../common/part-map.js';\nimport {\n  createCounter,\n  isEmpty,\n  numberInRangeInclusive,\n} from '../common/util.js';\nimport { styles } from './themes/dialog.base.css.js';\nimport { styles as shared } from './themes/shared/dialog.common.css.js';\nimport { all } from './themes/themes.js';\n\nexport interface IgcDialogComponentEventMap {\n  igcClosing: CustomEvent<void>;\n  igcClosed: CustomEvent<void>;\n}\n\n/**\n * Represents a Dialog component.\n *\n * @element igc-dialog\n *\n * @fires igcClosing - Emitter just before the dialog is closed.\n * @fires igcClosed - Emitted after closing the dialog.\n *\n * @slot - Renders content inside the default slot.\n * @slot title - Renders the title of the dialog header.\n * @slot message - Renders the message content of the dialog.\n * @slot footer - Renders the dialog footer.\n *\n * @csspart base - The base wrapper of the dialog.\n * @csspart title - The title container.\n * @csspart footer - The footer container.\n * @csspart overlay - The overlay.\n */\n@blazorAdditionalDependencies('IgcButtonComponent')\nexport default class IgcDialogComponent extends EventEmitterMixin<\n  IgcDialogComponentEventMap,\n  Constructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-dialog';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register() {\n    registerComponent(IgcDialogComponent, IgcButtonComponent);\n  }\n\n  private static readonly increment = createCounter();\n  private titleId = `title-${IgcDialogComponent.increment()}`;\n\n  private dialogRef: Ref<HTMLDialogElement> = createRef();\n  private animationPlayer = addAnimationController(this, this.dialogRef);\n\n  /**\n   * Backdrop animation helper.\n   */\n  @state()\n  private animating = false;\n\n  private get dialog() {\n    return this.dialogRef.value!;\n  }\n\n  @queryAssignedElements({ slot: 'title' })\n  private titleElements!: Array<HTMLElement>;\n\n  @queryAssignedElements({ slot: 'message' })\n  private messageElements!: Array<HTMLElement>;\n\n  @queryAssignedElements({ slot: 'footer' })\n  private footerElements!: Array<HTMLElement>;\n\n  /**\n   * Whether the dialog should be kept open when pressing the 'ESCAPE' button.\n   * @attr keep-open-on-escape\n   */\n  @property({ type: Boolean, attribute: 'keep-open-on-escape' })\n  public keepOpenOnEscape = false;\n\n  /**\n   * Whether the dialog should be closed when clicking outside of it.\n   * @attr close-on-outside-click\n   */\n  @property({ type: Boolean, attribute: 'close-on-outside-click' })\n  public closeOnOutsideClick = false;\n\n  /**\n   * Whether to hide the default action button for the dialog.\n   *\n   * When there is projected content in the `footer` slot this property\n   * has no effect.\n   * @attr hide-default-action\n   */\n  @property({ type: Boolean, attribute: 'hide-default-action' })\n  public hideDefaultAction = false;\n\n  /**\n   * Whether the dialog is opened.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public open = false;\n\n  /**\n   * Sets the title of the dialog.\n   * @attr\n   */\n  @property()\n  public override title!: string;\n\n  /** Sets the return value for the dialog. */\n  @property({ attribute: false })\n  public returnValue!: string;\n\n  @watch('open', { waitUntilFirstUpdate: true })\n  protected handleOpenState() {\n    this.open ? this.dialog.showModal() : this.dialog.close();\n  }\n\n  constructor() {\n    super();\n    addThemingController(this, all);\n  }\n\n  protected override createRenderRoot() {\n    const root = super.createRenderRoot();\n    root.addEventListener('slotchange', () => this.requestUpdate());\n    return root;\n  }\n\n  protected override firstUpdated() {\n    if (this.open) {\n      this.dialog.showModal();\n    }\n  }\n\n  private async toggleAnimation(dir: 'open' | 'close') {\n    const animation = dir === 'open' ? fadeIn : fadeOut;\n\n    const [_, event] = await Promise.all([\n      this.animationPlayer.stopAll(),\n      this.animationPlayer.play(animation()),\n    ]);\n\n    return event.type === 'finish';\n  }\n\n  private async _hide(emitEvent = false) {\n    if (!this.open || (emitEvent && !this.emitClosing())) {\n      return false;\n    }\n\n    this.animating = true;\n    await this.toggleAnimation('close');\n    this.open = false;\n    this.animating = false;\n\n    if (emitEvent) {\n      await this.updateComplete;\n      this.emitEvent('igcClosed');\n    }\n\n    return true;\n  }\n\n  /** Opens the dialog. */\n  public async show(): Promise<boolean> {\n    if (this.open) {\n      return false;\n    }\n\n    this.open = true;\n    await this.toggleAnimation('open');\n    return true;\n  }\n\n  /** Closes the dialog. */\n  public async hide(): Promise<boolean> {\n    return this._hide();\n  }\n\n  /** Toggles the open state of the dialog. */\n  public async toggle(): Promise<boolean> {\n    return this.open ? this.hide() : this.show();\n  }\n\n  private handleCancel(event: Event) {\n    event.preventDefault();\n\n    if (!this.keepOpenOnEscape) {\n      this._hide(true);\n    }\n  }\n\n  private handleClick({ clientX, clientY, target }: PointerEvent) {\n    if (this.closeOnOutsideClick && this.dialog === target) {\n      const rect = this.dialog.getBoundingClientRect();\n      const inX = numberInRangeInclusive(clientX, rect.left, rect.right);\n      const inY = numberInRangeInclusive(clientY, rect.top, rect.bottom);\n\n      if (!(inX && inY)) {\n        this._hide(true);\n      }\n    }\n  }\n\n  private emitClosing(): boolean {\n    return this.emitEvent('igcClosing', { cancelable: true });\n  }\n\n  protected formSubmitHandler = (e: SubmitEvent) => {\n    if (e.submitter) {\n      this.returnValue = (e.submitter as any)?.value ?? '';\n    }\n\n    if (!e.defaultPrevented) {\n      this._hide(true);\n    }\n  };\n\n  private handleContentChange() {\n    // Setup submit handling for forms\n    const forms = this.querySelectorAll<HTMLFormElement>(\n      'form[method=\"dialog\"]'\n    );\n\n    for (const form of forms) {\n      form.removeEventListener('submit', this.formSubmitHandler);\n      form.addEventListener('submit', this.formSubmitHandler);\n    }\n  }\n\n  protected override render() {\n    const label = this.ariaLabel ? this.ariaLabel : undefined;\n    const labelledBy = label ? undefined : this.titleId;\n    const backdropParts = {\n      backdrop: true,\n      animating: this.animating,\n    };\n    const baseParts = {\n      base: true,\n      titled: this.titleElements.length > 0 || !!this.title,\n      footed: this.footerElements.length > 0 || !this.hideDefaultAction,\n    };\n\n    return html`\n      <div part=${partMap(backdropParts)} aria-hidden=${!this.open}></div>\n      <dialog\n        ${ref(this.dialogRef)}\n        part=${partMap(baseParts)}\n        role=\"dialog\"\n        @click=${this.handleClick}\n        @cancel=${this.handleCancel}\n        aria-label=${ifDefined(label)}\n        aria-labelledby=${ifDefined(labelledBy)}\n      >\n        <header part=\"title\" id=${this.titleId}>\n          <slot name=\"title\"><span>${this.title}</span></slot>\n        </header>\n        <section part=\"content\">\n          <slot name=\"message\" .hidden=${isEmpty(this.messageElements)}></slot>\n          <slot @slotchange=${this.handleContentChange}></slot>\n        </section>\n        <footer part=\"footer\">\n          <slot name=\"footer\">\n            ${this.hideDefaultAction\n              ? nothing\n              : html`<igc-button variant=\"flat\" @click=${() => this._hide(true)}\n                  >OK</igc-button\n                >`}\n          </slot>\n        </footer>\n      </dialog>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-dialog': IgcDialogComponent;\n  }\n}\n"]}

package/components/divider/divider.d.ts

@@ -34,6 +34,7 @@ export default class IgcDividerComponent extends LitElement {
      * @default 'solid'
      */
     type: DividerType;
+    constructor();
     protected render(): import("lit-html").TemplateResult<1>;
 }
 declare global {

package/components/divider/divider.js

@@ -4,30 +4,17 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-var IgcDividerComponent_1;
 import { html, LitElement } from 'lit';
 import { property } from 'lit/decorators.js';
-import { themes } from '../../theming/theming-decorator.js';
+import { addThemingController } from '../../theming/theming-controller.js';
 import { addInternalsController } from '../common/controllers/internals.js';
 import { registerComponent } from '../common/definitions/register.js';
 import { styles } from './themes/divider.base.css.js';
 import { styles as shared } from './themes/shared/divider.common.css.js';
 import { all } from './themes/themes.js';
-let IgcDividerComponent = IgcDividerComponent_1 = class IgcDividerComponent extends LitElement {
-    constructor() {
-        super(...arguments);
-        this._internals = addInternalsController(this, {
-            initialARIA: {
-                role: 'separator',
-                ariaOrientation: 'vertical',
-            },
-        });
-        this._vertical = false;
-        this.middle = false;
-        this.type = 'solid';
-    }
+class IgcDividerComponent extends LitElement {
     static register() {
-        registerComponent(IgcDividerComponent_1);
+        registerComponent(IgcDividerComponent);
     }
     set vertical(value) {
         this._vertical = Boolean(value);
@@ -38,12 +25,26 @@ let IgcDividerComponent = IgcDividerComponent_1 = class IgcDividerComponent exte
     get vertical() {
         return this._vertical;
     }
+    constructor() {
+        super();
+        this._internals = addInternalsController(this, {
+            initialARIA: {
+                role: 'separator',
+                ariaOrientation: 'vertical',
+            },
+        });
+        this._vertical = false;
+        this.middle = false;
+        this.type = 'solid';
+        addThemingController(this, all);
+    }
     render() {
         return html ``;
     }
-};
+}
 IgcDividerComponent.tagName = 'igc-divider';
 IgcDividerComponent.styles = [styles, shared];
+export default IgcDividerComponent;
 __decorate([
     property({ type: Boolean, reflect: true })
 ], IgcDividerComponent.prototype, "vertical", null);
@@ -53,8 +54,4 @@ __decorate([
 __decorate([
     property({ reflect: true })
 ], IgcDividerComponent.prototype, "type", void 0);
-IgcDividerComponent = IgcDividerComponent_1 = __decorate([
-    themes(all)
-], IgcDividerComponent);
-export default IgcDividerComponent;
 //# sourceMappingURL=divider.js.map

package/components/divider/divider.js.map

@@ -1 +1 @@
-{"version":3,"file":"divider.js","sourceRoot":"","sources":["../../../src/components/divider/divider.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,sBAAsB,EAAE,MAAM,oCAAoC,CAAC;AAC5E,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AAEtE,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AACtD,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,uCAAuC,CAAC;AACzE,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AAY1B,IAAM,mBAAmB,2BAAzB,MAAM,mBAAoB,SAAQ,UAAU;IAA5C;;QASI,eAAU,GAAG,sBAAsB,CAAC,IAAI,EAAE;YACzD,WAAW,EAAE;gBACX,IAAI,EAAE,WAAW;gBACjB,eAAe,EAAE,UAAU;aAC5B;SACF,CAAC,CAAC;QAEK,cAAS,GAAG,KAAK,CAAC;QAyBnB,WAAM,GAAG,KAAK,CAAC;QASf,SAAI,GAAgB,OAAO,CAAC;IAKrC,CAAC;IAlDQ,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,qBAAmB,CAAC,CAAC;IACzC,CAAC;IAiBD,IAAW,QAAQ,CAAC,KAAc;QAChC,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;QAChC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC;YACtB,eAAe,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY;SAC5D,CAAC,CAAC;IACL,CAAC;IAED,IAAW,QAAQ;QACjB,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IAmBkB,MAAM;QACvB,OAAO,IAAI,CAAA,EAAE,CAAC;IAChB,CAAC;;AArDsB,2BAAO,GAAG,aAAa,AAAhB,CAAiB;AACxB,0BAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;AAsBjD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDAM1C;AAYM;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDACrB;AASf;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDACO;AAlDhB,mBAAmB;IADvC,MAAM,CAAC,GAAG,CAAC;GACS,mBAAmB,CAuDvC;eAvDoB,mBAAmB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { addInternalsController } from '../common/controllers/internals.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { DividerType } from '../types.js';\nimport { styles } from './themes/divider.base.css.js';\nimport { styles as shared } from './themes/shared/divider.common.css.js';\nimport { all } from './themes/themes.js';\n\n/**\n * The igc-divider allows the content author to easily create a horizontal/vertical rule as a break between content to better organize information on a page.\n *\n * @element igc-divider\n *\n * @cssproperty --color - Sets the color of the divider.\n * @cssproperty --inset - Shrinks the divider by the given amount from the start. If `middle` is set it will shrink from both sides.\n *\n */\n@themes(all)\nexport default class IgcDividerComponent extends LitElement {\n  public static readonly tagName = 'igc-divider';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcDividerComponent);\n  }\n\n  private readonly _internals = addInternalsController(this, {\n    initialARIA: {\n      role: 'separator',\n      ariaOrientation: 'vertical',\n    },\n  });\n\n  private _vertical = false;\n\n  /**\n   * Whether to render a vertical divider line.\n   * @attr\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public set vertical(value: boolean) {\n    this._vertical = Boolean(value);\n    this._internals.setARIA({\n      ariaOrientation: this._vertical ? 'vertical' : 'horizontal',\n    });\n  }\n\n  public get vertical(): boolean {\n    return this._vertical;\n  }\n\n  /**\n   * When set and inset is provided, it will shrink the divider line from both sides.\n   * @attr\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public middle = false;\n\n  /* alternateName: lineType */\n  /**\n   * Whether to render a solid or a dashed divider line.\n   * @attr type\n   * @default 'solid'\n   */\n  @property({ reflect: true })\n  public type: DividerType = 'solid';\n\n  protected override render() {\n    return html``;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-divider': IgcDividerComponent;\n  }\n}\n"]}
+{"version":3,"file":"divider.js","sourceRoot":"","sources":["../../../src/components/divider/divider.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,EAAE,sBAAsB,EAAE,MAAM,oCAAoC,CAAC;AAC5E,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AAEtE,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AACtD,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,uCAAuC,CAAC;AACzE,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AAWzC,MAAqB,mBAAoB,SAAQ,UAAU;IAKlD,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,mBAAmB,CAAC,CAAC;IACzC,CAAC;IAiBD,IAAW,QAAQ,CAAC,KAAc;QAChC,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;QAChC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC;YACtB,eAAe,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY;SAC5D,CAAC,CAAC;IACL,CAAC;IAED,IAAW,QAAQ;QACjB,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IAmBD;QACE,KAAK,EAAE,CAAC;QA5CO,eAAU,GAAG,sBAAsB,CAAC,IAAI,EAAE;YACzD,WAAW,EAAE;gBACX,IAAI,EAAE,WAAW;gBACjB,eAAe,EAAE,UAAU;aAC5B;SACF,CAAC,CAAC;QAEK,cAAS,GAAG,KAAK,CAAC;QAyBnB,WAAM,GAAG,KAAK,CAAC;QASf,SAAI,GAAgB,OAAO,CAAC;QAIjC,oBAAoB,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;IAClC,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA,EAAE,CAAC;IAChB,CAAC;;AA1DsB,2BAAO,GAAG,aAAa,AAAhB,CAAiB;AACxB,0BAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;eAF9B,mBAAmB;AAwBtC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDAM1C;AAYM;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDACrB;AASf;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDACO","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport { addInternalsController } from '../common/controllers/internals.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { DividerType } from '../types.js';\nimport { styles } from './themes/divider.base.css.js';\nimport { styles as shared } from './themes/shared/divider.common.css.js';\nimport { all } from './themes/themes.js';\n\n/**\n * The igc-divider allows the content author to easily create a horizontal/vertical rule as a break between content to better organize information on a page.\n *\n * @element igc-divider\n *\n * @cssproperty --color - Sets the color of the divider.\n * @cssproperty --inset - Shrinks the divider by the given amount from the start. If `middle` is set it will shrink from both sides.\n *\n */\nexport default class IgcDividerComponent extends LitElement {\n  public static readonly tagName = 'igc-divider';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcDividerComponent);\n  }\n\n  private readonly _internals = addInternalsController(this, {\n    initialARIA: {\n      role: 'separator',\n      ariaOrientation: 'vertical',\n    },\n  });\n\n  private _vertical = false;\n\n  /**\n   * Whether to render a vertical divider line.\n   * @attr\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public set vertical(value: boolean) {\n    this._vertical = Boolean(value);\n    this._internals.setARIA({\n      ariaOrientation: this._vertical ? 'vertical' : 'horizontal',\n    });\n  }\n\n  public get vertical(): boolean {\n    return this._vertical;\n  }\n\n  /**\n   * When set and inset is provided, it will shrink the divider line from both sides.\n   * @attr\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public middle = false;\n\n  /* alternateName: lineType */\n  /**\n   * Whether to render a solid or a dashed divider line.\n   * @attr type\n   * @default 'solid'\n   */\n  @property({ reflect: true })\n  public type: DividerType = 'solid';\n\n  constructor() {\n    super();\n    addThemingController(this, all);\n  }\n\n  protected override render() {\n    return html``;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-divider': IgcDividerComponent;\n  }\n}\n"]}

package/components/dropdown/dropdown-group.js

@@ -4,22 +4,22 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-var IgcDropdownGroupComponent_1;
 import { html, LitElement } from 'lit';
 import { queryAssignedElements } from 'lit/decorators.js';
-import { themes } from '../../theming/theming-decorator.js';
+import { addThemingController } from '../../theming/theming-controller.js';
 import { addInternalsController } from '../common/controllers/internals.js';
 import { registerComponent } from '../common/definitions/register.js';
 import IgcDropdownItemComponent from './dropdown-item.js';
 import { styles } from './themes/dropdown-group.base.css.js';
 import { all } from './themes/group.js';
 import { styles as shared } from './themes/shared/group/dropdown-group.common.css.js';
-let IgcDropdownGroupComponent = IgcDropdownGroupComponent_1 = class IgcDropdownGroupComponent extends LitElement {
+class IgcDropdownGroupComponent extends LitElement {
     static register() {
-        registerComponent(IgcDropdownGroupComponent_1);
+        registerComponent(IgcDropdownGroupComponent);
     }
     constructor() {
         super();
+        addThemingController(this, all);
         addInternalsController(this, {
             initialARIA: {
                 role: 'group',
@@ -34,17 +34,14 @@ let IgcDropdownGroupComponent = IgcDropdownGroupComponent_1 = class IgcDropdownG
       <slot></slot>
     `;
     }
-};
+}
 IgcDropdownGroupComponent.tagName = 'igc-dropdown-group';
 IgcDropdownGroupComponent.styles = [styles, shared];
+export default IgcDropdownGroupComponent;
 __decorate([
     queryAssignedElements({
         flatten: true,
         selector: IgcDropdownItemComponent.tagName,
     })
 ], IgcDropdownGroupComponent.prototype, "items", void 0);
-IgcDropdownGroupComponent = IgcDropdownGroupComponent_1 = __decorate([
-    themes(all)
-], IgcDropdownGroupComponent);
-export default IgcDropdownGroupComponent;
 //# sourceMappingURL=dropdown-group.js.map

package/components/dropdown/dropdown-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-group.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown-group.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAE1D,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,sBAAsB,EAAE,MAAM,oCAAoC,CAAC;AAC5E,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,wBAAwB,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,qCAAqC,CAAC;AAC7D,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,oDAAoD,CAAC;AAavE,IAAM,yBAAyB,iCAA/B,MAAM,yBAA0B,SAAQ,UAAU;IAKxD,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,2BAAyB,CAAC,CAAC;IAC/C,CAAC;IAUD;QACE,KAAK,EAAE,CAAC;QAER,sBAAsB,CAAC,IAAI,EAAE;YAC3B,WAAW,EAAE;gBACX,IAAI,EAAE,OAAO;aACd;SACF,CAAC,CAAC;IACL,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;;KAKV,CAAC;IACJ,CAAC;;AAjCsB,iCAAO,GAAW,oBAAoB,AAA/B,CAAgC;AACvC,gCAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;AAa1C;IAJN,qBAAqB,CAAC;QACrB,OAAO,EAAE,IAAI;QACb,QAAQ,EAAE,wBAAwB,CAAC,OAAO;KAC3C,CAAC;wDAC6C;AAf5B,yBAAyB;IAD7C,MAAM,CAAC,GAAG,CAAC;GACS,yBAAyB,CAmC7C;eAnCoB,yBAAyB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { queryAssignedElements } from 'lit/decorators.js';\n\nimport { themes } from '../../theming/theming-decorator.js';\nimport { addInternalsController } from '../common/controllers/internals.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport IgcDropdownItemComponent from './dropdown-item.js';\nimport { styles } from './themes/dropdown-group.base.css.js';\nimport { all } from './themes/group.js';\nimport { styles as shared } from './themes/shared/group/dropdown-group.common.css.js';\n\n/**\n * A container for a group of `igc-dropdown-item` components.\n *\n * @element igc-dropdown-group\n *\n * @slot label - Contains the group's label.\n * @slot - Intended to contain the items belonging to this group.\n *\n * @csspart label - The native label element.\n */\n@themes(all)\nexport default class IgcDropdownGroupComponent extends LitElement {\n  public static readonly tagName: string = 'igc-dropdown-group';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcDropdownGroupComponent);\n  }\n\n  /* blazorSuppress */\n  /** All child `igc-dropdown-item`s. */\n  @queryAssignedElements({\n    flatten: true,\n    selector: IgcDropdownItemComponent.tagName,\n  })\n  public items!: Array<IgcDropdownItemComponent>;\n\n  constructor() {\n    super();\n\n    addInternalsController(this, {\n      initialARIA: {\n        role: 'group',\n      },\n    });\n  }\n\n  protected override render() {\n    return html`\n      <label part=\"label\">\n        <slot name=\"label\"></slot>\n      </label>\n      <slot></slot>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-dropdown-group': IgcDropdownGroupComponent;\n  }\n}\n"]}
+{"version":3,"file":"dropdown-group.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown-group.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAE1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,EAAE,sBAAsB,EAAE,MAAM,oCAAoC,CAAC;AAC5E,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,wBAAwB,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,qCAAqC,CAAC;AAC7D,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,oDAAoD,CAAC;AAYtF,MAAqB,yBAA0B,SAAQ,UAAU;IAKxD,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,yBAAyB,CAAC,CAAC;IAC/C,CAAC;IAUD;QACE,KAAK,EAAE,CAAC;QAER,oBAAoB,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;QAEhC,sBAAsB,CAAC,IAAI,EAAE;YAC3B,WAAW,EAAE;gBACX,IAAI,EAAE,OAAO;aACd;SACF,CAAC,CAAC;IACL,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;;KAKV,CAAC;IACJ,CAAC;;AAnCsB,iCAAO,GAAW,oBAAoB,CAAC;AACvC,gCAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;eAF9B,yBAAyB;AAerC;IAJN,qBAAqB,CAAC;QACrB,OAAO,EAAE,IAAI;QACb,QAAQ,EAAE,wBAAwB,CAAC,OAAO;KAC3C,CAAC;wDAC6C","sourcesContent":["import { html, LitElement } from 'lit';\nimport { queryAssignedElements } from 'lit/decorators.js';\n\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport { addInternalsController } from '../common/controllers/internals.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport IgcDropdownItemComponent from './dropdown-item.js';\nimport { styles } from './themes/dropdown-group.base.css.js';\nimport { all } from './themes/group.js';\nimport { styles as shared } from './themes/shared/group/dropdown-group.common.css.js';\n\n/**\n * A container for a group of `igc-dropdown-item` components.\n *\n * @element igc-dropdown-group\n *\n * @slot label - Contains the group's label.\n * @slot - Intended to contain the items belonging to this group.\n *\n * @csspart label - The native label element.\n */\nexport default class IgcDropdownGroupComponent extends LitElement {\n  public static readonly tagName: string = 'igc-dropdown-group';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcDropdownGroupComponent);\n  }\n\n  /* blazorSuppress */\n  /** All child `igc-dropdown-item`s. */\n  @queryAssignedElements({\n    flatten: true,\n    selector: IgcDropdownItemComponent.tagName,\n  })\n  public items!: Array<IgcDropdownItemComponent>;\n\n  constructor() {\n    super();\n\n    addThemingController(this, all);\n\n    addInternalsController(this, {\n      initialARIA: {\n        role: 'group',\n      },\n    });\n  }\n\n  protected override render() {\n    return html`\n      <label part=\"label\">\n        <slot name=\"label\"></slot>\n      </label>\n      <slot></slot>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-dropdown-group': IgcDropdownGroupComponent;\n  }\n}\n"]}

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

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

package/components/dropdown/dropdown-header.js

@@ -1,28 +1,22 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var IgcDropdownHeaderComponent_1;
 import { html, LitElement } from 'lit';
-import { themes } from '../../theming/theming-decorator.js';
+import { addThemingController } from '../../theming/theming-controller.js';
 import { registerComponent } from '../common/definitions/register.js';
 import { styles } from './themes/dropdown-header.base.css.js';
 import { all } from './themes/header.js';
 import { styles as shared } from './themes/shared/header/dropdown-header.common.css.js';
-let IgcDropdownHeaderComponent = IgcDropdownHeaderComponent_1 = class IgcDropdownHeaderComponent extends LitElement {
+class IgcDropdownHeaderComponent extends LitElement {
     static register() {
-        registerComponent(IgcDropdownHeaderComponent_1);
+        registerComponent(IgcDropdownHeaderComponent);
+    }
+    constructor() {
+        super();
+        addThemingController(this, all);
     }
     render() {
         return html `<slot></slot>`;
     }
-};
+}
 IgcDropdownHeaderComponent.tagName = 'igc-dropdown-header';
 IgcDropdownHeaderComponent.styles = [styles, shared];
-IgcDropdownHeaderComponent = IgcDropdownHeaderComponent_1 = __decorate([
-    themes(all)
-], IgcDropdownHeaderComponent);
 export default IgcDropdownHeaderComponent;
 //# sourceMappingURL=dropdown-header.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"dropdown-header.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown-header.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEvC,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AACzC,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,sDAAsD,CAAC;AAUzE,IAAM,0BAA0B,kCAAhC,MAAM,0BAA2B,SAAQ,UAAU;IAKzD,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,4BAA0B,CAAC,CAAC;IAChD,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AAVsB,kCAAO,GAAW,qBAAqB,AAAhC,CAAiC;AACxC,iCAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;AAF9B,0BAA0B;IAD9C,MAAM,CAAC,GAAG,CAAC;GACS,0BAA0B,CAY9C;eAZoB,0BAA0B","sourcesContent":["import { html, LitElement } from 'lit';\n\nimport { themes } from '../../theming/theming-decorator.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { styles } from './themes/dropdown-header.base.css.js';\nimport { all } from './themes/header.js';\nimport { styles as shared } from './themes/shared/header/dropdown-header.common.css.js';\n\n/**\n * Represents a header item in a igc-dropdown list.\n *\n * @element igc-dropdown-header\n *\n * @slot - Renders the header.\n */\n@themes(all)\nexport default class IgcDropdownHeaderComponent extends LitElement {\n  public static readonly tagName: string = 'igc-dropdown-header';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register() {\n    registerComponent(IgcDropdownHeaderComponent);\n  }\n\n  protected override render() {\n    return html`<slot></slot>`;\n  }\n}\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-dropdown-header': IgcDropdownHeaderComponent;\n  }\n}\n"]}
+{"version":3,"file":"dropdown-header.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown-header.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEvC,OAAO,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AACzC,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,sDAAsD,CAAC;AASxF,MAAqB,0BAA2B,SAAQ,UAAU;IAKzD,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,0BAA0B,CAAC,CAAC;IAChD,CAAC;IAED;QACE,KAAK,EAAE,CAAC;QACR,oBAAoB,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;IAClC,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AAfsB,kCAAO,GAAW,qBAAqB,CAAC;AACxC,iCAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;eAF9B,0BAA0B","sourcesContent":["import { html, LitElement } from 'lit';\n\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { styles } from './themes/dropdown-header.base.css.js';\nimport { all } from './themes/header.js';\nimport { styles as shared } from './themes/shared/header/dropdown-header.common.css.js';\n\n/**\n * Represents a header item in a igc-dropdown list.\n *\n * @element igc-dropdown-header\n *\n * @slot - Renders the header.\n */\nexport default class IgcDropdownHeaderComponent extends LitElement {\n  public static readonly tagName: string = 'igc-dropdown-header';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcDropdownHeaderComponent);\n  }\n\n  constructor() {\n    super();\n    addThemingController(this, all);\n  }\n\n  protected override render() {\n    return html`<slot></slot>`;\n  }\n}\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-dropdown-header': IgcDropdownHeaderComponent;\n  }\n}\n"]}

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

@@ -16,6 +16,7 @@ export default class IgcDropdownItemComponent extends IgcBaseOptionLikeComponent
     static readonly tagName = "igc-dropdown-item";
     static styles: import("lit").CSSResult[];
     static register(): void;
+    constructor();
 }
 declare global {
     interface HTMLElementTagNameMap {

package/components/dropdown/dropdown-item.js

@@ -1,25 +1,19 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var IgcDropdownItemComponent_1;
-import { themes } from '../../theming/theming-decorator.js';
+import { addThemingController } from '../../theming/theming-controller.js';
 import { registerComponent } from '../common/definitions/register.js';
 import { IgcBaseOptionLikeComponent } from '../common/mixins/option.js';
 import { styles } from './themes/dropdown-item.base.css.js';
 import { all } from './themes/item.js';
 import { styles as shared } from './themes/shared/item/dropdown-item.common.css.js';
-let IgcDropdownItemComponent = IgcDropdownItemComponent_1 = class IgcDropdownItemComponent extends IgcBaseOptionLikeComponent {
+class IgcDropdownItemComponent extends IgcBaseOptionLikeComponent {
     static register() {
-        registerComponent(IgcDropdownItemComponent_1);
+        registerComponent(IgcDropdownItemComponent);
     }
-};
+    constructor() {
+        super();
+        addThemingController(this, all);
+    }
+}
 IgcDropdownItemComponent.tagName = 'igc-dropdown-item';
 IgcDropdownItemComponent.styles = [styles, shared];
-IgcDropdownItemComponent = IgcDropdownItemComponent_1 = __decorate([
-    themes(all)
-], IgcDropdownItemComponent);
 export default IgcDropdownItemComponent;
 //# sourceMappingURL=dropdown-item.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"dropdown-item.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown-item.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAC;AACxE,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACvC,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,kDAAkD,CAAC;AAgBrE,IAAM,wBAAwB,gCAA9B,MAAM,wBAAyB,SAAQ,0BAA0B;IAKvE,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,0BAAwB,CAAC,CAAC;IAC9C,CAAC;;AANsB,gCAAO,GAAG,mBAAmB,AAAtB,CAAuB;AAC9B,+BAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;AAF9B,wBAAwB;IAD5C,MAAM,CAAC,GAAG,CAAC;GACS,wBAAwB,CAQ5C;eARoB,wBAAwB","sourcesContent":["import { themes } from '../../theming/theming-decorator.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { IgcBaseOptionLikeComponent } from '../common/mixins/option.js';\nimport { styles } from './themes/dropdown-item.base.css.js';\nimport { all } from './themes/item.js';\nimport { styles as shared } from './themes/shared/item/dropdown-item.common.css.js';\n\n/**\n * Represents an item in a dropdown list.\n *\n * @element igc-dropdown-item\n *\n * @slot prefix - Renders content before the item's main content.\n * @slot - Renders the item's main content.\n * @slot suffix - Renders content after the item's main content.\n *\n * @csspart prefix - The prefix wrapper of the igc-dropdown-item.\n * @csspart content - The main content wrapper of the igc-dropdown-item.\n * @csspart suffix - The suffix wrapper of the igc-dropdown-item.\n */\n@themes(all)\nexport default class IgcDropdownItemComponent extends IgcBaseOptionLikeComponent {\n  public static readonly tagName = 'igc-dropdown-item';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register() {\n    registerComponent(IgcDropdownItemComponent);\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-dropdown-item': IgcDropdownItemComponent;\n  }\n}\n"]}
+{"version":3,"file":"dropdown-item.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAC;AACxE,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACvC,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,kDAAkD,CAAC;AAepF,MAAqB,wBAAyB,SAAQ,0BAA0B;IAKvE,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,wBAAwB,CAAC,CAAC;IAC9C,CAAC;IAED;QACE,KAAK,EAAE,CAAC;QACR,oBAAoB,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;IAClC,CAAC;;AAXsB,gCAAO,GAAG,mBAAmB,CAAC;AAC9B,+BAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;eAF9B,wBAAwB","sourcesContent":["import { addThemingController } from '../../theming/theming-controller.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { IgcBaseOptionLikeComponent } from '../common/mixins/option.js';\nimport { styles } from './themes/dropdown-item.base.css.js';\nimport { all } from './themes/item.js';\nimport { styles as shared } from './themes/shared/item/dropdown-item.common.css.js';\n\n/**\n * Represents an item in a dropdown list.\n *\n * @element igc-dropdown-item\n *\n * @slot prefix - Renders content before the item's main content.\n * @slot - Renders the item's main content.\n * @slot suffix - Renders content after the item's main content.\n *\n * @csspart prefix - The prefix wrapper of the igc-dropdown-item.\n * @csspart content - The main content wrapper of the igc-dropdown-item.\n * @csspart suffix - The suffix wrapper of the igc-dropdown-item.\n */\nexport default class IgcDropdownItemComponent extends IgcBaseOptionLikeComponent {\n  public static readonly tagName = 'igc-dropdown-item';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcDropdownItemComponent);\n  }\n\n  constructor() {\n    super();\n    addThemingController(this, all);\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-dropdown-item': IgcDropdownItemComponent;\n  }\n}\n"]}

package/components/dropdown/dropdown.js

@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var IgcDropdownComponent_1;
 import { html } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
-import { themes } from '../../theming/theming-decorator.js';
+import { addThemingController } from '../../theming/theming-controller.js';
 import { addKeybindings, arrowDown, arrowLeft, arrowRight, arrowUp, endKey, enterKey, escapeKey, homeKey, tabKey, } from '../common/controllers/key-bindings.js';
 import { addRootClickController } from '../common/controllers/root-click.js';
 import { addRootScrollHandler } from '../common/controllers/root-scroll.js';
@@ -67,6 +67,7 @@ let IgcDropdownComponent = IgcDropdownComponent_1 = class IgcDropdownComponent e
         this.flip = false;
         this.distance = 0;
         this.sameWidth = false;
+        addThemingController(this, all);
         this._keyBindings = addKeybindings(this, {
             skip: () => !this.open,
             bindingDefaults: { preventDefault: true, triggers: ['keydownRepeat'] },
@@ -272,7 +273,6 @@ __decorate([
     watch('keepOpenOnOutsideClick', { waitUntilFirstUpdate: true })
 ], IgcDropdownComponent.prototype, "openStateChange", null);
 IgcDropdownComponent = IgcDropdownComponent_1 = __decorate([
-    themes(all),
     blazorAdditionalDependencies('IgcDropdownItemComponent, IgcDropdownHeaderComponent, IgcDropdownGroupComponent')
 ], IgcDropdownComponent);
 export default IgcDropdownComponent;