@mozaic-ds/web-components 1.0.0-beta.4 → 1.0.0-beta.6

package/dist/components/breadcrumb/Breadcrumb.svelte

@@ -1,25 +1,38 @@
 <svelte:options
   customElement={{
-    tag: 'm-breadcrumb',
-    props: {
-      options: { reflect: true, type: 'Array', attribute: 'links' },
-    },
+    tag: 'm-breadcrumb'
   }}
 />
 
 <script lang="ts">
-  interface BreadcrumbLink {
-    label: string;
-    href: string;
-    target: '_blank' | '_self' | '_parent' | '_top' | undefined;
-  }
-
+  /**
+   * A breadcrumb is a navigation help that displays the hierarchical path of the current page within a website or application. It helps users understand their location and allows them to navigate back to previous levels easily. Breadcrumbs improve usability and accessibility, especially in multi-level websites, dashboards, and e-commerce platforms.
+   */
   interface Props {
-    appearance?: 'standard' | 'inverse';
-    links?: BreadcrumbLink[];
-  }
+    /**
+     * Allows to define the breadcrumb appearance.
+     */
+    appearance: 'standard' | 'inverse';
+    /**
+     * Links of the breadcrumb.
+     */
+		links: Array<{
+      /**
+       * The label displayed for the link.
+       */
+      label: string;
+      /**
+       * URL for the link.
+       */
+      href: string;
+      /**
+       * Where to open the link.
+       */
+      target?: '_blank' | '_self' | '_parent' | '_top';
+    }>;
+	}
 
-  let { appearance = 'standard', links = [] }: Props = $props();
+  let { appearance = 'standard', links = []}: Props = $props();
 
   const isLastLink = (index: number) => index === links.length - 1;
 
@@ -57,8 +70,11 @@
 <style>/**
  * Do not edit directly, this file was auto-generated.
  */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
 .mc-breadcrumb {
-  color: var(--breadcrumb-color-text-standard, #000000);
+  color: #000000;
 }
 .mc-breadcrumb__container {
   list-style-type: none;
@@ -74,11 +90,11 @@
 }
 .mc-breadcrumb__item:not(:first-child) {
   padding-inline-start: 1.5rem;
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--breadcrumb-color-icon-standard, %23000000)' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M8.22 5.303a.75.75 0 0 1 1.06 0l4.167 4.167a.75.75 0 0 1 0 1.06L9.28 14.698a.75.75 0 1 1-1.06-1.06L11.856 10 8.22 6.364a.75.75 0 0 1 0-1.06'/%3E%3C/svg%3E");
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='%23000000' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M8.22 5.303a.75.75 0 0 1 1.06 0l4.167 4.167a.75.75 0 0 1 0 1.06L9.28 14.698a.75.75 0 1 1-1.06-1.06L11.856 10 8.22 6.364a.75.75 0 0 1 0-1.06'/%3E%3C/svg%3E");
 }
 @media screen and (max-width: 679px) {
   .mc-breadcrumb__item:nth-last-child(2) {
-    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--breadcrumb-color-icon-standard, %23000000)' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M11.78 5.303a.75.75 0 0 1 0 1.06L8.144 10l3.636 3.637a.75.75 0 0 1-1.06 1.06l-4.167-4.166a.75.75 0 0 1 0-1.061l4.166-4.167a.75.75 0 0 1 1.061 0'/%3E%3C/svg%3E");
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='%23000000' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M11.78 5.303a.75.75 0 0 1 0 1.06L8.144 10l3.636 3.637a.75.75 0 0 1-1.06 1.06l-4.167-4.166a.75.75 0 0 1 0-1.061l4.166-4.167a.75.75 0 0 1 1.061 0'/%3E%3C/svg%3E");
   }
   .mc-breadcrumb__item:not(:nth-last-child(2)) {
     clip-path: inset(100%);
@@ -99,14 +115,14 @@
   color: currentcolor;
 }
 .mc-breadcrumb--inverse {
-  color: var(--breadcrumb-color-text-inverse, #ffffff);
+  color: #ffffff;
 }
 .mc-breadcrumb--inverse .mc-breadcrumb__item:not(:first-child) {
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--breadcrumb-color-icon-inverse, %23ffffff)' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M8.22 5.303a.75.75 0 0 1 1.06 0l4.167 4.167a.75.75 0 0 1 0 1.06L9.28 14.698a.75.75 0 1 1-1.06-1.06L11.856 10 8.22 6.364a.75.75 0 0 1 0-1.06'/%3E%3C/svg%3E");
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='%23ffffff' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M8.22 5.303a.75.75 0 0 1 1.06 0l4.167 4.167a.75.75 0 0 1 0 1.06L9.28 14.698a.75.75 0 1 1-1.06-1.06L11.856 10 8.22 6.364a.75.75 0 0 1 0-1.06'/%3E%3C/svg%3E");
 }
 @media screen and (max-width: 679px) {
   .mc-breadcrumb--inverse .mc-breadcrumb__item:nth-last-child(2) {
-    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--breadcrumb-color-icon-inverse, %23ffffff)' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M11.78 5.303a.75.75 0 0 1 0 1.06L8.144 10l3.636 3.637a.75.75 0 0 1-1.06 1.06l-4.167-4.166a.75.75 0 0 1 0-1.061l4.166-4.167a.75.75 0 0 1 1.061 0'/%3E%3C/svg%3E");
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='%23ffffff' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M11.78 5.303a.75.75 0 0 1 0 1.06L8.144 10l3.636 3.637a.75.75 0 0 1-1.06 1.06l-4.167-4.166a.75.75 0 0 1 0-1.061l4.166-4.167a.75.75 0 0 1 1.061 0'/%3E%3C/svg%3E");
   }
 }
 
@@ -118,7 +134,7 @@
   gap: 0.25rem;
   min-height: 1.5rem;
   text-decoration: none;
-  color: var(--link-color-text-primary, #000000);
+  color: #000000;
   font-size: 0.875rem;
 }
 .mc-link__label {
@@ -135,7 +151,7 @@
   text-decoration: underline;
 }
 .mc-link:focus {
-  box-shadow: 0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));
+  box-shadow: 0 0 0 0.125rem var(--focus-color-mid, #ffffff), 0 0 0 0.25rem var(--focus-color-outer, #000000);
   outline: 0.125rem solid transparent;
   outline-offset: 0.125rem;
 }
@@ -144,22 +160,22 @@
   font-size: 1rem;
 }
 .mc-link--secondary {
-  color: var(--link-color-text-secondary, #666666);
+  color: #666666;
 }
 .mc-link--accent {
-  color: var(--link-color-text-accent, #117f03);
+  color: #117f03;
 }
 .mc-link--inverse {
-  --focus-color-mid: var(--focus-color-outline-outer, #000000);
-  --focus-color-outer: var(--focus-color-outline-mid, #ffffff);
-  color: var(--link-color-text-inverse, #ffffff);
+  --focus-color-mid: #000000;
+  --focus-color-outer: #ffffff;
+  color: #ffffff;
 }
 .mc-link--stand-alone {
   min-height: 2rem;
-  font-weight: var(--link-font-weight, 600);
+  font-weight: 600;
 }
 .mc-link--stand-alone .mc-link__label {
-  border-bottom: var(--border-s, 1px) solid currentColor;
+  border-bottom: 1px solid currentColor;
 }
 .mc-link--stand-alone:hover .mc-link__label {
   border-color: transparent;

package/dist/components/breadcrumb/Breadcrumb.svelte.d.ts

@@ -1,11 +1,28 @@
-interface BreadcrumbLink {
-    label: string;
-    href: string;
-    target: '_blank' | '_self' | '_parent' | '_top' | undefined;
-}
+/**
+ * A breadcrumb is a navigation help that displays the hierarchical path of the current page within a website or application. It helps users understand their location and allows them to navigate back to previous levels easily. Breadcrumbs improve usability and accessibility, especially in multi-level websites, dashboards, and e-commerce platforms.
+ */
 interface Props {
-    appearance?: 'standard' | 'inverse';
-    links?: BreadcrumbLink[];
+    /**
+     * Allows to define the breadcrumb appearance.
+     */
+    appearance: 'standard' | 'inverse';
+    /**
+     * Links of the breadcrumb.
+     */
+    links: Array<{
+        /**
+         * The label displayed for the link.
+         */
+        label: string;
+        /**
+         * URL for the link.
+         */
+        href: string;
+        /**
+         * Where to open the link.
+         */
+        target?: '_blank' | '_self' | '_parent' | '_top';
+    }>;
 }
 declare const Breadcrumb: import("svelte").Component<Props, {}, "">;
 type Breadcrumb = ReturnType<typeof Breadcrumb>;

package/dist/components/breadcrumb/Breadcrumb.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumb.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/breadcrumb/Breadcrumb.svelte.ts"],"names":[],"mappings":"AAGE,UAAU,cAAc;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAC;CAC7D;AAED,UAAU,KAAK;IACb,UAAU,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IACpC,KAAK,CAAC,EAAE,cAAc,EAAE,CAAC;CAC1B;AA4CH,QAAA,MAAM,UAAU,2CAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"Breadcrumb.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/breadcrumb/Breadcrumb.svelte.ts"],"names":[],"mappings":"AAGE;;GAEG;AACH,UAAU,KAAK;IACb;;OAEG;IACH,UAAU,EAAE,UAAU,GAAG,SAAS,CAAC;IACnC;;OAEG;IACL,KAAK,EAAE,KAAK,CAAC;QACT;;WAEG;QACH,KAAK,EAAE,MAAM,CAAC;QACd;;WAEG;QACH,IAAI,EAAE,MAAM,CAAC;QACb;;WAEG;QACH,MAAM,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;KAClD,CAAC,CAAC;CACL;AAwCF,QAAA,MAAM,UAAU,2CAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/components/button/Button.js

@@ -1,5 +1,8 @@
-import{c as K,p as M,a as N,b as r,f,z as O,s as C,d as h,h as d,i as P,j as n,r as m,t as Q,e as R,w as D,x as E}from"../../custom-element.js";import{i as b}from"../../if.js";import{s as L}from"../../slot.js";import{a as T,C as U}from"../../attributes.js";import{L as V}from"../loader/Loader.js";var W=f('<span class="mc-button__icon svelte-145hc6c"><!></span>'),X=f("<span><!></span>"),Y=f('<span class="mc-button__icon svelte-145hc6c"><!></span>'),Z=f("<button><!> <!> <!> <!></button>");const $={hash:"svelte-145hc6c",code:`/**
+import{c as K,p as M,a as N,b as n,f as h,D as O,s as C,d as g,h as i,i as P,j as c,r as f,t as Q,e as R,A,B as E}from"../../custom-element.js";import{i as s}from"../../if.js";import{s as B}from"../../slot.js";import{b as T,C as U}from"../../attributes.js";import{L as V}from"../loader/Loader.js";var W=h('<span class="mc-button__icon svelte-9om05i"><!></span>'),X=h("<span><!></span>"),Y=h('<span class="mc-button__icon svelte-9om05i"><!></span>'),Z=h("<button><!> <!> <!> <!></button>");const $={hash:"svelte-9om05i",code:`/**
  * Do not edit directly, this file was auto-generated.
- */.mc-button.svelte-145hc6c {color:var(--button-color-filled-standard-font, #ffffff);background-color:var(--button-color-filled-standard-background, #464e63);font-weight:var(--font-weight-semi-bold, 600);padding:0 calc(1rem - 0.125rem);min-height:3rem;min-width:3rem;display:inline-flex;justify-content:center;vertical-align:middle;text-align:center;border:2px solid transparent;border-radius:var(--button-radius, 0.25rem);transition:all ease 200ms;transition:box-shadow 200ms ease;align-items:center;box-sizing:border-box;font-family:inherit;fill:currentcolor;gap:0.25rem;cursor:pointer;}.mc-button.svelte-145hc6c:hover {background-color:var(--button-color-filled-standard-hover-background, #343b4c);}.mc-button.svelte-145hc6c:active {background-color:var(--button-color-filled-standard-active-background, #242938);}.mc-button.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button.svelte-145hc6c .mc-button__label:where(.svelte-145hc6c) {font-size:var(--font-size-150, 1rem);}.mc-button__label.svelte-145hc6c {font-size:var(--font-size-150, 1rem);}.mc-button__icon.svelte-145hc6c {flex-shrink:0;width:1.5rem;height:1.5rem;}.mc-button.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button.svelte-145hc6c:focus-visible {box-shadow:0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-button--s.svelte-145hc6c {padding:0 calc(0.75rem - 0.125rem);min-height:2rem;min-width:2rem;}.mc-button--s.svelte-145hc6c .mc-button__label:where(.svelte-145hc6c) {font-size:var(--font-size-100, 0.875rem);}.mc-button--s.svelte-145hc6c .mc-button__icon:where(.svelte-145hc6c) {width:1.25rem;height:1.25rem;}.mc-button--s.svelte-145hc6c .mc-button__icon:where(.svelte-145hc6c):only-child {width:1.25rem;height:1.25rem;}.mc-button--m.svelte-145hc6c {padding:0 calc(1rem - 0.125rem);min-height:3rem;min-width:3rem;}.mc-button--m.svelte-145hc6c .mc-button__label:where(.svelte-145hc6c) {font-size:var(--font-size-150, 1rem);}.mc-button--m.svelte-145hc6c .mc-button__icon:where(.svelte-145hc6c) {width:1.5rem;height:1.5rem;}.mc-button--m.svelte-145hc6c .mc-button__icon:where(.svelte-145hc6c):only-child {width:1.5rem;height:1.5rem;}.mc-button--l.svelte-145hc6c {padding:0 calc(1.25rem - 0.125rem);min-height:4rem;min-width:4rem;}.mc-button--l.svelte-145hc6c .mc-button__label:where(.svelte-145hc6c) {font-size:var(--font-size-200, 1.125rem);}.mc-button--l.svelte-145hc6c .mc-button__icon:where(.svelte-145hc6c) {width:2rem;height:2rem;}.mc-button--l.svelte-145hc6c .mc-button__icon:where(.svelte-145hc6c):only-child {width:2rem;height:2rem;}.mc-button--icon-only.svelte-145hc6c {padding:0.25rem;}.mc-button--outlined.svelte-145hc6c {color:var(--button-color-outlined-standard-font, #242938);border-color:var(--button-color-outlined-standard-border, #8891aa);background-color:var(--button-color-outlined-standard-background, #ffffff);}.mc-button--outlined.svelte-145hc6c:hover {background-color:var(--button-color-outlined-standard-hover-background, #eff1f6);}.mc-button--outlined.svelte-145hc6c:active {background-color:var(--button-color-outlined-standard-active-background, #c9d0de);}.mc-button--outlined.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--ghost.svelte-145hc6c {color:var(--button-color-ghost-standard-font, #242938);background-color:var(--button-color-ghost-standard-background, rgba(255, 255, 255, 0.01));}.mc-button--ghost.svelte-145hc6c:hover {background-color:var(--button-color-ghost-standard-hover-background, rgba(70, 78, 99, 0.1));}.mc-button--ghost.svelte-145hc6c:active {background-color:var(--button-color-ghost-standard-active-background, rgba(70, 78, 99, 0.2));}.mc-button--ghost.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--accent.svelte-145hc6c {color:var(--button-color-filled-accent-font, #ffffff);background-color:var(--button-color-filled-accent-background, #117f03);}.mc-button--accent.svelte-145hc6c:hover {background-color:var(--button-color-filled-accent-hover-background, #006902);}.mc-button--accent.svelte-145hc6c:active {background-color:var(--button-color-filled-accent-active-background, #035010);}.mc-button--accent.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--danger.svelte-145hc6c {color:var(--button-color-filled-danger-font, #ffffff);background-color:var(--button-color-filled-danger-background, #c61112);}.mc-button--danger.svelte-145hc6c:hover {background-color:var(--button-color-filled-danger-hover-background, #8c0003);}.mc-button--danger.svelte-145hc6c:active {background-color:var(--button-color-filled-danger-active-background, #530000);}.mc-button--danger.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--inverse.svelte-145hc6c {--focus-color-mid: var(--focus-color-outline-outer, #000000);--focus-color-outer: var(--focus-color-outline-mid, #ffffff);color:var(--button-color-filled-inverse-font, #242938);background-color:var(--button-color-filled-inverse-background, #ffffff);}.mc-button--inverse.svelte-145hc6c:hover {background-color:var(--button-color-filled-inverse-hover-background, #e6e6e6);}.mc-button--inverse.svelte-145hc6c:active {background-color:var(--button-color-filled-inverse-active-background, #cccccc);}.mc-button--inverse.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--icon-button.svelte-145hc6c {border-radius:var(--radius-full, 100%);padding:0;}.mc-button--loading.svelte-145hc6c .mc-button__label:where(.svelte-145hc6c),
-.mc-button--loading.svelte-145hc6c .mc-button__icon:where(.svelte-145hc6c) {visibility:hidden;}.mc-button--outlined.mc-button--standard.svelte-145hc6c {color:var(--button-color-outlined-standard-font, #242938);border-color:var(--button-color-outlined-standard-border, #8891aa);background-color:var(--button-color-outlined-standard-background, #ffffff);}.mc-button--outlined.mc-button--standard.svelte-145hc6c:hover {background-color:var(--button-color-outlined-standard-hover-background, #eff1f6);}.mc-button--outlined.mc-button--standard.svelte-145hc6c:active {background-color:var(--button-color-outlined-standard-active-background, #c9d0de);}.mc-button--outlined.mc-button--standard.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--outlined.mc-button--accent.svelte-145hc6c {color:var(--button-color-outlined-accent-font, #117f03);border-color:var(--button-color-outlined-accent-border, #78be20);background-color:var(--button-color-outlined-accent-background, #ffffff);}.mc-button--outlined.mc-button--accent.svelte-145hc6c:hover {background-color:var(--button-color-outlined-accent-hover-background, #ebf5de);}.mc-button--outlined.mc-button--accent.svelte-145hc6c:active {background-color:var(--button-color-outlined-accent-active-background, #c5e39e);}.mc-button--outlined.mc-button--accent.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--outlined.mc-button--danger.svelte-145hc6c {color:var(--button-color-outlined-danger-font, #c61112);border-color:var(--button-color-outlined-danger-border, #ef5f5c);background-color:var(--button-color-outlined-danger-background, #ffffff);}.mc-button--outlined.mc-button--danger.svelte-145hc6c:hover {background-color:var(--button-color-outlined-danger-hover-background, #fdeaea);}.mc-button--outlined.mc-button--danger.svelte-145hc6c:active {background-color:var(--button-color-outlined-danger-active-background, #f8bcbb);}.mc-button--outlined.mc-button--danger.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--outlined.mc-button--inverse.svelte-145hc6c {color:var(--button-color-outlined-inverse-font, #ffffff);border-color:var(--button-color-outlined-inverse-border, #ffffff);background-color:var(--button-color-outlined-inverse-background, rgba(255, 255, 255, 0.01));}.mc-button--outlined.mc-button--inverse.svelte-145hc6c:hover {background-color:var(--button-color-outlined-inverse-hover-background, rgba(255, 255, 255, 0.1));}.mc-button--outlined.mc-button--inverse.svelte-145hc6c:active {background-color:var(--button-color-outlined-inverse-active-background, rgba(255, 255, 255, 0.2));}.mc-button--outlined.mc-button--inverse.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--ghost.mc-button--standard.svelte-145hc6c {color:var(--button-color-ghost-standard-font, #242938);background-color:var(--button-color-ghost-standard-background, rgba(255, 255, 255, 0.01));}.mc-button--ghost.mc-button--standard.svelte-145hc6c:hover {background-color:var(--button-color-ghost-standard-hover-background, rgba(70, 78, 99, 0.1));}.mc-button--ghost.mc-button--standard.svelte-145hc6c:active {background-color:var(--button-color-ghost-standard-active-background, rgba(70, 78, 99, 0.2));}.mc-button--ghost.mc-button--standard.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--ghost.mc-button--accent.svelte-145hc6c {color:var(--button-color-ghost-accent-font, #117f03);background-color:var(--button-color-ghost-accent-background, rgba(255, 255, 255, 0.01));}.mc-button--ghost.mc-button--accent.svelte-145hc6c:hover {background-color:var(--button-color-ghost-accent-hover-background, rgba(17, 127, 3, 0.1));}.mc-button--ghost.mc-button--accent.svelte-145hc6c:active {background-color:var(--button-color-ghost-accent-active-background, rgba(17, 127, 3, 0.2));}.mc-button--ghost.mc-button--accent.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--ghost.mc-button--danger.svelte-145hc6c {color:var(--button-color-ghost-danger-font, #c61112);background-color:var(--button-color-ghost-danger-background, rgba(255, 255, 255, 0.01));}.mc-button--ghost.mc-button--danger.svelte-145hc6c:hover {background-color:var(--button-color-ghost-danger-hover-background, rgba(198, 17, 18, 0.1));}.mc-button--ghost.mc-button--danger.svelte-145hc6c:active {background-color:var(--button-color-ghost-danger-active-background, rgba(198, 17, 18, 0.2));}.mc-button--ghost.mc-button--danger.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--ghost.mc-button--inverse.svelte-145hc6c {color:var(--button-color-ghost-inverse-font, #ffffff);background-color:var(--button-color-ghost-inverse-background, rgba(255, 255, 255, 0.01));}.mc-button--ghost.mc-button--inverse.svelte-145hc6c:hover {background-color:var(--button-color-ghost-inverse-hover-background, rgba(255, 255, 255, 0.1));}.mc-button--ghost.mc-button--inverse.svelte-145hc6c:active {background-color:var(--button-color-ghost-inverse-active-background, rgba(255, 255, 255, 0.2));}.mc-button--ghost.mc-button--inverse.svelte-145hc6c:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button__icon.svelte-145hc6c {pointer-events:none;}.hidden.svelte-145hc6c {visibility:hidden;}.loader-style.svelte-145hc6c {color:currentColor;position:absolute;}`};function oo(S,t){M(t,!0),N(S,$);let k=r(t,"appearance",7,"standard"),_=r(t,"size",7,"m"),p=r(t,"ghost",7,!1),w=r(t,"outlined",7,!1),a=r(t,"iconmode",7),y=r(t,"disabled",7,!1),z=r(t,"type",7,"button"),s=r(t,"isloading",7,!1),v=r(t,"hasiconslot",7,!1),q=O(t,["$$slots","$$events","$$legacy","$$host","appearance","size","ghost","outlined","iconmode","disabled","type","isloading","hasiconslot"]);var g=Z();T(g,o=>({class:`mc-button mc-button--${_()} mc-button--${k()}`,disabled:y(),type:z(),...q,[U]:o}),[()=>({"mc-button--ghost":p(),"mc-button--outlined":w(),"mc-button--icon-only":a()==="only","mc-button--loading":s()})],void 0,"svelte-145hc6c");var j=h(g);{var F=o=>{V(o,{theme:"standard",style:"color: currentColor; position: absolute;",size:"m",text:""})};b(j,o=>{s()&&o(F)})}var B=C(j,2);{var G=o=>{var e=W(),l=h(e);{var u=c=>{var i=D(),x=E(i);L(x,t,"icon",{}),d(c,i)};b(l,c=>{v()&&c(u)})}m(e),d(o,e)};b(B,o=>{(a()==="left"||a()==="only")&&o(G)})}var A=C(B,2);{var H=o=>{var e=X();let l;var u=h(e);L(u,t,"default",{}),m(e),Q(c=>l=R(e,1,"mc-button__label svelte-145hc6c",null,l,c),[()=>({hidden:s()})]),d(o,e)};b(A,o=>{a()!=="only"&&o(H)})}var I=C(A,2);{var J=o=>{var e=Y(),l=h(e);{var u=c=>{var i=D(),x=E(i);L(x,t,"icon",{}),d(c,i)};b(l,c=>{v()&&c(u)})}m(e),d(o,e)};b(I,o=>{a()==="right"&&o(J)})}return m(g),d(S,g),P({get appearance(){return k()},set appearance(o="standard"){k(o),n()},get size(){return _()},set size(o="m"){_(o),n()},get ghost(){return p()},set ghost(o=!1){p(o),n()},get outlined(){return w()},set outlined(o=!1){w(o),n()},get iconmode(){return a()},set iconmode(o){a(o),n()},get disabled(){return y()},set disabled(o=!1){y(o),n()},get type(){return z()},set type(o="button"){z(o),n()},get isloading(){return s()},set isloading(o=!1){s(o),n()},get hasiconslot(){return v()},set hasiconslot(o=!1){v(o),n()}})}customElements.define("m-button",K(oo,{appearance:{},size:{},ghost:{},outlined:{},iconmode:{},disabled:{},type:{},isloading:{},hasiconslot:{}},["icon","default"],[],!0));export{oo as B};
+ */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */.mc-button.svelte-9om05i {color:#ffffff;background-color:#464e63;font-weight:600;padding:0 calc(1rem - 0.125rem);min-height:3rem;min-width:3rem;display:inline-flex;justify-content:center;vertical-align:middle;text-align:center;border:2px solid transparent;border-radius:0.25rem;transition:all ease 200ms;transition:box-shadow 200ms ease;align-items:center;box-sizing:border-box;font-family:inherit;fill:currentcolor;gap:0.25rem;cursor:pointer;}.mc-button.svelte-9om05i:hover {background-color:#343b4c;}.mc-button.svelte-9om05i:active {background-color:#242938;}.mc-button.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button.svelte-9om05i .mc-button__label:where(.svelte-9om05i) {font-size:1rem;}.mc-button__label.svelte-9om05i {font-size:1rem;}.mc-button__icon.svelte-9om05i {flex-shrink:0;width:1.5rem;height:1.5rem;}.mc-button.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button.svelte-9om05i:focus-visible {box-shadow:0 0 0 0.125rem var(--focus-color-mid, #ffffff), 0 0 0 0.25rem var(--focus-color-outer, #000000);outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-button--s.svelte-9om05i {padding:0 calc(0.75rem - 0.125rem);min-height:2rem;min-width:2rem;}.mc-button--s.svelte-9om05i .mc-button__label:where(.svelte-9om05i) {font-size:0.875rem;}.mc-button--s.svelte-9om05i .mc-button__icon:where(.svelte-9om05i) {width:1.25rem;height:1.25rem;}.mc-button--s.svelte-9om05i .mc-button__icon:where(.svelte-9om05i):only-child {width:1.25rem;height:1.25rem;}.mc-button--m.svelte-9om05i {padding:0 calc(1rem - 0.125rem);min-height:3rem;min-width:3rem;}.mc-button--m.svelte-9om05i .mc-button__label:where(.svelte-9om05i) {font-size:1rem;}.mc-button--m.svelte-9om05i .mc-button__icon:where(.svelte-9om05i) {width:1.5rem;height:1.5rem;}.mc-button--m.svelte-9om05i .mc-button__icon:where(.svelte-9om05i):only-child {width:1.5rem;height:1.5rem;}.mc-button--l.svelte-9om05i {padding:0 calc(1.25rem - 0.125rem);min-height:4rem;min-width:4rem;}.mc-button--l.svelte-9om05i .mc-button__label:where(.svelte-9om05i) {font-size:1.125rem;}.mc-button--l.svelte-9om05i .mc-button__icon:where(.svelte-9om05i) {width:2rem;height:2rem;}.mc-button--l.svelte-9om05i .mc-button__icon:where(.svelte-9om05i):only-child {width:2rem;height:2rem;}.mc-button--icon-only.svelte-9om05i {padding:0.25rem;}.mc-button--outlined.svelte-9om05i {color:#242938;border-color:#8891aa;background-color:#ffffff;}.mc-button--outlined.svelte-9om05i:hover {background-color:#eff1f6;}.mc-button--outlined.svelte-9om05i:active {background-color:#c9d0de;}.mc-button--outlined.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--ghost.svelte-9om05i {color:#242938;background-color:rgba(255, 255, 255, 0.01);}.mc-button--ghost.svelte-9om05i:hover {background-color:rgba(70, 78, 99, 0.1);}.mc-button--ghost.svelte-9om05i:active {background-color:rgba(70, 78, 99, 0.2);}.mc-button--ghost.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--accent.svelte-9om05i {color:#ffffff;background-color:#117f03;}.mc-button--accent.svelte-9om05i:hover {background-color:#006902;}.mc-button--accent.svelte-9om05i:active {background-color:#035010;}.mc-button--accent.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--danger.svelte-9om05i {color:#ffffff;background-color:#c61112;}.mc-button--danger.svelte-9om05i:hover {background-color:#8c0003;}.mc-button--danger.svelte-9om05i:active {background-color:#530000;}.mc-button--danger.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--inverse.svelte-9om05i {--focus-color-mid: #000000;--focus-color-outer: #ffffff;color:#242938;background-color:#ffffff;}.mc-button--inverse.svelte-9om05i:hover {background-color:#e6e6e6;}.mc-button--inverse.svelte-9om05i:active {background-color:#cccccc;}.mc-button--inverse.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--icon-button.svelte-9om05i {border-radius:100%;padding:0;}.mc-button--loading.svelte-9om05i .mc-button__label:where(.svelte-9om05i),
+.mc-button--loading.svelte-9om05i .mc-button__icon:where(.svelte-9om05i) {visibility:hidden;}.mc-button--outlined.mc-button--standard.svelte-9om05i {color:#242938;border-color:#8891aa;background-color:#ffffff;}.mc-button--outlined.mc-button--standard.svelte-9om05i:hover {background-color:#eff1f6;}.mc-button--outlined.mc-button--standard.svelte-9om05i:active {background-color:#c9d0de;}.mc-button--outlined.mc-button--standard.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--outlined.mc-button--accent.svelte-9om05i {color:#117f03;border-color:#78be20;background-color:#ffffff;}.mc-button--outlined.mc-button--accent.svelte-9om05i:hover {background-color:#ebf5de;}.mc-button--outlined.mc-button--accent.svelte-9om05i:active {background-color:#c5e39e;}.mc-button--outlined.mc-button--accent.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--outlined.mc-button--danger.svelte-9om05i {color:#c61112;border-color:#ef5f5c;background-color:#ffffff;}.mc-button--outlined.mc-button--danger.svelte-9om05i:hover {background-color:#fdeaea;}.mc-button--outlined.mc-button--danger.svelte-9om05i:active {background-color:#f8bcbb;}.mc-button--outlined.mc-button--danger.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--outlined.mc-button--inverse.svelte-9om05i {color:#ffffff;border-color:#ffffff;background-color:rgba(255, 255, 255, 0.01);}.mc-button--outlined.mc-button--inverse.svelte-9om05i:hover {background-color:rgba(255, 255, 255, 0.1);}.mc-button--outlined.mc-button--inverse.svelte-9om05i:active {background-color:rgba(255, 255, 255, 0.2);}.mc-button--outlined.mc-button--inverse.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--ghost.mc-button--standard.svelte-9om05i {color:#242938;background-color:rgba(255, 255, 255, 0.01);}.mc-button--ghost.mc-button--standard.svelte-9om05i:hover {background-color:rgba(70, 78, 99, 0.1);}.mc-button--ghost.mc-button--standard.svelte-9om05i:active {background-color:rgba(70, 78, 99, 0.2);}.mc-button--ghost.mc-button--standard.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--ghost.mc-button--accent.svelte-9om05i {color:#117f03;background-color:rgba(255, 255, 255, 0.01);}.mc-button--ghost.mc-button--accent.svelte-9om05i:hover {background-color:rgba(17, 127, 3, 0.1);}.mc-button--ghost.mc-button--accent.svelte-9om05i:active {background-color:rgba(17, 127, 3, 0.2);}.mc-button--ghost.mc-button--accent.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--ghost.mc-button--danger.svelte-9om05i {color:#c61112;background-color:rgba(255, 255, 255, 0.01);}.mc-button--ghost.mc-button--danger.svelte-9om05i:hover {background-color:rgba(198, 17, 18, 0.1);}.mc-button--ghost.mc-button--danger.svelte-9om05i:active {background-color:rgba(198, 17, 18, 0.2);}.mc-button--ghost.mc-button--danger.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--ghost.mc-button--inverse.svelte-9om05i {color:#ffffff;background-color:rgba(255, 255, 255, 0.01);}.mc-button--ghost.mc-button--inverse.svelte-9om05i:hover {background-color:rgba(255, 255, 255, 0.1);}.mc-button--ghost.mc-button--inverse.svelte-9om05i:active {background-color:rgba(255, 255, 255, 0.2);}.mc-button--ghost.mc-button--inverse.svelte-9om05i:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button__icon.svelte-9om05i {pointer-events:none;}.hidden.svelte-9om05i {visibility:hidden;}.loader-style.svelte-9om05i {color:currentColor;position:absolute;}`};function oo(D,t){M(t,!0),N(D,$);let _=n(t,"appearance",7,"standard"),k=n(t,"size",7,"m"),p=n(t,"ghost",7,!1),w=n(t,"outlined",7,!1),l=n(t,"iconmode",7),y=n(t,"disabled",7,!1),z=n(t,"type",7,"button"),d=n(t,"isloading",7,!1),u=n(t,"hasiconslot",7,!1),q=O(t,["$$slots","$$events","$$legacy","$$host","appearance","size","ghost","outlined","iconmode","disabled","type","isloading","hasiconslot"]);var v=Z();T(v,o=>({class:`mc-button mc-button--${k()} mc-button--${_()}`,disabled:y(),type:z(),...q,[U]:o}),[()=>({"mc-button--ghost":p(),"mc-button--outlined":w(),"mc-button--icon-only":l()==="only","mc-button--loading":d()})],void 0,"svelte-9om05i");var L=g(v);{var F=o=>{V(o,{theme:"standard",style:"color: currentColor; position: absolute;",size:"m",text:""})};s(L,o=>{d()&&o(F)})}var S=C(L,2);{var G=o=>{var e=W(),a=g(e);{var m=r=>{var b=A(),x=E(b);B(x,t,"icon",{}),i(r,b)};s(a,r=>{u()&&r(m)})}f(e),i(o,e)};s(S,o=>{(l()==="left"||l()==="only")&&o(G)})}var j=C(S,2);{var H=o=>{var e=X();let a;var m=g(e);B(m,t,"default",{}),f(e),Q(r=>a=R(e,1,"mc-button__label svelte-9om05i",null,a,r),[()=>({hidden:d()})]),i(o,e)};s(j,o=>{l()!=="only"&&o(H)})}var I=C(j,2);{var J=o=>{var e=Y(),a=g(e);{var m=r=>{var b=A(),x=E(b);B(x,t,"icon",{}),i(r,b)};s(a,r=>{u()&&r(m)})}f(e),i(o,e)};s(I,o=>{l()==="right"&&o(J)})}return f(v),i(D,v),P({get appearance(){return _()},set appearance(o="standard"){_(o),c()},get size(){return k()},set size(o="m"){k(o),c()},get ghost(){return p()},set ghost(o=!1){p(o),c()},get outlined(){return w()},set outlined(o=!1){w(o),c()},get iconmode(){return l()},set iconmode(o){l(o),c()},get disabled(){return y()},set disabled(o=!1){y(o),c()},get type(){return z()},set type(o="button"){z(o),c()},get isloading(){return d()},set isloading(o=!1){d(o),c()},get hasiconslot(){return u()},set hasiconslot(o=!1){u(o),c()}})}customElements.define("m-button",K(oo,{appearance:{},size:{},ghost:{},outlined:{},iconmode:{},disabled:{},type:{},isloading:{},hasiconslot:{}},["icon","default"],[],!0));export{oo as B};
 //# sourceMappingURL=Button.js.map

package/dist/components/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../src/components/button/Button.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-button' }} />\n\n<script lang=\"ts\">\n  import type {\n    ButtonIconMode,\n    ButtonSize,\n    ButtonStyle,\n    ButtonType,\n  } from './button.types';\n\n  import Loader from '../loader/Loader.svelte';\n\n  interface Props {\n    appearance?: ButtonStyle;\n    size?: ButtonSize;\n    ghost?: boolean;\n    outlined?: boolean;\n    iconmode?: ButtonIconMode;\n    disabled?: boolean;\n    type?: ButtonType;\n    isloading?: boolean;\n    hasiconslot?: boolean;\n    [key: string]: any;\n  }\n\n  let {\n    appearance = 'standard',\n    size = 'm',\n    ghost = false,\n    outlined = false,\n    iconmode,\n    disabled = false,\n    type = 'button',\n    isloading = false,\n    hasiconslot = false,\n    ...events\n  }: Props = $props();\n</script>\n\n<button\n  class={`mc-button mc-button--${size} mc-button--${appearance}`}\n  class:mc-button--ghost={ghost}\n  class:mc-button--outlined={outlined}\n  class:mc-button--icon-only={iconmode === 'only'}\n  class:mc-button--loading={isloading}\n  {disabled}\n  {type}\n  {...events}\n>\n  {#if isloading}\n    <Loader\n      theme=\"standard\"\n      style=\"color: currentColor; position: absolute;\"\n      size=\"m\"\n      text=\"\"\n    />\n  {/if}\n\n  {#if iconmode === 'left' || iconmode === 'only'}\n    <span class=\"mc-button__icon\">\n      {#if hasiconslot}\n        <slot name=\"icon\" />\n      {/if}\n    </span>\n  {/if}\n\n  {#if iconmode !== 'only'}\n    <span class=\"mc-button__label\" class:hidden={isloading}>\n      <slot />\n    </span>\n  {/if}\n\n  {#if iconmode === 'right'}\n    <span class=\"mc-button__icon\">\n      {#if hasiconslot}\n        <slot name=\"icon\" />\n      {/if}\n    </span>\n  {/if}\n</button>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/button';\n\n  .mc-button__icon {\n    pointer-events: none;\n  }\n\n  .hidden {\n    visibility: hidden;\n  }\n\n  .loader-style {\n    color: currentColor;\n    position: absolute;\n  }\n</style>\n"],"names":["appearance","size","ghost","outlined","iconmode","$.prop","$$props","disabled","type","isloading","hasiconslot","events","$.rest_props","$$render","consequent","consequent_1","consequent_2","consequent_3","consequent_4","consequent_5"],"mappings":";;;kpMAAA,gBA0BI,IAAAA,qBAAa,UAAU,EACvBC,eAAO,GAAG,EACVC,gBAAQ,EAAK,EACbC,mBAAW,EAAK,EAChBC,EAAQC,EAAAC,EAAA,WAAA,CAAA,EACRC,mBAAW,EAAK,EAChBC,eAAO,QAAQ,EACfC,oBAAY,EAAK,EACjBC,sBAAc,EAAK,EAChBC,EAAAC,EAAAN,EAAA,6JAK0B,MAAA,wBAAAL,kBAAmBD,EAAU,CAAA,4BAOxDW,oCANoBT,EAAK,wBACFC,EAAQ,EACP,uBAAAC,EAAQ,IAAK,4BACfK,EAAS,uJAK9BA,EAAS,GAAAI,EAAAC,CAAA,0GAWLJ,EAAW,GAAAG,EAAAE,CAAA,0BAFfX,EAAa,IAAA,QAAUA,MAAa,SAAMS,EAAAG,CAAA,uJASAP,EAAS,CAAA,EAAA,CAAA,kBADnDL,MAAa,QAAMS,EAAAI,CAAA,0GAQfP,EAAW,GAAAG,EAAAK,CAAA,yBAFfd,MAAa,SAAOS,EAAAM,CAAA,wEA9CV,WAAU,6CAChB,IAAG,+CACF,GAAK,qDACF,GAAK,0GAEL,GAAK,6CACT,SAAQ,uDACH,GAAK,2DACH,GAAK,YAGvB"}
+{"version":3,"file":"Button.js","sources":["../../../src/components/button/Button.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-button' }} />\n\n<script lang=\"ts\">\n  import type {\n    ButtonIconMode,\n    ButtonSize,\n    ButtonStyle,\n    ButtonType,\n  } from './button.types';\n\n  import Loader from '../loader/Loader.svelte';\n\n  interface Props {\n    appearance?: ButtonStyle;\n    size?: ButtonSize;\n    ghost?: boolean;\n    outlined?: boolean;\n    iconmode?: ButtonIconMode;\n    disabled?: boolean;\n    type?: ButtonType;\n    isloading?: boolean;\n    hasiconslot?: boolean;\n    [key: string]: any;\n  }\n\n  let {\n    appearance = 'standard',\n    size = 'm',\n    ghost = false,\n    outlined = false,\n    iconmode,\n    disabled = false,\n    type = 'button',\n    isloading = false,\n    hasiconslot = false,\n    ...events\n  }: Props = $props();\n</script>\n\n<button\n  class={`mc-button mc-button--${size} mc-button--${appearance}`}\n  class:mc-button--ghost={ghost}\n  class:mc-button--outlined={outlined}\n  class:mc-button--icon-only={iconmode === 'only'}\n  class:mc-button--loading={isloading}\n  {disabled}\n  {type}\n  {...events}\n>\n  {#if isloading}\n    <Loader\n      theme=\"standard\"\n      style=\"color: currentColor; position: absolute;\"\n      size=\"m\"\n      text=\"\"\n    />\n  {/if}\n\n  {#if iconmode === 'left' || iconmode === 'only'}\n    <span class=\"mc-button__icon\">\n      {#if hasiconslot}\n        <slot name=\"icon\" />\n      {/if}\n    </span>\n  {/if}\n\n  {#if iconmode !== 'only'}\n    <span class=\"mc-button__label\" class:hidden={isloading}>\n      <slot />\n    </span>\n  {/if}\n\n  {#if iconmode === 'right'}\n    <span class=\"mc-button__icon\">\n      {#if hasiconslot}\n        <slot name=\"icon\" />\n      {/if}\n    </span>\n  {/if}\n</button>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/button';\n\n  .mc-button__icon {\n    pointer-events: none;\n  }\n\n  .hidden {\n    visibility: hidden;\n  }\n\n  .loader-style {\n    color: currentColor;\n    position: absolute;\n  }\n</style>\n"],"names":["appearance","size","ghost","outlined","iconmode","$.prop","$$props","disabled","type","isloading","hasiconslot","events","$.rest_props","$$render","consequent","consequent_1","consequent_2","consequent_3","consequent_4","consequent_5"],"mappings":";;;;;;kzHAAA,gBA0BI,IAAAA,qBAAa,UAAU,EACvBC,eAAO,GAAG,EACVC,gBAAQ,EAAK,EACbC,mBAAW,EAAK,EAChBC,EAAQC,EAAAC,EAAA,WAAA,CAAA,EACRC,mBAAW,EAAK,EAChBC,eAAO,QAAQ,EACfC,oBAAY,EAAK,EACjBC,sBAAc,EAAK,EAChBC,EAAAC,EAAAN,EAAA,6JAK0B,MAAA,wBAAAL,kBAAmBD,EAAU,CAAA,4BAOxDW,oCANoBT,EAAK,wBACFC,EAAQ,EACP,uBAAAC,EAAQ,IAAK,4BACfK,EAAS,sJAK9BA,EAAS,GAAAI,EAAAC,CAAA,0GAWLJ,EAAW,GAAAG,EAAAE,CAAA,0BAFfX,EAAa,IAAA,QAAUA,MAAa,SAAMS,EAAAG,CAAA,sJASAP,EAAS,CAAA,EAAA,CAAA,kBADnDL,MAAa,QAAMS,EAAAI,CAAA,0GAQfP,EAAW,GAAAG,EAAAK,CAAA,yBAFfd,MAAa,SAAOS,EAAAM,CAAA,wEA9CV,WAAU,6CAChB,IAAG,+CACF,GAAK,qDACF,GAAK,0GAEL,GAAK,6CACT,SAAQ,uDACH,GAAK,2DACH,GAAK,YAGvB"}

package/dist/components/button/Button.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAW,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAE1D;;;;;GAKG;wBA8DE,IAAI;AA5DT,wBA4DU;AA6BV,eAAO,MAAM,MAAM,KAAoB,CAAC;AAUxC,eAAO,MAAM,QAAQ,KAAoB,CAAC;AAc1C,eAAO,MAAM,KAAK,KAAoB,CAAC;AAqBvC,eAAO,MAAM,IAAI,KAAoB,CAAC"}
+{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAW,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAG1D;;;;;GAKG;wBA8DE,IAAI;AA5DT,wBA4DU;AA6BV,eAAO,MAAM,MAAM,KAAoB,CAAC;AAUxC,eAAO,MAAM,QAAQ,KAAoB,CAAC;AAc1C,eAAO,MAAM,KAAK,KAAoB,CAAC;AAqBvC,eAAO,MAAM,IAAI,KAAoB,CAAC"}

package/dist/components/button/Button.stories.js

@@ -1,4 +1,5 @@
 import { action } from 'storybook/actions';
+import ChevronRight32 from '@mozaic-ds/icons-svelte/custom-elements/ChevronRight32/ChevronRight32.js';
 import { userEvent, expect, within, fn } from 'storybook/test';
 /**
  * Buttons are used to trigger actions. Their appearance depends on the type of action required from the user or the context.