igniteui-webcomponents 4.5.0 → 4.7.0

package/components/tabs/tabs.js

@@ -5,23 +5,21 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 var IgcTabsComponent_1;
-import { html, LitElement, nothing } from 'lit';
+import { LitElement, html, nothing } from 'lit';
 import { eventOptions, property, query, queryAssignedElements, state, } from 'lit/decorators.js';
+import IgcTabPanelComponent from './tab-panel.js';
+import IgcTabComponent from './tab.js';
+import { styles as shared } from './themes/shared/tabs/tabs.common.css.js';
+import { all } from './themes/tabs-themes.js';
+import { styles } from './themes/tabs.base.css.js';
+import { getAttributesForTags, getNodesForTags, observerConfig, } from './utils.js';
 import { themes } from '../../theming/theming-decorator.js';
+import IgcIconButtonComponent from '../button/icon-button.js';
 import { blazorAdditionalDependencies } from '../common/decorators/blazorAdditionalDependencies.js';
 import { watch } from '../common/decorators/watch.js';
+import { registerComponent } from '../common/definitions/register.js';
 import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
 import { createCounter, getOffset, isLTR } from '../common/util.js';
-import { styles } from './themes/light/tabs.base.css.js';
-import { styles as material } from './themes/light/tabs.material.css.js';
-import { styles as bootstrap } from './themes/light/tabs.bootstrap.css.js';
-import { styles as fluent } from './themes/light/tabs.fluent.css.js';
-import { styles as indigo } from './themes/light/tabs.indigo.css.js';
-import { getAttributesForTags, getNodesForTags, observerConfig, } from './utils.js';
-import IgcIconButtonComponent from '../button/icon-button.js';
-import { registerComponent } from '../common/definitions/register.js';
-import IgcTabPanelComponent from './tab-panel.js';
-import IgcTabComponent from './tab.js';
 let IgcTabsComponent = IgcTabsComponent_1 = class IgcTabsComponent extends EventEmitterMixin(LitElement) {
     constructor() {
         super(...arguments);
@@ -31,11 +29,10 @@ let IgcTabsComponent = IgcTabsComponent_1 = class IgcTabsComponent extends Event
         this.alignment = 'start';
         this.activation = 'auto';
         this.handleKeyDown = (event) => {
-            var _a;
             const { key } = event;
             const enabledTabs = this.enabledTabs;
             const ltr = isLTR(this);
-            let index = enabledTabs.indexOf((_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.closest('igc-tab'));
+            let index = enabledTabs.indexOf(document.activeElement?.closest('igc-tab'));
             switch (key) {
                 case 'ArrowLeft':
                     index = ltr
@@ -78,8 +75,7 @@ let IgcTabsComponent = IgcTabsComponent_1 = class IgcTabsComponent extends Event
         return this.tabs.filter((tab) => !tab.disabled);
     }
     get selected() {
-        var _a, _b;
-        return (_b = (_a = this.activeTab) === null || _a === void 0 ? void 0 : _a.panel) !== null && _b !== void 0 ? _b : '';
+        return this.activeTab?.panel ?? '';
     }
     alignIndicator() {
         const styles = {
@@ -97,19 +93,17 @@ let IgcTabsComponent = IgcTabsComponent_1 = class IgcTabsComponent extends Event
         Object.assign(this.selectedIndicator.style, styles);
     }
     async firstUpdated() {
-        var _a;
         this.showScrollButtons =
             this.container.scrollWidth > this.container.clientWidth;
         await this.updateComplete;
         this.syncAttributes();
         this.setupObserver();
-        this.setSelectedTab((_a = this.tabs.filter((tab) => tab.selected).at(-1)) !== null && _a !== void 0 ? _a : this.enabledTabs.at(0));
+        this.setSelectedTab(this.tabs.filter((tab) => tab.selected).at(-1) ?? this.enabledTabs.at(0));
         this.updateSelectedTab();
     }
     disconnectedCallback() {
-        var _a, _b;
-        (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
-        (_b = this.mutationObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
+        this.resizeObserver?.disconnect();
+        this.mutationObserver?.disconnect();
         super.disconnectedCallback();
     }
     updateButtonsOnResize() {
@@ -132,9 +126,8 @@ let IgcTabsComponent = IgcTabsComponent_1 = class IgcTabsComponent extends Event
         });
         [this.container, this.wrapper, ...this.tabs].forEach((element) => this.resizeObserver.observe(element));
         this.mutationObserver = new MutationObserver(async (records, observer) => {
-            var _a;
             observer.disconnect();
-            const attributes = getAttributesForTags(records, 'igc-tab').filter((e) => { var _a; return (_a = e.closest(this.tagName)) === null || _a === void 0 ? void 0 : _a.isSameNode(this); });
+            const attributes = getAttributesForTags(records, 'igc-tab').filter((e) => e.closest(this.tagName)?.isSameNode(this));
             const changed = getNodesForTags(records, this, 'igc-tab');
             if (attributes.length > 0) {
                 this.activeTab = attributes.find((tab) => tab.selected);
@@ -155,7 +148,7 @@ let IgcTabsComponent = IgcTabsComponent_1 = class IgcTabsComponent extends Event
                 this.syncAttributes();
             }
             this.updateSelectedTab();
-            (_a = this.activeTab) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ block: 'nearest' });
+            this.activeTab?.scrollIntoView({ block: 'nearest' });
             this.alignIndicator();
             await this.updateComplete;
             observer.observe(this, observerConfig);
@@ -165,20 +158,20 @@ let IgcTabsComponent = IgcTabsComponent_1 = class IgcTabsComponent extends Event
     updateSelectedTab() {
         this.tabs.forEach((tab) => (tab.selected = tab === this.activeTab));
         this.panels.forEach((panel) => {
-            var _a;
-            panel.hidden = panel.id !== ((_a = this.activeTab) === null || _a === void 0 ? void 0 : _a.panel);
+            panel.hidden = panel.id !== this.activeTab?.panel;
         });
     }
     syncAttributes() {
         const prefix = this.id ? `${this.id}-` : '';
         this.tabs.forEach((tab, index) => {
-            var _a, _b, _c;
             if (!tab.panel) {
                 tab.panel =
-                    (_b = (_a = this.panels.at(index)) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : `${prefix}tab-${IgcTabsComponent_1.increment()}`;
+                    this.panels.at(index)?.id ??
+                        `${prefix}tab-${IgcTabsComponent_1.increment()}`;
             }
-            (_c = this.panels
-                .find((panel) => panel.id === tab.panel)) === null || _c === void 0 ? void 0 : _c.setAttribute('aria-labelledby', tab.id);
+            this.panels
+                .find((panel) => panel.id === tab.panel)
+                ?.setAttribute('aria-labelledby', tab.id);
         });
     }
     setSelectedTab(tab) {
@@ -267,7 +260,7 @@ let IgcTabsComponent = IgcTabsComponent_1 = class IgcTabsComponent extends Event
     }
 };
 IgcTabsComponent.tagName = 'igc-tabs';
-IgcTabsComponent.styles = styles;
+IgcTabsComponent.styles = [styles, shared];
 IgcTabsComponent.increment = createCounter();
 __decorate([
     queryAssignedElements({ selector: 'igc-tab' })
@@ -309,10 +302,7 @@ __decorate([
     eventOptions({ passive: true })
 ], IgcTabsComponent.prototype, "handleScroll", null);
 IgcTabsComponent = IgcTabsComponent_1 = __decorate([
-    themes({
-        light: { material, bootstrap, fluent, indigo },
-        dark: { material, bootstrap, fluent, indigo },
-    }),
+    themes(all, true),
     blazorAdditionalDependencies('IgcTabComponent, IgcTabPanelComponent')
 ], IgcTabsComponent);
 export default IgcTabsComponent;

package/components/tabs/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/components/tabs/tabs.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport {\n  eventOptions,\n  property,\n  query,\n  queryAssignedElements,\n  state,\n} from 'lit/decorators.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { blazorAdditionalDependencies } from '../common/decorators/blazorAdditionalDependencies.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { createCounter, getOffset, isLTR } from '../common/util.js';\nimport { styles } from './themes/light/tabs.base.css.js';\nimport { styles as material } from './themes/light/tabs.material.css.js';\nimport { styles as bootstrap } from './themes/light/tabs.bootstrap.css.js';\nimport { styles as fluent } from './themes/light/tabs.fluent.css.js';\nimport { styles as indigo } from './themes/light/tabs.indigo.css.js';\nimport {\n  getAttributesForTags,\n  getNodesForTags,\n  observerConfig,\n} from './utils.js';\n\nimport IgcIconButtonComponent from '../button/icon-button.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport IgcTabPanelComponent from './tab-panel.js';\nimport IgcTabComponent from './tab.js';\n\nexport interface IgcTabsEventMap {\n  igcChange: CustomEvent<IgcTabComponent>;\n}\n\n/**\n * Represents tabs component\n *\n * @element igc-tabs\n *\n * @fires igcChange - Emitted when the selected tab changes.\n *\n * @slot - Renders the tab header.\n * @slot panel - Renders the tab content.\n *\n * @csspart headers - The wrapper of the tabs including the headers content and the scroll buttons.\n * @csspart headers-content - The container for the tab headers.\n * @csspart headers-wrapper - The wrapper for the tab headers and the selected indicator.\n * @csspart headers-scroll - The container for the headers.\n * @csspart selected-indicator - The selected indicator.\n * @csspart start-scroll-button - The start scroll button displayed when the tabs overflow.\n * @csspart end-scroll-button - The end scroll button displayed when the tabs overflow.\n * @csspart content - The container for the tabs content.\n */\n@themes({\n  light: { material, bootstrap, fluent, indigo },\n  dark: { material, bootstrap, fluent, indigo },\n})\n@blazorAdditionalDependencies('IgcTabComponent, IgcTabPanelComponent')\nexport default class IgcTabsComponent extends EventEmitterMixin<\n  IgcTabsEventMap,\n  Constructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-tabs';\n  public static styles = styles;\n\n  public static register() {\n    registerComponent(\n      this,\n      IgcTabComponent,\n      IgcTabPanelComponent,\n      IgcIconButtonComponent\n    );\n  }\n\n  private static readonly increment = createCounter();\n\n  @queryAssignedElements({ selector: 'igc-tab' })\n  protected tabs!: Array<IgcTabComponent>;\n\n  @queryAssignedElements({ slot: 'panel' })\n  protected panels!: Array<IgcTabPanelComponent>;\n\n  @query('[part=\"headers-wrapper\"]', true)\n  protected wrapper!: HTMLElement;\n\n  @query('[part=\"headers-content\"]', true)\n  protected container!: HTMLElement;\n\n  @query('[part=\"selected-indicator\"]', true)\n  protected selectedIndicator!: HTMLElement;\n\n  @state()\n  protected showScrollButtons = false;\n\n  @state()\n  protected disableStartScrollButton = true;\n\n  @state()\n  protected disableEndScrollButton = false;\n\n  @state()\n  protected activeTab?: IgcTabComponent;\n\n  protected resizeObserver!: ResizeObserver;\n  protected mutationObserver!: MutationObserver;\n\n  protected get enabledTabs() {\n    return this.tabs.filter((tab) => !tab.disabled);\n  }\n\n  /** Returns the currently selected tab. */\n  public get selected(): string {\n    return this.activeTab?.panel ?? '';\n  }\n\n  /**\n   * Sets the alignment for the tab headers\n   * @attr\n   */\n  @property({ reflect: true })\n  public alignment: 'start' | 'end' | 'center' | 'justify' = 'start';\n\n  /**\n   * Determines the tab activation. When set to auto,\n   * the tab is instantly selected while navigating with the Left/Right Arrows, Home or End keys\n   * and the corresponding panel is displayed.\n   * When set to manual, the tab is only focused. The selection happens after pressing Space or Enter.\n   * @attr\n   */\n  @property()\n  public activation: 'auto' | 'manual' = 'auto';\n\n  @watch('alignment', { waitUntilFirstUpdate: true })\n  protected alignIndicator() {\n    const styles: Partial<CSSStyleDeclaration> = {\n      visibility: this.activeTab ? 'visible' : 'hidden',\n      transitionDuration: '0.3s',\n    };\n\n    if (this.activeTab) {\n      Object.assign(styles, {\n        width: `${this.activeTab!.offsetWidth}px`,\n        transform: `translate(${\n          isLTR(this)\n            ? getOffset(this.activeTab!, this.wrapper).left\n            : getOffset(this.activeTab!, this.wrapper).right\n        }px)`,\n      });\n    }\n\n    Object.assign(this.selectedIndicator.style, styles);\n  }\n\n  protected override async firstUpdated() {\n    this.showScrollButtons =\n      this.container.scrollWidth > this.container.clientWidth;\n\n    await this.updateComplete;\n\n    this.syncAttributes();\n    this.setupObserver();\n    this.setSelectedTab(\n      this.tabs.filter((tab) => tab.selected).at(-1) ?? this.enabledTabs.at(0)\n    );\n    this.updateSelectedTab();\n  }\n\n  public override disconnectedCallback() {\n    this.resizeObserver?.disconnect();\n    this.mutationObserver?.disconnect();\n    super.disconnectedCallback();\n  }\n\n  protected updateButtonsOnResize() {\n    // Hide the buttons in the resize observer callback and synchronously update the DOM\n    // in order to get the actual size\n    this.showScrollButtons = false;\n    this.performUpdate();\n\n    this.showScrollButtons =\n      this.container.scrollWidth > this.container.clientWidth;\n\n    this.updateScrollButtons();\n  }\n\n  protected updateScrollButtons() {\n    const { scrollLeft, offsetWidth } = this.container,\n      { scrollWidth } = this.wrapper;\n\n    this.disableEndScrollButton =\n      scrollWidth <= Math.abs(scrollLeft) + offsetWidth;\n    this.disableStartScrollButton = scrollLeft === 0;\n  }\n\n  protected setupObserver() {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.updateButtonsOnResize();\n      this.alignIndicator();\n    });\n\n    [this.container, this.wrapper, ...this.tabs].forEach((element) =>\n      this.resizeObserver.observe(element)\n    );\n\n    this.mutationObserver = new MutationObserver(async (records, observer) => {\n      // Stop observing while handling changes\n      observer.disconnect();\n\n      const attributes = getAttributesForTags<IgcTabComponent>(\n        records,\n        'igc-tab'\n      ).filter((e) => e.closest(this.tagName)?.isSameNode(this));\n\n      const changed = getNodesForTags<IgcTabComponent>(\n        records,\n        this,\n        'igc-tab'\n      );\n\n      if (attributes.length > 0) {\n        this.activeTab = attributes.find((tab) => tab.selected);\n      }\n\n      if (changed) {\n        changed.addedNodes.forEach((tab) => {\n          this.resizeObserver.observe(tab);\n          if (tab.selected) {\n            this.activeTab = tab;\n          }\n        });\n        changed.removedNodes.forEach((tab) => {\n          this.resizeObserver.unobserve(tab);\n          if (tab.selected || this.activeTab === tab) {\n            this.activeTab = undefined;\n          }\n        });\n\n        this.syncAttributes();\n      }\n\n      this.updateSelectedTab();\n      this.activeTab?.scrollIntoView({ block: 'nearest' });\n      this.alignIndicator();\n\n      // Watch for changes again\n      await this.updateComplete;\n      observer.observe(this, observerConfig);\n    });\n\n    this.mutationObserver.observe(this, observerConfig);\n  }\n\n  protected updateSelectedTab() {\n    this.tabs.forEach((tab) => (tab.selected = tab === this.activeTab));\n    this.panels.forEach((panel) => {\n      panel.hidden = panel.id !== this.activeTab?.panel;\n    });\n  }\n\n  protected syncAttributes() {\n    const prefix = this.id ? `${this.id}-` : '';\n    this.tabs.forEach((tab, index) => {\n      if (!tab.panel) {\n        tab.panel =\n          this.panels.at(index)?.id ??\n          `${prefix}tab-${IgcTabsComponent.increment()}`;\n      }\n      this.panels\n        .find((panel) => panel.id === tab.panel)\n        ?.setAttribute('aria-labelledby', tab.id);\n    });\n  }\n\n  private setSelectedTab(tab?: IgcTabComponent) {\n    if (!tab || tab === this.activeTab) {\n      return;\n    }\n\n    if (this.activeTab) {\n      this.activeTab.selected = false;\n    }\n\n    this.activeTab = tab;\n    this.activeTab.selected = true;\n  }\n\n  protected scrollByTabOffset(direction: 'start' | 'end') {\n    const { scrollLeft, offsetWidth } = this.container;\n    const LTR = isLTR(this),\n      next = direction === 'end';\n\n    const pivot = Math.abs(next ? offsetWidth + scrollLeft : scrollLeft);\n\n    let amount = this.tabs\n      .map((tab) => ({\n        start: LTR\n          ? getOffset(tab, this.wrapper).left\n          : Math.abs(getOffset(tab, this.wrapper).right),\n        width: tab.offsetWidth,\n      }))\n      .filter((offset) =>\n        next ? offset.start + offset.width > pivot : offset.start < pivot\n      )\n      .at(next ? 0 : -1)!.width;\n\n    amount *= next ? 1 : -1;\n    this.container.scrollBy({ left: LTR ? amount : -amount });\n  }\n\n  protected handleClick(event: MouseEvent) {\n    const target = event.target as HTMLElement;\n    const tab = target.closest('igc-tab');\n\n    if (!(tab && this.contains(tab)) || tab.disabled) {\n      return;\n    }\n\n    tab.focus();\n    this.setSelectedTab(tab);\n    this.emitEvent('igcChange', { detail: this.activeTab });\n  }\n\n  protected handleKeyDown = (event: KeyboardEvent) => {\n    const { key } = event;\n    const enabledTabs = this.enabledTabs;\n    const ltr = isLTR(this);\n\n    let index = enabledTabs.indexOf(\n      document.activeElement?.closest('igc-tab') as IgcTabComponent\n    );\n\n    switch (key) {\n      case 'ArrowLeft':\n        index = ltr\n          ? (enabledTabs.length + index - 1) % enabledTabs.length\n          : (index + 1) % enabledTabs.length;\n        break;\n      case 'ArrowRight':\n        index = ltr\n          ? (index + 1) % enabledTabs.length\n          : (enabledTabs.length + index - 1) % enabledTabs.length;\n        break;\n      case 'Home':\n        index = 0;\n        break;\n      case 'End':\n        index = enabledTabs.length - 1;\n        break;\n      case 'Enter':\n      case ' ':\n        this.setSelectedTab(enabledTabs[index]);\n        break;\n      default:\n        return;\n    }\n\n    enabledTabs[index].focus({ preventScroll: true });\n\n    if (this.activation === 'auto') {\n      this.setSelectedTab(enabledTabs[index]);\n      this.emitEvent('igcChange', { detail: this.activeTab });\n    } else {\n      enabledTabs[index].scrollIntoView({ block: 'nearest' });\n    }\n\n    event.preventDefault();\n  };\n\n  @eventOptions({ passive: true })\n  protected handleScroll() {\n    this.updateScrollButtons();\n  }\n\n  /** Selects the specified tab and displays the corresponding panel.  */\n  public select(name: string) {\n    this.setSelectedTab(this.tabs.find((el) => el.panel === name));\n  }\n\n  protected renderScrollButton(direction: 'start' | 'end') {\n    const start = direction === 'start';\n\n    return this.showScrollButtons\n      ? html`<igc-icon-button\n          tabindex=\"-1\"\n          aria-hidden=\"true\"\n          size=\"large\"\n          variant=\"flat\"\n          collection=\"internal\"\n          part=\"${direction}-scroll-button\"\n          name=\"navigate_${start ? 'before' : 'next'}\"\n          .disabled=${start\n            ? this.disableStartScrollButton\n            : this.disableEndScrollButton}\n          @click=${() => this.scrollByTabOffset(direction)}\n        ></igc-icon-button>`\n      : nothing;\n  }\n\n  protected override render() {\n    return html`\n      <div part=\"headers\">\n        ${this.renderScrollButton('start')}\n        <div part=\"headers-content\" @scroll=${this.handleScroll}>\n          <div part=\"headers-wrapper\">\n            <div\n              part=\"headers-scroll\"\n              role=\"tablist\"\n              @click=${this.handleClick}\n              @keydown=${this.handleKeyDown}\n            >\n              <slot></slot>\n            </div>\n            <div part=\"selected-indicator\"></div>\n          </div>\n        </div>\n        ${this.renderScrollButton('end')}\n      </div>\n      <div part=\"content\">\n        <slot name=\"panel\"></slot>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-tabs': IgcTabsComponent;\n  }\n}\n"]}
+{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/components/tabs/tabs.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport {\n  eventOptions,\n  property,\n  query,\n  queryAssignedElements,\n  state,\n} from 'lit/decorators.js';\n\nimport IgcTabPanelComponent from './tab-panel.js';\nimport IgcTabComponent from './tab.js';\nimport { styles as shared } from './themes/shared/tabs/tabs.common.css.js';\nimport { all } from './themes/tabs-themes.js';\nimport { styles } from './themes/tabs.base.css.js';\nimport {\n  getAttributesForTags,\n  getNodesForTags,\n  observerConfig,\n} from './utils.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport IgcIconButtonComponent from '../button/icon-button.js';\nimport { blazorAdditionalDependencies } from '../common/decorators/blazorAdditionalDependencies.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { createCounter, getOffset, isLTR } from '../common/util.js';\n\nexport interface IgcTabsEventMap {\n  igcChange: CustomEvent<IgcTabComponent>;\n}\n\n/**\n * Represents tabs component\n *\n * @element igc-tabs\n *\n * @fires igcChange - Emitted when the selected tab changes.\n *\n * @slot - Renders the tab header.\n * @slot panel - Renders the tab content.\n *\n * @csspart headers - The wrapper of the tabs including the headers content and the scroll buttons.\n * @csspart headers-content - The container for the tab headers.\n * @csspart headers-wrapper - The wrapper for the tab headers and the selected indicator.\n * @csspart headers-scroll - The container for the headers.\n * @csspart selected-indicator - The selected indicator.\n * @csspart start-scroll-button - The start scroll button displayed when the tabs overflow.\n * @csspart end-scroll-button - The end scroll button displayed when the tabs overflow.\n * @csspart content - The container for the tabs content.\n */\n@themes(all, true)\n@blazorAdditionalDependencies('IgcTabComponent, IgcTabPanelComponent')\nexport default class IgcTabsComponent extends EventEmitterMixin<\n  IgcTabsEventMap,\n  Constructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-tabs';\n  public static styles = [styles, shared];\n\n  public static register() {\n    registerComponent(\n      this,\n      IgcTabComponent,\n      IgcTabPanelComponent,\n      IgcIconButtonComponent\n    );\n  }\n\n  private static readonly increment = createCounter();\n\n  @queryAssignedElements({ selector: 'igc-tab' })\n  protected tabs!: Array<IgcTabComponent>;\n\n  @queryAssignedElements({ slot: 'panel' })\n  protected panels!: Array<IgcTabPanelComponent>;\n\n  @query('[part=\"headers-wrapper\"]', true)\n  protected wrapper!: HTMLElement;\n\n  @query('[part=\"headers-content\"]', true)\n  protected container!: HTMLElement;\n\n  @query('[part=\"selected-indicator\"]', true)\n  protected selectedIndicator!: HTMLElement;\n\n  @state()\n  protected showScrollButtons = false;\n\n  @state()\n  protected disableStartScrollButton = true;\n\n  @state()\n  protected disableEndScrollButton = false;\n\n  @state()\n  protected activeTab?: IgcTabComponent;\n\n  protected resizeObserver!: ResizeObserver;\n  protected mutationObserver!: MutationObserver;\n\n  protected get enabledTabs() {\n    return this.tabs.filter((tab) => !tab.disabled);\n  }\n\n  /** Returns the currently selected tab. */\n  public get selected(): string {\n    return this.activeTab?.panel ?? '';\n  }\n\n  /**\n   * Sets the alignment for the tab headers\n   * @attr\n   */\n  @property({ reflect: true })\n  public alignment: 'start' | 'end' | 'center' | 'justify' = 'start';\n\n  /**\n   * Determines the tab activation. When set to auto,\n   * the tab is instantly selected while navigating with the Left/Right Arrows, Home or End keys\n   * and the corresponding panel is displayed.\n   * When set to manual, the tab is only focused. The selection happens after pressing Space or Enter.\n   * @attr\n   */\n  @property()\n  public activation: 'auto' | 'manual' = 'auto';\n\n  @watch('alignment', { waitUntilFirstUpdate: true })\n  protected alignIndicator() {\n    const styles: Partial<CSSStyleDeclaration> = {\n      visibility: this.activeTab ? 'visible' : 'hidden',\n      transitionDuration: '0.3s',\n    };\n\n    if (this.activeTab) {\n      Object.assign(styles, {\n        width: `${this.activeTab!.offsetWidth}px`,\n        transform: `translate(${\n          isLTR(this)\n            ? getOffset(this.activeTab!, this.wrapper).left\n            : getOffset(this.activeTab!, this.wrapper).right\n        }px)`,\n      });\n    }\n\n    Object.assign(this.selectedIndicator.style, styles);\n  }\n\n  protected override async firstUpdated() {\n    this.showScrollButtons =\n      this.container.scrollWidth > this.container.clientWidth;\n\n    await this.updateComplete;\n\n    this.syncAttributes();\n    this.setupObserver();\n    this.setSelectedTab(\n      this.tabs.filter((tab) => tab.selected).at(-1) ?? this.enabledTabs.at(0)\n    );\n    this.updateSelectedTab();\n  }\n\n  public override disconnectedCallback() {\n    this.resizeObserver?.disconnect();\n    this.mutationObserver?.disconnect();\n    super.disconnectedCallback();\n  }\n\n  protected updateButtonsOnResize() {\n    // Hide the buttons in the resize observer callback and synchronously update the DOM\n    // in order to get the actual size\n    this.showScrollButtons = false;\n    this.performUpdate();\n\n    this.showScrollButtons =\n      this.container.scrollWidth > this.container.clientWidth;\n\n    this.updateScrollButtons();\n  }\n\n  protected updateScrollButtons() {\n    const { scrollLeft, offsetWidth } = this.container,\n      { scrollWidth } = this.wrapper;\n\n    this.disableEndScrollButton =\n      scrollWidth <= Math.abs(scrollLeft) + offsetWidth;\n    this.disableStartScrollButton = scrollLeft === 0;\n  }\n\n  protected setupObserver() {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.updateButtonsOnResize();\n      this.alignIndicator();\n    });\n\n    [this.container, this.wrapper, ...this.tabs].forEach((element) =>\n      this.resizeObserver.observe(element)\n    );\n\n    this.mutationObserver = new MutationObserver(async (records, observer) => {\n      // Stop observing while handling changes\n      observer.disconnect();\n\n      const attributes = getAttributesForTags<IgcTabComponent>(\n        records,\n        'igc-tab'\n      ).filter((e) => e.closest(this.tagName)?.isSameNode(this));\n\n      const changed = getNodesForTags<IgcTabComponent>(\n        records,\n        this,\n        'igc-tab'\n      );\n\n      if (attributes.length > 0) {\n        this.activeTab = attributes.find((tab) => tab.selected);\n      }\n\n      if (changed) {\n        changed.addedNodes.forEach((tab) => {\n          this.resizeObserver.observe(tab);\n          if (tab.selected) {\n            this.activeTab = tab;\n          }\n        });\n        changed.removedNodes.forEach((tab) => {\n          this.resizeObserver.unobserve(tab);\n          if (tab.selected || this.activeTab === tab) {\n            this.activeTab = undefined;\n          }\n        });\n\n        this.syncAttributes();\n      }\n\n      this.updateSelectedTab();\n      this.activeTab?.scrollIntoView({ block: 'nearest' });\n      this.alignIndicator();\n\n      // Watch for changes again\n      await this.updateComplete;\n      observer.observe(this, observerConfig);\n    });\n\n    this.mutationObserver.observe(this, observerConfig);\n  }\n\n  protected updateSelectedTab() {\n    this.tabs.forEach((tab) => (tab.selected = tab === this.activeTab));\n    this.panels.forEach((panel) => {\n      panel.hidden = panel.id !== this.activeTab?.panel;\n    });\n  }\n\n  protected syncAttributes() {\n    const prefix = this.id ? `${this.id}-` : '';\n    this.tabs.forEach((tab, index) => {\n      if (!tab.panel) {\n        tab.panel =\n          this.panels.at(index)?.id ??\n          `${prefix}tab-${IgcTabsComponent.increment()}`;\n      }\n      this.panels\n        .find((panel) => panel.id === tab.panel)\n        ?.setAttribute('aria-labelledby', tab.id);\n    });\n  }\n\n  private setSelectedTab(tab?: IgcTabComponent) {\n    if (!tab || tab === this.activeTab) {\n      return;\n    }\n\n    if (this.activeTab) {\n      this.activeTab.selected = false;\n    }\n\n    this.activeTab = tab;\n    this.activeTab.selected = true;\n  }\n\n  protected scrollByTabOffset(direction: 'start' | 'end') {\n    const { scrollLeft, offsetWidth } = this.container;\n    const LTR = isLTR(this),\n      next = direction === 'end';\n\n    const pivot = Math.abs(next ? offsetWidth + scrollLeft : scrollLeft);\n\n    let amount = this.tabs\n      .map((tab) => ({\n        start: LTR\n          ? getOffset(tab, this.wrapper).left\n          : Math.abs(getOffset(tab, this.wrapper).right),\n        width: tab.offsetWidth,\n      }))\n      .filter((offset) =>\n        next ? offset.start + offset.width > pivot : offset.start < pivot\n      )\n      .at(next ? 0 : -1)!.width;\n\n    amount *= next ? 1 : -1;\n    this.container.scrollBy({ left: LTR ? amount : -amount });\n  }\n\n  protected handleClick(event: MouseEvent) {\n    const target = event.target as HTMLElement;\n    const tab = target.closest('igc-tab');\n\n    if (!(tab && this.contains(tab)) || tab.disabled) {\n      return;\n    }\n\n    tab.focus();\n    this.setSelectedTab(tab);\n    this.emitEvent('igcChange', { detail: this.activeTab });\n  }\n\n  protected handleKeyDown = (event: KeyboardEvent) => {\n    const { key } = event;\n    const enabledTabs = this.enabledTabs;\n    const ltr = isLTR(this);\n\n    let index = enabledTabs.indexOf(\n      document.activeElement?.closest('igc-tab') as IgcTabComponent\n    );\n\n    switch (key) {\n      case 'ArrowLeft':\n        index = ltr\n          ? (enabledTabs.length + index - 1) % enabledTabs.length\n          : (index + 1) % enabledTabs.length;\n        break;\n      case 'ArrowRight':\n        index = ltr\n          ? (index + 1) % enabledTabs.length\n          : (enabledTabs.length + index - 1) % enabledTabs.length;\n        break;\n      case 'Home':\n        index = 0;\n        break;\n      case 'End':\n        index = enabledTabs.length - 1;\n        break;\n      case 'Enter':\n      case ' ':\n        this.setSelectedTab(enabledTabs[index]);\n        break;\n      default:\n        return;\n    }\n\n    enabledTabs[index].focus({ preventScroll: true });\n\n    if (this.activation === 'auto') {\n      this.setSelectedTab(enabledTabs[index]);\n      this.emitEvent('igcChange', { detail: this.activeTab });\n    } else {\n      enabledTabs[index].scrollIntoView({ block: 'nearest' });\n    }\n\n    event.preventDefault();\n  };\n\n  @eventOptions({ passive: true })\n  protected handleScroll() {\n    this.updateScrollButtons();\n  }\n\n  /** Selects the specified tab and displays the corresponding panel.  */\n  public select(name: string) {\n    this.setSelectedTab(this.tabs.find((el) => el.panel === name));\n  }\n\n  protected renderScrollButton(direction: 'start' | 'end') {\n    const start = direction === 'start';\n\n    return this.showScrollButtons\n      ? html`<igc-icon-button\n          tabindex=\"-1\"\n          aria-hidden=\"true\"\n          size=\"large\"\n          variant=\"flat\"\n          collection=\"internal\"\n          part=\"${direction}-scroll-button\"\n          name=\"navigate_${start ? 'before' : 'next'}\"\n          .disabled=${start\n            ? this.disableStartScrollButton\n            : this.disableEndScrollButton}\n          @click=${() => this.scrollByTabOffset(direction)}\n        ></igc-icon-button>`\n      : nothing;\n  }\n\n  protected override render() {\n    return html`\n      <div part=\"headers\">\n        ${this.renderScrollButton('start')}\n        <div part=\"headers-content\" @scroll=${this.handleScroll}>\n          <div part=\"headers-wrapper\">\n            <div\n              part=\"headers-scroll\"\n              role=\"tablist\"\n              @click=${this.handleClick}\n              @keydown=${this.handleKeyDown}\n            >\n              <slot></slot>\n            </div>\n            <div part=\"selected-indicator\"></div>\n          </div>\n        </div>\n        ${this.renderScrollButton('end')}\n      </div>\n      <div part=\"content\">\n        <slot name=\"panel\"></slot>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-tabs': IgcTabsComponent;\n  }\n}\n"]}

package/components/tabs/themes/dark/tab.bootstrap.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css ``;
+export const styles = css `:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-primary-700), var(--ig-primary-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-primary-500), 0.5));--item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-primary-500), 0.5));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-primary-500), 0.5));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));--border-color--hover: var(--ig-tabs-border-color--hover, hsla(var(--ig-gray-200), var(--ig-gray-a)));--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.6666666667) * 0.375rem), 0.375rem))}`;
 //# sourceMappingURL=tab.bootstrap.css.js.map

package/components/tabs/themes/dark/tab.bootstrap.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/dark/tab.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css``;\n"]}
+{"version":3,"file":"tab.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/dark/tab.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,mtEAAmtE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-primary-700), var(--ig-primary-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-primary-500), 0.5));--item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-primary-500), 0.5));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-primary-500), 0.5));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));--border-color--hover: var(--ig-tabs-border-color--hover, hsla(var(--ig-gray-200), var(--ig-gray-a)));--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.6666666667) * 0.375rem), 0.375rem))}`;\n"]}

package/components/tabs/themes/dark/tab.fluent.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css ``;
+export const styles = css `:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-gray-100), 0.5));--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-gray-100), 0.5));--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, transparent);--border-color--hover: var(--ig-tabs-border-color--hover, transparent);--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem))}`;
 //# sourceMappingURL=tab.fluent.css.js.map

package/components/tabs/themes/dark/tab.fluent.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/dark/tab.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css``;\n"]}
+{"version":3,"file":"tab.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/dark/tab.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,snEAAsnE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-gray-100), 0.5));--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-gray-100), 0.5));--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, transparent);--border-color--hover: var(--ig-tabs-border-color--hover, transparent);--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem))}`;\n"]}

package/components/tabs/themes/dark/tab.indigo.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css ``;
+export const styles = css `:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-background: var(--ig-tabs-item-background, transparent);--item-hover-background: var(--ig-tabs-item-hover-background, transparent);--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--item-active-background: var(--ig-tabs-item-active-background, transparent);--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, transparent);--button-hover-background: var(--ig-tabs-button-hover-background, transparent);--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, transparent);--border-color--hover: var(--ig-tabs-border-color--hover, transparent);--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem))}`;
 //# sourceMappingURL=tab.indigo.css.js.map

package/components/tabs/themes/dark/tab.indigo.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/dark/tab.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css``;\n"]}
+{"version":3,"file":"tab.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/dark/tab.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,m+DAAm+D,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-background: var(--ig-tabs-item-background, transparent);--item-hover-background: var(--ig-tabs-item-hover-background, transparent);--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--item-active-background: var(--ig-tabs-item-active-background, transparent);--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, transparent);--button-hover-background: var(--ig-tabs-button-hover-background, transparent);--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, transparent);--border-color--hover: var(--ig-tabs-border-color--hover, transparent);--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem))}`;\n"]}

package/components/tabs/themes/dark/tab.material.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css ``;
+export const styles = css `:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-gray-100), 0.5));--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-gray-100), 0.5));--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, transparent);--border-color--hover: var(--ig-tabs-border-color--hover, transparent);--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem))}`;
 //# sourceMappingURL=tab.material.css.js.map

package/components/tabs/themes/dark/tab.material.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.material.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/dark/tab.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css``;\n"]}
+{"version":3,"file":"tab.material.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/dark/tab.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,snEAAsnE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-gray-100), 0.5));--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-gray-100), 0.5));--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, transparent);--border-color--hover: var(--ig-tabs-border-color--hover, transparent);--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem))}`;\n"]}

package/components/tabs/themes/light/tab.bootstrap.css.js

@@ -1,89 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host {
-  --item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));
-  --item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));
-  --item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));
-  --item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-primary-700), var(--ig-primary-a)));
-  --item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));
-  --item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));
-  --item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));
-  --item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-primary-700), var(--ig-primary-a)));
-  --item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-primary-500), 0.5));
-  --item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));
-  --item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-primary-500), 0.5));
-  --indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));
-  --button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));
-  --button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));
-  --button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));
-  --button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));
-  --button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-primary-500), 0.5));
-  --tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));
-  --button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));
-  --border-color: var(--ig-tabs-border-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));
-  --border-color--hover: var(--ig-tabs-border-color--hover, hsla(var(--ig-gray-200), var(--ig-gray-a)));
-  --border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.6666666667) * 0.375rem), 0.375rem));
-  -webkit-transition: none;
-  transition: none;
-  background: var(--item-background);
-  color: var(--item-text-color);
-  border-radius: var(--border-radius);
-  border-end-end-radius: 0;
-  border-end-start-radius: 0;
-}
-
-:host(:hover) {
-  background: var(--item-hover-background);
-  color: var(--item-hover-color);
-  -webkit-box-shadow: inset 0 0 0 0.0625rem var(--border-color--hover);
-          box-shadow: inset 0 0 0 0.0625rem var(--border-color--hover);
-}
-
-:host([selected]) {
-  color: var(--item-active-color);
-  position: relative;
-  -webkit-box-shadow: inset 0 0 0 0.0625rem var(--border-color);
-          box-shadow: inset 0 0 0 0.0625rem var(--border-color);
-}
-:host([selected]) ::slotted(igc-icon) {
-  color: var(--item-active-icon-color);
-}
-:host([selected])::after {
-  content: "";
-  position: absolute;
-  bottom: 0;
-  inset-inline-start: 0;
-  width: 100%;
-  height: 0.0625rem;
-  background: var(--item-background);
-  z-index: 1;
-}
-
-:host([selected]:hover) {
-  color: var(--item-active-color);
-  border-top-color: var(--border-color);
-  border-inline-color: var(--border-color);
-  border-bottom-color: var(--item-background);
-}
-
-:host(:focus-within),
-:host([selected]:focus-within) {
-  border-radius: var(--border-radius);
-  color: var(--item-hover-color);
-  background: var(--item-background);
-  -webkit-box-shadow: inset 0 0 0 0.125rem var(--item-hover-color);
-          box-shadow: inset 0 0 0 0.125rem var(--item-hover-color);
-  z-index: 1;
-}
-:host(:focus-within)::after,
-:host([selected]:focus-within)::after {
-  display: none;
-}
-
-:host([selected]:focus-within) {
-  color: var(--item-active-color);
-}
-
-:host([disabled]) {
-  color: var(--item-disabled-color);
-}`;
+export const styles = css `:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-primary-700), var(--ig-primary-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-primary-700), var(--ig-primary-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-primary-500), 0.5));--item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-primary-500), 0.5));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-primary-500), 0.5));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));--border-color--hover: var(--ig-tabs-border-color--hover, hsla(var(--ig-gray-200), var(--ig-gray-a)));--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.6666666667) * 0.375rem), 0.375rem))}`;
 //# sourceMappingURL=tab.bootstrap.css.js.map

package/components/tabs/themes/light/tab.bootstrap.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/light/tab.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsFvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  --item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n  --item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));\n  --item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));\n  --item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-primary-700), var(--ig-primary-a)));\n  --item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n  --item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n  --item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));\n  --item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-primary-700), var(--ig-primary-a)));\n  --item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-primary-500), 0.5));\n  --item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));\n  --item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-primary-500), 0.5));\n  --indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n  --button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n  --button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));\n  --button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n  --button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));\n  --button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-primary-500), 0.5));\n  --tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n  --button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n  --border-color: var(--ig-tabs-border-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));\n  --border-color--hover: var(--ig-tabs-border-color--hover, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n  --border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.6666666667) * 0.375rem), 0.375rem));\n  -webkit-transition: none;\n  transition: none;\n  background: var(--item-background);\n  color: var(--item-text-color);\n  border-radius: var(--border-radius);\n  border-end-end-radius: 0;\n  border-end-start-radius: 0;\n}\n\n:host(:hover) {\n  background: var(--item-hover-background);\n  color: var(--item-hover-color);\n  -webkit-box-shadow: inset 0 0 0 0.0625rem var(--border-color--hover);\n          box-shadow: inset 0 0 0 0.0625rem var(--border-color--hover);\n}\n\n:host([selected]) {\n  color: var(--item-active-color);\n  position: relative;\n  -webkit-box-shadow: inset 0 0 0 0.0625rem var(--border-color);\n          box-shadow: inset 0 0 0 0.0625rem var(--border-color);\n}\n:host([selected]) ::slotted(igc-icon) {\n  color: var(--item-active-icon-color);\n}\n:host([selected])::after {\n  content: \"\";\n  position: absolute;\n  bottom: 0;\n  inset-inline-start: 0;\n  width: 100%;\n  height: 0.0625rem;\n  background: var(--item-background);\n  z-index: 1;\n}\n\n:host([selected]:hover) {\n  color: var(--item-active-color);\n  border-top-color: var(--border-color);\n  border-inline-color: var(--border-color);\n  border-bottom-color: var(--item-background);\n}\n\n:host(:focus-within),\n:host([selected]:focus-within) {\n  border-radius: var(--border-radius);\n  color: var(--item-hover-color);\n  background: var(--item-background);\n  -webkit-box-shadow: inset 0 0 0 0.125rem var(--item-hover-color);\n          box-shadow: inset 0 0 0 0.125rem var(--item-hover-color);\n  z-index: 1;\n}\n:host(:focus-within)::after,\n:host([selected]:focus-within)::after {\n  display: none;\n}\n\n:host([selected]:focus-within) {\n  color: var(--item-active-color);\n}\n\n:host([disabled]) {\n  color: var(--item-disabled-color);\n}`;\n"]}
+{"version":3,"file":"tab.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/light/tab.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,mtEAAmtE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-primary-700), var(--ig-primary-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-gray-800), var(--ig-gray-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-primary-700), var(--ig-primary-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-primary-500), 0.5));--item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-primary-500), 0.5));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-primary-500), 0.5));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, hsla(var(--ig-gray-300), var(--ig-gray-a)));--border-color--hover: var(--ig-tabs-border-color--hover, hsla(var(--ig-gray-200), var(--ig-gray-a)));--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.6666666667) * 0.375rem), 0.375rem))}`;\n"]}

package/components/tabs/themes/light/tab.fluent.css.js

@@ -1,57 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host {
-  --item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));
-  --item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));
-  --item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));
-  --item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));
-  --item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));
-  --item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));
-  --item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));
-  --item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));
-  --item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));
-  --item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));
-  --item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));
-  --indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));
-  --button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));
-  --button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));
-  --button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));
-  --button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));
-  --button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));
-  --tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));
-  --button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));
-  --border-color: var(--ig-tabs-border-color, transparent);
-  --border-color--hover: var(--ig-tabs-border-color--hover, transparent);
-  --border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem));
-  background: var(--item-background);
-  color: var(--item-text-color);
-  border-radius: var(--border-radius);
-}
-:host ::slotted(igc-icon) {
-  color: var(--item-icon-color);
-}
-
-:host(:hover),
-:host(:focus-within) {
-  background: var(--item-hover-background);
-  color: var(--item-hover-color);
-}
-
-:host([selected]) {
-  color: var(--item-active-color);
-}
-:host([selected]) ::slotted(igc-icon) {
-  color: var(--item-active-icon-color);
-}
-
-:host([selected]:hover),
-:host([selected]:focus-within) {
-  color: var(--item-active-color);
-}
-
-:host([disabled]) {
-  color: var(--item-disabled-color);
-}
-:host([disabled]) ::slotted(igc-icon) {
-  color: var(--item-disabled-icon-color);
-}`;
+export const styles = css `:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, transparent);--border-color--hover: var(--ig-tabs-border-color--hover, transparent);--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem))}`;
 //# sourceMappingURL=tab.fluent.css.js.map

package/components/tabs/themes/light/tab.fluent.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/light/tab.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsDvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  --item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n  --item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));\n  --item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n  --item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n  --item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n  --item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n  --item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n  --item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n  --item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n  --item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n  --item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n  --indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n  --button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n  --button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));\n  --button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n  --button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));\n  --button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n  --tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n  --button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n  --border-color: var(--ig-tabs-border-color, transparent);\n  --border-color--hover: var(--ig-tabs-border-color--hover, transparent);\n  --border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem));\n  background: var(--item-background);\n  color: var(--item-text-color);\n  border-radius: var(--border-radius);\n}\n:host ::slotted(igc-icon) {\n  color: var(--item-icon-color);\n}\n\n:host(:hover),\n:host(:focus-within) {\n  background: var(--item-hover-background);\n  color: var(--item-hover-color);\n}\n\n:host([selected]) {\n  color: var(--item-active-color);\n}\n:host([selected]) ::slotted(igc-icon) {\n  color: var(--item-active-icon-color);\n}\n\n:host([selected]:hover),\n:host([selected]:focus-within) {\n  color: var(--item-active-color);\n}\n\n:host([disabled]) {\n  color: var(--item-disabled-color);\n}\n:host([disabled]) ::slotted(igc-icon) {\n  color: var(--item-disabled-icon-color);\n}`;\n"]}
+{"version":3,"file":"tab.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/light/tab.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,gpEAAgpE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-background: var(--ig-tabs-item-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--item-hover-background: var(--ig-tabs-item-hover-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--item-active-background: var(--ig-tabs-item-active-background, hsla(var(--ig-gray-200), var(--ig-gray-a)));--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, hsla(var(--ig-surface-500), var(--ig-surface-a)));--button-hover-background: var(--ig-tabs-button-hover-background, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-600), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, transparent);--border-color--hover: var(--ig-tabs-border-color--hover, transparent);--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem))}`;\n"]}

package/components/tabs/themes/light/tab.indigo.css.js

@@ -1,51 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host {
-  --item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));
-  --item-background: var(--ig-tabs-item-background, transparent);
-  --item-hover-background: var(--ig-tabs-item-hover-background, transparent);
-  --item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));
-  --item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));
-  --item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));
-  --item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));
-  --item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));
-  --item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));
-  --item-active-background: var(--ig-tabs-item-active-background, transparent);
-  --item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));
-  --indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));
-  --button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));
-  --button-background: var(--ig-tabs-button-background, transparent);
-  --button-hover-background: var(--ig-tabs-button-hover-background, transparent);
-  --button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));
-  --button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));
-  --tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));
-  --button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));
-  --border-color: var(--ig-tabs-border-color, transparent);
-  --border-color--hover: var(--ig-tabs-border-color--hover, transparent);
-  --border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem));
-  background: var(--item-background);
-  color: var(--item-text-color);
-  border-radius: var(--border-radius);
-}
-
-:host(:hover),
-:host(:focus-within) {
-  background: var(--item-hover-background);
-  color: var(--item-hover-color);
-}
-
-:host([selected]) {
-  color: var(--item-active-color);
-}
-:host([selected]) ::slotted(igc-icon) {
-  color: var(--item-active-icon-color);
-}
-
-:host([selected]:hover),
-:host([selected]:focus-within) {
-  color: var(--item-active-color);
-}
-
-:host([disabled]) {
-  color: var(--item-disabled-color);
-}`;
+export const styles = css `:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-background: var(--ig-tabs-item-background, transparent);--item-hover-background: var(--ig-tabs-item-hover-background, transparent);--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--item-active-background: var(--ig-tabs-item-active-background, transparent);--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, transparent);--button-hover-background: var(--ig-tabs-button-hover-background, transparent);--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, transparent);--border-color--hover: var(--ig-tabs-border-color--hover, transparent);--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem))}`;
 //# sourceMappingURL=tab.indigo.css.js.map

package/components/tabs/themes/light/tab.indigo.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/light/tab.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgDvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  --item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n  --item-background: var(--ig-tabs-item-background, transparent);\n  --item-hover-background: var(--ig-tabs-item-hover-background, transparent);\n  --item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n  --item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n  --item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n  --item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));\n  --item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n  --item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n  --item-active-background: var(--ig-tabs-item-active-background, transparent);\n  --item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n  --indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));\n  --button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));\n  --button-background: var(--ig-tabs-button-background, transparent);\n  --button-hover-background: var(--ig-tabs-button-hover-background, transparent);\n  --button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));\n  --button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));\n  --tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n  --button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));\n  --border-color: var(--ig-tabs-border-color, transparent);\n  --border-color--hover: var(--ig-tabs-border-color--hover, transparent);\n  --border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem));\n  background: var(--item-background);\n  color: var(--item-text-color);\n  border-radius: var(--border-radius);\n}\n\n:host(:hover),\n:host(:focus-within) {\n  background: var(--item-hover-background);\n  color: var(--item-hover-color);\n}\n\n:host([selected]) {\n  color: var(--item-active-color);\n}\n:host([selected]) ::slotted(igc-icon) {\n  color: var(--item-active-icon-color);\n}\n\n:host([selected]:hover),\n:host([selected]:focus-within) {\n  color: var(--item-active-color);\n}\n\n:host([disabled]) {\n  color: var(--item-disabled-color);\n}`;\n"]}
+{"version":3,"file":"tab.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/tabs/themes/light/tab.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,m+DAAm+D,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--item-text-color: var(--ig-tabs-item-text-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-background: var(--ig-tabs-item-background, transparent);--item-hover-background: var(--ig-tabs-item-hover-background, transparent);--item-hover-color: var(--ig-tabs-item-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-active-color: var(--ig-tabs-item-active-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-icon-color: var(--ig-tabs-item-icon-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--item-active-icon-color: var(--ig-tabs-item-active-icon-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));--item-hover-icon-color: var(--ig-tabs-item-hover-icon-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--item-disabled-icon-color: var(--ig-tabs-item-disabled-icon-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--item-active-background: var(--ig-tabs-item-active-background, transparent);--item-disabled-color: var(--ig-tabs-item-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--indicator-color: var(--ig-tabs-indicator-color, hsla(var(--ig-primary-400), var(--ig-primary-a)));--button-color: var(--ig-tabs-button-color, hsla(var(--ig-gray-700), var(--ig-gray-a)));--button-background: var(--ig-tabs-button-background, transparent);--button-hover-background: var(--ig-tabs-button-hover-background, transparent);--button-hover-color: var(--ig-tabs-button-hover-color, hsla(var(--ig-gray-900), var(--ig-gray-a)));--button-disabled-color: var(--ig-tabs-button-disabled-color, hsla(var(--ig-gray-500), var(--ig-gray-a)));--tab-ripple-color: var(--ig-tabs-tab-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--button-ripple-color: var(--ig-tabs-button-ripple-color, hsla(var(--ig-gray-100), var(--ig-gray-a)));--border-color: var(--ig-tabs-border-color, transparent);--border-color--hover: var(--ig-tabs-border-color--hover, transparent);--border-radius: var(--ig-tabs-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0) * 0.375rem), 0.375rem))}`;\n"]}