igniteui-webcomponents 4.0.0-alpha.2 → 4.0.0

package/components/list/themes/light/list.base.css.js

@@ -1,10 +1,17 @@
 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(--scrolbar-size, 0.875rem);
-  scrollbar-color: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  scrollbar-width: var(--ig-scrollbar-size);
+  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);
 }
 :host *,
 :host *::before,
@@ -13,12 +20,12 @@ export const styles = css `:host {
           box-sizing: border-box;
 }
 :host ::-webkit-scrollbar {
-  width: var(--scrolbar-size, 0.875rem);
-  height: var(--scrolbar-size, 0.875rem);
-  background: var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  width: var(--ig-scrollbar-size);
+  height: var(--ig-scrollbar-size);
+  background: var(--ig-scrollbar-track-background);
 }
 :host ::-webkit-scrollbar-thumb {
-  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));
+  background: var(--ig-scrollbar-thumb-background);
 }
 
 [hidden] {
@@ -40,18 +47,15 @@ export const styles = css `:host {
   background: hsla(var(--ig-surface-500), var(--ig-surface-a));
 }
 
-:host([size=small]) ::slotted(igc-list-item),
-:host([size=small]) ::slotted(igc-list-header) {
-  padding: var(--igc-spacing-small) calc(var(--igc-spacing-small) * 2);
+:host([size=small]) {
+  --component-size: var(--ig-size, var(--ig-size-small));
 }
 
-:host([size=medium]) ::slotted(igc-list-item),
-:host([size=medium]) ::slotted(igc-list-header) {
-  padding: var(--igc-spacing-medium) calc(var(--igc-spacing-medium) * 2);
+:host([size=medium]) {
+  --component-size: var(--ig-size, var(--ig-size-medium));
 }
 
-:host([size=large]) ::slotted(igc-list-item),
-:host([size=large]) ::slotted(igc-list-header) {
-  padding: var(--igc-spacing-large) calc(var(--igc-spacing-large) * 2);
+:host([size=large]) {
+  --component-size: var(--ig-size, var(--ig-size-large));
 }`;
 //# sourceMappingURL=list.base.css.js.map

package/components/list/themes/light/list.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"list.base.css.js","sourceRoot":"","sources":["../../../../../src/components/list/themes/light/list.base.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  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  scrollbar-width: var(--scrolbar-size, 0.875rem);\n  scrollbar-color: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\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(--scrolbar-size, 0.875rem);\n  height: var(--scrolbar-size, 0.875rem);\n  background: var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n}\n:host ::-webkit-scrollbar-thumb {\n  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n}\n\n[hidden] {\n  display: none !important;\n}\n\n/* stylelint-disable max-line-length */\n:host {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: vertical;\n  -webkit-box-direction: normal;\n      -ms-flex-flow: column nowrap;\n          flex-flow: column nowrap;\n  font-family: var(--ig-font-family);\n  overflow: hidden auto;\n  height: auto;\n  background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n}\n\n:host([size=small]) ::slotted(igc-list-item),\n:host([size=small]) ::slotted(igc-list-header) {\n  padding: var(--igc-spacing-small) calc(var(--igc-spacing-small) * 2);\n}\n\n:host([size=medium]) ::slotted(igc-list-item),\n:host([size=medium]) ::slotted(igc-list-header) {\n  padding: var(--igc-spacing-medium) calc(var(--igc-spacing-medium) * 2);\n}\n\n:host([size=large]) ::slotted(igc-list-item),\n:host([size=large]) ::slotted(igc-list-header) {\n  padding: var(--igc-spacing-large) calc(var(--igc-spacing-large) * 2);\n}`;\n"]}
+{"version":3,"file":"list.base.css.js","sourceRoot":"","sources":["../../../../../src/components/list/themes/light/list.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0DvB,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:\n      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[hidden] {\n  display: none !important;\n}\n\n/* stylelint-disable max-line-length */\n:host {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: vertical;\n  -webkit-box-direction: normal;\n      -ms-flex-flow: column nowrap;\n          flex-flow: column nowrap;\n  font-family: var(--ig-font-family);\n  overflow: hidden auto;\n  height: auto;\n  background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n}\n\n:host([size=small]) {\n  --component-size: var(--ig-size, var(--ig-size-small));\n}\n\n:host([size=medium]) {\n  --component-size: var(--ig-size, var(--ig-size-medium));\n}\n\n:host([size=large]) {\n  --component-size: var(--ig-size, var(--ig-size-large));\n}`;\n"]}

package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.js

@@ -1,10 +1,17 @@
 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(--scrolbar-size, 0.875rem);
-  scrollbar-color: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  scrollbar-width: var(--ig-scrollbar-size);
+  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);
 }
 :host *,
 :host *::before,
@@ -13,12 +20,12 @@ export const styles = css `:host {
           box-sizing: border-box;
 }
 :host ::-webkit-scrollbar {
-  width: var(--scrolbar-size, 0.875rem);
-  height: var(--scrolbar-size, 0.875rem);
-  background: var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  width: var(--ig-scrollbar-size);
+  height: var(--ig-scrollbar-size);
+  background: var(--ig-scrollbar-track-background);
 }
 :host ::-webkit-scrollbar-thumb {
-  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));
+  background: var(--ig-scrollbar-thumb-background);
 }
 
 [hidden] {

package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nav-drawer-header-item.base.css.js","sourceRoot":"","sources":["../../../../../src/components/nav-drawer/themes/light/nav-drawer-header-item.base.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  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  scrollbar-width: var(--scrolbar-size, 0.875rem);\n  scrollbar-color: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\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(--scrolbar-size, 0.875rem);\n  height: var(--scrolbar-size, 0.875rem);\n  background: var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n}\n:host ::-webkit-scrollbar-thumb {\n  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n}\n\n[hidden] {\n  display: none !important;\n}\n\n/* stylelint-disable max-line-length */\n:host {\n  display: block;\n  padding: 1.25rem 1rem;\n  white-space: nowrap;\n  color: hsla(var(--ig-gray-800), var(--ig-gray-a));\n  font-family: var(--ig-subtitle-1-font-family);\n  font-size: var(--ig-subtitle-1-font-size);\n  font-weight: var(--ig-subtitle-1-font-weight);\n  font-style: var(--ig-subtitle-1-font-style);\n  line-height: var(--ig-subtitle-1-line-height);\n  letter-spacing: var(--ig-subtitle-1-letter-spacing);\n  text-transform: var(--ig-subtitle-1-text-transform);\n  margin-top: var(--ig-subtitle-1-margin-top);\n  margin-bottom: var(--ig-subtitle-1-margin-bottom);\n}`;\n"]}
+{"version":3,"file":"nav-drawer-header-item.base.css.js","sourceRoot":"","sources":["../../../../../src/components/nav-drawer/themes/light/nav-drawer-header-item.base.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  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n  --is-medium:\n      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[hidden] {\n  display: none !important;\n}\n\n/* stylelint-disable max-line-length */\n:host {\n  display: block;\n  padding: 1.25rem 1rem;\n  white-space: nowrap;\n  color: hsla(var(--ig-gray-800), var(--ig-gray-a));\n  font-family: var(--ig-subtitle-1-font-family);\n  font-size: var(--ig-subtitle-1-font-size);\n  font-weight: var(--ig-subtitle-1-font-weight);\n  font-style: var(--ig-subtitle-1-font-style);\n  line-height: var(--ig-subtitle-1-line-height);\n  letter-spacing: var(--ig-subtitle-1-letter-spacing);\n  text-transform: var(--ig-subtitle-1-text-transform);\n  margin-top: var(--ig-subtitle-1-margin-top);\n  margin-bottom: var(--ig-subtitle-1-margin-bottom);\n}`;\n"]}

package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js

@@ -1,10 +1,17 @@
 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(--scrolbar-size, 0.875rem);
-  scrollbar-color: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  scrollbar-width: var(--ig-scrollbar-size);
+  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);
 }
 :host *,
 :host *::before,
@@ -13,12 +20,12 @@ export const styles = css `:host {
           box-sizing: border-box;
 }
 :host ::-webkit-scrollbar {
-  width: var(--scrolbar-size, 0.875rem);
-  height: var(--scrolbar-size, 0.875rem);
-  background: var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  width: var(--ig-scrollbar-size);
+  height: var(--ig-scrollbar-size);
+  background: var(--ig-scrollbar-track-background);
 }
 :host ::-webkit-scrollbar-thumb {
-  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));
+  background: var(--ig-scrollbar-thumb-background);
 }
 
 [hidden] {

package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nav-drawer-item.base.css.js","sourceRoot":"","sources":["../../../../../src/components/nav-drawer/themes/light/nav-drawer-item.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkHvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  scrollbar-width: var(--scrolbar-size, 0.875rem);\n  scrollbar-color: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\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(--scrolbar-size, 0.875rem);\n  height: var(--scrolbar-size, 0.875rem);\n  background: var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n}\n:host ::-webkit-scrollbar-thumb {\n  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n}\n\n[hidden] {\n  display: none !important;\n}\n\n/* stylelint-disable max-line-length */\n[part~=base] {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  gap: 2rem;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-flow: row nowrap;\n          flex-flow: row nowrap;\n  position: relative;\n  color: hsla(var(--ig-gray-700), var(--ig-gray-a));\n  max-height: 3rem;\n  margin: 0.5rem !important;\n  padding: 0.75rem 0.5rem;\n  cursor: pointer;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  outline: transparent;\n  white-space: nowrap;\n  text-decoration: none;\n  width: calc(100% - 1rem);\n  border: none;\n  -webkit-box-pack: start;\n      -ms-flex-pack: start;\n          justify-content: flex-start;\n  -webkit-transition: background 0.15s ease-out;\n  -o-transition: background 0.15s ease-out;\n  transition: background 0.15s ease-out;\n  border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.25rem), 0.25rem);\n  font-family: var(--ig-subtitle-2-font-family);\n  font-size: var(--ig-subtitle-2-font-size);\n  font-weight: var(--ig-subtitle-2-font-weight);\n  font-style: var(--ig-subtitle-2-font-style);\n  line-height: var(--ig-subtitle-2-line-height);\n  letter-spacing: var(--ig-subtitle-2-letter-spacing);\n  text-transform: var(--ig-subtitle-2-text-transform);\n  margin-top: var(--ig-subtitle-2-margin-top);\n  margin-bottom: var(--ig-subtitle-2-margin-bottom);\n}\n[part~=base] ::slotted(igc-icon) {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  font: inherit;\n}\n[part~=base]:hover, [part~=base]:focus-within {\n  background: var(--hover-background, hsla(var(--ig-gray-200), 0.8));\n  color: hsla(var(--ig-gray-900), var(--ig-gray-a));\n}\n\n[part=content] {\n  white-space: nowrap;\n  -o-text-overflow: ellipsis;\n     text-overflow: ellipsis;\n  overflow: hidden;\n}\n\n[part=\"base mini\"] {\n  display: block;\n}\n[part=\"base mini\"] [part=content] {\n  display: none;\n}\n[part=\"base mini\"] ::slotted(igc-icon) {\n  width: 100%;\n}\n\n:host([disabled]) {\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  cursor: initial;\n  pointer-events: none;\n}\n:host([disabled]) [part~=base] {\n  color: hsla(var(--ig-gray-400), var(--ig-gray-a));\n}\n\n:host([active]) [part~=base] {\n  background: var(--active-background, hsla(var(--ig-primary-500), 0.12));\n  color: var(--active-text-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n}`;\n"]}
+{"version":3,"file":"nav-drawer-item.base.css.js","sourceRoot":"","sources":["../../../../../src/components/nav-drawer/themes/light/nav-drawer-item.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyHvB,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:\n      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[hidden] {\n  display: none !important;\n}\n\n/* stylelint-disable max-line-length */\n[part~=base] {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  gap: 2rem;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-flow: row nowrap;\n          flex-flow: row nowrap;\n  position: relative;\n  color: hsla(var(--ig-gray-700), var(--ig-gray-a));\n  max-height: 3rem;\n  margin: 0.5rem !important;\n  padding: 0.75rem 0.5rem;\n  cursor: pointer;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  outline: transparent;\n  white-space: nowrap;\n  text-decoration: none;\n  width: calc(100% - 1rem);\n  border: none;\n  -webkit-box-pack: start;\n      -ms-flex-pack: start;\n          justify-content: flex-start;\n  -webkit-transition: background 0.15s ease-out;\n  -o-transition: background 0.15s ease-out;\n  transition: background 0.15s ease-out;\n  border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.25rem), 0.25rem);\n  font-family: var(--ig-subtitle-2-font-family);\n  font-size: var(--ig-subtitle-2-font-size);\n  font-weight: var(--ig-subtitle-2-font-weight);\n  font-style: var(--ig-subtitle-2-font-style);\n  line-height: var(--ig-subtitle-2-line-height);\n  letter-spacing: var(--ig-subtitle-2-letter-spacing);\n  text-transform: var(--ig-subtitle-2-text-transform);\n  margin-top: var(--ig-subtitle-2-margin-top);\n  margin-bottom: var(--ig-subtitle-2-margin-bottom);\n}\n[part~=base] ::slotted(igc-icon) {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  font: inherit;\n}\n[part~=base]:hover, [part~=base]:focus-within {\n  background: var(--hover-background, hsla(var(--ig-gray-200), 0.8));\n  color: hsla(var(--ig-gray-900), var(--ig-gray-a));\n}\n\n[part=content] {\n  white-space: nowrap;\n  -o-text-overflow: ellipsis;\n     text-overflow: ellipsis;\n  overflow: hidden;\n}\n\n[part=\"base mini\"] {\n  display: block;\n}\n[part=\"base mini\"] [part=content] {\n  display: none;\n}\n[part=\"base mini\"] ::slotted(igc-icon) {\n  width: 100%;\n}\n\n:host([disabled]) {\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  cursor: initial;\n  pointer-events: none;\n}\n:host([disabled]) [part~=base] {\n  color: hsla(var(--ig-gray-400), var(--ig-gray-a));\n}\n\n:host([active]) [part~=base] {\n  background: var(--active-background, hsla(var(--ig-primary-500), 0.12));\n  color: var(--active-text-color, hsla(var(--ig-primary-500), var(--ig-primary-a)));\n}`;\n"]}

package/components/nav-drawer/themes/light/nav-drawer.base.css.js

@@ -1,10 +1,17 @@
 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(--scrolbar-size, 0.875rem);
-  scrollbar-color: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  scrollbar-width: var(--ig-scrollbar-size);
+  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);
 }
 :host *,
 :host *::before,
@@ -13,12 +20,12 @@ export const styles = css `:host {
           box-sizing: border-box;
 }
 :host ::-webkit-scrollbar {
-  width: var(--scrolbar-size, 0.875rem);
-  height: var(--scrolbar-size, 0.875rem);
-  background: var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  width: var(--ig-scrollbar-size);
+  height: var(--ig-scrollbar-size);
+  background: var(--ig-scrollbar-track-background);
 }
 :host ::-webkit-scrollbar-thumb {
-  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));
+  background: var(--ig-scrollbar-thumb-background);
 }
 
 [hidden] {

package/components/nav-drawer/themes/light/nav-drawer.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nav-drawer.base.css.js","sourceRoot":"","sources":["../../../../../src/components/nav-drawer/themes/light/nav-drawer.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0JvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  scrollbar-width: var(--scrolbar-size, 0.875rem);\n  scrollbar-color: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\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(--scrolbar-size, 0.875rem);\n  height: var(--scrolbar-size, 0.875rem);\n  background: var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n}\n:host ::-webkit-scrollbar-thumb {\n  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n}\n\n[hidden] {\n  display: none !important;\n}\n\n/* stylelint-disable max-line-length */\n:host {\n  -ms-flex-negative: 0;\n      flex-shrink: 0;\n  font-family: var(--ig-font-family);\n}\n:host [part=base] {\n  position: fixed;\n  height: 100%;\n  min-height: 100%;\n  overflow-x: hidden;\n  top: 0;\n  bottom: 0;\n  inset-inline-start: 0;\n  z-index: 999;\n  background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n  border-radius: 0;\n  -webkit-transition: all ease-out 0.3s, 0.3s;\n  -o-transition: all ease-out 0.3s, 0.3s;\n  transition: all ease-out 0.3s, 0.3s;\n}\n:host [part=main] {\n  width: 16rem;\n}\n:host [part=mini] {\n  width: 3.75rem;\n}\n:host [part=overlay] {\n  background: hsla(var(--ig-gray-500), 0.54);\n  position: fixed;\n  inset: 0;\n  z-index: 2;\n}\n\n:host([position=start]) [part=mini],\n:host([position=end]) [part=mini] {\n  background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n  -webkit-box-shadow: var(--ig-elevation-16);\n          box-shadow: var(--ig-elevation-16);\n  position: fixed;\n  top: 0;\n  bottom: 0;\n}\n\n:host([position=start]) [part=mini] {\n  -webkit-border-end: 1px solid hsla(var(--ig-gray-900), 0.14);\n          border-inline-end: 1px solid hsla(var(--ig-gray-900), 0.14);\n  inset-inline-start: 0;\n}\n\n:host([position=end]) [part=mini] {\n  -webkit-border-start: 1px solid hsla(var(--ig-gray-900), 0.14);\n          border-inline-start: 1px solid hsla(var(--ig-gray-900), 0.14);\n  inset-inline-end: 0;\n}\n\n:host([position=top]) [part=main],\n:host([position=bottom]) [part=main] {\n  width: 100%;\n}\n:host([position=top]) [part=base],\n:host([position=bottom]) [part=base] {\n  height: 50vh;\n  min-height: initial;\n  top: auto;\n  width: 100%;\n}\n\n:host([position=top]) [part=base] {\n  top: 0;\n  bottom: auto;\n}\n\n:host(:not([open])[position=top]) [part=base],\n:host(:not([open])[position=bottom]) [part=base] {\n  -webkit-transform: translate3d(0, -60vh, 0);\n          transform: translate3d(0, -60vh, 0);\n}\n:host(:not([open])[position=top]) [part=mini],\n:host(:not([open])[position=bottom]) [part=mini] {\n  display: none;\n}\n\n:host(:not([open])[position=bottom]) [part=base] {\n  -webkit-transform: translate3d(0, 60vh, 0);\n          transform: translate3d(0, 60vh, 0);\n}\n\n:host([open][position=end]) [part=base] {\n  -webkit-border-end: none;\n          border-inline-end: none;\n  -webkit-border-start: 1px solid hsla(var(--ig-gray-900), 0.14);\n          border-inline-start: 1px solid hsla(var(--ig-gray-900), 0.14);\n  inset-inline-start: auto;\n  inset-inline-end: 0;\n}\n\n:host([position=relative]) [part=base] {\n  position: relative;\n  width: -webkit-fit-content;\n  width: -moz-fit-content;\n  width: fit-content;\n  -webkit-box-shadow: none;\n          box-shadow: none;\n  z-index: initial;\n  -webkit-border-end: 1px solid hsla(var(--ig-gray-300), var(--ig-gray-a));\n          border-inline-end: 1px solid hsla(var(--ig-gray-300), var(--ig-gray-a));\n}\n:host([position=relative]) [part=overlay] {\n  display: none;\n}\n\n:host([open]) [part=mini] {\n  display: none;\n}\n\n:host([open]:not([position=relative])) [part=base] {\n  -webkit-border-end: 1px solid hsla(var(--ig-gray-900), 0.14);\n          border-inline-end: 1px solid hsla(var(--ig-gray-900), 0.14);\n  -webkit-box-shadow: var(--ig-elevation-16);\n          box-shadow: var(--ig-elevation-16);\n}\n\n:host(:not([open])) [part=main] {\n  display: none;\n}\n:host(:not([open])) [part=overlay] {\n  display: none;\n}`;\n"]}
+{"version":3,"file":"nav-drawer.base.css.js","sourceRoot":"","sources":["../../../../../src/components/nav-drawer/themes/light/nav-drawer.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiKvB,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:\n      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[hidden] {\n  display: none !important;\n}\n\n/* stylelint-disable max-line-length */\n:host {\n  -ms-flex-negative: 0;\n      flex-shrink: 0;\n  font-family: var(--ig-font-family);\n}\n:host [part=base] {\n  position: fixed;\n  height: 100%;\n  min-height: 100%;\n  overflow-x: hidden;\n  top: 0;\n  bottom: 0;\n  inset-inline-start: 0;\n  z-index: 999;\n  background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n  border-radius: 0;\n  -webkit-transition: all ease-out 0.3s, 0.3s;\n  -o-transition: all ease-out 0.3s, 0.3s;\n  transition: all ease-out 0.3s, 0.3s;\n}\n:host [part=main] {\n  width: 16rem;\n}\n:host [part=mini] {\n  width: 3.75rem;\n}\n:host [part=overlay] {\n  background: hsla(var(--ig-gray-500), 0.54);\n  position: fixed;\n  inset: 0;\n  z-index: 2;\n}\n\n:host([position=start]) [part=mini],\n:host([position=end]) [part=mini] {\n  background: hsla(var(--ig-surface-500), var(--ig-surface-a));\n  -webkit-box-shadow: var(--ig-elevation-16);\n          box-shadow: var(--ig-elevation-16);\n  position: fixed;\n  top: 0;\n  bottom: 0;\n}\n\n:host([position=start]) [part=mini] {\n  -webkit-border-end: 1px solid hsla(var(--ig-gray-900), 0.14);\n          border-inline-end: 1px solid hsla(var(--ig-gray-900), 0.14);\n  inset-inline-start: 0;\n}\n\n:host([position=end]) [part=mini] {\n  -webkit-border-start: 1px solid hsla(var(--ig-gray-900), 0.14);\n          border-inline-start: 1px solid hsla(var(--ig-gray-900), 0.14);\n  inset-inline-end: 0;\n}\n\n:host([position=top]) [part=main],\n:host([position=bottom]) [part=main] {\n  width: 100%;\n}\n:host([position=top]) [part=base],\n:host([position=bottom]) [part=base] {\n  height: 50vh;\n  min-height: initial;\n  top: auto;\n  width: 100%;\n}\n\n:host([position=top]) [part=base] {\n  top: 0;\n  bottom: auto;\n}\n\n:host(:not([open])[position=top]) [part=base],\n:host(:not([open])[position=bottom]) [part=base] {\n  -webkit-transform: translate3d(0, -60vh, 0);\n          transform: translate3d(0, -60vh, 0);\n}\n:host(:not([open])[position=top]) [part=mini],\n:host(:not([open])[position=bottom]) [part=mini] {\n  display: none;\n}\n\n:host(:not([open])[position=bottom]) [part=base] {\n  -webkit-transform: translate3d(0, 60vh, 0);\n          transform: translate3d(0, 60vh, 0);\n}\n\n:host([open][position=end]) [part=base] {\n  -webkit-border-end: none;\n          border-inline-end: none;\n  -webkit-border-start: 1px solid hsla(var(--ig-gray-900), 0.14);\n          border-inline-start: 1px solid hsla(var(--ig-gray-900), 0.14);\n  inset-inline-start: auto;\n  inset-inline-end: 0;\n}\n\n:host([position=relative]) [part=base] {\n  position: relative;\n  width: -webkit-fit-content;\n  width: -moz-fit-content;\n  width: fit-content;\n  -webkit-box-shadow: none;\n          box-shadow: none;\n  z-index: initial;\n  -webkit-border-end: 1px solid hsla(var(--ig-gray-300), var(--ig-gray-a));\n          border-inline-end: 1px solid hsla(var(--ig-gray-300), var(--ig-gray-a));\n}\n:host([position=relative]) [part=overlay] {\n  display: none;\n}\n\n:host([open]) [part=mini] {\n  display: none;\n}\n\n:host([open]:not([position=relative])) [part=base] {\n  -webkit-border-end: 1px solid hsla(var(--ig-gray-900), 0.14);\n          border-inline-end: 1px solid hsla(var(--ig-gray-900), 0.14);\n  -webkit-box-shadow: var(--ig-elevation-16);\n          box-shadow: var(--ig-elevation-16);\n}\n\n:host(:not([open])) [part=main] {\n  display: none;\n}\n:host(:not([open])) [part=overlay] {\n  display: none;\n}`;\n"]}

package/components/navbar/themes/light/navbar.base.css.js

@@ -1,10 +1,17 @@
 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(--scrolbar-size, 0.875rem);
-  scrollbar-color: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  scrollbar-width: var(--ig-scrollbar-size);
+  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);
 }
 :host *,
 :host *::before,
@@ -13,12 +20,12 @@ export const styles = css `:host {
           box-sizing: border-box;
 }
 :host ::-webkit-scrollbar {
-  width: var(--scrolbar-size, 0.875rem);
-  height: var(--scrolbar-size, 0.875rem);
-  background: var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  width: var(--ig-scrollbar-size);
+  height: var(--ig-scrollbar-size);
+  background: var(--ig-scrollbar-track-background);
 }
 :host ::-webkit-scrollbar-thumb {
-  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));
+  background: var(--ig-scrollbar-thumb-background);
 }
 
 [hidden] {

package/components/navbar/themes/light/navbar.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"navbar.base.css.js","sourceRoot":"","sources":["../../../../../src/components/navbar/themes/light/navbar.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsIvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  scrollbar-width: var(--scrolbar-size, 0.875rem);\n  scrollbar-color: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\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(--scrolbar-size, 0.875rem);\n  height: var(--scrolbar-size, 0.875rem);\n  background: var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n}\n:host ::-webkit-scrollbar-thumb {\n  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n}\n\n[hidden] {\n  display: none !important;\n}\n\n/* stylelint-disable max-line-length */\n:host {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  width: 100%;\n  min-height: 3.5rem;\n  max-height: 8rem;\n  padding: 0 1rem;\n  background: hsla(var(--ig-primary-500), var(--ig-primary-a));\n  color: var(--ig-primary-600-contrast);\n  -webkit-box-shadow: var(--ig-elevation-4);\n          box-shadow: var(--ig-elevation-4);\n  font-family: var(--ig-font-family);\n  z-index: 4;\n}\n\n[part=base] {\n  display: inherit;\n  position: relative;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-flow: row nowrap;\n          flex-flow: row nowrap;\n  -webkit-box-flex: 1;\n      -ms-flex-positive: 1;\n          flex-grow: 1;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  overflow: hidden;\n}\n\n[part=middle] {\n  display: -webkit-inline-box;\n  -webkit-line-clamp: 4;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  -webkit-user-select: text;\n     -moz-user-select: text;\n      -ms-user-select: text;\n          user-select: text;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-flex: 1;\n      -ms-flex-positive: 1;\n          flex-grow: 1;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n}\n\n[part=start],\n[part=end] {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n[name=start]::slotted(*) {\n  -webkit-margin-end: 1rem;\n          margin-inline-end: 1rem;\n  -webkit-margin-start: 0.0625rem;\n          margin-inline-start: 0.0625rem;\n}\n\n[name=end]::slotted(*) {\n  -webkit-margin-start: 1rem;\n          margin-inline-start: 1rem;\n  -webkit-margin-end: 0.0625rem;\n          margin-inline-end: 0.0625rem;\n}\n\n::slotted(igc-avatar[part=base]) {\n  max-width: 2rem;\n  max-height: 2rem;\n  min-height: 0;\n  min-width: 0;\n}\n\n::slotted(igc-icon) {\n  cursor: pointer;\n  color: var(--ig-primary-600-contrast);\n  width: 2rem;\n  height: 2rem;\n  font-size: 2rem;\n}\n\n::slotted(*) {\n  font-family: var(--ig-h6-font-family);\n  font-size: var(--ig-h6-font-size);\n  font-weight: var(--ig-h6-font-weight);\n  font-style: var(--ig-h6-font-style);\n  line-height: var(--ig-h6-line-height);\n  letter-spacing: var(--ig-h6-letter-spacing);\n  text-transform: var(--ig-h6-text-transform);\n  margin-top: var(--ig-h6-margin-top);\n  margin-bottom: var(--ig-h6-margin-bottom);\n  line-height: normal;\n  margin: 0;\n}`;\n"]}
+{"version":3,"file":"navbar.base.css.js","sourceRoot":"","sources":["../../../../../src/components/navbar/themes/light/navbar.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:\n      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[hidden] {\n  display: none !important;\n}\n\n/* stylelint-disable max-line-length */\n:host {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  width: 100%;\n  min-height: 3.5rem;\n  max-height: 8rem;\n  padding: 0 1rem;\n  background: hsla(var(--ig-primary-500), var(--ig-primary-a));\n  color: var(--ig-primary-600-contrast);\n  -webkit-box-shadow: var(--ig-elevation-4);\n          box-shadow: var(--ig-elevation-4);\n  font-family: var(--ig-font-family);\n  z-index: 4;\n}\n\n[part=base] {\n  display: inherit;\n  position: relative;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-flow: row nowrap;\n          flex-flow: row nowrap;\n  -webkit-box-flex: 1;\n      -ms-flex-positive: 1;\n          flex-grow: 1;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  overflow: hidden;\n}\n\n[part=middle] {\n  display: -webkit-inline-box;\n  -webkit-line-clamp: 4;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  -webkit-user-select: text;\n     -moz-user-select: text;\n      -ms-user-select: text;\n          user-select: text;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-flex: 1;\n      -ms-flex-positive: 1;\n          flex-grow: 1;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n}\n\n[part=start],\n[part=end] {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n[name=start]::slotted(*) {\n  -webkit-margin-end: 1rem;\n          margin-inline-end: 1rem;\n  -webkit-margin-start: 0.0625rem;\n          margin-inline-start: 0.0625rem;\n}\n\n[name=end]::slotted(*) {\n  -webkit-margin-start: 1rem;\n          margin-inline-start: 1rem;\n  -webkit-margin-end: 0.0625rem;\n          margin-inline-end: 0.0625rem;\n}\n\n::slotted(igc-avatar[part=base]) {\n  max-width: 2rem;\n  max-height: 2rem;\n  min-height: 0;\n  min-width: 0;\n}\n\n::slotted(igc-icon) {\n  cursor: pointer;\n  color: var(--ig-primary-600-contrast);\n  width: 2rem;\n  height: 2rem;\n  font-size: 2rem;\n}\n\n::slotted(*) {\n  font-family: var(--ig-h6-font-family);\n  font-size: var(--ig-h6-font-size);\n  font-weight: var(--ig-h6-font-weight);\n  font-style: var(--ig-h6-font-style);\n  line-height: var(--ig-h6-line-height);\n  letter-spacing: var(--ig-h6-letter-spacing);\n  text-transform: var(--ig-h6-text-transform);\n  margin-top: var(--ig-h6-margin-top);\n  margin-bottom: var(--ig-h6-margin-bottom);\n  line-height: normal;\n  margin: 0;\n}`;\n"]}

package/components/progress/themes/circular/circular.progress.base.css.js

@@ -1,10 +1,17 @@
 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(--scrolbar-size, 0.875rem);
-  scrollbar-color: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  scrollbar-width: var(--ig-scrollbar-size);
+  scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);
 }
 :host *,
 :host *::before,
@@ -13,12 +20,12 @@ export const styles = css `:host {
           box-sizing: border-box;
 }
 :host ::-webkit-scrollbar {
-  width: var(--scrolbar-size, 0.875rem);
-  height: var(--scrolbar-size, 0.875rem);
-  background: var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));
+  width: var(--ig-scrollbar-size);
+  height: var(--ig-scrollbar-size);
+  background: var(--ig-scrollbar-track-background);
 }
 :host ::-webkit-scrollbar-thumb {
-  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));
+  background: var(--ig-scrollbar-thumb-background);
 }
 
 [hidden] {
@@ -211,13 +218,13 @@ export const styles = css `:host {
   }
 }
 @-webkit-keyframes indeterminate-bar-fluent {
-  from {
+  0% {
     -webkit-transform: translateX(-100%);
             transform: translateX(-100%);
     -webkit-transform-origin: left;
             transform-origin: left;
   }
-  to {
+  100% {
     -webkit-transform: translateX(310%);
             transform: translateX(310%);
     -webkit-transform-origin: right;
@@ -225,13 +232,13 @@ export const styles = css `:host {
   }
 }
 @keyframes indeterminate-bar-fluent {
-  from {
+  0% {
     -webkit-transform: translateX(-100%);
             transform: translateX(-100%);
     -webkit-transform-origin: left;
             transform-origin: left;
   }
-  to {
+  100% {
     -webkit-transform: translateX(310%);
             transform: translateX(310%);
     -webkit-transform-origin: right;
@@ -239,13 +246,13 @@ export const styles = css `:host {
   }
 }
 @-webkit-keyframes indeterminate-bar-fluent-rtl {
-  from {
+  0% {
     -webkit-transform: translateX(-310%);
             transform: translateX(-310%);
     -webkit-transform-origin: right;
             transform-origin: right;
   }
-  to {
+  100% {
     -webkit-transform: translateX(100%);
             transform: translateX(100%);
     -webkit-transform-origin: left;
@@ -253,13 +260,13 @@ export const styles = css `:host {
   }
 }
 @keyframes indeterminate-bar-fluent-rtl {
-  from {
+  0% {
     -webkit-transform: translateX(-310%);
             transform: translateX(-310%);
     -webkit-transform-origin: right;
             transform-origin: right;
   }
-  to {
+  100% {
     -webkit-transform: translateX(100%);
             transform: translateX(100%);
     -webkit-transform-origin: left;
@@ -267,38 +274,38 @@ export const styles = css `:host {
   }
 }
 @-webkit-keyframes indeterminate-accordion {
-  from {
+  0% {
     stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);
     stroke-dasharray: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10);
   }
-  to {
+  100% {
     stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5);
   }
 }
 @keyframes indeterminate-accordion {
-  from {
+  0% {
     stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);
     stroke-dasharray: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10);
   }
-  to {
+  100% {
     stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5);
   }
 }
 @-webkit-keyframes indeterminate-accordion-rtl {
-  from {
+  0% {
     stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);
     stroke-dasharray: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10);
   }
-  to {
+  100% {
     stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5);
   }
 }
 @keyframes indeterminate-accordion-rtl {
-  from {
+  0% {
     stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);
     stroke-dasharray: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10);
   }
-  to {
+  100% {
     stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5);
   }
 }
@@ -349,8 +356,8 @@ export const styles = css `:host {
   display: -ms-inline-flexbox;
   display: inline-flex;
   position: relative;
-  --stroke-thickness: 0.125rem;
-  --diameter: 1.875rem;
+  --stroke-thickness: 2px;
+  --diameter: 30px;
 }
 
 [part~=label] {
@@ -386,6 +393,9 @@ export const styles = css `:host {
 [part~=svg] {
   width: calc(var(--diameter) + var(--stroke-thickness));
   height: calc(var(--diameter) + var(--stroke-thickness));
+  -webkit-transform: rotate(-90deg);
+      -ms-transform: rotate(-90deg);
+          transform: rotate(-90deg);
 }
 
 [part~=track] {
@@ -398,23 +408,22 @@ export const styles = css `:host {
   -webkit-transition: stroke-dashoffset var(--duration) linear;
   -o-transition: stroke-dashoffset var(--duration) linear;
   transition: stroke-dashoffset var(--duration) linear;
-  -webkit-transform-origin: 50% 50%;
-      -ms-transform-origin: 50% 50%;
-          transform-origin: 50% 50%;
-  -webkit-transform: rotate(-90deg);
-      -ms-transform: rotate(-90deg);
-          transform: rotate(-90deg);
   --percentage: 0;
   --duration: 500ms;
 }
 
 [part~=track],
 [part~=fill] {
+  width: 100%;
+  height: 100%;
   fill: transparent;
   stroke-width: var(--stroke-thickness);
   cx: calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);
   cy: calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);
   r: calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5);
+  -webkit-transform-origin: center;
+      -ms-transform-origin: center;
+          transform-origin: center;
 }
 
 [part~=gradient_start],

package/components/progress/themes/circular/circular.progress.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"circular.progress.base.css.js","sourceRoot":"","sources":["../../../../../src/components/progress/themes/circular/circular.progress.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAucvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  scrollbar-width: var(--scrolbar-size, 0.875rem);\n  scrollbar-color: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\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(--scrolbar-size, 0.875rem);\n  height: var(--scrolbar-size, 0.875rem);\n  background: var(--igc-scrollbar-track-color, hsla(var(--ig-gray-200), var(--ig-gray-a)));\n}\n:host ::-webkit-scrollbar-thumb {\n  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));\n}\n\n[hidden] {\n  display: none !important;\n}\n\n/* stylelint-disable max-line-length */\n@-webkit-keyframes indeterminate-primary {\n  0% {\n    -webkit-transform: translateX(0);\n            transform: translateX(0);\n  }\n  20% {\n    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.7017, 0.4958);\n            animation-timing-function: cubic-bezier(0.5, 0, 0.7017, 0.4958);\n    -webkit-transform: translateX(0);\n            transform: translateX(0);\n  }\n  59.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.3024, 0.3813, 0.55, 0.9563);\n            animation-timing-function: cubic-bezier(0.3024, 0.3813, 0.55, 0.9563);\n    -webkit-transform: translateX(83.671%);\n            transform: translateX(83.671%);\n  }\n  100% {\n    -webkit-transform: translateX(200.611%);\n            transform: translateX(200.611%);\n  }\n}\n@keyframes indeterminate-primary {\n  0% {\n    -webkit-transform: translateX(0);\n            transform: translateX(0);\n  }\n  20% {\n    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.7017, 0.4958);\n            animation-timing-function: cubic-bezier(0.5, 0, 0.7017, 0.4958);\n    -webkit-transform: translateX(0);\n            transform: translateX(0);\n  }\n  59.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.3024, 0.3813, 0.55, 0.9563);\n            animation-timing-function: cubic-bezier(0.3024, 0.3813, 0.55, 0.9563);\n    -webkit-transform: translateX(83.671%);\n            transform: translateX(83.671%);\n  }\n  100% {\n    -webkit-transform: translateX(200.611%);\n            transform: translateX(200.611%);\n  }\n}\n@-webkit-keyframes indeterminate-primary-scale {\n  0% {\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n  36.65% {\n    -webkit-animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n            animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n  69.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n            animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n    -webkit-transform: scaleX(0.6614);\n            transform: scaleX(0.6614);\n  }\n  100% {\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n}\n@keyframes indeterminate-primary-scale {\n  0% {\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n  36.65% {\n    -webkit-animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n            animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n  69.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n            animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n    -webkit-transform: scaleX(0.6614);\n            transform: scaleX(0.6614);\n  }\n  100% {\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n}\n@-webkit-keyframes indeterminate-secondary {\n  0% {\n    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n            animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n    -webkit-transform: translateX(0);\n            transform: translateX(0);\n  }\n  25% {\n    -webkit-animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n            animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n    -webkit-transform: translateX(37.6519%);\n            transform: translateX(37.6519%);\n  }\n  48.35% {\n    -webkit-animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n            animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n    -webkit-transform: translateX(84.3861%);\n            transform: translateX(84.3861%);\n  }\n  100% {\n    -webkit-transform: translateX(160.2777%);\n            transform: translateX(160.2777%);\n  }\n}\n@keyframes indeterminate-secondary {\n  0% {\n    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n            animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n    -webkit-transform: translateX(0);\n            transform: translateX(0);\n  }\n  25% {\n    -webkit-animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n            animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n    -webkit-transform: translateX(37.6519%);\n            transform: translateX(37.6519%);\n  }\n  48.35% {\n    -webkit-animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n            animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n    -webkit-transform: translateX(84.3861%);\n            transform: translateX(84.3861%);\n  }\n  100% {\n    -webkit-transform: translateX(160.2777%);\n            transform: translateX(160.2777%);\n  }\n}\n@-webkit-keyframes indeterminate-secondary-scale {\n  0% {\n    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n            animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n  19.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n            animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n    -webkit-transform: scaleX(0.4571);\n            transform: scaleX(0.4571);\n  }\n  44.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n            animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n    -webkit-transform: scaleX(0.727);\n            transform: scaleX(0.727);\n  }\n  100% {\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n}\n@keyframes indeterminate-secondary-scale {\n  0% {\n    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n            animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n  19.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n            animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n    -webkit-transform: scaleX(0.4571);\n            transform: scaleX(0.4571);\n  }\n  44.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n            animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n    -webkit-transform: scaleX(0.727);\n            transform: scaleX(0.727);\n  }\n  100% {\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n}\n@-webkit-keyframes indeterminate-bar-fluent {\n  from {\n    -webkit-transform: translateX(-100%);\n            transform: translateX(-100%);\n    -webkit-transform-origin: left;\n            transform-origin: left;\n  }\n  to {\n    -webkit-transform: translateX(310%);\n            transform: translateX(310%);\n    -webkit-transform-origin: right;\n            transform-origin: right;\n  }\n}\n@keyframes indeterminate-bar-fluent {\n  from {\n    -webkit-transform: translateX(-100%);\n            transform: translateX(-100%);\n    -webkit-transform-origin: left;\n            transform-origin: left;\n  }\n  to {\n    -webkit-transform: translateX(310%);\n            transform: translateX(310%);\n    -webkit-transform-origin: right;\n            transform-origin: right;\n  }\n}\n@-webkit-keyframes indeterminate-bar-fluent-rtl {\n  from {\n    -webkit-transform: translateX(-310%);\n            transform: translateX(-310%);\n    -webkit-transform-origin: right;\n            transform-origin: right;\n  }\n  to {\n    -webkit-transform: translateX(100%);\n            transform: translateX(100%);\n    -webkit-transform-origin: left;\n            transform-origin: left;\n  }\n}\n@keyframes indeterminate-bar-fluent-rtl {\n  from {\n    -webkit-transform: translateX(-310%);\n            transform: translateX(-310%);\n    -webkit-transform-origin: right;\n            transform-origin: right;\n  }\n  to {\n    -webkit-transform: translateX(100%);\n            transform: translateX(100%);\n    -webkit-transform-origin: left;\n            transform-origin: left;\n  }\n}\n@-webkit-keyframes indeterminate-accordion {\n  from {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);\n    stroke-dasharray: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10);\n  }\n  to {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5);\n  }\n}\n@keyframes indeterminate-accordion {\n  from {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);\n    stroke-dasharray: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10);\n  }\n  to {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5);\n  }\n}\n@-webkit-keyframes indeterminate-accordion-rtl {\n  from {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);\n    stroke-dasharray: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10);\n  }\n  to {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5);\n  }\n}\n@keyframes indeterminate-accordion-rtl {\n  from {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);\n    stroke-dasharray: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10);\n  }\n  to {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5);\n  }\n}\n@-webkit-keyframes rotate-center {\n  0% {\n    -webkit-transform: rotate(0);\n            transform: rotate(0);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n@keyframes rotate-center {\n  0% {\n    -webkit-transform: rotate(0);\n            transform: rotate(0);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n:host {\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  font-family: var(--ig-font-family);\n  color: hsla(var(--ig-gray-900), var(--ig-gray-a));\n}\n\n[part~=label] {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  color: inherit;\n  font-weight: 600;\n}\n\n:host {\n  display: -webkit-inline-box;\n  display: -ms-inline-flexbox;\n  display: inline-flex;\n  position: relative;\n  --stroke-thickness: 0.125rem;\n  --diameter: 1.875rem;\n}\n\n[part~=label] {\n  fill: hsla(var(--ig-gray-900), var(--ig-gray-a));\n  position: absolute;\n  -webkit-transform: translate(-50%, -50%);\n      -ms-transform: translate(-50%, -50%);\n          transform: translate(-50%, -50%);\n  top: 50%;\n  left: 50%;\n}\n\n[part~=label],\n[part~=value] {\n  font-size: calc(var(--diameter) / 3 - var(--stroke-thickness));\n  line-height: normal;\n}\n\n[part=\"svg indeterminate\"] {\n  -webkit-transform-origin: 50% 50%;\n      -ms-transform-origin: 50% 50%;\n          transform-origin: 50% 50%;\n  -webkit-animation: 3s linear 0s infinite normal none running rotate-center;\n          animation: 3s linear 0s infinite normal none running rotate-center;\n}\n\n[part=\"svg indeterminate\"] [part~=fill] {\n  stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);\n  -webkit-animation: indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite;\n          animation: indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite;\n}\n\n[part~=svg] {\n  width: calc(var(--diameter) + var(--stroke-thickness));\n  height: calc(var(--diameter) + var(--stroke-thickness));\n}\n\n[part~=track] {\n  stroke: hsla(var(--ig-gray-300), var(--ig-gray-a));\n}\n\n[part~=fill] {\n  stroke-dasharray: calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416);\n  stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) - var(--percentage) * calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416));\n  -webkit-transition: stroke-dashoffset var(--duration) linear;\n  -o-transition: stroke-dashoffset var(--duration) linear;\n  transition: stroke-dashoffset var(--duration) linear;\n  -webkit-transform-origin: 50% 50%;\n      -ms-transform-origin: 50% 50%;\n          transform-origin: 50% 50%;\n  -webkit-transform: rotate(-90deg);\n      -ms-transform: rotate(-90deg);\n          transform: rotate(-90deg);\n  --percentage: 0;\n  --duration: 500ms;\n}\n\n[part~=track],\n[part~=fill] {\n  fill: transparent;\n  stroke-width: var(--stroke-thickness);\n  cx: calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);\n  cy: calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);\n  r: calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5);\n}\n\n[part~=gradient_start],\n[part~=gradient_end] {\n  stop-color: hsla(var(--ig-primary-500), var(--ig-primary-a));\n}\n\n:host([variant=danger]) [part~=gradient_start],\n:host([variant=danger]) [part~=gradient_end] {\n  stop-color: hsla(var(--ig-error-500), var(--ig-error-a));\n}\n\n:host([variant=warning]) [part~=gradient_start],\n:host([variant=warning]) [part~=gradient_end] {\n  stop-color: hsla(var(--ig-warn-500), var(--ig-warn-a));\n}\n\n:host([variant=info]) [part~=gradient_start],\n:host([variant=info]) [part~=gradient_end] {\n  stop-color: hsla(var(--ig-info-500), var(--ig-info-a));\n}\n\n:host([variant=success]) [part~=gradient_start],\n:host([variant=success]) [part~=gradient_end] {\n  stop-color: hsla(var(--ig-success-500), var(--ig-success-a));\n}\n\n:host([dir=rtl]) [part=\"svg indeterminate\"] [part~=fill] {\n  -webkit-animation-name: indeterminate-accordion-rtl;\n          animation-name: indeterminate-accordion-rtl;\n}\n:host([dir=rtl]) [part~=indeterminate] {\n  animation-direction: reverse;\n}\n:host([dir=rtl]) [part~=indeterminate] [part~=track] {\n  animation-direction: reverse;\n}\n:host([dir=rtl]) [part~=fill] {\n  stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) + var(--percentage) * calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416));\n}`;\n"]}
+{"version":3,"file":"circular.progress.base.css.js","sourceRoot":"","sources":["../../../../../src/components/progress/themes/circular/circular.progress.base.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  --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n  --is-medium:\n      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[hidden] {\n  display: none !important;\n}\n\n/* stylelint-disable max-line-length */\n@-webkit-keyframes indeterminate-primary {\n  0% {\n    -webkit-transform: translateX(0);\n            transform: translateX(0);\n  }\n  20% {\n    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.7017, 0.4958);\n            animation-timing-function: cubic-bezier(0.5, 0, 0.7017, 0.4958);\n    -webkit-transform: translateX(0);\n            transform: translateX(0);\n  }\n  59.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.3024, 0.3813, 0.55, 0.9563);\n            animation-timing-function: cubic-bezier(0.3024, 0.3813, 0.55, 0.9563);\n    -webkit-transform: translateX(83.671%);\n            transform: translateX(83.671%);\n  }\n  100% {\n    -webkit-transform: translateX(200.611%);\n            transform: translateX(200.611%);\n  }\n}\n@keyframes indeterminate-primary {\n  0% {\n    -webkit-transform: translateX(0);\n            transform: translateX(0);\n  }\n  20% {\n    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.7017, 0.4958);\n            animation-timing-function: cubic-bezier(0.5, 0, 0.7017, 0.4958);\n    -webkit-transform: translateX(0);\n            transform: translateX(0);\n  }\n  59.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.3024, 0.3813, 0.55, 0.9563);\n            animation-timing-function: cubic-bezier(0.3024, 0.3813, 0.55, 0.9563);\n    -webkit-transform: translateX(83.671%);\n            transform: translateX(83.671%);\n  }\n  100% {\n    -webkit-transform: translateX(200.611%);\n            transform: translateX(200.611%);\n  }\n}\n@-webkit-keyframes indeterminate-primary-scale {\n  0% {\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n  36.65% {\n    -webkit-animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n            animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n  69.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n            animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n    -webkit-transform: scaleX(0.6614);\n            transform: scaleX(0.6614);\n  }\n  100% {\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n}\n@keyframes indeterminate-primary-scale {\n  0% {\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n  36.65% {\n    -webkit-animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n            animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n  69.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n            animation-timing-function: cubic-bezier(0.3347, 0.124, 0.7858, 1);\n    -webkit-transform: scaleX(0.6614);\n            transform: scaleX(0.6614);\n  }\n  100% {\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n}\n@-webkit-keyframes indeterminate-secondary {\n  0% {\n    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n            animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n    -webkit-transform: translateX(0);\n            transform: translateX(0);\n  }\n  25% {\n    -webkit-animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n            animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n    -webkit-transform: translateX(37.6519%);\n            transform: translateX(37.6519%);\n  }\n  48.35% {\n    -webkit-animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n            animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n    -webkit-transform: translateX(84.3861%);\n            transform: translateX(84.3861%);\n  }\n  100% {\n    -webkit-transform: translateX(160.2777%);\n            transform: translateX(160.2777%);\n  }\n}\n@keyframes indeterminate-secondary {\n  0% {\n    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n            animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n    -webkit-transform: translateX(0);\n            transform: translateX(0);\n  }\n  25% {\n    -webkit-animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n            animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n    -webkit-transform: translateX(37.6519%);\n            transform: translateX(37.6519%);\n  }\n  48.35% {\n    -webkit-animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n            animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n    -webkit-transform: translateX(84.3861%);\n            transform: translateX(84.3861%);\n  }\n  100% {\n    -webkit-transform: translateX(160.2777%);\n            transform: translateX(160.2777%);\n  }\n}\n@-webkit-keyframes indeterminate-secondary-scale {\n  0% {\n    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n            animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n  19.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n            animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n    -webkit-transform: scaleX(0.4571);\n            transform: scaleX(0.4571);\n  }\n  44.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n            animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n    -webkit-transform: scaleX(0.727);\n            transform: scaleX(0.727);\n  }\n  100% {\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n}\n@keyframes indeterminate-secondary-scale {\n  0% {\n    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n            animation-timing-function: cubic-bezier(0.15, 0, 0.515, 0.4096);\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n  19.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n            animation-timing-function: cubic-bezier(0.31, 0.284, 0.8, 0.7337);\n    -webkit-transform: scaleX(0.4571);\n            transform: scaleX(0.4571);\n  }\n  44.15% {\n    -webkit-animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n            animation-timing-function: cubic-bezier(0.4, 0.627, 0.6, 0.902);\n    -webkit-transform: scaleX(0.727);\n            transform: scaleX(0.727);\n  }\n  100% {\n    -webkit-transform: scaleX(0.08);\n            transform: scaleX(0.08);\n  }\n}\n@-webkit-keyframes indeterminate-bar-fluent {\n  0% {\n    -webkit-transform: translateX(-100%);\n            transform: translateX(-100%);\n    -webkit-transform-origin: left;\n            transform-origin: left;\n  }\n  100% {\n    -webkit-transform: translateX(310%);\n            transform: translateX(310%);\n    -webkit-transform-origin: right;\n            transform-origin: right;\n  }\n}\n@keyframes indeterminate-bar-fluent {\n  0% {\n    -webkit-transform: translateX(-100%);\n            transform: translateX(-100%);\n    -webkit-transform-origin: left;\n            transform-origin: left;\n  }\n  100% {\n    -webkit-transform: translateX(310%);\n            transform: translateX(310%);\n    -webkit-transform-origin: right;\n            transform-origin: right;\n  }\n}\n@-webkit-keyframes indeterminate-bar-fluent-rtl {\n  0% {\n    -webkit-transform: translateX(-310%);\n            transform: translateX(-310%);\n    -webkit-transform-origin: right;\n            transform-origin: right;\n  }\n  100% {\n    -webkit-transform: translateX(100%);\n            transform: translateX(100%);\n    -webkit-transform-origin: left;\n            transform-origin: left;\n  }\n}\n@keyframes indeterminate-bar-fluent-rtl {\n  0% {\n    -webkit-transform: translateX(-310%);\n            transform: translateX(-310%);\n    -webkit-transform-origin: right;\n            transform-origin: right;\n  }\n  100% {\n    -webkit-transform: translateX(100%);\n            transform: translateX(100%);\n    -webkit-transform-origin: left;\n            transform-origin: left;\n  }\n}\n@-webkit-keyframes indeterminate-accordion {\n  0% {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);\n    stroke-dasharray: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10);\n  }\n  100% {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5);\n  }\n}\n@keyframes indeterminate-accordion {\n  0% {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);\n    stroke-dasharray: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10);\n  }\n  100% {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2 / 5);\n  }\n}\n@-webkit-keyframes indeterminate-accordion-rtl {\n  0% {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);\n    stroke-dasharray: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10);\n  }\n  100% {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5);\n  }\n}\n@keyframes indeterminate-accordion-rtl {\n  0% {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2);\n    stroke-dasharray: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 9 / 10);\n  }\n  100% {\n    stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * -2 / 5);\n  }\n}\n@-webkit-keyframes rotate-center {\n  0% {\n    -webkit-transform: rotate(0);\n            transform: rotate(0);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n@keyframes rotate-center {\n  0% {\n    -webkit-transform: rotate(0);\n            transform: rotate(0);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n:host {\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  font-family: var(--ig-font-family);\n  color: hsla(var(--ig-gray-900), var(--ig-gray-a));\n}\n\n[part~=label] {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  color: inherit;\n  font-weight: 600;\n}\n\n:host {\n  display: -webkit-inline-box;\n  display: -ms-inline-flexbox;\n  display: inline-flex;\n  position: relative;\n  --stroke-thickness: 2px;\n  --diameter: 30px;\n}\n\n[part~=label] {\n  fill: hsla(var(--ig-gray-900), var(--ig-gray-a));\n  position: absolute;\n  -webkit-transform: translate(-50%, -50%);\n      -ms-transform: translate(-50%, -50%);\n          transform: translate(-50%, -50%);\n  top: 50%;\n  left: 50%;\n}\n\n[part~=label],\n[part~=value] {\n  font-size: calc(var(--diameter) / 3 - var(--stroke-thickness));\n  line-height: normal;\n}\n\n[part=\"svg indeterminate\"] {\n  -webkit-transform-origin: 50% 50%;\n      -ms-transform-origin: 50% 50%;\n          transform-origin: 50% 50%;\n  -webkit-animation: 3s linear 0s infinite normal none running rotate-center;\n          animation: 3s linear 0s infinite normal none running rotate-center;\n}\n\n[part=\"svg indeterminate\"] [part~=fill] {\n  stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) * 2);\n  -webkit-animation: indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite;\n          animation: indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite;\n}\n\n[part~=svg] {\n  width: calc(var(--diameter) + var(--stroke-thickness));\n  height: calc(var(--diameter) + var(--stroke-thickness));\n  -webkit-transform: rotate(-90deg);\n      -ms-transform: rotate(-90deg);\n          transform: rotate(-90deg);\n}\n\n[part~=track] {\n  stroke: hsla(var(--ig-gray-300), var(--ig-gray-a));\n}\n\n[part~=fill] {\n  stroke-dasharray: calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416);\n  stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) - var(--percentage) * calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416));\n  -webkit-transition: stroke-dashoffset var(--duration) linear;\n  -o-transition: stroke-dashoffset var(--duration) linear;\n  transition: stroke-dashoffset var(--duration) linear;\n  --percentage: 0;\n  --duration: 500ms;\n}\n\n[part~=track],\n[part~=fill] {\n  width: 100%;\n  height: 100%;\n  fill: transparent;\n  stroke-width: var(--stroke-thickness);\n  cx: calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);\n  cy: calc(calc(var(--diameter) + var(--stroke-thickness)) / 2);\n  r: calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5);\n  -webkit-transform-origin: center;\n      -ms-transform-origin: center;\n          transform-origin: center;\n}\n\n[part~=gradient_start],\n[part~=gradient_end] {\n  stop-color: hsla(var(--ig-primary-500), var(--ig-primary-a));\n}\n\n:host([variant=danger]) [part~=gradient_start],\n:host([variant=danger]) [part~=gradient_end] {\n  stop-color: hsla(var(--ig-error-500), var(--ig-error-a));\n}\n\n:host([variant=warning]) [part~=gradient_start],\n:host([variant=warning]) [part~=gradient_end] {\n  stop-color: hsla(var(--ig-warn-500), var(--ig-warn-a));\n}\n\n:host([variant=info]) [part~=gradient_start],\n:host([variant=info]) [part~=gradient_end] {\n  stop-color: hsla(var(--ig-info-500), var(--ig-info-a));\n}\n\n:host([variant=success]) [part~=gradient_start],\n:host([variant=success]) [part~=gradient_end] {\n  stop-color: hsla(var(--ig-success-500), var(--ig-success-a));\n}\n\n:host([dir=rtl]) [part=\"svg indeterminate\"] [part~=fill] {\n  -webkit-animation-name: indeterminate-accordion-rtl;\n          animation-name: indeterminate-accordion-rtl;\n}\n:host([dir=rtl]) [part~=indeterminate] {\n  animation-direction: reverse;\n}\n:host([dir=rtl]) [part~=indeterminate] [part~=track] {\n  animation-direction: reverse;\n}\n:host([dir=rtl]) [part~=fill] {\n  stroke-dashoffset: calc(calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416) + var(--percentage) * calc(calc(var(--diameter) / 2 - var(--stroke-thickness) * 0.5) * 2 * 3.1416));\n}`;\n"]}

package/components/progress/themes/circular/circular.progress.bootstrap.css.js

@@ -1,8 +1,8 @@
 import { css } from 'lit';
 export const styles = css `/* stylelint-disable max-line-length */
 :host {
-  --stroke-thickness: 0.25rem;
-  --diameter: 1.75rem;
+  --stroke-thickness: 4px;
+  --diameter: 28px;
 }
 
 [part~=svg][part~=indeterminate] {

package/components/progress/themes/circular/circular.progress.bootstrap.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"circular.progress.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/progress/themes/circular/circular.progress.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;EAmBvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`/* stylelint-disable max-line-length */\n:host {\n  --stroke-thickness: 0.25rem;\n  --diameter: 1.75rem;\n}\n\n[part~=svg][part~=indeterminate] {\n  -webkit-animation-duration: 0.75s;\n          animation-duration: 0.75s;\n}\n\n[part=\"svg indeterminate\"] [part~=fill] {\n  stroke-dashoffset: 60% !important;\n  -webkit-animation: none;\n          animation: none;\n}\n\n[part~=track][part~=indeterminate] {\n  stroke: transparent;\n}`;\n"]}
+{"version":3,"file":"circular.progress.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/progress/themes/circular/circular.progress.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;EAmBvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`/* stylelint-disable max-line-length */\n:host {\n  --stroke-thickness: 4px;\n  --diameter: 28px;\n}\n\n[part~=svg][part~=indeterminate] {\n  -webkit-animation-duration: 0.75s;\n          animation-duration: 0.75s;\n}\n\n[part=\"svg indeterminate\"] [part~=fill] {\n  stroke-dashoffset: 60% !important;\n  -webkit-animation: none;\n          animation: none;\n}\n\n[part~=track][part~=indeterminate] {\n  stroke: transparent;\n}`;\n"]}

package/components/progress/themes/circular/circular.progress.fluent.css.js

@@ -1,7 +1,7 @@
 import { css } from 'lit';
 export const styles = css `/* stylelint-disable max-line-length */
 :host {
-  --stroke-thickness: 0.09375rem;
+  --stroke-thickness: 1.5px;
 }
 
 [part~=track] {

package/components/progress/themes/circular/circular.progress.fluent.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"circular.progress.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/progress/themes/circular/circular.progress.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;EAOvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`/* stylelint-disable max-line-length */\n:host {\n  --stroke-thickness: 0.09375rem;\n}\n\n[part~=track] {\n  stroke: hsla(var(--ig-primary-50), 0.3);\n}`;\n"]}
+{"version":3,"file":"circular.progress.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/progress/themes/circular/circular.progress.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;EAOvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`/* stylelint-disable max-line-length */\n:host {\n  --stroke-thickness: 1.5px;\n}\n\n[part~=track] {\n  stroke: hsla(var(--ig-primary-50), 0.3);\n}`;\n"]}