igniteui-webcomponents 4.5.0 → 4.7.0

package/components/stepper/themes/step/themes.js

@@ -0,0 +1,42 @@
+import { css } from 'lit';
+import { styles as bootstrapDark } from './dark/step.bootstrap.css.js';
+import { styles as fluentDark } from './dark/step.fluent.css.js';
+import { styles as indigoDark } from './dark/step.indigo.css.js';
+import { styles as materialDark } from './dark/step.material.css.js';
+import { styles as bootstrapLight } from './light/step.bootstrap.css.js';
+import { styles as fluentLight } from './light/step.fluent.css.js';
+import { styles as indigoLight } from './light/step.indigo.css.js';
+import { styles as materialLight } from './light/step.material.css.js';
+import { styles as bootstrap } from './shared/step.bootstrap.css.js';
+import { styles as fluent } from './shared/step.fluent.css.js';
+import { styles as indigo } from './shared/step.indigo.css.js';
+const light = {
+    bootstrap: css `
+    ${bootstrap} ${bootstrapLight}
+  `,
+    material: css `
+    ${materialLight}
+  `,
+    fluent: css `
+    ${fluent} ${fluentLight}
+  `,
+    indigo: css `
+    ${indigo} ${indigoLight}
+  `,
+};
+const dark = {
+    bootstrap: css `
+    ${bootstrap} ${bootstrapDark}
+  `,
+    material: css `
+    ${materialDark}
+  `,
+    fluent: css `
+    ${fluent} ${fluentDark}
+  `,
+    indigo: css `
+    ${indigo} ${indigoDark}
+  `,
+};
+export const all = { light, dark };
+//# sourceMappingURL=themes.js.map

package/components/stepper/themes/step/themes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/step/themes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAG1B,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,8BAA8B,CAAC;AACvE,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAErE,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAEvE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAG/D,MAAM,KAAK,GAAG;IACZ,SAAS,EAAE,GAAG,CAAA;MACV,SAAS,IAAI,cAAc;GAC9B;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,aAAa;GAChB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,WAAW;GACxB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,WAAW;GACxB;CACF,CAAC;AAEF,MAAM,IAAI,GAAG;IACX,SAAS,EAAE,GAAG,CAAA;MACV,SAAS,IAAI,aAAa;GAC7B;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,YAAY;GACf;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,UAAU;GACvB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,UAAU;GACvB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,GAAG,GAAW,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\n// Dark Overrides\nimport { styles as bootstrapDark } from './dark/step.bootstrap.css.js';\nimport { styles as fluentDark } from './dark/step.fluent.css.js';\nimport { styles as indigoDark } from './dark/step.indigo.css.js';\nimport { styles as materialDark } from './dark/step.material.css.js';\n// Light Overrides\nimport { styles as bootstrapLight } from './light/step.bootstrap.css.js';\nimport { styles as fluentLight } from './light/step.fluent.css.js';\nimport { styles as indigoLight } from './light/step.indigo.css.js';\nimport { styles as materialLight } from './light/step.material.css.js';\n// Shared Styles\nimport { styles as bootstrap } from './shared/step.bootstrap.css.js';\nimport { styles as fluent } from './shared/step.fluent.css.js';\nimport { styles as indigo } from './shared/step.indigo.css.js';\nimport { Themes } from '../../../../theming/types.js';\n\nconst light = {\n  bootstrap: css`\n    ${bootstrap} ${bootstrapLight}\n  `,\n  material: css`\n    ${materialLight}\n  `,\n  fluent: css`\n    ${fluent} ${fluentLight}\n  `,\n  indigo: css`\n    ${indigo} ${indigoLight}\n  `,\n};\n\nconst dark = {\n  bootstrap: css`\n    ${bootstrap} ${bootstrapDark}\n  `,\n  material: css`\n    ${materialDark}\n  `,\n  fluent: css`\n    ${fluent} ${fluentDark}\n  `,\n  indigo: css`\n    ${indigo} ${indigoDark}\n  `,\n};\n\nexport const all: Themes = { light, dark };\n"]}

package/components/stepper/themes/stepper/stepper.base.css.js

@@ -1,144 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host {
-  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);
-  --is-medium: min(
-      clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
-      clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
-  );
-  --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);
-  position: relative;
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  scrollbar-width: var(--ig-scrollbar-size);
-  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);
-}
-:host *,
-:host *::before,
-:host *::after {
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-}
-:host ::-webkit-scrollbar {
-  width: var(--ig-scrollbar-size);
-  height: var(--ig-scrollbar-size);
-  background: var(--ig-scrollbar-track-background);
-}
-:host ::-webkit-scrollbar-thumb {
-  background: var(--ig-scrollbar-thumb-background);
-}
-
-:host([hidden]),
-[hidden] {
-  display: none !important;
-}
-:host {
-  font-family: var(--ig-font-family);
-  overflow: hidden;
-  --margin: 1rem;
-  --body-padding: 1rem;
-  --header-gap: 0.5rem;
-  --header-padding: 0.5rem;
-  --vertical-body-padding: var(--body-padding);
-  --indicator-size: 1.5rem;
-  --indicator-roundness: calc(var(--indicator-size) / 2);
-  --indicator-box-shadow-size: 0.0625rem;
-  --separator-size: 0.0625rem;
-  --separator-type: dashed;
-  --separator-type--completed: solid;
-  --separator-position: calc(var(--header-padding) + (var(--indicator-size) / 2) - (var(--separator-size) / 2));
-  --separator-min-width: 2.25rem;
-  --separator-min-width--header: 0.25rem;
-  --separator-min-width--full: calc(var(--separator-min-width) + var(--separator-min-width--header));
-  --text-min-width: var(--indicator-size);
-  --header-min-width: calc(var(--indicator-size) + (var(--header-padding) * 2));
-  --step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full));
-  --step-min-width--first-step: var(--header-min-width);
-}
-
-:host([orientation=horizontal]) {
-  --horizontal-content-disply: block;
-  --vertical-separator-visibility: none;
-  --horizontal-body-padding: 0.5rem;
-  display: grid;
-  grid-template-columns: minmax(var(--step-min-width--first-step), -webkit-max-content) repeat(calc(var(--steps-count) - 1), minmax(var(--step-min-width), auto));
-  grid-template-columns: minmax(var(--step-min-width--first-step), max-content) repeat(calc(var(--steps-count) - 1), minmax(var(--step-min-width), auto));
-  grid-template-rows: auto 1fr;
-}
-:host([orientation=horizontal]) ::slotted(igc-step) {
-  display: contents;
-  pointer-events: none;
-  --align-text: center;
-  --align-items: center;
-}
-:host([orientation=horizontal]) ::slotted(igc-step:first-of-type) {
-  --horizontal-separator-visibility--first-of-type: none;
-}
-:host([orientation=horizontal]) ::slotted(igc-step:last-of-type) {
-  --horizontal-separator-visibility--last-of-type: none;
-}
-
-:host([orientation=horizontal][title-position=start]),
-:host([orientation=horizontal][title-position=end]) {
-  --step-min-width--first-step: calc(var(--header-min-width) + var(--indicator-size) + var(--header-padding));
-  --step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header) + var(--indicator-size) + var(--header-padding));
-}
-
-::slotted(igc-step:first-of-type) {
-  --horizontal-separator-display--first-of-type: none;
-}
-
-::slotted(igc-step:last-of-type) {
-  --vertical-body-disply--last-of-type: none;
-  --horizontal-separator-display--last-of-type: none;
-}
-
-:host(:not([step-type=full])) {
-  --step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header));
-  --separator-disply-not-full: none;
-}
-:host(:not([step-type=full])) ::slotted(igc-step) {
-  --step-not-full-header-aligmnet: center;
-}
-
-:host([step-type=full]) ::slotted(igc-step) {
-  --step-separator-position: var(--separator-position);
-}
-
-:host([content-top]) ::slotted(igc-step) {
-  --header-bottom: 2;
-  --body-top: 1;
-}
-
-:host(:not([orientation=horizontal])) {
-  --vertical-header-z-index: 2;
-  --vertical-body-disply: block;
-  --vertical-body-height: 0;
-  --header-width-vertical: 100%;
-  --hide-horizontal-separator: none;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  width: 100%;
-}
-:host(:not([orientation=horizontal])) ::slotted(igc-step) {
-  --horizontal-separator-display: none;
-  --step-hide-last-of-type: none;
-  --step-hide-first-of-type: none;
-  --step-width: 100%;
-  --body-indent--vertical: calc(var(--header-padding) + var(--indicator-size) + var(--header-gap));
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-}
-:host(:not([orientation=horizontal])) ::slotted(igc-step:last-of-type) {
-  --hide-last-separator: none;
-}`;
+export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size);height:var(--ig-scrollbar-size);background:var(--ig-scrollbar-track-background)}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background)}:host([hidden]),[hidden]{display:none !important}:host{font-family:var(--ig-font-family);overflow:hidden;--margin: 1rem;--body-padding: 1rem;--header-gap: 0.5rem;--header-padding: 0.5rem;--vertical-body-padding: var(--body-padding);--indicator-size: 1.5rem;--indicator-roundness: calc(var(--indicator-size) / 2);--indicator-box-shadow-size: 0.0625rem;--separator-size: 0.0625rem;--separator-type: dashed;--separator-type--completed: solid;--separator-position: calc(var(--header-padding) + (var(--indicator-size) / 2) - (var(--separator-size) / 2));--separator-min-width: 2.25rem;--separator-min-width--header: 0.25rem;--separator-min-width--full: calc(var(--separator-min-width) + var(--separator-min-width--header));--text-min-width: var(--indicator-size);--header-min-width: calc(var(--indicator-size) + (var(--header-padding) * 2));--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full));--step-min-width--first-step: var(--header-min-width)}:host([orientation=horizontal]){--horizontal-content-disply: block;--vertical-separator-visibility: none;--horizontal-body-padding: 0.5rem;display:grid;grid-template-columns:minmax(var(--step-min-width--first-step), -webkit-max-content) repeat(calc(var(--steps-count) - 1), minmax(var(--step-min-width), auto));grid-template-columns:minmax(var(--step-min-width--first-step), max-content) repeat(calc(var(--steps-count) - 1), minmax(var(--step-min-width), auto));grid-template-rows:auto 1fr}:host([orientation=horizontal]) ::slotted(igc-step){display:contents;pointer-events:none;--align-text: center;--align-items: center}:host([orientation=horizontal]) ::slotted(igc-step:first-of-type){--horizontal-separator-visibility--first-of-type: none}:host([orientation=horizontal]) ::slotted(igc-step:last-of-type){--horizontal-separator-visibility--last-of-type: none}:host([orientation=horizontal][title-position=start]),:host([orientation=horizontal][title-position=end]){--step-min-width--first-step: calc(var(--header-min-width) + var(--indicator-size) + var(--header-padding));--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header) + var(--indicator-size) + var(--header-padding))}::slotted(igc-step:first-of-type){--horizontal-separator-display--first-of-type: none}::slotted(igc-step:last-of-type){--vertical-body-disply--last-of-type: none;--horizontal-separator-display--last-of-type: none}:host(:not([step-type=full])){--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header));--separator-disply-not-full: none}:host(:not([step-type=full])) ::slotted(igc-step){--step-not-full-header-aligmnet: center}:host([step-type=full]) ::slotted(igc-step){--step-separator-position: var(--separator-position)}:host([content-top]) ::slotted(igc-step){--header-bottom: 2;--body-top: 1}:host(:not([orientation=horizontal])){--vertical-header-z-index: 2;--vertical-body-disply: block;--vertical-body-height: 0;--header-width-vertical: 100%;--hide-horizontal-separator: none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%}:host(:not([orientation=horizontal])) ::slotted(igc-step){--horizontal-separator-display: none;--step-hide-last-of-type: none;--step-hide-first-of-type: none;--step-width: 100%;--body-indent--vertical: calc(var(--header-padding) + var(--indicator-size) + var(--header-gap));display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}:host(:not([orientation=horizontal])) ::slotted(igc-step:last-of-type){--hide-last-separator: none}`;
 //# sourceMappingURL=stepper.base.css.js.map

package/components/stepper/themes/stepper/stepper.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.base.css.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/stepper/stepper.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6IvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n  --is-medium: min(\n      clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n      clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n  );\n  --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  scrollbar-width: var(--ig-scrollbar-size);\n  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n  width: var(--ig-scrollbar-size);\n  height: var(--ig-scrollbar-size);\n  background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n  background: var(--ig-scrollbar-thumb-background);\n}\n\n:host([hidden]),\n[hidden] {\n  display: none !important;\n}\n:host {\n  font-family: var(--ig-font-family);\n  overflow: hidden;\n  --margin: 1rem;\n  --body-padding: 1rem;\n  --header-gap: 0.5rem;\n  --header-padding: 0.5rem;\n  --vertical-body-padding: var(--body-padding);\n  --indicator-size: 1.5rem;\n  --indicator-roundness: calc(var(--indicator-size) / 2);\n  --indicator-box-shadow-size: 0.0625rem;\n  --separator-size: 0.0625rem;\n  --separator-type: dashed;\n  --separator-type--completed: solid;\n  --separator-position: calc(var(--header-padding) + (var(--indicator-size) / 2) - (var(--separator-size) / 2));\n  --separator-min-width: 2.25rem;\n  --separator-min-width--header: 0.25rem;\n  --separator-min-width--full: calc(var(--separator-min-width) + var(--separator-min-width--header));\n  --text-min-width: var(--indicator-size);\n  --header-min-width: calc(var(--indicator-size) + (var(--header-padding) * 2));\n  --step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full));\n  --step-min-width--first-step: var(--header-min-width);\n}\n\n:host([orientation=horizontal]) {\n  --horizontal-content-disply: block;\n  --vertical-separator-visibility: none;\n  --horizontal-body-padding: 0.5rem;\n  display: grid;\n  grid-template-columns: minmax(var(--step-min-width--first-step), -webkit-max-content) repeat(calc(var(--steps-count) - 1), minmax(var(--step-min-width), auto));\n  grid-template-columns: minmax(var(--step-min-width--first-step), max-content) repeat(calc(var(--steps-count) - 1), minmax(var(--step-min-width), auto));\n  grid-template-rows: auto 1fr;\n}\n:host([orientation=horizontal]) ::slotted(igc-step) {\n  display: contents;\n  pointer-events: none;\n  --align-text: center;\n  --align-items: center;\n}\n:host([orientation=horizontal]) ::slotted(igc-step:first-of-type) {\n  --horizontal-separator-visibility--first-of-type: none;\n}\n:host([orientation=horizontal]) ::slotted(igc-step:last-of-type) {\n  --horizontal-separator-visibility--last-of-type: none;\n}\n\n:host([orientation=horizontal][title-position=start]),\n:host([orientation=horizontal][title-position=end]) {\n  --step-min-width--first-step: calc(var(--header-min-width) + var(--indicator-size) + var(--header-padding));\n  --step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header) + var(--indicator-size) + var(--header-padding));\n}\n\n::slotted(igc-step:first-of-type) {\n  --horizontal-separator-display--first-of-type: none;\n}\n\n::slotted(igc-step:last-of-type) {\n  --vertical-body-disply--last-of-type: none;\n  --horizontal-separator-display--last-of-type: none;\n}\n\n:host(:not([step-type=full])) {\n  --step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header));\n  --separator-disply-not-full: none;\n}\n:host(:not([step-type=full])) ::slotted(igc-step) {\n  --step-not-full-header-aligmnet: center;\n}\n\n:host([step-type=full]) ::slotted(igc-step) {\n  --step-separator-position: var(--separator-position);\n}\n\n:host([content-top]) ::slotted(igc-step) {\n  --header-bottom: 2;\n  --body-top: 1;\n}\n\n:host(:not([orientation=horizontal])) {\n  --vertical-header-z-index: 2;\n  --vertical-body-disply: block;\n  --vertical-body-height: 0;\n  --header-width-vertical: 100%;\n  --hide-horizontal-separator: none;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: vertical;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: column;\n          flex-direction: column;\n  width: 100%;\n}\n:host(:not([orientation=horizontal])) ::slotted(igc-step) {\n  --horizontal-separator-display: none;\n  --step-hide-last-of-type: none;\n  --step-hide-first-of-type: none;\n  --step-width: 100%;\n  --body-indent--vertical: calc(var(--header-padding) + var(--indicator-size) + var(--header-gap));\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: vertical;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: column;\n          flex-direction: column;\n}\n:host(:not([orientation=horizontal])) ::slotted(igc-step:last-of-type) {\n  --hide-last-separator: none;\n}`;\n"]}
+{"version":3,"file":"stepper.base.css.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/stepper/stepper.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,++IAA++I,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size);height:var(--ig-scrollbar-size);background:var(--ig-scrollbar-track-background)}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background)}:host([hidden]),[hidden]{display:none !important}:host{font-family:var(--ig-font-family);overflow:hidden;--margin: 1rem;--body-padding: 1rem;--header-gap: 0.5rem;--header-padding: 0.5rem;--vertical-body-padding: var(--body-padding);--indicator-size: 1.5rem;--indicator-roundness: calc(var(--indicator-size) / 2);--indicator-box-shadow-size: 0.0625rem;--separator-size: 0.0625rem;--separator-type: dashed;--separator-type--completed: solid;--separator-position: calc(var(--header-padding) + (var(--indicator-size) / 2) - (var(--separator-size) / 2));--separator-min-width: 2.25rem;--separator-min-width--header: 0.25rem;--separator-min-width--full: calc(var(--separator-min-width) + var(--separator-min-width--header));--text-min-width: var(--indicator-size);--header-min-width: calc(var(--indicator-size) + (var(--header-padding) * 2));--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full));--step-min-width--first-step: var(--header-min-width)}:host([orientation=horizontal]){--horizontal-content-disply: block;--vertical-separator-visibility: none;--horizontal-body-padding: 0.5rem;display:grid;grid-template-columns:minmax(var(--step-min-width--first-step), -webkit-max-content) repeat(calc(var(--steps-count) - 1), minmax(var(--step-min-width), auto));grid-template-columns:minmax(var(--step-min-width--first-step), max-content) repeat(calc(var(--steps-count) - 1), minmax(var(--step-min-width), auto));grid-template-rows:auto 1fr}:host([orientation=horizontal]) ::slotted(igc-step){display:contents;pointer-events:none;--align-text: center;--align-items: center}:host([orientation=horizontal]) ::slotted(igc-step:first-of-type){--horizontal-separator-visibility--first-of-type: none}:host([orientation=horizontal]) ::slotted(igc-step:last-of-type){--horizontal-separator-visibility--last-of-type: none}:host([orientation=horizontal][title-position=start]),:host([orientation=horizontal][title-position=end]){--step-min-width--first-step: calc(var(--header-min-width) + var(--indicator-size) + var(--header-padding));--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header) + var(--indicator-size) + var(--header-padding))}::slotted(igc-step:first-of-type){--horizontal-separator-display--first-of-type: none}::slotted(igc-step:last-of-type){--vertical-body-disply--last-of-type: none;--horizontal-separator-display--last-of-type: none}:host(:not([step-type=full])){--step-min-width: calc(var(--header-min-width) + var(--separator-min-width--full) - var(--separator-min-width--header));--separator-disply-not-full: none}:host(:not([step-type=full])) ::slotted(igc-step){--step-not-full-header-aligmnet: center}:host([step-type=full]) ::slotted(igc-step){--step-separator-position: var(--separator-position)}:host([content-top]) ::slotted(igc-step){--header-bottom: 2;--body-top: 1}:host(:not([orientation=horizontal])){--vertical-header-z-index: 2;--vertical-body-disply: block;--vertical-body-height: 0;--header-width-vertical: 100%;--hide-horizontal-separator: none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%}:host(:not([orientation=horizontal])) ::slotted(igc-step){--horizontal-separator-display: none;--step-hide-last-of-type: none;--step-hide-first-of-type: none;--step-width: 100%;--body-indent--vertical: calc(var(--header-padding) + var(--indicator-size) + var(--header-gap));display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}:host(:not([orientation=horizontal])) ::slotted(igc-step:last-of-type){--hide-last-separator: none}`;\n"]}

package/components/stepper/themes/stepper/stepper.bootstrap.css.js

@@ -1,44 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host {
-  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);
-  --is-medium: min(
-      clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
-      clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
-  );
-  --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);
-  position: relative;
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  scrollbar-width: var(--ig-scrollbar-size);
-  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);
-}
-:host *,
-:host *::before,
-:host *::after {
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-}
-:host ::-webkit-scrollbar {
-  width: var(--ig-scrollbar-size);
-  height: var(--ig-scrollbar-size);
-  background: var(--ig-scrollbar-track-background);
-}
-:host ::-webkit-scrollbar-thumb {
-  background: var(--ig-scrollbar-thumb-background);
-}
-
-:host([hidden]),
-[hidden] {
-  display: none !important;
-}
-:host {
-  --header-gap: 0.5rem;
-  --header-padding: 0.5rem;
-  --step-not-top-bottom-min-width: 6rem;
-  --indicator-size: 2.5rem;
-  --indicator-roundness: 0.25rem;
-  --separator-size: 0.5rem;
-  --indicator-box-shadow-size: 0.0625rem;
-  --separator-type: solid;
-}`;
+export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size);height:var(--ig-scrollbar-size);background:var(--ig-scrollbar-track-background)}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background)}:host([hidden]),[hidden]{display:none !important}:host{--header-gap: 0.5rem;--header-padding: 0.5rem;--step-not-top-bottom-min-width: 6rem;--indicator-size: 2.5rem;--indicator-roundness: 0.25rem;--separator-size: 0.5rem;--indicator-box-shadow-size: 0.0625rem;--separator-type: solid}`;
 //# sourceMappingURL=stepper.bootstrap.css.js.map

package/components/stepper/themes/stepper/stepper.bootstrap.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/stepper/stepper.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyCvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n  --is-medium: min(\n      clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n      clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n  );\n  --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  scrollbar-width: var(--ig-scrollbar-size);\n  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n  width: var(--ig-scrollbar-size);\n  height: var(--ig-scrollbar-size);\n  background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n  background: var(--ig-scrollbar-thumb-background);\n}\n\n:host([hidden]),\n[hidden] {\n  display: none !important;\n}\n:host {\n  --header-gap: 0.5rem;\n  --header-padding: 0.5rem;\n  --step-not-top-bottom-min-width: 6rem;\n  --indicator-size: 2.5rem;\n  --indicator-roundness: 0.25rem;\n  --separator-size: 0.5rem;\n  --indicator-box-shadow-size: 0.0625rem;\n  --separator-type: solid;\n}`;\n"]}
+{"version":3,"file":"stepper.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/stepper/stepper.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,wlCAAwlC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size);height:var(--ig-scrollbar-size);background:var(--ig-scrollbar-track-background)}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background)}:host([hidden]),[hidden]{display:none !important}:host{--header-gap: 0.5rem;--header-padding: 0.5rem;--step-not-top-bottom-min-width: 6rem;--indicator-size: 2.5rem;--indicator-roundness: 0.25rem;--separator-size: 0.5rem;--indicator-box-shadow-size: 0.0625rem;--separator-type: solid}`;\n"]}

package/components/stepper/themes/stepper/stepper.fluent.css.js

@@ -1,38 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host {
-  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);
-  --is-medium: min(
-      clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
-      clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
-  );
-  --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);
-  position: relative;
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  scrollbar-width: var(--ig-scrollbar-size);
-  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);
-}
-:host *,
-:host *::before,
-:host *::after {
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-}
-:host ::-webkit-scrollbar {
-  width: var(--ig-scrollbar-size);
-  height: var(--ig-scrollbar-size);
-  background: var(--ig-scrollbar-track-background);
-}
-:host ::-webkit-scrollbar-thumb {
-  background: var(--ig-scrollbar-thumb-background);
-}
-
-:host([hidden]),
-[hidden] {
-  display: none !important;
-}
-:host {
-  --indicator-roundness: 0.125rem;
-  --indicator-box-shadow-size: 0.0625rem;
-}`;
+export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size);height:var(--ig-scrollbar-size);background:var(--ig-scrollbar-track-background)}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background)}:host([hidden]),[hidden]{display:none !important}:host{--indicator-roundness: 0.125rem;--indicator-box-shadow-size: 0.0625rem}`;
 //# sourceMappingURL=stepper.fluent.css.js.map

package/components/stepper/themes/stepper/stepper.fluent.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/stepper/stepper.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmCvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n  --is-medium: min(\n      clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n      clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n  );\n  --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  scrollbar-width: var(--ig-scrollbar-size);\n  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n  width: var(--ig-scrollbar-size);\n  height: var(--ig-scrollbar-size);\n  background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n  background: var(--ig-scrollbar-thumb-background);\n}\n\n:host([hidden]),\n[hidden] {\n  display: none !important;\n}\n:host {\n  --indicator-roundness: 0.125rem;\n  --indicator-box-shadow-size: 0.0625rem;\n}`;\n"]}
+{"version":3,"file":"stepper.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/stepper/stepper.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,27BAA27B,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size);height:var(--ig-scrollbar-size);background:var(--ig-scrollbar-track-background)}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background)}:host([hidden]),[hidden]{display:none !important}:host{--indicator-roundness: 0.125rem;--indicator-box-shadow-size: 0.0625rem}`;\n"]}

package/components/stepper/themes/stepper/stepper.indigo.css.js

@@ -1,38 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host {
-  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);
-  --is-medium: min(
-      clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
-      clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
-  );
-  --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);
-  position: relative;
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  scrollbar-width: var(--ig-scrollbar-size);
-  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);
-}
-:host *,
-:host *::before,
-:host *::after {
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-}
-:host ::-webkit-scrollbar {
-  width: var(--ig-scrollbar-size);
-  height: var(--ig-scrollbar-size);
-  background: var(--ig-scrollbar-track-background);
-}
-:host ::-webkit-scrollbar-thumb {
-  background: var(--ig-scrollbar-thumb-background);
-}
-
-:host([hidden]),
-[hidden] {
-  display: none !important;
-}
-:host {
-  --indicator-box-shadow-size: 0.125rem;
-  --separator-size: 0.125rem;
-}`;
+export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size);height:var(--ig-scrollbar-size);background:var(--ig-scrollbar-track-background)}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background)}:host([hidden]),[hidden]{display:none !important}:host{--indicator-box-shadow-size: 0.125rem;--separator-size: 0.125rem}`;
 //# sourceMappingURL=stepper.indigo.css.js.map

package/components/stepper/themes/stepper/stepper.indigo.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/stepper/stepper.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmCvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n  --is-medium: min(\n      clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n      clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n  );\n  --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  scrollbar-width: var(--ig-scrollbar-size);\n  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n  width: var(--ig-scrollbar-size);\n  height: var(--ig-scrollbar-size);\n  background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n  background: var(--ig-scrollbar-thumb-background);\n}\n\n:host([hidden]),\n[hidden] {\n  display: none !important;\n}\n:host {\n  --indicator-box-shadow-size: 0.125rem;\n  --separator-size: 0.125rem;\n}`;\n"]}
+{"version":3,"file":"stepper.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/stepper/themes/stepper/stepper.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,q7BAAq7B,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size);scrollbar-color:var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background)}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size);height:var(--ig-scrollbar-size);background:var(--ig-scrollbar-track-background)}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background)}:host([hidden]),[hidden]{display:none !important}:host{--indicator-box-shadow-size: 0.125rem;--separator-size: 0.125rem}`;\n"]}

package/components/tabs/tab-panel.js

@@ -1,7 +1,7 @@
-import { html, LitElement } from 'lit';
+import { LitElement, html } from 'lit';
+import { styles } from './themes/tab-panel.base.css.js';
 import { registerComponent } from '../common/definitions/register.js';
 import { createCounter } from '../common/util.js';
-import { styles } from './themes/light/tab-panel.base.css.js';
 class IgcTabPanelComponent extends LitElement {
     static register() {
         registerComponent(this);

package/components/tabs/tab-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab-panel.js","sourceRoot":"","sources":["../../../src/components/tabs/tab-panel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAS9D,MAAqB,oBAAqB,SAAQ,UAAU;IAInD,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IAIe,iBAAiB;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;QACtC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;QAClE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC;QACvD,IAAI,CAAC,EAAE;YACL,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;gBACvB,iBAAiB,oBAAoB,CAAC,SAAS,EAAE,EAAE,CAAC;IACxD,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AArBsB,4BAAO,GAAG,eAAe,CAAC;AAC1B,2BAAM,GAAG,MAAM,CAAC;AAMf,8BAAS,GAAG,aAAa,EAAE,CAAC;eARjC,oBAAoB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { createCounter } from '../common/util.js';\nimport { styles } from './themes/light/tab-panel.base.css.js';\n\n/**\n * Represents the content of a tab\n *\n * @element igc-tab-panel\n *\n * @slot - Renders the content.\n */\nexport default class IgcTabPanelComponent extends LitElement {\n  public static readonly tagName = 'igc-tab-panel';\n  public static override styles = styles;\n\n  public static register() {\n    registerComponent(this);\n  }\n\n  private static readonly increment = createCounter();\n\n  public override connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'tabpanel');\n    this.tabIndex = this.hasAttribute('tabindex') ? this.tabIndex : 0;\n    this.slot = this.slot.length > 0 ? this.slot : 'panel';\n    this.id =\n      this.getAttribute('id') ||\n      `igc-tab-panel-${IgcTabPanelComponent.increment()}`;\n  }\n\n  protected override render() {\n    return html`<slot></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-tab-panel': IgcTabPanelComponent;\n  }\n}\n"]}
+{"version":3,"file":"tab-panel.js","sourceRoot":"","sources":["../../../src/components/tabs/tab-panel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAEvC,OAAO,EAAE,MAAM,EAAE,MAAM,gCAAgC,CAAC;AACxD,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AASlD,MAAqB,oBAAqB,SAAQ,UAAU;IAInD,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IAIe,iBAAiB;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;QACtC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;QAClE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC;QACvD,IAAI,CAAC,EAAE;YACL,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;gBACvB,iBAAiB,oBAAoB,CAAC,SAAS,EAAE,EAAE,CAAC;IACxD,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AArBsB,4BAAO,GAAG,eAAe,CAAC;AAC1B,2BAAM,GAAG,MAAM,CAAC;AAMf,8BAAS,GAAG,aAAa,EAAE,CAAC;eARjC,oBAAoB","sourcesContent":["import { LitElement, html } from 'lit';\n\nimport { styles } from './themes/tab-panel.base.css.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { createCounter } from '../common/util.js';\n\n/**\n * Represents the content of a tab\n *\n * @element igc-tab-panel\n *\n * @slot - Renders the content.\n */\nexport default class IgcTabPanelComponent extends LitElement {\n  public static readonly tagName = 'igc-tab-panel';\n  public static override styles = styles;\n\n  public static register() {\n    registerComponent(this);\n  }\n\n  private static readonly increment = createCounter();\n\n  public override connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'tabpanel');\n    this.tabIndex = this.hasAttribute('tabindex') ? this.tabIndex : 0;\n    this.slot = this.slot.length > 0 ? this.slot : 'panel';\n    this.id =\n      this.getAttribute('id') ||\n      `igc-tab-panel-${IgcTabPanelComponent.increment()}`;\n  }\n\n  protected override render() {\n    return html`<slot></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-tab-panel': IgcTabPanelComponent;\n  }\n}\n"]}

package/components/tabs/tab.d.ts

@@ -14,7 +14,7 @@ import { LitElement } from 'lit';
  */
 export default class IgcTabComponent extends LitElement {
     static readonly tagName = "igc-tab";
-    static styles: import("lit").CSSResult;
+    static styles: import("lit").CSSResult[];
     static register(): void;
     private static readonly increment;
     private tab;

package/components/tabs/tab.js

@@ -5,16 +5,14 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 var IgcTabComponent_1;
-import { html, LitElement } from 'lit';
+import { LitElement, html } from 'lit';
 import { property, query } from 'lit/decorators.js';
+import { styles as shared } from './themes/shared/tab/tab.common.css.js';
+import { all } from './themes/tab-themes.js';
+import { styles } from './themes/tab.base.css.js';
 import { themes } from '../../theming/theming-decorator.js';
 import { registerComponent } from '../common/definitions/register.js';
 import { createCounter } from '../common/util.js';
-import { styles } from './themes/light/tab.base.css.js';
-import { styles as material } from './themes/light/tab.material.css.js';
-import { styles as bootstrap } from './themes/light/tab.bootstrap.css.js';
-import { styles as fluent } from './themes/light/tab.fluent.css.js';
-import { styles as indigo } from './themes/light/tab.indigo.css.js';
 let IgcTabComponent = IgcTabComponent_1 = class IgcTabComponent extends LitElement {
     constructor() {
         super(...arguments);
@@ -55,7 +53,7 @@ let IgcTabComponent = IgcTabComponent_1 = class IgcTabComponent extends LitEleme
     }
 };
 IgcTabComponent.tagName = 'igc-tab';
-IgcTabComponent.styles = styles;
+IgcTabComponent.styles = [styles, shared];
 IgcTabComponent.increment = createCounter();
 __decorate([
     query('[part="base"]', true)
@@ -70,10 +68,7 @@ __decorate([
     property({ type: Boolean, reflect: true })
 ], IgcTabComponent.prototype, "disabled", void 0);
 IgcTabComponent = IgcTabComponent_1 = __decorate([
-    themes({
-        light: { material, bootstrap, fluent, indigo },
-        dark: { material, bootstrap, fluent, indigo },
-    })
+    themes(all, true)
 ], IgcTabComponent);
 export default IgcTabComponent;
 //# sourceMappingURL=tab.js.map

package/components/tabs/tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../src/components/tabs/tab.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,gCAAgC,CAAC;AACxD,OAAO,EAAE,MAAM,IAAI,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AACxE,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAC1E,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,kCAAkC,CAAC;AAmBpE,IAAqB,eAAe,uBAApC,MAAqB,eAAgB,SAAQ,UAAU;IAAvD;;QAkBS,UAAK,GAAG,EAAE,CAAC;QAOX,aAAQ,GAAG,KAAK,CAAC;QAOjB,aAAQ,GAAG,KAAK,CAAC;IAmC1B,CAAC;IA/DQ,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IA4Be,iBAAiB;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,EAAE;YACL,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,WAAW,iBAAe,CAAC,SAAS,EAAE,EAAE,CAAC;IACxE,CAAC;IAGe,KAAK,CAAC,OAAsB;QAC1C,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAC1B,CAAC;IAGe,IAAI;QAClB,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;IAClB,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;wBAIS,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;wBAChC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;mBACrC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;;;KAQtD,CAAC;IACJ,CAAC;;AAjEsB,uBAAO,GAAG,SAAS,AAAZ,CAAa;AACpB,sBAAM,GAAG,MAAM,AAAT,CAAU;AAMf,yBAAS,GAAG,aAAa,EAAE,AAAlB,CAAmB;AAG5C;IADP,KAAK,CAAC,eAAe,EAAE,IAAI,CAAC;4CACH;AAOnB;IADN,QAAQ,EAAE;8CACO;AAOX;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDACnB;AAOjB;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDACnB;AAhCL,eAAe;IAJnC,MAAM,CAAC;QACN,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE;QAC9C,IAAI,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE;KAC9C,CAAC;GACmB,eAAe,CAmEnC;eAnEoB,eAAe","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { createCounter } from '../common/util.js';\nimport { styles } from './themes/light/tab.base.css.js';\nimport { styles as material } from './themes/light/tab.material.css.js';\nimport { styles as bootstrap } from './themes/light/tab.bootstrap.css.js';\nimport { styles as fluent } from './themes/light/tab.fluent.css.js';\nimport { styles as indigo } from './themes/light/tab.indigo.css.js';\n\n/**\n * Represents the tab header.\n *\n * @element igc-tab\n *\n * @slot prefix - Renders before the tab header content.\n * @slot - Renders the tab header content.\n * @slot suffix - Renders after the tab header content.\n *\n * @csspart content - The content wrapper.\n * @csspart prefix - The prefix wrapper.\n * @csspart suffix - The suffix wrapper.\n */\n@themes({\n  light: { material, bootstrap, fluent, indigo },\n  dark: { material, bootstrap, fluent, indigo },\n})\nexport default class IgcTabComponent extends LitElement {\n  public static readonly tagName = 'igc-tab';\n  public static override styles = styles;\n\n  public static register() {\n    registerComponent(this);\n  }\n\n  private static readonly increment = createCounter();\n\n  @query('[part=\"base\"]', true)\n  private tab!: HTMLElement;\n\n  /**\n   * The id of the tab panel which will be controlled by the tab.\n   * @attr\n   */\n  @property()\n  public panel = '';\n\n  /**\n   * Determines whether the tab is selected.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public selected = false;\n\n  /**\n   * Determines whether the tab is disabled.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public disabled = false;\n\n  public override connectedCallback(): void {\n    super.connectedCallback();\n    this.id =\n      this.getAttribute('id') || `igc-tab-${IgcTabComponent.increment()}`;\n  }\n\n  /** Sets focus to the tab. */\n  public override focus(options?: FocusOptions) {\n    this.tab.focus(options);\n  }\n\n  /** Removes focus from the tab. */\n  public override blur() {\n    this.tab.blur();\n  }\n\n  protected override render() {\n    return html`\n      <div\n        part=\"base\"\n        role=\"tab\"\n        aria-disabled=${this.disabled ? 'true' : 'false'}\n        aria-selected=${this.selected ? 'true' : 'false'}\n        tabindex=${this.disabled || !this.selected ? -1 : 0}\n      >\n        <slot name=\"prefix\" part=\"prefix\"></slot>\n        <div part=\"content\">\n          <slot></slot>\n        </div>\n        <slot name=\"suffix\" part=\"suffix\"></slot>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-tab': IgcTabComponent;\n  }\n}\n"]}
+{"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../src/components/tabs/tab.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEpD,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,uCAAuC,CAAC;AACzE,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAiBnC,IAAM,eAAe,uBAArB,MAAM,eAAgB,SAAQ,UAAU;IAAxC;;QAkBN,UAAK,GAAG,EAAE,CAAC;QAOX,aAAQ,GAAG,KAAK,CAAC;QAOjB,aAAQ,GAAG,KAAK,CAAC;IAmC1B,CAAC;IA/DQ,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IA4Be,iBAAiB;QAC/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,EAAE;YACL,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,WAAW,iBAAe,CAAC,SAAS,EAAE,EAAE,CAAC;IACxE,CAAC;IAGe,KAAK,CAAC,OAAsB;QAC1C,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAC1B,CAAC;IAGe,IAAI;QAClB,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;IAClB,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;wBAIS,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;wBAChC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;mBACrC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;;;KAQtD,CAAC;IACJ,CAAC;;AAjEsB,uBAAO,GAAG,SAAS,AAAZ,CAAa;AACpB,sBAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;AAMzB,yBAAS,GAAG,aAAa,EAAE,AAAlB,CAAmB;AAG5C;IADP,KAAK,CAAC,eAAe,EAAE,IAAI,CAAC;4CACH;AAOnB;IADN,QAAQ,EAAE;8CACO;AAOX;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDACnB;AAOjB;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDACnB;AAhCL,eAAe;IADnC,MAAM,CAAC,GAAG,EAAE,IAAI,CAAC;GACG,eAAe,CAmEnC;eAnEoB,eAAe","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property, query } from 'lit/decorators.js';\n\nimport { styles as shared } from './themes/shared/tab/tab.common.css.js';\nimport { all } from './themes/tab-themes.js';\nimport { styles } from './themes/tab.base.css.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { createCounter } from '../common/util.js';\n\n/**\n * Represents the tab header.\n *\n * @element igc-tab\n *\n * @slot prefix - Renders before the tab header content.\n * @slot - Renders the tab header content.\n * @slot suffix - Renders after the tab header content.\n *\n * @csspart content - The content wrapper.\n * @csspart prefix - The prefix wrapper.\n * @csspart suffix - The suffix wrapper.\n */\n\n@themes(all, true)\nexport default class IgcTabComponent extends LitElement {\n  public static readonly tagName = 'igc-tab';\n  public static override styles = [styles, shared];\n\n  public static register() {\n    registerComponent(this);\n  }\n\n  private static readonly increment = createCounter();\n\n  @query('[part=\"base\"]', true)\n  private tab!: HTMLElement;\n\n  /**\n   * The id of the tab panel which will be controlled by the tab.\n   * @attr\n   */\n  @property()\n  public panel = '';\n\n  /**\n   * Determines whether the tab is selected.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public selected = false;\n\n  /**\n   * Determines whether the tab is disabled.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public disabled = false;\n\n  public override connectedCallback(): void {\n    super.connectedCallback();\n    this.id =\n      this.getAttribute('id') || `igc-tab-${IgcTabComponent.increment()}`;\n  }\n\n  /** Sets focus to the tab. */\n  public override focus(options?: FocusOptions) {\n    this.tab.focus(options);\n  }\n\n  /** Removes focus from the tab. */\n  public override blur() {\n    this.tab.blur();\n  }\n\n  protected override render() {\n    return html`\n      <div\n        part=\"base\"\n        role=\"tab\"\n        aria-disabled=${this.disabled ? 'true' : 'false'}\n        aria-selected=${this.selected ? 'true' : 'false'}\n        tabindex=${this.disabled || !this.selected ? -1 : 0}\n      >\n        <slot name=\"prefix\" part=\"prefix\"></slot>\n        <div part=\"content\">\n          <slot></slot>\n        </div>\n        <slot name=\"suffix\" part=\"suffix\"></slot>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-tab': IgcTabComponent;\n  }\n}\n"]}

package/components/tabs/tabs.d.ts

@@ -1,7 +1,7 @@
 import { LitElement, nothing } from 'lit';
-import { Constructor } from '../common/mixins/constructor.js';
 import IgcTabPanelComponent from './tab-panel.js';
 import IgcTabComponent from './tab.js';
+import { Constructor } from '../common/mixins/constructor.js';
 export interface IgcTabsEventMap {
     igcChange: CustomEvent<IgcTabComponent>;
 }
@@ -27,7 +27,7 @@ declare const IgcTabsComponent_base: import("../common/mixins/constructor.js").A
  */
 export default class IgcTabsComponent extends IgcTabsComponent_base {
     static readonly tagName = "igc-tabs";
-    static styles: import("lit").CSSResult;
+    static styles: import("lit").CSSResult[];
     static register(): void;
     private static readonly increment;
     protected tabs: Array<IgcTabComponent>;