carbon-components-svelte/assets/ToggleSmall.620ebfa2.js
2020-10-02 19:51:57 -07:00

1 line
17 KiB
JavaScript

let a=document.createElement("style");a.innerHTML="",document.head.appendChild(a);import{S as n,i as s,s as t,w as e,g as o,j as l,h as p,L as c,k as i,l as r,p as u,n as g,o as f,N as d,y as k,x as m,q as $,r as h,I as b,M as x,A as v,Y as T,J as w,B as E,C as S,G as _,c as y,a as A,m as P,t as L,b as B,d as j}from"./index.e7d8faec.js";import"./Button.2d988908.js";import"./index.afebacfb.js";import{C as D,P as I}from"./Preview.56cdfa1f.js";import"./ChevronDown16.a487f433.js";import"./Loading.f65f7ed1.js";import"./Column.a6aa8264.js";import"./Content.9363af19.js";import"./store.7f148588.js";function N(a){let n,s,t,E,S,_,y,A,P,L,B,j,D,I,N,C,H,M,U=[a[7]],R={};for(let a=0;a<U.length;a+=1)R=e(R,U[a]);return{c(){n=o("div"),s=o("input"),t=l(),E=o("label"),S=p(a[4]),_=l(),y=o("span"),A=c("svg"),P=c("path"),L=l(),B=o("span"),j=p(a[2]),D=l(),I=o("span"),N=p(a[3]),this.h()},l(e){n=i(e,"DIV",{});var o=r(n);s=i(o,"INPUT",{type:!0,checked:!0,disabled:!0,id:!0,name:!0}),t=u(o),E=i(o,"LABEL",{"aria-label":!0,for:!0});var l=r(E);S=g(l,a[4]),_=u(l),y=i(l,"SPAN",{});var p=r(y);A=i(p,"svg",{width:!0,height:!0,viewBox:!0},1);var c=r(A);P=i(c,"path",{d:!0},1),r(P).forEach(f),c.forEach(f),L=u(p),B=i(p,"SPAN",{"aria-hidden":!0});var d=r(B);j=g(d,a[2]),d.forEach(f),D=u(p),I=i(p,"SPAN",{"aria-hidden":!0});var k=r(I);N=g(k,a[3]),k.forEach(f),p.forEach(f),l.forEach(f),o.forEach(f),this.h()},h(){d(s,"type","checkbox"),s.checked=a[0],s.disabled=a[1],d(s,"id",a[5]),d(s,"name",a[6]),k(s,"bx--toggle-input",!0),k(s,"bx--toggle-input--small",!0),d(P,"d","M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z"),d(A,"width","6"),d(A,"height","5"),d(A,"viewBox","0 0 6 5"),k(A,"bx--toggle__check",!0),d(B,"aria-hidden","true"),k(B,"bx--toggle__text--off",!0),d(I,"aria-hidden","true"),k(I,"bx--toggle__text--on",!0),k(y,"bx--toggle__switch",!0),d(E,"aria-label",C=a[4]?void 0:a[8]["aria-label"]||"Toggle"),d(E,"for",a[5]),k(E,"bx--toggle-input__label",!0),m(n,R),k(n,"bx--form-item",!0)},m(e,o){$(e,n,o),h(n,s),h(n,t),h(n,E),h(E,S),h(E,_),h(E,y),h(y,A),h(A,P),h(y,L),h(y,B),h(B,j),h(y,D),h(y,I),h(I,N),H||(M=[b(s,"change",a[13]),b(s,"change",a[17]),b(s,"keyup",a[14]),b(s,"keyup",a[18]),b(s,"focus",a[15]),b(s,"blur",a[16]),b(n,"click",a[9]),b(n,"mouseover",a[10]),b(n,"mouseenter",a[11]),b(n,"mouseleave",a[12])],H=!0)},p(a,[t]){1&t&&(s.checked=a[0]),2&t&&(s.disabled=a[1]),32&t&&d(s,"id",a[5]),64&t&&d(s,"name",a[6]),16&t&&x(S,a[4]),4&t&&x(j,a[2]),8&t&&x(N,a[3]),272&t&&C!==(C=a[4]?void 0:a[8]["aria-label"]||"Toggle")&&d(E,"aria-label",C),32&t&&d(E,"for",a[5]),m(n,R=v(U,[128&t&&a[7]])),k(n,"bx--form-item",!0)},i:T,o:T,d(a){a&&f(n),H=!1,w(M)}}}function C(a,n,s){const t=["toggled","disabled","labelA","labelB","labelText","id","name"];let o=E(n,t),{toggled:l=!1}=n,{disabled:p=!1}=n,{labelA:c="Off"}=n,{labelB:i="On"}=n,{labelText:r=""}=n,{id:u="ccs-"+Math.random().toString(36)}=n,{name:g}=n;return a.$$set=a=>{s(8,n=e(e({},n),S(a))),s(7,o=E(n,t)),"toggled"in a&&s(0,l=a.toggled),"disabled"in a&&s(1,p=a.disabled),"labelA"in a&&s(2,c=a.labelA),"labelB"in a&&s(3,i=a.labelB),"labelText"in a&&s(4,r=a.labelText),"id"in a&&s(5,u=a.id),"name"in a&&s(6,g=a.name)},n=S(n),[l,p,c,i,r,u,g,o,n,function(n){_(a,n)},function(n){_(a,n)},function(n){_(a,n)},function(n){_(a,n)},function(n){_(a,n)},function(n){_(a,n)},function(n){_(a,n)},function(n){_(a,n)},()=>{s(0,l=!l)},a=>{" "!==a.key&&"Enter"!==a.key||(a.preventDefault(),s(0,l=!l))}]}class H extends n{constructor(a){super(),s(this,a,C,N,t,{toggled:0,disabled:1,labelA:2,labelB:3,labelText:4,id:5,name:6})}}function M(a){let n,s;return{c(){n=o("span"),s=p(a[0]),this.h()},l(t){n=i(t,"SPAN",{});var e=r(n);s=g(e,a[0]),e.forEach(f),this.h()},h(){k(n,"bx--toggle__label-text",!0)},m(a,t){$(a,n,t),h(n,s)},p(a,n){1&n&&x(s,a[0])},d(a){a&&f(n)}}}function U(a){let n,s,t,p,g,x,E,S,_,y,A,P=a[0]&&M(a),L=[a[2]],B={};for(let a=0;a<L.length;a+=1)B=e(B,L[a]);return{c(){n=o("div"),s=o("input"),t=l(),p=o("label"),P&&P.c(),g=l(),x=o("span"),E=c("svg"),S=c("path"),this.h()},l(a){n=i(a,"DIV",{});var e=r(n);s=i(e,"INPUT",{type:!0,id:!0}),t=u(e),p=i(e,"LABEL",{"aria-label":!0,for:!0});var o=r(p);P&&P.l(o),g=u(o),x=i(o,"SPAN",{});var l=r(x);E=i(l,"svg",{width:!0,height:!0,viewBox:!0},1);var c=r(E);S=i(c,"path",{d:!0},1),r(S).forEach(f),c.forEach(f),l.forEach(f),o.forEach(f),e.forEach(f),this.h()},h(){d(s,"type","checkbox"),d(s,"id",a[1]),k(s,"bx--toggle",!0),k(s,"bx--toggle--small",!0),k(s,"bx--skeleton",!0),d(S,"d","M2.2403 2.7299L4.9245 0 6 1.1117 2.2384 5 0 2.6863 1.0612 1.511z"),d(E,"width","6"),d(E,"height","5"),d(E,"viewBox","0 0 6 5"),k(E,"bx--toggle__check",!0),k(x,"bx--toggle__appearance",!0),d(p,"aria-label",_=a[0]?void 0:a[3]["aria-label"]||"Toggle is loading"),d(p,"for",a[1]),k(p,"bx--toggle__label",!0),k(p,"bx--skeleton",!0),m(n,B),k(n,"bx--form-item",!0)},m(e,o){$(e,n,o),h(n,s),h(n,t),h(n,p),P&&P.m(p,null),h(p,g),h(p,x),h(x,E),h(E,S),y||(A=[b(n,"click",a[4]),b(n,"mouseover",a[5]),b(n,"mouseenter",a[6]),b(n,"mouseleave",a[7])],y=!0)},p(a,[t]){2&t&&d(s,"id",a[1]),a[0]?P?P.p(a,t):(P=M(a),P.c(),P.m(p,g)):P&&(P.d(1),P=null),9&t&&_!==(_=a[0]?void 0:a[3]["aria-label"]||"Toggle is loading")&&d(p,"aria-label",_),2&t&&d(p,"for",a[1]),m(n,B=v(L,[4&t&&a[2]])),k(n,"bx--form-item",!0)},i:T,o:T,d(a){a&&f(n),P&&P.d(),y=!1,w(A)}}}function R(a,n,s){const t=["labelText","id"];let o=E(n,t),{labelText:l=""}=n,{id:p="ccs-"+Math.random().toString(36)}=n;return a.$$set=a=>{s(3,n=e(e({},n),S(a))),s(2,o=E(n,t)),"labelText"in a&&s(0,l=a.labelText),"id"in a&&s(1,p=a.id)},n=S(n),[l,p,o,n,function(n){_(a,n)},function(n){_(a,n)},function(n){_(a,n)},function(n){_(a,n)}]}class Y extends n{constructor(a){super(),s(this,a,R,U,t,{labelText:0,id:1})}}function V(a){let n,s;return n=new H({props:{labelText:"Push notifications"}}),{c(){y(n.$$.fragment)},l(a){A(n.$$.fragment,a)},m(a,t){P(n,a,t),s=!0},p:T,i(a){s||(L(n.$$.fragment,a),s=!0)},o(a){B(n.$$.fragment,a),s=!1},d(a){j(n,a)}}}function z(a){let n,s;return n=new H({props:{labelText:"Push notifications",toggled:!0}}),{c(){y(n.$$.fragment)},l(a){A(n.$$.fragment,a)},m(a,t){P(n,a,t),s=!0},p:T,i(a){s||(L(n.$$.fragment,a),s=!0)},o(a){B(n.$$.fragment,a),s=!1},d(a){j(n,a)}}}function O(a){let n,s;return n=new H({props:{labelText:"Push notifications",labelA:"No",labelB:"Yes"}}),{c(){y(n.$$.fragment)},l(a){A(n.$$.fragment,a)},m(a,t){P(n,a,t),s=!0},p:T,i(a){s||(L(n.$$.fragment,a),s=!0)},o(a){B(n.$$.fragment,a),s=!1},d(a){j(n,a)}}}function q(a){let n,s;return n=new H({props:{labelText:"Push notifications",disabled:!0}}),{c(){y(n.$$.fragment)},l(a){A(n.$$.fragment,a)},m(a,t){P(n,a,t),s=!0},p:T,i(a){s||(L(n.$$.fragment,a),s=!0)},o(a){B(n.$$.fragment,a),s=!1},d(a){j(n,a)}}}function G(a){let n,s;return n=new Y({}),{c(){y(n.$$.fragment)},l(a){A(n.$$.fragment,a)},m(a,t){P(n,a,t),s=!0},i(a){s||(L(n.$$.fragment,a),s=!0)},o(a){B(n.$$.fragment,a),s=!1},d(a){j(n,a)}}}function J(a){let n,s,t,e,c,k,m,b,x,v,T,w,E,S,_,y,A,P,L,B,j,D,I,N,C,H;return{c(){n=o("div"),s=o("ul"),t=o("li"),e=o("a"),c=p("Usage"),k=l(),m=o("ul"),b=o("li"),x=o("a"),v=p("Default (untoggled)"),T=l(),w=o("li"),E=o("a"),S=p("Toggled"),_=l(),y=o("li"),A=o("a"),P=p("Custom labels"),L=l(),B=o("li"),j=o("a"),D=p("Disabled"),I=l(),N=o("li"),C=o("a"),H=p("Skeleton"),this.h()},l(a){n=i(a,"DIV",{slot:!0});var o=r(n);s=i(o,"UL",{class:!0});var l=r(s);t=i(l,"LI",{class:!0});var p=r(t);e=i(p,"A",{class:!0,href:!0});var d=r(e);c=g(d,"Usage"),d.forEach(f),k=u(p),m=i(p,"UL",{class:!0});var $=r(m);b=i($,"LI",{class:!0});var h=r(b);x=i(h,"A",{class:!0,href:!0});var M=r(x);v=g(M,"Default (untoggled)"),M.forEach(f),h.forEach(f),T=u($),w=i($,"LI",{class:!0});var U=r(w);E=i(U,"A",{class:!0,href:!0});var R=r(E);S=g(R,"Toggled"),R.forEach(f),U.forEach(f),_=u($),y=i($,"LI",{class:!0});var Y=r(y);A=i(Y,"A",{class:!0,href:!0});var V=r(A);P=g(V,"Custom labels"),V.forEach(f),Y.forEach(f),L=u($),B=i($,"LI",{class:!0});var z=r(B);j=i(z,"A",{class:!0,href:!0});var O=r(j);D=g(O,"Disabled"),O.forEach(f),z.forEach(f),I=u($),N=i($,"LI",{class:!0});var q=r(N);C=i(q,"A",{class:!0,href:!0});var G=r(C);H=g(G,"Skeleton"),G.forEach(f),q.forEach(f),$.forEach(f),p.forEach(f),l.forEach(f),o.forEach(f),this.h()},h(){d(e,"class","bx--link"),d(e,"href","#usage"),d(x,"class","bx--link"),d(x,"href","#default-untoggled"),d(b,"class","bx--list__item"),d(E,"class","bx--link"),d(E,"href","#toggled"),d(w,"class","bx--list__item"),d(A,"class","bx--link"),d(A,"href","#custom-labels"),d(y,"class","bx--list__item"),d(j,"class","bx--link"),d(j,"href","#disabled"),d(B,"class","bx--list__item"),d(C,"class","bx--link"),d(C,"href","#skeleton"),d(N,"class","bx--list__item"),d(m,"class","bx--list--unordered bx--list--nested"),d(t,"class","bx--list__item"),d(s,"class","bx--list--unordered"),d(n,"slot","aside")},m(a,o){$(a,n,o),h(n,s),h(s,t),h(t,e),h(e,c),h(t,k),h(t,m),h(m,b),h(b,x),h(x,v),h(m,T),h(m,w),h(w,E),h(E,S),h(m,_),h(m,y),h(y,A),h(A,P),h(m,L),h(m,B),h(B,j),h(j,D),h(m,I),h(m,N),h(N,C),h(C,H)},d(a){a&&f(n)}}}function F(a){let n,s,t,e,c,k,m,b,x,v,T,w,E,S,_,D,N,C,H,M,U,R,Y,J,F,K;return e=new I({props:{codeRaw:'<script>\n import { ToggleSmall } from "carbon-components-svelte";\n<\/script>\n\n<ToggleSmall labelText="Push notifications" />\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n <span class="token keyword">import</span> <span class="token punctuation">{</span> ToggleSmall <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ToggleSmall</span> <span class="token attr-name">labelText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Push notifications<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>\n',$$slots:{default:[V]},$$scope:{ctx:a}}}),x=new I({props:{codeRaw:'<script>\n import { ToggleSmall } from "carbon-components-svelte";\n<\/script>\n\n<ToggleSmall labelText="Push notifications" toggled />\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n <span class="token keyword">import</span> <span class="token punctuation">{</span> ToggleSmall <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ToggleSmall</span> <span class="token attr-name">labelText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Push notifications<span class="token punctuation">"</span></span> <span class="token attr-name">toggled</span> <span class="token punctuation">/></span></span>\n',$$slots:{default:[z]},$$scope:{ctx:a}}}),S=new I({props:{codeRaw:'<script>\n import { ToggleSmall } from "carbon-components-svelte";\n<\/script>\n\n<ToggleSmall labelText="Push notifications" labelA="No" labelB="Yes" />\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n <span class="token keyword">import</span> <span class="token punctuation">{</span> ToggleSmall <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ToggleSmall</span> <span class="token attr-name">labelText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Push notifications<span class="token punctuation">"</span></span> <span class="token attr-name">labelA</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>No<span class="token punctuation">"</span></span> <span class="token attr-name">labelB</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Yes<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>\n',$$slots:{default:[O]},$$scope:{ctx:a}}}),H=new I({props:{codeRaw:'<script>\n import { ToggleSmall } from "carbon-components-svelte";\n<\/script>\n\n<ToggleSmall labelText="Push notifications" disabled />\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n <span class="token keyword">import</span> <span class="token punctuation">{</span> ToggleSmall <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ToggleSmall</span> <span class="token attr-name">labelText</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>Push notifications<span class="token punctuation">"</span></span> <span class="token attr-name">disabled</span> <span class="token punctuation">/></span></span>\n',$$slots:{default:[q]},$$scope:{ctx:a}}}),J=new I({props:{codeRaw:'<script>\n import { ToggleSmallSkeleton } from "carbon-components-svelte";\n<\/script>\n\n<ToggleSmallSkeleton />\n',code:'<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">\n <span class="token keyword">import</span> <span class="token punctuation">{</span> ToggleSmallSkeleton <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"carbon-components-svelte"</span><span class="token punctuation">;</span>\n</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">></span></span>\n\n<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>ToggleSmallSkeleton</span> <span class="token punctuation">/></span></span>\n',$$slots:{default:[G]},$$scope:{ctx:a}}}),{c(){n=o("h3"),s=p("Default (untoggled)"),t=l(),y(e.$$.fragment),c=l(),k=o("h3"),m=p("Toggled"),b=l(),y(x.$$.fragment),v=l(),T=o("h3"),w=p("Custom labels"),E=l(),y(S.$$.fragment),_=l(),D=o("h3"),N=p("Disabled"),C=l(),y(H.$$.fragment),M=l(),U=o("h3"),R=p("Skeleton"),Y=l(),y(J.$$.fragment),F=l(),this.h()},l(a){n=i(a,"H3",{id:!0});var o=r(n);s=g(o,"Default (untoggled)"),o.forEach(f),t=u(a),A(e.$$.fragment,a),c=u(a),k=i(a,"H3",{id:!0});var l=r(k);m=g(l,"Toggled"),l.forEach(f),b=u(a),A(x.$$.fragment,a),v=u(a),T=i(a,"H3",{id:!0});var p=r(T);w=g(p,"Custom labels"),p.forEach(f),E=u(a),A(S.$$.fragment,a),_=u(a),D=i(a,"H3",{id:!0});var d=r(D);N=g(d,"Disabled"),d.forEach(f),C=u(a),A(H.$$.fragment,a),M=u(a),U=i(a,"H3",{id:!0});var $=r(U);R=g($,"Skeleton"),$.forEach(f),Y=u(a),A(J.$$.fragment,a),F=u(a),this.h()},h(){d(n,"id","default-untoggled"),d(k,"id","toggled"),d(T,"id","custom-labels"),d(D,"id","disabled"),d(U,"id","skeleton")},m(a,o){$(a,n,o),h(n,s),$(a,t,o),P(e,a,o),$(a,c,o),$(a,k,o),h(k,m),$(a,b,o),P(x,a,o),$(a,v,o),$(a,T,o),h(T,w),$(a,E,o),P(S,a,o),$(a,_,o),$(a,D,o),h(D,N),$(a,C,o),P(H,a,o),$(a,M,o),$(a,U,o),h(U,R),$(a,Y,o),P(J,a,o),$(a,F,o),K=!0},p(a,n){const s={};1&n&&(s.$$scope={dirty:n,ctx:a}),e.$set(s);const t={};1&n&&(t.$$scope={dirty:n,ctx:a}),x.$set(t);const o={};1&n&&(o.$$scope={dirty:n,ctx:a}),S.$set(o);const l={};1&n&&(l.$$scope={dirty:n,ctx:a}),H.$set(l);const p={};1&n&&(p.$$scope={dirty:n,ctx:a}),J.$set(p)},i(a){K||(L(e.$$.fragment,a),L(x.$$.fragment,a),L(S.$$.fragment,a),L(H.$$.fragment,a),L(J.$$.fragment,a),K=!0)},o(a){B(e.$$.fragment,a),B(x.$$.fragment,a),B(S.$$.fragment,a),B(H.$$.fragment,a),B(J.$$.fragment,a),K=!1},d(a){a&&f(n),a&&f(t),j(e,a),a&&f(c),a&&f(k),a&&f(b),j(x,a),a&&f(v),a&&f(T),a&&f(E),j(S,a),a&&f(_),a&&f(D),a&&f(C),j(H,a),a&&f(M),a&&f(U),a&&f(Y),j(J,a),a&&f(F)}}}function K(a){let n,s;return n=new D({props:{$$slots:{default:[F],aside:[J]},$$scope:{ctx:a}}}),{c(){y(n.$$.fragment)},l(a){A(n.$$.fragment,a)},m(a,t){P(n,a,t),s=!0},p(a,[s]){const t={};1&s&&(t.$$scope={dirty:s,ctx:a}),n.$set(t)},i(a){s||(L(n.$$.fragment,a),s=!0)},o(a){B(n.$$.fragment,a),s=!1},d(a){j(n,a)}}}export default class extends n{constructor(a){super(),s(this,a,null,K,t,{})}}