igniteui-webcomponents 2.1.1 → 2.2.0

package/components/dropdown/dropdown-group.js

@@ -0,0 +1,42 @@
+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;
+};
+import { html, LitElement } from 'lit';
+import { property, queryAssignedElements } from 'lit/decorators.js';
+import { themes } from '../../theming';
+import { styles } from './themes/light/dropdown-group.base.css';
+import { styles as fluent } from './themes/light/dropdown-group.fluent.css';
+let IgcDropDownGroupComponent = class IgcDropDownGroupComponent extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.size = 'large';
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.setAttribute('role', 'group');
+        const dropdown = this.closest('igc-dropdown');
+        this.size = dropdown.size;
+    }
+    render() {
+        return html `
+      <label part="label"><slot name="label"></slot></label>
+      <slot></slot>
+    `;
+    }
+};
+IgcDropDownGroupComponent.tagName = 'igc-dropdown-group';
+IgcDropDownGroupComponent.styles = styles;
+__decorate([
+    queryAssignedElements({ flatten: true, selector: 'igc-dropdown-item' })
+], IgcDropDownGroupComponent.prototype, "items", void 0);
+__decorate([
+    property({ reflect: true })
+], IgcDropDownGroupComponent.prototype, "size", void 0);
+IgcDropDownGroupComponent = __decorate([
+    themes({ fluent })
+], IgcDropDownGroupComponent);
+export default IgcDropDownGroupComponent;
+//# sourceMappingURL=dropdown-group.js.map

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

@@ -0,0 +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,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AACpE,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,wCAAwC,CAAC;AAChE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAa5E,IAAqB,yBAAyB,GAA9C,MAAqB,yBAA0B,SAAQ,UAAU;IAAjE;;QAWS,SAAI,GAAiC,OAAO,CAAC;IAgBtD,CAAC;IAdiB,iBAAiB;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QACnC,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,cAAc,CAAyB,CAAC;QACtE,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC;IAC5B,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;KAGV,CAAC;IACJ,CAAC;CACF,CAAA;AA1BwB,iCAAO,GAAG,oBAAqB,CAAA;AAE/B,gCAAM,GAAG,MAAO,CAAA;AAIvC;IADC,qBAAqB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,mBAAmB,EAAE,CAAC;wDACzB;AAI/C;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDACwB;AAXjC,yBAAyB;IAD7C,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;GACE,yBAAyB,CA2B7C;eA3BoB,yBAAyB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\nimport { themes } from '../../theming';\nimport { styles } from './themes/light/dropdown-group.base.css';\nimport { styles as fluent } from './themes/light/dropdown-group.fluent.css';\nimport IgcDropDownItemComponent from './dropdown-item';\nimport IgcDropDownComponent from './dropdown';\n\n/**\n * @element igc-dropdown-group - A container for a group of `igc-dropdown-item` components.\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({ fluent })\nexport default class IgcDropDownGroupComponent extends LitElement {\n  public static readonly tagName = 'igc-dropdown-group';\n\n  public static override styles = styles;\n\n  /** All child `igc-dropdown-item`s. */\n  @queryAssignedElements({ flatten: true, selector: 'igc-dropdown-item' })\n  public items!: Array<IgcDropDownItemComponent>;\n\n  /** @private */\n  @property({ reflect: true })\n  public size: 'small' | 'medium' | 'large' = 'large';\n\n  public override connectedCallback() {\n    super.connectedCallback();\n\n    this.setAttribute('role', 'group');\n    const dropdown = this.closest('igc-dropdown') as IgcDropDownComponent;\n    this.size = dropdown.size;\n  }\n\n  protected override render() {\n    return html`\n      <label part=\"label\"><slot name=\"label\"></slot></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

@@ -0,0 +1,16 @@
+import { LitElement } from 'lit';
+/**
+ * @element igc-dropdown-header - Represents a header item in a dropdown list.
+ *
+ * @slot - Renders the header.
+ */
+export default class IgcDropDownHeaderComponent extends LitElement {
+    static readonly tagName = "igc-dropdown-header";
+    static styles: import("lit").CSSResult;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'igc-dropdown-header': IgcDropDownHeaderComponent;
+    }
+}

package/components/dropdown/dropdown-header.js

@@ -0,0 +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;
+};
+import { html, LitElement } from 'lit';
+import { themes } from '../../theming';
+import { styles } from './themes/light/dropdown-header.base.css';
+import { styles as bootstrap } from './themes/light/dropdown-header.bootstrap.css';
+let IgcDropDownHeaderComponent = class IgcDropDownHeaderComponent extends LitElement {
+    render() {
+        return html `<slot></slot>`;
+    }
+};
+IgcDropDownHeaderComponent.tagName = 'igc-dropdown-header';
+IgcDropDownHeaderComponent.styles = styles;
+IgcDropDownHeaderComponent = __decorate([
+    themes({ bootstrap })
+], IgcDropDownHeaderComponent);
+export default IgcDropDownHeaderComponent;
+//# sourceMappingURL=dropdown-header.js.map

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

@@ -0,0 +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;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,yCAAyC,CAAC;AACjE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,8CAA8C,CAAC;AAQnF,IAAqB,0BAA0B,GAA/C,MAAqB,0BAA2B,SAAQ,UAAU;IAKhD,MAAM;QACpB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;CACF,CAAA;AAPwB,kCAAO,GAAG,qBAAsB,CAAA;AAEhC,iCAAM,GAAG,MAAO,CAAA;AAHpB,0BAA0B;IAD9C,MAAM,CAAC,EAAE,SAAS,EAAE,CAAC;GACD,0BAA0B,CAQ9C;eARoB,0BAA0B","sourcesContent":["import { html, LitElement } from 'lit';\nimport { themes } from '../../theming';\nimport { styles } from './themes/light/dropdown-header.base.css';\nimport { styles as bootstrap } from './themes/light/dropdown-header.bootstrap.css';\n\n/**\n * @element igc-dropdown-header - Represents a header item in a dropdown list.\n *\n * @slot - Renders the header.\n */\n@themes({ bootstrap })\nexport default class IgcDropDownHeaderComponent extends LitElement {\n  public static readonly tagName = 'igc-dropdown-header';\n\n  public static override styles = styles;\n\n  public 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

@@ -0,0 +1,46 @@
+import { LitElement } from 'lit';
+/**
+ * Represents an item in a dropdown list.
+ *
+ * @element igc-dropdown-item
+ *
+ * @slot prefix - Renders content before the item's main content.
+ * @slot - Renders the item's main content.
+ * @slot suffix - Renders content after the item's main content.
+ *
+ * @csspart prefix - The prefix wrapper.
+ * @csspart content - The main content wrapper.
+ * @csspart suffix - The suffix wrapper.
+ */
+export default class IgcDropDownItemComponent extends LitElement {
+    static readonly tagName = "igc-dropdown-item";
+    static styles: import("lit").CSSResult;
+    private _value;
+    /**
+     * Тhe current value of the item.
+     * If not specified, the element's text content is used.
+     */
+    get value(): string;
+    set value(value: string);
+    /**
+     * Determines whether the item is selected.
+     */
+    selected: boolean;
+    /**
+     * Determines whether the item is active.
+     */
+    active: boolean;
+    /**
+     * Determines whether the item is disabled.
+     */
+    disabled: boolean;
+    protected selectedChange(): void;
+    protected disabledChange(): void;
+    connectedCallback(): void;
+    protected render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'igc-dropdown-item': IgcDropDownItemComponent;
+    }
+}

package/components/dropdown/dropdown-item.js

@@ -0,0 +1,78 @@
+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;
+};
+import { html, LitElement } from 'lit';
+import { property } from 'lit/decorators.js';
+import { watch } from '../common/decorators';
+import { themes } from '../../theming';
+import { styles } from './themes/light/dropdown-item.base.css';
+import { styles as bootstrap } from './themes/light/dropdown-item.bootstrap.css';
+import { styles as fluent } from './themes/light/dropdown-item.fluent.css';
+import { styles as indigo } from './themes/light/dropdown-item.indigo.css';
+let IgcDropDownItemComponent = class IgcDropDownItemComponent extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.selected = false;
+        this.active = false;
+        this.disabled = false;
+    }
+    get value() {
+        var _a;
+        return this._value ? this._value : (_a = this.textContent) !== null && _a !== void 0 ? _a : '';
+    }
+    set value(value) {
+        const oldVal = this._value;
+        this._value = value;
+        this.requestUpdate('value', oldVal);
+    }
+    selectedChange() {
+        this.selected
+            ? this.setAttribute('aria-selected', 'true')
+            : this.removeAttribute('aria-selected');
+        this.active = this.selected;
+    }
+    disabledChange() {
+        this.disabled
+            ? this.setAttribute('aria-disabled', 'true')
+            : this.removeAttribute('aria-disabled');
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.setAttribute('role', 'option');
+    }
+    render() {
+        return html `
+      <section part="prefix"><slot name="prefix"></slot></section>
+      <section part="content"><slot></slot></section>
+      <section part="suffix"><slot name="suffix"></slot></section>
+    `;
+    }
+};
+IgcDropDownItemComponent.tagName = 'igc-dropdown-item';
+IgcDropDownItemComponent.styles = styles;
+__decorate([
+    property({ type: String })
+], IgcDropDownItemComponent.prototype, "value", null);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], IgcDropDownItemComponent.prototype, "selected", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], IgcDropDownItemComponent.prototype, "active", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], IgcDropDownItemComponent.prototype, "disabled", void 0);
+__decorate([
+    watch('selected')
+], IgcDropDownItemComponent.prototype, "selectedChange", null);
+__decorate([
+    watch('disabled')
+], IgcDropDownItemComponent.prototype, "disabledChange", null);
+IgcDropDownItemComponent = __decorate([
+    themes({ bootstrap, fluent, indigo })
+], IgcDropDownItemComponent);
+export default IgcDropDownItemComponent;
+//# sourceMappingURL=dropdown-item.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown-item.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown-item.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,uCAAuC,CAAC;AAC/D,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,4CAA4C,CAAC;AACjF,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,yCAAyC,CAAC;AAC3E,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,yCAAyC,CAAC;AAgB3E,IAAqB,wBAAwB,GAA7C,MAAqB,wBAAyB,SAAQ,UAAU;IAAhE;;QA0BS,aAAQ,GAAG,KAAK,CAAC;QAMjB,WAAM,GAAG,KAAK,CAAC;QAMf,aAAQ,GAAG,KAAK,CAAC;IA6B1B,CAAC;IAvDC,IAAW,KAAK;;QACd,OAAO,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,MAAA,IAAI,CAAC,WAAW,mCAAI,EAAE,CAAC;IAC5D,CAAC;IAED,IAAW,KAAK,CAAC,KAAa;QAC5B,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;QAC3B,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;IACtC,CAAC;IAqBS,cAAc;QACtB,IAAI,CAAC,QAAQ;YACX,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC;YAC5C,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;QAC1C,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC;IAC9B,CAAC;IAGS,cAAc;QACtB,IAAI,CAAC,QAAQ;YACX,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC;YAC5C,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;IAC5C,CAAC;IAEe,iBAAiB;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IACtC,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;KAIV,CAAC;IACJ,CAAC;CACF,CAAA;AAlEwB,gCAAO,GAAG,mBAAoB,CAAA;AAE9B,+BAAM,GAAG,MAAO,CAAA;AASvC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qDAG1B;AAYD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0DACnB;AAMxB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wDACrB;AAMtB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0DACnB;AAGxB;IADC,KAAK,CAAC,UAAU,CAAC;8DAMjB;AAGD;IADC,KAAK,CAAC,UAAU,CAAC;8DAKjB;AArDkB,wBAAwB;IAD5C,MAAM,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC;GACjB,wBAAwB,CAmE5C;eAnEoB,wBAAwB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { watch } from '../common/decorators';\nimport { themes } from '../../theming';\nimport { styles } from './themes/light/dropdown-item.base.css';\nimport { styles as bootstrap } from './themes/light/dropdown-item.bootstrap.css';\nimport { styles as fluent } from './themes/light/dropdown-item.fluent.css';\nimport { styles as indigo } from './themes/light/dropdown-item.indigo.css';\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.\n * @csspart content - The main content wrapper.\n * @csspart suffix - The suffix wrapper.\n */\n@themes({ bootstrap, fluent, indigo })\nexport default class IgcDropDownItemComponent extends LitElement {\n  public static readonly tagName = 'igc-dropdown-item';\n\n  public static override styles = styles;\n\n  private _value!: string;\n\n  /**\n   * Тhe current value of the item.\n   * If not specified, the element's text content is used.\n   */\n  @property({ type: String })\n  public get value() {\n    return this._value ? this._value : this.textContent ?? '';\n  }\n\n  public set value(value: string) {\n    const oldVal = this._value;\n    this._value = value;\n    this.requestUpdate('value', oldVal);\n  }\n\n  /**\n   * Determines whether the item is selected.\n   */\n  @property({ type: Boolean, reflect: true })\n  public selected = false;\n\n  /**\n   * Determines whether the item is active.\n   */\n  @property({ type: Boolean, reflect: true })\n  public active = false;\n\n  /**\n   * Determines whether the item is disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  public disabled = false;\n\n  @watch('selected')\n  protected selectedChange() {\n    this.selected\n      ? this.setAttribute('aria-selected', 'true')\n      : this.removeAttribute('aria-selected');\n    this.active = this.selected;\n  }\n\n  @watch('disabled')\n  protected disabledChange() {\n    this.disabled\n      ? this.setAttribute('aria-disabled', 'true')\n      : this.removeAttribute('aria-disabled');\n  }\n\n  public override connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'option');\n  }\n\n  protected override render() {\n    return html`\n      <section part=\"prefix\"><slot name=\"prefix\"></slot></section>\n      <section part=\"content\"><slot></slot></section>\n      <section part=\"suffix\"><slot name=\"suffix\"></slot></section>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-dropdown-item': IgcDropDownItemComponent;\n  }\n}\n"]}

package/components/dropdown/dropdown.d.ts

@@ -0,0 +1,117 @@
+import { LitElement } from 'lit';
+import { Constructor } from '../common/mixins/constructor';
+import { IgcPlacement, IgcToggleComponent, IgcToggleEventMap } from '../toggle/utilities';
+import IgcDropDownItemComponent from './dropdown-item';
+import IgcDropDownGroupComponent from './dropdown-group';
+export declare enum DropDownActionKey {
+    ESCAPE = "escape",
+    ENTER = "enter"
+}
+export interface IgcDropDownEventMap extends IgcToggleEventMap {
+    igcChange: CustomEvent<IgcDropDownItemComponent>;
+}
+declare const IgcDropDownComponent_base: Constructor<import("../common/mixins/sizable").SizableInterface> & Constructor<import("../common/mixins/event-emitter").EventEmitterInterface<IgcDropDownEventMap>> & Constructor<LitElement>;
+/**
+ * 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 igcClosing - Emitter just before the dropdown is closed.
+ * @fires igcClosed - Emitted after closing the dropdown.
+ *
+ * @slot target - Renders the dropdown's target element.
+ * @slot - Renders the dropdown list items.
+ *
+ * @csspart base - The dropdown list wrapper.
+ * @csspart list - The dropdown list.
+ */
+export default class IgcDropDownComponent extends IgcDropDownComponent_base implements IgcToggleComponent {
+    static readonly tagName = "igc-dropdown";
+    static styles: import("lit").CSSResult;
+    private toggleController;
+    private selectedItem;
+    private activeItem;
+    private target;
+    private get allItems();
+    private targetNodes;
+    protected content: HTMLElement;
+    protected scrollContainer: HTMLElement;
+    protected items: Array<IgcDropDownItemComponent>;
+    protected groups: Array<IgcDropDownGroupComponent>;
+    /** Whether the dropdown should be kept open on selection. */
+    keepOpenOnSelect: boolean;
+    /** Sets the open state of the component. */
+    open: boolean;
+    /** The preferred placement of the component around the target element.
+     * @type {"top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "right" | "right-start" | "right-end" | "left" | "left-start" | "left-end"}
+     */
+    placement: IgcPlacement;
+    /** Sets the component's positioning strategy. */
+    positionStrategy: 'absolute' | 'fixed';
+    /** Determines the behavior of the component during scrolling the container. */
+    scrollStrategy: 'scroll' | 'block' | 'close';
+    /**
+     * Whether the component should be flipped to the opposite side of the target once it's about to overflow the visible area.
+     * When true, once enough space is detected on its preferred side, it will flip back.
+     */
+    flip: boolean;
+    /** The distance from the target element. */
+    distance: number;
+    /** Whether the component should be kept open on clicking outside of it. */
+    keepOpenOnOutsideClick: boolean;
+    /** Whether the dropdown's width should be the same as the target's one. */
+    sameWidth: boolean;
+    protected toggleDirectiveChange(): void;
+    protected updateOptions(): void;
+    protected sizeChange(): void;
+    constructor();
+    firstUpdated(): void;
+    protected getUpdateComplete(): Promise<boolean>;
+    private handleKeyDown;
+    private handleItemActionKey;
+    private handleClick;
+    private handleTargetClick;
+    private handleOpening;
+    private handleClosing;
+    private handleChange;
+    private handleSlotChange;
+    private handleFocusout;
+    private getItem;
+    private activateItem;
+    private selectItem;
+    private navigate;
+    private navigateItem;
+    private scrollToHiddenItem;
+    private getNearestSiblingFocusableItemIndex;
+    private navigateNext;
+    private navigatePrev;
+    private onArrowDownKeyDown;
+    private onArrowUpKeyDown;
+    private _hide;
+    /** Shows the dropdown. */
+    show(target?: HTMLElement): void;
+    /** Hides the dropdown. */
+    hide(): void;
+    /** Toggles the open state of the dropdown. */
+    toggle(target?: HTMLElement): void;
+    /** Navigates to the item with the specified value. If it exists, returns the found item, otherwise - null. */
+    navigateTo(value: string): IgcDropDownItemComponent | null;
+    /** Navigates to the item at the specified index. If it exists, returns the found item, otherwise - null. */
+    navigateTo(index: number): IgcDropDownItemComponent | null;
+    /** Selects the item with the specified value. If it exists, returns the found item, otherwise - null. */
+    select(value: string): IgcDropDownItemComponent | null;
+    /** Selects the item at the specified index. If it exists, returns the found item, otherwise - null. */
+    select(index: number): IgcDropDownItemComponent | null;
+    /**  Clears the current selection of the dropdown. */
+    clearSelection(): void;
+    protected render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'igc-dropdown': IgcDropDownComponent;
+    }
+}
+export {};