@mozaic-ds/web-components 0.18.0 → 0.20.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.
- package/package.json +1 -1
- package/public/adeo/bundle.js +0 -5
- package/public/adeo/components/fileuploader/FileUploader.js +1 -1
- package/public/adeo/components/fileuploader/FileUploader.js.map +1 -1
- package/public/adeo/components/fileuploader/FileUploader.svelte +2 -0
- package/public/adeo/components/menu/Menu.js +1 -1
- package/public/adeo/components/menu/Menu.js.map +1 -1
- package/public/adeo/components/menu/Menu.svelte +3 -0
- package/public/adeo/components/segmentedcontrol/SegmentedControl.js +1 -1
- package/public/adeo/components/segmentedcontrol/SegmentedControl.js.map +1 -1
- package/public/adeo/components/segmentedcontrol/SegmentedControl.svelte +6 -1
- package/public/adeo/components/segmentedcontrol/segmentedControl.types.d.ts +1 -0
- package/public/adeo/components/segmentedcontrol/segmentedControl.types.d.ts.map +1 -1
- package/public/adeo/components/stepper/Stepper.js +1 -1
- package/public/adeo/components/stepper/Stepper.js.map +1 -1
- package/public/adeo/components/stepper/Stepper.svelte +7 -4
- package/public/adeo/components/tabs/Tabs.js +1 -1
- package/public/adeo/components/tabs/Tabs.js.map +1 -1
- package/public/adeo/components/tabs/Tabs.svelte +15 -0
- package/public/adeo/main.d.ts +0 -1
- package/public/adeo/main.d.ts.map +1 -1
- package/public/adeo/utilities/components/segmentedcontrol/segmentedControl.types.d.ts +1 -0
- package/public/adeo/utilities/components/segmentedcontrol/segmentedControl.types.d.ts.map +1 -1
- package/public/adeo/utilities/main.d.ts +0 -1
- package/public/adeo/utilities/main.d.ts.map +1 -1
- package/public/adeo/utilities/stories/fileuploader/FileUploader.stories.d.ts.map +1 -1
- package/public/adeo/utilities/stories/segmentedcontrol/segmentedcontrol.stories.d.ts.map +1 -1
- package/public/adeo/utilities/stories/stepper/Stepper.stories.d.ts.map +1 -1
- package/public/bricoman/bundle.js +0 -5
- package/public/bricoman/components/fileuploader/FileUploader.js +1 -1
- package/public/bricoman/components/fileuploader/FileUploader.js.map +1 -1
- package/public/bricoman/components/fileuploader/FileUploader.svelte +2 -0
- package/public/bricoman/components/menu/Menu.js +1 -1
- package/public/bricoman/components/menu/Menu.js.map +1 -1
- package/public/bricoman/components/menu/Menu.svelte +3 -0
- package/public/bricoman/components/segmentedcontrol/SegmentedControl.js +1 -1
- package/public/bricoman/components/segmentedcontrol/SegmentedControl.js.map +1 -1
- package/public/bricoman/components/segmentedcontrol/SegmentedControl.svelte +6 -1
- package/public/bricoman/components/segmentedcontrol/segmentedControl.types.d.ts +1 -0
- package/public/bricoman/components/segmentedcontrol/segmentedControl.types.d.ts.map +1 -1
- package/public/bricoman/components/stepper/Stepper.js +1 -1
- package/public/bricoman/components/stepper/Stepper.js.map +1 -1
- package/public/bricoman/components/stepper/Stepper.svelte +7 -4
- package/public/bricoman/components/tabs/Tabs.js +1 -1
- package/public/bricoman/components/tabs/Tabs.js.map +1 -1
- package/public/bricoman/components/tabs/Tabs.svelte +15 -0
- package/public/bricoman/main.d.ts +0 -1
- package/public/bricoman/main.d.ts.map +1 -1
- package/public/bricoman/utilities/components/segmentedcontrol/segmentedControl.types.d.ts +1 -0
- package/public/bricoman/utilities/components/segmentedcontrol/segmentedControl.types.d.ts.map +1 -1
- package/public/bricoman/utilities/main.d.ts +0 -1
- package/public/bricoman/utilities/main.d.ts.map +1 -1
- package/public/bricoman/utilities/stories/fileuploader/FileUploader.stories.d.ts.map +1 -1
- package/public/bricoman/utilities/stories/segmentedcontrol/segmentedcontrol.stories.d.ts.map +1 -1
- package/public/bricoman/utilities/stories/stepper/Stepper.stories.d.ts.map +1 -1
- package/public/bundle.js +0 -5
- package/public/components/fileuploader/FileUploader.js +1 -1
- package/public/components/fileuploader/FileUploader.js.map +1 -1
- package/public/components/fileuploader/FileUploader.svelte +2 -0
- package/public/components/menu/Menu.js +1 -1
- package/public/components/menu/Menu.js.map +1 -1
- package/public/components/menu/Menu.svelte +3 -0
- package/public/components/segmentedcontrol/SegmentedControl.js +1 -1
- package/public/components/segmentedcontrol/SegmentedControl.js.map +1 -1
- package/public/components/segmentedcontrol/SegmentedControl.svelte +6 -1
- package/public/components/segmentedcontrol/segmentedControl.types.d.ts +1 -0
- package/public/components/segmentedcontrol/segmentedControl.types.d.ts.map +1 -1
- package/public/components/stepper/Stepper.js +1 -1
- package/public/components/stepper/Stepper.js.map +1 -1
- package/public/components/stepper/Stepper.svelte +7 -4
- package/public/components/tabs/Tabs.js +1 -1
- package/public/components/tabs/Tabs.js.map +1 -1
- package/public/components/tabs/Tabs.svelte +15 -0
- package/public/main.d.ts +0 -1
- package/public/main.d.ts.map +1 -1
- package/public/utilities/components/segmentedcontrol/segmentedControl.types.d.ts +1 -0
- package/public/utilities/components/segmentedcontrol/segmentedControl.types.d.ts.map +1 -1
- package/public/utilities/main.d.ts +0 -1
- package/public/utilities/main.d.ts.map +1 -1
- package/public/utilities/stories/fileuploader/FileUploader.stories.d.ts.map +1 -1
- package/public/utilities/stories/segmentedcontrol/segmentedcontrol.stories.d.ts.map +1 -1
- package/public/utilities/stories/stepper/Stepper.stories.d.ts.map +1 -1
- package/public/adeo/components/button/ButtonSlot.js +0 -2
- package/public/adeo/components/button/ButtonSlot.js.map +0 -1
- package/public/adeo/components/buttonslot/ButtonSlot.svelte +0 -148
- package/public/adeo/utilities/stories/button/ButtonSlot.stories.d.ts +0 -10
- package/public/adeo/utilities/stories/button/ButtonSlot.stories.d.ts.map +0 -1
- package/public/bricoman/components/button/ButtonSlot.js +0 -2
- package/public/bricoman/components/button/ButtonSlot.js.map +0 -1
- package/public/bricoman/components/buttonslot/ButtonSlot.svelte +0 -148
- package/public/bricoman/utilities/stories/button/ButtonSlot.stories.d.ts +0 -10
- package/public/bricoman/utilities/stories/button/ButtonSlot.stories.d.ts.map +0 -1
- package/public/components/button/ButtonSlot.js +0 -2
- package/public/components/button/ButtonSlot.js.map +0 -1
- package/public/components/buttonslot/ButtonSlot.svelte +0 -148
- package/public/utilities/stories/button/ButtonSlot.stories.d.ts +0 -10
- package/public/utilities/stories/button/ButtonSlot.stories.d.ts.map +0 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{S as e,i as t,a as r,b as i,f as s,s as p,c,e as
|
|
1
|
+
import{S as e,i as t,a as r,b as i,f as s,s as p,c,e as n,n as a,h as o,j as m,l,p as d,q as _,Q as f,r as b,v as x,w as h,x as u,d as g,t as k,L as w,m as v,o as $}from"../../index-d12e76e8.js";import{E as y}from"../../EventHandler-f7ee47ca.js";function z(e,t,r){const i=e.slice();return i[11]=t[r],i[13]=r,i}function C(e){let t,r,s=e[13]+1+"";return{c(){t=n("span"),r=k(s)},m(e,s){i(e,t,s),l(t,r)},d(e){e&&_(t)}}}function j(e){let t;return{c(){t=n("div"),t.innerHTML='<navigation-notification-available-16px name="NotificationAvailable16" size="100%"></navigation-notification-available-16px>',o(t,"class","mc-stepper__icon")},m(e,r){i(e,t,r)},d(e){e&&_(t)}}}function E(e){let t,r,s,p,c,a,m,d,f,b,x,h,u,y,z=e[5](e[1],e[13],e[3])+"",E=e[11].label+"";function L(e,t){return 8&t&&(s=null),null==s&&(s=!!e[4](e[13],e[3])),s?j:e[11].isCurrent?C:void 0}let A=L(e,-1),D=A&&A(e);function H(){return e[8](e[11])}return{c(){t=n("li"),r=n("div"),D&&D.c(),p=g(),c=n("div"),a=n("span"),m=k(z),d=g(),f=n("span"),b=k(E),x=g(),o(r,"class","mc-stepper__indicator"),o(r,"aria-hidden","true"),o(a,"class","mc-stepper__title"),o(f,"class","mc-stepper__label"),o(c,"class","mc-stepper__detail"),o(t,"class",h="mc-stepper__item "+(e[11].isCurrent?"mc-stepper__item--current":"")+" "+(e[4](e[13],e[3])?"mc-stepper__item--validated":"")),w(t,"--steps",e[3].length),w(t,"--current",e[13]+1)},m(e,s){i(e,t,s),l(t,r),D&&D.m(r,null),l(t,p),l(t,c),l(c,a),l(a,m),l(c,d),l(c,f),l(f,b),l(t,x),u||(y=v(t,"click",H),u=!0)},p(i,s){A!==(A=L(e=i,s))&&(D&&D.d(1),D=A&&A(e),D&&(D.c(),D.m(r,null))),10&s&&z!==(z=e[5](e[1],e[13],e[3])+"")&&$(m,z),8&s&&E!==(E=e[11].label+"")&&$(b,E),8&s&&h!==(h="mc-stepper__item "+(e[11].isCurrent?"mc-stepper__item--current":"")+" "+(e[4](e[13],e[3])?"mc-stepper__item--validated":""))&&o(t,"class",h),8&s&&w(t,"--steps",e[3].length)},d(e){e&&_(t),D&&D.d(),u=!1,y()}}}function L(e){let t,r,s,p=e[3],b=[];for(let t=0;t<p.length;t+=1)b[t]=E(z(e,p,t));let x=[{class:s="mc-stepper "+(e[0]?"mc-stepper--compact":"")+" "+(e[3].length>3?"mc-stepper--shrinked":"")},{"aria-label":"accessibilityLabels.stepperDescription"},e[2]],h={};for(let e=0;e<x.length;e+=1)h=c(h,x[e]);return{c(){t=n("nav"),r=n("ol");for(let e=0;e<b.length;e+=1)b[e].c();this.c=a,o(r,"class","mc-stepper__list"),m(t,h)},m(e,s){i(e,t,s),l(t,r);for(let e=0;e<b.length;e+=1)b[e]&&b[e].m(r,null)},p(e,[i]){if(122&i){let t;for(p=e[3],t=0;t<p.length;t+=1){const s=z(e,p,t);b[t]?b[t].p(s,i):(b[t]=E(s),b[t].c(),b[t].m(r,null))}for(;t<b.length;t+=1)b[t].d(1);b.length=p.length}m(t,h=d(x,[9&i&&s!==(s="mc-stepper "+(e[0]?"mc-stepper--compact":"")+" "+(e[3].length>3?"mc-stepper--shrinked":""))&&{class:s},{"aria-label":"accessibilityLabels.stepperDescription"},4&i&&e[2]]))},i:a,o:a,d(e){e&&_(t),f(b,e)}}}function A(e,t,r){let i,s;const p=["steps","compact","steptitleprefix"];let n=b(t,p),{steps:a}=t,{compact:o=!1}=t,{steptitleprefix:m}=t,l=new y(x(),h());function d(e){l.dispatch("step-changed",e)}return e.$$set=e=>{t=c(c({},t),u(e)),r(10,n=b(t,p)),"steps"in e&&r(7,a=e.steps),"compact"in e&&r(0,o=e.compact),"steptitleprefix"in e&&r(1,m=e.steptitleprefix)},e.$$.update=()=>{128&e.$$.dirty&&r(3,i=a?JSON.parse(a):[]),r(2,s=Object.assign({},n)),4&e.$$.dirty&&delete s.class},[o,m,s,i,function(e,t){return e<t.findIndex((e=>e.isCurrent))},function(e,t,r){return`${e?`${e} `:""}${t+1} / ${r.length}`},d,a,e=>d(e)]}class D extends e{constructor(e){super();const c=document.createElement("style");c.textContent='.mc-stepper{width:100%}.mc-stepper__list{display:-webkit-box;display:-ms-flexbox;display:flex;padding-left:0;margin-bottom:0;margin-top:0}.mc-stepper__item,.mc-stepper__link{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mc-stepper__item{-webkit-box-flex:1;-ms-flex:1;flex:1;position:relative}.mc-stepper__item::before,.mc-stepper__item::after{background-color:#999999;content:"";height:0.125rem;position:absolute;top:11px;width:calc(50% - 1.25rem);z-index:1}.mc-stepper__item::before{border-top-right-radius:1px;border-bottom-right-radius:1px;left:0}.mc-stepper__item::after{border-top-left-radius:1px;border-bottom-left-radius:1px;right:0}.mc-stepper__item:first-child::before,.mc-stepper__item:last-child::after{content:none}.mc-stepper__item--current .mc-stepper__indicator,.mc-stepper__item--validated .mc-stepper__indicator{border-color:#46a610}.mc-stepper__item--current .mc-stepper__detail,.mc-stepper__item--validated .mc-stepper__detail{font-weight:600}.mc-stepper__item--current::before{background-color:#46a610}.mc-stepper__item--current .mc-stepper__indicator{background-color:#46a610;color:#ffffff}.mc-stepper__item--current .mc-stepper__label{color:#000000}.mc-stepper__item--validated::before,.mc-stepper__item--validated:not(.mc-stepper__item--current)::after{background-color:#46a610}.mc-stepper__link{height:100%;text-decoration:none;width:100%}.mc-stepper__link:hover .mc-stepper__label,.mc-stepper__link:focus .mc-stepper__label{color:#46a610}.mc-stepper__indicator{font-size:0.875rem;line-height:1.1428571429;font-weight:600;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:2px solid #999999;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;height:1.5rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin-bottom:0.5rem;position:relative;width:1.5rem;z-index:2}.mc-stepper__icon{fill:#46a610;max-width:100%}.mc-stepper__detail{font-size:0.875rem;line-height:1.2857142857;color:#666666;text-align:center;width:auto}.mc-stepper__title{display:none;color:#46a610}.mc-stepper--compact .mc-stepper__item{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;padding-bottom:1.25rem}.mc-stepper--compact .mc-stepper__item::before,.mc-stepper--compact .mc-stepper__item::after{bottom:0;border-radius:6px;height:0.25rem;top:auto}.mc-stepper--compact .mc-stepper__item::after{width:100%}.mc-stepper--compact .mc-stepper__item::before{z-index:2;width:calc(var(--current) * 100% / var(--steps))}.mc-stepper--compact .mc-stepper__item:not(.mc-stepper__item--current){display:none}.mc-stepper--compact .mc-stepper__indicator{display:none}.mc-stepper--compact .mc-stepper__detail{text-align:left}.mc-stepper--compact .mc-stepper__title{display:block;margin-bottom:0.25rem}@media screen and (max-width: 679px){.mc-stepper--shrinked .mc-stepper__item{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;padding-bottom:1.25rem}.mc-stepper--shrinked .mc-stepper__item::before,.mc-stepper--shrinked .mc-stepper__item::after{bottom:0;border-radius:6px;height:0.25rem;top:auto}.mc-stepper--shrinked .mc-stepper__item::after{width:100%}.mc-stepper--shrinked .mc-stepper__item::before{z-index:2;width:calc(var(--current) * 100% / var(--steps))}.mc-stepper--shrinked .mc-stepper__item:not(.mc-stepper__item--current){display:none}.mc-stepper--shrinked .mc-stepper__indicator{display:none}.mc-stepper--shrinked .mc-stepper__detail{text-align:left}.mc-stepper--shrinked .mc-stepper__title{display:block;margin-bottom:0.25rem}}.mc-stepper--compact .mc-stepper__item::before{content:""}',this.shadowRoot.appendChild(c),t(this,{target:this.shadowRoot,props:r(this.attributes),customElement:!0},A,L,p,{steps:7,compact:0,steptitleprefix:1},null),e&&(e.target&&i(e.target,this,e.anchor),e.props&&(this.$set(e.props),s()))}static get observedAttributes(){return["steps","compact","steptitleprefix"]}get steps(){return this.$$.ctx[7]}set steps(e){this.$$set({steps:e}),s()}get compact(){return this.$$.ctx[0]}set compact(e){this.$$set({compact:e}),s()}get steptitleprefix(){return this.$$.ctx[1]}set steptitleprefix(e){this.$$set({steptitleprefix:e}),s()}}export{D as default};
|
|
2
2
|
//# sourceMappingURL=Stepper.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Stepper.js","sources":["../../../src/components/stepper/Stepper.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import type { StepperItems } from './stepper.types';\n import { EventHandler } from '../../utilities/EventHandler';\n import {\n get_current_component,\n createEventDispatcher,\n } from 'svelte/internal';\n\n export let steps: string;\n export let compact = false;\n let eventHandler = new EventHandler(\n get_current_component(),\n createEventDispatcher(),\n );\n $: stepsObject = steps\n ? (JSON.parse(steps) as StepperItems[])\n : ([] as StepperItems[]);\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n\n function isStepValidated(\n index: number,\n stepsObject: StepperItems[],\n ): boolean {\n return (\n index < stepsObject.findIndex((step: StepperItems) => step.isCurrent)\n );\n }\n\n function
|
|
1
|
+
{"version":3,"file":"Stepper.js","sources":["../../../src/components/stepper/Stepper.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import type { StepperItems } from './stepper.types';\n import { EventHandler } from '../../utilities/EventHandler';\n import {\n get_current_component,\n createEventDispatcher,\n } from 'svelte/internal';\n\n export let steps: string;\n export let compact = false;\n export let steptitleprefix: string;\n\n let eventHandler = new EventHandler(\n get_current_component(),\n createEventDispatcher(),\n );\n $: stepsObject = steps\n ? (JSON.parse(steps) as StepperItems[])\n : ([] as StepperItems[]);\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n\n function isStepValidated(\n index: number,\n stepsObject: StepperItems[],\n ): boolean {\n return (\n index < stepsObject.findIndex((step: StepperItems) => step.isCurrent)\n );\n }\n\n function getStepTitle(prefix: string, index: number, stepsObject: StepperItems[]): string {\n const titlePrefix = prefix ? `${prefix} ` : '';\n return `${titlePrefix}${index + 1} / ${stepsObject.length}`;\n }\n\n function stepChanged(step: StepperItems): void {\n eventHandler.dispatch('step-changed', step);\n }\n</script>\n\n<nav\n class=\"mc-stepper {compact ? 'mc-stepper--compact' : ''} {stepsObject.length >\n 3\n ? 'mc-stepper--shrinked'\n : ''}\"\n aria-label=\"accessibilityLabels.stepperDescription\"\n {...attributes}\n>\n <ol class=\"mc-stepper__list\">\n {#each stepsObject as step, index}\n <li\n class=\"mc-stepper__item {step.isCurrent\n ? 'mc-stepper__item--current'\n : ''} {isStepValidated(index, stepsObject)\n ? 'mc-stepper__item--validated'\n : ''}\"\n style=\"--steps: {stepsObject.length}; --current: {index + 1};\"\n on:click={() => stepChanged(step)}\n >\n <div class=\"mc-stepper__indicator\" aria-hidden=\"true\">\n {#if isStepValidated(index, stepsObject)}\n <div class=\"mc-stepper__icon\">\n <navigation-notification-available-16px\n name=\"NotificationAvailable16\"\n size=\"100%\"\n />\n </div>\n {:else if step.isCurrent}\n <span>{index + 1}</span>\n {/if}\n </div>\n <div class=\"mc-stepper__detail\">\n <span class=\"mc-stepper__title\">\n {getStepTitle(steptitleprefix, index, stepsObject)}\n </span>\n <span class=\"mc-stepper__label\">{step.label}</span>\n </div>\n </li>\n {/each}\n </ol>\n</nav>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import '@mozaic-ds/styles/components/_c.stepper';\n\n .mc-stepper--compact {\n .mc-stepper__item {\n &::before {\n content: '';\n }\n }\n }\n</style>\n"],"names":["t_value","ctx","insert","target","span","anchor","div","t1_value","t3_value","label","isCurrent","create_if_block_1","attr","li","li_class_value","set_style","length","append","div0","div1","span0","span1","dirty","set_data","t1","t3","i","nav","ol","class","nav_class_value","steps","$$props","compact","steptitleprefix","eventHandler","EventHandler","get_current_component","createEventDispatcher","stepChanged","step","dispatch","$$invalidate","stepsObject","JSON","parse","attributes","Object","assign","$$restProps","index","findIndex","prefix"],"mappings":"4UAuEmBA,EAAAC,MAAQ,EAAC,yCAAhBC,EAAuBC,EAAAC,EAAAC,uPAPvBH,EAKKC,EAAAG,EAAAD,iEAOJE,EAAAN,EAAa,GAAAA,EAAiB,GAAAA,MAAOA,EAAW,IAAA,GAElBO,EAAAP,MAAKQ,MAAK,sDAftCR,EAAe,GAACA,EAAK,IAAEA,EAAW,SAO7BA,MAAKS,UAASC,OAAd,yUAhBaC,EAAAC,EAAA,QAAAC,EAAA,qBAAAb,MAAKS,UAC1B,4BACA,IAAK,KAAAT,EAAgB,GAAAA,MAAOA,EAAW,IACvC,8BACA,KACac,EAAAF,EAAA,UAAAZ,KAAYe,QAAqBD,EAAAF,EAAA,YAAAZ,MAAQ,WAN5DC,EA2BIC,EAAAU,EAAAR,GAlBFY,EAWKJ,EAAAK,yBACLD,EAKKJ,EAAAM,GAJHF,EAEME,EAAAC,iBACNH,EAAkDE,EAAAE,mHAF/C,GAAAC,GAAAf,KAAAA,EAAAN,EAAa,GAAAA,EAAiB,GAAAA,MAAOA,EAAW,IAAA,KAAAsB,EAAAC,EAAAjB,GAElB,EAAAe,GAAAd,KAAAA,EAAAP,MAAKQ,MAAK,KAAAc,EAAAE,EAAAjB,GAxBpB,EAAAc,GAAAR,KAAAA,EAAA,qBAAAb,MAAKS,UAC1B,4BACA,IAAK,KAAAT,EAAgB,GAAAA,MAAOA,EAAW,IACvC,8BACA,0BACac,EAAAF,EAAA,UAAAZ,KAAYe,oEAP1Bf,EAAW,wBAAhBe,OAAIU,GAAA,kDARWzB,EAAO,GAAG,sBAAwB,SAAKA,EAAW,GAACe,OACtE,EACI,uBACA,6DAEAf,EAAU,8KANhBC,EAwCKC,EAAAwB,EAAAtB,GAhCHY,EA+BIU,EAAAC,oFA9BK3B,EAAW,WAAhBe,OAAIU,GAAA,EAAA,iHAAJV,6CARef,EAAO,GAAG,sBAAwB,SAAKA,EAAW,GAACe,OACtE,EACI,uBACA,MAAE,CAAAa,MAAAC,gEAEF7B,EAAU,iIAvCH8B,GAAaC,GACbC,QAAAA,GAAU,GAAKD,mBACfE,GAAuBF,EAE9BG,EAAmB,IAAAC,EACrBC,IACAC,KAsBO,SAAAC,EAAYC,GACnBL,EAAaM,SAAS,eAAgBD,qMArBvCE,EAAA,EAAEC,EAAcZ,EACZa,KAAKC,MAAMd,GAAK,QAElBe,EAALC,OAAAC,UAAuBC,yBACXH,EAAWjB,yBAGnBqB,EACAP,UAGEO,EAAQP,EAAYQ,WAAWX,GAAuBA,EAAK9B,aAItD,SAAa0C,EAAgBF,EAAeP,GAEzC,MAAA,GADUS,EAAY,GAAAA,KAAY,KACpBF,EAAQ,OAAOP,EAAY3B,cAyB/BwB,GAAAD,EAAYC"}
|
|
@@ -10,6 +10,8 @@
|
|
|
10
10
|
|
|
11
11
|
export let steps: string;
|
|
12
12
|
export let compact = false;
|
|
13
|
+
export let steptitleprefix: string;
|
|
14
|
+
|
|
13
15
|
let eventHandler = new EventHandler(
|
|
14
16
|
get_current_component(),
|
|
15
17
|
createEventDispatcher(),
|
|
@@ -29,8 +31,9 @@
|
|
|
29
31
|
);
|
|
30
32
|
}
|
|
31
33
|
|
|
32
|
-
function
|
|
33
|
-
|
|
34
|
+
function getStepTitle(prefix: string, index: number, stepsObject: StepperItems[]): string {
|
|
35
|
+
const titlePrefix = prefix ? `${prefix} ` : '';
|
|
36
|
+
return `${titlePrefix}${index + 1} / ${stepsObject.length}`;
|
|
34
37
|
}
|
|
35
38
|
|
|
36
39
|
function stepChanged(step: StepperItems): void {
|
|
@@ -70,8 +73,8 @@
|
|
|
70
73
|
{/if}
|
|
71
74
|
</div>
|
|
72
75
|
<div class="mc-stepper__detail">
|
|
73
|
-
<span class="mc-stepper__title"
|
|
74
|
-
|
|
76
|
+
<span class="mc-stepper__title">
|
|
77
|
+
{getStepTitle(steptitleprefix, index, stepsObject)}
|
|
75
78
|
</span>
|
|
76
79
|
<span class="mc-stepper__label">{step.label}</span>
|
|
77
80
|
</div>
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{S as e,i as t,a as s,b as a,f as i,s as n,c,e as l,n as o,h as r,j as d,l as b,p as m,q as _,Q as f,r as u,v as p,w as h,x,d as g,J as v,t as k,k as w,m as $,o as y,R as A}from"../../index-d12e76e8.js";import{E as N}from"../../EventHandler-f7ee47ca.js";function j(e,t,s){const a=e.slice();return a[16]=t[s],a[18]=s,a}function C(e){let t,s,i,n,c,o,d,m,f,u=e[16].text+"",p=e[16].iconName&&H(e);function h(...t){return e[12](e[18],e[16],...t)}return{c(){t=l("button"),s=l("span"),p&&p.c(),i=g(),n=k(u),r(s,"class","mc-tabs__text"),r(t,"role","tab"),r(t,"type","button"),r(t,"class","mc-tabs__element"),r(t,"id",c=e[16].id),t.disabled=o=e[16].disabled,r(t,"aria-selected",d=e[16].isActive?"true":"false"),w(t,"mc-tabs__element--disabled",e[16].disabled),w(t,"mc-tabs__element--selected",e[4]?e[16].id==e[5]:e[16].isActive)},m(e,c){a(e,t,c),b(t,s),p&&p.m(s,null),b(s,i),b(s,n),m||(f=$(t,"click",h),m=!0)},p(a,l){(e=a)[16].iconName?p?p.p(e,l):(p=H(e),p.c(),p.m(s,i)):p&&(p.d(1),p=null),256&l&&u!==(u=e[16].text+"")&&y(n,u),256&l&&c!==(c=e[16].id)&&r(t,"id",c),256&l&&o!==(o=e[16].disabled)&&(t.disabled=o),256&l&&d!==(d=e[16].isActive?"true":"false")&&r(t,"aria-selected",d),256&l&&w(t,"mc-tabs__element--disabled",e[16].disabled),304&l&&w(t,"mc-tabs__element--selected",e[4]?e[16].id==e[5]:e[16].isActive)},d(e){e&&_(t),p&&p.d(),m=!1,f()}}}function L(e){let t;function s(e,t){return e[16].disabled?M:T}let i=s(e),n=i(e);return{c(){n.c(),t=A()},m(e,s){n.m(e,s),a(e,t,s)},p(e,a){i===(i=s(e))&&n?n.p(e,a):(n.d(1),n=i(e),n&&(n.c(),n.m(t.parentNode,t)))},d(e){n.d(e),e&&_(t)}}}function H(e){let t,s=`<${q(e[16].iconName,e[16].iconColor)} />`;return{c(){t=l("span"),r(t,"class","mc-tabs__icon")},m(e,i){a(e,t,i),t.innerHTML=s},p(e,a){256&a&&s!==(s=`<${q(e[16].iconName,e[16].iconColor)} />`)&&(t.innerHTML=s)},d(e){e&&_(t)}}}function M(e){let t,s,i,n,c,o,d=e[16].text+"",m=e[16].iconName&&E(e);return{c(){t=l("span"),s=l("span"),m&&m.c(),i=g(),n=k(d),r(s,"class","mc-tabs__text"),r(t,"role","tab"),r(t,"class","mc-tabs__element"),r(t,"id",c=e[16].id),r(t,"aria-selected",o=e[16].isActive?"true":"false"),w(t,"mc-tabs__element--disabled",e[16].disabled),w(t,"mc-tabs__element--selected",e[4]?e[16].id==e[5]:e[16].isActive)},m(e,c){a(e,t,c),b(t,s),m&&m.m(s,null),b(s,i),b(s,n)},p(e,a){e[16].iconName?m?m.p(e,a):(m=E(e),m.c(),m.m(s,i)):m&&(m.d(1),m=null),256&a&&d!==(d=e[16].text+"")&&y(n,d),256&a&&c!==(c=e[16].id)&&r(t,"id",c),256&a&&o!==(o=e[16].isActive?"true":"false")&&r(t,"aria-selected",o),256&a&&w(t,"mc-tabs__element--disabled",e[16].disabled),304&a&&w(t,"mc-tabs__element--selected",e[4]?e[16].id==e[5]:e[16].isActive)},d(e){e&&_(t),m&&m.d()}}}function T(e){let t,s,i,n,c,o,d,m,f,u=e[16].text+"",p=e[16].iconName&&O(e);function h(...t){return e[11](e[18],e[16],...t)}return{c(){t=l("a"),s=l("span"),p&&p.c(),i=g(),n=k(u),r(s,"class","mc-tabs__text"),r(t,"href",c=e[16].href),r(t,"role","tab"),r(t,"class","mc-tabs__element"),r(t,"id",o=e[16].id),r(t,"aria-selected",d=e[16].isActive?"true":"false"),w(t,"mc-tabs__element--disabled",e[16].disabled),w(t,"mc-tabs__element--selected",e[4]?e[16].id==e[5]:e[16].isActive)},m(e,c){a(e,t,c),b(t,s),p&&p.m(s,null),b(s,i),b(s,n),m||(f=$(t,"click",h),m=!0)},p(a,l){(e=a)[16].iconName?p?p.p(e,l):(p=O(e),p.c(),p.m(s,i)):p&&(p.d(1),p=null),256&l&&u!==(u=e[16].text+"")&&y(n,u),256&l&&c!==(c=e[16].href)&&r(t,"href",c),256&l&&o!==(o=e[16].id)&&r(t,"id",o),256&l&&d!==(d=e[16].isActive?"true":"false")&&r(t,"aria-selected",d),256&l&&w(t,"mc-tabs__element--disabled",e[16].disabled),304&l&&w(t,"mc-tabs__element--selected",e[4]?e[16].id==e[5]:e[16].isActive)},d(e){e&&_(t),p&&p.d(),m=!1,f()}}}function E(e){let t,s=`<${q(e[16].iconName,e[16].iconColor)} />`;return{c(){t=l("span"),r(t,"class","mc-tabs__icon")},m(e,i){a(e,t,i),t.innerHTML=s},p(e,a){256&a&&s!==(s=`<${q(e[16].iconName,e[16].iconColor)} />`)&&(t.innerHTML=s)},d(e){e&&_(t)}}}function O(e){let t,s=`<${q(e[16].iconName,e[16].iconColor)} />`;return{c(){t=l("span"),r(t,"class","mc-tabs__icon")},m(e,i){a(e,t,i),t.innerHTML=s},p(e,a){256&a&&s!==(s=`<${q(e[16].iconName,e[16].iconColor)} />`)&&(t.innerHTML=s)},d(e){e&&_(t)}}}function R(e){let t,s;function i(e,t){return e[16].href?L:C}let n=i(e),c=n(e);return{c(){t=l("li"),c.c(),s=g(),r(t,"class","mc-tabs__item"),r(t,"role","presentation")},m(e,i){a(e,t,i),c.m(t,null),b(t,s)},p(e,a){n===(n=i(e))&&c?c.p(e,a):(c.d(1),c=n(e),c&&(c.c(),c.m(t,s)))},d(e){e&&_(t),c.d()}}}function S(e){let t,s,i,n=e[8],u=[];for(let t=0;t<n.length;t+=1)u[t]=R(j(e,n,t));let p=[{class:i="mc-tabs "+(e[0]&&"full"===e[0]?" mc-tabs--full":"")+" "+(e[0]&&"centered"===e[0]?" mc-tabs--full-centered":"")+" "+(e[3]?` mc-tabs--${e[3]}`:"")+(e[2]?" mc-tabs--no-divider":"")},e[6]],h={};for(let e=0;e<p.length;e+=1)h=c(h,p[e]);return{c(){t=l("div"),s=l("ul");for(let e=0;e<u.length;e+=1)u[e].c();this.c=o,r(s,"class","mc-tabs__nav"),r(s,"role","tablist"),r(s,"aria-label",e[1]),d(t,h)},m(i,n){a(i,t,n),b(t,s);for(let e=0;e<u.length;e+=1)u[e]&&u[e].m(s,null);e[13](s)},p(e,[a]){if(816&a){let t;for(n=e[8],t=0;t<n.length;t+=1){const i=j(e,n,t);u[t]?u[t].p(i,a):(u[t]=R(i),u[t].c(),u[t].m(s,null))}for(;t<u.length;t+=1)u[t].d(1);u.length=n.length}2&a&&r(s,"aria-label",e[1]),d(t,h=m(p,[13&a&&i!==(i="mc-tabs "+(e[0]&&"full"===e[0]?" mc-tabs--full":"")+" "+(e[0]&&"centered"===e[0]?" mc-tabs--full-centered":"")+" "+(e[3]?` mc-tabs--${e[3]}`:"")+(e[2]?" mc-tabs--no-divider":""))&&{class:i},64&a&&e[6]]))},i:o,o:o,d(s){s&&_(t),f(u,s),e[13](null)}}}function q(e,t){return`${e} size="1.5rem" fill="${t}"`}function z(e,t,s){let a,i;const n=["align","description","nodivider","tabs","type","stateless","selectedtab"];let l,o=u(t,n),{align:r="auto"}=t,{description:d="Tabs"}=t,{nodivider:b=!1}=t,{tabs:m}=t,{type:_="tabs"}=t,{stateless:f=!1}=t,{selectedtab:g}=t,k=new N(p(),h());function w(e,t){const s=e.target;f||(l.querySelectorAll(".mc-tabs__element").forEach((e=>{e.classList.remove("mc-tabs__element--selected"),e.setAttribute("aria-selected","false")})),s.classList.add("mc-tabs__element--selected"),s.setAttribute("aria-selected","true")),k.dispatch("tab-clicked",Object.assign(t,{target:s}))}return e.$$set=e=>{t=c(c({},t),x(e)),s(15,o=u(t,n)),"align"in e&&s(0,r=e.align),"description"in e&&s(1,d=e.description),"nodivider"in e&&s(2,b=e.nodivider),"tabs"in e&&s(10,m=e.tabs),"type"in e&&s(3,_=e.type),"stateless"in e&&s(4,f=e.stateless),"selectedtab"in e&&s(5,g=e.selectedtab)},e.$$.update=()=>{1024&e.$$.dirty&&s(8,a=m?JSON.parse(m):[]),s(6,i=Object.assign({},o)),64&e.$$.dirty&&delete i.class},[r,d,b,_,f,g,i,l,a,w,m,(e,t,s)=>w(s,Object.assign({index:e},t)),(e,t,s)=>w(s,Object.assign({index:e},t)),function(e){v[e?"unshift":"push"]((()=>{l=e,s(7,l)}))}]}class J extends e{constructor(e){super();const c=document.createElement("style");c.textContent='.mc-tabs{font-family:"LeroyMerlin", sans-serif;font-weight:400;background-color:#ffffff;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;width:100%}.mc-tabs::after{background:#b3b3b3;content:"";display:block;margin:0 auto;height:1px;width:100%;bottom:0;left:0;position:absolute}.mc-tabs--no-shadow::after,.mc-tabs--no-divider::after{display:none}.mc-tabs__nav{list-style:none;margin-left:0;padding-left:0;display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:0;margin-bottom:0}.mc-tabs__nav,.mc-tabs__select{position:relative}.mc-tabs__link,.mc-tabs__element{font-size:0.875rem;line-height:1.2857142857;font-weight:600;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:none;border:none;color:#666666;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;height:3.5rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;outline:none;padding-left:0.75rem;padding-right:0.75rem;position:relative;text-decoration:none}.mc-tabs__link::before,.mc-tabs__element::before{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;bottom:-0.125rem;top:-0.125rem}.mc-tabs__link::after,.mc-tabs__element::after{background-color:transparent;bottom:0;content:"";height:0.25rem;left:1.5rem;position:absolute;right:1.5rem}.mc-tabs__link:hover .mc-tabs__text,.mc-tabs__element:hover .mc-tabs__text{background-color:#eeeff1}.mc-tabs__link:active,.mc-tabs__element:active{color:#4d4d4d}.mc-tabs__link:active .mc-tabs__text,.mc-tabs__element:active .mc-tabs__text{background-color:#cfd2d8}.mc-tabs__link:focus::before,.mc-tabs__element:focus::before{-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-tabs__link--selected,.mc-tabs__element--selected{color:#000000}.mc-tabs__link--selected::after,.mc-tabs__element--selected::after{background-color:#000000}.mc-tabs__link--selected:hover,.mc-tabs__element--selected:hover{color:#000000}.mc-tabs__link--selected:active,.mc-tabs__element--selected:active{color:#000000}.mc-tabs__link--disabled,.mc-tabs__element--disabled{cursor:not-allowed;background-color:#cccccc;pointer-events:none}.mc-tabs__link--disabled,.mc-tabs__link--disabled:hover,.mc-tabs__link--disabled:focus,.mc-tabs__link--disabled:active,.mc-tabs__element--disabled,.mc-tabs__element--disabled:hover,.mc-tabs__element--disabled:focus,.mc-tabs__element--disabled:active{-webkit-box-shadow:none;box-shadow:none}.mc-tabs__text{-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:0.25rem;display:-webkit-box;display:-ms-flexbox;display:flex;gap:0.25rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;padding:0.4375rem 0.75rem;pointer-events:none}.mc-tabs__icon{fill:currentColor;height:1.5rem;width:1.5rem}.mc-tabs--full-centered{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.mc-tabs--dropdown{padding:1rem;width:auto}@media screen and (min-width: 680px){.mc-tabs{width:auto}.mc-tabs--full,.mc-tabs--full-centered{width:100%}}@media screen and (max-width: 679px){.mc-tabs:not(.mc-tabs--dropdown)::before{bottom:0.125rem}.mc-tabs__nav{overflow:auto hidden;white-space:nowrap}}',this.shadowRoot.appendChild(c),t(this,{target:this.shadowRoot,props:s(this.attributes),customElement:!0},z,S,n,{align:0,description:1,nodivider:2,tabs:10,type:3,stateless:4,selectedtab:5},null),e&&(e.target&&a(e.target,this,e.anchor),e.props&&(this.$set(e.props),i()))}static get observedAttributes(){return["align","description","nodivider","tabs","type","stateless","selectedtab"]}get align(){return this.$$.ctx[0]}set align(e){this.$$set({align:e}),i()}get description(){return this.$$.ctx[1]}set description(e){this.$$set({description:e}),i()}get nodivider(){return this.$$.ctx[2]}set nodivider(e){this.$$set({nodivider:e}),i()}get tabs(){return this.$$.ctx[10]}set tabs(e){this.$$set({tabs:e}),i()}get type(){return this.$$.ctx[3]}set type(e){this.$$set({type:e}),i()}get stateless(){return this.$$.ctx[4]}set stateless(e){this.$$set({stateless:e}),i()}get selectedtab(){return this.$$.ctx[5]}set selectedtab(e){this.$$set({selectedtab:e}),i()}}export{J as default};
|
|
1
|
+
import{S as e,i as t,a as s,g as a,b as n,f as i,s as c,c as l,e as o,n as r,h as d,j as m,l as b,p as _,q as p,Q as u,r as f,u as h,v as x,w as g,x as v,d as $,J as k,t as w,k as y,m as A,o as N,R as j}from"../../index-d12e76e8.js";import{E as C}from"../../EventHandler-f7ee47ca.js";function L(e,t,s){const a=e.slice();return a[17]=t[s],a[19]=s,a}function H(e){let t,s,a,i,c,l,r,m,_,u,f=e[17].text+"",h=e[17].iconName&&T(e),x=e[10].icon&&E(e);function g(...t){return e[13](e[19],e[17],...t)}return{c(){t=o("button"),s=o("span"),h&&h.c(),a=$(),x&&x.c(),i=$(),c=w(f),d(s,"class","mc-tabs__text"),d(t,"role","tab"),d(t,"type","button"),d(t,"class","mc-tabs__element"),d(t,"id",l=e[17].id),t.disabled=r=e[17].disabled,d(t,"aria-selected",m=e[17].isActive?"true":"false"),y(t,"mc-tabs__element--disabled",e[17].disabled),y(t,"mc-tabs__element--selected",e[4]?e[17].id==e[5]:e[17].isActive)},m(e,l){n(e,t,l),b(t,s),h&&h.m(s,null),b(s,a),x&&x.m(s,null),b(s,i),b(s,c),_||(u=A(t,"click",g),_=!0)},p(n,o){(e=n)[17].iconName?h?h.p(e,o):(h=T(e),h.c(),h.m(s,a)):h&&(h.d(1),h=null),e[10].icon?x?x.p(e,o):(x=E(e),x.c(),x.m(s,i)):x&&(x.d(1),x=null),256&o&&f!==(f=e[17].text+"")&&N(c,f),256&o&&l!==(l=e[17].id)&&d(t,"id",l),256&o&&r!==(r=e[17].disabled)&&(t.disabled=r),256&o&&m!==(m=e[17].isActive?"true":"false")&&d(t,"aria-selected",m),256&o&&y(t,"mc-tabs__element--disabled",e[17].disabled),304&o&&y(t,"mc-tabs__element--selected",e[4]?e[17].id==e[5]:e[17].isActive)},d(e){e&&p(t),h&&h.d(),x&&x.d(),_=!1,u()}}}function M(e){let t;function s(e,t){return e[17].disabled?O:R}let a=s(e),i=a(e);return{c(){i.c(),t=j()},m(e,s){i.m(e,s),n(e,t,s)},p(e,n){a===(a=s(e))&&i?i.p(e,n):(i.d(1),i=a(e),i&&(i.c(),i.m(t.parentNode,t)))},d(e){i.d(e),e&&p(t)}}}function T(e){let t,s=`<${D(e[17].iconName,e[17].iconColor)} />`;return{c(){t=o("span"),d(t,"class","mc-tabs__icon")},m(e,a){n(e,t,a),t.innerHTML=s},p(e,a){256&a&&s!==(s=`<${D(e[17].iconName,e[17].iconColor)} />`)&&(t.innerHTML=s)},d(e){e&&p(t)}}}function E(e){let t,s,a;return{c(){t=o("span"),s=o("slot"),d(s,"prop",a=e[17]),d(s,"name","icon"),d(t,"class","mc-tabs__icon")},m(e,a){n(e,t,a),b(t,s)},p(e,t){256&t&&a!==(a=e[17])&&d(s,"prop",a)},d(e){e&&p(t)}}}function O(e){let t,s,a,i,c,l,r,m=e[17].text+"",_=e[17].iconName&&S(e),u=e[10].icon&&q(e);return{c(){t=o("span"),s=o("span"),_&&_.c(),a=$(),u&&u.c(),i=$(),c=w(m),d(s,"class","mc-tabs__text"),d(t,"role","tab"),d(t,"class","mc-tabs__element"),d(t,"id",l=e[17].id),d(t,"aria-selected",r=e[17].isActive?"true":"false"),y(t,"mc-tabs__element--disabled",e[17].disabled),y(t,"mc-tabs__element--selected",e[4]?e[17].id==e[5]:e[17].isActive)},m(e,l){n(e,t,l),b(t,s),_&&_.m(s,null),b(s,a),u&&u.m(s,null),b(s,i),b(s,c)},p(e,n){e[17].iconName?_?_.p(e,n):(_=S(e),_.c(),_.m(s,a)):_&&(_.d(1),_=null),e[10].icon?u?u.p(e,n):(u=q(e),u.c(),u.m(s,i)):u&&(u.d(1),u=null),256&n&&m!==(m=e[17].text+"")&&N(c,m),256&n&&l!==(l=e[17].id)&&d(t,"id",l),256&n&&r!==(r=e[17].isActive?"true":"false")&&d(t,"aria-selected",r),256&n&&y(t,"mc-tabs__element--disabled",e[17].disabled),304&n&&y(t,"mc-tabs__element--selected",e[4]?e[17].id==e[5]:e[17].isActive)},d(e){e&&p(t),_&&_.d(),u&&u.d()}}}function R(e){let t,s,a,i,c,l,r,m,_,u,f=e[17].text+"",h=e[17].iconName&&z(e),x=e[10].icon&&J(e);function g(...t){return e[12](e[19],e[17],...t)}return{c(){t=o("a"),s=o("span"),h&&h.c(),a=$(),x&&x.c(),i=$(),c=w(f),d(s,"class","mc-tabs__text"),d(t,"href",l=e[17].href),d(t,"role","tab"),d(t,"class","mc-tabs__element"),d(t,"id",r=e[17].id),d(t,"aria-selected",m=e[17].isActive?"true":"false"),y(t,"mc-tabs__element--disabled",e[17].disabled),y(t,"mc-tabs__element--selected",e[4]?e[17].id==e[5]:e[17].isActive)},m(e,l){n(e,t,l),b(t,s),h&&h.m(s,null),b(s,a),x&&x.m(s,null),b(s,i),b(s,c),_||(u=A(t,"click",g),_=!0)},p(n,o){(e=n)[17].iconName?h?h.p(e,o):(h=z(e),h.c(),h.m(s,a)):h&&(h.d(1),h=null),e[10].icon?x?x.p(e,o):(x=J(e),x.c(),x.m(s,i)):x&&(x.d(1),x=null),256&o&&f!==(f=e[17].text+"")&&N(c,f),256&o&&l!==(l=e[17].href)&&d(t,"href",l),256&o&&r!==(r=e[17].id)&&d(t,"id",r),256&o&&m!==(m=e[17].isActive?"true":"false")&&d(t,"aria-selected",m),256&o&&y(t,"mc-tabs__element--disabled",e[17].disabled),304&o&&y(t,"mc-tabs__element--selected",e[4]?e[17].id==e[5]:e[17].isActive)},d(e){e&&p(t),h&&h.d(),x&&x.d(),_=!1,u()}}}function S(e){let t,s=`<${D(e[17].iconName,e[17].iconColor)} />`;return{c(){t=o("span"),d(t,"class","mc-tabs__icon")},m(e,a){n(e,t,a),t.innerHTML=s},p(e,a){256&a&&s!==(s=`<${D(e[17].iconName,e[17].iconColor)} />`)&&(t.innerHTML=s)},d(e){e&&p(t)}}}function q(e){let t,s,a;return{c(){t=o("span"),s=o("slot"),d(s,"prop",a=e[17]),d(s,"name","icon"),d(t,"class","mc-tabs__icon")},m(e,a){n(e,t,a),b(t,s)},p(e,t){256&t&&a!==(a=e[17])&&d(s,"prop",a)},d(e){e&&p(t)}}}function z(e){let t,s=`<${D(e[17].iconName,e[17].iconColor)} />`;return{c(){t=o("span"),d(t,"class","mc-tabs__icon")},m(e,a){n(e,t,a),t.innerHTML=s},p(e,a){256&a&&s!==(s=`<${D(e[17].iconName,e[17].iconColor)} />`)&&(t.innerHTML=s)},d(e){e&&p(t)}}}function J(e){let t,s,a;return{c(){t=o("span"),s=o("slot"),d(s,"prop",a=e[17]),d(s,"name","icon"),d(t,"class","mc-tabs__icon")},m(e,a){n(e,t,a),b(t,s)},p(e,t){256&t&&a!==(a=e[17])&&d(s,"prop",a)},d(e){e&&p(t)}}}function Q(e){let t,s;function a(e,t){return e[17].href?M:H}let i=a(e),c=i(e);return{c(){t=o("li"),c.c(),s=$(),d(t,"class","mc-tabs__item"),d(t,"role","presentation")},m(e,a){n(e,t,a),c.m(t,null),b(t,s)},p(e,n){i===(i=a(e))&&c?c.p(e,n):(c.d(1),c=i(e),c&&(c.c(),c.m(t,s)))},d(e){e&&p(t),c.d()}}}function B(e){let t,s,a,i=e[8],c=[];for(let t=0;t<i.length;t+=1)c[t]=Q(L(e,i,t));let f=[{class:a="mc-tabs "+(e[0]&&"full"===e[0]?" mc-tabs--full":"")+" "+(e[0]&&"centered"===e[0]?" mc-tabs--full-centered":"")+" "+(e[3]?` mc-tabs--${e[3]}`:"")+(e[2]?" mc-tabs--no-divider":"")},e[6]],h={};for(let e=0;e<f.length;e+=1)h=l(h,f[e]);return{c(){t=o("div"),s=o("ul");for(let e=0;e<c.length;e+=1)c[e].c();this.c=r,d(s,"class","mc-tabs__nav"),d(s,"role","tablist"),d(s,"aria-label",e[1]),m(t,h)},m(a,i){n(a,t,i),b(t,s);for(let e=0;e<c.length;e+=1)c[e]&&c[e].m(s,null);e[14](s)},p(e,[n]){if(1840&n){let t;for(i=e[8],t=0;t<i.length;t+=1){const a=L(e,i,t);c[t]?c[t].p(a,n):(c[t]=Q(a),c[t].c(),c[t].m(s,null))}for(;t<c.length;t+=1)c[t].d(1);c.length=i.length}2&n&&d(s,"aria-label",e[1]),m(t,h=_(f,[13&n&&a!==(a="mc-tabs "+(e[0]&&"full"===e[0]?" mc-tabs--full":"")+" "+(e[0]&&"centered"===e[0]?" mc-tabs--full-centered":"")+" "+(e[3]?` mc-tabs--${e[3]}`:"")+(e[2]?" mc-tabs--no-divider":""))&&{class:a},64&n&&e[6]]))},i:r,o:r,d(s){s&&p(t),u(c,s),e[14](null)}}}function D(e,t){return`${e} size="1.5rem" fill="${t}"`}function F(e,t,s){let a,n;const i=["align","description","nodivider","tabs","type","stateless","selectedtab"];let c=f(t,i),{$$slots:o={},$$scope:r}=t;const d=h(o);let m,{align:b="auto"}=t,{description:_="Tabs"}=t,{nodivider:p=!1}=t,{tabs:u}=t,{type:$="tabs"}=t,{stateless:w=!1}=t,{selectedtab:y}=t,A=new C(x(),g());function N(e,t){const s=e.target;w||(m.querySelectorAll(".mc-tabs__element").forEach((e=>{e.classList.remove("mc-tabs__element--selected"),e.setAttribute("aria-selected","false")})),s.classList.add("mc-tabs__element--selected"),s.setAttribute("aria-selected","true")),A.dispatch("tab-clicked",Object.assign(t,{target:s}))}return e.$$set=e=>{t=l(l({},t),v(e)),s(16,c=f(t,i)),"align"in e&&s(0,b=e.align),"description"in e&&s(1,_=e.description),"nodivider"in e&&s(2,p=e.nodivider),"tabs"in e&&s(11,u=e.tabs),"type"in e&&s(3,$=e.type),"stateless"in e&&s(4,w=e.stateless),"selectedtab"in e&&s(5,y=e.selectedtab)},e.$$.update=()=>{2048&e.$$.dirty&&s(8,a=u?JSON.parse(u):[]),s(6,n=Object.assign({},c)),64&e.$$.dirty&&delete n.class},[b,_,p,$,w,y,n,m,a,N,d,u,(e,t,s)=>N(s,Object.assign({index:e},t)),(e,t,s)=>N(s,Object.assign({index:e},t)),function(e){k[e?"unshift":"push"]((()=>{m=e,s(7,m)}))}]}class G extends e{constructor(e){super();const l=document.createElement("style");l.textContent='.mc-tabs{font-family:"LeroyMerlin", sans-serif;font-weight:400;background-color:#ffffff;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;width:100%}.mc-tabs::after{background:#b3b3b3;content:"";display:block;margin:0 auto;height:1px;width:100%;bottom:0;left:0;position:absolute}.mc-tabs--no-shadow::after,.mc-tabs--no-divider::after{display:none}.mc-tabs__nav{list-style:none;margin-left:0;padding-left:0;display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:0;margin-bottom:0}.mc-tabs__nav,.mc-tabs__select{position:relative}.mc-tabs__link,.mc-tabs__element{font-size:0.875rem;line-height:1.2857142857;font-weight:600;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:none;border:none;color:#666666;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;height:3.5rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;outline:none;padding-left:0.75rem;padding-right:0.75rem;position:relative;text-decoration:none}.mc-tabs__link::before,.mc-tabs__element::before{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;bottom:-0.125rem;top:-0.125rem}.mc-tabs__link::after,.mc-tabs__element::after{background-color:transparent;bottom:0;content:"";height:0.25rem;left:1.5rem;position:absolute;right:1.5rem}.mc-tabs__link:hover .mc-tabs__text,.mc-tabs__element:hover .mc-tabs__text{background-color:#eeeff1}.mc-tabs__link:active,.mc-tabs__element:active{color:#4d4d4d}.mc-tabs__link:active .mc-tabs__text,.mc-tabs__element:active .mc-tabs__text{background-color:#cfd2d8}.mc-tabs__link:focus::before,.mc-tabs__element:focus::before{-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-tabs__link--selected,.mc-tabs__element--selected{color:#000000}.mc-tabs__link--selected::after,.mc-tabs__element--selected::after{background-color:#000000}.mc-tabs__link--selected:hover,.mc-tabs__element--selected:hover{color:#000000}.mc-tabs__link--selected:active,.mc-tabs__element--selected:active{color:#000000}.mc-tabs__link--disabled,.mc-tabs__element--disabled{cursor:not-allowed;background-color:#cccccc;pointer-events:none}.mc-tabs__link--disabled,.mc-tabs__link--disabled:hover,.mc-tabs__link--disabled:focus,.mc-tabs__link--disabled:active,.mc-tabs__element--disabled,.mc-tabs__element--disabled:hover,.mc-tabs__element--disabled:focus,.mc-tabs__element--disabled:active{-webkit-box-shadow:none;box-shadow:none}.mc-tabs__text{-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:0.25rem;display:-webkit-box;display:-ms-flexbox;display:flex;gap:0.25rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;padding:0.4375rem 0.75rem;pointer-events:none}.mc-tabs__icon{fill:currentColor;height:1.5rem;width:1.5rem}.mc-tabs--full-centered{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.mc-tabs--dropdown{padding:1rem;width:auto}@media screen and (min-width: 680px){.mc-tabs{width:auto}.mc-tabs--full,.mc-tabs--full-centered{width:100%}}@media screen and (max-width: 679px){.mc-tabs:not(.mc-tabs--dropdown)::before{bottom:0.125rem}.mc-tabs__nav{overflow:auto hidden;white-space:nowrap}}',this.shadowRoot.appendChild(l),t(this,{target:this.shadowRoot,props:{...s(this.attributes),$$slots:a(this)},customElement:!0},F,B,c,{align:0,description:1,nodivider:2,tabs:11,type:3,stateless:4,selectedtab:5},null),e&&(e.target&&n(e.target,this,e.anchor),e.props&&(this.$set(e.props),i()))}static get observedAttributes(){return["align","description","nodivider","tabs","type","stateless","selectedtab"]}get align(){return this.$$.ctx[0]}set align(e){this.$$set({align:e}),i()}get description(){return this.$$.ctx[1]}set description(e){this.$$set({description:e}),i()}get nodivider(){return this.$$.ctx[2]}set nodivider(e){this.$$set({nodivider:e}),i()}get tabs(){return this.$$.ctx[11]}set tabs(e){this.$$set({tabs:e}),i()}get type(){return this.$$.ctx[3]}set type(e){this.$$set({type:e}),i()}get stateless(){return this.$$.ctx[4]}set stateless(e){this.$$set({stateless:e}),i()}get selectedtab(){return this.$$.ctx[5]}set selectedtab(e){this.$$set({selectedtab:e}),i()}}export{G as default};
|
|
2
2
|
//# sourceMappingURL=Tabs.js.map
|
|
@@ -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
package/public/main.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,yCAAyC,CAAC;
|
|
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":"segmentedControl.types.d.ts","sourceRoot":"","sources":["../../../src/components/segmentedcontrol/segmentedControl.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"segmentedControl.types.d.ts","sourceRoot":"","sources":["../../../src/components/segmentedcontrol/segmentedControl.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,IAAI,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAC5B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,yCAAyC,CAAC;
|
|
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,
|
|
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 +1 @@
|
|
|
1
|
-
{"version":3,"file":"segmentedcontrol.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/segmentedcontrol/segmentedcontrol.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;;AAEnD,
|
|
1
|
+
{"version":3,"file":"segmentedcontrol.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/segmentedcontrol/segmentedcontrol.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;;AAEnD,wBAqBU;AAeV,eAAO,MAAM,OAAO,uCAAoB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Stepper.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/stepper/Stepper.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;;AAGnD,
|
|
1
|
+
{"version":3,"file":"Stepper.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/stepper/Stepper.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;;AAGnD,wBA0BU;AAyCV,eAAO,MAAM,OAAO,uCAAoB,CAAC;AAGzC,eAAO,MAAM,OAAO,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"}
|