@mozaic-ds/web-components 0.20.1 → 0.21.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/components/accordion/Accordion.js +1 -1
- package/public/adeo/components/accordion/Accordion.js.map +1 -1
- package/public/adeo/components/accordion/Accordion.svelte +3 -2
- package/public/adeo/components/phonenumber/PhoneNumber.js +1 -1
- package/public/adeo/components/phonenumber/PhoneNumber.js.map +1 -1
- package/public/adeo/components/phonenumber/PhoneNumber.svelte +1 -3
- package/public/bricoman/components/accordion/Accordion.js +1 -1
- package/public/bricoman/components/accordion/Accordion.js.map +1 -1
- package/public/bricoman/components/accordion/Accordion.svelte +3 -2
- package/public/bricoman/components/phonenumber/PhoneNumber.js +1 -1
- package/public/bricoman/components/phonenumber/PhoneNumber.js.map +1 -1
- package/public/bricoman/components/phonenumber/PhoneNumber.svelte +1 -3
- package/public/components/accordion/Accordion.js +1 -1
- package/public/components/accordion/Accordion.js.map +1 -1
- package/public/components/accordion/Accordion.svelte +3 -2
- package/public/components/phonenumber/PhoneNumber.js +1 -1
- package/public/components/phonenumber/PhoneNumber.js.map +1 -1
- package/public/components/phonenumber/PhoneNumber.svelte +1 -3
package/package.json
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{S as e,i as o,a as i,g as t,b as a,f as n,s as c,c as r,e as s,d,t as l,n as m,h as g,j as h,k as b,l as p,m as w,o as u,p as x,q as f,r as _,u as v,v as k,w as $,x as E}from"../../index-d12e76e8.js";import{E as C}from"../../EventHandler-f7ee47ca.js";function y(e){let o,i=`<${H(e[2],String(e[3]),e[1])} />`;return{c(){o=s("span"),g(o,"class","mc-accordion__icon")},m(e,t){a(e,o,t),o.innerHTML=i},p(e,t){14&t&&i!==(i=`<${H(e[2],String(e[3]),e[1])} />`)&&(o.innerHTML=i)},d(e){e&&f(o)}}}function z(e){let o;return{c(){o=s("span"),o.innerHTML='<slot name="icon"></slot>',g(o,"class","mc-accordion__icon")},m(e,i){a(e,o,i)},d(e){e&&f(o)}}}function M(e){let o,i,t,n,c,_,v,k,$,E,C,M,H,B,V,L,j,Z,R=e[2]&&y(e),S=e[11].icon&&z(),T=[{class:L="mc-accordion"+(e[1]?` mc-accordion--${e[1]}`:"")+" "+(e[9]?e[9]:"")},e[7]],q={};for(let e=0;e<T.length;e+=1)q=r(q,T[e]);return{c(){o=s("div"),i=s("div"),t=s("slot"),n=d(),c=s("h2"),_=s("button"),R&&R.c(),v=d(),S&&S.c(),k=d(),$=l(e[0]),E=d(),C=s("slot"),H=d(),B=s("div"),V=s("slot"),this.c=m,g(t,"name","beforeLabel"),g(C,"name","afterLabel"),g(_,"id","m-accordion"),g(_,"class","mc-accordion__trigger"),g(_,"type","button"),g(_,"aria-controls","content"),g(_,"aria-expanded",M=!e[8]),_.disabled=e[4],g(c,"class","mc-accordion__title"),g(i,"class","mc-accordion__header"),g(B,"id","content"),g(B,"class","mc-accordion__content"),g(B,"aria-hidden",e[8]),g(B,"aria-labelledby","m-accordion"),h(o,q),b(o,"is-open",e[8]),b(o,"mc-accordion--no-padding",e[5]),b(o,"mc-accordion--checkable",e[6]),b(o,"is-disabled",e[4])},m(r,s){a(r,o,s),p(o,i),p(i,t),p(i,n),p(i,c),p(c,_),R&&R.m(_,null),p(_,v),S&&S.m(_,null),p(_,k),p(_,$),p(_,E),p(_,C),p(o,H),p(o,B),p(B,V),j||(Z=w(_,"click",e[10]),j=!0)},p(e,[i]){e[2]?R?R.p(e,i):(R=y(e),R.c(),R.m(_,v)):R&&(R.d(1),R=null),e[11].icon?S||(S=z(),S.c(),S.m(_,k)):S&&(S.d(1),S=null),1&i&&u($,e[0]),256&i&&M!==(M=!e[8])&&g(_,"aria-expanded",M),16&i&&(_.disabled=e[4]),256&i&&g(B,"aria-hidden",e[8]),h(o,q=x(T,[514&i&&L!==(L="mc-accordion"+(e[1]?` mc-accordion--${e[1]}`:"")+" "+(e[9]?e[9]:""))&&{class:L},128&i&&e[7]])),b(o,"is-open",e[8]),b(o,"mc-accordion--no-padding",e[5]),b(o,"mc-accordion--checkable",e[6]),b(o,"is-disabled",e[4])},i:m,o:m,d(e){e&&f(o),R&&R.d(),S&&S.d(),j=!1,Z()}}}function H(e,o,i){return"s"===i?`${e} size="1.5rem"`:`${e} size="2rem" fill="${o}"`}function B(e,o,i){let t,a,n;const c=["label","size","iconname","iconcolor","open","disabled","nopadding","checkable"];let s=_(o,c),{$$slots:d={},$$scope:l}=o;const m=v(d);let{label:g}=o,{size:h="m"}=o,{iconname:b}=o,{iconcolor:p}=o,{open:w=!1}=o,{disabled:u=!1}=o,{nopadding:x=!1}=o,{checkable:f=!1}=o,y=new C(k(),$());return e.$$set=e=>{i(15,o=r(r({},o),E(e))),i(14,s=_(o,c)),"label"in e&&i(0,g=e.label),"size"in e&&i(1,h=e.size),"iconname"in e&&i(2,b=e.iconname),"iconcolor"in e&&i(3,p=e.iconcolor),"open"in e&&i(12,w=e.open),"disabled"in e&&i(4,u=e.disabled),"nopadding"in e&&i(5,x=e.nopadding),"checkable"in e&&i(6,f=e.checkable)},e.$$.update=()=>{4096&e.$$.dirty&&i(8,t=!!w),i(9,a=o.class),i(7,n=Object.assign({},s)),128&e.$$.dirty&&delete n.class},o=E(o),[g,h,b,p,u,x,f,n,t,a,function(){y.dispatch("on-heading-click",t),i(8,t=!t)},m,w]}class V extends e{constructor(e){super();const r=document.createElement("style");r.textContent=".mc-accordion{background-color:#ffffff;border-bottom:1px solid #666666;font-family:\"Roboto\", sans-serif;font-weight:400}.mc-accordion .mc-accordion__icon{height:2rem;width:2rem}.mc-accordion .mc-accordion__title{font-size:1.125rem;line-height:1.3333333333}.mc-accordion button.mc-accordion__trigger{padding-top:1.25rem;padding-right:3rem;padding-bottom:1.25rem}.mc-accordion button.mc-accordion__trigger::before{content:\"\";position:absolute;top:calc(50% - 0.75rem);right:0.5rem;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='2rem' width='2rem' fill='%23191919' viewBox='0 0 24 24'%3E%3Cpath d='M19.09,11h-6V5a1,1,0,0,0-2,0v6h-6a1,1,0,0,0,0,2h6v6a1,1,0,0,0,2,0V13h6a1,1,0,0,0,0-2Z'/%3E%3C/svg%3E\");background-size:1.5rem;width:1.5rem;height:1.5rem}.mc-accordion button.mc-accordion__trigger:disabled::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='2rem' width='2rem' fill='%23666666' viewBox='0 0 24 24'%3E%3Cpath d='M19.09,11h-6V5a1,1,0,0,0-2,0v6h-6a1,1,0,0,0,0,2h6v6a1,1,0,0,0,2,0V13h6a1,1,0,0,0,0-2Z'/%3E%3C/svg%3E\")}.mc-accordion.is-open>.mc-accordion__header button.mc-accordion__trigger::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='2rem' width='2rem' fill='%23191919' viewBox='0 0 24 24'%3E%3Cpath d='M17.09,13h-10a1,1,0,0,1,0-2h10a1,1,0,0,1,0,2Z'/%3E%3C/svg%3E\")}.mc-accordion.is-open>.mc-accordion__header button.mc-accordion__trigger:disabled::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='2rem' width='2rem' fill='%23666666' viewBox='0 0 24 24'%3E%3Cpath d='M17.09,13h-10a1,1,0,0,1,0-2h10a1,1,0,0,1,0,2Z'/%3E%3C/svg%3E\")}.mc-accordion__label{font-weight:700;position:relative;background-position:right 0.5rem center;background-repeat:no-repeat;color:#191919;cursor:pointer;display:block;padding-left:0.5rem;position:relative}.mc-accordion__label::after{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;top:-0.125rem;right:-0.125rem;bottom:-3px;left:-0.125rem}.mc-accordion__label:hover{background-color:#e6e6e6}.mc-accordion__label--no-padding{padding-left:0}.mc-accordion__label--icon{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0.5rem}.mc-accordion__icon{fill:#808080}.mc-accordion__content{font-size:1rem;line-height:1.375;color:#333333;height:auto;max-height:0;overflow:hidden;padding-left:0.5rem;-webkit-transition:0.3s ease-out;-o-transition:0.3s ease-out;transition:0.3s ease-out;visibility:hidden}.mc-accordion__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mc-accordion__header:hover{background-color:#e6e6e6}.mc-accordion__title{font-weight:700;color:#191919;width:100%;margin-top:0;margin-bottom:0}.mc-accordion button.mc-accordion__trigger{margin:0;-webkit-box-shadow:none;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;position:relative;background-position:right 0.5rem center;background-repeat:no-repeat;background-color:transparent;color:currentColor;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0.5rem;padding-left:0.5rem;text-align:left;width:100%}.mc-accordion button.mc-accordion__trigger::after{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;top:-0.125rem;right:-0.125rem;bottom:-3px;left:-0.125rem}.mc-accordion button.mc-accordion__trigger:focus::after{-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;-webkit-box-shadow:0 0 0 0.125rem #758992;box-shadow:0 0 0 0.125rem #758992}.mc-accordion button.mc-accordion__trigger:disabled{background-color:#e6e6e6;color:#666666;cursor:not-allowed}.mc-accordion.is-open>.mc-accordion__content{max-height:10000vh;padding-top:0.5rem;padding-bottom:calc(1.5rem - 1px);visibility:visible}.mc-accordion.is-disabled>.mc-accordion__content{color:#666666;cursor:not-allowed}.mc-accordion--checkable .mc-accordion__header{padding-left:0.5rem;position:relative}.mc-accordion--checkable .mc-accordion__trigger{position:static}.mc-accordion--no-padding .mc-accordion__header,.mc-accordion--no-padding .mc-accordion__trigger{padding-left:0}.mc-accordion--s .mc-accordion__icon{height:1.5rem;width:1.5rem}.mc-accordion--s .mc-accordion__title{font-size:1rem;line-height:1.375}.mc-accordion--s button.mc-accordion__trigger{padding-top:1rem;padding-right:2.5rem;padding-bottom:1rem}.mc-accordion--s button.mc-accordion__trigger::before{content:\"\";position:absolute;top:calc(50% - 0.5rem);right:0.5rem;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M13 7H9V3a1 1 0 00-2 0v4H3a1 1 0 000 2h4v4a1 1 0 002 0V9h4a1 1 0 000-2z'/%3E%3C/svg%3E\");background-size:1rem;width:1rem;height:1rem}.mc-accordion--s button.mc-accordion__trigger:disabled::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23666666' viewBox='0 0 16 16'%3E%3Cpath d='M13 7H9V3a1 1 0 00-2 0v4H3a1 1 0 000 2h4v4a1 1 0 002 0V9h4a1 1 0 000-2z'/%3E%3C/svg%3E\")}.mc-accordion--s.is-open>.mc-accordion__header button.mc-accordion__trigger::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E\")}.mc-accordion--s.is-open>.mc-accordion__header button.mc-accordion__trigger:disabled::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23666666' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E\")}:host{display:block}",this.shadowRoot.appendChild(r),o(this,{target:this.shadowRoot,props:{...i(this.attributes),$$slots:t(this)},customElement:!0},B,M,c,{label:0,size:1,iconname:2,iconcolor:3,open:12,disabled:4,nopadding:5,checkable:6},null),e&&(e.target&&a(e.target,this,e.anchor),e.props&&(this.$set(e.props),n()))}static get observedAttributes(){return["label","size","iconname","iconcolor","open","disabled","nopadding","checkable"]}get label(){return this.$$.ctx[0]}set label(e){this.$$set({label:e}),n()}get size(){return this.$$.ctx[1]}set size(e){this.$$set({size:e}),n()}get iconname(){return this.$$.ctx[2]}set iconname(e){this.$$set({iconname:e}),n()}get iconcolor(){return this.$$.ctx[3]}set iconcolor(e){this.$$set({iconcolor:e}),n()}get open(){return this.$$.ctx[12]}set open(e){this.$$set({open:e}),n()}get disabled(){return this.$$.ctx[4]}set disabled(e){this.$$set({disabled:e}),n()}get nopadding(){return this.$$.ctx[5]}set nopadding(e){this.$$set({nopadding:e}),n()}get checkable(){return this.$$.ctx[6]}set checkable(e){this.$$set({checkable:e}),n()}}export{V as default};
|
|
1
|
+
import{S as e,i as o,a as i,g as t,b as a,f as n,s as c,c as r,e as s,d,t as l,n as m,h as g,j as h,k as b,l as p,m as w,o as u,p as x,q as f,r as _,u as v,v as $,w as k,x as E}from"../../index-d12e76e8.js";import{E as C}from"../../EventHandler-f7ee47ca.js";function y(e){let o,i=`<${H(e[2],String(e[3]),e[1])} />`;return{c(){o=s("span"),g(o,"class","mc-accordion__icon")},m(e,t){a(e,o,t),o.innerHTML=i},p(e,t){14&t&&i!==(i=`<${H(e[2],String(e[3]),e[1])} />`)&&(o.innerHTML=i)},d(e){e&&f(o)}}}function z(e){let o;return{c(){o=s("span"),o.innerHTML='<slot name="icon"></slot>',g(o,"class","mc-accordion__icon")},m(e,i){a(e,o,i)},d(e){e&&f(o)}}}function M(e){let o,i,t,n,c,_,v,$,k,E,C,M,H,B,V,L,j,Z,R,S,T=e[2]&&y(e),q=e[12].icon&&z(),A=[{class:Z="mc-accordion"+(e[1]?` mc-accordion--${e[1]}`:"")+" "+(e[10]?e[10]:"")},e[8]],O={};for(let e=0;e<A.length;e+=1)O=r(O,A[e]);return{c(){o=s("div"),i=s("div"),t=s("slot"),n=d(),c=s("h2"),_=s("button"),T&&T.c(),v=d(),q&&q.c(),$=d(),k=l(e[0]),E=d(),C=s("slot"),B=d(),V=s("div"),L=s("slot"),this.c=m,g(t,"name","beforeLabel"),g(C,"name","afterLabel"),g(_,"id",M=`m-accordion-${e[7]}`),g(_,"class","mc-accordion__trigger"),g(_,"type","button"),g(_,"aria-controls","content"),g(_,"aria-expanded",H=!e[9]),_.disabled=e[4],g(c,"class","mc-accordion__title"),g(i,"class","mc-accordion__header"),g(V,"id",j=`content-${e[7]}`),g(V,"class","mc-accordion__content"),g(V,"aria-hidden",e[9]),g(V,"aria-labelledby","m-accordion"),h(o,O),b(o,"is-open",e[9]),b(o,"mc-accordion--no-padding",e[5]),b(o,"mc-accordion--checkable",e[6]),b(o,"is-disabled",e[4])},m(r,s){a(r,o,s),p(o,i),p(i,t),p(i,n),p(i,c),p(c,_),T&&T.m(_,null),p(_,v),q&&q.m(_,null),p(_,$),p(_,k),p(_,E),p(_,C),p(o,B),p(o,V),p(V,L),R||(S=w(_,"click",e[11]),R=!0)},p(e,[i]){e[2]?T?T.p(e,i):(T=y(e),T.c(),T.m(_,v)):T&&(T.d(1),T=null),e[12].icon?q||(q=z(),q.c(),q.m(_,$)):q&&(q.d(1),q=null),1&i&&u(k,e[0]),128&i&&M!==(M=`m-accordion-${e[7]}`)&&g(_,"id",M),512&i&&H!==(H=!e[9])&&g(_,"aria-expanded",H),16&i&&(_.disabled=e[4]),128&i&&j!==(j=`content-${e[7]}`)&&g(V,"id",j),512&i&&g(V,"aria-hidden",e[9]),h(o,O=x(A,[1026&i&&Z!==(Z="mc-accordion"+(e[1]?` mc-accordion--${e[1]}`:"")+" "+(e[10]?e[10]:""))&&{class:Z},256&i&&e[8]])),b(o,"is-open",e[9]),b(o,"mc-accordion--no-padding",e[5]),b(o,"mc-accordion--checkable",e[6]),b(o,"is-disabled",e[4])},i:m,o:m,d(e){e&&f(o),T&&T.d(),q&&q.d(),R=!1,S()}}}function H(e,o,i){return"s"===i?`${e} size="1.5rem"`:`${e} size="2rem" fill="${o}"`}function B(e,o,i){let t,a,n;const c=["label","size","iconname","iconcolor","open","disabled","nopadding","checkable","id"];let s=_(o,c),{$$slots:d={},$$scope:l}=o;const m=v(d);let{label:g}=o,{size:h="m"}=o,{iconname:b}=o,{iconcolor:p}=o,{open:w=!1}=o,{disabled:u=!1}=o,{nopadding:x=!1}=o,{checkable:f=!1}=o,{id:y}=o,z=new C($(),k());return e.$$set=e=>{i(16,o=r(r({},o),E(e))),i(15,s=_(o,c)),"label"in e&&i(0,g=e.label),"size"in e&&i(1,h=e.size),"iconname"in e&&i(2,b=e.iconname),"iconcolor"in e&&i(3,p=e.iconcolor),"open"in e&&i(13,w=e.open),"disabled"in e&&i(4,u=e.disabled),"nopadding"in e&&i(5,x=e.nopadding),"checkable"in e&&i(6,f=e.checkable),"id"in e&&i(7,y=e.id)},e.$$.update=()=>{8192&e.$$.dirty&&i(9,t=!!w),i(10,a=o.class),i(8,n=Object.assign({},s)),256&e.$$.dirty&&delete n.class},o=E(o),[g,h,b,p,u,x,f,y,n,t,a,function(){z.dispatch("on-heading-click",t),i(9,t=!t)},m,w]}class V extends e{constructor(e){super();const r=document.createElement("style");r.textContent=".mc-accordion{background-color:#ffffff;border-bottom:1px solid #666666;font-family:\"Roboto\", sans-serif;font-weight:400}.mc-accordion .mc-accordion__icon{height:2rem;width:2rem}.mc-accordion .mc-accordion__title{font-size:1.125rem;line-height:1.3333333333}.mc-accordion button.mc-accordion__trigger{padding-top:1.25rem;padding-right:3rem;padding-bottom:1.25rem}.mc-accordion button.mc-accordion__trigger::before{content:\"\";position:absolute;top:calc(50% - 0.75rem);right:0.5rem;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='2rem' width='2rem' fill='%23191919' viewBox='0 0 24 24'%3E%3Cpath d='M19.09,11h-6V5a1,1,0,0,0-2,0v6h-6a1,1,0,0,0,0,2h6v6a1,1,0,0,0,2,0V13h6a1,1,0,0,0,0-2Z'/%3E%3C/svg%3E\");background-size:1.5rem;width:1.5rem;height:1.5rem}.mc-accordion button.mc-accordion__trigger:disabled::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='2rem' width='2rem' fill='%23666666' viewBox='0 0 24 24'%3E%3Cpath d='M19.09,11h-6V5a1,1,0,0,0-2,0v6h-6a1,1,0,0,0,0,2h6v6a1,1,0,0,0,2,0V13h6a1,1,0,0,0,0-2Z'/%3E%3C/svg%3E\")}.mc-accordion.is-open>.mc-accordion__header button.mc-accordion__trigger::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='2rem' width='2rem' fill='%23191919' viewBox='0 0 24 24'%3E%3Cpath d='M17.09,13h-10a1,1,0,0,1,0-2h10a1,1,0,0,1,0,2Z'/%3E%3C/svg%3E\")}.mc-accordion.is-open>.mc-accordion__header button.mc-accordion__trigger:disabled::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='2rem' width='2rem' fill='%23666666' viewBox='0 0 24 24'%3E%3Cpath d='M17.09,13h-10a1,1,0,0,1,0-2h10a1,1,0,0,1,0,2Z'/%3E%3C/svg%3E\")}.mc-accordion__label{font-weight:700;position:relative;background-position:right 0.5rem center;background-repeat:no-repeat;color:#191919;cursor:pointer;display:block;padding-left:0.5rem;position:relative}.mc-accordion__label::after{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;top:-0.125rem;right:-0.125rem;bottom:-3px;left:-0.125rem}.mc-accordion__label:hover{background-color:#e6e6e6}.mc-accordion__label--no-padding{padding-left:0}.mc-accordion__label--icon{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0.5rem}.mc-accordion__icon{fill:#808080}.mc-accordion__content{font-size:1rem;line-height:1.375;color:#333333;height:auto;max-height:0;overflow:hidden;padding-left:0.5rem;-webkit-transition:0.3s ease-out;-o-transition:0.3s ease-out;transition:0.3s ease-out;visibility:hidden}.mc-accordion__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mc-accordion__header:hover{background-color:#e6e6e6}.mc-accordion__title{font-weight:700;color:#191919;width:100%;margin-top:0;margin-bottom:0}.mc-accordion button.mc-accordion__trigger{margin:0;-webkit-box-shadow:none;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;position:relative;background-position:right 0.5rem center;background-repeat:no-repeat;background-color:transparent;color:currentColor;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0.5rem;padding-left:0.5rem;text-align:left;width:100%}.mc-accordion button.mc-accordion__trigger::after{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;top:-0.125rem;right:-0.125rem;bottom:-3px;left:-0.125rem}.mc-accordion button.mc-accordion__trigger:focus::after{-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;-webkit-box-shadow:0 0 0 0.125rem #758992;box-shadow:0 0 0 0.125rem #758992}.mc-accordion button.mc-accordion__trigger:disabled{background-color:#e6e6e6;color:#666666;cursor:not-allowed}.mc-accordion.is-open>.mc-accordion__content{max-height:10000vh;padding-top:0.5rem;padding-bottom:calc(1.5rem - 1px);visibility:visible}.mc-accordion.is-disabled>.mc-accordion__content{color:#666666;cursor:not-allowed}.mc-accordion--checkable .mc-accordion__header{padding-left:0.5rem;position:relative}.mc-accordion--checkable .mc-accordion__trigger{position:static}.mc-accordion--no-padding .mc-accordion__header,.mc-accordion--no-padding .mc-accordion__trigger{padding-left:0}.mc-accordion--s .mc-accordion__icon{height:1.5rem;width:1.5rem}.mc-accordion--s .mc-accordion__title{font-size:1rem;line-height:1.375}.mc-accordion--s button.mc-accordion__trigger{padding-top:1rem;padding-right:2.5rem;padding-bottom:1rem}.mc-accordion--s button.mc-accordion__trigger::before{content:\"\";position:absolute;top:calc(50% - 0.5rem);right:0.5rem;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M13 7H9V3a1 1 0 00-2 0v4H3a1 1 0 000 2h4v4a1 1 0 002 0V9h4a1 1 0 000-2z'/%3E%3C/svg%3E\");background-size:1rem;width:1rem;height:1rem}.mc-accordion--s button.mc-accordion__trigger:disabled::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23666666' viewBox='0 0 16 16'%3E%3Cpath d='M13 7H9V3a1 1 0 00-2 0v4H3a1 1 0 000 2h4v4a1 1 0 002 0V9h4a1 1 0 000-2z'/%3E%3C/svg%3E\")}.mc-accordion--s.is-open>.mc-accordion__header button.mc-accordion__trigger::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E\")}.mc-accordion--s.is-open>.mc-accordion__header button.mc-accordion__trigger:disabled::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23666666' viewBox='0 0 16 16'%3E%3Cpath d='M12 9H4a1 1 0 010-2h8a1 1 0 010 2z'/%3E%3C/svg%3E\")}:host{display:block}",this.shadowRoot.appendChild(r),o(this,{target:this.shadowRoot,props:{...i(this.attributes),$$slots:t(this)},customElement:!0},B,M,c,{label:0,size:1,iconname:2,iconcolor:3,open:13,disabled:4,nopadding:5,checkable:6,id:7},null),e&&(e.target&&a(e.target,this,e.anchor),e.props&&(this.$set(e.props),n()))}static get observedAttributes(){return["label","size","iconname","iconcolor","open","disabled","nopadding","checkable","id"]}get label(){return this.$$.ctx[0]}set label(e){this.$$set({label:e}),n()}get size(){return this.$$.ctx[1]}set size(e){this.$$set({size:e}),n()}get iconname(){return this.$$.ctx[2]}set iconname(e){this.$$set({iconname:e}),n()}get iconcolor(){return this.$$.ctx[3]}set iconcolor(e){this.$$set({iconcolor:e}),n()}get open(){return this.$$.ctx[13]}set open(e){this.$$set({open:e}),n()}get disabled(){return this.$$.ctx[4]}set disabled(e){this.$$set({disabled:e}),n()}get nopadding(){return this.$$.ctx[5]}set nopadding(e){this.$$set({nopadding:e}),n()}get checkable(){return this.$$.ctx[6]}set checkable(e){this.$$set({checkable:e}),n()}get id(){return this.$$.ctx[7]}set id(e){this.$$set({id:e}),n()}}export{V as default};
|
|
2
2
|
//# sourceMappingURL=Accordion.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.js","sources":["../../../../src/components/accordion/Accordion.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import type { AccordionSize } from './accordion.types';\n import { EventHandler } from '../../utilities/EventHandler';\n import {\n get_current_component,\n createEventDispatcher,\n } from 'svelte/internal';\n\n export let label: string;\n export let size: AccordionSize = 'm';\n export let iconname: string | undefined = undefined;\n export let iconcolor: string | undefined = undefined;\n export let open = false;\n export let disabled = false;\n export let nopadding = false;\n export let checkable = false;\n let eventHandler = new EventHandler(\n get_current_component(),\n createEventDispatcher(),\n );\n $: isOpen = open ? true : false;\n $: userClass = $$props.class;\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n\n function generateIconName(\n iconname: string,\n iconcolor: string,\n iconsize: string,\n ): string {\n return iconsize === 's'\n ? `${iconname} size=\"1.5rem\"`\n : `${iconname} size=\"2rem\" fill=\"${iconcolor}\"`;\n }\n\n function handleState(): void {\n eventHandler.dispatch('on-heading-click', isOpen);\n isOpen = !isOpen;\n }\n</script>\n\n<div\n class=\"mc-accordion{size ? ` mc-accordion--${size}` : ''}\n {userClass ? userClass : ''}\"\n class:is-open={isOpen}\n class:mc-accordion--no-padding={nopadding}\n class:mc-accordion--checkable={checkable}\n class:is-disabled={disabled}\n {...attributes}\n>\n <div class=\"mc-accordion__header\">\n <slot name=\"beforeLabel\" />\n <h2 class=\"mc-accordion__title\">\n <button\n id
|
|
1
|
+
{"version":3,"file":"Accordion.js","sources":["../../../../src/components/accordion/Accordion.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import type { AccordionSize } from './accordion.types';\n import { EventHandler } from '../../utilities/EventHandler';\n import {\n get_current_component,\n createEventDispatcher,\n } from 'svelte/internal';\n\n export let label: string;\n export let size: AccordionSize = 'm';\n export let iconname: string | undefined = undefined;\n export let iconcolor: string | undefined = undefined;\n export let open = false;\n export let disabled = false;\n export let nopadding = false;\n export let checkable = false;\n export let id: string;\n let eventHandler = new EventHandler(\n get_current_component(),\n createEventDispatcher(),\n );\n $: isOpen = open ? true : false;\n $: userClass = $$props.class;\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n\n function generateIconName(\n iconname: string,\n iconcolor: string,\n iconsize: string,\n ): string {\n return iconsize === 's'\n ? `${iconname} size=\"1.5rem\"`\n : `${iconname} size=\"2rem\" fill=\"${iconcolor}\"`;\n }\n\n function handleState(): void {\n eventHandler.dispatch('on-heading-click', isOpen);\n isOpen = !isOpen;\n }\n</script>\n\n<div\n class=\"mc-accordion{size ? ` mc-accordion--${size}` : ''}\n {userClass ? userClass : ''}\"\n class:is-open={isOpen}\n class:mc-accordion--no-padding={nopadding}\n class:mc-accordion--checkable={checkable}\n class:is-disabled={disabled}\n {...attributes}\n>\n <div class=\"mc-accordion__header\">\n <slot name=\"beforeLabel\" />\n <h2 class=\"mc-accordion__title\">\n <button\n id={`m-accordion-${id}`}\n class=\"mc-accordion__trigger\"\n type=\"button\"\n aria-controls=\"content\"\n aria-expanded={!isOpen}\n {disabled}\n on:click={handleState}\n >\n {#if iconname}\n <span class=\"mc-accordion__icon\">\n {@html `<${generateIconName(iconname, String(iconcolor), size)} />`}\n </span>\n {/if}\n {#if $$slots.icon}\n <!-- This <hr> and slot will render only if a slot named \"description\" is provided. -->\n <span class=\"mc-accordion__icon\">\n <slot name=\"icon\" />\n </span>\n {/if}\n {label}\n <slot name=\"afterLabel\" />\n </button>\n </h2>\n </div>\n <div\n id={`content-${id}`}\n class=\"mc-accordion__content\"\n aria-hidden={isOpen}\n aria-labelledby=\"m-accordion\"\n >\n <slot />\n </div>\n</div>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import '@mozaic-ds/styles/components/c.accordion';\n\n :host {\n display: block;\n }\n</style>\n"],"names":["raw_value","generateIconName","ctx","String","insert","target","span","anchor","dirty","innerHTML","create_if_block_1","if_block1","icon","create_if_block","div2","append","div0","slot0","h2","button","slot1","div1","slot2","class","div2_class_value","iconname","iconcolor","iconsize","label","$$props","size","open","disabled","nopadding","checkable","id","eventHandler","EventHandler","get_current_component","createEventDispatcher","isOpen","$$invalidate","userClass","attributes","Object","assign","$$restProps","dispatch"],"mappings":"sRAmEuBA,EAAA,IAAAC,EAAiBC,EAAQ,GAAEC,OAAOD,MAAYA,EAAI,0EAD/DE,EAEMC,EAAAC,EAAAC,yBADO,GAAAC,GAAAR,KAAAA,EAAA,IAAAC,EAAiBC,EAAQ,GAAEC,OAAOD,MAAYA,EAAI,YAAAI,EAAAG,UAAAT,gJAK/DI,EAEMC,EAAAC,EAAAC,+EATHL,EAAQ,IAAAQ,EAAAR,GAKRS,EAAAT,MAAQU,MAAIC,gCAzBHX,EAAI,qBAAqBA,EAAI,KAAK,IACrD,KAAAA,EAAY,IAAAA,MAAY,KAKrBA,EAAU,8JAyBPA,EAAK,yIAnBaA,EAAE,sHAILA,EAAM,iHAqBXA,EAAE,6DAEJA,EAAM,8DArCNA,EAAM,mCACWA,EAAS,kCACVA,EAAS,sBACrBA,EAAQ,YAN7BE,EA6CKC,EAAAS,EAAAP,GApCHQ,EA2BKD,EAAAE,GA1BHD,EAA0BC,EAAAC,UAC1BF,EAwBIC,EAAAE,GAvBFH,EAsBQG,EAAAC,6DADNJ,EAAyBI,EAAAC,UAI/BL,EAOKD,EAAAO,GADHN,EAAOM,EAAAC,qBAxBOpB,EAAW,qBAEhBA,EAAQ,yDAKRA,MAAQU,2DAMZV,EAAK,iCAnBaA,EAAE,kCAILA,EAAM,6EAqBXA,EAAE,4CAEJA,EAAM,8CAvCDA,EAAI,qBAAqBA,EAAI,KAAK,IACrD,KAAAA,EAAY,IAAAA,MAAY,MAAE,CAAAqB,MAAAC,UAKvBtB,EAAU,oBAJCA,EAAM,mCACWA,EAAS,kCACVA,EAAS,sBACrBA,EAAQ,uDAtBlB,SAAAD,EACPwB,EACAC,EACAC,GAEO,MAAa,MAAbA,KACAF,kBACA,GAAAA,uBAA8BC,+LAzB5BE,GAAaC,GACbC,KAAAA,EAAsB,KAAGD,GACzBJ,SAAAA,GAAwCI,GACxCH,UAAAA,GAAyCG,GACzCE,KAAAA,GAAO,GAAKF,GACZG,SAAAA,GAAW,GAAKH,GAChBI,UAAAA,GAAY,GAAKJ,GACjBK,UAAAA,GAAY,GAAKL,MACjBM,GAAUN,EACjBO,EAAmB,IAAAC,EACrBC,IACAC,6XAECC,IAAST,GACTU,EAAA,GAAAC,EAAYb,EAAQN,WACpBoB,EAALC,OAAAC,UAAuBC,2BACXH,EAAWpB,gDAanBa,EAAaW,SAAS,mBAAoBP,GAC1CC,EAAA,EAAAD,GAAUA"}
|
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
export let disabled = false;
|
|
17
17
|
export let nopadding = false;
|
|
18
18
|
export let checkable = false;
|
|
19
|
+
export let id: string;
|
|
19
20
|
let eventHandler = new EventHandler(
|
|
20
21
|
get_current_component(),
|
|
21
22
|
createEventDispatcher(),
|
|
@@ -54,7 +55,7 @@
|
|
|
54
55
|
<slot name="beforeLabel" />
|
|
55
56
|
<h2 class="mc-accordion__title">
|
|
56
57
|
<button
|
|
57
|
-
id=
|
|
58
|
+
id={`m-accordion-${id}`}
|
|
58
59
|
class="mc-accordion__trigger"
|
|
59
60
|
type="button"
|
|
60
61
|
aria-controls="content"
|
|
@@ -79,7 +80,7 @@
|
|
|
79
80
|
</h2>
|
|
80
81
|
</div>
|
|
81
82
|
<div
|
|
82
|
-
id=
|
|
83
|
+
id={`content-${id}`}
|
|
83
84
|
class="mc-accordion__content"
|
|
84
85
|
aria-hidden={isOpen}
|
|
85
86
|
aria-labelledby="m-accordion"
|