igniteui-webcomponents 7.2.4 → 7.3.0-beta.0

package/components/divider/divider.js

@@ -6,9 +6,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { html, LitElement } from 'lit';
 import { property } from 'lit/decorators.js';
-import { addThemingController } from '../../theming/theming-controller.js';
-import { addInternalsController } from '../common/controllers/internals.js';
-import { registerComponent } from '../common/definitions/register.js';
+import { addInternalsController } from '#internals/controllers/internals.js';
+import { registerComponent } from '#internals/definitions/register.js';
+import { addThemingController } from '#theming/theming-controller.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';

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,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,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,UAAU;aAClC,YAAO,GAAG,aAAa,AAAhB,CAAiB;aACxB,WAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;IAG1C,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;;AAnCD;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"]}
+{"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,sBAAsB,EAAE,MAAM,qCAAqC,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,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;AAYzC,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,UAAU;aAClC,YAAO,GAAG,aAAa,AAAhB,CAAiB;aACxB,WAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;IAG1C,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;;AAnCD;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 { addInternalsController } from '#internals/controllers/internals.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { addThemingController } from '#theming/theming-controller.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 divider allows the content author to easily create a horizontal/vertical\n * 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/divider/themes/themes.d.ts

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

package/components/divider/themes/themes.js.map

@@ -1 +1 @@
-{"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../../src/components/divider/themes/themes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAI1B,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAC1E,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,8BAA8B,CAAC;AACpE,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,8BAA8B,CAAC;AACpE,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAExE,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAC5E,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,+BAA+B,CAAC;AACtE,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,+BAA+B,CAAC;AACtE,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAC1E,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAEjE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,gCAAgC,CAAC;AAElE,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;IACD,SAAS,EAAE,GAAG,CAAA;MACV,cAAc;GACjB;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,aAAa;GAChB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,WAAW;GACd;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,WAAW;GACxB;CACF,CAAC;AAEF,MAAM,IAAI,GAAG;IACX,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;IACD,SAAS,EAAE,GAAG,CAAA;MACV,aAAa;GAChB;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,YAAY;GACf;IACD,MAAM,EAAE,GAAG,CAAA;MACP,UAAU;GACb;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,UAAU;GACvB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,GAAG,GAAW,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\nimport type { Themes } from '../../../theming/types.js';\n// Dark Overrides\nimport { styles as bootstrapDark } from './dark/divider.bootstrap.css.js';\nimport { styles as fluentDark } from './dark/divider.fluent.css.js';\nimport { styles as indigoDark } from './dark/divider.indigo.css.js';\nimport { styles as materialDark } from './dark/divider.material.css.js';\n// Light Overrides\nimport { styles as bootstrapLight } from './light/divider.bootstrap.css.js';\nimport { styles as fluentLight } from './light/divider.fluent.css.js';\nimport { styles as indigoLight } from './light/divider.indigo.css.js';\nimport { styles as materialLight } from './light/divider.material.css.js';\nimport { styles as shared } from './light/divider.shared.css.js';\n// Shared Styles\nimport { styles as indigo } from './shared/divider.indigo.css.js';\n\nconst light = {\n  shared: css`\n    ${shared}\n  `,\n  bootstrap: css`\n    ${bootstrapLight}\n  `,\n  material: css`\n    ${materialLight}\n  `,\n  fluent: css`\n    ${fluentLight}\n  `,\n  indigo: css`\n    ${indigo} ${indigoLight}\n  `,\n};\n\nconst dark = {\n  shared: css`\n    ${shared}\n  `,\n  bootstrap: css`\n    ${bootstrapDark}\n  `,\n  material: css`\n    ${materialDark}\n  `,\n  fluent: css`\n    ${fluentDark}\n  `,\n  indigo: css`\n    ${indigo} ${indigoDark}\n  `,\n};\n\nexport const all: Themes = { light, dark };\n"]}
+{"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../../src/components/divider/themes/themes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAI1B,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAC1E,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,8BAA8B,CAAC;AACpE,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,8BAA8B,CAAC;AACpE,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAExE,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAC5E,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,+BAA+B,CAAC;AACtE,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,+BAA+B,CAAC;AACtE,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAC1E,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAEjE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,gCAAgC,CAAC;AAElE,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;IACD,SAAS,EAAE,GAAG,CAAA;MACV,cAAc;GACjB;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,aAAa;GAChB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,WAAW;GACd;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,WAAW;GACxB;CACF,CAAC;AAEF,MAAM,IAAI,GAAG;IACX,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;IACD,SAAS,EAAE,GAAG,CAAA;MACV,aAAa;GAChB;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,YAAY;GACf;IACD,MAAM,EAAE,GAAG,CAAA;MACP,UAAU;GACb;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,UAAU;GACvB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,GAAG,GAAW,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\nimport type { Themes } from '#theming/types.js';\n// Dark Overrides\nimport { styles as bootstrapDark } from './dark/divider.bootstrap.css.js';\nimport { styles as fluentDark } from './dark/divider.fluent.css.js';\nimport { styles as indigoDark } from './dark/divider.indigo.css.js';\nimport { styles as materialDark } from './dark/divider.material.css.js';\n// Light Overrides\nimport { styles as bootstrapLight } from './light/divider.bootstrap.css.js';\nimport { styles as fluentLight } from './light/divider.fluent.css.js';\nimport { styles as indigoLight } from './light/divider.indigo.css.js';\nimport { styles as materialLight } from './light/divider.material.css.js';\nimport { styles as shared } from './light/divider.shared.css.js';\n// Shared Styles\nimport { styles as indigo } from './shared/divider.indigo.css.js';\n\nconst light = {\n  shared: css`\n    ${shared}\n  `,\n  bootstrap: css`\n    ${bootstrapLight}\n  `,\n  material: css`\n    ${materialLight}\n  `,\n  fluent: css`\n    ${fluentLight}\n  `,\n  indigo: css`\n    ${indigo} ${indigoLight}\n  `,\n};\n\nconst dark = {\n  shared: css`\n    ${shared}\n  `,\n  bootstrap: css`\n    ${bootstrapDark}\n  `,\n  material: css`\n    ${materialDark}\n  `,\n  fluent: css`\n    ${fluentDark}\n  `,\n  indigo: css`\n    ${indigo} ${indigoDark}\n  `,\n};\n\nexport const all: Themes = { light, dark };\n"]}

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

@@ -1,7 +1,7 @@
 import { LitElement } from 'lit';
 import IgcDropdownItemComponent from './dropdown-item.js';
 /**
- * A container for a group of `igc-dropdown-item` components.
+ * A container for a group of dropdown items.
  *
  * @element igc-dropdown-group
  *
@@ -11,12 +11,19 @@ import IgcDropdownItemComponent from './dropdown-item.js';
  * @csspart label - The native label element.
  */
 export default class IgcDropdownGroupComponent extends LitElement {
-    static readonly tagName: string;
+    static readonly tagName = "igc-dropdown-group";
     static styles: import("lit").CSSResult[];
     static register(): void;
-    /** All child `igc-dropdown-item`s. */
+    private readonly _internals;
+    private readonly _slots;
+    /** All child dropdown items. */
     items: Array<IgcDropdownItemComponent>;
     constructor();
+    /**
+     * The label is rendered into this shadow root, out of reach of an
+     * `aria-labelledby` on the host, so its text names the `group` directly.
+     */
+    private _labelChange;
     protected render(): import("lit-html").TemplateResult<1>;
 }
 declare global {

package/components/dropdown/dropdown-group.js

@@ -6,13 +6,15 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { html, LitElement } from 'lit';
 import { queryAssignedElements } from 'lit/decorators.js';
-import { addThemingController } from '../../theming/theming-controller.js';
-import { addInternalsController } from '../common/controllers/internals.js';
-import { registerComponent } from '../common/definitions/register.js';
+import { addInternalsController } from '#internals/controllers/internals.js';
+import { addSlotController, setSlots } from '#internals/controllers/slot.js';
+import { registerComponent } from '#internals/definitions/register.js';
+import { addThemingController } from '#theming/theming-controller.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';
+const Slots = setSlots('label');
 export default class IgcDropdownGroupComponent extends LitElement {
     static { this.tagName = 'igc-dropdown-group'; }
     static { this.styles = [styles, shared]; }
@@ -21,12 +23,26 @@ export default class IgcDropdownGroupComponent extends LitElement {
     }
     constructor() {
         super();
-        addThemingController(this, all);
-        addInternalsController(this, {
+        this._internals = addInternalsController(this, {
             initialARIA: {
                 role: 'group',
             },
         });
+        this._slots = addSlotController(this, {
+            slots: Slots,
+            initial: true,
+            onChange: this._labelChange,
+        });
+        addThemingController(this, all);
+    }
+    _labelChange() {
+        const label = this._slots
+            .getAssignedNodes('label', true)
+            .map((node) => node.textContent ?? '')
+            .join('')
+            .trim()
+            .replace(/\s+/gu, ' ');
+        this._internals.setARIA({ ariaLabel: label || null });
     }
     render() {
         return html `

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,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,MAAM,CAAC,OAAO,OAAO,yBAA0B,SAAQ,UAAU;aACxC,YAAO,GAAW,oBAAoB,CAAC;aACvC,WAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAG1C,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;;AArBM;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"]}
+{"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;AAC1D,OAAO,EAAE,sBAAsB,EAAE,MAAM,qCAAqC,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,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;AAEtF,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC;AAYhC,MAAM,CAAC,OAAO,OAAO,yBAA0B,SAAQ,UAAU;aACxC,YAAO,GAAG,oBAAoB,AAAvB,CAAwB;aAC/B,WAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;IAG1C,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,yBAAyB,CAAC,CAAC;IAC/C,CAAC;IAsBD;QACE,KAAK,EAAE,CAAC;QArBO,eAAU,GAAG,sBAAsB,CAAC,IAAI,EAAE;YACzD,WAAW,EAAE;gBACX,IAAI,EAAE,OAAO;aACd;SACF,CAAC,CAAC;QAEc,WAAM,GAAG,iBAAiB,CAAC,IAAI,EAAE;YAChD,KAAK,EAAE,KAAK;YACZ,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI,CAAC,YAAY;SAC5B,CAAC,CAAC;QAaD,oBAAoB,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;IAClC,CAAC;IAMO,YAAY;QAClB,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM;aACtB,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC;aAC/B,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,IAAI,EAAE,CAAC;aACrC,IAAI,CAAC,EAAE,CAAC;aACR,IAAI,EAAE;aACN,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;QAEzB,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE,SAAS,EAAE,KAAK,IAAI,IAAI,EAAE,CAAC,CAAC;IACxD,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;;KAKV,CAAC;IACJ,CAAC;;AA9BM;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';\nimport { addInternalsController } from '#internals/controllers/internals.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { addThemingController } from '#theming/theming-controller.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\nconst Slots = setSlots('label');\n\n/**\n * A container for a group of dropdown items.\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 = 'igc-dropdown-group';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcDropdownGroupComponent);\n  }\n\n  private readonly _internals = addInternalsController(this, {\n    initialARIA: {\n      role: 'group',\n    },\n  });\n\n  private readonly _slots = addSlotController(this, {\n    slots: Slots,\n    initial: true,\n    onChange: this._labelChange,\n  });\n\n  /* blazorSuppress */\n  /** All child dropdown items. */\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\n  /**\n   * The label is rendered into this shadow root, out of reach of an\n   * `aria-labelledby` on the host, so its text names the `group` directly.\n   */\n  private _labelChange(): void {\n    const label = this._slots\n      .getAssignedNodes('label', true)\n      .map((node) => node.textContent ?? '')\n      .join('')\n      .trim()\n      .replace(/\\s+/gu, ' ');\n\n    this._internals.setARIA({ ariaLabel: label || null });\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

@@ -1,13 +1,13 @@
 import { LitElement } from 'lit';
 /**
- * Represents a header item in a igc-dropdown list.
+ * Represents a header item in a dropdown list.
  *
  * @element igc-dropdown-header
  *
  * @slot - Renders the header.
  */
 export default class IgcDropdownHeaderComponent extends LitElement {
-    static readonly tagName: string;
+    static readonly tagName = "igc-dropdown-header";
     static styles: import("lit").CSSResult[];
     static register(): void;
     constructor();

package/components/dropdown/dropdown-header.js

@@ -1,6 +1,7 @@
 import { html, LitElement } from 'lit';
-import { addThemingController } from '../../theming/theming-controller.js';
-import { registerComponent } from '../common/definitions/register.js';
+import { addInternalsController } from '#internals/controllers/internals.js';
+import { registerComponent } from '#internals/definitions/register.js';
+import { addThemingController } from '#theming/theming-controller.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';
@@ -12,6 +13,10 @@ export default class IgcDropdownHeaderComponent extends LitElement {
     }
     constructor() {
         super();
+        addInternalsController(this, {
+            initialARIA: { role: 'presentation' },
+            reflectRole: true,
+        });
         addThemingController(this, all);
     }
     render() {

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,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,MAAM,CAAC,OAAO,OAAO,0BAA2B,SAAQ,UAAU;aACzC,YAAO,GAAW,qBAAqB,CAAC;aACxC,WAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAG1C,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","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"]}
+{"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;AACvC,OAAO,EAAE,sBAAsB,EAAE,MAAM,qCAAqC,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,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,MAAM,CAAC,OAAO,OAAO,0BAA2B,SAAQ,UAAU;aACzC,YAAO,GAAG,qBAAqB,CAAC;aAChC,WAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAG1C,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,0BAA0B,CAAC,CAAC;IAChD,CAAC;IAED;QACE,KAAK,EAAE,CAAC;QAER,sBAAsB,CAAC,IAAI,EAAE;YAC3B,WAAW,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE;YACrC,WAAW,EAAE,IAAI;SAClB,CAAC,CAAC;QACH,oBAAoB,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;IAClC,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC","sourcesContent":["import { html, LitElement } from 'lit';\nimport { addInternalsController } from '#internals/controllers/internals.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { addThemingController } from '#theming/theming-controller.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 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 = '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\n    addInternalsController(this, {\n      initialARIA: { role: 'presentation' },\n      reflectRole: true,\n    });\n    addThemingController(this, all);\n  }\n\n  protected override render() {\n    return html`<slot></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-dropdown-header': IgcDropdownHeaderComponent;\n  }\n}\n"]}

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

@@ -1,4 +1,4 @@
-import { IgcBaseOptionLikeComponent } from '../common/mixins/option.js';
+import { IgcBaseOptionLikeComponent } from '#internals/mixins/option.js';
 /**
  * Represents an item in a dropdown list.
  *
@@ -8,9 +8,9 @@ import { IgcBaseOptionLikeComponent } from '../common/mixins/option.js';
  * @slot - Renders the item's main content.
  * @slot suffix - Renders content after the item's main content.
  *
- * @csspart prefix - The prefix wrapper of the igc-dropdown-item.
- * @csspart content - The main content wrapper of the igc-dropdown-item.
- * @csspart suffix - The suffix wrapper of the igc-dropdown-item.
+ * @csspart prefix - The prefix wrapper of the dropdown item.
+ * @csspart content - The main content wrapper of the dropdown item.
+ * @csspart suffix - The suffix wrapper of the dropdown item.
  */
 export default class IgcDropdownItemComponent extends IgcBaseOptionLikeComponent {
     static readonly tagName = "igc-dropdown-item";

package/components/dropdown/dropdown-item.js

@@ -1,6 +1,6 @@
-import { addThemingController } from '../../theming/theming-controller.js';
-import { registerComponent } from '../common/definitions/register.js';
-import { IgcBaseOptionLikeComponent } from '../common/mixins/option.js';
+import { registerComponent } from '#internals/definitions/register.js';
+import { IgcBaseOptionLikeComponent } from '#internals/mixins/option.js';
+import { addThemingController } from '#theming/theming-controller.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';

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,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,MAAM,CAAC,OAAO,OAAO,wBAAyB,SAAQ,0BAA0B;aACvD,YAAO,GAAG,mBAAmB,CAAC;aAC9B,WAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAG1C,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","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"]}
+{"version":3,"file":"dropdown-item.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAC;AACzE,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACtE,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,MAAM,CAAC,OAAO,OAAO,wBAAyB,SAAQ,0BAA0B;aACvD,YAAO,GAAG,mBAAmB,CAAC;aAC9B,WAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAG1C,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","sourcesContent":["import { registerComponent } from '#internals/definitions/register.js';\nimport { IgcBaseOptionLikeComponent } from '#internals/mixins/option.js';\nimport { addThemingController } from '#theming/theming-controller.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 dropdown item.\n * @csspart content - The main content wrapper of the dropdown item.\n * @csspart suffix - The suffix wrapper of the 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.d.ts

@@ -1,5 +1,6 @@
-import { IgcComboBoxBaseLikeComponent } from '../common/mixins/combo-box.js';
-import type { AbstractConstructor } from '../common/mixins/constructor.js';
+import { type PropertyValues } from 'lit';
+import { IgcComboBoxBaseLikeComponent } from '#internals/mixins/combo-box.js';
+import type { AbstractConstructor } from '#internals/mixins/constructor.js';
 import { type PopoverPlacement } from '../popover/popover.js';
 import type { PopoverScrollStrategy } from '../types.js';
 import IgcDropdownGroupComponent from './dropdown-group.js';
@@ -11,15 +12,15 @@ export interface IgcDropdownComponentEventMap {
     igcClosed: CustomEvent<void>;
     igcChange: CustomEvent<IgcDropdownItemComponent>;
 }
-declare const IgcDropdownComponent_base: import("../common/mixins/constructor.js").Constructor<import("../common/mixins/event-emitter.js").EventEmitterInterface<IgcDropdownComponentEventMap>> & AbstractConstructor<IgcComboBoxBaseLikeComponent>;
+declare const IgcDropdownComponent_base: import("#internals/mixins/constructor.js").Constructor<import("#internals/mixins/event-emitter.js").EventEmitterInterface<IgcDropdownComponentEventMap>> & AbstractConstructor<IgcComboBoxBaseLikeComponent>;
 /**
- * Represents a DropDown component.
+ * Represents a Dropdown component.
  *
  * @element igc-dropdown
  *
  * @fires igcChange - Emitted when the selected item changes.
- * @fires igcOpening - Emitted just before the dropdown is open.
- * @fires igcOpened - Emitted after the dropdown is open.
+ * @fires igcOpening - Emitted just before the dropdown is opened.
+ * @fires igcOpened - Emitted after the dropdown is opened.
  * @fires igcClosing - Emitter just before the dropdown is closed.
  * @fires igcClosed - Emitted after closing the dropdown.
  *
@@ -34,14 +35,20 @@ export default class IgcDropdownComponent extends IgcDropdownComponent_base {
     static styles: import("lit").CSSResult[];
     static register(): void;
     private readonly _keyBindings;
-    private _rootScrollController;
-    protected readonly _rootClickController: import("../common/controllers/root-click.js").RootClickController;
-    protected _selectedItem: IgcDropdownItemComponent | null;
-    protected _activeItem: IgcDropdownItemComponent;
-    private get _activeItems();
-    private _targetListeners;
+    private readonly _rootScrollController;
+    protected readonly _rootClickController: import("#internals/controllers/root-click.js").RootClickController;
+    private _selectedItem;
+    /** The item keyboard navigation moves from. Only {@link _activateItem} assigns it. */
+    private _activeItem;
+    /** The anchor passed to `show()` / `toggle()`, if any. */
+    private _explicitTarget?;
+    /** The anchor in use - the popover is positioned against it. */
     private _target?;
-    protected trigger: HTMLSlotElement;
+    private _targetListeners?;
+    private readonly _targetSlot;
+    /** The element currently assigned to the `target` slot, if any. */
+    private get _slottedTarget();
+    private get _activeItems();
     /** The preferred placement of the component around the target element.
      * @attr
      */
@@ -73,28 +80,64 @@ export default class IgcDropdownComponent extends IgcDropdownComponent_base {
     get groups(): IgcDropdownGroupComponent[];
     /** Returns the selected item from the dropdown or null. */
     get selectedItem(): IgcDropdownItemComponent | null;
-    protected scrollStrategyChanged(): void;
-    protected openStateChange(): void;
     constructor();
-    protected firstUpdated(): Promise<void>;
+    /** @internal */
+    connectedCallback(): void;
+    /** @internal */
     disconnectedCallback(): void;
-    private handleListBoxClick;
-    private handleChange;
-    private handleSlotChange;
-    private onArrowUp;
-    private onArrowDown;
-    protected onHomeKey(): void;
-    protected onEndKey(): void;
-    protected onTabKey(): void;
-    protected onEscapeKey(): void;
-    protected onEnterKey(): void;
-    protected handleClosing(): void;
-    private activateItem;
-    private _navigateToActiveItem;
+    protected willUpdate(properties: PropertyValues<this>): void;
+    protected firstUpdated(): Promise<void>;
+    protected updated(): void;
+    /**
+     * Re-resolves the selection whenever items enter or leave the light DOM -
+     * frameworks routinely render them after the initial paint, and a selected or
+     * navigated item may be taken out from under us.
+     */
+    private _handleItemsChange;
+    private _handleListBoxClick;
+    protected _handleAnchorClick(): void;
+    private _handleClosing;
+    private _handleArrowUp;
+    private _handleArrowDown;
+    private _handleHome;
+    private _handleEnd;
+    private _handleTab;
+    /** Selects the item navigation is on, if there is one. */
+    private _commitActiveItem;
+    private _activateItem;
+    private _setSelectedItem;
     private _selectItem;
-    private _updateAnchorAccessibility;
-    private getItem;
-    private _setTarget;
+    private _clearSelectedItem;
+    /** Highlights `item` and, while the list is open, brings it into view. */
+    private _navigateToActiveItem;
+    /** Resolves an item by its `value`, or by its index in {@link items}. */
+    private _resolveItem;
+    /**
+     * Moves everything bound to the anchor - key event listeners, outside click
+     * exemption and ARIA - over to the one currently in effect.
+     */
+    private _updateTarget;
+    /**
+     * Only an anchor outside of our own DOM needs listeners of its own - keyboard
+     * events on a slotted one already reach the host.
+     */
+    private _observeTarget;
+    private _setExplicitTarget;
+    /**
+     * Publishes the popup state and the navigation position on the current anchor.
+     *
+     * `aria-activedescendant` goes on the anchor because that is what holds DOM
+     * focus - the list is never focused, since the key bindings are observed on
+     * the anchor itself. There is no `aria-controls` to go with it: the list it
+     * would name lives in this shadow root, which an IDREF cannot cross and ARIA
+     * element reflection only ever resolves out of, never into.
+     */
+    private _syncAnchorARIA;
+    /**
+     * Stops driving the current anchor: its key event listeners go, along with
+     * everything {@link _syncAnchorARIA} wrote onto it.
+     */
+    private _releaseTarget;
     /** Shows the component. */
     show(target?: HTMLElement | string): Promise<boolean>;
     /** Toggles the open state of the component. */