igniteui-webcomponents 3.3.1 → 4.0.0-alpha

package/components/button/themes/button/light/button.material.css.js

@@ -1,3 +1,234 @@
 import { css } from 'lit';
-export const styles = css `:host{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(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;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(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}[part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-flex:1;-ms-flex:1;flex:1;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline-style:none;-webkit-tap-highlight-color:rgba(0,0,0,0);overflow:hidden;white-space:nowrap;text-decoration:none;z-index:0;font-family:var(--igc-button-font-family);font-weight:var(--igc-button-font-weight);font-size:var(--igc-button-font-size);font-style:var(--igc-button-font-style);letter-spacing:var(--igc-button-letter-spacing);line-height:var(--igc-button-line-height);text-transform:var(--igc-button-text-transform)}[part=base]::before{position:absolute;content:"";width:100%;height:100%;z-index:-1;will-change:opacity;-webkit-transition:all .1s ease-out;-o-transition:all .1s ease-out;transition:all .1s ease-out}:host(:not([disabled])) [part=base]:hover{cursor:pointer}:host([disabled]){pointer-events:none}:host([disabled]) [part=base]{background:hsla(var(--igc-gray-300), var(--igc-gray-a));color:hsla(var(--igc-gray-500), var(--igc-gray-a));-webkit-box-shadow:none;box-shadow:none}:host([size=large]) [part=base]{height:var(--size, 36px);padding:0 calc(var(--igc-spacing-large)*2)}:host([size=medium]) [part=base]{height:var(--size, 30px);padding:0 calc(var(--igc-spacing-medium)*3)}:host([size=small]) [part=base]{height:var(--size, 24px);padding:0 calc(var(--igc-spacing-small)*4)}[name=prefix]::slotted(*){-webkit-margin-end:var(--igc-spacing-large);margin-inline-end:var(--igc-spacing-large)}[name=suffix]::slotted(*){-webkit-margin-start:var(--igc-spacing-large);margin-inline-start:var(--igc-spacing-large)}span[part=prefix],span[part=suffix]{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}:host(:not([disabled])[variant=outlined]) [part=base],:host(:not([disabled])[variant=flat]) [part=base]{color:hsla(var(--igc-secondary-500), var(--igc-secondary-a));background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]::before,:host(:not([disabled])[variant=flat]) [part=base]::before{opacity:0}:host(:not([disabled])[variant=outlined]) [part=base]:hover::before,:host(:not([disabled])[variant=flat]) [part=base]:hover::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.12}:host(:not([disabled])[variant=outlined]) [part=base]:focus::before,:host(:not([disabled])[variant=flat]) [part=base]:focus::before,:host(:not([disabled])[variant=outlined]) [part=base]:active::before,:host(:not([disabled])[variant=flat]) [part=base]:active::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.24}:host([disabled][variant=flat]) [part=base]{background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]{-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a))}:host([disabled][variant=outlined]) [part=base]{background:rgba(0,0,0,0);-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a))}:host(:not([disabled])[variant=contained]) [part=base],:host(:not([disabled])[variant=fab]) [part=base]{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));color:var(--igc-secondary-500-contrast)}:host([variant=fab]) [part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*var(--size)/2,var(--size)/2);min-width:var(--size);min-height:var(--size)}:host([variant=fab][size=large]) [part=base]{--size: 3rem}:host([variant=fab][size=medium]) [part=base]{--size: 2.5rem}:host([variant=fab][size=small]) [part=base]{--size: 2rem}:host(:not([disabled])[variant=fab]) [part=base],:host(:not([disabled])[variant=contained]) [part=base]{-webkit-transition:-webkit-box-shadow .1s ease-out;transition:-webkit-box-shadow .1s ease-out;-o-transition:box-shadow .1s ease-out;transition:box-shadow .1s ease-out;transition:box-shadow .1s ease-out, -webkit-box-shadow .1s ease-out}:host(:not([disabled])[variant=fab]) [part=base]::before,:host(:not([disabled])[variant=contained]) [part=base]::before{opacity:0}:host(:not([disabled])[variant=fab]) [part=base]:hover,:host(:not([disabled])[variant=contained]) [part=base]:hover{-webkit-box-shadow:var(--igc-elevation-4);box-shadow:var(--igc-elevation-4)}:host(:not([disabled])[variant=fab]) [part=base]:hover::before,:host(:not([disabled])[variant=contained]) [part=base]:hover::before{background:#fff;opacity:.12}:host(:not([disabled])[variant=fab]) [part=base]:focus,:host(:not([disabled])[variant=contained]) [part=base]:focus,:host(:not([disabled])[variant=fab]) [part=base]:active,:host(:not([disabled])[variant=contained]) [part=base]:active{-webkit-box-shadow:var(--igc-elevation-8);box-shadow:var(--igc-elevation-8)}:host(:not([disabled])[variant=fab]) [part=base]:focus::before,:host(:not([disabled])[variant=contained]) [part=base]:focus::before,:host(:not([disabled])[variant=fab]) [part=base]:active::before,:host(:not([disabled])[variant=contained]) [part=base]:active::before{background:#fff;opacity:.24}:host(:not([disabled])[variant=contained]) [part=base]{-webkit-box-shadow:var(--igc-elevation-2);box-shadow:var(--igc-elevation-2)}:host(:not([disabled])[variant=contained]) [part=base]:hover{-webkit-box-shadow:var(--igc-elevation-4);box-shadow:var(--igc-elevation-4)}:host(:not([disabled])[variant=contained]) [part=base]:focus,:host(:not([disabled])[variant=contained]) [part=base]:active{-webkit-box-shadow:var(--igc-elevation-8);box-shadow:var(--igc-elevation-8)}:host(:not([disabled])[variant=fab]) [part=base]{-webkit-box-shadow:var(--igc-elevation-6);box-shadow:var(--igc-elevation-6)}:host(:not([disabled])[variant=fab]) [part=base]:hover,:host(:not([disabled])[variant=fab]) [part=base]:focus,:host(:not([disabled])[variant=fab]) [part=base]:active{-webkit-box-shadow:var(--igc-elevation-12);box-shadow:var(--igc-elevation-12)}`;
+export const styles = css `:host {
+  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)));
+}
+:host *,
+:host *::before,
+:host *::after {
+  -webkit-box-sizing: border-box;
+          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)));
+}
+:host ::-webkit-scrollbar-thumb {
+  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));
+}
+
+[hidden] {
+  display: none !important;
+}
+
+:host {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  vertical-align: middle;
+}
+
+[part=base] {
+  border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.25rem), 0.25rem);
+  font-family: var(--ig-button-font-family);
+  font-size: var(--ig-button-font-size);
+  font-weight: var(--ig-button-font-weight);
+  font-style: var(--ig-button-font-style);
+  line-height: var(--ig-button-line-height);
+  letter-spacing: var(--ig-button-letter-spacing);
+  text-transform: var(--ig-button-text-transform);
+  margin-top: var(--ig-button-margin-top);
+  margin-bottom: var(--ig-button-margin-bottom);
+  position: relative;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  -webkit-box-flex: 1;
+      -ms-flex: 1;
+          flex: 1;
+  border: none;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  outline-style: none;
+  -webkit-tap-highlight-color: transparent;
+  overflow: hidden;
+  white-space: nowrap;
+  text-decoration: none;
+  z-index: 0;
+}
+[part=base]::before {
+  position: absolute;
+  content: "";
+  width: 100%;
+  height: 100%;
+  z-index: -1;
+  will-change: opacity;
+  -webkit-transition: all 0.1s ease-out;
+  -o-transition: all 0.1s ease-out;
+  transition: all 0.1s ease-out;
+}
+
+:host(:not([disabled])) [part=base]:hover {
+  cursor: pointer;
+}
+
+:host([disabled]) {
+  pointer-events: none;
+}
+:host([disabled]) [part=base] {
+  background: hsla(var(--ig-gray-300), var(--ig-gray-a));
+  color: hsla(var(--ig-gray-500), var(--ig-gray-a));
+  -webkit-box-shadow: none;
+          box-shadow: none;
+}
+
+:host([size=large]) [part=base] {
+  height: var(--size, 36px);
+  padding: 0 calc(var(--igc-spacing-large) * 2);
+}
+
+:host([size=medium]) [part=base] {
+  height: var(--size, 30px);
+  padding: 0 calc(var(--igc-spacing-medium) * 3);
+}
+
+:host([size=small]) [part=base] {
+  height: var(--size, 24px);
+  padding: 0 calc(var(--igc-spacing-small) * 4);
+}
+
+[name=prefix]::slotted(*) {
+  -webkit-margin-end: var(--igc-spacing-large);
+          margin-inline-end: var(--igc-spacing-large);
+}
+
+[name=suffix]::slotted(*) {
+  -webkit-margin-start: var(--igc-spacing-large);
+          margin-inline-start: var(--igc-spacing-large);
+}
+
+span[part=prefix],
+span[part=suffix] {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+}
+
+:host(:not([disabled])[variant=outlined]) [part=base], :host(:not([disabled])[variant=flat]) [part=base] {
+  color: hsla(var(--ig-secondary-500), var(--ig-secondary-a));
+  background: transparent;
+}
+:host(:not([disabled])[variant=outlined]) [part=base]::before, :host(:not([disabled])[variant=flat]) [part=base]::before {
+  opacity: 0;
+}
+:host(:not([disabled])[variant=outlined]) [part=base]:hover::before, :host(:not([disabled])[variant=flat]) [part=base]:hover::before {
+  background: hsla(var(--ig-secondary-500), var(--ig-secondary-a));
+  opacity: 0.12;
+}
+:host(:not([disabled])[variant=outlined]) [part=base]:focus::before, :host(:not([disabled])[variant=flat]) [part=base]:focus::before, :host(:not([disabled])[variant=outlined]) [part=base]:active::before, :host(:not([disabled])[variant=flat]) [part=base]:active::before {
+  background: hsla(var(--ig-secondary-500), var(--ig-secondary-a));
+  opacity: 0.24;
+}
+
+:host([disabled][variant=flat]) [part=base] {
+  background: transparent;
+}
+
+:host(:not([disabled])[variant=outlined]) [part=base] {
+  -webkit-box-shadow: inset 0 0 0 1px hsla(var(--ig-secondary-500), var(--ig-secondary-a));
+          box-shadow: inset 0 0 0 1px hsla(var(--ig-secondary-500), var(--ig-secondary-a));
+}
+
+:host([disabled][variant=outlined]) [part=base] {
+  background: transparent;
+  -webkit-box-shadow: inset 0 0 0 1px hsla(var(--ig-gray-300), var(--ig-gray-a));
+          box-shadow: inset 0 0 0 1px hsla(var(--ig-gray-300), var(--ig-gray-a));
+}
+
+:host(:not([disabled])[variant=contained]) [part=base], :host(:not([disabled])[variant=fab]) [part=base] {
+  background: hsla(var(--ig-secondary-500), var(--ig-secondary-a));
+  color: var(--ig-secondary-500-contrast);
+}
+
+:host([variant=fab]) [part=base] {
+  border-radius: clamp(0rem, calc(var(--ig-radius-factor) * calc(var(--size) / 2)), calc(var(--size) / 2));
+  min-width: var(--size);
+  min-height: var(--size);
+}
+
+:host([variant=fab][size=large]) [part=base] {
+  --size: 3rem;
+}
+
+:host([variant=fab][size=medium]) [part=base] {
+  --size: 2.5rem;
+}
+
+:host([variant=fab][size=small]) [part=base] {
+  --size: 2rem;
+}
+
+:host(:not([disabled])[variant=fab]) [part=base], :host(:not([disabled])[variant=contained]) [part=base] {
+  -webkit-transition: -webkit-box-shadow 0.1s ease-out;
+  transition: -webkit-box-shadow 0.1s ease-out;
+  -o-transition: box-shadow 0.1s ease-out;
+  transition: box-shadow 0.1s ease-out;
+  transition: box-shadow 0.1s ease-out, -webkit-box-shadow 0.1s ease-out;
+}
+:host(:not([disabled])[variant=fab]) [part=base]::before, :host(:not([disabled])[variant=contained]) [part=base]::before {
+  opacity: 0;
+}
+:host(:not([disabled])[variant=fab]) [part=base]:hover, :host(:not([disabled])[variant=contained]) [part=base]:hover {
+  -webkit-box-shadow: var(--ig-elevation-4);
+          box-shadow: var(--ig-elevation-4);
+}
+:host(:not([disabled])[variant=fab]) [part=base]:hover::before, :host(:not([disabled])[variant=contained]) [part=base]:hover::before {
+  background: #fff;
+  opacity: 0.12;
+}
+:host(:not([disabled])[variant=fab]) [part=base]:focus, :host(:not([disabled])[variant=contained]) [part=base]:focus, :host(:not([disabled])[variant=fab]) [part=base]:active, :host(:not([disabled])[variant=contained]) [part=base]:active {
+  -webkit-box-shadow: var(--ig-elevation-8);
+          box-shadow: var(--ig-elevation-8);
+}
+:host(:not([disabled])[variant=fab]) [part=base]:focus::before, :host(:not([disabled])[variant=contained]) [part=base]:focus::before, :host(:not([disabled])[variant=fab]) [part=base]:active::before, :host(:not([disabled])[variant=contained]) [part=base]:active::before {
+  background: #fff;
+  opacity: 0.24;
+}
+
+:host(:not([disabled])[variant=contained]) [part=base] {
+  -webkit-box-shadow: var(--ig-elevation-2);
+          box-shadow: var(--ig-elevation-2);
+}
+:host(:not([disabled])[variant=contained]) [part=base]:hover {
+  -webkit-box-shadow: var(--ig-elevation-4);
+          box-shadow: var(--ig-elevation-4);
+}
+:host(:not([disabled])[variant=contained]) [part=base]:focus, :host(:not([disabled])[variant=contained]) [part=base]:active {
+  -webkit-box-shadow: var(--ig-elevation-8);
+          box-shadow: var(--ig-elevation-8);
+}
+
+:host(:not([disabled])[variant=fab]) [part=base] {
+  -webkit-box-shadow: var(--ig-elevation-6);
+          box-shadow: var(--ig-elevation-6);
+}
+:host(:not([disabled])[variant=fab]) [part=base]:hover, :host(:not([disabled])[variant=fab]) [part=base]:focus, :host(:not([disabled])[variant=fab]) [part=base]:active {
+  -webkit-box-shadow: var(--ig-elevation-12);
+          box-shadow: var(--ig-elevation-12);
+}`;
 //# sourceMappingURL=button.material.css.js.map

package/components/button/themes/button/light/button.material.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.material.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/button/light/button.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,u6NAAu6N,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{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(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;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(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}[part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-flex:1;-ms-flex:1;flex:1;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline-style:none;-webkit-tap-highlight-color:rgba(0,0,0,0);overflow:hidden;white-space:nowrap;text-decoration:none;z-index:0;font-family:var(--igc-button-font-family);font-weight:var(--igc-button-font-weight);font-size:var(--igc-button-font-size);font-style:var(--igc-button-font-style);letter-spacing:var(--igc-button-letter-spacing);line-height:var(--igc-button-line-height);text-transform:var(--igc-button-text-transform)}[part=base]::before{position:absolute;content:\"\";width:100%;height:100%;z-index:-1;will-change:opacity;-webkit-transition:all .1s ease-out;-o-transition:all .1s ease-out;transition:all .1s ease-out}:host(:not([disabled])) [part=base]:hover{cursor:pointer}:host([disabled]){pointer-events:none}:host([disabled]) [part=base]{background:hsla(var(--igc-gray-300), var(--igc-gray-a));color:hsla(var(--igc-gray-500), var(--igc-gray-a));-webkit-box-shadow:none;box-shadow:none}:host([size=large]) [part=base]{height:var(--size, 36px);padding:0 calc(var(--igc-spacing-large)*2)}:host([size=medium]) [part=base]{height:var(--size, 30px);padding:0 calc(var(--igc-spacing-medium)*3)}:host([size=small]) [part=base]{height:var(--size, 24px);padding:0 calc(var(--igc-spacing-small)*4)}[name=prefix]::slotted(*){-webkit-margin-end:var(--igc-spacing-large);margin-inline-end:var(--igc-spacing-large)}[name=suffix]::slotted(*){-webkit-margin-start:var(--igc-spacing-large);margin-inline-start:var(--igc-spacing-large)}span[part=prefix],span[part=suffix]{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}:host(:not([disabled])[variant=outlined]) [part=base],:host(:not([disabled])[variant=flat]) [part=base]{color:hsla(var(--igc-secondary-500), var(--igc-secondary-a));background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]::before,:host(:not([disabled])[variant=flat]) [part=base]::before{opacity:0}:host(:not([disabled])[variant=outlined]) [part=base]:hover::before,:host(:not([disabled])[variant=flat]) [part=base]:hover::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.12}:host(:not([disabled])[variant=outlined]) [part=base]:focus::before,:host(:not([disabled])[variant=flat]) [part=base]:focus::before,:host(:not([disabled])[variant=outlined]) [part=base]:active::before,:host(:not([disabled])[variant=flat]) [part=base]:active::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.24}:host([disabled][variant=flat]) [part=base]{background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]{-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a))}:host([disabled][variant=outlined]) [part=base]{background:rgba(0,0,0,0);-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a))}:host(:not([disabled])[variant=contained]) [part=base],:host(:not([disabled])[variant=fab]) [part=base]{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));color:var(--igc-secondary-500-contrast)}:host([variant=fab]) [part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*var(--size)/2,var(--size)/2);min-width:var(--size);min-height:var(--size)}:host([variant=fab][size=large]) [part=base]{--size: 3rem}:host([variant=fab][size=medium]) [part=base]{--size: 2.5rem}:host([variant=fab][size=small]) [part=base]{--size: 2rem}:host(:not([disabled])[variant=fab]) [part=base],:host(:not([disabled])[variant=contained]) [part=base]{-webkit-transition:-webkit-box-shadow .1s ease-out;transition:-webkit-box-shadow .1s ease-out;-o-transition:box-shadow .1s ease-out;transition:box-shadow .1s ease-out;transition:box-shadow .1s ease-out, -webkit-box-shadow .1s ease-out}:host(:not([disabled])[variant=fab]) [part=base]::before,:host(:not([disabled])[variant=contained]) [part=base]::before{opacity:0}:host(:not([disabled])[variant=fab]) [part=base]:hover,:host(:not([disabled])[variant=contained]) [part=base]:hover{-webkit-box-shadow:var(--igc-elevation-4);box-shadow:var(--igc-elevation-4)}:host(:not([disabled])[variant=fab]) [part=base]:hover::before,:host(:not([disabled])[variant=contained]) [part=base]:hover::before{background:#fff;opacity:.12}:host(:not([disabled])[variant=fab]) [part=base]:focus,:host(:not([disabled])[variant=contained]) [part=base]:focus,:host(:not([disabled])[variant=fab]) [part=base]:active,:host(:not([disabled])[variant=contained]) [part=base]:active{-webkit-box-shadow:var(--igc-elevation-8);box-shadow:var(--igc-elevation-8)}:host(:not([disabled])[variant=fab]) [part=base]:focus::before,:host(:not([disabled])[variant=contained]) [part=base]:focus::before,:host(:not([disabled])[variant=fab]) [part=base]:active::before,:host(:not([disabled])[variant=contained]) [part=base]:active::before{background:#fff;opacity:.24}:host(:not([disabled])[variant=contained]) [part=base]{-webkit-box-shadow:var(--igc-elevation-2);box-shadow:var(--igc-elevation-2)}:host(:not([disabled])[variant=contained]) [part=base]:hover{-webkit-box-shadow:var(--igc-elevation-4);box-shadow:var(--igc-elevation-4)}:host(:not([disabled])[variant=contained]) [part=base]:focus,:host(:not([disabled])[variant=contained]) [part=base]:active{-webkit-box-shadow:var(--igc-elevation-8);box-shadow:var(--igc-elevation-8)}:host(:not([disabled])[variant=fab]) [part=base]{-webkit-box-shadow:var(--igc-elevation-6);box-shadow:var(--igc-elevation-6)}:host(:not([disabled])[variant=fab]) [part=base]:hover,:host(:not([disabled])[variant=fab]) [part=base]:focus,:host(:not([disabled])[variant=fab]) [part=base]:active{-webkit-box-shadow:var(--igc-elevation-12);box-shadow:var(--igc-elevation-12)}`;\n"]}
+{"version":3,"file":"button.material.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/button/light/button.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuOvB,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:host {\n  display: -webkit-inline-box;\n  display: -ms-inline-flexbox;\n  display: inline-flex;\n  vertical-align: middle;\n}\n\n[part=base] {\n  border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.25rem), 0.25rem);\n  font-family: var(--ig-button-font-family);\n  font-size: var(--ig-button-font-size);\n  font-weight: var(--ig-button-font-weight);\n  font-style: var(--ig-button-font-style);\n  line-height: var(--ig-button-line-height);\n  letter-spacing: var(--ig-button-letter-spacing);\n  text-transform: var(--ig-button-text-transform);\n  margin-top: var(--ig-button-margin-top);\n  margin-bottom: var(--ig-button-margin-bottom);\n  position: relative;\n  display: -webkit-inline-box;\n  display: -ms-inline-flexbox;\n  display: inline-flex;\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  -webkit-box-flex: 1;\n      -ms-flex: 1;\n          flex: 1;\n  border: none;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  outline-style: none;\n  -webkit-tap-highlight-color: transparent;\n  overflow: hidden;\n  white-space: nowrap;\n  text-decoration: none;\n  z-index: 0;\n}\n[part=base]::before {\n  position: absolute;\n  content: \"\";\n  width: 100%;\n  height: 100%;\n  z-index: -1;\n  will-change: opacity;\n  -webkit-transition: all 0.1s ease-out;\n  -o-transition: all 0.1s ease-out;\n  transition: all 0.1s ease-out;\n}\n\n:host(:not([disabled])) [part=base]:hover {\n  cursor: pointer;\n}\n\n:host([disabled]) {\n  pointer-events: none;\n}\n:host([disabled]) [part=base] {\n  background: hsla(var(--ig-gray-300), var(--ig-gray-a));\n  color: hsla(var(--ig-gray-500), var(--ig-gray-a));\n  -webkit-box-shadow: none;\n          box-shadow: none;\n}\n\n:host([size=large]) [part=base] {\n  height: var(--size, 36px);\n  padding: 0 calc(var(--igc-spacing-large) * 2);\n}\n\n:host([size=medium]) [part=base] {\n  height: var(--size, 30px);\n  padding: 0 calc(var(--igc-spacing-medium) * 3);\n}\n\n:host([size=small]) [part=base] {\n  height: var(--size, 24px);\n  padding: 0 calc(var(--igc-spacing-small) * 4);\n}\n\n[name=prefix]::slotted(*) {\n  -webkit-margin-end: var(--igc-spacing-large);\n          margin-inline-end: var(--igc-spacing-large);\n}\n\n[name=suffix]::slotted(*) {\n  -webkit-margin-start: var(--igc-spacing-large);\n          margin-inline-start: var(--igc-spacing-large);\n}\n\nspan[part=prefix],\nspan[part=suffix] {\n  display: -webkit-inline-box;\n  display: -ms-inline-flexbox;\n  display: inline-flex;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n}\n\n:host(:not([disabled])[variant=outlined]) [part=base], :host(:not([disabled])[variant=flat]) [part=base] {\n  color: hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n  background: transparent;\n}\n:host(:not([disabled])[variant=outlined]) [part=base]::before, :host(:not([disabled])[variant=flat]) [part=base]::before {\n  opacity: 0;\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:hover::before, :host(:not([disabled])[variant=flat]) [part=base]:hover::before {\n  background: hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n  opacity: 0.12;\n}\n:host(:not([disabled])[variant=outlined]) [part=base]:focus::before, :host(:not([disabled])[variant=flat]) [part=base]:focus::before, :host(:not([disabled])[variant=outlined]) [part=base]:active::before, :host(:not([disabled])[variant=flat]) [part=base]:active::before {\n  background: hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n  opacity: 0.24;\n}\n\n:host([disabled][variant=flat]) [part=base] {\n  background: transparent;\n}\n\n:host(:not([disabled])[variant=outlined]) [part=base] {\n  -webkit-box-shadow: inset 0 0 0 1px hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n          box-shadow: inset 0 0 0 1px hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n}\n\n:host([disabled][variant=outlined]) [part=base] {\n  background: transparent;\n  -webkit-box-shadow: inset 0 0 0 1px hsla(var(--ig-gray-300), var(--ig-gray-a));\n          box-shadow: inset 0 0 0 1px hsla(var(--ig-gray-300), var(--ig-gray-a));\n}\n\n:host(:not([disabled])[variant=contained]) [part=base], :host(:not([disabled])[variant=fab]) [part=base] {\n  background: hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n  color: var(--ig-secondary-500-contrast);\n}\n\n:host([variant=fab]) [part=base] {\n  border-radius: clamp(0rem, calc(var(--ig-radius-factor) * calc(var(--size) / 2)), calc(var(--size) / 2));\n  min-width: var(--size);\n  min-height: var(--size);\n}\n\n:host([variant=fab][size=large]) [part=base] {\n  --size: 3rem;\n}\n\n:host([variant=fab][size=medium]) [part=base] {\n  --size: 2.5rem;\n}\n\n:host([variant=fab][size=small]) [part=base] {\n  --size: 2rem;\n}\n\n:host(:not([disabled])[variant=fab]) [part=base], :host(:not([disabled])[variant=contained]) [part=base] {\n  -webkit-transition: -webkit-box-shadow 0.1s ease-out;\n  transition: -webkit-box-shadow 0.1s ease-out;\n  -o-transition: box-shadow 0.1s ease-out;\n  transition: box-shadow 0.1s ease-out;\n  transition: box-shadow 0.1s ease-out, -webkit-box-shadow 0.1s ease-out;\n}\n:host(:not([disabled])[variant=fab]) [part=base]::before, :host(:not([disabled])[variant=contained]) [part=base]::before {\n  opacity: 0;\n}\n:host(:not([disabled])[variant=fab]) [part=base]:hover, :host(:not([disabled])[variant=contained]) [part=base]:hover {\n  -webkit-box-shadow: var(--ig-elevation-4);\n          box-shadow: var(--ig-elevation-4);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:hover::before, :host(:not([disabled])[variant=contained]) [part=base]:hover::before {\n  background: #fff;\n  opacity: 0.12;\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus, :host(:not([disabled])[variant=contained]) [part=base]:focus, :host(:not([disabled])[variant=fab]) [part=base]:active, :host(:not([disabled])[variant=contained]) [part=base]:active {\n  -webkit-box-shadow: var(--ig-elevation-8);\n          box-shadow: var(--ig-elevation-8);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:focus::before, :host(:not([disabled])[variant=contained]) [part=base]:focus::before, :host(:not([disabled])[variant=fab]) [part=base]:active::before, :host(:not([disabled])[variant=contained]) [part=base]:active::before {\n  background: #fff;\n  opacity: 0.24;\n}\n\n:host(:not([disabled])[variant=contained]) [part=base] {\n  -webkit-box-shadow: var(--ig-elevation-2);\n          box-shadow: var(--ig-elevation-2);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:hover {\n  -webkit-box-shadow: var(--ig-elevation-4);\n          box-shadow: var(--ig-elevation-4);\n}\n:host(:not([disabled])[variant=contained]) [part=base]:focus, :host(:not([disabled])[variant=contained]) [part=base]:active {\n  -webkit-box-shadow: var(--ig-elevation-8);\n          box-shadow: var(--ig-elevation-8);\n}\n\n:host(:not([disabled])[variant=fab]) [part=base] {\n  -webkit-box-shadow: var(--ig-elevation-6);\n          box-shadow: var(--ig-elevation-6);\n}\n:host(:not([disabled])[variant=fab]) [part=base]:hover, :host(:not([disabled])[variant=fab]) [part=base]:focus, :host(:not([disabled])[variant=fab]) [part=base]:active {\n  -webkit-box-shadow: var(--ig-elevation-12);\n          box-shadow: var(--ig-elevation-12);\n}`;\n"]}

package/components/button/themes/icon-button/light/icon-button.base.css.js

@@ -1,3 +1,102 @@
 import { css } from 'lit';
-export const styles = css `:host{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(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;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(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}::slotted(*){font-size:var(--size) !important;vertical-align:middle}slot{pointer-events:none}[part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*50%,50%);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border:none;outline-style:none;background:rgba(0,0,0,0);padding:0;color:hsla(var(--igc-gray-900), var(--igc-gray-a));-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer;-webkit-transition:background .15s ease-out,-webkit-box-shadow .2s ease-in;transition:background .15s ease-out,-webkit-box-shadow .2s ease-in;-o-transition:box-shadow .2s ease-in,background .15s ease-out;transition:box-shadow .2s ease-in,background .15s ease-out;transition:box-shadow .2s ease-in,background .15s ease-out,-webkit-box-shadow .2s ease-in;-webkit-transition-delay:.05s;-o-transition-delay:.05s;transition-delay:.05s;font-size:var(--size);line-height:1}:host([size=small]){--size: 1rem}:host([size=small]) [part=base]{padding:calc(var(--igc-spacing-small)*2)}:host([size=medium]){--size: 1.25rem}:host([size=medium]) [part=base]{padding:calc(var(--igc-spacing-medium)*1.25)}:host([size=large]){--size: 1.5rem}:host([size=large]) [part=base]{padding:calc(var(--igc-spacing-large)*.75)}:host([disabled]){pointer-events:none}`;
+export const styles = css `:host {
+  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)));
+}
+:host *,
+:host *::before,
+:host *::after {
+  -webkit-box-sizing: border-box;
+          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)));
+}
+:host ::-webkit-scrollbar-thumb {
+  background: var(--igc-scrollbar-thumb-color, hsla(var(--ig-gray-400), var(--ig-gray-a)));
+}
+
+[hidden] {
+  display: none !important;
+}
+
+:host {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  vertical-align: middle;
+}
+
+::slotted(*) {
+  font-size: var(--size) !important;
+  vertical-align: middle;
+}
+
+slot {
+  pointer-events: none;
+}
+
+[part=base] {
+  border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 50%), 50%);
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  border: none;
+  outline-style: none;
+  background: transparent;
+  padding: 0;
+  color: hsla(var(--ig-gray-900), var(--ig-gray-a));
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  -webkit-tap-highlight-color: transparent;
+  cursor: pointer;
+  -webkit-transition: background 0.15s ease-out, -webkit-box-shadow 0.2s ease-in;
+  transition: background 0.15s ease-out, -webkit-box-shadow 0.2s ease-in;
+  -o-transition: box-shadow 0.2s ease-in, background 0.15s ease-out;
+  transition: box-shadow 0.2s ease-in, background 0.15s ease-out;
+  transition: box-shadow 0.2s ease-in, background 0.15s ease-out, -webkit-box-shadow 0.2s ease-in;
+  -webkit-transition-delay: 0.05s;
+       -o-transition-delay: 0.05s;
+          transition-delay: 0.05s;
+  font-size: var(--size);
+  line-height: 1;
+}
+
+:host([size=small]) {
+  --size: 1rem;
+}
+:host([size=small]) [part=base] {
+  padding: calc(var(--igc-spacing-small) * 2);
+}
+
+:host([size=medium]) {
+  --size: 1.25rem;
+}
+:host([size=medium]) [part=base] {
+  padding: calc(var(--igc-spacing-medium) * 1.25);
+}
+
+:host([size=large]) {
+  --size: 1.5rem;
+}
+:host([size=large]) [part=base] {
+  padding: calc(var(--igc-spacing-large) * 0.75);
+}
+
+:host([disabled]) {
+  pointer-events: none;
+}`;
 //# sourceMappingURL=icon-button.base.css.js.map

package/components/button/themes/icon-button/light/icon-button.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon-button.base.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/light/icon-button.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,2uEAA2uE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{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(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;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(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}::slotted(*){font-size:var(--size) !important;vertical-align:middle}slot{pointer-events:none}[part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*50%,50%);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border:none;outline-style:none;background:rgba(0,0,0,0);padding:0;color:hsla(var(--igc-gray-900), var(--igc-gray-a));-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer;-webkit-transition:background .15s ease-out,-webkit-box-shadow .2s ease-in;transition:background .15s ease-out,-webkit-box-shadow .2s ease-in;-o-transition:box-shadow .2s ease-in,background .15s ease-out;transition:box-shadow .2s ease-in,background .15s ease-out;transition:box-shadow .2s ease-in,background .15s ease-out,-webkit-box-shadow .2s ease-in;-webkit-transition-delay:.05s;-o-transition-delay:.05s;transition-delay:.05s;font-size:var(--size);line-height:1}:host([size=small]){--size: 1rem}:host([size=small]) [part=base]{padding:calc(var(--igc-spacing-small)*2)}:host([size=medium]){--size: 1.25rem}:host([size=medium]) [part=base]{padding:calc(var(--igc-spacing-medium)*1.25)}:host([size=large]){--size: 1.5rem}:host([size=large]) [part=base]{padding:calc(var(--igc-spacing-large)*.75)}:host([disabled]){pointer-events:none}`;\n"]}
+{"version":3,"file":"icon-button.base.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/light/icon-button.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmGvB,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:host {\n  display: -webkit-inline-box;\n  display: -ms-inline-flexbox;\n  display: inline-flex;\n  vertical-align: middle;\n}\n\n::slotted(*) {\n  font-size: var(--size) !important;\n  vertical-align: middle;\n}\n\nslot {\n  pointer-events: none;\n}\n\n[part=base] {\n  border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 50%), 50%);\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-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  border: none;\n  outline-style: none;\n  background: transparent;\n  padding: 0;\n  color: hsla(var(--ig-gray-900), var(--ig-gray-a));\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  -webkit-tap-highlight-color: transparent;\n  cursor: pointer;\n  -webkit-transition: background 0.15s ease-out, -webkit-box-shadow 0.2s ease-in;\n  transition: background 0.15s ease-out, -webkit-box-shadow 0.2s ease-in;\n  -o-transition: box-shadow 0.2s ease-in, background 0.15s ease-out;\n  transition: box-shadow 0.2s ease-in, background 0.15s ease-out;\n  transition: box-shadow 0.2s ease-in, background 0.15s ease-out, -webkit-box-shadow 0.2s ease-in;\n  -webkit-transition-delay: 0.05s;\n       -o-transition-delay: 0.05s;\n          transition-delay: 0.05s;\n  font-size: var(--size);\n  line-height: 1;\n}\n\n:host([size=small]) {\n  --size: 1rem;\n}\n:host([size=small]) [part=base] {\n  padding: calc(var(--igc-spacing-small) * 2);\n}\n\n:host([size=medium]) {\n  --size: 1.25rem;\n}\n:host([size=medium]) [part=base] {\n  padding: calc(var(--igc-spacing-medium) * 1.25);\n}\n\n:host([size=large]) {\n  --size: 1.5rem;\n}\n:host([size=large]) [part=base] {\n  padding: calc(var(--igc-spacing-large) * 0.75);\n}\n\n:host([disabled]) {\n  pointer-events: none;\n}`;\n"]}

package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js

@@ -1,3 +1,82 @@
 import { css } from 'lit';
-export const styles = css `[part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);-webkit-transition:color .15s ease-out,background .15s ease-out,-webkit-box-shadow .15s ease-out;transition:color .15s ease-out,background .15s ease-out,-webkit-box-shadow .15s ease-out;-o-transition:box-shadow .15s ease-out,color .15s ease-out,background .15s ease-out;transition:box-shadow .15s ease-out,color .15s ease-out,background .15s ease-out;transition:box-shadow .15s ease-out,color .15s ease-out,background .15s ease-out,-webkit-box-shadow .15s ease-out;color:hsla(var(--igc-primary-500), var(--igc-primary-a))}[part=base]:hover{color:hsla(var(--igc-primary-800), var(--igc-primary-a))}[part=base]:focus,[part=base]:active{color:hsla(var(--igc-primary-600), var(--igc-primary-a));background:hsla(var(--igc-gray-100), var(--igc-gray-a));-webkit-box-shadow:none;box-shadow:none}:host([size=small]) [part=base]{width:1.9375rem;height:1.9375rem;padding:calc(var(--igc-spacing-small)*3.75)}:host([size=medium]) [part=base]{width:2.375rem;height:2.375rem;padding:calc(var(--igc-spacing-medium)*2.25)}:host([size=large]) [part=base]{width:3rem;height:3rem;padding:calc(var(--igc-spacing-large)*1.5)}:host([variant=contained]) [part=base]{color:var(--igc-primary-600-contrast);background:hsla(var(--igc-primary-500), var(--igc-primary-a))}:host([variant=contained]) [part=base]:hover{background:hsla(var(--igc-primary-600), var(--igc-primary-a))}:host([variant=contained]) [part=base]:focus,:host([variant=contained]) [part=base]:active{background:hsla(var(--igc-primary-600), var(--igc-primary-a));-webkit-box-shadow:0 0 0 .25rem hsla(var(--igc-primary-200), 0.5);box-shadow:0 0 0 .25rem hsla(var(--igc-primary-200), 0.5)}:host([variant=outlined]) [part=base]{-webkit-box-shadow:0 0 0 .0625rem hsla(var(--igc-primary-500), var(--igc-primary-a));box-shadow:0 0 0 .0625rem hsla(var(--igc-primary-500), var(--igc-primary-a))}:host([variant=outlined]) [part=base]:hover{color:var(--igc-primary-600-contrast);background:hsla(var(--igc-primary-600), var(--igc-primary-a))}:host([variant=outlined]) [part=base]:focus,:host([variant=outlined]) [part=base]:active{color:var(--igc-primary-600-contrast);background:hsla(var(--igc-primary-600), var(--igc-primary-a));-webkit-box-shadow:0 0 0 .25rem hsla(var(--igc-primary-200), 0.5);box-shadow:0 0 0 .25rem hsla(var(--igc-primary-200), 0.5)}:host([disabled]) [part=base]{color:hsla(var(--igc-primary-100), var(--igc-primary-a));background:rgba(0,0,0,0)}:host([disabled][variant=contained]) [part=base]{background:hsla(var(--igc-primary-100), var(--igc-primary-a));color:hsla(var(--igc-primary-300), var(--igc-primary-a))}:host([disabled][variant=outlined]) [part=base]{color:hsla(var(--igc-primary-100), var(--igc-primary-a));-webkit-box-shadow:0 0 0 .0625rem hsla(var(--igc-primary-100), var(--igc-primary-a));box-shadow:0 0 0 .0625rem hsla(var(--igc-primary-100), var(--igc-primary-a))}`;
+export const styles = css `[part=base] {
+  border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.25rem), 0.25rem);
+  -webkit-transition: color 0.15s ease-out, background 0.15s ease-out, -webkit-box-shadow 0.15s ease-out;
+  transition: color 0.15s ease-out, background 0.15s ease-out, -webkit-box-shadow 0.15s ease-out;
+  -o-transition: box-shadow 0.15s ease-out, color 0.15s ease-out, background 0.15s ease-out;
+  transition: box-shadow 0.15s ease-out, color 0.15s ease-out, background 0.15s ease-out;
+  transition: box-shadow 0.15s ease-out, color 0.15s ease-out, background 0.15s ease-out, -webkit-box-shadow 0.15s ease-out;
+  color: hsla(var(--ig-primary-500), var(--ig-primary-a));
+}
+[part=base]:hover {
+  color: hsla(var(--ig-primary-800), var(--ig-primary-a));
+}
+[part=base]:focus, [part=base]:active {
+  color: hsla(var(--ig-primary-600), var(--ig-primary-a));
+  background: hsla(var(--ig-gray-100), var(--ig-gray-a));
+  -webkit-box-shadow: none;
+          box-shadow: none;
+}
+
+:host([size=small]) [part=base] {
+  width: 1.9375rem;
+  height: 1.9375rem;
+  padding: calc(var(--igc-spacing-small) * 3.75);
+}
+
+:host([size=medium]) [part=base] {
+  width: 2.375rem;
+  height: 2.375rem;
+  padding: calc(var(--igc-spacing-medium) * 2.25);
+}
+
+:host([size=large]) [part=base] {
+  width: 3rem;
+  height: 3rem;
+  padding: calc(var(--igc-spacing-large) * 1.5);
+}
+
+:host([variant=contained]) [part=base] {
+  color: var(--ig-primary-600-contrast);
+  background: hsla(var(--ig-primary-500), var(--ig-primary-a));
+}
+:host([variant=contained]) [part=base]:hover {
+  background: hsla(var(--ig-primary-600), var(--ig-primary-a));
+}
+:host([variant=contained]) [part=base]:focus, :host([variant=contained]) [part=base]:active {
+  background: hsla(var(--ig-primary-600), var(--ig-primary-a));
+  -webkit-box-shadow: 0 0 0 0.25rem hsla(var(--ig-primary-200), 0.5);
+          box-shadow: 0 0 0 0.25rem hsla(var(--ig-primary-200), 0.5);
+}
+
+:host([variant=outlined]) [part=base] {
+  -webkit-box-shadow: 0 0 0 0.0625rem hsla(var(--ig-primary-500), var(--ig-primary-a));
+          box-shadow: 0 0 0 0.0625rem hsla(var(--ig-primary-500), var(--ig-primary-a));
+}
+:host([variant=outlined]) [part=base]:hover {
+  color: var(--ig-primary-600-contrast);
+  background: hsla(var(--ig-primary-600), var(--ig-primary-a));
+}
+:host([variant=outlined]) [part=base]:focus, :host([variant=outlined]) [part=base]:active {
+  color: var(--ig-primary-600-contrast);
+  background: hsla(var(--ig-primary-600), var(--ig-primary-a));
+  -webkit-box-shadow: 0 0 0 0.25rem hsla(var(--ig-primary-200), 0.5);
+          box-shadow: 0 0 0 0.25rem hsla(var(--ig-primary-200), 0.5);
+}
+
+:host([disabled]) [part=base] {
+  color: hsla(var(--ig-primary-100), var(--ig-primary-a));
+  background: transparent;
+}
+
+:host([disabled][variant=contained]) [part=base] {
+  background: hsla(var(--ig-primary-100), var(--ig-primary-a));
+  color: hsla(var(--ig-primary-300), var(--ig-primary-a));
+}
+
+:host([disabled][variant=outlined]) [part=base] {
+  color: hsla(var(--ig-primary-100), var(--ig-primary-a));
+  -webkit-box-shadow: 0 0 0 0.0625rem hsla(var(--ig-primary-100), var(--ig-primary-a));
+          box-shadow: 0 0 0 0.0625rem hsla(var(--ig-primary-100), var(--ig-primary-a));
+}`;
 //# sourceMappingURL=icon-button.bootstrap.css.js.map

package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon-button.bootstrap.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/light/icon-button.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,61FAA61F,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`[part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);-webkit-transition:color .15s ease-out,background .15s ease-out,-webkit-box-shadow .15s ease-out;transition:color .15s ease-out,background .15s ease-out,-webkit-box-shadow .15s ease-out;-o-transition:box-shadow .15s ease-out,color .15s ease-out,background .15s ease-out;transition:box-shadow .15s ease-out,color .15s ease-out,background .15s ease-out;transition:box-shadow .15s ease-out,color .15s ease-out,background .15s ease-out,-webkit-box-shadow .15s ease-out;color:hsla(var(--igc-primary-500), var(--igc-primary-a))}[part=base]:hover{color:hsla(var(--igc-primary-800), var(--igc-primary-a))}[part=base]:focus,[part=base]:active{color:hsla(var(--igc-primary-600), var(--igc-primary-a));background:hsla(var(--igc-gray-100), var(--igc-gray-a));-webkit-box-shadow:none;box-shadow:none}:host([size=small]) [part=base]{width:1.9375rem;height:1.9375rem;padding:calc(var(--igc-spacing-small)*3.75)}:host([size=medium]) [part=base]{width:2.375rem;height:2.375rem;padding:calc(var(--igc-spacing-medium)*2.25)}:host([size=large]) [part=base]{width:3rem;height:3rem;padding:calc(var(--igc-spacing-large)*1.5)}:host([variant=contained]) [part=base]{color:var(--igc-primary-600-contrast);background:hsla(var(--igc-primary-500), var(--igc-primary-a))}:host([variant=contained]) [part=base]:hover{background:hsla(var(--igc-primary-600), var(--igc-primary-a))}:host([variant=contained]) [part=base]:focus,:host([variant=contained]) [part=base]:active{background:hsla(var(--igc-primary-600), var(--igc-primary-a));-webkit-box-shadow:0 0 0 .25rem hsla(var(--igc-primary-200), 0.5);box-shadow:0 0 0 .25rem hsla(var(--igc-primary-200), 0.5)}:host([variant=outlined]) [part=base]{-webkit-box-shadow:0 0 0 .0625rem hsla(var(--igc-primary-500), var(--igc-primary-a));box-shadow:0 0 0 .0625rem hsla(var(--igc-primary-500), var(--igc-primary-a))}:host([variant=outlined]) [part=base]:hover{color:var(--igc-primary-600-contrast);background:hsla(var(--igc-primary-600), var(--igc-primary-a))}:host([variant=outlined]) [part=base]:focus,:host([variant=outlined]) [part=base]:active{color:var(--igc-primary-600-contrast);background:hsla(var(--igc-primary-600), var(--igc-primary-a));-webkit-box-shadow:0 0 0 .25rem hsla(var(--igc-primary-200), 0.5);box-shadow:0 0 0 .25rem hsla(var(--igc-primary-200), 0.5)}:host([disabled]) [part=base]{color:hsla(var(--igc-primary-100), var(--igc-primary-a));background:rgba(0,0,0,0)}:host([disabled][variant=contained]) [part=base]{background:hsla(var(--igc-primary-100), var(--igc-primary-a));color:hsla(var(--igc-primary-300), var(--igc-primary-a))}:host([disabled][variant=outlined]) [part=base]{color:hsla(var(--igc-primary-100), var(--igc-primary-a));-webkit-box-shadow:0 0 0 .0625rem hsla(var(--igc-primary-100), var(--igc-primary-a));box-shadow:0 0 0 .0625rem hsla(var(--igc-primary-100), var(--igc-primary-a))}`;\n"]}
+{"version":3,"file":"icon-button.bootstrap.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/light/icon-button.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+EvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`[part=base] {\n  border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.25rem), 0.25rem);\n  -webkit-transition: color 0.15s ease-out, background 0.15s ease-out, -webkit-box-shadow 0.15s ease-out;\n  transition: color 0.15s ease-out, background 0.15s ease-out, -webkit-box-shadow 0.15s ease-out;\n  -o-transition: box-shadow 0.15s ease-out, color 0.15s ease-out, background 0.15s ease-out;\n  transition: box-shadow 0.15s ease-out, color 0.15s ease-out, background 0.15s ease-out;\n  transition: box-shadow 0.15s ease-out, color 0.15s ease-out, background 0.15s ease-out, -webkit-box-shadow 0.15s ease-out;\n  color: hsla(var(--ig-primary-500), var(--ig-primary-a));\n}\n[part=base]:hover {\n  color: hsla(var(--ig-primary-800), var(--ig-primary-a));\n}\n[part=base]:focus, [part=base]:active {\n  color: hsla(var(--ig-primary-600), var(--ig-primary-a));\n  background: hsla(var(--ig-gray-100), var(--ig-gray-a));\n  -webkit-box-shadow: none;\n          box-shadow: none;\n}\n\n:host([size=small]) [part=base] {\n  width: 1.9375rem;\n  height: 1.9375rem;\n  padding: calc(var(--igc-spacing-small) * 3.75);\n}\n\n:host([size=medium]) [part=base] {\n  width: 2.375rem;\n  height: 2.375rem;\n  padding: calc(var(--igc-spacing-medium) * 2.25);\n}\n\n:host([size=large]) [part=base] {\n  width: 3rem;\n  height: 3rem;\n  padding: calc(var(--igc-spacing-large) * 1.5);\n}\n\n:host([variant=contained]) [part=base] {\n  color: var(--ig-primary-600-contrast);\n  background: hsla(var(--ig-primary-500), var(--ig-primary-a));\n}\n:host([variant=contained]) [part=base]:hover {\n  background: hsla(var(--ig-primary-600), var(--ig-primary-a));\n}\n:host([variant=contained]) [part=base]:focus, :host([variant=contained]) [part=base]:active {\n  background: hsla(var(--ig-primary-600), var(--ig-primary-a));\n  -webkit-box-shadow: 0 0 0 0.25rem hsla(var(--ig-primary-200), 0.5);\n          box-shadow: 0 0 0 0.25rem hsla(var(--ig-primary-200), 0.5);\n}\n\n:host([variant=outlined]) [part=base] {\n  -webkit-box-shadow: 0 0 0 0.0625rem hsla(var(--ig-primary-500), var(--ig-primary-a));\n          box-shadow: 0 0 0 0.0625rem hsla(var(--ig-primary-500), var(--ig-primary-a));\n}\n:host([variant=outlined]) [part=base]:hover {\n  color: var(--ig-primary-600-contrast);\n  background: hsla(var(--ig-primary-600), var(--ig-primary-a));\n}\n:host([variant=outlined]) [part=base]:focus, :host([variant=outlined]) [part=base]:active {\n  color: var(--ig-primary-600-contrast);\n  background: hsla(var(--ig-primary-600), var(--ig-primary-a));\n  -webkit-box-shadow: 0 0 0 0.25rem hsla(var(--ig-primary-200), 0.5);\n          box-shadow: 0 0 0 0.25rem hsla(var(--ig-primary-200), 0.5);\n}\n\n:host([disabled]) [part=base] {\n  color: hsla(var(--ig-primary-100), var(--ig-primary-a));\n  background: transparent;\n}\n\n:host([disabled][variant=contained]) [part=base] {\n  background: hsla(var(--ig-primary-100), var(--ig-primary-a));\n  color: hsla(var(--ig-primary-300), var(--ig-primary-a));\n}\n\n:host([disabled][variant=outlined]) [part=base] {\n  color: hsla(var(--ig-primary-100), var(--ig-primary-a));\n  -webkit-box-shadow: 0 0 0 0.0625rem hsla(var(--ig-primary-100), var(--ig-primary-a));\n          box-shadow: 0 0 0 0.0625rem hsla(var(--ig-primary-100), var(--ig-primary-a));\n}`;\n"]}

package/components/button/themes/icon-button/light/icon-button.fluent.css.js

@@ -1,3 +1,91 @@
 import { css } from 'lit';
-export const styles = css `[part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*.125rem,.125rem);background:rgba(0,0,0,0);color:hsla(var(--igc-primary-500), var(--igc-primary-a));-webkit-transition:color .15s ease-out,background .15s ease-out;-o-transition:color .15s ease-out,background .15s ease-out;transition:color .15s ease-out,background .15s ease-out;-webkit-box-shadow:none;box-shadow:none}[part=base]::after{position:absolute;content:"";pointer-events:none;top:2px;left:2px;width:calc(100% - 4px);height:calc(100% - 4px)}[part=base]:hover{color:hsla(var(--igc-primary-500), var(--igc-primary-a));background:hsla(var(--igc-gray-200), var(--igc-gray-a))}[part=base]:active{color:hsla(var(--igc-primary-500), var(--igc-primary-a));background:hsla(var(--igc-gray-300), var(--igc-gray-a))}[part=base]:focus-visible::after{-webkit-box-shadow:0 0 0 .0625rem hsla(var(--igc-gray-500), var(--igc-gray-a));box-shadow:0 0 0 .0625rem hsla(var(--igc-gray-500), var(--igc-gray-a))}:host([size=small]) [part=base]{width:1.5rem;height:1.5rem}:host([size=medium]) [part=base]{width:2rem;height:2rem;padding:calc(var(--igc-spacing-medium)*1.5)}:host([size=large]) [part=base]{width:2.375rem;height:2.375rem;padding:calc(var(--igc-spacing-large)*.875)}:host([variant=contained]) [part=base]{color:var(--text-color, var(--igc-primary-600-contrast));background:hsla(var(--igc-primary-500), var(--igc-primary-a))}:host([variant=contained]) [part=base]:hover{background:var(--hover-background, hsla(var(--igc-primary-600), var(--igc-primary-a)))}:host([variant=contained]) [part=base]:active{color:var(--igc-primary-800-contrast);background:hsla(var(--igc-primary-800), var(--igc-primary-a))}:host([variant=contained]) [part=base]:focus-visible::after{-webkit-box-shadow:0 0 0 .0625rem var(--igc-primary-600-contrast);box-shadow:0 0 0 .0625rem var(--igc-primary-600-contrast)}:host([variant=outlined]) [part=base]{color:hsla(var(--igc-gray-900), var(--igc-gray-a));-webkit-box-shadow:0 0 0 1px hsla(var(--igc-gray-700), var(--igc-gray-a));box-shadow:0 0 0 1px hsla(var(--igc-gray-700), var(--igc-gray-a))}:host([variant=outlined]) [part=base]:focus{background:rgba(0,0,0,0)}:host([variant=outlined]) [part=base]:hover,:host([variant=outlined]) [part=base]:focus:hover{background:hsla(var(--igc-gray-100), var(--igc-gray-a))}:host([variant=outlined]) [part=base]:focus:active{background:hsla(var(--igc-gray-200), var(--igc-gray-a))}:host([disabled]) [part=base]{color:hsla(var(--igc-gray-400), var(--igc-gray-a));background:hsla(var(--igc-gray-100), var(--igc-gray-a))}:host([disabled][variant=contained]) [part=base],:host([disabled][variant=outlined]) [part=base]{color:hsla(var(--igc-gray-500), var(--igc-gray-a))}`;
+export const styles = css `[part=base] {
+  border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.125rem), 0.125rem);
+  background: transparent;
+  color: hsla(var(--ig-primary-500), var(--ig-primary-a));
+  -webkit-transition: color 0.15s ease-out, background 0.15s ease-out;
+  -o-transition: color 0.15s ease-out, background 0.15s ease-out;
+  transition: color 0.15s ease-out, background 0.15s ease-out;
+  -webkit-box-shadow: none;
+          box-shadow: none;
+}
+[part=base]::after {
+  position: absolute;
+  content: "";
+  pointer-events: none;
+  top: 2px;
+  left: 2px;
+  width: calc(100% - 4px);
+  height: calc(100% - 4px);
+}
+[part=base]:hover {
+  color: hsla(var(--ig-primary-500), var(--ig-primary-a));
+  background: hsla(var(--ig-gray-200), var(--ig-gray-a));
+}
+[part=base]:active {
+  color: hsla(var(--ig-primary-500), var(--ig-primary-a));
+  background: hsla(var(--ig-gray-300), var(--ig-gray-a));
+}
+[part=base]:focus-visible::after {
+  -webkit-box-shadow: 0 0 0 0.0625rem hsla(var(--ig-gray-500), var(--ig-gray-a));
+          box-shadow: 0 0 0 0.0625rem hsla(var(--ig-gray-500), var(--ig-gray-a));
+}
+
+:host([size=small]) [part=base] {
+  width: 1.5rem;
+  height: 1.5rem;
+}
+
+:host([size=medium]) [part=base] {
+  width: 2rem;
+  height: 2rem;
+  padding: calc(var(--igc-spacing-medium) * 1.5);
+}
+
+:host([size=large]) [part=base] {
+  width: 2.375rem;
+  height: 2.375rem;
+  padding: calc(var(--igc-spacing-large) * 0.875);
+}
+
+:host([variant=contained]) [part=base] {
+  color: var(--text-color, var(--ig-primary-600-contrast));
+  background: hsla(var(--ig-primary-500), var(--ig-primary-a));
+}
+:host([variant=contained]) [part=base]:hover {
+  background: var(--hover-background, hsla(var(--ig-primary-600), var(--ig-primary-a)));
+}
+:host([variant=contained]) [part=base]:active {
+  color: var(--ig-primary-800-contrast);
+  background: hsla(var(--ig-primary-800), var(--ig-primary-a));
+}
+:host([variant=contained]) [part=base]:focus-visible::after {
+  -webkit-box-shadow: 0 0 0 0.0625rem var(--ig-primary-600-contrast);
+          box-shadow: 0 0 0 0.0625rem var(--ig-primary-600-contrast);
+}
+
+:host([variant=outlined]) [part=base] {
+  color: hsla(var(--ig-gray-900), var(--ig-gray-a));
+  -webkit-box-shadow: 0 0 0 1px hsla(var(--ig-gray-700), var(--ig-gray-a));
+          box-shadow: 0 0 0 1px hsla(var(--ig-gray-700), var(--ig-gray-a));
+}
+:host([variant=outlined]) [part=base]:focus {
+  background: transparent;
+}
+:host([variant=outlined]) [part=base]:hover, :host([variant=outlined]) [part=base]:focus:hover {
+  background: hsla(var(--ig-gray-100), var(--ig-gray-a));
+}
+:host([variant=outlined]) [part=base]:focus:active {
+  background: hsla(var(--ig-gray-200), var(--ig-gray-a));
+}
+
+:host([disabled]) [part=base] {
+  color: hsla(var(--ig-gray-400), var(--ig-gray-a));
+  background: hsla(var(--ig-gray-100), var(--ig-gray-a));
+}
+
+:host([disabled][variant=contained]) [part=base],
+:host([disabled][variant=outlined]) [part=base] {
+  color: hsla(var(--ig-gray-500), var(--ig-gray-a));
+}`;
 //# sourceMappingURL=icon-button.fluent.css.js.map