@mozaic-ds/web-components 0.18.0 → 0.19.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/package.json +1 -1
  2. package/public/adeo/bundle.js +0 -5
  3. package/public/adeo/components/fileuploader/FileUploader.js +1 -1
  4. package/public/adeo/components/fileuploader/FileUploader.js.map +1 -1
  5. package/public/adeo/components/fileuploader/FileUploader.svelte +2 -0
  6. package/public/adeo/components/menu/Menu.js +1 -1
  7. package/public/adeo/components/menu/Menu.js.map +1 -1
  8. package/public/adeo/components/menu/Menu.svelte +3 -0
  9. package/public/adeo/components/tabs/Tabs.js +1 -1
  10. package/public/adeo/components/tabs/Tabs.js.map +1 -1
  11. package/public/adeo/components/tabs/Tabs.svelte +15 -0
  12. package/public/adeo/main.d.ts +0 -1
  13. package/public/adeo/main.d.ts.map +1 -1
  14. package/public/adeo/utilities/main.d.ts +0 -1
  15. package/public/adeo/utilities/main.d.ts.map +1 -1
  16. package/public/adeo/utilities/stories/fileuploader/FileUploader.stories.d.ts.map +1 -1
  17. package/public/bricoman/bundle.js +0 -5
  18. package/public/bricoman/components/fileuploader/FileUploader.js +1 -1
  19. package/public/bricoman/components/fileuploader/FileUploader.js.map +1 -1
  20. package/public/bricoman/components/fileuploader/FileUploader.svelte +2 -0
  21. package/public/bricoman/components/menu/Menu.js +1 -1
  22. package/public/bricoman/components/menu/Menu.js.map +1 -1
  23. package/public/bricoman/components/menu/Menu.svelte +3 -0
  24. package/public/bricoman/components/tabs/Tabs.js +1 -1
  25. package/public/bricoman/components/tabs/Tabs.js.map +1 -1
  26. package/public/bricoman/components/tabs/Tabs.svelte +15 -0
  27. package/public/bricoman/main.d.ts +0 -1
  28. package/public/bricoman/main.d.ts.map +1 -1
  29. package/public/bricoman/utilities/main.d.ts +0 -1
  30. package/public/bricoman/utilities/main.d.ts.map +1 -1
  31. package/public/bricoman/utilities/stories/fileuploader/FileUploader.stories.d.ts.map +1 -1
  32. package/public/bundle.js +0 -5
  33. package/public/components/fileuploader/FileUploader.js +1 -1
  34. package/public/components/fileuploader/FileUploader.js.map +1 -1
  35. package/public/components/fileuploader/FileUploader.svelte +2 -0
  36. package/public/components/menu/Menu.js +1 -1
  37. package/public/components/menu/Menu.js.map +1 -1
  38. package/public/components/menu/Menu.svelte +3 -0
  39. package/public/components/tabs/Tabs.js +1 -1
  40. package/public/components/tabs/Tabs.js.map +1 -1
  41. package/public/components/tabs/Tabs.svelte +15 -0
  42. package/public/main.d.ts +0 -1
  43. package/public/main.d.ts.map +1 -1
  44. package/public/utilities/main.d.ts +0 -1
  45. package/public/utilities/main.d.ts.map +1 -1
  46. package/public/utilities/stories/fileuploader/FileUploader.stories.d.ts.map +1 -1
  47. package/public/adeo/components/button/ButtonSlot.js +0 -2
  48. package/public/adeo/components/button/ButtonSlot.js.map +0 -1
  49. package/public/adeo/components/buttonslot/ButtonSlot.svelte +0 -148
  50. package/public/adeo/utilities/stories/button/ButtonSlot.stories.d.ts +0 -10
  51. package/public/adeo/utilities/stories/button/ButtonSlot.stories.d.ts.map +0 -1
  52. package/public/bricoman/components/button/ButtonSlot.js +0 -2
  53. package/public/bricoman/components/button/ButtonSlot.js.map +0 -1
  54. package/public/bricoman/components/buttonslot/ButtonSlot.svelte +0 -148
  55. package/public/bricoman/utilities/stories/button/ButtonSlot.stories.d.ts +0 -10
  56. package/public/bricoman/utilities/stories/button/ButtonSlot.stories.d.ts.map +0 -1
  57. package/public/components/button/ButtonSlot.js +0 -2
  58. package/public/components/button/ButtonSlot.js.map +0 -1
  59. package/public/components/buttonslot/ButtonSlot.svelte +0 -148
  60. package/public/utilities/stories/button/ButtonSlot.stories.d.ts +0 -10
  61. package/public/utilities/stories/button/ButtonSlot.stories.d.ts.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.js","sources":["../../../src/components/tabs/Tabs.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import type { TabsAlign, TabsItems, TabsType } from './tabs.types';\n import { EventHandler } from '../../utilities/EventHandler';\n import {\n get_current_component,\n createEventDispatcher,\n } from 'svelte/internal';\n\n export let align: TabsAlign = 'auto';\n export let description = 'Tabs';\n export let nodivider = false;\n export let tabs: string;\n export let type: TabsType = 'tabs';\n export let stateless = false;\n export let selectedtab: string | undefined;\n let eventHandler = new EventHandler(\n get_current_component(),\n createEventDispatcher(),\n );\n let tablist: HTMLElement;\n $: parsedTabs = tabs ? (JSON.parse(tabs) as TabsItems[]) : [];\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n function manageTabs(e: Event, tabItem: TabsItems): void {\n const currentEl = e.target as HTMLElement;\n if (stateless) {\n eventHandler.dispatch(\n 'tab-clicked',\n Object.assign(tabItem, { target: currentEl }),\n );\n } else {\n tablist.querySelectorAll('.mc-tabs__element').forEach((el): void => {\n el.classList.remove('mc-tabs__element--selected');\n el.setAttribute('aria-selected', 'false');\n });\n\n currentEl.classList.add('mc-tabs__element--selected');\n currentEl.setAttribute('aria-selected', 'true');\n\n eventHandler.dispatch(\n 'tab-clicked',\n Object.assign(tabItem, { target: currentEl }),\n );\n }\n }\n\n function generateIconName(iconName: string, iconColor: string): string {\n return `${iconName} size=\"1.5rem\" fill=\"${iconColor}\"`;\n }\n</script>\n\n<div\n class=\"mc-tabs\n {align && align === 'full' ? ' mc-tabs--full' : ''}\n {align && align === 'centered' ? ' mc-tabs--full-centered' : ''}\n {type ? ` mc-tabs--${type}` : ''}{nodivider ? ' mc-tabs--no-divider' : ''}\"\n {...attributes}\n>\n <ul\n class=\"mc-tabs__nav\"\n bind:this={tablist}\n role=\"tablist\"\n aria-label={description}\n >\n {#each parsedTabs as tab, index}\n <li class=\"mc-tabs__item\" role=\"presentation\">\n {#if tab.href}\n {#if !tab.disabled}\n <a\n href={tab.href}\n role=\"tab\"\n class=\"mc-tabs__element\"\n class:mc-tabs__element--disabled={tab.disabled}\n class:mc-tabs__element--selected={stateless\n ? tab.id == selectedtab\n : tab.isActive}\n id={tab.id}\n aria-selected={tab.isActive ? 'true' : 'false'}\n on:click={(event) =>\n manageTabs(event, Object.assign({ index: index }, tab))}\n >\n <span class=\"mc-tabs__text\">\n {#if tab.iconName}\n <span class=\"mc-tabs__icon\"\n >{@html `<${generateIconName(\n tab.iconName,\n tab.iconColor,\n )} />`}</span\n >\n {/if}\n {tab.text}\n </span>\n </a>\n {:else}\n <span\n role=\"tab\"\n class=\"mc-tabs__element\"\n class:mc-tabs__element--disabled={tab.disabled}\n class:mc-tabs__element--selected={stateless\n ? tab.id == selectedtab\n : tab.isActive}\n id={tab.id}\n aria-selected={tab.isActive ? 'true' : 'false'}\n >\n <span class=\"mc-tabs__text\">\n {#if tab.iconName}\n <span class=\"mc-tabs__icon\"\n >{@html `<${generateIconName(\n tab.iconName,\n tab.iconColor,\n )} />`}</span\n >\n {/if}\n {tab.text}\n </span>\n </span>\n {/if}\n {:else}\n <button\n role=\"tab\"\n type=\"button\"\n class=\"mc-tabs__element\"\n class:mc-tabs__element--disabled={tab.disabled}\n class:mc-tabs__element--selected={stateless\n ? tab.id == selectedtab\n : tab.isActive}\n id={tab.id}\n disabled={tab.disabled}\n aria-selected={tab.isActive ? 'true' : 'false'}\n on:click={(event) =>\n manageTabs(event, Object.assign({ index: index }, tab))}\n >\n <span class=\"mc-tabs__text\">\n {#if tab.iconName}\n <span class=\"mc-tabs__icon\"\n >{@html `<${generateIconName(\n tab.iconName,\n tab.iconColor,\n )} />`}</span\n >\n {/if}\n {tab.text}\n </span>\n </button>\n {/if}\n </li>\n {/each}\n </ul>\n</div>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/all-settings';\n @import '@mozaic-ds/styles/components/c.tabs';\n</style>\n"],"names":["t1_value","ctx","text","if_block","iconName","create_if_block_4","attr","button","button_id_value","id","disabled","button_disabled_value","button_aria_selected_value","isActive","toggle_class","insert","target","anchor","append","span","dirty","set_data","t1","create_if_block_1","raw_value","generateIconName","iconColor","innerHTML","create_if_block_3","span1","span1_id_value","span1_aria_selected_value","span0","create_if_block_2","a","a_href_value","href","a_id_value","a_aria_selected_value","create_if_block","li","length","i","div","ul","class","div_class_value","tablist","align","$$props","description","nodivider","tabs","type","stateless","selectedtab","eventHandler","EventHandler","get_current_component","createEventDispatcher","manageTabs","e","tabItem","currentEl","querySelectorAll","forEach","el","classList","remove","setAttribute","add","dispatch","Object","assign","$$invalidate","parsedTabs","JSON","parse","attributes","$$restProps","event","index","tab","$$value"],"mappings":"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"}
1
+ {"version":3,"file":"Tabs.js","sources":["../../../src/components/tabs/Tabs.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import type { TabsAlign, TabsItems, TabsType } from './tabs.types';\n import { EventHandler } from '../../utilities/EventHandler';\n import {\n get_current_component,\n createEventDispatcher,\n } from 'svelte/internal';\n\n export let align: TabsAlign = 'auto';\n export let description = 'Tabs';\n export let nodivider = false;\n export let tabs: string;\n export let type: TabsType = 'tabs';\n export let stateless = false;\n export let selectedtab: string | undefined;\n let eventHandler = new EventHandler(\n get_current_component(),\n createEventDispatcher(),\n );\n let tablist: HTMLElement;\n $: parsedTabs = tabs ? (JSON.parse(tabs) as TabsItems[]) : [];\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n function manageTabs(e: Event, tabItem: TabsItems): void {\n const currentEl = e.target as HTMLElement;\n if (stateless) {\n eventHandler.dispatch(\n 'tab-clicked',\n Object.assign(tabItem, { target: currentEl }),\n );\n } else {\n tablist.querySelectorAll('.mc-tabs__element').forEach((el): void => {\n el.classList.remove('mc-tabs__element--selected');\n el.setAttribute('aria-selected', 'false');\n });\n\n currentEl.classList.add('mc-tabs__element--selected');\n currentEl.setAttribute('aria-selected', 'true');\n\n eventHandler.dispatch(\n 'tab-clicked',\n Object.assign(tabItem, { target: currentEl }),\n );\n }\n }\n\n function generateIconName(iconName: string, iconColor: string): string {\n return `${iconName} size=\"1.5rem\" fill=\"${iconColor}\"`;\n }\n</script>\n\n<div\n class=\"mc-tabs\n {align && align === 'full' ? ' mc-tabs--full' : ''}\n {align && align === 'centered' ? ' mc-tabs--full-centered' : ''}\n {type ? ` mc-tabs--${type}` : ''}{nodivider ? ' mc-tabs--no-divider' : ''}\"\n {...attributes}\n>\n <ul\n class=\"mc-tabs__nav\"\n bind:this={tablist}\n role=\"tablist\"\n aria-label={description}\n >\n {#each parsedTabs as tab, index}\n <li class=\"mc-tabs__item\" role=\"presentation\">\n {#if tab.href}\n {#if !tab.disabled}\n <a\n href={tab.href}\n role=\"tab\"\n class=\"mc-tabs__element\"\n class:mc-tabs__element--disabled={tab.disabled}\n class:mc-tabs__element--selected={stateless\n ? tab.id == selectedtab\n : tab.isActive}\n id={tab.id}\n aria-selected={tab.isActive ? 'true' : 'false'}\n on:click={(event) =>\n manageTabs(event, Object.assign({ index: index }, tab))}\n >\n <span class=\"mc-tabs__text\">\n {#if tab.iconName}\n <span class=\"mc-tabs__icon\"\n >{@html `<${generateIconName(\n tab.iconName,\n tab.iconColor,\n )} />`}</span\n >\n {/if}\n {#if $$slots.icon}\n <span class=\"mc-tabs__icon\"\n ><slot prop={tab} name=\"icon\" /></span\n >\n {/if}\n {tab.text}\n </span>\n </a>\n {:else}\n <span\n role=\"tab\"\n class=\"mc-tabs__element\"\n class:mc-tabs__element--disabled={tab.disabled}\n class:mc-tabs__element--selected={stateless\n ? tab.id == selectedtab\n : tab.isActive}\n id={tab.id}\n aria-selected={tab.isActive ? 'true' : 'false'}\n >\n <span class=\"mc-tabs__text\">\n {#if tab.iconName}\n <span class=\"mc-tabs__icon\"\n >{@html `<${generateIconName(\n tab.iconName,\n tab.iconColor,\n )} />`}</span\n >\n {/if}\n {#if $$slots.icon}\n <span class=\"mc-tabs__icon\"\n ><slot prop={tab} name=\"icon\" /></span\n >\n {/if}\n {tab.text}\n </span>\n </span>\n {/if}\n {:else}\n <button\n role=\"tab\"\n type=\"button\"\n class=\"mc-tabs__element\"\n class:mc-tabs__element--disabled={tab.disabled}\n class:mc-tabs__element--selected={stateless\n ? tab.id == selectedtab\n : tab.isActive}\n id={tab.id}\n disabled={tab.disabled}\n aria-selected={tab.isActive ? 'true' : 'false'}\n on:click={(event) =>\n manageTabs(event, Object.assign({ index: index }, tab))}\n >\n <span class=\"mc-tabs__text\">\n {#if tab.iconName}\n <span class=\"mc-tabs__icon\"\n >{@html `<${generateIconName(\n tab.iconName,\n tab.iconColor,\n )} />`}</span\n >\n {/if}\n {#if $$slots.icon}\n <span class=\"mc-tabs__icon\"\n ><slot prop={tab} name=\"icon\" /></span\n >\n {/if}\n {tab.text}\n </span>\n </button>\n {/if}\n </li>\n {/each}\n </ul>\n</div>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/all-settings';\n @import '@mozaic-ds/styles/components/c.tabs';\n</style>\n"],"names":["t2_value","ctx","text","if_block0","iconName","create_if_block_7","if_block1","icon","create_if_block_6","attr","button","button_id_value","id","disabled","button_disabled_value","button_aria_selected_value","isActive","toggle_class","insert","target","anchor","append","span","dirty","set_data","t2","create_if_block_1","raw_value","generateIconName","iconColor","innerHTML","slot","create_if_block_5","create_if_block_4","span1","span1_id_value","span1_aria_selected_value","span0","create_if_block_3","create_if_block_2","a","a_href_value","href","a_id_value","a_aria_selected_value","create_if_block","li","length","i","div","ul","class","div_class_value","tablist","align","$$props","description","nodivider","tabs","type","stateless","selectedtab","eventHandler","EventHandler","get_current_component","createEventDispatcher","manageTabs","e","tabItem","currentEl","querySelectorAll","forEach","el","classList","remove","setAttribute","add","dispatch","Object","assign","$$invalidate","parsedTabs","JSON","parse","attributes","$$restProps","event","index","tab","$$value"],"mappings":"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"}
@@ -90,6 +90,11 @@
90
90
  )} />`}</span
91
91
  >
92
92
  {/if}
93
+ {#if $$slots.icon}
94
+ <span class="mc-tabs__icon"
95
+ ><slot prop={tab} name="icon" /></span
96
+ >
97
+ {/if}
93
98
  {tab.text}
94
99
  </span>
95
100
  </a>
@@ -113,6 +118,11 @@
113
118
  )} />`}</span
114
119
  >
115
120
  {/if}
121
+ {#if $$slots.icon}
122
+ <span class="mc-tabs__icon"
123
+ ><slot prop={tab} name="icon" /></span
124
+ >
125
+ {/if}
116
126
  {tab.text}
117
127
  </span>
118
128
  </span>
@@ -141,6 +151,11 @@
141
151
  )} />`}</span
142
152
  >
143
153
  {/if}
154
+ {#if $$slots.icon}
155
+ <span class="mc-tabs__icon"
156
+ ><slot prop={tab} name="icon" /></span
157
+ >
158
+ {/if}
144
159
  {tab.text}
145
160
  </span>
146
161
  </button>
package/public/main.d.ts CHANGED
@@ -4,7 +4,6 @@ declare const _default: {
4
4
  Accordion: typeof Accordion;
5
5
  Autocomplete: typeof Accordion;
6
6
  Button: typeof Accordion;
7
- ButtonSlot: typeof Accordion;
8
7
  Card: typeof Accordion;
9
8
  Breadcrumb: typeof Accordion;
10
9
  Checkbox: typeof Accordion;
@@ -1 +1 @@
1
- {"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,yCAAyC,CAAC;AAsDhE,YAAY,EACV,OAAO,IAAI,WAAW,EACtB,OAAO,EACP,YAAY,EACZ,OAAO,EACP,IAAI,GACL,MAAM,oCAAoC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAG5C,wBAuDE"}
1
+ {"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,yCAAyC,CAAC;AAqDhE,YAAY,EACV,OAAO,IAAI,WAAW,EACtB,OAAO,EACP,YAAY,EACZ,OAAO,EACP,IAAI,GACL,MAAM,oCAAoC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAG5C,wBAsDE"}
@@ -4,7 +4,6 @@ declare const _default: {
4
4
  Accordion: typeof Accordion;
5
5
  Autocomplete: typeof Accordion;
6
6
  Button: typeof Accordion;
7
- ButtonSlot: typeof Accordion;
8
7
  Card: typeof Accordion;
9
8
  Breadcrumb: typeof Accordion;
10
9
  Checkbox: typeof Accordion;
@@ -1 +1 @@
1
- {"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,yCAAyC,CAAC;AAsDhE,YAAY,EACV,OAAO,IAAI,WAAW,EACtB,OAAO,EACP,YAAY,EACZ,OAAO,EACP,IAAI,GACL,MAAM,oCAAoC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAG5C,wBAuDE"}
1
+ {"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,yCAAyC,CAAC;AAqDhE,YAAY,EACV,OAAO,IAAI,WAAW,EACtB,OAAO,EACP,YAAY,EACZ,OAAO,EACP,IAAI,GACL,MAAM,oCAAoC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAG5C,wBAsDE"}
@@ -1 +1 @@
1
- {"version":3,"file":"FileUploader.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/fileuploader/FileUploader.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;;AAGnD,wBA6EU;AA2DV,eAAO,MAAM,OAAO,uCAAoB,CAAC;AAOzC,eAAO,MAAM,aAAa,uCAAoB,CAAC;AAM/C,eAAO,MAAM,mBAAmB,uCAAoB,CAAC;AAQrD,eAAO,MAAM,YAAY,uCAAoB,CAAC;AAQ9C,eAAO,MAAM,SAAS,uCAAoB,CAAC;AAS3C,eAAO,MAAM,gBAAgB,uCAAoB,CAAC;AAQlD,eAAO,MAAM,gCAAgC,uCAAoB,CAAC"}
1
+ {"version":3,"file":"FileUploader.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/fileuploader/FileUploader.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;;AAGnD,wBAiFU;AA4DV,eAAO,MAAM,OAAO,uCAAoB,CAAC;AAOzC,eAAO,MAAM,aAAa,uCAAoB,CAAC;AAM/C,eAAO,MAAM,mBAAmB,uCAAoB,CAAC;AAQrD,eAAO,MAAM,YAAY,uCAAoB,CAAC;AAQ9C,eAAO,MAAM,SAAS,uCAAoB,CAAC;AAS3C,eAAO,MAAM,gBAAgB,uCAAoB,CAAC;AAQlD,eAAO,MAAM,gCAAgC,uCAAoB,CAAC"}
@@ -1,2 +0,0 @@
1
- import{S as t,i as o,a as e,b as i,f as n,s as r,c as m,e as c,d as l,n as d,j as s,k as a,l as b,M as u,A as h,y as f,z as g,p,q as x,r as w,v as _,x as $,h as y,B as v,D as k,E as z,F as j,R as q}from"../../index-d12e76e8.js";import{c as E}from"../../EventForward-e61ea03d.js";import R from"../loader/Loader.nested.js";function C(t){let o,e,n,r;const m=[A,N],l=[];function d(t,o){return t[11]&&"left"===t[10]?0:1}return e=d(t),n=l[e]=m[e](t),{c(){o=c("span"),n.c(),y(o,"class","mc-button__icon")},m(t,n){i(t,o,n),l[e].m(o,null),r=!0},p(t,i){let r=e;e=d(t),e===r?l[e].p(t,i):(v(),f(l[r],1,1,(()=>{l[r]=null})),g(),n=l[e],n?n.p(t,i):(n=l[e]=m[e](t),n.c()),h(n,1),n.m(o,null))},i(t){r||(h(n),r=!0)},o(t){f(n),r=!1},d(t){t&&x(o),l[e].d()}}}function N(t){let o;return{c(){o=c("slot"),y(o,"name","icon")},m(t,e){i(t,o,e)},p:d,i:d,o:d,d(t){t&&x(o)}}}function A(t){let o,e;return o=new R({props:{size:"s",theme:t[9],text:""}}),{c(){k(o.$$.fragment)},m(t,i){z(o,t,i),e=!0},p(t,e){const i={};512&e&&(i.theme=t[9]),o.$set(i)},i(t){e||(h(o.$$.fragment,t),e=!0)},o(t){f(o.$$.fragment,t),e=!1},d(t){j(o,t)}}}function F(t){let o,e,n,r,m,d=t[11]&&"left"===t[10]&&!t[4]&&M(t),s=t[11]&&"right"===t[10]&&!t[4]&&O(t);return{c(){d&&d.c(),o=l(),e=c("span"),e.innerHTML="<slot></slot>",n=l(),s&&s.c(),r=q(),y(e,"class","mc-button__label")},m(t,c){d&&d.m(t,c),i(t,o,c),i(t,e,c),i(t,n,c),s&&s.m(t,c),i(t,r,c),m=!0},p(t,e){t[11]&&"left"===t[10]&&!t[4]?d?(d.p(t,e),3088&e&&h(d,1)):(d=M(t),d.c(),h(d,1),d.m(o.parentNode,o)):d&&(v(),f(d,1,1,(()=>{d=null})),g()),t[11]&&"right"===t[10]&&!t[4]?s?(s.p(t,e),3088&e&&h(s,1)):(s=O(t),s.c(),h(s,1),s.m(r.parentNode,r)):s&&(v(),f(s,1,1,(()=>{s=null})),g())},i(t){m||(h(d),h(s),m=!0)},o(t){f(d),f(s),m=!1},d(t){d&&d.d(t),t&&x(o),t&&x(e),t&&x(n),s&&s.d(t),t&&x(r)}}}function L(t){let o,e,n,r;const m=[B,S],l=[];function d(t,o){return t[11]?0:1}return e=d(t),n=l[e]=m[e](t),{c(){o=c("span"),n.c(),y(o,"class","mc-button__icon")},m(t,n){i(t,o,n),l[e].m(o,null),r=!0},p(t,i){let r=e;e=d(t),e===r?l[e].p(t,i):(v(),f(l[r],1,1,(()=>{l[r]=null})),g(),n=l[e],n?n.p(t,i):(n=l[e]=m[e](t),n.c()),h(n,1),n.m(o,null))},i(t){r||(h(n),r=!0)},o(t){f(n),r=!1},d(t){t&&x(o),l[e].d()}}}function M(t){let o,e,n;return e=new R({props:{size:"s",theme:t[9],text:""}}),{c(){o=c("span"),k(e.$$.fragment),y(o,"class","mc-button__icon")},m(t,r){i(t,o,r),z(e,o,null),n=!0},p(t,o){const i={};512&o&&(i.theme=t[9]),e.$set(i)},i(t){n||(h(e.$$.fragment,t),n=!0)},o(t){f(e.$$.fragment,t),n=!1},d(t){t&&x(o),j(e)}}}function O(t){let o,e,n;return e=new R({props:{size:"s",theme:t[9],text:""}}),{c(){o=c("span"),k(e.$$.fragment),y(o,"class","mc-button__icon")},m(t,r){i(t,o,r),z(e,o,null),n=!0},p(t,o){const i={};512&o&&(i.theme=t[9]),e.$set(i)},i(t){n||(h(e.$$.fragment,t),n=!0)},o(t){f(e.$$.fragment,t),n=!1},d(t){t&&x(o),j(e)}}}function S(t){let o;return{c(){o=c("slot"),y(o,"name","icon")},m(t,e){i(t,o,e)},p:d,i:d,o:d,d(t){t&&x(o)}}}function B(t){let o,e;return o=new R({props:{size:"m",theme:t[9],text:""}}),{c(){k(o.$$.fragment)},m(t,i){z(o,t,i),e=!0},p(t,e){const i={};512&e&&(i.theme=t[9]),o.$set(i)},i(t){e||(h(o.$$.fragment,t),e=!0)},o(t){f(o.$$.fragment,t),e=!1},d(t){j(o,t)}}}function D(t){let o,e,n,r;const m=[J,H],l=[];function d(t,o){return t[11]&&"right"===t[10]?0:1}return e=d(t),n=l[e]=m[e](t),{c(){o=c("span"),n.c(),y(o,"class","mc-button__icon")},m(t,n){i(t,o,n),l[e].m(o,null),r=!0},p(t,i){let r=e;e=d(t),e===r?l[e].p(t,i):(v(),f(l[r],1,1,(()=>{l[r]=null})),g(),n=l[e],n?n.p(t,i):(n=l[e]=m[e](t),n.c()),h(n,1),n.m(o,null))},i(t){r||(h(n),r=!0)},o(t){f(n),r=!1},d(t){t&&x(o),l[e].d()}}}function H(t){let o;return{c(){o=c("slot"),y(o,"name","icon")},m(t,e){i(t,o,e)},p:d,i:d,o:d,d(t){t&&x(o)}}}function J(t){let o,e;return o=new R({props:{size:"s",theme:t[9],text:""}}),{c(){k(o.$$.fragment)},m(t,i){z(o,t,i),e=!0},p(t,e){const i={};512&e&&(i.theme=t[9]),o.$set(i)},i(t){e||(h(o.$$.fragment,t),e=!0)},o(t){f(o.$$.fragment,t),e=!1},d(t){j(o,t)}}}function T(t){let o,e,n,r,w,_,$,y,k,z="left"===t[4]&&C(t);const j=[L,F],q=[];function E(t,o){return"only"===t[4]?0:1}n=E(t),r=q[n]=j[n](t);let R="right"===t[4]&&D(t),N=[{type:t[6]},{class:_=t[13](t[1],t[0],t[2],t[3])+" "+t[8]},{disabled:t[5]},t[7]],A={};for(let t=0;t<N.length;t+=1)A=m(A,N[t]);return{c(){o=c("button"),z&&z.c(),e=l(),r.c(),w=l(),R&&R.c(),this.c=d,s(o,A),a(o,"mc-button--square","only"===t[4])},m(r,m){i(r,o,m),z&&z.m(o,null),b(o,e),q[n].m(o,null),b(o,w),R&&R.m(o,null),o.autofocus&&o.focus(),$=!0,y||(k=u(t[12].call(null,o)),y=!0)},p(t,[i]){"left"===t[4]?z?(z.p(t,i),16&i&&h(z,1)):(z=C(t),z.c(),h(z,1),z.m(o,e)):z&&(v(),f(z,1,1,(()=>{z=null})),g());let m=n;n=E(t),n===m?q[n].p(t,i):(v(),f(q[m],1,1,(()=>{q[m]=null})),g(),r=q[n],r?r.p(t,i):(r=q[n]=j[n](t),r.c()),h(r,1),r.m(o,w)),"right"===t[4]?R?(R.p(t,i),16&i&&h(R,1)):(R=D(t),R.c(),h(R,1),R.m(o,null)):R&&(v(),f(R,1,1,(()=>{R=null})),g()),s(o,A=p(N,[(!$||64&i)&&{type:t[6]},(!$||271&i&&_!==(_=t[13](t[1],t[0],t[2],t[3])+" "+t[8]))&&{class:_},(!$||32&i)&&{disabled:t[5]},128&i&&t[7]])),a(o,"mc-button--square","only"===t[4])},i(t){$||(h(z),h(r),h(R),$=!0)},o(t){f(z),f(r),f(R),$=!1},d(t){t&&x(o),z&&z.d(),q[n].d(),R&&R.d(),y=!1,k()}}}function G(t,o,e){let i,n,r,c,l,d;const s=["bordered","theme","size","full","iconmode","disabled","responsivesize","responsivewidth","type","loader"];let a=w(o,s);var b,u,h;let{bordered:f=!1}=o,{theme:g}=o,{size:p="m"}=o,{full:x=!1}=o,{iconmode:y}=o,{disabled:v=!1}=o,{responsivesize:k}=o,{responsivewidth:z}=o,{type:j="button"}=o,{loader:q}=o;const R=E(_());return t.$$set=t=>{e(22,o=m(m({},o),$(t))),e(21,a=w(o,s)),"bordered"in t&&e(0,f=t.bordered),"theme"in t&&e(1,g=t.theme),"size"in t&&e(2,p=t.size),"full"in t&&e(3,x=t.full),"iconmode"in t&&e(4,y=t.iconmode),"disabled"in t&&e(5,v=t.disabled),"responsivesize"in t&&e(14,k=t.responsivesize),"responsivewidth"in t&&e(15,z=t.responsivewidth),"type"in t&&e(6,j=t.type),"loader"in t&&e(16,q=t.loader)},t.$$.update=()=>{65536&t.$$.dirty&&e(20,i=q?JSON.parse(q):void 0),1179648&t.$$.dirty&&e(11,n=null!==e(17,b=null==i?void 0:i.enabled)&&void 0!==b&&b),1310720&t.$$.dirty&&e(10,r=null!==e(18,u=null==i?void 0:i.position)&&void 0!==u?u:"left"),1572864&t.$$.dirty&&e(9,c=null!==e(19,h=null==i?void 0:i.theme)&&void 0!==h?h:"primary"),e(8,l=o.class),e(7,d=Object.assign({},a)),128&t.$$.dirty&&delete d.class},o=$(o),[f,g,p,x,y,v,j,d,l,c,r,n,R,function(t,o,e,i){const n=["mc-button"],r=function(t,o){if(!o&&!t)return"";const e=o?"bordered":"solid";return t?`mc-button--${e}-${t}`:`mc-button--${e}`}(t,o);return r&&n.push(r),e&&n.push(`mc-button--${e}`),i?n.push("mc-button--full"):n.push("mc-button--fit"),"only"===y&&n.push("mc-button--square"),k&&n.push(`mc-button--${k}`),z&&n.push(`mc-button--${z}`),n.join(" ")},k,z,q,b,u,h,i]}class I extends t{constructor(t){super();const m=document.createElement("style");m.textContent='.mc-button{margin:0;-webkit-box-shadow:none;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;color:#ffffff;background-color:#007f8c;font-family:"Roboto", sans-serif;font-weight:700;font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem;cursor:pointer;border-radius:4px;text-align:center;border:2px solid transparent;-webkit-transition:all ease 200ms;-o-transition:all ease 200ms;transition:all ease 200ms;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;vertical-align:middle;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-sizing:border-box;box-sizing:border-box;fill:currentColor}.mc-button.is-hover,.mc-button:hover{background-color:#006974;color:#ffffff}.mc-button.is-active,.mc-button:active{background-color:#006974}.mc-button:disabled,.mc-button.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button .mc-button__icon:first-child,.mc-button .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button.is-focus,.mc-button:focus{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #758992;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #758992}.mc-button--s{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s .mc-button__icon:first-child,.mc-button--s .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m .mc-button__icon:first-child,.mc-button--m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l .mc-button__icon{width:2rem;height:2rem}.mc-button--l .mc-button__icon:first-child,.mc-button--l .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full{width:-webkit-fill-available;width:-moz-available;width:stretch}}.mc-button--square{-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:0;padding:0}.mc-button__icon{-ms-flex-negative:0;flex-shrink:0}.mc-button__icon:last-child{margin-left:0.5rem;margin-right:-0.25rem}.mc-button__icon:first-child{margin-right:0.5rem;margin-left:-0.25rem}.mc-button__icon:only-child{margin:0}.mc-button__label{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;pointer-events:none}.mc-button--solid-primary-02{background-color:#6a7081}.mc-button--solid-primary-02.is-hover,.mc-button--solid-primary-02:hover{background-color:#242938}.mc-button--solid-primary-02.is-active,.mc-button--solid-primary-02:active{background-color:#171b26}.mc-button--solid-primary-02:disabled,.mc-button--solid-primary-02.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--solid-neutral{background-color:#333333}.mc-button--solid-neutral.is-hover,.mc-button--solid-neutral:hover{background-color:#191919}.mc-button--solid-neutral.is-active,.mc-button--solid-neutral:active{background-color:#333333}.mc-button--solid-neutral:disabled,.mc-button--solid-neutral.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--solid-danger{background-color:#c61112}.mc-button--solid-danger.is-hover,.mc-button--solid-danger:hover{background-color:#8c0003}.mc-button--solid-danger.is-active,.mc-button--solid-danger:active{background-color:#8c0003}.mc-button--solid-danger:disabled,.mc-button--solid-danger.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered{color:#007f8c;border-color:#007f8c;background-color:#ffffff}.mc-button--bordered.is-hover,.mc-button--bordered:hover{background-color:#d9f0f3;color:#006974}.mc-button--bordered.is-active,.mc-button--bordered:active{background-color:#91d5db;color:#004e57}.mc-button--bordered.is-active,.mc-button--bordered:active{background-color:#91d5db;color:#004e57}.mc-button--bordered:disabled,.mc-button--bordered.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-primary-02{color:#6a7081;border-color:#6a7081;background-color:#ffffff}.mc-button--bordered-primary-02.is-hover,.mc-button--bordered-primary-02:hover{background-color:#eeeff1;color:#6a7081}.mc-button--bordered-primary-02.is-active,.mc-button--bordered-primary-02:active{background-color:#cfd2d8}.mc-button--bordered-primary-02:disabled,.mc-button--bordered-primary-02.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-neutral{color:#333333;border-color:#333333;background-color:#ffffff}.mc-button--bordered-neutral.is-hover,.mc-button--bordered-neutral:hover{background-color:#e6e6e6;color:#333333}.mc-button--bordered-neutral.is-active,.mc-button--bordered-neutral:active{background-color:#cccccc}.mc-button--bordered-neutral:disabled,.mc-button--bordered-neutral.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-danger{color:#c61112;border-color:#c61112;background-color:#ffffff}.mc-button--bordered-danger.is-hover,.mc-button--bordered-danger:hover{background-color:#fdeaea;color:#8c0003}.mc-button--bordered-danger.is-active,.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger.is-active,.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger:disabled,.mc-button--bordered-danger.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}@media screen and (min-width: 680px){.mc-button--s\\@from-m{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-m .mc-button__icon:first-child,.mc-button--s\\@from-m .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-m{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-m .mc-button__icon:first-child,.mc-button--m\\@from-m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-m{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-m .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-m .mc-button__icon:first-child,.mc-button--l\\@from-m .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-m{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-m{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-m{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1024px){.mc-button--s\\@from-l{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-l .mc-button__icon:first-child,.mc-button--s\\@from-l .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-l{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-l .mc-button__icon:first-child,.mc-button--m\\@from-l .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-l{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-l .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-l .mc-button__icon:first-child,.mc-button--l\\@from-l .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-l{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-l{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-l{width:-webkit-fill-available;width:-moz-available;width:stretch}}.mc-button--square{padding:0}}@media screen and (min-width: 1280px){.mc-button--s\\@from-xl{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xl .mc-button__icon:first-child,.mc-button--s\\@from-xl .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl .mc-button__icon:first-child,.mc-button--m\\@from-xl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-xl{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xl .mc-button__icon:first-child,.mc-button--l\\@from-xl .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-xl{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-xl{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-xl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1920px){.mc-button--s\\@from-xxl{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xxl .mc-button__icon:first-child,.mc-button--s\\@from-xxl .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl .mc-button__icon:first-child,.mc-button--m\\@from-xxl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-xxl{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xxl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xxl .mc-button__icon:first-child,.mc-button--l\\@from-xxl .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-xxl{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-xxl{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-xxl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}.mc-button__icon{pointer-events:none}',this.shadowRoot.appendChild(m),o(this,{target:this.shadowRoot,props:e(this.attributes),customElement:!0},G,T,r,{bordered:0,theme:1,size:2,full:3,iconmode:4,disabled:5,responsivesize:14,responsivewidth:15,type:6,loader:16},null),t&&(t.target&&i(t.target,this,t.anchor),t.props&&(this.$set(t.props),n()))}static get observedAttributes(){return["bordered","theme","size","full","iconmode","disabled","responsivesize","responsivewidth","type","loader"]}get bordered(){return this.$$.ctx[0]}set bordered(t){this.$$set({bordered:t}),n()}get theme(){return this.$$.ctx[1]}set theme(t){this.$$set({theme:t}),n()}get size(){return this.$$.ctx[2]}set size(t){this.$$set({size:t}),n()}get full(){return this.$$.ctx[3]}set full(t){this.$$set({full:t}),n()}get iconmode(){return this.$$.ctx[4]}set iconmode(t){this.$$set({iconmode:t}),n()}get disabled(){return this.$$.ctx[5]}set disabled(t){this.$$set({disabled:t}),n()}get responsivesize(){return this.$$.ctx[14]}set responsivesize(t){this.$$set({responsivesize:t}),n()}get responsivewidth(){return this.$$.ctx[15]}set responsivewidth(t){this.$$set({responsivewidth:t}),n()}get type(){return this.$$.ctx[6]}set type(t){this.$$set({type:t}),n()}get loader(){return this.$$.ctx[16]}set loader(t){this.$$set({loader:t}),n()}}export{I as default};
2
- //# sourceMappingURL=ButtonSlot.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ButtonSlot.js","sources":["../../../../src/components/button/ButtonSlot.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import { get_current_component } from 'svelte/internal';\n import { createEventForwarder } from '../../utilities/EventForward';\n import Loader from '../loader/Loader.nested.svelte';\n import type {\n ButtonIconMode,\n ButtonSize,\n ButtonTheme,\n ButtonResponsiveSize,\n ButtonResponsiveWidth,\n ButtonType,\n ButtonLoader,\n } from './button.types';\n\n export let bordered = false;\n export let theme: ButtonTheme | undefined = undefined;\n export let size: ButtonSize = 'm';\n export let full = false;\n export let iconmode: ButtonIconMode | undefined;\n export let disabled = false;\n export let responsivesize: ButtonResponsiveSize = undefined;\n export let responsivewidth: ButtonResponsiveWidth = undefined;\n export let type: ButtonType = 'button';\n export let loader: string;\n\n const forwardEvents = createEventForwarder(get_current_component());\n\n $: loaderOpts = loader ? (JSON.parse(loader) as ButtonLoader) : undefined;\n $: isLoading = loaderOpts?.enabled ?? false;\n $: loaderPosition = loaderOpts?.position ?? 'left';\n $: loaderTheme = loaderOpts?.theme ?? 'primary';\n $: userClass = $$props.class;\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n\n function getAppearanceClass(theme: ButtonTheme, isBordered: boolean): string {\n if (!isBordered && !theme) {\n return '';\n }\n\n const type = isBordered ? 'bordered' : 'solid';\n\n if (theme) {\n return `mc-button--${type}-${theme}`;\n }\n return `mc-button--${type}`;\n }\n\n function getClasses(\n theme: ButtonTheme,\n isBordered: boolean,\n size: ButtonSize,\n isFull: boolean,\n ): string {\n const classes = ['mc-button'];\n\n const appearanceClass = getAppearanceClass(theme, isBordered);\n if (appearanceClass) {\n classes.push(appearanceClass);\n }\n\n if (size) {\n classes.push(`mc-button--${size}`);\n }\n\n if (isFull) {\n classes.push(`mc-button--full`);\n } else {\n classes.push(`mc-button--fit`);\n }\n\n if (iconmode === 'only') {\n classes.push('mc-button--square');\n }\n\n if (responsivesize) {\n classes.push(`mc-button--${responsivesize}`);\n }\n\n if (responsivewidth) {\n classes.push(`mc-button--${responsivewidth}`);\n }\n\n return classes.join(' ');\n }\n</script>\n\n<button\n use:forwardEvents\n {type}\n class=\"{getClasses(theme, bordered, size, full)} {userClass}\"\n class:mc-button--square={iconmode === 'only'}\n {disabled}\n {...attributes}\n>\n {#if iconmode === 'left'}\n <span class=\"mc-button__icon\">\n {#if isLoading && loaderPosition === 'left'}\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n {:else}\n <slot name=\"icon\" />\n {/if}\n </span>\n {/if}\n\n {#if iconmode === 'only'}\n <span class=\"mc-button__icon\">\n {#if isLoading}\n <Loader size=\"m\" theme={loaderTheme} text=\"\" />\n {:else}\n <slot name=\"icon\" />\n {/if}\n </span>\n {:else}\n {#if isLoading && loaderPosition === 'left' && !iconmode}\n <span class=\"mc-button__icon\">\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n </span>\n {/if}\n <span class=\"mc-button__label\"><slot /></span>\n {#if isLoading && loaderPosition === 'right' && !iconmode}\n <span class=\"mc-button__icon\">\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n </span>\n {/if}\n {/if}\n\n {#if iconmode === 'right'}\n <span class=\"mc-button__icon\">\n {#if isLoading && loaderPosition === 'right'}\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n {:else}\n <slot name=\"icon\" />\n {/if}\n </span>\n {/if}\n</button>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import '@mozaic-ds/styles/components/c.button';\n\n .mc-button__icon {\n pointer-events: none;\n }\n</style>\n"],"names":["ctx","insert","target","span","anchor","slot","if_block0","create_if_block_5","if_block1","create_if_block_4","create_if_block_6","if_block2","create_if_block","toggle_class","button","class","button_class_value","_a","_b","_c","bordered","$$props","theme","size","full","iconmode","disabled","responsivesize","responsivewidth","type","loader","forwardEvents","createEventForwarder","get_current_component","$$invalidate","loaderOpts","JSON","parse","undefined","isLoading","enabled","loaderPosition","position","loaderTheme","userClass","attributes","Object","assign","$$restProps","isBordered","isFull","classes","appearanceClass","getAppearanceClass","push","join"],"mappings":"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"}
@@ -1,148 +0,0 @@
1
- <svelte:options tag={null} />
2
-
3
- <script lang="ts">
4
- import { get_current_component } from 'svelte/internal';
5
- import { createEventForwarder } from '../../utilities/EventForward';
6
- import Loader from '../loader/Loader.nested.svelte';
7
- import type {
8
- ButtonIconMode,
9
- ButtonSize,
10
- ButtonTheme,
11
- ButtonResponsiveSize,
12
- ButtonResponsiveWidth,
13
- ButtonType,
14
- ButtonLoader,
15
- } from './button.types';
16
-
17
- export let bordered = false;
18
- export let theme: ButtonTheme | undefined = undefined;
19
- export let size: ButtonSize = 'm';
20
- export let full = false;
21
- export let iconmode: ButtonIconMode | undefined;
22
- export let disabled = false;
23
- export let responsivesize: ButtonResponsiveSize = undefined;
24
- export let responsivewidth: ButtonResponsiveWidth = undefined;
25
- export let type: ButtonType = 'button';
26
- export let loader: string;
27
-
28
- const forwardEvents = createEventForwarder(get_current_component());
29
-
30
- $: loaderOpts = loader ? (JSON.parse(loader) as ButtonLoader) : undefined;
31
- $: isLoading = loaderOpts?.enabled ?? false;
32
- $: loaderPosition = loaderOpts?.position ?? 'left';
33
- $: loaderTheme = loaderOpts?.theme ?? 'primary';
34
- $: userClass = $$props.class;
35
- $: attributes = { ...$$restProps };
36
- $: delete attributes.class;
37
-
38
- function getAppearanceClass(theme: ButtonTheme, isBordered: boolean): string {
39
- if (!isBordered && !theme) {
40
- return '';
41
- }
42
-
43
- const type = isBordered ? 'bordered' : 'solid';
44
-
45
- if (theme) {
46
- return `mc-button--${type}-${theme}`;
47
- }
48
- return `mc-button--${type}`;
49
- }
50
-
51
- function getClasses(
52
- theme: ButtonTheme,
53
- isBordered: boolean,
54
- size: ButtonSize,
55
- isFull: boolean,
56
- ): string {
57
- const classes = ['mc-button'];
58
-
59
- const appearanceClass = getAppearanceClass(theme, isBordered);
60
- if (appearanceClass) {
61
- classes.push(appearanceClass);
62
- }
63
-
64
- if (size) {
65
- classes.push(`mc-button--${size}`);
66
- }
67
-
68
- if (isFull) {
69
- classes.push(`mc-button--full`);
70
- } else {
71
- classes.push(`mc-button--fit`);
72
- }
73
-
74
- if (iconmode === 'only') {
75
- classes.push('mc-button--square');
76
- }
77
-
78
- if (responsivesize) {
79
- classes.push(`mc-button--${responsivesize}`);
80
- }
81
-
82
- if (responsivewidth) {
83
- classes.push(`mc-button--${responsivewidth}`);
84
- }
85
-
86
- return classes.join(' ');
87
- }
88
- </script>
89
-
90
- <button
91
- use:forwardEvents
92
- {type}
93
- class="{getClasses(theme, bordered, size, full)} {userClass}"
94
- class:mc-button--square={iconmode === 'only'}
95
- {disabled}
96
- {...attributes}
97
- >
98
- {#if iconmode === 'left'}
99
- <span class="mc-button__icon">
100
- {#if isLoading && loaderPosition === 'left'}
101
- <Loader size="s" theme={loaderTheme} text="" />
102
- {:else}
103
- <slot name="icon" />
104
- {/if}
105
- </span>
106
- {/if}
107
-
108
- {#if iconmode === 'only'}
109
- <span class="mc-button__icon">
110
- {#if isLoading}
111
- <Loader size="m" theme={loaderTheme} text="" />
112
- {:else}
113
- <slot name="icon" />
114
- {/if}
115
- </span>
116
- {:else}
117
- {#if isLoading && loaderPosition === 'left' && !iconmode}
118
- <span class="mc-button__icon">
119
- <Loader size="s" theme={loaderTheme} text="" />
120
- </span>
121
- {/if}
122
- <span class="mc-button__label"><slot /></span>
123
- {#if isLoading && loaderPosition === 'right' && !iconmode}
124
- <span class="mc-button__icon">
125
- <Loader size="s" theme={loaderTheme} text="" />
126
- </span>
127
- {/if}
128
- {/if}
129
-
130
- {#if iconmode === 'right'}
131
- <span class="mc-button__icon">
132
- {#if isLoading && loaderPosition === 'right'}
133
- <Loader size="s" theme={loaderTheme} text="" />
134
- {:else}
135
- <slot name="icon" />
136
- {/if}
137
- </span>
138
- {/if}
139
- </button>
140
-
141
- <style lang="scss">
142
- @import '@mozaic-ds/styles/settings-tools/_all-settings';
143
- @import '@mozaic-ds/styles/components/c.button';
144
-
145
- .mc-button__icon {
146
- pointer-events: none;
147
- }
148
- </style>
@@ -1,10 +0,0 @@
1
- import type { Story, Meta } from '@storybook/html';
2
- declare const _default: Meta<import("@storybook/html").Args>;
3
- export default _default;
4
- export declare const Solid: Story<import("@storybook/html").Args>;
5
- export declare const Bordered: Story<import("@storybook/html").Args>;
6
- export declare const IconLeft: Story<import("@storybook/html").Args>;
7
- export declare const IconRight: Story<import("@storybook/html").Args>;
8
- export declare const IconOnly: Story<import("@storybook/html").Args>;
9
- export declare const WithLoading: Story<import("@storybook/html").Args>;
10
- //# sourceMappingURL=ButtonSlot.stories.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ButtonSlot.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/button/ButtonSlot.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;;AAGnD,wBA2EU;AA8FV,eAAO,MAAM,KAAK,uCAAoB,CAAC;AAGvC,eAAO,MAAM,QAAQ,uCAAoB,CAAC;AAK1C,eAAO,MAAM,QAAQ,uCAAoB,CAAC;AAa1C,eAAO,MAAM,SAAS,uCAAoB,CAAC;AAa3C,eAAO,MAAM,QAAQ,uCAAoB,CAAC;AAkB1C,eAAO,MAAM,WAAW,uCAAoB,CAAC"}
@@ -1,2 +0,0 @@
1
- import{S as t,i as o,a as e,b as i,f as n,s as r,c as m,e as c,d as l,n as d,j as s,k as b,l as a,M as u,A as h,y as f,z as g,p,q as x,r as w,v as _,x as $,h as y,B as v,D as k,E as z,F as j,R as q}from"../../index-d12e76e8.js";import{c as E}from"../../EventForward-e61ea03d.js";import C from"../loader/Loader.nested.js";function L(t){let o,e,n,r;const m=[N,M],l=[];function d(t,o){return t[11]&&"left"===t[10]?0:1}return e=d(t),n=l[e]=m[e](t),{c(){o=c("span"),n.c(),y(o,"class","mc-button__icon")},m(t,n){i(t,o,n),l[e].m(o,null),r=!0},p(t,i){let r=e;e=d(t),e===r?l[e].p(t,i):(v(),f(l[r],1,1,(()=>{l[r]=null})),g(),n=l[e],n?n.p(t,i):(n=l[e]=m[e](t),n.c()),h(n,1),n.m(o,null))},i(t){r||(h(n),r=!0)},o(t){f(n),r=!1},d(t){t&&x(o),l[e].d()}}}function M(t){let o;return{c(){o=c("slot"),y(o,"name","icon")},m(t,e){i(t,o,e)},p:d,i:d,o:d,d(t){t&&x(o)}}}function N(t){let o,e;return o=new C({props:{size:"s",theme:t[9],text:""}}),{c(){k(o.$$.fragment)},m(t,i){z(o,t,i),e=!0},p(t,e){const i={};512&e&&(i.theme=t[9]),o.$set(i)},i(t){e||(h(o.$$.fragment,t),e=!0)},o(t){f(o.$$.fragment,t),e=!1},d(t){j(o,t)}}}function R(t){let o,e,n,r,m,d=t[11]&&"left"===t[10]&&!t[4]&&F(t),s=t[11]&&"right"===t[10]&&!t[4]&&O(t);return{c(){d&&d.c(),o=l(),e=c("span"),e.innerHTML="<slot></slot>",n=l(),s&&s.c(),r=q(),y(e,"class","mc-button__label")},m(t,c){d&&d.m(t,c),i(t,o,c),i(t,e,c),i(t,n,c),s&&s.m(t,c),i(t,r,c),m=!0},p(t,e){t[11]&&"left"===t[10]&&!t[4]?d?(d.p(t,e),3088&e&&h(d,1)):(d=F(t),d.c(),h(d,1),d.m(o.parentNode,o)):d&&(v(),f(d,1,1,(()=>{d=null})),g()),t[11]&&"right"===t[10]&&!t[4]?s?(s.p(t,e),3088&e&&h(s,1)):(s=O(t),s.c(),h(s,1),s.m(r.parentNode,r)):s&&(v(),f(s,1,1,(()=>{s=null})),g())},i(t){m||(h(d),h(s),m=!0)},o(t){f(d),f(s),m=!1},d(t){d&&d.d(t),t&&x(o),t&&x(e),t&&x(n),s&&s.d(t),t&&x(r)}}}function A(t){let o,e,n,r;const m=[B,S],l=[];function d(t,o){return t[11]?0:1}return e=d(t),n=l[e]=m[e](t),{c(){o=c("span"),n.c(),y(o,"class","mc-button__icon")},m(t,n){i(t,o,n),l[e].m(o,null),r=!0},p(t,i){let r=e;e=d(t),e===r?l[e].p(t,i):(v(),f(l[r],1,1,(()=>{l[r]=null})),g(),n=l[e],n?n.p(t,i):(n=l[e]=m[e](t),n.c()),h(n,1),n.m(o,null))},i(t){r||(h(n),r=!0)},o(t){f(n),r=!1},d(t){t&&x(o),l[e].d()}}}function F(t){let o,e,n;return e=new C({props:{size:"s",theme:t[9],text:""}}),{c(){o=c("span"),k(e.$$.fragment),y(o,"class","mc-button__icon")},m(t,r){i(t,o,r),z(e,o,null),n=!0},p(t,o){const i={};512&o&&(i.theme=t[9]),e.$set(i)},i(t){n||(h(e.$$.fragment,t),n=!0)},o(t){f(e.$$.fragment,t),n=!1},d(t){t&&x(o),j(e)}}}function O(t){let o,e,n;return e=new C({props:{size:"s",theme:t[9],text:""}}),{c(){o=c("span"),k(e.$$.fragment),y(o,"class","mc-button__icon")},m(t,r){i(t,o,r),z(e,o,null),n=!0},p(t,o){const i={};512&o&&(i.theme=t[9]),e.$set(i)},i(t){n||(h(e.$$.fragment,t),n=!0)},o(t){f(e.$$.fragment,t),n=!1},d(t){t&&x(o),j(e)}}}function S(t){let o;return{c(){o=c("slot"),y(o,"name","icon")},m(t,e){i(t,o,e)},p:d,i:d,o:d,d(t){t&&x(o)}}}function B(t){let o,e;return o=new C({props:{size:"m",theme:t[9],text:""}}),{c(){k(o.$$.fragment)},m(t,i){z(o,t,i),e=!0},p(t,e){const i={};512&e&&(i.theme=t[9]),o.$set(i)},i(t){e||(h(o.$$.fragment,t),e=!0)},o(t){f(o.$$.fragment,t),e=!1},d(t){j(o,t)}}}function D(t){let o,e,n,r;const m=[J,H],l=[];function d(t,o){return t[11]&&"right"===t[10]?0:1}return e=d(t),n=l[e]=m[e](t),{c(){o=c("span"),n.c(),y(o,"class","mc-button__icon")},m(t,n){i(t,o,n),l[e].m(o,null),r=!0},p(t,i){let r=e;e=d(t),e===r?l[e].p(t,i):(v(),f(l[r],1,1,(()=>{l[r]=null})),g(),n=l[e],n?n.p(t,i):(n=l[e]=m[e](t),n.c()),h(n,1),n.m(o,null))},i(t){r||(h(n),r=!0)},o(t){f(n),r=!1},d(t){t&&x(o),l[e].d()}}}function H(t){let o;return{c(){o=c("slot"),y(o,"name","icon")},m(t,e){i(t,o,e)},p:d,i:d,o:d,d(t){t&&x(o)}}}function J(t){let o,e;return o=new C({props:{size:"s",theme:t[9],text:""}}),{c(){k(o.$$.fragment)},m(t,i){z(o,t,i),e=!0},p(t,e){const i={};512&e&&(i.theme=t[9]),o.$set(i)},i(t){e||(h(o.$$.fragment,t),e=!0)},o(t){f(o.$$.fragment,t),e=!1},d(t){j(o,t)}}}function T(t){let o,e,n,r,w,_,$,y,k,z="left"===t[4]&&L(t);const j=[A,R],q=[];function E(t,o){return"only"===t[4]?0:1}n=E(t),r=q[n]=j[n](t);let C="right"===t[4]&&D(t),M=[{type:t[6]},{class:_=t[13](t[1],t[0],t[2],t[3])+" "+t[8]},{disabled:t[5]},t[7]],N={};for(let t=0;t<M.length;t+=1)N=m(N,M[t]);return{c(){o=c("button"),z&&z.c(),e=l(),r.c(),w=l(),C&&C.c(),this.c=d,s(o,N),b(o,"mc-button--square","only"===t[4])},m(r,m){i(r,o,m),z&&z.m(o,null),a(o,e),q[n].m(o,null),a(o,w),C&&C.m(o,null),o.autofocus&&o.focus(),$=!0,y||(k=u(t[12].call(null,o)),y=!0)},p(t,[i]){"left"===t[4]?z?(z.p(t,i),16&i&&h(z,1)):(z=L(t),z.c(),h(z,1),z.m(o,e)):z&&(v(),f(z,1,1,(()=>{z=null})),g());let m=n;n=E(t),n===m?q[n].p(t,i):(v(),f(q[m],1,1,(()=>{q[m]=null})),g(),r=q[n],r?r.p(t,i):(r=q[n]=j[n](t),r.c()),h(r,1),r.m(o,w)),"right"===t[4]?C?(C.p(t,i),16&i&&h(C,1)):(C=D(t),C.c(),h(C,1),C.m(o,null)):C&&(v(),f(C,1,1,(()=>{C=null})),g()),s(o,N=p(M,[(!$||64&i)&&{type:t[6]},(!$||271&i&&_!==(_=t[13](t[1],t[0],t[2],t[3])+" "+t[8]))&&{class:_},(!$||32&i)&&{disabled:t[5]},128&i&&t[7]])),b(o,"mc-button--square","only"===t[4])},i(t){$||(h(z),h(r),h(C),$=!0)},o(t){f(z),f(r),f(C),$=!1},d(t){t&&x(o),z&&z.d(),q[n].d(),C&&C.d(),y=!1,k()}}}function G(t,o,e){let i,n,r,c,l,d;const s=["bordered","theme","size","full","iconmode","disabled","responsivesize","responsivewidth","type","loader"];let b=w(o,s);var a,u,h;let{bordered:f=!1}=o,{theme:g}=o,{size:p="m"}=o,{full:x=!1}=o,{iconmode:y}=o,{disabled:v=!1}=o,{responsivesize:k}=o,{responsivewidth:z}=o,{type:j="button"}=o,{loader:q}=o;const C=E(_());return t.$$set=t=>{e(22,o=m(m({},o),$(t))),e(21,b=w(o,s)),"bordered"in t&&e(0,f=t.bordered),"theme"in t&&e(1,g=t.theme),"size"in t&&e(2,p=t.size),"full"in t&&e(3,x=t.full),"iconmode"in t&&e(4,y=t.iconmode),"disabled"in t&&e(5,v=t.disabled),"responsivesize"in t&&e(14,k=t.responsivesize),"responsivewidth"in t&&e(15,z=t.responsivewidth),"type"in t&&e(6,j=t.type),"loader"in t&&e(16,q=t.loader)},t.$$.update=()=>{65536&t.$$.dirty&&e(20,i=q?JSON.parse(q):void 0),1179648&t.$$.dirty&&e(11,n=null!==e(17,a=null==i?void 0:i.enabled)&&void 0!==a&&a),1310720&t.$$.dirty&&e(10,r=null!==e(18,u=null==i?void 0:i.position)&&void 0!==u?u:"left"),1572864&t.$$.dirty&&e(9,c=null!==e(19,h=null==i?void 0:i.theme)&&void 0!==h?h:"primary"),e(8,l=o.class),e(7,d=Object.assign({},b)),128&t.$$.dirty&&delete d.class},o=$(o),[f,g,p,x,y,v,j,d,l,c,r,n,C,function(t,o,e,i){const n=["mc-button"],r=function(t,o){if(!o&&!t)return"";const e=o?"bordered":"solid";return t?`mc-button--${e}-${t}`:`mc-button--${e}`}(t,o);return r&&n.push(r),e&&n.push(`mc-button--${e}`),i?n.push("mc-button--full"):n.push("mc-button--fit"),"only"===y&&n.push("mc-button--square"),k&&n.push(`mc-button--${k}`),z&&n.push(`mc-button--${z}`),n.join(" ")},k,z,q,a,u,h,i]}class I extends t{constructor(t){super();const m=document.createElement("style");m.textContent='.mc-button{margin:0;-webkit-box-shadow:none;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;color:#ffffff;background-color:#120949;font-family:"LeroyMerlin", sans-serif;font-weight:600;font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem;cursor:pointer;border-radius:4px;text-align:center;border:2px solid transparent;-webkit-transition:all ease 200ms;-o-transition:all ease 200ms;transition:all ease 200ms;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;vertical-align:middle;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-sizing:border-box;box-sizing:border-box;fill:currentColor}.mc-button.is-hover,.mc-button:hover{background-color:#161cb6;color:#ffffff}.mc-button.is-active,.mc-button:active{background-color:#161cb6}.mc-button:disabled,.mc-button.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button .mc-button__icon:first-child,.mc-button .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button.is-focus,.mc-button:focus{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc}.mc-button--s{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s .mc-button__icon:first-child,.mc-button--s .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m .mc-button__icon:first-child,.mc-button--m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l .mc-button__icon{width:2rem;height:2rem}.mc-button--l .mc-button__icon:first-child,.mc-button--l .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full{width:-webkit-fill-available;width:-moz-available;width:stretch}}.mc-button--square{-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:0;padding:0}.mc-button__icon{-ms-flex-negative:0;flex-shrink:0}.mc-button__icon:last-child{margin-left:0.5rem;margin-right:-0.25rem}.mc-button__icon:first-child{margin-right:0.5rem;margin-left:-0.25rem}.mc-button__icon:only-child{margin:0}.mc-button__label{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;pointer-events:none}.mc-button--solid-primary-02{background-color:#ff5800}.mc-button--solid-primary-02.is-hover,.mc-button--solid-primary-02:hover{background-color:#b83f00}.mc-button--solid-primary-02.is-active,.mc-button--solid-primary-02:active{background-color:#421700}.mc-button--solid-primary-02:disabled,.mc-button--solid-primary-02.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--solid-neutral{background-color:#333333}.mc-button--solid-neutral.is-hover,.mc-button--solid-neutral:hover{background-color:#191919}.mc-button--solid-neutral.is-active,.mc-button--solid-neutral:active{background-color:#333333}.mc-button--solid-neutral:disabled,.mc-button--solid-neutral.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--solid-danger{background-color:#c61112}.mc-button--solid-danger.is-hover,.mc-button--solid-danger:hover{background-color:#8c0003}.mc-button--solid-danger.is-active,.mc-button--solid-danger:active{background-color:#8c0003}.mc-button--solid-danger:disabled,.mc-button--solid-danger.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered{color:#120949;border-color:#120949;background-color:#ffffff}.mc-button--bordered.is-hover,.mc-button--bordered:hover{background-color:#e5e7fa;color:#161cb6}.mc-button--bordered.is-active,.mc-button--bordered:active{background-color:#b8bef4;color:#130f7b}.mc-button--bordered.is-active,.mc-button--bordered:active{background-color:#b8bef4;color:#130f7b}.mc-button--bordered:disabled,.mc-button--bordered.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-primary-02{color:#ff5800;border-color:#ff5800;background-color:#ffffff}.mc-button--bordered-primary-02.is-hover,.mc-button--bordered-primary-02:hover{background-color:#ffe1d1;color:#ff5800}.mc-button--bordered-primary-02.is-active,.mc-button--bordered-primary-02:active{background-color:#ffab80}.mc-button--bordered-primary-02:disabled,.mc-button--bordered-primary-02.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-neutral{color:#333333;border-color:#333333;background-color:#ffffff}.mc-button--bordered-neutral.is-hover,.mc-button--bordered-neutral:hover{background-color:#e6e6e6;color:#333333}.mc-button--bordered-neutral.is-active,.mc-button--bordered-neutral:active{background-color:#cccccc}.mc-button--bordered-neutral:disabled,.mc-button--bordered-neutral.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-danger{color:#c61112;border-color:#c61112;background-color:#ffffff}.mc-button--bordered-danger.is-hover,.mc-button--bordered-danger:hover{background-color:#fdeaea;color:#8c0003}.mc-button--bordered-danger.is-active,.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger.is-active,.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger:disabled,.mc-button--bordered-danger.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}@media screen and (min-width: 680px){.mc-button--s\\@from-m{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-m .mc-button__icon:first-child,.mc-button--s\\@from-m .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-m{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-m .mc-button__icon:first-child,.mc-button--m\\@from-m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-m{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-m .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-m .mc-button__icon:first-child,.mc-button--l\\@from-m .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-m{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-m{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-m{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1024px){.mc-button--s\\@from-l{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-l .mc-button__icon:first-child,.mc-button--s\\@from-l .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-l{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-l .mc-button__icon:first-child,.mc-button--m\\@from-l .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-l{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-l .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-l .mc-button__icon:first-child,.mc-button--l\\@from-l .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-l{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-l{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-l{width:-webkit-fill-available;width:-moz-available;width:stretch}}.mc-button--square{padding:0}}@media screen and (min-width: 1280px){.mc-button--s\\@from-xl{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xl .mc-button__icon:first-child,.mc-button--s\\@from-xl .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl .mc-button__icon:first-child,.mc-button--m\\@from-xl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-xl{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xl .mc-button__icon:first-child,.mc-button--l\\@from-xl .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-xl{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-xl{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-xl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1920px){.mc-button--s\\@from-xxl{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xxl .mc-button__icon:first-child,.mc-button--s\\@from-xxl .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl .mc-button__icon:first-child,.mc-button--m\\@from-xxl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-xxl{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xxl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xxl .mc-button__icon:first-child,.mc-button--l\\@from-xxl .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-xxl{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-xxl{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-xxl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}.mc-button__icon{pointer-events:none}',this.shadowRoot.appendChild(m),o(this,{target:this.shadowRoot,props:e(this.attributes),customElement:!0},G,T,r,{bordered:0,theme:1,size:2,full:3,iconmode:4,disabled:5,responsivesize:14,responsivewidth:15,type:6,loader:16},null),t&&(t.target&&i(t.target,this,t.anchor),t.props&&(this.$set(t.props),n()))}static get observedAttributes(){return["bordered","theme","size","full","iconmode","disabled","responsivesize","responsivewidth","type","loader"]}get bordered(){return this.$$.ctx[0]}set bordered(t){this.$$set({bordered:t}),n()}get theme(){return this.$$.ctx[1]}set theme(t){this.$$set({theme:t}),n()}get size(){return this.$$.ctx[2]}set size(t){this.$$set({size:t}),n()}get full(){return this.$$.ctx[3]}set full(t){this.$$set({full:t}),n()}get iconmode(){return this.$$.ctx[4]}set iconmode(t){this.$$set({iconmode:t}),n()}get disabled(){return this.$$.ctx[5]}set disabled(t){this.$$set({disabled:t}),n()}get responsivesize(){return this.$$.ctx[14]}set responsivesize(t){this.$$set({responsivesize:t}),n()}get responsivewidth(){return this.$$.ctx[15]}set responsivewidth(t){this.$$set({responsivewidth:t}),n()}get type(){return this.$$.ctx[6]}set type(t){this.$$set({type:t}),n()}get loader(){return this.$$.ctx[16]}set loader(t){this.$$set({loader:t}),n()}}export{I as default};
2
- //# sourceMappingURL=ButtonSlot.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ButtonSlot.js","sources":["../../../../src/components/button/ButtonSlot.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import { get_current_component } from 'svelte/internal';\n import { createEventForwarder } from '../../utilities/EventForward';\n import Loader from '../loader/Loader.nested.svelte';\n import type {\n ButtonIconMode,\n ButtonSize,\n ButtonTheme,\n ButtonResponsiveSize,\n ButtonResponsiveWidth,\n ButtonType,\n ButtonLoader,\n } from './button.types';\n\n export let bordered = false;\n export let theme: ButtonTheme | undefined = undefined;\n export let size: ButtonSize = 'm';\n export let full = false;\n export let iconmode: ButtonIconMode | undefined;\n export let disabled = false;\n export let responsivesize: ButtonResponsiveSize = undefined;\n export let responsivewidth: ButtonResponsiveWidth = undefined;\n export let type: ButtonType = 'button';\n export let loader: string;\n\n const forwardEvents = createEventForwarder(get_current_component());\n\n $: loaderOpts = loader ? (JSON.parse(loader) as ButtonLoader) : undefined;\n $: isLoading = loaderOpts?.enabled ?? false;\n $: loaderPosition = loaderOpts?.position ?? 'left';\n $: loaderTheme = loaderOpts?.theme ?? 'primary';\n $: userClass = $$props.class;\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n\n function getAppearanceClass(theme: ButtonTheme, isBordered: boolean): string {\n if (!isBordered && !theme) {\n return '';\n }\n\n const type = isBordered ? 'bordered' : 'solid';\n\n if (theme) {\n return `mc-button--${type}-${theme}`;\n }\n return `mc-button--${type}`;\n }\n\n function getClasses(\n theme: ButtonTheme,\n isBordered: boolean,\n size: ButtonSize,\n isFull: boolean,\n ): string {\n const classes = ['mc-button'];\n\n const appearanceClass = getAppearanceClass(theme, isBordered);\n if (appearanceClass) {\n classes.push(appearanceClass);\n }\n\n if (size) {\n classes.push(`mc-button--${size}`);\n }\n\n if (isFull) {\n classes.push(`mc-button--full`);\n } else {\n classes.push(`mc-button--fit`);\n }\n\n if (iconmode === 'only') {\n classes.push('mc-button--square');\n }\n\n if (responsivesize) {\n classes.push(`mc-button--${responsivesize}`);\n }\n\n if (responsivewidth) {\n classes.push(`mc-button--${responsivewidth}`);\n }\n\n return classes.join(' ');\n }\n</script>\n\n<button\n use:forwardEvents\n {type}\n class=\"{getClasses(theme, bordered, size, full)} {userClass}\"\n class:mc-button--square={iconmode === 'only'}\n {disabled}\n {...attributes}\n>\n {#if iconmode === 'left'}\n <span class=\"mc-button__icon\">\n {#if isLoading && loaderPosition === 'left'}\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n {:else}\n <slot name=\"icon\" />\n {/if}\n </span>\n {/if}\n\n {#if iconmode === 'only'}\n <span class=\"mc-button__icon\">\n {#if isLoading}\n <Loader size=\"m\" theme={loaderTheme} text=\"\" />\n {:else}\n <slot name=\"icon\" />\n {/if}\n </span>\n {:else}\n {#if isLoading && loaderPosition === 'left' && !iconmode}\n <span class=\"mc-button__icon\">\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n </span>\n {/if}\n <span class=\"mc-button__label\"><slot /></span>\n {#if isLoading && loaderPosition === 'right' && !iconmode}\n <span class=\"mc-button__icon\">\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n </span>\n {/if}\n {/if}\n\n {#if iconmode === 'right'}\n <span class=\"mc-button__icon\">\n {#if isLoading && loaderPosition === 'right'}\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n {:else}\n <slot name=\"icon\" />\n {/if}\n </span>\n {/if}\n</button>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import '@mozaic-ds/styles/components/c.button';\n\n .mc-button__icon {\n pointer-events: none;\n }\n</style>\n"],"names":["ctx","insert","target","span","anchor","slot","if_block0","create_if_block_5","if_block1","create_if_block_4","create_if_block_6","if_block2","create_if_block","toggle_class","button","class","button_class_value","_a","_b","_c","bordered","$$props","theme","size","full","iconmode","disabled","responsivesize","responsivewidth","type","loader","forwardEvents","createEventForwarder","get_current_component","$$invalidate","loaderOpts","JSON","parse","undefined","isLoading","enabled","loaderPosition","position","loaderTheme","userClass","attributes","Object","assign","$$restProps","isBordered","isFull","classes","appearanceClass","getAppearanceClass","push","join"],"mappings":"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"}
@@ -1,148 +0,0 @@
1
- <svelte:options tag={null} />
2
-
3
- <script lang="ts">
4
- import { get_current_component } from 'svelte/internal';
5
- import { createEventForwarder } from '../../utilities/EventForward';
6
- import Loader from '../loader/Loader.nested.svelte';
7
- import type {
8
- ButtonIconMode,
9
- ButtonSize,
10
- ButtonTheme,
11
- ButtonResponsiveSize,
12
- ButtonResponsiveWidth,
13
- ButtonType,
14
- ButtonLoader,
15
- } from './button.types';
16
-
17
- export let bordered = false;
18
- export let theme: ButtonTheme | undefined = undefined;
19
- export let size: ButtonSize = 'm';
20
- export let full = false;
21
- export let iconmode: ButtonIconMode | undefined;
22
- export let disabled = false;
23
- export let responsivesize: ButtonResponsiveSize = undefined;
24
- export let responsivewidth: ButtonResponsiveWidth = undefined;
25
- export let type: ButtonType = 'button';
26
- export let loader: string;
27
-
28
- const forwardEvents = createEventForwarder(get_current_component());
29
-
30
- $: loaderOpts = loader ? (JSON.parse(loader) as ButtonLoader) : undefined;
31
- $: isLoading = loaderOpts?.enabled ?? false;
32
- $: loaderPosition = loaderOpts?.position ?? 'left';
33
- $: loaderTheme = loaderOpts?.theme ?? 'primary';
34
- $: userClass = $$props.class;
35
- $: attributes = { ...$$restProps };
36
- $: delete attributes.class;
37
-
38
- function getAppearanceClass(theme: ButtonTheme, isBordered: boolean): string {
39
- if (!isBordered && !theme) {
40
- return '';
41
- }
42
-
43
- const type = isBordered ? 'bordered' : 'solid';
44
-
45
- if (theme) {
46
- return `mc-button--${type}-${theme}`;
47
- }
48
- return `mc-button--${type}`;
49
- }
50
-
51
- function getClasses(
52
- theme: ButtonTheme,
53
- isBordered: boolean,
54
- size: ButtonSize,
55
- isFull: boolean,
56
- ): string {
57
- const classes = ['mc-button'];
58
-
59
- const appearanceClass = getAppearanceClass(theme, isBordered);
60
- if (appearanceClass) {
61
- classes.push(appearanceClass);
62
- }
63
-
64
- if (size) {
65
- classes.push(`mc-button--${size}`);
66
- }
67
-
68
- if (isFull) {
69
- classes.push(`mc-button--full`);
70
- } else {
71
- classes.push(`mc-button--fit`);
72
- }
73
-
74
- if (iconmode === 'only') {
75
- classes.push('mc-button--square');
76
- }
77
-
78
- if (responsivesize) {
79
- classes.push(`mc-button--${responsivesize}`);
80
- }
81
-
82
- if (responsivewidth) {
83
- classes.push(`mc-button--${responsivewidth}`);
84
- }
85
-
86
- return classes.join(' ');
87
- }
88
- </script>
89
-
90
- <button
91
- use:forwardEvents
92
- {type}
93
- class="{getClasses(theme, bordered, size, full)} {userClass}"
94
- class:mc-button--square={iconmode === 'only'}
95
- {disabled}
96
- {...attributes}
97
- >
98
- {#if iconmode === 'left'}
99
- <span class="mc-button__icon">
100
- {#if isLoading && loaderPosition === 'left'}
101
- <Loader size="s" theme={loaderTheme} text="" />
102
- {:else}
103
- <slot name="icon" />
104
- {/if}
105
- </span>
106
- {/if}
107
-
108
- {#if iconmode === 'only'}
109
- <span class="mc-button__icon">
110
- {#if isLoading}
111
- <Loader size="m" theme={loaderTheme} text="" />
112
- {:else}
113
- <slot name="icon" />
114
- {/if}
115
- </span>
116
- {:else}
117
- {#if isLoading && loaderPosition === 'left' && !iconmode}
118
- <span class="mc-button__icon">
119
- <Loader size="s" theme={loaderTheme} text="" />
120
- </span>
121
- {/if}
122
- <span class="mc-button__label"><slot /></span>
123
- {#if isLoading && loaderPosition === 'right' && !iconmode}
124
- <span class="mc-button__icon">
125
- <Loader size="s" theme={loaderTheme} text="" />
126
- </span>
127
- {/if}
128
- {/if}
129
-
130
- {#if iconmode === 'right'}
131
- <span class="mc-button__icon">
132
- {#if isLoading && loaderPosition === 'right'}
133
- <Loader size="s" theme={loaderTheme} text="" />
134
- {:else}
135
- <slot name="icon" />
136
- {/if}
137
- </span>
138
- {/if}
139
- </button>
140
-
141
- <style lang="scss">
142
- @import '@mozaic-ds/styles/settings-tools/_all-settings';
143
- @import '@mozaic-ds/styles/components/c.button';
144
-
145
- .mc-button__icon {
146
- pointer-events: none;
147
- }
148
- </style>
@@ -1,10 +0,0 @@
1
- import type { Story, Meta } from '@storybook/html';
2
- declare const _default: Meta<import("@storybook/html").Args>;
3
- export default _default;
4
- export declare const Solid: Story<import("@storybook/html").Args>;
5
- export declare const Bordered: Story<import("@storybook/html").Args>;
6
- export declare const IconLeft: Story<import("@storybook/html").Args>;
7
- export declare const IconRight: Story<import("@storybook/html").Args>;
8
- export declare const IconOnly: Story<import("@storybook/html").Args>;
9
- export declare const WithLoading: Story<import("@storybook/html").Args>;
10
- //# sourceMappingURL=ButtonSlot.stories.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ButtonSlot.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/button/ButtonSlot.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;;AAGnD,wBA2EU;AA8FV,eAAO,MAAM,KAAK,uCAAoB,CAAC;AAGvC,eAAO,MAAM,QAAQ,uCAAoB,CAAC;AAK1C,eAAO,MAAM,QAAQ,uCAAoB,CAAC;AAa1C,eAAO,MAAM,SAAS,uCAAoB,CAAC;AAa3C,eAAO,MAAM,QAAQ,uCAAoB,CAAC;AAkB1C,eAAO,MAAM,WAAW,uCAAoB,CAAC"}