igniteui-webcomponents 6.1.1 → 6.2.0

package/components/dialog/themes/dark/dialog.bootstrap.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host{--elevation: var(--ig-dialog-elevation, var(--ig-elevation-0));--background: var(--ig-dialog-background, var(--ig-surface-500));--title-color: var(--ig-dialog-title-color, var(--ig-gray-900));--border-color: var(--ig-dialog-border-color, var(--ig-gray-100));--backdrop: var(--ig-dialog-backdrop, hsl(from var(--ig-gray-500) h s l/0.54));--border-radius: var(--ig-dialog-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1111111111) * 2.25rem), 2.25rem));--default-size: var(--ig-dialog-default-size, 2);--ig-theme: bootstrap}`;
+export const styles = css `:host{--elevation: var(--ig-dialog-elevation, var(--ig-elevation-0));--background: var(--ig-dialog-background, var(--ig-surface-500));--title-color: var(--ig-dialog-title-color, var(--ig-gray-900));--border-color: var(--ig-dialog-border-color, var(--ig-gray-300));--backdrop: var(--ig-dialog-backdrop, hsl(from var(--ig-gray-500) h s l/0.54));--border-radius: var(--ig-dialog-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1111111111) * 2.25rem), 2.25rem));--default-size: var(--ig-dialog-default-size, 2);--ig-theme: bootstrap}`;
 //# sourceMappingURL=dialog.bootstrap.css.js.map

package/components/dialog/themes/dark/dialog.bootstrap.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/dialog/themes/dark/dialog.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,6hBAA6hB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--elevation: var(--ig-dialog-elevation, var(--ig-elevation-0));--background: var(--ig-dialog-background, var(--ig-surface-500));--title-color: var(--ig-dialog-title-color, var(--ig-gray-900));--border-color: var(--ig-dialog-border-color, var(--ig-gray-100));--backdrop: var(--ig-dialog-backdrop, hsl(from var(--ig-gray-500) h s l/0.54));--border-radius: var(--ig-dialog-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1111111111) * 2.25rem), 2.25rem));--default-size: var(--ig-dialog-default-size, 2);--ig-theme: bootstrap}`;\n"]}
+{"version":3,"file":"dialog.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/dialog/themes/dark/dialog.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,6hBAA6hB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--elevation: var(--ig-dialog-elevation, var(--ig-elevation-0));--background: var(--ig-dialog-background, var(--ig-surface-500));--title-color: var(--ig-dialog-title-color, var(--ig-gray-900));--border-color: var(--ig-dialog-border-color, var(--ig-gray-300));--backdrop: var(--ig-dialog-backdrop, hsl(from var(--ig-gray-500) h s l/0.54));--border-radius: var(--ig-dialog-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1111111111) * 2.25rem), 2.25rem));--default-size: var(--ig-dialog-default-size, 2);--ig-theme: bootstrap}`;\n"]}

package/components/expansion-panel/expansion-panel.d.ts

@@ -36,12 +36,11 @@ export default class IgcExpansionPanelComponent extends IgcExpansionPanelCompone
     static readonly tagName = "igc-expansion-panel";
     static styles: import("lit").CSSResult[];
     static register(): void;
-    private static readonly increment;
     private _panelId;
-    private headerRef;
-    private contentRef;
-    private animationPlayer;
-    private _indicatorExpandedElements;
+    private readonly _headerRef;
+    private readonly _contentRef;
+    private readonly _player;
+    private readonly _slots;
     /**
      * Indicates whether the contents of the control should be visible.
      * @attr
@@ -58,22 +57,21 @@ export default class IgcExpansionPanelComponent extends IgcExpansionPanelCompone
      */
     indicatorPosition: ExpansionPanelIndicatorPosition;
     constructor();
-    protected createRenderRoot(): HTMLElement | DocumentFragment;
     connectedCallback(): void;
-    private handleClick;
-    private toggleWithEvent;
-    private toggleAnimation;
-    private openWithEvent;
-    private closeWithEvent;
+    private _handleClick;
+    private _toggleWithEvent;
+    private _toggleAnimation;
+    private _openWithEvent;
+    private _closeWithEvent;
     /** Toggles the panel open/close state. */
     toggle(): Promise<boolean>;
     /** Hides the panel content. */
     hide(): Promise<boolean>;
     /** Shows the panel content. */
     show(): Promise<boolean>;
-    private renderIndicatorTemplate;
-    private renderHeaderTemplate;
-    private renderContentTemplate;
+    private _renderIndicator;
+    private _renderHeader;
+    private _renderPanel;
     protected render(): import("lit-html").TemplateResult<1>;
 }
 declare global {

package/components/expansion-panel/expansion-panel.js

@@ -5,84 +5,82 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { html, LitElement, nothing } from 'lit';
-import { property, queryAssignedElements } from 'lit/decorators.js';
+import { property } from 'lit/decorators.js';
 import { createRef, ref } from 'lit/directives/ref.js';
 import { addAnimationController } from '../../animations/player.js';
 import { growVerIn, growVerOut } from '../../animations/presets/grow/index.js';
 import { addThemingController } from '../../theming/theming-controller.js';
 import { addKeybindings, altKey, arrowDown, arrowUp, } from '../common/controllers/key-bindings.js';
+import { addSlotController, setSlots } from '../common/controllers/slot.js';
 import { registerComponent } from '../common/definitions/register.js';
 import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
-import { createCounter, isEmpty } from '../common/util.js';
 import IgcIconComponent from '../icon/icon.js';
 import { styles } from './themes/expansion-panel.base.css.js';
 import { styles as shared } from './themes/shared/expansion-panel.common.css.js';
 import { all } from './themes/themes.js';
+let nextId = 1;
 class IgcExpansionPanelComponent extends EventEmitterMixin(LitElement) {
     static register() {
         registerComponent(IgcExpansionPanelComponent, IgcIconComponent);
     }
     constructor() {
         super();
-        this.headerRef = createRef();
-        this.contentRef = createRef();
-        this.animationPlayer = addAnimationController(this, this.contentRef);
+        this._panelId = `${IgcExpansionPanelComponent.tagName}-${nextId++}`;
+        this._headerRef = createRef();
+        this._contentRef = createRef();
+        this._player = addAnimationController(this, this._contentRef);
+        this._slots = addSlotController(this, {
+            slots: setSlots('title', 'subtitle', 'indicator', 'indicator-expanded'),
+        });
         this.open = false;
         this.disabled = false;
         this.indicatorPosition = 'start';
         addThemingController(this, all);
         addKeybindings(this, {
-            ref: this.headerRef,
+            ref: this._headerRef,
             skip: () => this.disabled,
             bindingDefaults: { preventDefault: true },
         })
-            .setActivateHandler(this.toggleWithEvent)
-            .set([altKey, arrowDown], this.openWithEvent)
-            .set([altKey, arrowUp], this.closeWithEvent);
-    }
-    createRenderRoot() {
-        const root = super.createRenderRoot();
-        root.addEventListener('slotchange', () => this.requestUpdate());
-        return root;
+            .setActivateHandler(this._toggleWithEvent)
+            .set([altKey, arrowDown], this._openWithEvent)
+            .set([altKey, arrowUp], this._closeWithEvent);
     }
     connectedCallback() {
         super.connectedCallback();
-        this._panelId =
-            this.id ||
-                `igc-expansion-panel-${IgcExpansionPanelComponent.increment()}`;
+        this._panelId = this.id || this._panelId;
     }
-    handleClick() {
-        this.headerRef.value.focus();
-        this.toggleWithEvent();
+    _handleClick() {
+        this._headerRef.value.focus();
+        this._toggleWithEvent();
     }
-    toggleWithEvent() {
-        this.open ? this.closeWithEvent() : this.openWithEvent();
+    _toggleWithEvent() {
+        this.open ? this._closeWithEvent() : this._openWithEvent();
     }
-    async toggleAnimation(dir) {
+    async _toggleAnimation(dir) {
         const animation = dir === 'open' ? growVerIn : growVerOut;
         const [_, event] = await Promise.all([
-            this.animationPlayer.stopAll(),
-            this.animationPlayer.play(animation()),
+            this._player.stopAll(),
+            this._player.play(animation()),
         ]);
         return event.type === 'finish';
     }
-    async openWithEvent() {
+    async _openWithEvent() {
         if (this.open ||
             !this.emitEvent('igcOpening', { cancelable: true, detail: this })) {
             return;
         }
         this.open = true;
-        if (await this.toggleAnimation('open')) {
+        if (await this._toggleAnimation('open')) {
             this.emitEvent('igcOpened', { detail: this });
         }
     }
-    async closeWithEvent() {
+    async _closeWithEvent() {
         if (!(this.open &&
             this.emitEvent('igcClosing', { cancelable: true, detail: this }))) {
             return;
         }
         this.open = false;
-        if (await this.toggleAnimation('close')) {
+        if (await this._toggleAnimation('close')) {
             this.emitEvent('igcClosed', { detail: this });
         }
     }
@@ -94,7 +92,7 @@ class IgcExpansionPanelComponent extends EventEmitterMixin(LitElement) {
             return false;
         }
         this.open = false;
-        await this.toggleAnimation('close');
+        await this._toggleAnimation('close');
         return true;
     }
     async show() {
@@ -102,32 +100,25 @@ class IgcExpansionPanelComponent extends EventEmitterMixin(LitElement) {
             return false;
         }
         this.open = true;
-        await this.toggleAnimation('open');
+        await this._toggleAnimation('open');
         return true;
     }
-    renderIndicatorTemplate() {
-        const indicatorHidden = this.open && this._indicatorExpandedElements.length > 0;
-        const indicatorExpandedHidden = isEmpty(this._indicatorExpandedElements) || !this.open;
+    _renderIndicator() {
+        const iconName = this.open ? 'collapse' : 'expand';
+        const indicatorHidden = this.open && this._slots.hasAssignedElements('indicator-expanded');
         return html `
       <div part="indicator" aria-hidden="true">
         <slot name="indicator" ?hidden=${indicatorHidden}>
-          <igc-icon
-            name=${this.open ? 'collapse' : 'expand'}
-            collection="default"
-          >
-          </igc-icon>
+          <igc-icon name=${iconName} collection="default"></igc-icon>
         </slot>
-        <slot
-          name="indicator-expanded"
-          ?hidden=${indicatorExpandedHidden}
-        ></slot>
+        <slot name="indicator-expanded" ?hidden=${!indicatorHidden}></slot>
       </div>
     `;
     }
-    renderHeaderTemplate() {
+    _renderHeader() {
         return html `
       <div
-        ${ref(this.headerRef)}
+        ${ref(this._headerRef)}
         part="header"
         id="${this._panelId}-header"
         role="button"
@@ -135,9 +126,9 @@ class IgcExpansionPanelComponent extends EventEmitterMixin(LitElement) {
         aria-disabled=${this.disabled}
         aria-controls="${this._panelId}-content"
         tabindex=${this.disabled ? '-1' : '0'}
-        @click=${this.disabled ? nothing : this.handleClick}
+        @click=${this.disabled ? nothing : this._handleClick}
       >
-        ${this.renderIndicatorTemplate()}
+        ${this._renderIndicator()}
         <div>
           <slot name="title" part="title"></slot>
           <slot name="subtitle" part="subtitle"></slot>
@@ -145,10 +136,10 @@ class IgcExpansionPanelComponent extends EventEmitterMixin(LitElement) {
       </div>
     `;
     }
-    renderContentTemplate() {
+    _renderPanel() {
         return html `
       <div
-        ${ref(this.contentRef)}
+        ${ref(this._contentRef)}
         part="content"
         role="region"
         id="${this._panelId}-content"
@@ -161,21 +152,17 @@ class IgcExpansionPanelComponent extends EventEmitterMixin(LitElement) {
     `;
     }
     render() {
-        return html `${this.renderHeaderTemplate()}${this.renderContentTemplate()}`;
+        return html `${this._renderHeader()}${this._renderPanel()}`;
     }
 }
 IgcExpansionPanelComponent.tagName = 'igc-expansion-panel';
 IgcExpansionPanelComponent.styles = [styles, shared];
-IgcExpansionPanelComponent.increment = createCounter();
 export default IgcExpansionPanelComponent;
 __decorate([
-    queryAssignedElements({ slot: 'indicator-expanded' })
-], IgcExpansionPanelComponent.prototype, "_indicatorExpandedElements", void 0);
-__decorate([
-    property({ reflect: true, type: Boolean })
+    property({ type: Boolean, reflect: true })
 ], IgcExpansionPanelComponent.prototype, "open", void 0);
 __decorate([
-    property({ reflect: true, type: Boolean })
+    property({ type: Boolean, reflect: true })
 ], IgcExpansionPanelComponent.prototype, "disabled", void 0);
 __decorate([
     property({ reflect: true, attribute: 'indicator-position' })

package/components/expansion-panel/expansion-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"expansion-panel.js","sourceRoot":"","sources":["../../../src/components/expansion-panel/expansion-panel.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\nimport { createRef, type Ref, ref } from 'lit/directives/ref.js';\n\nimport { addAnimationController } from '../../animations/player.js';\nimport { growVerIn, growVerOut } from '../../animations/presets/grow/index.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport {\n  addKeybindings,\n  altKey,\n  arrowDown,\n  arrowUp,\n} from '../common/controllers/key-bindings.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 { createCounter, isEmpty } from '../common/util.js';\nimport IgcIconComponent from '../icon/icon.js';\nimport type { ExpansionPanelIndicatorPosition } from '../types.js';\nimport { styles } from './themes/expansion-panel.base.css.js';\nimport { styles as shared } from './themes/shared/expansion-panel.common.css.js';\nimport { all } from './themes/themes.js';\n\nexport interface IgcExpansionPanelComponentEventMap {\n  igcOpening: CustomEvent<IgcExpansionPanelComponent>;\n  igcOpened: CustomEvent<IgcExpansionPanelComponent>;\n  igcClosing: CustomEvent<IgcExpansionPanelComponent>;\n  igcClosed: CustomEvent<IgcExpansionPanelComponent>;\n}\n\n/**\n * The Expansion Panel Component provides a way to display information in a toggleable way -\n * compact summary view containing title and description and expanded detail view containing\n * additional content to the summary header.\n *\n * @element igc-expansion-panel\n *\n * @slot - renders the default content of the panel\n * @slot title - renders the title of the panel's header\n * @slot subtitle - renders the subtitle of the panel's header\n * @slot indicator - renders the expand/collapsed indicator\n * @slot indicator-expanded - renders the expanded state of the indicator\n *\n * @fires igcOpening - Emitted before opening the expansion panel.\n * @fires igcOpened - Emitted after the expansion panel is opened.\n * @fires igcClosing - Emitted before closing the expansion panel.\n * @fires igcClosed - Emitted after the expansion panel is closed.\n *\n * @csspart header - The container of the expansion indicator, title and subtitle.\n * @csspart title -  The title container.\n * @csspart subtitle - The subtitle container.\n * @csspart indicator - The indicator container.\n * @csspart content - The expansion panel's content wrapper.\n */\nexport default class IgcExpansionPanelComponent extends EventEmitterMixin<\n  IgcExpansionPanelComponentEventMap,\n  Constructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-expansion-panel';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register() {\n    registerComponent(IgcExpansionPanelComponent, IgcIconComponent);\n  }\n\n  private static readonly increment = createCounter();\n\n  private _panelId!: string;\n  private headerRef: Ref<HTMLDivElement> = createRef();\n  private contentRef: Ref<HTMLDivElement> = createRef();\n\n  private animationPlayer = addAnimationController(this, this.contentRef);\n\n  @queryAssignedElements({ slot: 'indicator-expanded' })\n  private _indicatorExpandedElements!: HTMLElement[];\n\n  /**\n   * Indicates whether the contents of the control should be visible.\n   * @attr\n   */\n  @property({ reflect: true, type: Boolean })\n  public open = false;\n\n  /**\n   * Get/Set whether the expansion panel is disabled. Disabled panels are ignored for user interactions.\n   * @attr\n   */\n  @property({ reflect: true, type: Boolean })\n  public disabled = false;\n\n  /**\n   * The indicator position of the expansion panel.\n   * @attr indicator-position\n   */\n  @property({ reflect: true, attribute: 'indicator-position' })\n  public indicatorPosition: ExpansionPanelIndicatorPosition = 'start';\n\n  constructor() {\n    super();\n\n    addThemingController(this, all);\n\n    addKeybindings(this, {\n      ref: this.headerRef,\n      skip: () => this.disabled,\n      bindingDefaults: { preventDefault: true },\n    })\n      .setActivateHandler(this.toggleWithEvent)\n      .set([altKey, arrowDown], this.openWithEvent)\n      .set([altKey, arrowUp], this.closeWithEvent);\n  }\n\n  protected override createRenderRoot() {\n    const root = super.createRenderRoot();\n    root.addEventListener('slotchange', () => this.requestUpdate());\n    return root;\n  }\n\n  public override connectedCallback() {\n    super.connectedCallback();\n    this._panelId =\n      this.id ||\n      `igc-expansion-panel-${IgcExpansionPanelComponent.increment()}`;\n  }\n\n  private handleClick() {\n    this.headerRef.value!.focus();\n    this.toggleWithEvent();\n  }\n\n  private toggleWithEvent() {\n    this.open ? this.closeWithEvent() : this.openWithEvent();\n  }\n\n  private async toggleAnimation(dir: 'open' | 'close') {\n    const animation = dir === 'open' ? growVerIn : growVerOut;\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 openWithEvent() {\n    if (\n      this.open ||\n      !this.emitEvent('igcOpening', { cancelable: true, detail: this })\n    ) {\n      return;\n    }\n\n    this.open = true;\n\n    if (await this.toggleAnimation('open')) {\n      this.emitEvent('igcOpened', { detail: this });\n    }\n  }\n\n  private async closeWithEvent() {\n    if (\n      !(\n        this.open &&\n        this.emitEvent('igcClosing', { cancelable: true, detail: this })\n      )\n    ) {\n      return;\n    }\n\n    this.open = false;\n\n    if (await this.toggleAnimation('close')) {\n      this.emitEvent('igcClosed', { detail: this });\n    }\n  }\n\n  /** Toggles the panel open/close state. */\n  public async toggle(): Promise<boolean> {\n    return this.open ? this.hide() : this.show();\n  }\n\n  /** Hides the panel content. */\n  public async hide(): Promise<boolean> {\n    if (!this.open) {\n      return false;\n    }\n\n    this.open = false;\n    await this.toggleAnimation('close');\n    return true;\n  }\n\n  /** Shows the panel content. */\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  private renderIndicatorTemplate() {\n    const indicatorHidden =\n      this.open && this._indicatorExpandedElements.length > 0;\n    const indicatorExpandedHidden =\n      isEmpty(this._indicatorExpandedElements) || !this.open;\n\n    return html`\n      <div part=\"indicator\" aria-hidden=\"true\">\n        <slot name=\"indicator\" ?hidden=${indicatorHidden}>\n          <igc-icon\n            name=${this.open ? 'collapse' : 'expand'}\n            collection=\"default\"\n          >\n          </igc-icon>\n        </slot>\n        <slot\n          name=\"indicator-expanded\"\n          ?hidden=${indicatorExpandedHidden}\n        ></slot>\n      </div>\n    `;\n  }\n\n  private renderHeaderTemplate() {\n    return html`\n      <div\n        ${ref(this.headerRef)}\n        part=\"header\"\n        id=\"${this._panelId}-header\"\n        role=\"button\"\n        aria-expanded=${this.open}\n        aria-disabled=${this.disabled}\n        aria-controls=\"${this._panelId}-content\"\n        tabindex=${this.disabled ? '-1' : '0'}\n        @click=${this.disabled ? nothing : this.handleClick}\n      >\n        ${this.renderIndicatorTemplate()}\n        <div>\n          <slot name=\"title\" part=\"title\"></slot>\n          <slot name=\"subtitle\" part=\"subtitle\"></slot>\n        </div>\n      </div>\n    `;\n  }\n\n  private renderContentTemplate() {\n    return html`\n      <div\n        ${ref(this.contentRef)}\n        part=\"content\"\n        role=\"region\"\n        id=\"${this._panelId}-content\"\n        aria-labelledby=\"${this._panelId}-header\"\n        .inert=${!this.open}\n        aria-hidden=${!this.open}\n      >\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  protected override render() {\n    return html`${this.renderHeaderTemplate()}${this.renderContentTemplate()}`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-expansion-panel': IgcExpansionPanelComponent;\n  }\n}\n"]}
+{"version":3,"file":"expansion-panel.js","sourceRoot":"","sources":["../../../src/components/expansion-panel/expansion-panel.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { createRef, ref } from 'lit/directives/ref.js';\nimport { addAnimationController } from '../../animations/player.js';\nimport { growVerIn, growVerOut } from '../../animations/presets/grow/index.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport {\n  addKeybindings,\n  altKey,\n  arrowDown,\n  arrowUp,\n} from '../common/controllers/key-bindings.js';\nimport { addSlotController, setSlots } from '../common/controllers/slot.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 IgcIconComponent from '../icon/icon.js';\nimport type { ExpansionPanelIndicatorPosition } from '../types.js';\nimport { styles } from './themes/expansion-panel.base.css.js';\nimport { styles as shared } from './themes/shared/expansion-panel.common.css.js';\nimport { all } from './themes/themes.js';\n\nexport interface IgcExpansionPanelComponentEventMap {\n  igcOpening: CustomEvent<IgcExpansionPanelComponent>;\n  igcOpened: CustomEvent<IgcExpansionPanelComponent>;\n  igcClosing: CustomEvent<IgcExpansionPanelComponent>;\n  igcClosed: CustomEvent<IgcExpansionPanelComponent>;\n}\n\nlet nextId = 1;\n\n/**\n * The Expansion Panel Component provides a way to display information in a toggleable way -\n * compact summary view containing title and description and expanded detail view containing\n * additional content to the summary header.\n *\n * @element igc-expansion-panel\n *\n * @slot - renders the default content of the panel\n * @slot title - renders the title of the panel's header\n * @slot subtitle - renders the subtitle of the panel's header\n * @slot indicator - renders the expand/collapsed indicator\n * @slot indicator-expanded - renders the expanded state of the indicator\n *\n * @fires igcOpening - Emitted before opening the expansion panel.\n * @fires igcOpened - Emitted after the expansion panel is opened.\n * @fires igcClosing - Emitted before closing the expansion panel.\n * @fires igcClosed - Emitted after the expansion panel is closed.\n *\n * @csspart header - The container of the expansion indicator, title and subtitle.\n * @csspart title -  The title container.\n * @csspart subtitle - The subtitle container.\n * @csspart indicator - The indicator container.\n * @csspart content - The expansion panel's content wrapper.\n */\nexport default class IgcExpansionPanelComponent extends EventEmitterMixin<\n  IgcExpansionPanelComponentEventMap,\n  Constructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-expansion-panel';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcExpansionPanelComponent, IgcIconComponent);\n  }\n\n  private _panelId = `${IgcExpansionPanelComponent.tagName}-${nextId++}`;\n  private readonly _headerRef = createRef<HTMLElement>();\n  private readonly _contentRef = createRef<HTMLElement>();\n\n  private readonly _player = addAnimationController(this, this._contentRef);\n  private readonly _slots = addSlotController(this, {\n    slots: setSlots('title', 'subtitle', 'indicator', 'indicator-expanded'),\n  });\n\n  /**\n   * Indicates whether the contents of the control should be visible.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public open = false;\n\n  /**\n   * Get/Set whether the expansion panel is disabled. Disabled panels are ignored for user interactions.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public disabled = false;\n\n  /**\n   * The indicator position of the expansion panel.\n   * @attr indicator-position\n   */\n  @property({ reflect: true, attribute: 'indicator-position' })\n  public indicatorPosition: ExpansionPanelIndicatorPosition = 'start';\n\n  constructor() {\n    super();\n\n    addThemingController(this, all);\n\n    addKeybindings(this, {\n      ref: this._headerRef,\n      skip: () => this.disabled,\n      bindingDefaults: { preventDefault: true },\n    })\n      .setActivateHandler(this._toggleWithEvent)\n      .set([altKey, arrowDown], this._openWithEvent)\n      .set([altKey, arrowUp], this._closeWithEvent);\n  }\n\n  public override connectedCallback(): void {\n    super.connectedCallback();\n    this._panelId = this.id || this._panelId;\n  }\n\n  private _handleClick(): void {\n    this._headerRef.value!.focus();\n    this._toggleWithEvent();\n  }\n\n  private _toggleWithEvent(): void {\n    this.open ? this._closeWithEvent() : this._openWithEvent();\n  }\n\n  private async _toggleAnimation(dir: 'open' | 'close'): Promise<boolean> {\n    const animation = dir === 'open' ? growVerIn : growVerOut;\n\n    const [_, event] = await Promise.all([\n      this._player.stopAll(),\n      this._player.play(animation()),\n    ]);\n\n    return event.type === 'finish';\n  }\n\n  private async _openWithEvent(): Promise<void> {\n    if (\n      this.open ||\n      !this.emitEvent('igcOpening', { cancelable: true, detail: this })\n    ) {\n      return;\n    }\n\n    this.open = true;\n\n    if (await this._toggleAnimation('open')) {\n      this.emitEvent('igcOpened', { detail: this });\n    }\n  }\n\n  private async _closeWithEvent(): Promise<void> {\n    if (\n      !(\n        this.open &&\n        this.emitEvent('igcClosing', { cancelable: true, detail: this })\n      )\n    ) {\n      return;\n    }\n\n    this.open = false;\n\n    if (await this._toggleAnimation('close')) {\n      this.emitEvent('igcClosed', { detail: this });\n    }\n  }\n\n  /** Toggles the panel open/close state. */\n  public async toggle(): Promise<boolean> {\n    return this.open ? this.hide() : this.show();\n  }\n\n  /** Hides the panel content. */\n  public async hide(): Promise<boolean> {\n    if (!this.open) {\n      return false;\n    }\n\n    this.open = false;\n    await this._toggleAnimation('close');\n    return true;\n  }\n\n  /** Shows the panel content. */\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  private _renderIndicator() {\n    const iconName = this.open ? 'collapse' : 'expand';\n    const indicatorHidden =\n      this.open && this._slots.hasAssignedElements('indicator-expanded');\n\n    return html`\n      <div part=\"indicator\" aria-hidden=\"true\">\n        <slot name=\"indicator\" ?hidden=${indicatorHidden}>\n          <igc-icon name=${iconName} collection=\"default\"></igc-icon>\n        </slot>\n        <slot name=\"indicator-expanded\" ?hidden=${!indicatorHidden}></slot>\n      </div>\n    `;\n  }\n\n  private _renderHeader() {\n    return html`\n      <div\n        ${ref(this._headerRef)}\n        part=\"header\"\n        id=\"${this._panelId}-header\"\n        role=\"button\"\n        aria-expanded=${this.open}\n        aria-disabled=${this.disabled}\n        aria-controls=\"${this._panelId}-content\"\n        tabindex=${this.disabled ? '-1' : '0'}\n        @click=${this.disabled ? nothing : this._handleClick}\n      >\n        ${this._renderIndicator()}\n        <div>\n          <slot name=\"title\" part=\"title\"></slot>\n          <slot name=\"subtitle\" part=\"subtitle\"></slot>\n        </div>\n      </div>\n    `;\n  }\n\n  private _renderPanel() {\n    return html`\n      <div\n        ${ref(this._contentRef)}\n        part=\"content\"\n        role=\"region\"\n        id=\"${this._panelId}-content\"\n        aria-labelledby=\"${this._panelId}-header\"\n        .inert=${!this.open}\n        aria-hidden=${!this.open}\n      >\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  protected override render() {\n    return html`${this._renderHeader()}${this._renderPanel()}`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-expansion-panel': IgcExpansionPanelComponent;\n  }\n}\n"]}

package/components/file-input/file-input.d.ts

@@ -1,5 +1,4 @@
 import type { AbstractConstructor } from '../common/mixins/constructor.js';
-import { type FormValueOf } from '../common/mixins/forms/form-value.js';
 import { IgcInputBaseComponent, type IgcInputComponentEventMap } from '../input/input-base.js';
 export interface IgcFileInputComponentEventMap extends Omit<IgcInputComponentEventMap, 'igcChange' | 'igcInput'> {
     igcCancel: CustomEvent<FileList>;
@@ -35,7 +34,7 @@ export default class IgcFileInputComponent extends IgcFileInputComponent_base {
     static styles: import("lit").CSSResult[];
     static register(): void;
     protected get __validators(): import("../common/validators.js").Validator<IgcFileInputComponent>[];
-    protected readonly _formValue: FormValueOf<FileList | null>;
+    protected readonly _formValue: import("../common/mixins/forms/form-value.js").FormValue<FileList | null>;
     private _hasActivation;
     private get _fileNames();
     /**
@@ -77,7 +76,6 @@ export default class IgcFileInputComponent extends IgcFileInputComponent_base {
     setRangeText(): void;
     private _handleChange;
     private _handleCancel;
-    protected _handleFocus(): void;
     protected _handleBlur(): void;
     protected _handleClick(): void;
     protected renderFileParts(): import("lit-html").TemplateResult<1>;

package/components/file-input/file-input.js

@@ -11,7 +11,8 @@ import { addThemingController } from '../../theming/theming-controller.js';
 import IgcButtonComponent from '../button/button.js';
 import { registerComponent } from '../common/definitions/register.js';
 import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
-import { createFormValueState, defaultFileListTransformer, } from '../common/mixins/forms/form-value.js';
+import { FormValueFileListTransformers } from '../common/mixins/forms/form-transformers.js';
+import { createFormValueState } from '../common/mixins/forms/form-value.js';
 import { partMap } from '../common/part-map.js';
 import { isEmpty } from '../common/util.js';
 import { IgcInputBaseComponent, } from '../input/input-base.js';
@@ -48,7 +49,7 @@ class IgcFileInputComponent extends EventEmitterMixin(IgcInputBaseComponent) {
         super();
         this._formValue = createFormValueState(this, {
             initialValue: null,
-            transformers: defaultFileListTransformer,
+            transformers: FormValueFileListTransformers,
         });
         this._hasActivation = false;
         this.multiple = false;
@@ -65,25 +66,21 @@ class IgcFileInputComponent extends EventEmitterMixin(IgcInputBaseComponent) {
     setRangeText() { }
     _handleChange() {
         this._hasActivation = false;
+        this._setTouchedState();
         this._formValue.setValueAndFormState(this.files);
-        this._validate();
         this.requestUpdate();
         this.emitEvent('igcChange', { detail: this.files });
     }
     _handleCancel() {
         this._hasActivation = false;
+        this._setTouchedState();
         this._validate();
         this.emitEvent('igcCancel', {
             detail: this.files,
         });
     }
-    _handleFocus() {
-        this._dirty = true;
-    }
     _handleBlur() {
-        if (!this._hasActivation) {
-            this._validate();
-        }
+        this._hasActivation ? this._validate() : super._handleBlur();
     }
     _handleClick() {
         this._hasActivation = true;
@@ -118,12 +115,10 @@ class IgcFileInputComponent extends EventEmitterMixin(IgcInputBaseComponent) {
         ?multiple=${this.multiple}
         tabindex=${this.tabIndex}
         accept=${ifDefined(this.accept === '' ? undefined : this.accept)}
-        aria-invalid=${this.invalid}
         aria-describedby=${ifDefined(isEmpty(this._helperText) ? nothing : 'helper-text')}
         @click=${this._handleClick}
         @change=${this._handleChange}
         @cancel=${this._handleCancel}
-        @focus=${this._handleFocus}
         @blur=${this._handleBlur}
       />
     `;

package/components/file-input/file-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"file-input.js","sourceRoot":"","sources":["../../../src/components/file-input/file-input.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { AbstractConstructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport {\n  createFormValueState,\n  defaultFileListTransformer,\n  type FormValueOf,\n} from '../common/mixins/forms/form-value.js';\nimport { partMap } from '../common/part-map.js';\nimport { isEmpty } from '../common/util.js';\nimport {\n  IgcInputBaseComponent,\n  type IgcInputComponentEventMap,\n} from '../input/input-base.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\nimport { styles } from './themes/file-input.base.css.js';\nimport { all } from './themes/themes.js';\nimport { fileValidators } from './validators.js';\n\nexport interface IgcFileInputComponentEventMap\n  extends Omit<IgcInputComponentEventMap, 'igcChange' | 'igcInput'> {\n  igcCancel: CustomEvent<FileList>;\n  igcChange: CustomEvent<FileList>;\n}\n\n/* blazorSuppress */\n/**\n * @element igc-file-input\n *\n * @slot prefix - Renders content before the input.\n * @slot suffix - Renders content after input.\n * @slot helper-text - Renders content below the input.\n * @slot file-selector-text - Renders content for the browse button when input type is file.\n * @slot file-missing-text - Renders content when input type is file and no file is chosen.\n * @slot value-missing - Renders content when the required validation fails.\n * @slot custom-error - Renders content when setCustomValidity(message) is set.\n * @slot invalid - Renders content when the component is in invalid state (validity.valid = false).\n *\n * @fires igcChange - Emitted when the control's checked state changes.\n * @fires igcCancel - Emitted when the control's file picker dialog is canceled.\n *\n * @csspart container - The main wrapper that holds all main input elements.\n * @csspart input - The native input element.\n * @csspart label - The native label element.\n * @csspart file-names - The file names wrapper when input type is 'file'.\n * @csspart file-selector-button - The browse button when input type is 'file'.\n * @csspart prefix - The prefix wrapper.\n * @csspart suffix - The suffix wrapper.\n * @csspart helper-text - The helper text wrapper.\n */\nexport default class IgcFileInputComponent extends EventEmitterMixin<\n  IgcFileInputComponentEventMap,\n  AbstractConstructor<IgcInputBaseComponent>\n>(IgcInputBaseComponent) {\n  public static readonly tagName = 'igc-file-input';\n  public static styles = [...IgcInputBaseComponent.styles, styles];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcFileInputComponent,\n      IgcValidationContainerComponent,\n      IgcButtonComponent\n    );\n  }\n\n  protected override get __validators() {\n    return fileValidators;\n  }\n\n  protected override readonly _formValue: FormValueOf<FileList | null> =\n    createFormValueState(this, {\n      initialValue: null,\n      transformers: defaultFileListTransformer,\n    });\n\n  @state()\n  private _hasActivation = false;\n\n  private get _fileNames(): string | null {\n    if (!this.files || this.files.length === 0) return null;\n\n    return Array.from(this.files)\n      .map((file) => file.name)\n      .join(', ');\n  }\n\n  /* @tsTwoWayProperty(true, \"igcChange\", \"detail\", false) */\n  /**\n   * The value of the control.\n   * @attr\n   */\n  @property()\n  public set value(value: string) {\n    if (value === '' && this.input) {\n      this.input.value = value;\n    }\n  }\n\n  public get value(): string {\n    return this.input?.value ?? '';\n  }\n\n  /**\n   * The multiple attribute of the control.\n   * Used to indicate that a file input allows the user to select more than one file.\n   * @attr\n   */\n  @property({ type: Boolean })\n  public multiple = false;\n\n  /**\n   * The accept attribute of the control.\n   * Defines the file types as a list of comma-separated values that the file input should accept.\n   * @attr\n   */\n  @property({ type: String })\n  public accept = '';\n\n  /**\n   * The autofocus attribute of the control.\n   * @attr\n   */\n  @property({ type: Boolean })\n  public override autofocus!: boolean;\n\n  /**\n   * @internal\n   */\n  @property({ type: Number })\n  public override tabIndex = 0;\n\n  /** @hidden */\n  @property({ type: Boolean, attribute: false, noAccessor: true })\n  public override readonly readOnly = false;\n\n  /** Returns the selected files, if any; otherwise returns null. */\n  public get files(): FileList | null {\n    return this.input?.files ?? null;\n  }\n\n  constructor() {\n    super();\n    addThemingController(this, all);\n  }\n\n  protected override _restoreDefaultValue(): void {\n    this.input.value = '';\n    super._restoreDefaultValue();\n  }\n\n  /* c8 ignore next 2 */\n  /** @hidden */\n  public override setSelectionRange(): void {}\n\n  /* c8 ignore next 2 */\n  /** @hidden */\n  public override setRangeText(): void {}\n\n  private _handleChange(): void {\n    this._hasActivation = false;\n    this._formValue.setValueAndFormState(this.files);\n    this._validate();\n\n    this.requestUpdate();\n    this.emitEvent('igcChange', { detail: this.files! });\n  }\n\n  private _handleCancel(): void {\n    this._hasActivation = false;\n    this._validate();\n\n    this.emitEvent('igcCancel', {\n      detail: this.files!,\n    });\n  }\n\n  protected _handleFocus(): void {\n    this._dirty = true;\n  }\n\n  protected _handleBlur(): void {\n    if (!this._hasActivation) {\n      this._validate();\n    }\n  }\n\n  /* c8 ignore next 3 */\n  protected _handleClick(): void {\n    this._hasActivation = true;\n  }\n\n  protected override renderFileParts() {\n    const emptyText = this.placeholder ?? 'No file chosen';\n\n    return html`\n      <div part=\"file-parts\">\n        <div part=\"file-selector-button\">\n          <igc-button variant=\"flat\" ?disabled=${this.disabled} tabindex=\"-1\">\n            <slot name=\"file-selector-text\">Browse</slot>\n          </igc-button>\n        </div>\n        <div part=\"file-names\">\n          <span>\n            ${this._fileNames ??\n            html`<slot name=\"file-missing-text\">${emptyText}</slot>`}\n          </span>\n        </div>\n      </div>\n    `;\n  }\n\n  protected renderInput() {\n    return html`\n      <input\n        id=${this.inputId}\n        part=${partMap(this.resolvePartNames('input'))}\n        type=\"file\"\n        ?disabled=${this.disabled}\n        ?required=${this.required}\n        ?autofocus=${this.autofocus}\n        ?multiple=${this.multiple}\n        tabindex=${this.tabIndex}\n        accept=${ifDefined(this.accept === '' ? undefined : this.accept)}\n        aria-invalid=${this.invalid}\n        aria-describedby=${ifDefined(\n          isEmpty(this._helperText) ? nothing : 'helper-text'\n        )}\n        @click=${this._handleClick}\n        @change=${this._handleChange}\n        @cancel=${this._handleCancel}\n        @focus=${this._handleFocus}\n        @blur=${this._handleBlur}\n      />\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-file-input': IgcFileInputComponent;\n  }\n}\n"]}
+{"version":3,"file":"file-input.js","sourceRoot":"","sources":["../../../src/components/file-input/file-input.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { AbstractConstructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { FormValueFileListTransformers } from '../common/mixins/forms/form-transformers.js';\nimport { createFormValueState } from '../common/mixins/forms/form-value.js';\nimport { partMap } from '../common/part-map.js';\nimport { isEmpty } from '../common/util.js';\nimport {\n  IgcInputBaseComponent,\n  type IgcInputComponentEventMap,\n} from '../input/input-base.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\nimport { styles } from './themes/file-input.base.css.js';\nimport { all } from './themes/themes.js';\nimport { fileValidators } from './validators.js';\n\nexport interface IgcFileInputComponentEventMap\n  extends Omit<IgcInputComponentEventMap, 'igcChange' | 'igcInput'> {\n  igcCancel: CustomEvent<FileList>;\n  igcChange: CustomEvent<FileList>;\n}\n\n/* blazorSuppress */\n/**\n * @element igc-file-input\n *\n * @slot prefix - Renders content before the input.\n * @slot suffix - Renders content after input.\n * @slot helper-text - Renders content below the input.\n * @slot file-selector-text - Renders content for the browse button when input type is file.\n * @slot file-missing-text - Renders content when input type is file and no file is chosen.\n * @slot value-missing - Renders content when the required validation fails.\n * @slot custom-error - Renders content when setCustomValidity(message) is set.\n * @slot invalid - Renders content when the component is in invalid state (validity.valid = false).\n *\n * @fires igcChange - Emitted when the control's checked state changes.\n * @fires igcCancel - Emitted when the control's file picker dialog is canceled.\n *\n * @csspart container - The main wrapper that holds all main input elements.\n * @csspart input - The native input element.\n * @csspart label - The native label element.\n * @csspart file-names - The file names wrapper when input type is 'file'.\n * @csspart file-selector-button - The browse button when input type is 'file'.\n * @csspart prefix - The prefix wrapper.\n * @csspart suffix - The suffix wrapper.\n * @csspart helper-text - The helper text wrapper.\n */\nexport default class IgcFileInputComponent extends EventEmitterMixin<\n  IgcFileInputComponentEventMap,\n  AbstractConstructor<IgcInputBaseComponent>\n>(IgcInputBaseComponent) {\n  public static readonly tagName = 'igc-file-input';\n  public static styles = [...IgcInputBaseComponent.styles, styles];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcFileInputComponent,\n      IgcValidationContainerComponent,\n      IgcButtonComponent\n    );\n  }\n\n  protected override get __validators() {\n    return fileValidators;\n  }\n\n  protected override readonly _formValue = createFormValueState(this, {\n    initialValue: null,\n    transformers: FormValueFileListTransformers,\n  });\n\n  @state()\n  private _hasActivation = false;\n\n  private get _fileNames(): string | null {\n    if (!this.files || this.files.length === 0) return null;\n\n    return Array.from(this.files)\n      .map((file) => file.name)\n      .join(', ');\n  }\n\n  /* @tsTwoWayProperty(true, \"igcChange\", \"detail\", false) */\n  /**\n   * The value of the control.\n   * @attr\n   */\n  @property()\n  public set value(value: string) {\n    if (value === '' && this.input) {\n      this.input.value = value;\n    }\n  }\n\n  public get value(): string {\n    return this.input?.value ?? '';\n  }\n\n  /**\n   * The multiple attribute of the control.\n   * Used to indicate that a file input allows the user to select more than one file.\n   * @attr\n   */\n  @property({ type: Boolean })\n  public multiple = false;\n\n  /**\n   * The accept attribute of the control.\n   * Defines the file types as a list of comma-separated values that the file input should accept.\n   * @attr\n   */\n  @property({ type: String })\n  public accept = '';\n\n  /**\n   * The autofocus attribute of the control.\n   * @attr\n   */\n  @property({ type: Boolean })\n  public override autofocus!: boolean;\n\n  /**\n   * @internal\n   */\n  @property({ type: Number })\n  public override tabIndex = 0;\n\n  /** @hidden */\n  @property({ type: Boolean, attribute: false, noAccessor: true })\n  public override readonly readOnly = false;\n\n  /** Returns the selected files, if any; otherwise returns null. */\n  public get files(): FileList | null {\n    return this.input?.files ?? null;\n  }\n\n  constructor() {\n    super();\n    addThemingController(this, all);\n  }\n\n  protected override _restoreDefaultValue(): void {\n    this.input.value = '';\n    super._restoreDefaultValue();\n  }\n\n  /* c8 ignore next 2 */\n  /** @hidden */\n  public override setSelectionRange(): void {}\n\n  /* c8 ignore next 2 */\n  /** @hidden */\n  public override setRangeText(): void {}\n\n  private _handleChange(): void {\n    this._hasActivation = false;\n    this._setTouchedState();\n    this._formValue.setValueAndFormState(this.files);\n\n    this.requestUpdate();\n    this.emitEvent('igcChange', { detail: this.files! });\n  }\n\n  private _handleCancel(): void {\n    this._hasActivation = false;\n    this._setTouchedState();\n    this._validate();\n\n    this.emitEvent('igcCancel', {\n      detail: this.files!,\n    });\n  }\n\n  protected override _handleBlur(): void {\n    this._hasActivation ? this._validate() : super._handleBlur();\n  }\n\n  /* c8 ignore next 3 */\n  protected _handleClick(): void {\n    this._hasActivation = true;\n  }\n\n  protected override renderFileParts() {\n    const emptyText = this.placeholder ?? 'No file chosen';\n\n    return html`\n      <div part=\"file-parts\">\n        <div part=\"file-selector-button\">\n          <igc-button variant=\"flat\" ?disabled=${this.disabled} tabindex=\"-1\">\n            <slot name=\"file-selector-text\">Browse</slot>\n          </igc-button>\n        </div>\n        <div part=\"file-names\">\n          <span>\n            ${this._fileNames ??\n            html`<slot name=\"file-missing-text\">${emptyText}</slot>`}\n          </span>\n        </div>\n      </div>\n    `;\n  }\n\n  protected renderInput() {\n    return html`\n      <input\n        id=${this.inputId}\n        part=${partMap(this.resolvePartNames('input'))}\n        type=\"file\"\n        ?disabled=${this.disabled}\n        ?required=${this.required}\n        ?autofocus=${this.autofocus}\n        ?multiple=${this.multiple}\n        tabindex=${this.tabIndex}\n        accept=${ifDefined(this.accept === '' ? undefined : this.accept)}\n        aria-describedby=${ifDefined(\n          isEmpty(this._helperText) ? nothing : 'helper-text'\n        )}\n        @click=${this._handleClick}\n        @change=${this._handleChange}\n        @cancel=${this._handleCancel}\n        @blur=${this._handleBlur}\n      />\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-file-input': IgcFileInputComponent;\n  }\n}\n"]}

package/components/file-input/themes/dark/file-input.bootstrap.css.d.ts

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

package/components/file-input/themes/dark/file-input.bootstrap.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `:host{--file-names-background--disabled: var(--ig-file-names-background--disabled, var(--ig-gray-100));--file-names-foreground: var(--ig-file-names-foreground, var(--ig-gray-700));--file-names-foreground--disabled: var(--ig-file-names-foreground--disabled, var(--ig-gray-400));--file-selector-button-background: var(--ig-file-selector-button-background, var(--ig-gray-300));--file-selector-button-background--focused: var(--ig-file-selector-button-background--focused, var(--ig-gray-300));--file-selector-button-background--filled: var(--ig-file-selector-button-background--filled, var(--ig-gray-300));--file-selector-button-background--disabled: var(--ig-file-selector-button-background--disabled, var(--ig-gray-100));--file-selector-button-foreground: var(--ig-file-selector-button-foreground, var(--ig-gray-800));--file-selector-button-foreground--disabled: var(--ig-file-selector-button-foreground--disabled, var(--ig-gray-400));--ig-theme: bootstrap}`;
+//# sourceMappingURL=file-input.bootstrap.css.js.map

package/components/file-input/themes/dark/file-input.bootstrap.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-input.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/file-input/themes/dark/file-input.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,67BAA67B,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--file-names-background--disabled: var(--ig-file-names-background--disabled, var(--ig-gray-100));--file-names-foreground: var(--ig-file-names-foreground, var(--ig-gray-700));--file-names-foreground--disabled: var(--ig-file-names-foreground--disabled, var(--ig-gray-400));--file-selector-button-background: var(--ig-file-selector-button-background, var(--ig-gray-300));--file-selector-button-background--focused: var(--ig-file-selector-button-background--focused, var(--ig-gray-300));--file-selector-button-background--filled: var(--ig-file-selector-button-background--filled, var(--ig-gray-300));--file-selector-button-background--disabled: var(--ig-file-selector-button-background--disabled, var(--ig-gray-100));--file-selector-button-foreground: var(--ig-file-selector-button-foreground, var(--ig-gray-800));--file-selector-button-foreground--disabled: var(--ig-file-selector-button-foreground--disabled, var(--ig-gray-400));--ig-theme: bootstrap}`;\n"]}

package/components/file-input/themes/dark/file-input.fluent.css.d.ts

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

package/components/file-input/themes/dark/file-input.fluent.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `:host{--file-names-foreground--disabled: var(--ig-file-names-foreground--disabled, var(--ig-gray-300));--file-selector-button-foreground--disabled: var(--ig-file-selector-button-foreground--disabled, var(--ig-gray-200));--ig-theme: fluent}`;
+//# sourceMappingURL=file-input.fluent.css.js.map

package/components/file-input/themes/dark/file-input.fluent.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-input.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/file-input/themes/dark/file-input.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,iPAAiP,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--file-names-foreground--disabled: var(--ig-file-names-foreground--disabled, var(--ig-gray-300));--file-selector-button-foreground--disabled: var(--ig-file-selector-button-foreground--disabled, var(--ig-gray-200));--ig-theme: fluent}`;\n"]}

package/components/file-input/themes/dark/file-input.indigo.css.d.ts

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

package/components/file-input/themes/dark/file-input.indigo.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `:host{--file-names-foreground: var(--ig-file-names-foreground, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--file-names-foreground--focused: var(--ig-file-names-foreground--focused, var(--ig-gray-50-contrast));--file-names-foreground--filled: var(--ig-file-names-foreground--filled, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--file-names-foreground--disabled: var(--ig-file-names-foreground--disabled, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--file-selector-button-foreground: var(--ig-file-selector-button-foreground, var(--ig-primary-500-contrast));--file-selector-button-foreground--focused: var(--ig-file-selector-button-foreground--focused, var(--ig-gray-700));--file-selector-button-foreground--filled: var(--ig-file-selector-button-foreground--filled, var(--ig-gray-700));--file-selector-button-foreground--disabled: var(--ig-file-selector-button-foreground--disabled, hsl(from var(--ig-primary-500-contrast) h s l/0.2));--ig-theme: indigo}`;
+//# sourceMappingURL=file-input.indigo.css.js.map

package/components/file-input/themes/dark/file-input.indigo.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-input.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/file-input/themes/dark/file-input.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,u8BAAu8B,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--file-names-foreground: var(--ig-file-names-foreground, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--file-names-foreground--focused: var(--ig-file-names-foreground--focused, var(--ig-gray-50-contrast));--file-names-foreground--filled: var(--ig-file-names-foreground--filled, hsl(from var(--ig-gray-50-contrast) h s l/0.8));--file-names-foreground--disabled: var(--ig-file-names-foreground--disabled, hsl(from var(--ig-gray-50-contrast) h s l/0.2));--file-selector-button-foreground: var(--ig-file-selector-button-foreground, var(--ig-primary-500-contrast));--file-selector-button-foreground--focused: var(--ig-file-selector-button-foreground--focused, var(--ig-gray-700));--file-selector-button-foreground--filled: var(--ig-file-selector-button-foreground--filled, var(--ig-gray-700));--file-selector-button-foreground--disabled: var(--ig-file-selector-button-foreground--disabled, hsl(from var(--ig-primary-500-contrast) h s l/0.2));--ig-theme: indigo}`;\n"]}

package/components/file-input/themes/dark/file-input.material.css.d.ts

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

package/components/file-input/themes/dark/file-input.material.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `:host{--file-names-foreground: var(--ig-file-names-foreground, var(--ig-gray-700));--file-selector-button-foreground: var(--ig-file-selector-button-foreground, var(--ig-secondary-500));--file-selector-button-foreground--focused: var(--ig-file-selector-button-foreground--focused, var(--ig-secondary-500));--file-selector-button-foreground--filled: var(--ig-file-selector-button-foreground--filled, var(--ig-secondary-500));--ig-theme: material}`;
+//# sourceMappingURL=file-input.material.css.js.map

package/components/file-input/themes/dark/file-input.material.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-input.material.css.js","sourceRoot":"","sources":["../../../../../src/components/file-input/themes/dark/file-input.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,8bAA8b,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--file-names-foreground: var(--ig-file-names-foreground, var(--ig-gray-700));--file-selector-button-foreground: var(--ig-file-selector-button-foreground, var(--ig-secondary-500));--file-selector-button-foreground--focused: var(--ig-file-selector-button-foreground--focused, var(--ig-secondary-500));--file-selector-button-foreground--filled: var(--ig-file-selector-button-foreground--filled, var(--ig-secondary-500));--ig-theme: material}`;\n"]}

package/components/file-input/themes/file-input.base.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host(:is(igc-file-input)) [part~=file-parts]{display:contents}:host(:is(igc-file-input)) [part=file-selector-button]{align-content:center;grid-area:1/2}:host(:is(igc-file-input)) [part=file-selector-button] igc-button::part(base){transition:none}:host(:is(igc-file-input)) [part=file-names]{display:flex;align-items:center;max-height:var(--size);height:100%;grid-area:1/3}:host(:is(igc-file-input)) [part=file-names]>span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host(:is(igc-file-input)) [part~=container]{position:relative;grid-template-columns:auto auto 1fr auto}:host(:is(igc-file-input)) [part~=input]{position:absolute;border:none;inset:0;width:100%;grid-column:2/4;-webkit-appearance:none;-moz-appearance:none;appearance:none;opacity:0}:host(:is(igc-file-input)) [part~=container],:host(:is(igc-file-input)) [part~=input]{height:var(--size)}:host(:is(igc-file-input)) [part~=input]::file-selector-button{width:100%;cursor:auto}:host(:is(igc-file-input)) [part~=suffix]{grid-area:1/4}:host(:not(:disabled)) [part~=input],:host(:not(:disabled)) [part~=input]::file-selector-button{cursor:pointer}:host(:is(igc-file-input):disabled) [part~=file-names],:host(:is(igc-file-input)[disabled]) [part~=file-names]{color:var(--disabled-text-color)}`;
+export const styles = css `:host(:is(igc-file-input)) [part~=file-parts]{display:contents}:host(:is(igc-file-input)) [part=file-selector-button]{align-content:center;grid-area:1/2}:host(:is(igc-file-input)) [part=file-selector-button] igc-button::part(base){transition:none}:host(:is(igc-file-input)) [part=file-names]{display:flex;align-items:center;max-height:var(--size);height:100%;grid-area:1/3;color:var(--file-names-foreground);background:var(--file-names-background)}:host(:is(igc-file-input)) [part=file-names]>span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host(:is(igc-file-input)) [part~=container]{position:relative;grid-template-columns:auto auto 1fr auto}:host(:is(igc-file-input)) [part~=input]{position:absolute;border:none;inset:0;width:100%;grid-column:2/4;-webkit-appearance:none;-moz-appearance:none;appearance:none;opacity:0}:host(:is(igc-file-input)) [part~=container],:host(:is(igc-file-input)) [part~=input]{height:var(--size)}:host(:is(igc-file-input)) [part~=input]::file-selector-button{width:100%;cursor:auto}:host(:is(igc-file-input)) [part~=suffix]{grid-area:1/4}:host(:is(igc-file-input)) [part~=filled] [part~=file-names]{color:var(--file-names-foreground--filled);background:var(--file-names-background--filled)}:host(:is(igc-file-input)) [part~=container]:focus-within [part~=file-names]{color:var(--file-names-foreground--focused);background:var(--file-names-background--focused)}:host(:is(igc-file-input)) [part~=file-selector-button] igc-button{--foreground: var(--file-selector-button-foreground);--disabled-foreground: var(--file-selector-button-foreground--disabled);--background: var(--file-selector-button-background);--disabled-background: var(--file-selector-button-background--disabled);--hover-foreground: var(--foreground);--active-foreground: var(--foreground);--hover-background: var(--background);--active-background: var(--background)}:host(:is(igc-file-input)) [part~=filled] [part~=file-selector-button] igc-button{--foreground: var(--file-selector-button-foreground--filled);--background: var(--file-selector-button-background--filled)}:host(:is(igc-file-input)) [part~=container]:focus-within [part~=file-selector-button] igc-button{--foreground: var(--file-selector-button-foreground--focused);--background: var(--file-selector-button-background--focused)}:host(:not(:disabled)) [part~=input],:host(:not(:disabled)) [part~=input]::file-selector-button{cursor:pointer}:host(:is(igc-file-input):disabled) [part~=file-names],:host(:is(igc-file-input)[disabled]) [part~=file-names]{color:var(--file-names-foreground--disabled);background:var(--file-names-background--disabled)}`;
 //# sourceMappingURL=file-input.base.css.js.map

package/components/file-input/themes/file-input.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"file-input.base.css.js","sourceRoot":"","sources":["../../../../src/components/file-input/themes/file-input.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,kvCAAkvC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host(:is(igc-file-input)) [part~=file-parts]{display:contents}:host(:is(igc-file-input)) [part=file-selector-button]{align-content:center;grid-area:1/2}:host(:is(igc-file-input)) [part=file-selector-button] igc-button::part(base){transition:none}:host(:is(igc-file-input)) [part=file-names]{display:flex;align-items:center;max-height:var(--size);height:100%;grid-area:1/3}:host(:is(igc-file-input)) [part=file-names]>span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host(:is(igc-file-input)) [part~=container]{position:relative;grid-template-columns:auto auto 1fr auto}:host(:is(igc-file-input)) [part~=input]{position:absolute;border:none;inset:0;width:100%;grid-column:2/4;-webkit-appearance:none;-moz-appearance:none;appearance:none;opacity:0}:host(:is(igc-file-input)) [part~=container],:host(:is(igc-file-input)) [part~=input]{height:var(--size)}:host(:is(igc-file-input)) [part~=input]::file-selector-button{width:100%;cursor:auto}:host(:is(igc-file-input)) [part~=suffix]{grid-area:1/4}:host(:not(:disabled)) [part~=input],:host(:not(:disabled)) [part~=input]::file-selector-button{cursor:pointer}:host(:is(igc-file-input):disabled) [part~=file-names],:host(:is(igc-file-input)[disabled]) [part~=file-names]{color:var(--disabled-text-color)}`;\n"]}
+{"version":3,"file":"file-input.base.css.js","sourceRoot":"","sources":["../../../../src/components/file-input/themes/file-input.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,8jFAA8jF,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host(:is(igc-file-input)) [part~=file-parts]{display:contents}:host(:is(igc-file-input)) [part=file-selector-button]{align-content:center;grid-area:1/2}:host(:is(igc-file-input)) [part=file-selector-button] igc-button::part(base){transition:none}:host(:is(igc-file-input)) [part=file-names]{display:flex;align-items:center;max-height:var(--size);height:100%;grid-area:1/3;color:var(--file-names-foreground);background:var(--file-names-background)}:host(:is(igc-file-input)) [part=file-names]>span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host(:is(igc-file-input)) [part~=container]{position:relative;grid-template-columns:auto auto 1fr auto}:host(:is(igc-file-input)) [part~=input]{position:absolute;border:none;inset:0;width:100%;grid-column:2/4;-webkit-appearance:none;-moz-appearance:none;appearance:none;opacity:0}:host(:is(igc-file-input)) [part~=container],:host(:is(igc-file-input)) [part~=input]{height:var(--size)}:host(:is(igc-file-input)) [part~=input]::file-selector-button{width:100%;cursor:auto}:host(:is(igc-file-input)) [part~=suffix]{grid-area:1/4}:host(:is(igc-file-input)) [part~=filled] [part~=file-names]{color:var(--file-names-foreground--filled);background:var(--file-names-background--filled)}:host(:is(igc-file-input)) [part~=container]:focus-within [part~=file-names]{color:var(--file-names-foreground--focused);background:var(--file-names-background--focused)}:host(:is(igc-file-input)) [part~=file-selector-button] igc-button{--foreground: var(--file-selector-button-foreground);--disabled-foreground: var(--file-selector-button-foreground--disabled);--background: var(--file-selector-button-background);--disabled-background: var(--file-selector-button-background--disabled);--hover-foreground: var(--foreground);--active-foreground: var(--foreground);--hover-background: var(--background);--active-background: var(--background)}:host(:is(igc-file-input)) [part~=filled] [part~=file-selector-button] igc-button{--foreground: var(--file-selector-button-foreground--filled);--background: var(--file-selector-button-background--filled)}:host(:is(igc-file-input)) [part~=container]:focus-within [part~=file-selector-button] igc-button{--foreground: var(--file-selector-button-foreground--focused);--background: var(--file-selector-button-background--focused)}:host(:not(:disabled)) [part~=input],:host(:not(:disabled)) [part~=input]::file-selector-button{cursor:pointer}:host(:is(igc-file-input):disabled) [part~=file-names],:host(:is(igc-file-input)[disabled]) [part~=file-names]{color:var(--file-names-foreground--disabled);background:var(--file-names-background--disabled)}`;\n"]}

package/components/file-input/themes/light/file-input.bootstrap.css.d.ts

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

package/components/file-input/themes/light/file-input.bootstrap.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `:host{--file-names-background--disabled: var(--ig-file-names-background--disabled, var(--ig-gray-100));--file-names-foreground: var(--ig-file-names-foreground, var(--ig-gray-700));--file-names-foreground--disabled: var(--ig-file-names-foreground--disabled, var(--ig-gray-400));--file-selector-button-background: var(--ig-file-selector-button-background, var(--ig-gray-300));--file-selector-button-background--focused: var(--ig-file-selector-button-background--focused, var(--ig-gray-300));--file-selector-button-background--filled: var(--ig-file-selector-button-background--filled, var(--ig-gray-300));--file-selector-button-background--disabled: var(--ig-file-selector-button-background--disabled, var(--ig-gray-100));--file-selector-button-foreground: var(--ig-file-selector-button-foreground, var(--ig-gray-800));--file-selector-button-foreground--disabled: var(--ig-file-selector-button-foreground--disabled, var(--ig-gray-400));--ig-theme: bootstrap}`;
+//# sourceMappingURL=file-input.bootstrap.css.js.map

package/components/file-input/themes/light/file-input.bootstrap.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-input.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/file-input/themes/light/file-input.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,67BAA67B,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--file-names-background--disabled: var(--ig-file-names-background--disabled, var(--ig-gray-100));--file-names-foreground: var(--ig-file-names-foreground, var(--ig-gray-700));--file-names-foreground--disabled: var(--ig-file-names-foreground--disabled, var(--ig-gray-400));--file-selector-button-background: var(--ig-file-selector-button-background, var(--ig-gray-300));--file-selector-button-background--focused: var(--ig-file-selector-button-background--focused, var(--ig-gray-300));--file-selector-button-background--filled: var(--ig-file-selector-button-background--filled, var(--ig-gray-300));--file-selector-button-background--disabled: var(--ig-file-selector-button-background--disabled, var(--ig-gray-100));--file-selector-button-foreground: var(--ig-file-selector-button-foreground, var(--ig-gray-800));--file-selector-button-foreground--disabled: var(--ig-file-selector-button-foreground--disabled, var(--ig-gray-400));--ig-theme: bootstrap}`;\n"]}

package/components/file-input/themes/light/file-input.fluent.css.d.ts

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

package/components/file-input/themes/light/file-input.fluent.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `:host{--ig-theme: fluent}`;
+//# sourceMappingURL=file-input.fluent.css.js.map

package/components/file-input/themes/light/file-input.fluent.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-input.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/file-input/themes/light/file-input.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,2BAA2B,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--ig-theme: fluent}`;\n"]}

package/components/file-input/themes/light/file-input.indigo.css.d.ts

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

package/components/file-input/themes/light/file-input.indigo.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `:host{--file-names-foreground: var(--ig-file-names-foreground, var(--ig-gray-800));--file-names-foreground--filled: var(--ig-file-names-foreground--filled, var(--ig-gray-800));--file-names-foreground--disabled: var(--ig-file-names-foreground--disabled, hsl(from var(--ig-gray-900) h s l/0.2));--file-selector-button-foreground: var(--ig-file-selector-button-foreground, var(--ig-gray-700));--file-selector-button-foreground--focused: var(--ig-file-selector-button-foreground--focused, var(--ig-gray-700));--file-selector-button-foreground--filled: var(--ig-file-selector-button-foreground--filled, var(--ig-gray-700));--file-selector-button-foreground--disabled: var(--ig-file-selector-button-foreground--disabled, hsl(from var(--ig-gray-900) h s l/0.2));--ig-theme: indigo}`;
+//# sourceMappingURL=file-input.indigo.css.js.map