@e280/shiny 0.1.0-11 → 0.1.0-13
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/README.md +3 -1
- package/package.json +3 -3
- package/s/components/button/component.ts +3 -3
- package/s/components/button/showcase.ts +119 -0
- package/s/components/button/style.css.ts +0 -1
- package/s/components/copy/component.ts +3 -1
- package/s/components/copy/showcase.ts +51 -0
- package/s/components/drawer/component.ts +30 -32
- package/s/components/drawer/showcase.ts +93 -0
- package/s/components/drawer/style.css.ts +9 -4
- package/s/components/tabs/showcase.ts +166 -0
- package/s/components/tabs/style.css.ts +7 -4
- package/s/demo/demo.bundle.ts +13 -281
- package/s/demo/demo.css +1 -0
- package/s/demo/lipsum.ts +6 -0
- package/s/demo/utils/lipsum.ts +1 -1
- package/s/demo/views/exhibit/style.css.ts +82 -0
- package/s/demo/views/exhibit/view.ts +61 -0
- package/s/demo/views/showcase/style.css.ts +53 -0
- package/s/demo/views/showcase/view.ts +54 -0
- package/s/demo/viewsets.ts +12 -0
- package/s/index.html.ts +4 -7
- package/s/themes/aura.css.ts +4 -4
- package/s/themes/infra/css-vars.ts +7 -2
- package/x/components/button/component.d.ts +2 -1
- package/x/components/button/component.js +2 -2
- package/x/components/button/component.js.map +1 -1
- package/x/components/button/showcase.d.ts +1 -0
- package/x/components/button/showcase.js +116 -0
- package/x/components/button/showcase.js.map +1 -0
- package/x/components/button/style.css.js +0 -1
- package/x/components/button/style.css.js.map +1 -1
- package/x/components/copy/component.d.ts +2 -2
- package/x/components/copy/component.js +3 -1
- package/x/components/copy/component.js.map +1 -1
- package/x/components/copy/showcase.d.ts +1 -0
- package/x/components/copy/showcase.js +48 -0
- package/x/components/copy/showcase.js.map +1 -0
- package/x/components/drawer/component.d.ts +3 -3
- package/x/components/drawer/component.js +28 -31
- package/x/components/drawer/component.js.map +1 -1
- package/x/components/drawer/showcase.d.ts +1 -0
- package/x/components/drawer/showcase.js +87 -0
- package/x/components/drawer/showcase.js.map +1 -0
- package/x/components/drawer/style.css.js +9 -4
- package/x/components/drawer/style.css.js.map +1 -1
- package/x/components/example/component.d.ts +1 -1
- package/x/components/tabs/component.d.ts +1 -1
- package/x/components/tabs/showcase.d.ts +1 -0
- package/x/components/tabs/showcase.js +162 -0
- package/x/components/tabs/showcase.js.map +1 -0
- package/x/components/tabs/style.css.js +7 -4
- package/x/components/tabs/style.css.js.map +1 -1
- package/x/demo/demo.bundle.js +13 -274
- package/x/demo/demo.bundle.js.map +1 -1
- package/x/demo/demo.bundle.min.js +473 -401
- package/x/demo/demo.bundle.min.js.map +4 -4
- package/x/demo/demo.css +1 -0
- package/x/demo/lipsum.d.ts +2 -0
- package/x/demo/lipsum.js +4 -0
- package/x/demo/lipsum.js.map +1 -0
- package/x/demo/utils/lipsum.js +1 -1
- package/x/demo/views/exhibit/style.css.js +81 -0
- package/x/demo/views/exhibit/style.css.js.map +1 -0
- package/x/demo/views/exhibit/view.d.ts +29 -0
- package/x/demo/views/exhibit/view.js +40 -0
- package/x/demo/views/exhibit/view.js.map +1 -0
- package/x/demo/views/showcase/style.css.d.ts +2 -0
- package/x/demo/views/showcase/style.css.js +52 -0
- package/x/demo/views/showcase/style.css.js.map +1 -0
- package/x/demo/views/showcase/view.d.ts +7 -0
- package/x/demo/views/showcase/view.js +40 -0
- package/x/demo/views/showcase/view.js.map +1 -0
- package/x/demo/{aura-views.d.ts → viewsets.d.ts} +5 -3
- package/x/demo/viewsets.js +9 -0
- package/x/demo/viewsets.js.map +1 -0
- package/x/index.html +5 -4
- package/x/index.html.js +4 -7
- package/x/index.html.js.map +1 -1
- package/x/install/aura.bundle.min.js +55 -49
- package/x/install/aura.bundle.min.js.map +3 -3
- package/x/install/plain.bundle.min.js +51 -45
- package/x/install/plain.bundle.min.js.map +3 -3
- package/x/shiny.d.ts +5 -5
- package/x/themes/aura.css.js +4 -4
- package/x/themes/infra/css-vars.d.ts +2 -1
- package/x/themes/infra/css-vars.js +2 -1
- package/x/themes/infra/css-vars.js.map +1 -1
- package/s/demo/aura-views.ts +0 -6
- package/s/demo/views/demonstration/style.css.ts +0 -124
- package/s/demo/views/demonstration/view.ts +0 -57
- package/x/demo/aura-views.js +0 -4
- package/x/demo/aura-views.js.map +0 -1
- package/x/demo/views/demonstration/style.css.js +0 -123
- package/x/demo/views/demonstration/style.css.js.map +0 -1
- package/x/demo/views/demonstration/view.d.ts +0 -12
- package/x/demo/views/demonstration/view.js +0 -44
- package/x/demo/views/demonstration/view.js.map +0 -1
- /package/x/demo/views/{demonstration → exhibit}/style.css.d.ts +0 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
var
|
|
2
|
-
\f\r]`,at=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,
|
|
3
|
-
\f\r"'\`<>=]|("|')|))|$)`,"g"),
|
|
1
|
+
var vt=globalThis,wt=vt.ShadowRoot&&(vt.ShadyCSS===void 0||vt.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,oe=Symbol(),ke=new WeakMap,nt=class{constructor(t,e,s){if(this._$cssResult$=!0,s!==oe)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o,e=this.t;if(wt&&t===void 0){let s=e!==void 0&&e.length===1;s&&(t=ke.get(e)),t===void 0&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),s&&ke.set(e,t))}return t}toString(){return this.cssText}},$t=r=>new nt(typeof r=="string"?r:r+"",void 0,oe),c=(r,...t)=>{let e=r.length===1?r[0]:t.reduce(((s,o,n)=>s+(i=>{if(i._$cssResult$===!0)return i.cssText;if(typeof i=="number")return i;throw Error("Value passed to 'css' function must be a 'css' function result: "+i+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(o)+r[n+1]),r[0]);return new nt(e,r,oe)},_t=(r,t)=>{if(wt)r.adoptedStyleSheets=t.map((e=>e instanceof CSSStyleSheet?e:e.styleSheet));else for(let e of t){let s=document.createElement("style"),o=vt.litNonce;o!==void 0&&s.setAttribute("nonce",o),s.textContent=e.cssText,r.appendChild(s)}},W=wt?r=>r:r=>r instanceof CSSStyleSheet?(t=>{let e="";for(let s of t.cssRules)e+=s.cssText;return $t(e)})(r):r;var{is:zr,defineProperty:Pr,getOwnPropertyDescriptor:Or,getOwnPropertyNames:Rr,getOwnPropertySymbols:Mr,getPrototypeOf:Br}=Object,At=globalThis,Ce=At.trustedTypes,Nr=Ce?Ce.emptyScript:"",Hr=At.reactiveElementPolyfillSupport,it=(r,t)=>r,ne={toAttribute(r,t){switch(t){case Boolean:r=r?Nr:null;break;case Object:case Array:r=r==null?r:JSON.stringify(r)}return r},fromAttribute(r,t){let e=r;switch(t){case Boolean:e=r!==null;break;case Number:e=r===null?null:Number(r);break;case Object:case Array:try{e=JSON.parse(r)}catch{e=null}}return e}},Te=(r,t)=>!zr(r,t),Ee={attribute:!0,type:String,converter:ne,reflect:!1,useDefault:!1,hasChanged:Te};Symbol.metadata??=Symbol("metadata"),At.litPropertyMetadata??=new WeakMap;var z=class extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,e=Ee){if(e.state&&(e.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(t)&&((e=Object.create(e)).wrapped=!0),this.elementProperties.set(t,e),!e.noAccessor){let s=Symbol(),o=this.getPropertyDescriptor(t,s,e);o!==void 0&&Pr(this.prototype,t,o)}}static getPropertyDescriptor(t,e,s){let{get:o,set:n}=Or(this.prototype,t)??{get(){return this[e]},set(i){this[e]=i}};return{get:o,set(i){let l=o?.call(this);n?.call(this,i),this.requestUpdate(t,l,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??Ee}static _$Ei(){if(this.hasOwnProperty(it("elementProperties")))return;let t=Br(this);t.finalize(),t.l!==void 0&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(it("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(it("properties"))){let e=this.properties,s=[...Rr(e),...Mr(e)];for(let o of s)this.createProperty(o,e[o])}let t=this[Symbol.metadata];if(t!==null){let e=litPropertyMetadata.get(t);if(e!==void 0)for(let[s,o]of e)this.elementProperties.set(s,o)}this._$Eh=new Map;for(let[e,s]of this.elementProperties){let o=this._$Eu(e,s);o!==void 0&&this._$Eh.set(o,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){let e=[];if(Array.isArray(t)){let s=new Set(t.flat(1/0).reverse());for(let o of s)e.unshift(W(o))}else t!==void 0&&e.push(W(t));return e}static _$Eu(t,e){let s=e.attribute;return s===!1?void 0:typeof s=="string"?s:typeof t=="string"?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)))}addController(t){(this._$EO??=new Set).add(t),this.renderRoot!==void 0&&this.isConnected&&t.hostConnected?.()}removeController(t){this._$EO?.delete(t)}_$E_(){let t=new Map,e=this.constructor.elementProperties;for(let s of e.keys())this.hasOwnProperty(s)&&(t.set(s,this[s]),delete this[s]);t.size>0&&(this._$Ep=t)}createRenderRoot(){let t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return _t(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach((t=>t.hostConnected?.()))}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()))}attributeChangedCallback(t,e,s){this._$AK(t,s)}_$ET(t,e){let s=this.constructor.elementProperties.get(t),o=this.constructor._$Eu(t,s);if(o!==void 0&&s.reflect===!0){let n=(s.converter?.toAttribute!==void 0?s.converter:ne).toAttribute(e,s.type);this._$Em=t,n==null?this.removeAttribute(o):this.setAttribute(o,n),this._$Em=null}}_$AK(t,e){let s=this.constructor,o=s._$Eh.get(t);if(o!==void 0&&this._$Em!==o){let n=s.getPropertyOptions(o),i=typeof n.converter=="function"?{fromAttribute:n.converter}:n.converter?.fromAttribute!==void 0?n.converter:ne;this._$Em=o;let l=i.fromAttribute(e,n.type);this[o]=l??this._$Ej?.get(o)??l,this._$Em=null}}requestUpdate(t,e,s){if(t!==void 0){let o=this.constructor,n=this[t];if(s??=o.getPropertyOptions(t),!((s.hasChanged??Te)(n,e)||s.useDefault&&s.reflect&&n===this._$Ej?.get(t)&&!this.hasAttribute(o._$Eu(t,s))))return;this.C(t,e,s)}this.isUpdatePending===!1&&(this._$ES=this._$EP())}C(t,e,{useDefault:s,reflect:o,wrapped:n},i){s&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,i??e??this[t]),n!==!0||i!==void 0)||(this._$AL.has(t)||(this.hasUpdated||s||(e=void 0),this._$AL.set(t,e)),o===!0&&this._$Em!==t&&(this._$Eq??=new Set).add(t))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(e){Promise.reject(e)}let t=this.scheduleUpdate();return t!=null&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(let[o,n]of this._$Ep)this[o]=n;this._$Ep=void 0}let s=this.constructor.elementProperties;if(s.size>0)for(let[o,n]of s){let{wrapped:i}=n,l=this[o];i!==!0||this._$AL.has(o)||l===void 0||this.C(o,void 0,n,l)}}let t=!1,e=this._$AL;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),this._$EO?.forEach((s=>s.hostUpdate?.())),this.update(e)):this._$EM()}catch(s){throw t=!1,this._$EM(),s}t&&this._$AE(e)}willUpdate(t){}_$AE(t){this._$EO?.forEach((e=>e.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Eq&&=this._$Eq.forEach((e=>this._$ET(e,this[e]))),this._$EM()}updated(t){}firstUpdated(t){}};z.elementStyles=[],z.shadowRootOptions={mode:"open"},z[it("elementProperties")]=new Map,z[it("finalized")]=new Map,Hr?.({ReactiveElement:z}),(At.reactiveElementVersions??=[]).push("2.1.1");var ae=globalThis,St=ae.trustedTypes,ze=St?St.createPolicy("lit-html",{createHTML:r=>r}):void 0,le="$lit$",P=`lit$${Math.random().toFixed(9).slice(2)}$`,pe="?"+P,Ur=`<${pe}>`,D=document,lt=()=>D.createComment(""),pt=r=>r===null||typeof r!="object"&&typeof r!="function",ce=Array.isArray,Ne=r=>ce(r)||typeof r?.[Symbol.iterator]=="function",ie=`[
|
|
2
|
+
\f\r]`,at=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,Pe=/-->/g,Oe=/>/g,U=RegExp(`>|${ie}(?:([^\\s"'>=/]+)(${ie}*=${ie}*(?:[^
|
|
3
|
+
\f\r"'\`<>=]|("|')|))|$)`,"g"),Re=/'/g,Me=/"/g,He=/^(?:script|style|textarea|title)$/i,he=r=>(t,...e)=>({_$litType$:r,strings:t,values:e}),h=he(1),C=he(2),ds=he(3),q=Symbol.for("lit-noChange"),x=Symbol.for("lit-nothing"),Be=new WeakMap,j=D.createTreeWalker(D,129);function Ue(r,t){if(!ce(r)||!r.hasOwnProperty("raw"))throw Error("invalid template strings array");return ze!==void 0?ze.createHTML(t):t}var je=(r,t)=>{let e=r.length-1,s=[],o,n=t===2?"<svg>":t===3?"<math>":"",i=at;for(let l=0;l<e;l++){let a=r[l],u,g,p=-1,b=0;for(;b<a.length&&(i.lastIndex=b,g=i.exec(a),g!==null);)b=i.lastIndex,i===at?g[1]==="!--"?i=Pe:g[1]!==void 0?i=Oe:g[2]!==void 0?(He.test(g[2])&&(o=RegExp("</"+g[2],"g")),i=U):g[3]!==void 0&&(i=U):i===U?g[0]===">"?(i=o??at,p=-1):g[1]===void 0?p=-2:(p=i.lastIndex-g[2].length,u=g[1],i=g[3]===void 0?U:g[3]==='"'?Me:Re):i===Me||i===Re?i=U:i===Pe||i===Oe?i=at:(i=U,o=void 0);let w=i===U&&r[l+1].startsWith("/>")?" ":"";n+=i===at?a+Ur:p>=0?(s.push(u),a.slice(0,p)+le+a.slice(p)+P+w):a+P+(p===-2?l:w)}return[Ue(r,n+(r[e]||"<?>")+(t===2?"</svg>":t===3?"</math>":"")),s]},ct=class r{constructor({strings:t,_$litType$:e},s){let o;this.parts=[];let n=0,i=0,l=t.length-1,a=this.parts,[u,g]=je(t,e);if(this.el=r.createElement(u,s),j.currentNode=this.el.content,e===2||e===3){let p=this.el.content.firstChild;p.replaceWith(...p.childNodes)}for(;(o=j.nextNode())!==null&&a.length<l;){if(o.nodeType===1){if(o.hasAttributes())for(let p of o.getAttributeNames())if(p.endsWith(le)){let b=g[i++],w=o.getAttribute(p).split(P),k=/([.?@])?(.*)/.exec(b);a.push({type:1,index:n,name:k[2],strings:w,ctor:k[1]==="."?Ct:k[1]==="?"?Et:k[1]==="@"?Tt:V}),o.removeAttribute(p)}else p.startsWith(P)&&(a.push({type:6,index:n}),o.removeAttribute(p));if(He.test(o.tagName)){let p=o.textContent.split(P),b=p.length-1;if(b>0){o.textContent=St?St.emptyScript:"";for(let w=0;w<b;w++)o.append(p[w],lt()),j.nextNode(),a.push({type:2,index:++n});o.append(p[b],lt())}}}else if(o.nodeType===8)if(o.data===pe)a.push({type:2,index:n});else{let p=-1;for(;(p=o.data.indexOf(P,p+1))!==-1;)a.push({type:7,index:n}),p+=P.length-1}n++}}static createElement(t,e){let s=D.createElement("template");return s.innerHTML=t,s}};function L(r,t,e=r,s){if(t===q)return t;let o=s!==void 0?e._$Co?.[s]:e._$Cl,n=pt(t)?void 0:t._$litDirective$;return o?.constructor!==n&&(o?._$AO?.(!1),n===void 0?o=void 0:(o=new n(r),o._$AT(r,e,s)),s!==void 0?(e._$Co??=[])[s]=o:e._$Cl=o),o!==void 0&&(t=L(r,o._$AS(r,t.values),o,s)),t}var kt=class{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){let{el:{content:e},parts:s}=this._$AD,o=(t?.creationScope??D).importNode(e,!0);j.currentNode=o;let n=j.nextNode(),i=0,l=0,a=s[0];for(;a!==void 0;){if(i===a.index){let u;a.type===2?u=new F(n,n.nextSibling,this,t):a.type===1?u=new a.ctor(n,a.name,a.strings,this,t):a.type===6&&(u=new zt(n,this,t)),this._$AV.push(u),a=s[++l]}i!==a?.index&&(n=j.nextNode(),i++)}return j.currentNode=D,o}p(t){let e=0;for(let s of this._$AV)s!==void 0&&(s.strings!==void 0?(s._$AI(t,s,e),e+=s.strings.length-2):s._$AI(t[e])),e++}},F=class r{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,e,s,o){this.type=2,this._$AH=x,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=s,this.options=o,this._$Cv=o?.isConnected??!0}get parentNode(){let t=this._$AA.parentNode,e=this._$AM;return e!==void 0&&t?.nodeType===11&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=L(this,t,e),pt(t)?t===x||t==null||t===""?(this._$AH!==x&&this._$AR(),this._$AH=x):t!==this._$AH&&t!==q&&this._(t):t._$litType$!==void 0?this.$(t):t.nodeType!==void 0?this.T(t):Ne(t)?this.k(t):this._(t)}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t))}_(t){this._$AH!==x&&pt(this._$AH)?this._$AA.nextSibling.data=t:this.T(D.createTextNode(t)),this._$AH=t}$(t){let{values:e,_$litType$:s}=t,o=typeof s=="number"?this._$AC(t):(s.el===void 0&&(s.el=ct.createElement(Ue(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===o)this._$AH.p(e);else{let n=new kt(o,this),i=n.u(this.options);n.p(e),this.T(i),this._$AH=n}}_$AC(t){let e=Be.get(t.strings);return e===void 0&&Be.set(t.strings,e=new ct(t)),e}k(t){ce(this._$AH)||(this._$AH=[],this._$AR());let e=this._$AH,s,o=0;for(let n of t)o===e.length?e.push(s=new r(this.O(lt()),this.O(lt()),this,this.options)):s=e[o],s._$AI(n),o++;o<e.length&&(this._$AR(s&&s._$AB.nextSibling,o),e.length=o)}_$AR(t=this._$AA.nextSibling,e){for(this._$AP?.(!1,!0,e);t!==this._$AB;){let s=t.nextSibling;t.remove(),t=s}}setConnected(t){this._$AM===void 0&&(this._$Cv=t,this._$AP?.(t))}},V=class{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,e,s,o,n){this.type=1,this._$AH=x,this._$AN=void 0,this.element=t,this.name=e,this._$AM=o,this.options=n,s.length>2||s[0]!==""||s[1]!==""?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=x}_$AI(t,e=this,s,o){let n=this.strings,i=!1;if(n===void 0)t=L(this,t,e,0),i=!pt(t)||t!==this._$AH&&t!==q,i&&(this._$AH=t);else{let l=t,a,u;for(t=n[0],a=0;a<n.length-1;a++)u=L(this,l[s+a],e,a),u===q&&(u=this._$AH[a]),i||=!pt(u)||u!==this._$AH[a],u===x?t=x:t!==x&&(t+=(u??"")+n[a+1]),this._$AH[a]=u}i&&!o&&this.j(t)}j(t){t===x?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}},Ct=class extends V{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===x?void 0:t}},Et=class extends V{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==x)}},Tt=class extends V{constructor(t,e,s,o,n){super(t,e,s,o,n),this.type=5}_$AI(t,e=this){if((t=L(this,t,e,0)??x)===q)return;let s=this._$AH,o=t===x&&s!==x||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,n=t!==x&&(s===x||o);o&&this.element.removeEventListener(this.name,this,s),n&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){typeof this._$AH=="function"?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t)}},zt=class{constructor(t,e,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){L(this,t)}},De={M:le,P,A:pe,C:1,L:je,R:kt,D:Ne,V:L,I:F,H:V,N:Et,U:Tt,B:Ct,F:zt},jr=ae.litHtmlPolyfillSupport;jr?.(ct,F),(ae.litHtmlVersions??=[]).push("3.3.1");var ht=(r,t,e)=>{let s=e?.renderBefore??t,o=s._$litPart$;if(o===void 0){let n=e?.renderBefore??null;s._$litPart$=o=new F(t.insertBefore(lt(),n),n,void 0,e??{})}return o._$AI(r),o};var ue=globalThis,X=class extends z{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){let t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){let e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=ht(e,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1)}render(){return q}};X._$litElement$=!0,X.finalized=!0,ue.litElementHydrateSupport?.({LitElement:X});var Dr=ue.litElementPolyfillSupport;Dr?.({LitElement:X});(ue.litElementVersions??=[]).push("4.2.1");var Y=c`
|
|
4
4
|
@layer reset {
|
|
5
5
|
* {
|
|
6
6
|
margin: 0;
|
|
@@ -16,19 +16,154 @@ var wt=globalThis,$t=wt.ShadowRoot&&(wt.ShadyCSS===void 0||wt.ShadyCSS.nativeSha
|
|
|
16
16
|
::-webkit-scrollbar-thumb { background: #333; border-radius: 1em; }
|
|
17
17
|
::-webkit-scrollbar-thumb:hover { background: #444; }
|
|
18
18
|
}
|
|
19
|
-
`;function
|
|
20
|
-
`)}function zr(r,t,e){e==null?r.removeAttribute(t):typeof e=="string"?r.setAttribute(t,e):typeof e=="number"?r.setAttribute(t,e.toString()):typeof e=="boolean"?e===!0?r.setAttribute(t,""):r.removeAttribute(t):console.warn(`invalid attribute "${t}" type is "${typeof e}"`)}function Nt(r,t){for(let[e,s]of t)zr(r,e,s)}function Le(r,t){let e=document.createElement(r);return Nt(e,Object.entries(t)),e}function qe(r,t){let e=new MutationObserver(t);return e.observe(r,{attributes:!0}),()=>e.disconnect()}var $={get:{string:(r,t)=>r.getAttribute(t)??void 0,number:(r,t)=>{let e=r.getAttribute(t);return e===null||!e?void 0:Number(e)},boolean:(r,t)=>r.getAttribute(t)!==null},set:{string:(r,t,e)=>(e===void 0?r.removeAttribute(t):r.setAttribute(t,e),!0),number:(r,t,e)=>(e===void 0?r.removeAttribute(t):r.setAttribute(t,e.toString()),!0),boolean:(r,t,e)=>(e?r.setAttribute(t,""):r.removeAttribute(t),!0)}};var Ve=(r,t)=>new Proxy(t,{get:(e,s)=>{switch(t[s]){case String:return $.get.string(r,s);case Number:return $.get.number(r,s);case Boolean:return $.get.boolean(r,s);default:throw new Error(`invalid attribute type for "${s}"`)}},set:(e,s,o)=>{switch(t[s]){case String:return $.set.string(r,s,o);case Number:return $.set.number(r,s,o);case Boolean:return $.set.boolean(r,s,o);default:throw new Error(`invalid attribute type for "${s}"`)}}});var Ht=class{element;constructor(t){this.element=t}strings=new Proxy({},{get:(t,e)=>$.get.string(this.element,e),set:(t,e,s)=>$.set.string(this.element,e,s)});numbers=new Proxy({},{get:(t,e)=>$.get.number(this.element,e),set:(t,e,s)=>$.set.number(this.element,e,s)});booleans=new Proxy({},{get:(t,e)=>$.get.boolean(this.element,e),set:(t,e,s)=>$.set.boolean(this.element,e,s)})};function dt(r){let t=new Ht(r);return{strings:t.strings,numbers:t.numbers,booleans:t.booleans,on:e=>qe(r,e),spec:e=>Ve(r,e)}}dt.get=$.get;dt.set=$.set;function ge(r,t){let e=[];for(let[s,o]of Object.entries(t))if(typeof o=="function")r.addEventListener(s,o),e.push(()=>r.removeEventListener(s,o));else{let[i,n]=o;r.addEventListener(s,n,i),e.push(()=>r.removeEventListener(s,n))}return()=>e.forEach(s=>s())}function Ie(r){return r.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function We(r,t={}){let{soft:e=!1,upgrade:s=!0}=t;for(let[o,i]of Object.entries(r)){let n=Ie(o),c=customElements.get(n);e&&c||(customElements.define(n,i),s&&document.querySelectorAll(n).forEach(a=>{a.constructor===HTMLElement&&customElements.upgrade(a)}))}}function Fe(r,t){let e=r.querySelector(t);if(!e)throw new Error(`element not found (${t})`);return e}var Bt=class r{element;constructor(t){this.element=t}in(t){return new r(typeof t=="string"?Fe(this.element,t):t)}require(t){let e=this.element.querySelector(t);if(!e)throw new Error(`element not found (${t})`);return e}maybe(t){return this.element.querySelector(t)}all(t){return Array.from(this.element.querySelectorAll(t))}render(...t){return ht(t,this.element)}attrs(){return dt(this.element)}events(t){return ge(this.element,t)}};function p(r){return typeof r=="string"?Fe(document,r):new Bt(r)}var O=new Bt(document);p.in=O.in.bind(O);p.require=O.require.bind(O);p.maybe=O.maybe.bind(O);p.all=O.all.bind(O);p.el=Le;p.events=ge;p.attrs=dt;p.register=We;p.render=(r,...t)=>ht(t,r);var be=class{#t=[];#e=new WeakMap;#r=[];#s=new Set;notifyRead(t){this.#t.at(-1)?.add(t)}async notifyWrite(t){if(this.#s.has(t))throw new Error("circularity forbidden");let e=this.#o(t).pub();return this.#r.at(-1)?.add(e),e}observe(t){this.#t.push(new Set);let e=t();return{seen:this.#t.pop(),result:e}}subscribe(t,e){return this.#o(t)(async()=>{let s=new Set;this.#r.push(s),this.#s.add(t),s.add(e()),this.#s.delete(t),await Promise.all(s),this.#r.pop()})}#o(t){let e=this.#e.get(t);return e||(e=Mt(),this.#e.set(t,e)),e}},_=globalThis[Symbol.for("e280.tracker")]??=new be;var Z=class{sneak;constructor(t){this.sneak=t}get(){return _.notifyRead(this),this.sneak}get value(){return this.get()}};var J=class extends Z{on=Mt();dispose(){this.on.clear()}};function Ut(r,t=r){let{seen:e,result:s}=_.observe(r),o=P(0,t),i=[],n=()=>i.forEach(c=>c());for(let c of e){let a=_.subscribe(c,o);i.push(a)}return{result:s,dispose:n}}function K(r,t){return r===t}var jt=class extends J{#t;constructor(t,e){let s=e?.compare??K,{result:o,dispose:i}=Ut(t,async()=>{let n=t();!s(this.sneak,n)&&(this.sneak=n,await Promise.all([_.notifyWrite(this),this.on.pub(n)]))});super(o),this.#t=i}toString(){return`(derived "${String(this.get())}")`}dispose(){super.dispose(),this.#t()}get core(){return this}fn(){let t=this;function e(){return t.get()}return e.core=t,e.get=t.get.bind(t),e.on=t.on,e.dispose=t.dispose.bind(t),e.fn=t.fn.bind(t),Object.defineProperty(e,"value",{get:()=>t.value}),Object.defineProperty(e,"sneak",{get:()=>t.sneak}),e}};var Dt=class extends Z{#t;#e;#r=!1;#s;constructor(t,e){super(void 0),this.#t=t,this.#e=e?.compare??K}toString(){return`($lazy "${String(this.get())}")`}get(){if(!this.#s){let{result:t,dispose:e}=Ut(this.#t,()=>this.#r=!0);this.#s=e,this.sneak=t}if(this.#r){this.#r=!1;let t=this.#t();!this.#e(this.sneak,t)&&(this.sneak=t,_.notifyWrite(this))}return super.get()}dispose(){this.#s&&this.#s()}get core(){return this}fn(){let t=this;function e(){return t.get()}return e.core=t,e.get=t.get.bind(t),e.dispose=t.dispose.bind(t),e.fn=t.fn.bind(t),Object.defineProperty(e,"value",{get:()=>t.value}),Object.defineProperty(e,"sneak",{get:()=>t.sneak}),e}};var Lt=class extends J{#t=!1;#e;constructor(t,e){super(t),this.#e=e?.compare??K}toString(){return`($signal "${String(this.get())}")`}async set(t,e=!1){let s=this.sneak;return this.sneak=t,(e||!this.#e(s,t))&&await this.publish(),t}get value(){return this.get()}set value(t){this.set(t)}async publish(){if(this.#t)throw new Error("forbid circularity");let t=this.sneak,e=Promise.resolve();try{this.#t=!0,e=Promise.all([_.notifyWrite(this),this.on.publish(t)])}finally{this.#t=!1}return await e,t}get core(){return this}fn(){let t=this;function e(s){return arguments.length===0?t.get():t.set(arguments[0])}return e.core=t,e.get=t.get.bind(t),e.set=t.set.bind(t),e.on=t.on,e.dispose=t.dispose.bind(t),e.publish=t.publish.bind(t),e.fn=t.fn.bind(t),Object.defineProperty(e,"value",{get:()=>t.value,set:s=>t.value=s}),Object.defineProperty(e,"sneak",{get:()=>t.sneak,set:s=>t.sneak=s}),e}};function Pr(r,t){return new Dt(r,t).fn()}function Xe(r,t){return new jt(r,t).fn()}function x(r,t){return new Lt(r,t).fn()}x.lazy=Pr;x.derived=Xe;var R=class{#t=new Y;effect(t,e){let{seen:s,result:o}=_.observe(t);for(let i of s)this.#t.guarantee(i,()=>_.subscribe(i,e));for(let[i,n]of this.#t)s.has(i)||(n(),this.#t.delete(i));return o}clear(){for(let t of this.#t.values())t();this.#t.clear()}};var Q=class{element;response;#t;constructor(t,e){this.element=t,this.response=e}start(){this.#t||(this.#t=p.attrs(this.element).on(this.response))}stop(){this.#t&&this.#t(),this.#t=void 0}};function qt(r,t){At(r,Rr(t))}function Rr(r){let t=[];if(Array.isArray(r)){let e=new Set(r.flat(1/0).reverse());for(let s of e)t.unshift(I(s))}else r!==void 0&&t.push(I(r));return t}var q={status:r=>r[0],value:r=>r[0]==="ready"?r[1]:void 0,error:r=>r[0]==="error"?r[1]:void 0,select:(r,t)=>{switch(r[0]){case"loading":return t.loading();case"error":return t.error(r[1]);case"ready":return t.ready(r[1]);default:throw new Error("unknown op status")}},morph:(r,t)=>q.select(r,{loading:()=>["loading"],error:e=>["error",e],ready:e=>["ready",t(e)]}),all:(...r)=>{let t=[],e=[],s=0;for(let o of r)switch(o[0]){case"loading":s++;break;case"ready":t.push(o[1]);break;case"error":e.push(o[1]);break}return e.length>0?["error",e]:s===0?["ready",t]:["loading"]}};var G=class{static loading(){return new this}static ready(t){return new this(["ready",t])}static error(t){return new this(["error",t])}static promise(t){let e=new this;return e.promise(t),e}static load(t){return this.promise(t())}static all(...t){let e=t.map(s=>s.pod);return q.all(...e)}signal;#t=0;#e=fe();#r=fe();constructor(t=["loading"]){this.signal=x(t)}get wait(){return new Promise((t,e)=>{this.#e.next().then(([s])=>t(s)),this.#r.next().then(([s])=>e(s))})}get then(){return this.wait.then.bind(this.wait)}get catch(){return this.wait.catch.bind(this.wait)}get finally(){return this.wait.finally.bind(this.wait)}async setLoading(){await this.signal.set(["loading"])}async setReady(t){await this.signal.set(["ready",t]),await this.#e(t)}async setError(t){await this.signal.set(["error",t]),await this.#r(t)}async promise(t){let e=++this.#t;await this.setLoading();try{let s=await t;return e===this.#t&&await this.setReady(s),s}catch(s){console.error(s),e===this.#t&&await this.setError(s)}}async load(t){return this.promise(t())}get pod(){return this.signal.get()}set pod(t){this.signal.set(t)}get status(){return this.signal.get()[0]}get value(){return q.value(this.signal.get())}get error(){return q.error(this.signal.get())}get isLoading(){return this.status==="loading"}get isReady(){return this.status==="ready"}get isError(){return this.status==="error"}require(){let t=this.signal.get();if(t[0]!=="ready")throw new Error("required value not ready");return t[1]}select(t){return q.select(this.signal.get(),t)}morph(t){return q.morph(this.pod,t)}};var Vt=class{#t=[];#e=[];mount(t){this.#t.push(t),this.#e.push(t())}unmountAll(){for(let t of this.#e)t();this.#e=[]}remountAll(){for(let t of this.#t)this.#e.push(t())}};var It=class{#t;#e;constructor(t){this.#t=t,this.#e=p.attrs(t.element)}get strings(){return this.#e.strings}get numbers(){return this.#e.numbers}get booleans(){return this.#e.booleans}spec(t){return this.#t.once(()=>this.#e.spec(t))}on(t){return this.#t.mount(()=>this.#e.on(t))}};var mt=Symbol(),ft=Symbol(),gt=Symbol(),tt=class{element;shadow;renderNow;render;attrs;#t=0;#e=0;#r=new Y;#s=ut();#o=new Vt;[mt](t){this.#t++,this.#e=0,this.#s=ut();let e=t();return this.#s.resolve(),e}[ft](){this.#o.unmountAll()}[gt](){this.#o.remountAll()}constructor(t,e,s,o){this.element=t,this.shadow=e,this.renderNow=s,this.render=o,this.attrs=new It(this)}get renderCount(){return this.#t}get rendered(){return this.#s.promise}name(t){this.once(()=>this.element.setAttribute("view",t))}styles(...t){this.once(()=>qt(this.shadow,t))}css(...t){return this.styles(...t)}once(t){return this.#r.guarantee(this.#e++,t)}mount(t){return this.once(()=>this.#o.mount(t))}life(t){let e;return this.mount(()=>{let[s,o]=t();return e=s,o}),e}wake(t){return this.life(()=>[t(),()=>{}])}op=(()=>{let t=this;function e(s){return t.once(()=>G.load(s))}return e.load=e,e.promise=s=>this.once(()=>G.promise(s)),e})();signal=(()=>{let t=this;function e(s,o){return t.once(()=>x(s,o))}return e.derived=function(o,i){return t.once(()=>x.derived(o,i))},e.lazy=function(o,i){return t.once(()=>x.lazy(o,i))},e})();derived(t,e){return this.once(()=>x.derived(t,e))}lazy(t,e){return this.once(()=>x.lazy(t,e))}};var M=class extends HTMLElement{static styles;shadow;#t;#e=0;#r=new R;#s=new Q(this,()=>this.update());createShadow(){return this.attachShadow({mode:"open"})}constructor(){super(),this.shadow=this.createShadow(),this.#t=new tt(this,this.shadow,this.updateNow,this.update)}render(t){}updateNow=()=>{this.#t[mt](()=>{p.render(this.shadow,this.#r.effect(()=>this.render(this.#t),this.update))})};update=P(0,this.updateNow);connectedCallback(){if(this.#e===0){let t=this.constructor.styles;t&&qt(this.shadow,t),this.updateNow()}else this.#t[gt]();this.#s.start(),this.#e++}disconnectedCallback(){this.#t[ft](),this.#r.clear(),this.#s.stop()}};var Wt=class{#t;#e;constructor(t,e){this.#e=t,this.#t=e}attr(t,e){return this.#e.attrs.set(t,e),this}children(...t){return this.#e.children.push(...t),this}render(){return this.#t(this.#e)}};var bt=class{props;attrs=new Map;children=[];constructor(t){this.props=t}};function Ye(r,t,e,s){return class extends t{static view=et(s,r);#t=new R;createShadow(){return this.attachShadow(r)}render(i){return s(i)(...this.#t.effect(()=>e(this),()=>this.update()))}}}var{I:on}=Me;var Ze=r=>r.strings===void 0;var Je={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},ye=r=>(...t)=>({_$litDirective$:r,values:t}),Ft=class{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,s){this._$Ct=t,this._$AM=e,this._$Ci=s}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}};var yt=(r,t)=>{let e=r._$AN;if(e===void 0)return!1;for(let s of e)s._$AO?.(t,!1),yt(s,t);return!0},Xt=r=>{let t,e;do{if((t=r._$AM)===void 0)break;e=t._$AN,e.delete(r),r=t}while(e?.size===0)},Ke=r=>{for(let t;t=r._$AM;r=t){let e=t._$AN;if(e===void 0)t._$AN=e=new Set;else if(e.has(r))break;e.add(r),Hr(t)}};function Mr(r){this._$AN!==void 0?(Xt(this),this._$AM=r,Ke(this)):this._$AM=r}function Nr(r,t=!1,e=0){let s=this._$AH,o=this._$AN;if(o!==void 0&&o.size!==0)if(t)if(Array.isArray(s))for(let i=e;i<s.length;i++)yt(s[i],!1),Xt(s[i]);else s!=null&&(yt(s,!1),Xt(s));else yt(this,r)}var Hr=r=>{r.type==Je.CHILD&&(r._$AP??=Nr,r._$AQ??=Mr)},Yt=class extends Ft{constructor(){super(...arguments),this._$AN=void 0}_$AT(t,e,s){super._$AT(t,e,s),Ke(this),this.isConnected=t._$AU}_$AO(t,e=!0){t!==this.isConnected&&(this.isConnected=t,t?this.reconnected?.():this.disconnected?.()),e&&(yt(this,t),Xt(this))}setValue(t){if(Ze(this._$Ct))this._$Ct._$AI(t,this);else{let e=[...this._$Ct._$AH];e[this._$Ci]=t,this._$Ct._$AI(e,this,0)}}disconnected(){}reconnected(){}};var Zt=class r extends HTMLElement{static#t=!1;static make(){return this.#t||(p.register({SlyView:r},{soft:!0,upgrade:!0}),this.#t=!0),document.createElement("sly-view")}};var Jt=class{viewFn;settings;#t=Zt.make();#e=new R;#r;#s;#o;#i=new Q(this.#t,()=>this.#a());constructor(t,e){this.viewFn=t,this.settings=e,this.#s=this.#t.attachShadow(this.settings),this.#r=new tt(this.#t,this.#s,this.#n,this.#a)}update(t){return this.#o=t,this.#n(),this.#t}#n=()=>{this.#r[mt](()=>{let t=this.#e.effect(()=>this.viewFn(this.#r)(...this.#o.props),()=>this.#a());Nt(this.#t,[...this.#o.attrs]),p.render(this.#s,t),p.render(this.#t,this.#o.children),this.#i.start()})};#a=P(0,this.#n);disconnected(){this.#r[ft](),this.#e.clear(),this.#i.stop()}reconnected(){this.#r[gt](),this.#i.start()}};function Qe(r,t){return ye(class extends Yt{#t=new Jt(r,t);render(s){return this.#t.update(s)}disconnected(){this.#t.disconnected()}reconnected(){this.#t.reconnected()}})}function et(r,t){let e=Qe(r,t);function s(...o){return e(new bt(o))}return s.props=(...o)=>new Wt(new bt(o),e),s.transmute=o=>et(n=>{let c=r(n);return(...a)=>c(...o(...a))},t),s.component=(o=M)=>({props:i=>Ye(t,o,i,r)}),s}function b(r){return et(r,{mode:"open"})}b.settings=r=>({render:t=>et(t,r)});b.render=b;b.component=r=>b(t=>()=>r(t)).component(M).props(()=>[]);function h(r,t){return()=>Br({hz:r,frames:t})}var Br=b(r=>({hz:t,frames:e})=>{r.name("loading"),r.styles(X,Ur);let s=r.signal(0);return r.mount(()=>Ne(async()=>{await He(1e3/t);let o=s.get()+1;s.set(o>=e.length?0:o)})),e.at(s.get())}),Ur=d`
|
|
19
|
+
`;function O(r,t){let e,s,o=[];function n(){e=[],s&&clearTimeout(s),s=void 0,o=[]}return n(),((...i)=>{e=i,s&&clearTimeout(s);let l=new Promise((a,u)=>{o.push({resolve:a,reject:u})});return s=setTimeout(()=>{Promise.resolve().then(()=>t(...e)).then(a=>{for(let{resolve:u}of o)u(a);n()}).catch(a=>{for(let{reject:u}of o)u(a);n()})},r),l})}function qr(r){let t,e=!1,s=()=>{e=!0,clearTimeout(t)},o=async()=>{e||(await r(s),!e&&(t=setTimeout(o,0)))};return o(),s}var qe=qr;function ut(){let r,t,e=new Promise((o,n)=>{r=o,t=n});function s(o){return o.then(r).catch(t),e}return{promise:e,resolve:r,reject:t,entangle:s}}var Pt=class{getRefill;#t=[];constructor(t){this.getRefill=t,this.#e()}get currentStock(){return[...this.#t]}#e(){if(this.#t.length===0&&(this.#t=[...this.getRefill()]),this.#t.length===0)throw new Error("dispenser's getRefill returned an empty array")}takeAll(){let t=this.#t;return this.#t=[...this.getRefill()],t}takeRandom(){this.#e();let t=Math.floor(Math.random()*this.#t.length),[e]=this.#t.splice(t,1);return e}takeFirst(){return this.#e(),this.#t.shift()}takeLast(){return this.#e(),this.#t.pop()}shift=this.takeFirst.bind(this);pop=this.takeLast.bind(this)};var Z=class r extends Map{static require(t,e){if(t.has(e))return t.get(e);throw new Error(`required key not found: "${e}"`)}static guarantee(t,e,s){if(t.has(e))return t.get(e);{let o=s();return t.set(e,o),o}}array(){return[...this]}require(t){return r.require(this,t)}guarantee(t,e){return r.guarantee(this,t,e)}};var Le=(r=0)=>new Promise(t=>setTimeout(t,r));function Ot(r){return{map:t=>Ve(r,t),filter:t=>Ie(r,t)}}Ot.pipe=Object.freeze({map:r=>(t=>Ve(t,r)),filter:r=>(t=>Ie(t,r))});var Ve=(r,t)=>Object.fromEntries(Object.entries(r).map(([e,s])=>[e,t(s,e)])),Ie=(r,t)=>Object.fromEntries(Object.entries(r).filter(([e,s])=>t(s,e)));function We(){let r=new Set;async function t(...a){await Promise.all([...r].map(u=>u(...a)))}function e(a){return r.add(a),()=>{r.delete(a)}}async function s(...a){return t(...a)}function o(a){return e(a)}async function n(a){let{promise:u,resolve:g}=ut(),p=o(async(...b)=>{a&&await a(...b),g(b),p()});return u}function i(){r.clear()}let l={pub:s,sub:o,publish:t,subscribe:e,on:e,next:n,clear:i};return Object.assign(o,l),Object.assign(s,l),l}function Rt(r){let t=We();return r&&t.sub(r),t.sub}function de(r){let t=We();return r&&t.sub(r),t.pub}function Fe(r){let t=r.split(/\r|\n/),e;for(let o of t)if(!/^\s+$/.test(o)){let i=o.match(/^(\t+).+/);if(i){let l=i[1].length;if(e=e===void 0||l<e?l:e,e===0)break}}let s=new RegExp(`^\\t{${e}}`);return t.map(o=>/^\s+$/.test(o)?"":o).map(o=>o.replace(s,"")).join(`
|
|
20
|
+
`)}function Lr(r,t,e){e==null?r.removeAttribute(t):typeof e=="string"?r.setAttribute(t,e):typeof e=="number"?r.setAttribute(t,e.toString()):typeof e=="boolean"?e===!0?r.setAttribute(t,""):r.removeAttribute(t):console.warn(`invalid attribute "${t}" type is "${typeof e}"`)}function Mt(r,t){for(let[e,s]of t)Lr(r,e,s)}function Xe(r,t){let e=document.createElement(r);return Mt(e,Object.entries(t)),e}function Ye(r,t){let e=new MutationObserver(t);return e.observe(r,{attributes:!0}),()=>e.disconnect()}var $={get:{string:(r,t)=>r.getAttribute(t)??void 0,number:(r,t)=>{let e=r.getAttribute(t);return e===null||!e?void 0:Number(e)},boolean:(r,t)=>r.getAttribute(t)!==null},set:{string:(r,t,e)=>(e===void 0?r.removeAttribute(t):r.setAttribute(t,e),!0),number:(r,t,e)=>(e===void 0?r.removeAttribute(t):r.setAttribute(t,e.toString()),!0),boolean:(r,t,e)=>(e?r.setAttribute(t,""):r.removeAttribute(t),!0)}};var Ze=(r,t)=>new Proxy(t,{get:(e,s)=>{switch(t[s]){case String:return $.get.string(r,s);case Number:return $.get.number(r,s);case Boolean:return $.get.boolean(r,s);default:throw new Error(`invalid attribute type for "${s}"`)}},set:(e,s,o)=>{switch(t[s]){case String:return $.set.string(r,s,o);case Number:return $.set.number(r,s,o);case Boolean:return $.set.boolean(r,s,o);default:throw new Error(`invalid attribute type for "${s}"`)}}});var Bt=class{element;constructor(t){this.element=t}strings=new Proxy({},{get:(t,e)=>$.get.string(this.element,e),set:(t,e,s)=>$.set.string(this.element,e,s)});numbers=new Proxy({},{get:(t,e)=>$.get.number(this.element,e),set:(t,e,s)=>$.set.number(this.element,e,s)});booleans=new Proxy({},{get:(t,e)=>$.get.boolean(this.element,e),set:(t,e,s)=>$.set.boolean(this.element,e,s)})};function dt(r){let t=new Bt(r);return{strings:t.strings,numbers:t.numbers,booleans:t.booleans,on:e=>Ye(r,e),spec:e=>Ze(r,e)}}dt.get=$.get;dt.set=$.set;function me(r,t){let e=[];for(let[s,o]of Object.entries(t))if(typeof o=="function")r.addEventListener(s,o),e.push(()=>r.removeEventListener(s,o));else{let[n,i]=o;r.addEventListener(s,i,n),e.push(()=>r.removeEventListener(s,i))}return()=>e.forEach(s=>s())}function Je(r){return r.replace(/([a-zA-Z])(?=[A-Z])/g,"$1-").toLowerCase()}function Ke(r,t={}){let{soft:e=!1,upgrade:s=!0}=t;for(let[o,n]of Object.entries(r)){let i=Je(o),l=customElements.get(i);e&&l||(customElements.define(i,n),s&&document.querySelectorAll(i).forEach(a=>{a.constructor===HTMLElement&&customElements.upgrade(a)}))}}function Qe(r,t){let e=r.querySelector(t);if(!e)throw new Error(`element not found (${t})`);return e}var Nt=class r{element;constructor(t){this.element=t}in(t){return new r(typeof t=="string"?Qe(this.element,t):t)}require(t){let e=this.element.querySelector(t);if(!e)throw new Error(`element not found (${t})`);return e}maybe(t){return this.element.querySelector(t)}all(t){return Array.from(this.element.querySelectorAll(t))}render(...t){return ht(t,this.element)}attrs(){return dt(this.element)}events(t){return me(this.element,t)}};function d(r){return typeof r=="string"?Qe(document,r):new Nt(r)}var R=new Nt(document);d.in=R.in.bind(R);d.require=R.require.bind(R);d.maybe=R.maybe.bind(R);d.all=R.all.bind(R);d.el=Xe;d.events=me;d.attrs=dt;d.register=Ke;d.render=(r,...t)=>ht(t,r);var fe=class{#t=[];#e=new WeakMap;#r=[];#s=new Set;notifyRead(t){this.#t.at(-1)?.add(t)}async notifyWrite(t){if(this.#s.has(t))throw new Error("circularity forbidden");let e=this.#o(t).pub();return this.#r.at(-1)?.add(e),e}observe(t){this.#t.push(new Set);let e=t();return{seen:this.#t.pop(),result:e}}subscribe(t,e){return this.#o(t)(async()=>{let s=new Set;this.#r.push(s),this.#s.add(t),s.add(e()),this.#s.delete(t),await Promise.all(s),this.#r.pop()})}#o(t){let e=this.#e.get(t);return e||(e=Rt(),this.#e.set(t,e)),e}},_=globalThis[Symbol.for("e280.tracker")]??=new fe;var J=class{sneak;constructor(t){this.sneak=t}get(){return _.notifyRead(this),this.sneak}get value(){return this.get()}};var K=class extends J{on=Rt();dispose(){this.on.clear()}};function Ht(r,t=r){let{seen:e,result:s}=_.observe(r),o=O(0,t),n=[],i=()=>n.forEach(l=>l());for(let l of e){let a=_.subscribe(l,o);n.push(a)}return{result:s,dispose:i}}function Q(r,t){return r===t}var Ut=class extends K{#t;constructor(t,e){let s=e?.compare??Q,{result:o,dispose:n}=Ht(t,async()=>{let i=t();!s(this.sneak,i)&&(this.sneak=i,await Promise.all([_.notifyWrite(this),this.on.pub(i)]))});super(o),this.#t=n}toString(){return`(derived "${String(this.get())}")`}dispose(){super.dispose(),this.#t()}get core(){return this}fn(){let t=this;function e(){return t.get()}return e.core=t,e.get=t.get.bind(t),e.on=t.on,e.dispose=t.dispose.bind(t),e.fn=t.fn.bind(t),Object.defineProperty(e,"value",{get:()=>t.value}),Object.defineProperty(e,"sneak",{get:()=>t.sneak}),e}};var jt=class extends J{#t;#e;#r=!1;#s;constructor(t,e){super(void 0),this.#t=t,this.#e=e?.compare??Q}toString(){return`($lazy "${String(this.get())}")`}get(){if(!this.#s){let{result:t,dispose:e}=Ht(this.#t,()=>this.#r=!0);this.#s=e,this.sneak=t}if(this.#r){this.#r=!1;let t=this.#t();!this.#e(this.sneak,t)&&(this.sneak=t,_.notifyWrite(this))}return super.get()}dispose(){this.#s&&this.#s()}get core(){return this}fn(){let t=this;function e(){return t.get()}return e.core=t,e.get=t.get.bind(t),e.dispose=t.dispose.bind(t),e.fn=t.fn.bind(t),Object.defineProperty(e,"value",{get:()=>t.value}),Object.defineProperty(e,"sneak",{get:()=>t.sneak}),e}};var Dt=class extends K{#t=!1;#e;constructor(t,e){super(t),this.#e=e?.compare??Q}toString(){return`($signal "${String(this.get())}")`}async set(t,e=!1){let s=this.sneak;return this.sneak=t,(e||!this.#e(s,t))&&await this.publish(),t}get value(){return this.get()}set value(t){this.set(t)}async publish(){if(this.#t)throw new Error("forbid circularity");let t=this.sneak,e=Promise.resolve();try{this.#t=!0,e=Promise.all([_.notifyWrite(this),this.on.publish(t)])}finally{this.#t=!1}return await e,t}get core(){return this}fn(){let t=this;function e(s){return arguments.length===0?t.get():t.set(arguments[0])}return e.core=t,e.get=t.get.bind(t),e.set=t.set.bind(t),e.on=t.on,e.dispose=t.dispose.bind(t),e.publish=t.publish.bind(t),e.fn=t.fn.bind(t),Object.defineProperty(e,"value",{get:()=>t.value,set:s=>t.value=s}),Object.defineProperty(e,"sneak",{get:()=>t.sneak,set:s=>t.sneak=s}),e}};function Vr(r,t){return new jt(r,t).fn()}function Ge(r,t){return new Ut(r,t).fn()}function v(r,t){return new Dt(r,t).fn()}v.lazy=Vr;v.derived=Ge;var M=class{#t=new Z;effect(t,e){let{seen:s,result:o}=_.observe(t);for(let n of s)this.#t.guarantee(n,()=>_.subscribe(n,e));for(let[n,i]of this.#t)s.has(n)||(i(),this.#t.delete(n));return o}clear(){for(let t of this.#t.values())t();this.#t.clear()}};var G=class{element;response;#t;constructor(t,e){this.element=t,this.response=e}start(){this.#t||(this.#t=d.attrs(this.element).on(this.response))}stop(){this.#t&&this.#t(),this.#t=void 0}};function qt(r,t){_t(r,Wr(t))}function Wr(r){let t=[];if(Array.isArray(r)){let e=new Set(r.flat(1/0).reverse());for(let s of e)t.unshift(W(s))}else r!==void 0&&t.push(W(r));return t}var I={status:r=>r[0],value:r=>r[0]==="ready"?r[1]:void 0,error:r=>r[0]==="error"?r[1]:void 0,select:(r,t)=>{switch(r[0]){case"loading":return t.loading();case"error":return t.error(r[1]);case"ready":return t.ready(r[1]);default:throw new Error("unknown op status")}},morph:(r,t)=>I.select(r,{loading:()=>["loading"],error:e=>["error",e],ready:e=>["ready",t(e)]}),all:(...r)=>{let t=[],e=[],s=0;for(let o of r)switch(o[0]){case"loading":s++;break;case"ready":t.push(o[1]);break;case"error":e.push(o[1]);break}return e.length>0?["error",e]:s===0?["ready",t]:["loading"]}};var tt=class{static loading(){return new this}static ready(t){return new this(["ready",t])}static error(t){return new this(["error",t])}static promise(t){let e=new this;return e.promise(t),e}static load(t){return this.promise(t())}static all(...t){let e=t.map(s=>s.pod);return I.all(...e)}signal;#t=0;#e=de();#r=de();constructor(t=["loading"]){this.signal=v(t)}get wait(){return new Promise((t,e)=>{this.#e.next().then(([s])=>t(s)),this.#r.next().then(([s])=>e(s))})}get then(){return this.wait.then.bind(this.wait)}get catch(){return this.wait.catch.bind(this.wait)}get finally(){return this.wait.finally.bind(this.wait)}async setLoading(){await this.signal.set(["loading"])}async setReady(t){await this.signal.set(["ready",t]),await this.#e(t)}async setError(t){await this.signal.set(["error",t]),await this.#r(t)}async promise(t){let e=++this.#t;await this.setLoading();try{let s=await t;return e===this.#t&&await this.setReady(s),s}catch(s){console.error(s),e===this.#t&&await this.setError(s)}}async load(t){return this.promise(t())}get pod(){return this.signal.get()}set pod(t){this.signal.set(t)}get status(){return this.signal.get()[0]}get value(){return I.value(this.signal.get())}get error(){return I.error(this.signal.get())}get isLoading(){return this.status==="loading"}get isReady(){return this.status==="ready"}get isError(){return this.status==="error"}require(){let t=this.signal.get();if(t[0]!=="ready")throw new Error("required value not ready");return t[1]}select(t){return I.select(this.signal.get(),t)}morph(t){return I.morph(this.pod,t)}};var Lt=class{#t=[];#e=[];mount(t){this.#t.push(t),this.#e.push(t())}unmountAll(){for(let t of this.#e)t();this.#e=[]}remountAll(){for(let t of this.#t)this.#e.push(t())}};var Vt=class{#t;#e;constructor(t){this.#t=t,this.#e=d.attrs(t.element)}get strings(){return this.#e.strings}get numbers(){return this.#e.numbers}get booleans(){return this.#e.booleans}spec(t){return this.#t.once(()=>this.#e.spec(t))}on(t){return this.#t.mount(()=>this.#e.on(t))}};var mt=Symbol(),ft=Symbol(),bt=Symbol(),et=class{element;shadow;renderNow;render;attrs;#t=0;#e=0;#r=new Z;#s=ut();#o=new Lt;[mt](t){this.#t++,this.#e=0,this.#s=ut();let e=t();return this.#s.resolve(),e}[ft](){this.#o.unmountAll()}[bt](){this.#o.remountAll()}constructor(t,e,s,o){this.element=t,this.shadow=e,this.renderNow=s,this.render=o,this.attrs=new Vt(this)}get renderCount(){return this.#t}get rendered(){return this.#s.promise}name(t){this.once(()=>this.element.setAttribute("view",t))}styles(...t){this.once(()=>qt(this.shadow,t))}css(...t){return this.styles(...t)}once(t){return this.#r.guarantee(this.#e++,t)}mount(t){return this.once(()=>this.#o.mount(t))}life(t){let e;return this.mount(()=>{let[s,o]=t();return e=s,o}),e}wake(t){return this.life(()=>[t(),()=>{}])}op=(()=>{let t=this;function e(s){return t.once(()=>tt.load(s))}return e.load=e,e.promise=s=>this.once(()=>tt.promise(s)),e})();signal=(()=>{let t=this;function e(s,o){return t.once(()=>v(s,o))}return e.derived=function(o,n){return t.once(()=>v.derived(o,n))},e.lazy=function(o,n){return t.once(()=>v.lazy(o,n))},e})();derived(t,e){return this.once(()=>v.derived(t,e))}lazy(t,e){return this.once(()=>v.lazy(t,e))}};var B=class extends HTMLElement{static styles;shadow;#t;#e=0;#r=new M;#s=new G(this,()=>this.update());createShadow(){return this.attachShadow({mode:"open"})}constructor(){super(),this.shadow=this.createShadow(),this.#t=new et(this,this.shadow,this.updateNow,this.update)}render(t){}updateNow=()=>{this.#t[mt](()=>{d.render(this.shadow,this.#r.effect(()=>this.render(this.#t),this.update))})};update=O(0,this.updateNow);connectedCallback(){if(this.#e===0){let t=this.constructor.styles;t&&qt(this.shadow,t),this.updateNow()}else this.#t[bt]();this.#s.start(),this.#e++}disconnectedCallback(){this.#t[ft](),this.#r.clear(),this.#s.stop()}};var It=class{#t;#e;constructor(t,e){this.#e=t,this.#t=e}attr(t,e=!0){return this.#e.attrs.set(t,e),this}attrs(t){for(let[e,s]of Object.entries(t))this.#e.attrs.set(e,s);return this}children(...t){return this.#e.children.push(...t),this}render(){return this.#t(this.#e)}};var gt=class{props;attrs=new Map;children=[];constructor(t){this.props=t}};function tr(r,t,e,s){return class extends t{static view=rt(s,r);#t=new M;createShadow(){return this.attachShadow(r)}render(n){return s(n)(...this.#t.effect(()=>e(this),()=>this.update()))}}}var{I:wi}=De;var er=r=>r.strings===void 0;var rr={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},be=r=>(...t)=>({_$litDirective$:r,values:t}),Wt=class{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,s){this._$Ct=t,this._$AM=e,this._$Ci=s}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}};var yt=(r,t)=>{let e=r._$AN;if(e===void 0)return!1;for(let s of e)s._$AO?.(t,!1),yt(s,t);return!0},Ft=r=>{let t,e;do{if((t=r._$AM)===void 0)break;e=t._$AN,e.delete(r),r=t}while(e?.size===0)},sr=r=>{for(let t;t=r._$AM;r=t){let e=t._$AN;if(e===void 0)t._$AN=e=new Set;else if(e.has(r))break;e.add(r),Yr(t)}};function Fr(r){this._$AN!==void 0?(Ft(this),this._$AM=r,sr(this)):this._$AM=r}function Xr(r,t=!1,e=0){let s=this._$AH,o=this._$AN;if(o!==void 0&&o.size!==0)if(t)if(Array.isArray(s))for(let n=e;n<s.length;n++)yt(s[n],!1),Ft(s[n]);else s!=null&&(yt(s,!1),Ft(s));else yt(this,r)}var Yr=r=>{r.type==rr.CHILD&&(r._$AP??=Xr,r._$AQ??=Fr)},Xt=class extends Wt{constructor(){super(...arguments),this._$AN=void 0}_$AT(t,e,s){super._$AT(t,e,s),sr(this),this.isConnected=t._$AU}_$AO(t,e=!0){t!==this.isConnected&&(this.isConnected=t,t?this.reconnected?.():this.disconnected?.()),e&&(yt(this,t),Ft(this))}setValue(t){if(er(this._$Ct))this._$Ct._$AI(t,this);else{let e=[...this._$Ct._$AH];e[this._$Ci]=t,this._$Ct._$AI(e,this,0)}}disconnected(){}reconnected(){}};var Yt=class r extends HTMLElement{static#t=!1;static make(){return this.#t||(d.register({SlyView:r},{soft:!0,upgrade:!0}),this.#t=!0),document.createElement("sly-view")}};var Zt=class{viewFn;settings;#t=Yt.make();#e=new M;#r;#s;#o;#n=new G(this.#t,()=>this.#a());constructor(t,e){this.viewFn=t,this.settings=e,this.#s=this.#t.attachShadow(this.settings),this.#r=new et(this.#t,this.#s,this.#i,this.#a)}update(t){return this.#o=t,this.#i(),this.#t}#i=()=>{this.#r[mt](()=>{let t=this.#e.effect(()=>this.viewFn(this.#r)(...this.#o.props),()=>this.#a());Mt(this.#t,[...this.#o.attrs]),d.render(this.#s,t),d.render(this.#t,this.#o.children),this.#n.start()})};#a=O(0,this.#i);disconnected(){this.#r[ft](),this.#e.clear(),this.#n.stop()}reconnected(){this.#r[bt](),this.#n.start()}};function or(r,t){return be(class extends Xt{#t=new Zt(r,t);render(s){return this.#t.update(s)}disconnected(){this.#t.disconnected()}reconnected(){this.#t.reconnected()}})}function rt(r,t){let e=or(r,t);function s(...o){return e(new gt(o))}return s.props=(...o)=>new It(new gt(o),e),s.transmute=o=>rt(i=>{let l=r(i);return(...a)=>l(...o(...a))},t),s.component=(o=B)=>({props:n=>tr(t,o,n,r)}),s}function f(r){return rt(r,{mode:"open"})}f.settings=r=>({render:t=>rt(t,r)});f.render=f;f.component=r=>f(t=>()=>r(t)).component(B).props(()=>[]);function m(r,t){return()=>Zr({hz:r,frames:t})}var Zr=f(r=>({hz:t,frames:e})=>{r.name("loading"),r.styles(Y,Jr);let s=r.signal(0);return r.mount(()=>qe(async()=>{await Le(1e3/t);let o=s.get()+1;s.set(o>=e.length?0:o)})),e.at(s.get())}),Jr=c`
|
|
21
21
|
:host {
|
|
22
22
|
font-family: monospace;
|
|
23
23
|
white-space: pre;
|
|
24
24
|
user-select: none;
|
|
25
25
|
}
|
|
26
|
-
`;var y=20,
|
|
26
|
+
`;var y=20,st=10,ot=4,na=m(y,["|","/","-","\\"]),ia=m(y,["\u2808","\u2810","\u2820","\u2880","\u2840","\u2804","\u2802","\u2801"]),aa=m(y,["\u2B06\uFE0F","\u2197\uFE0F","\u27A1\uFE0F","\u2198\uFE0F","\u2B07\uFE0F","\u2199\uFE0F","\u2B05\uFE0F","\u2196\uFE0F"]),la=m(y,["\u25B0\u25B1\u25B1\u25B1\u25B1","\u25B0\u25B1\u25B1\u25B1\u25B1","\u25B1\u25B0\u25B1\u25B1\u25B1","\u25B1\u25B1\u25B0\u25B1\u25B1","\u25B1\u25B1\u25B1\u25B0\u25B1","\u25B1\u25B1\u25B1\u25B1\u25B0","\u25B1\u25B1\u25B1\u25B1\u25B0","\u25B1\u25B1\u25B1\u25B0\u25B1","\u25B1\u25B1\u25B0\u25B1\u25B1","\u25B1\u25B0\u25B1\u25B1\u25B1"]),pa=m(y,["\u25B1\u25B1\u25B0\u25B1\u25B1","\u25B1\u25B1\u25B1\u25B0\u25B1","\u25B1\u25B1\u25B1\u25B0\u25B0","\u25B1\u25B1\u25B1\u25B0\u25B0","\u25B1\u25B1\u25B1\u25B1\u25B0","\u25B1\u25B1\u25B1\u25B1\u25B0","\u25B1\u25B1\u25B1\u25B1\u25B0","\u25B1\u25B1\u25B1\u25B0\u25B0","\u25B1\u25B1\u25B1\u25B0\u25B0","\u25B1\u25B1\u25B1\u25B0\u25B1","\u25B1\u25B1\u25B0\u25B1\u25B1","\u25B1\u25B0\u25B1\u25B1\u25B1","\u25B0\u25B0\u25B1\u25B1\u25B1","\u25B0\u25B0\u25B1\u25B1\u25B1","\u25B0\u25B1\u25B1\u25B1\u25B1","\u25B0\u25B1\u25B1\u25B1\u25B1","\u25B0\u25B1\u25B1\u25B1\u25B1","\u25B0\u25B0\u25B1\u25B1\u25B1","\u25B0\u25B0\u25B1\u25B1\u25B1","\u25B1\u25B0\u25B1\u25B1\u25B1"]),ca=m(y,["\u25B0\u25B1\u25B1\u25B1\u25B1","\u25B0\u25B1\u25B1\u25B1\u25B1","\u25B0\u25B0\u25B1\u25B1\u25B1","\u25B0\u25B0\u25B0\u25B1\u25B1","\u25B1\u25B0\u25B0\u25B0\u25B1","\u25B1\u25B1\u25B0\u25B0\u25B0","\u25B1\u25B1\u25B1\u25B0\u25B0","\u25B1\u25B1\u25B1\u25B1\u25B0","\u25B1\u25B1\u25B1\u25B1\u25B0","\u25B1\u25B1\u25B1\u25B0\u25B0","\u25B1\u25B1\u25B0\u25B0\u25B0","\u25B1\u25B0\u25B0\u25B0\u25B1","\u25B0\u25B0\u25B0\u25B1\u25B1","\u25B0\u25B0\u25B1\u25B1\u25B1"]),ha=m(y,["\u25B1\u25B1\u25B1\u25B1\u25B1","\u25B1\u25B1\u25B1\u25B1\u25B1","\u25B0\u25B1\u25B1\u25B1\u25B1","\u25B0\u25B0\u25B1\u25B1\u25B1","\u25B0\u25B0\u25B0\u25B1\u25B1","\u25B0\u25B0\u25B0\u25B0\u25B1","\u25B0\u25B0\u25B0\u25B0\u25B0","\u25B0\u25B0\u25B0\u25B0\u25B0","\u25B1\u25B0\u25B0\u25B0\u25B0","\u25B1\u25B1\u25B0\u25B0\u25B0","\u25B1\u25B1\u25B1\u25B0\u25B0","\u25B1\u25B1\u25B1\u25B1\u25B0"]),ua=m(y,["\u2581\u2581\u2581\u2581\u2581","\u2581\u2581\u2581\u2581\u2581","\u2588\u2581\u2581\u2581\u2581","\u2588\u2588\u2581\u2581\u2581","\u2588\u2588\u2588\u2581\u2581","\u2588\u2588\u2588\u2588\u2581","\u2588\u2588\u2588\u2588\u2588","\u2588\u2588\u2588\u2588\u2588","\u2581\u2588\u2588\u2588\u2588","\u2581\u2581\u2588\u2588\u2588","\u2581\u2581\u2581\u2588\u2588","\u2581\u2581\u2581\u2581\u2588"]),da=m(y,["\u2588\u2581\u2581\u2581\u2581","\u2588\u2581\u2581\u2581\u2581","\u2588\u2588\u2581\u2581\u2581","\u2588\u2588\u2588\u2581\u2581","\u2588\u2588\u2588\u2588\u2581","\u2588\u2588\u2588\u2588\u2588","\u2588\u2588\u2588\u2588\u2588","\u2581\u2588\u2588\u2588\u2588","\u2581\u2581\u2588\u2588\u2588","\u2581\u2581\u2581\u2588\u2588","\u2581\u2581\u2581\u2581\u2588","\u2581\u2581\u2581\u2581\u2588","\u2581\u2581\u2581\u2588\u2588","\u2581\u2581\u2588\u2588\u2588","\u2581\u2588\u2588\u2588\u2588","\u2588\u2588\u2588\u2588\u2588","\u2588\u2588\u2588\u2588\u2588","\u2588\u2588\u2588\u2588\u2581","\u2588\u2588\u2588\u2581\u2581","\u2588\u2588\u2581\u2581\u2581"]),ma=m(ot,["\u{1F6B6}","\u{1F3C3}"]),fa=m(st,["\u25F7","\u25F6","\u25F5","\u25F4"]),ba=m(y,["=----","-=---","--=--","---=-","----=","----=","---=-","--=--","-=---","=----"]),ga=m(y,["o----","-o---","--o--","---o-","----o","----o","---o-","--o--","-o---","o----"]),ya=m(st,["[ ]","[ ]","[= ]","[== ]","[===]","[ ==]","[ =]"]),xa=m(st,["[ ]","[ ]","[= ]","[== ]","[===]","[ ==]","[ =]","[ ]","[ ]","[ =]","[ ==]","[===]","[== ]","[= ]"]),va=m(st,[" "," ",". ",".. ","..."," .."," ."]),wa=m(y,[". ",". ",".. ","..."," .."," ."," ."," ..","...",".. "]),$a=m(y,[".....",".....",":....","::...",":::..","::::.",":::::",":::::",".::::","..:::","...::","....:"]),_a=m(y,[":....",":....","::...",".::..","..::.","...::","....:","....:","...::","..::.",".::..","::..."]),Aa=m(y,[".....",".....","..:..",".:::.",".:::.",":::::",":::::","::.::",":...:"]),Sa=m(y,[".....",".....","..:..",".:::.",".:::.",":::::",":::::","::.::",":...:",".....",".....",":...:","::.::",":::::",":::::",".:::.",".:::.","..:.."]),ka=m(y,["000","100","110","111","011","001"]),Ca=m(y,["11111","01111","00111","10011","11001","01100","00110","10011","11001","11100","11110"]),Ea=m(y,["11111","01111","10111","11011","11101","11110","11111","11110","11101","11011","10111","01111"]),Ta=m(ot,["\u{1F539}","\u{1F535}"]),za=m(st,["\u{1F642}","\u{1F642}","\u{1F617}","\u{1F619}","\u{1F618}","\u{1F618}","\u{1F619}"]),Pa=m(y,["\u{1F550}","\u{1F551}","\u{1F552}","\u{1F553}","\u{1F554}","\u{1F555}","\u{1F556}","\u{1F557}","\u{1F558}","\u{1F559}","\u{1F55A}","\u{1F55B}"]),Oa=m(y,["\u{1F91C} \u{1F91B}","\u{1F91C} \u{1F91B}","\u{1F91C} \u{1F91B}"," \u{1F91C} \u{1F91B} "," \u{1F91C}\u{1F91B} "," \u{1F91C}\u{1F91B} "," \u{1F91C}\u{1F4A5}\u{1F91B} ","\u{1F91C} \u{1F4A5} \u{1F91B}","\u{1F91C} \u2728 \u{1F91B}","\u{1F91C} \u2728 \u{1F91B}"]),Kr=m(ot,["\u{1F30E}","\u{1F30F}","\u{1F30D}"]),Ra=m(ot,["\u{1F513}","\u{1F512}"]),Ma=m(ot,["\u{1F505}","\u{1F506}"]),Ba=m(ot,["\u{1F508}","\u{1F508}","\u{1F509}","\u{1F50A}","\u{1F50A}","\u{1F509}"]),Na=m(st,["\u{1F311}","\u{1F311}","\u{1F311}","\u{1F318}","\u{1F317}","\u{1F316}","\u{1F315}","\u{1F314}","\u{1F313}","\u{1F312}"]);var Gr=f(r=>t=>(r.name("error"),r.styles(Y,ts),typeof t=="string"?t:t instanceof Error?h`<strong>${t.name}:</strong> <span>${t.message}</span>`:"error")),ts=c`
|
|
27
27
|
:host {
|
|
28
28
|
font-family: monospace;
|
|
29
29
|
color: red;
|
|
30
30
|
}
|
|
31
|
-
`;function
|
|
31
|
+
`;function os(r,t){return t.transmute((...e)=>[r,...e])}function ir(r){return Ot(r).map(t=>t.view)}function ar(r,t){return Ot(t).map(e=>class extends e{context=r;static view=os(r,super.view)})}var lr=()=>new Pt(()=>["lorem kettlebell dolor sit amet, mountain squats consectetur trail-running. adipiscing deadlift elit, sed do 45lb turkish get-up eiusmod tempor incididunt ut hike magna aliqua. ut enim ad minim clean & press, quis nostrud exercitation lunges ullamco kettlebell snatch trailhead nisi ut aliquip ex dolore summit irure dolor.","lorem protein dolor sit amet, creatine scoop elit shaker bottle tempor. grilled steak magna keto-fasting culpa, carb-loading perspiciatis cheat day. whey isolate dolor sit macros elit, intermittent fasting tempor electrolyte magna; barefoot shoes culpa, liver perspiciatis ancestral squat rack gospel. lorem bulking dolor sit cut elit, tdee tracker tempor calorie deficit magna; chicken breast culpa gatorade perspiciatis meal prep.","lorem caffeine dolor sit amet, double espresso elit cold brew tempor jitter. adderall magna focus culpa, lion\u2019s mane perspiciatis nootropic. nicotine gum dolor sit vape elit, dopamine hit tempor buzz magna; lsd microdosing culpa, productivity perspiciatis agile sprint. lorem latte dolor sit drip elit, french press tempor aeropress magna; insomnia culpa, circadian rhythm perspiciatis blue light filter.","lorem arch dolor sit amet, pacman -Syu elit rolling release tempor breakage. i3-gaps commodo tiling, bspwm magna culpa xinitrc. alias neovim configs in .dotfiles forest, r/unixporn veniam rice showcase perspiciatis.","lorem authlocal dolor sit amet, user-sovereign identity elit, cryptographic tempor signatures. ed25519 magna keypair culpa, elliptic perspiciatis handshake ut zero-knowledge proof. decentralized login elit mnemonic seed tempor recovery phrase. did magna alias culpa federation, lorem oauth2 perspiciatis antiquated.","lorem webgpu dolor sit amet, fragment shader elit vertex buffer tempor pipeline; bindgroup magna sampler culpa, wgsl perspiciatis alignment bug. compute pass workgroup barrier magna, mipmap cascade culpa drawcall instancing overflow. spir-v dolor sit wasm elit, canvas context lost magna; fallback webgl2 perspiciatis, polyfill slowpath dolore, glsl antique culpa extension hell 144hz tearing. command encoder perspiciatis out-of-memory, chromium nightly.","lorem sedentary dolor sit amet, infinite scroll elit chair-bound tempor. commit marathon magna carpal tunnel culpa, caffeine perspiciatis heartbeat irregular. lorem backlog dolor sit ticket elit, jira sprint tempor sedentary slump magna; gym membership culpa expired, standing desk perspiciatis unused. lorem procrastination dolor sit youtube elit, keyboard crumbs tempor pizza box magna; cardio avoidant culpa, hike someday perspiciatis maybe."]);var ge=lr(),N=()=>ge.takeFirst();var pr=c`@layer view {
|
|
32
|
+
|
|
33
|
+
:host {
|
|
34
|
+
position: relative;
|
|
35
|
+
|
|
36
|
+
display: flex;
|
|
37
|
+
flex-direction: column;
|
|
38
|
+
|
|
39
|
+
padding: 1em;
|
|
40
|
+
border-radius: 0.5em;
|
|
41
|
+
gap: 1em;
|
|
42
|
+
|
|
43
|
+
background: linear-gradient(to right top, #252dd985, #aa6affbd);
|
|
44
|
+
backdrop-filter: blur(0.5em);
|
|
45
|
+
|
|
46
|
+
box-shadow: 0 0 5em #5d1fadaa;
|
|
47
|
+
border-top: 2px solid #fff4;
|
|
48
|
+
|
|
49
|
+
&::before {
|
|
50
|
+
content: "";
|
|
51
|
+
display: block;
|
|
52
|
+
position: absolute;
|
|
53
|
+
inset: 0;
|
|
54
|
+
border-radius: 0.5em;
|
|
55
|
+
background: #0007;
|
|
56
|
+
width: calc(100% - 0.3em);
|
|
57
|
+
height: calc(100% - 0.3em);
|
|
58
|
+
margin: auto;
|
|
59
|
+
z-index: 0;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
> * {
|
|
63
|
+
position: relative;
|
|
64
|
+
z-index: 1;
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
header {
|
|
69
|
+
display: flex;
|
|
70
|
+
flex-wrap: wrap;
|
|
71
|
+
place-content: center center;
|
|
72
|
+
gap: 0.5em;
|
|
73
|
+
|
|
74
|
+
h2 {
|
|
75
|
+
flex: 1 1 auto;
|
|
76
|
+
color: var(--prime);
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
}`;function Jt(){return{bg:"#111",alpha:"#def",lame:"#8888",angry:"#f50",zesty:"#cf0",happy:"#0fa",calm:"#0af",sad:"#74f",quirky:"#f49","inactive-opacity":"0.5","anim-duration":"300ms"}}function Kt(r){return $t(Object.entries(r).map(([t,e])=>`--${t}: var(--shiny-${t}, ${e});`).join(`
|
|
81
|
+
`))}var cr=c`@layer overlay {
|
|
82
|
+
|
|
83
|
+
:host {
|
|
84
|
+
${Kt({...Jt()})}
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
:host([view="shiny-button"]:not([plain])) {
|
|
88
|
+
position: relative;
|
|
89
|
+
|
|
90
|
+
--buttoncolor: var(--calm);
|
|
91
|
+
--padding: 0.3em 0.7em;
|
|
92
|
+
|
|
93
|
+
color: white;
|
|
94
|
+
border-radius: 2em;
|
|
95
|
+
background: var(--buttoncolor);
|
|
96
|
+
border: none;
|
|
97
|
+
|
|
98
|
+
font-weight: medium;
|
|
99
|
+
text-shadow: 0.1em 0.1em 0.1em #0004;
|
|
100
|
+
box-shadow: 0.1em 0.2em 0.3em #0002;
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
:host([view="shiny-button"][lame]) { --buttoncolor: var(--lame); }
|
|
104
|
+
:host([view="shiny-button"][angry]) { --buttoncolor: var(--angry); }
|
|
105
|
+
:host([view="shiny-button"][zesty]) { --buttoncolor: var(--zesty); }
|
|
106
|
+
:host([view="shiny-button"][happy]) { --buttoncolor: var(--happy); }
|
|
107
|
+
:host([view="shiny-button"][calm]) { --buttoncolor: var(--calm); }
|
|
108
|
+
:host([view="shiny-button"][sad]) { --buttoncolor: var(--sad); }
|
|
109
|
+
:host([view="shiny-button"][quirky]) { --buttoncolor: var(--quirky); }
|
|
110
|
+
|
|
111
|
+
:host([view="shiny-button"][gradient]:not([plain])) {
|
|
112
|
+
border: none;
|
|
113
|
+
background: linear-gradient(
|
|
114
|
+
to bottom right,
|
|
115
|
+
color-mix(in oklab, var(--buttoncolor), white 40%),
|
|
116
|
+
color-mix(in oklab, var(--buttoncolor), black 20%)
|
|
117
|
+
);
|
|
118
|
+
|
|
119
|
+
&::before {
|
|
120
|
+
content: "";
|
|
121
|
+
display: block;
|
|
122
|
+
position: absolute;
|
|
123
|
+
z-index: 0;
|
|
124
|
+
inset: 0.15em;
|
|
125
|
+
border-radius: inherit;
|
|
126
|
+
background: color-mix(in oklab, var(--buttoncolor), #0004 50%);
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
> * {
|
|
130
|
+
position: relative;
|
|
131
|
+
z-index: 1;
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
:host([view="shiny-drawer"]:not([plain])) {
|
|
136
|
+
display: block;
|
|
137
|
+
|
|
138
|
+
&::part(slate) {
|
|
139
|
+
padding: 1em;
|
|
140
|
+
background: linear-gradient(
|
|
141
|
+
to top right,
|
|
142
|
+
#00a9dd69,
|
|
143
|
+
#70ffd77a
|
|
144
|
+
);
|
|
145
|
+
}
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
:host([view="shiny-drawer"]:state(left)) {
|
|
149
|
+
&::part(slate) {
|
|
150
|
+
border-bottom-right-radius: 0.5em;
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
:host([view="shiny-drawer"]:state(right)) {
|
|
155
|
+
&::part(slate) {
|
|
156
|
+
border-bottom-left-radius: 0.5em;
|
|
157
|
+
}
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
}`;var hr=c`@layer overlay {
|
|
161
|
+
|
|
162
|
+
:host {
|
|
163
|
+
${Kt(Jt())}
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
}`;var ur=c`@layer view {
|
|
32
167
|
|
|
33
168
|
:host {
|
|
34
169
|
opacity: 0.8;
|
|
@@ -72,7 +207,6 @@ button {
|
|
|
72
207
|
font: inherit;
|
|
73
208
|
color: inherit;
|
|
74
209
|
cursor: inherit;
|
|
75
|
-
outline: inherit;
|
|
76
210
|
text-shadow: inherit;
|
|
77
211
|
|
|
78
212
|
display: inline-flex;
|
|
@@ -88,24 +222,24 @@ slot {
|
|
|
88
222
|
display: contents;
|
|
89
223
|
}
|
|
90
224
|
|
|
91
|
-
}`;var A=
|
|
225
|
+
}`;var A=c`
|
|
92
226
|
|
|
93
227
|
@layer reset, underlay, view, overlay;
|
|
94
228
|
|
|
95
|
-
${
|
|
229
|
+
${Y}
|
|
96
230
|
|
|
97
231
|
@layer overlay {
|
|
98
232
|
[hidden] { display: none !important; }
|
|
99
233
|
}
|
|
100
234
|
|
|
101
|
-
`;var S=class extends
|
|
235
|
+
`;var S=class extends B{context};var Qt=class extends f(t=>(e,s)=>{t.name("shiny-button"),t.styles(A,e.theme,ur);let o=t.attrs.spec({disabled:Boolean,hidden:Boolean});return h`
|
|
102
236
|
<button
|
|
103
237
|
part=button
|
|
104
|
-
?disabled="${
|
|
105
|
-
?hidden="${
|
|
106
|
-
<slot
|
|
238
|
+
?disabled="${o.disabled}"
|
|
239
|
+
?hidden="${o.hidden}">
|
|
240
|
+
<slot>${s}</slot>
|
|
107
241
|
</button>
|
|
108
|
-
`}).component(S).props(t=>[t.context]){};var
|
|
242
|
+
`}).component(S).props(t=>[t.context]){};var dr=c`@layer view {
|
|
109
243
|
|
|
110
244
|
button {
|
|
111
245
|
background: transparent;
|
|
@@ -147,19 +281,19 @@ svg {
|
|
|
147
281
|
height: 1em;
|
|
148
282
|
}
|
|
149
283
|
|
|
150
|
-
}`;var
|
|
151
|
-
<button data-status="${
|
|
284
|
+
}`;var ye=C`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-clipboard"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2" /><path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z" /></svg>`;var mr=C`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-clipboard-x"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M17.997 4.17a3 3 0 0 1 2.003 2.83v12a3 3 0 0 1 -3 3h-10a3 3 0 0 1 -3 -3v-12a3 3 0 0 1 2.003 -2.83a4 4 0 0 0 3.997 3.83h4a4 4 0 0 0 3.98 -3.597zm-7.29 7.123a1 1 0 0 0 -1.414 0l-.083 .094a1 1 0 0 0 .083 1.32l1.292 1.293l-1.292 1.293a1 1 0 0 0 0 1.414l.094 .083a1 1 0 0 0 1.32 -.083l1.293 -1.293l1.293 1.293a1 1 0 0 0 1.414 0l.083 -.094a1 1 0 0 0 -.083 -1.32l-1.293 -1.293l1.293 -1.293a1 1 0 0 0 0 -1.414l-.094 -.083a1 1 0 0 0 -1.32 .083l-1.293 1.292zm3.293 -9.293a2 2 0 1 1 0 4h-4a2 2 0 1 1 0 -4z" /></svg>`;var fr=C`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-clipboard-check"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M17.997 4.17a3 3 0 0 1 2.003 2.83v12a3 3 0 0 1 -3 3h-10a3 3 0 0 1 -3 -3v-12a3 3 0 0 1 2.003 -2.83a4 4 0 0 0 3.997 3.83h4a4 4 0 0 0 3.98 -3.597zm-3.704 7.123l-3.293 3.292l-1.293 -1.292a1 1 0 1 0 -1.414 1.414l2 2a1 1 0 0 0 1.414 0l4 -4a1 1 0 0 0 -1.414 -1.414m-.293 -9.293a2 2 0 1 1 0 4h-4a2 2 0 1 1 0 -4z" /></svg>`;var Gt=class extends f(t=>(e,s,o=1e3)=>{t.name("shiny-copy"),t.styles(A,e.theme,dr);let n=()=>s===void 0?"invalid":"neutral",i=t.signal(n()),l=t.once(()=>O(o,()=>i.set(n()))),a=t.once(()=>async p=>{await i.set(p),await l()});async function u(){if(s!==void 0)try{if(t.attrs.booleans.fail)throw new Error("copy failed on purpose for testing purposes");await navigator.clipboard.writeText(s),await a("good")}catch(p){console.error(p),await a("bad")}}let g=(()=>{switch(i.get()){case"neutral":return ye;case"invalid":return ye;case"good":return fr;case"bad":return mr;default:throw new Error("unknown copy status")}})();return h`
|
|
285
|
+
<button data-status="${i.get()}" @click="${u}">
|
|
152
286
|
${g}
|
|
153
287
|
</button>
|
|
154
|
-
`}).component(class extends S{#t=
|
|
288
|
+
`}).component(class extends S{#t=d.attrs(this).spec({text:String,ms:Number});get text(){return this.#t.text}set text(t){this.#t.text=t}get ms(){return this.#t.ms}set ms(t){this.#t.ms=t}}).props(t=>[t.context,t.text,t.ms]){};var br=c`@layer view {
|
|
155
289
|
|
|
156
290
|
:host {
|
|
157
291
|
display: block;
|
|
158
292
|
width: 100%;
|
|
159
293
|
height: 100%;
|
|
160
294
|
--button-size: 2em;
|
|
161
|
-
--anim-duration: 200ms;
|
|
162
295
|
--blanket-backdrop-filter: blur(0.5em);
|
|
296
|
+
--slate-hidden-opacity: 1;
|
|
163
297
|
--blanket-bg: color-mix(in oklab, transparent, var(--bg));
|
|
164
298
|
}
|
|
165
299
|
|
|
@@ -203,12 +337,15 @@ svg {
|
|
|
203
337
|
height: auto;
|
|
204
338
|
max-height: 100%;
|
|
205
339
|
|
|
206
|
-
opacity: 1;
|
|
207
340
|
transform: translateX(-100%);
|
|
208
341
|
will-change: opacity, transform;
|
|
209
342
|
transition: all var(--anim-duration) ease;
|
|
210
343
|
|
|
211
|
-
>
|
|
344
|
+
> [part="slate"] {
|
|
345
|
+
opacity: var(--slate-hidden-opacity);
|
|
346
|
+
will-change: opacity;
|
|
347
|
+
transition: opacity var(--anim-duration) ease;
|
|
348
|
+
|
|
212
349
|
display: block;
|
|
213
350
|
height: 100%;
|
|
214
351
|
overflow-y: auto;
|
|
@@ -261,50 +398,51 @@ svg {
|
|
|
261
398
|
opacity: 1;
|
|
262
399
|
}
|
|
263
400
|
[part="tray"] {
|
|
264
|
-
opacity: 1;
|
|
265
401
|
transform: translateX(0%);
|
|
402
|
+
> [part="slate"] {
|
|
403
|
+
opacity: 1;
|
|
404
|
+
}
|
|
266
405
|
}
|
|
267
406
|
}
|
|
268
407
|
}
|
|
269
408
|
|
|
270
|
-
}`;var
|
|
271
|
-
|
|
272
|
-
|
|
409
|
+
}`;var xt=class{$open=v(!1);constructor(t=!1){t&&this.$open.set(!0)}get isOpen(){return this.$open.get()}async setOpen(t){return this.$open.set(t)}open=async()=>{await this.setOpen(!0)};close=async()=>{await this.setOpen(!1)};toggle=async()=>this.setOpen(!this.isOpen)};var te=class{#t;constructor(t){this.#t=t.attachInternals().states}assign(...t){this.#t.forEach(e=>this.#t.delete(e));for(let e of t)this.#t.add(e);return this}};var gr=C`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-x"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18 6l-12 12" /><path d="M6 6l12 12" /></svg>`;var yr=C`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-menu-2"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 6l16 0" /><path d="M4 12l16 0" /><path d="M4 18l16 0" /></svg>`;var ee=class extends f(t=>(e,s)=>{t.name("shiny-drawer"),t.styles(A,e.theme,br);let o=t.once(()=>new te(t.element)),n=s.button??t.attrs.booleans.button,i=s.side??(t.attrs.strings.side==="right"?"right":"left"),l=t.once(()=>s.control??new xt);o.assign(i),t.mount(()=>d.events(window,{keydown:u=>{u.code==="Escape"&&l.close()}})),d.attrs(t.element).booleans.open=l.isOpen;function a(){return h`
|
|
410
|
+
<button @click="${l.toggle}">
|
|
411
|
+
${l.isOpen?h`
|
|
412
|
+
<slot name=button-x>
|
|
413
|
+
${gr}
|
|
414
|
+
</slot>
|
|
415
|
+
`:h`
|
|
416
|
+
<slot name=button>
|
|
417
|
+
${yr}
|
|
418
|
+
</slot>
|
|
419
|
+
`}
|
|
420
|
+
</button>
|
|
421
|
+
`}return h`
|
|
422
|
+
<div class=shell ?data-open="${l.isOpen}" data-side="${i}">
|
|
423
|
+
<slot name=plate ?inert="${l.isOpen}"></slot>
|
|
273
424
|
|
|
274
425
|
<div class=clipper>
|
|
275
|
-
<div part=blanket @click="${
|
|
426
|
+
<div part=blanket @click="${l.close}" ?inert="${!l.isOpen}"></div>
|
|
276
427
|
|
|
277
428
|
<div part=tray>
|
|
278
|
-
<slot ?inert="${!
|
|
279
|
-
|
|
280
|
-
${s.button?m`
|
|
281
|
-
<button @click="${n.toggle}">
|
|
282
|
-
${n.isOpen?m`
|
|
283
|
-
<slot name=button-x>
|
|
284
|
-
${ar}
|
|
285
|
-
</slot>
|
|
286
|
-
`:m`
|
|
287
|
-
<slot name=button>
|
|
288
|
-
${lr}
|
|
289
|
-
</slot>
|
|
290
|
-
`}
|
|
291
|
-
</button>
|
|
292
|
-
`:null}
|
|
429
|
+
<slot part=slate ?inert="${!l.isOpen}"></slot>
|
|
430
|
+
${n?a():null}
|
|
293
431
|
</div>
|
|
294
432
|
</div>
|
|
295
433
|
</div>
|
|
296
|
-
`}).component(class extends S{#t=
|
|
434
|
+
`}).component(class extends S{#t=d.attrs(this).spec({open:Boolean,button:Boolean,side:String});get button(){return this.#t.button}set button(t){this.#t.button=t}get side(){return this.#t.side==="right"?"right":"left"}set side(t){this.#t.side=t}control=new xt(this.#t.open);get isOpen(){return this.control.isOpen}get toggle(){return this.control.toggle}get open(){return this.control.open}get close(){return this.control.close}}).props(t=>[t.context,{control:t.control}]){};var xr=c`@layer view {
|
|
297
435
|
|
|
298
436
|
button {
|
|
299
437
|
padding: 1em;
|
|
300
438
|
min-width: 4em;
|
|
301
439
|
}
|
|
302
440
|
|
|
303
|
-
}`;var
|
|
441
|
+
}`;var re=class extends f(t=>(e,s)=>{t.name("shiny-example"),t.styles(A,e.theme,xr);let o=t.signal(s);return h`
|
|
304
442
|
<button @click="${()=>{o.value++}}">
|
|
305
443
|
${o()}
|
|
306
444
|
</button>
|
|
307
|
-
`}).component(class extends S{attrs=
|
|
445
|
+
`}).component(class extends S{attrs=d.attrs(this).spec({start:Number})}).props(t=>[t.context,t.attrs.start??1]){};var vr=c`@layer view {
|
|
308
446
|
|
|
309
447
|
:host {
|
|
310
448
|
display: inline-flex;
|
|
@@ -313,16 +451,19 @@ button {
|
|
|
313
451
|
|
|
314
452
|
slot[part="tabs"] {
|
|
315
453
|
display: flex;
|
|
316
|
-
|
|
317
|
-
&::slotted(*) {
|
|
318
|
-
border-radius: 0.3em;
|
|
319
|
-
}
|
|
454
|
+
flex-wrap: wrap;
|
|
320
455
|
|
|
321
456
|
&::slotted([data-active]) {
|
|
322
457
|
opacity: 1;
|
|
323
458
|
color: currentColor;
|
|
324
459
|
text-decoration: underline;
|
|
325
460
|
}
|
|
461
|
+
}
|
|
462
|
+
|
|
463
|
+
:host([snug]) slot[part="tabs"] {
|
|
464
|
+
&::slotted(*) {
|
|
465
|
+
border-radius: 0.3em;
|
|
466
|
+
}
|
|
326
467
|
|
|
327
468
|
&::slotted(:not([data-last], [data-next-is-active])) {
|
|
328
469
|
border-right: none;
|
|
@@ -343,237 +484,327 @@ slot[part="tabs"] {
|
|
|
343
484
|
}
|
|
344
485
|
}
|
|
345
486
|
|
|
346
|
-
} `;var
|
|
487
|
+
} `;var E=class{length=1;$index=v(0);constructor(t=0){this.$index.value=t}clamp(t){return t=Math.min(t,this.length-1),t=Math.max(t,0),t}get index(){return this.clamp(this.$index.get())}async setIndex(t){return this.$index.set(t)}async shimmy(t){let e=this.clamp(this.index+t);return this.setIndex(e)}};var se=class extends f(t=>(e,s)=>{t.name("shiny-tabs"),t.styles(A,e.theme,vr);let o=t.attrs.spec({index:Number}),n=t.once(()=>s??new E(o.index??0)),i=t.signal([]),l=t.signal([]);async function a(p){let b=p.currentTarget;await i.set(b.assignedElements())}async function u(p){let b=p.currentTarget;await l.set(b.assignedElements())}o.index=n.$index(),n.length=i().length;function g(p,b){let w=n.clamp(p+b);return w===p?!1:w===n.index}for(let[p,b]of i().entries()){let w=p===n.index,k=d.attrs(b);k.booleans.disabled=w,k.booleans["data-active"]=w,k.booleans["data-first"]=p===0,k.booleans["data-last"]=p===n.length-1,k.booleans["data-next-is-active"]=g(p,1),k.booleans["data-previous-is-active"]=g(p,-1),b.onclick=()=>n.setIndex(p)}for(let[p,b]of l().entries()){let w=p===n.index;d.attrs(b).booleans.active=w,d.attrs(b).booleans.hidden=!w}return h`
|
|
347
488
|
<slot part=tabs @slotchange="${a}"></slot>
|
|
348
489
|
<slot part=panels name=panel @slotchange="${u}"></slot>
|
|
349
|
-
`}).component(class extends S{control=new
|
|
350
|
-
`))}var ur=d`@layer overlay {
|
|
351
|
-
|
|
352
|
-
:host {
|
|
353
|
-
${ie({...oe()})}
|
|
354
|
-
}
|
|
355
|
-
|
|
356
|
-
:host([view="shiny-button"]:not([plain])) {
|
|
357
|
-
position: relative;
|
|
358
|
-
|
|
359
|
-
--buttoncolor: var(--calm);
|
|
360
|
-
--padding: 0.3em 0.7em;
|
|
361
|
-
|
|
362
|
-
color: white;
|
|
363
|
-
border-radius: 2em;
|
|
364
|
-
background: var(--buttoncolor);
|
|
365
|
-
border: none;
|
|
366
|
-
|
|
367
|
-
font-weight: medium;
|
|
368
|
-
text-shadow: 0.1em 0.1em 0.1em #0004;
|
|
369
|
-
box-shadow: 0.1em 0.2em 0.3em #0002;
|
|
370
|
-
}
|
|
371
|
-
|
|
372
|
-
:host([view="shiny-button"][lame]) { --buttoncolor: var(--lame); }
|
|
373
|
-
:host([view="shiny-button"][angry]) { --buttoncolor: var(--angry); }
|
|
374
|
-
:host([view="shiny-button"][zesty]) { --buttoncolor: var(--zesty); }
|
|
375
|
-
:host([view="shiny-button"][happy]) { --buttoncolor: var(--happy); }
|
|
376
|
-
:host([view="shiny-button"][calm]) { --buttoncolor: var(--calm); }
|
|
377
|
-
:host([view="shiny-button"][sad]) { --buttoncolor: var(--sad); }
|
|
378
|
-
:host([view="shiny-button"][quirky]) { --buttoncolor: var(--quirky); }
|
|
379
|
-
|
|
380
|
-
:host([view="shiny-button"][gradient]:not([plain])) {
|
|
381
|
-
border: none;
|
|
382
|
-
background: linear-gradient(
|
|
383
|
-
to bottom right,
|
|
384
|
-
color-mix(in oklab, var(--buttoncolor), white 40%),
|
|
385
|
-
color-mix(in oklab, var(--buttoncolor), black 20%)
|
|
386
|
-
);
|
|
387
|
-
|
|
388
|
-
&::before {
|
|
389
|
-
content: "";
|
|
390
|
-
display: block;
|
|
391
|
-
position: absolute;
|
|
392
|
-
z-index: 0;
|
|
393
|
-
inset: 0.15em;
|
|
394
|
-
border-radius: inherit;
|
|
395
|
-
background: color-mix(in oklab, var(--buttoncolor), #0004 50%);
|
|
396
|
-
}
|
|
397
|
-
|
|
398
|
-
> * {
|
|
399
|
-
position: relative;
|
|
400
|
-
z-index: 1;
|
|
401
|
-
}
|
|
402
|
-
}
|
|
403
|
-
|
|
404
|
-
:host([view="shiny-drawer"]) {
|
|
405
|
-
display: block;
|
|
406
|
-
|
|
407
|
-
&::part(tray) {
|
|
408
|
-
padding: 1em;
|
|
409
|
-
background: linear-gradient(
|
|
410
|
-
to top right,
|
|
411
|
-
#00a9dd69,
|
|
412
|
-
#70ffd77a
|
|
413
|
-
);
|
|
414
|
-
}
|
|
415
|
-
}
|
|
416
|
-
|
|
417
|
-
:host([view="shiny-drawer"]:state(left)) {
|
|
418
|
-
&::part(tray) {
|
|
419
|
-
border-bottom-right-radius: 0.5em;
|
|
420
|
-
}
|
|
421
|
-
}
|
|
422
|
-
|
|
423
|
-
:host([view="shiny-drawer"]:state(right)) {
|
|
424
|
-
&::part(tray) {
|
|
425
|
-
border-bottom-left-radius: 0.5em;
|
|
426
|
-
}
|
|
427
|
-
}
|
|
428
|
-
|
|
429
|
-
}`;var N=se({theme:ur}).views;var dr=d`@layer overlay {
|
|
490
|
+
`}).component(class extends S{control=new E;get index(){return this.control.index}get length(){return this.control.length}setIndex=this.control.setIndex.bind(this.control);shimmy=this.control.shimmy.bind(this.control)}).props(t=>[t.context,t.control]){};var wr={ShinyButton:Qt,ShinyCopy:Gt,ShinyDrawer:ee,ShinyExample:re,ShinyTabs:se};function xe(r){let t=ar(r,wr),e=ir(t);return{components:t,views:e}}var T=xe({theme:cr}).views,ve=[["aura",T],["plain",xe({theme:hr}).views]];var $r=c`@layer view {
|
|
430
491
|
|
|
431
492
|
:host {
|
|
432
|
-
${ie(oe())}
|
|
433
|
-
}
|
|
434
|
-
|
|
435
|
-
}`;var mr=()=>new Ot(()=>["lorem kettlebell dolor sit amet, mountain squats consectetur trail-running. adipiscing deadlift elit, sed do 45lb turkish get-up eiusmod tempor incididunt ut hike magna aliqua. ut enim ad minim clean & press, quis nostrud exercitation lunges ullamco kettlebell snatch trailhead nisi ut aliquip ex dolore summit irure dolor.","lorem protein dolor sit amet, creatine scoop elit shaker bottle tempor. grilled steak magna keto-fasting culpa, carb-loading perspiciatis cheat day. whey isolate dolor sit macros elit, intermittent fasting tempor electrolyte magna; barefoot shoes culpa, liver perspiciatis ancestral squat rack gospel. lorem bulking dolor sit cut elit, tdee tracker tempor calorie deficit magna; chicken breast culpa gatorade perspiciatis meal prep.","lorem caffeine dolor sit amet, double espresso elit cold brew tempor jitter. adderall magna focus culpa, lion\u2019s mane perspiciatis nootropic. nicotine gum dolor sit vape elit, dopamine hit tempor buzz magna; lsd microdosing culpa, productivity perspiciatis agile sprint. lorem latte dolor sit drip elit, french press tempor aeropress magna; insomnia culpa, circadian rhythm perspiciatis blue light filter.","lorem arch dolor sit amet, pacman -Syu elit rolling release tempor breakage. i3-gaps commodo tiling, bspwm magna culpa xinitrc. alias neovim configs in .dotfiles forest, r/unixporn veniam rice showcase perspiciatis.","lorem authlocal dolor sit amet, user-sovereign identity elit, cryptographic tempor signatures. ed25519 magna keypair culpa, elliptic perspiciatis handshake ut zero-knowledge proof. decentralized login elit mnemonic seed tempor recovery phrase. DID magna alias culpa federation, lorem oauth2 perspiciatis antiquated.","lorem webgpu dolor sit amet, fragment shader elit vertex buffer tempor pipeline; bindgroup magna sampler culpa, wgsl perspiciatis alignment bug. compute pass workgroup barrier magna, mipmap cascade culpa drawcall instancing overflow. spir-v dolor sit wasm elit, canvas context lost magna; fallback webgl2 perspiciatis, polyfill slowpath dolore, glsl antique culpa extension hell 144hz tearing. command encoder perspiciatis out-of-memory, chromium nightly.","lorem sedentary dolor sit amet, infinite scroll elit chair-bound tempor. commit marathon magna carpal tunnel culpa, caffeine perspiciatis heartbeat irregular. lorem backlog dolor sit ticket elit, jira sprint tempor sedentary slump magna; gym membership culpa expired, standing desk perspiciatis unused. lorem procrastination dolor sit youtube elit, keyboard crumbs tempor pizza box magna; cardio avoidant culpa, hike someday perspiciatis maybe."]);var fr=d`@layer view {
|
|
436
|
-
|
|
437
|
-
:host {
|
|
438
|
-
position: relative;
|
|
439
|
-
|
|
440
493
|
display: flex;
|
|
441
494
|
flex-wrap: wrap;
|
|
442
|
-
|
|
443
|
-
padding: 1em;
|
|
444
|
-
border-radius: 0.5em;
|
|
445
|
-
gap: 1em;
|
|
446
|
-
|
|
447
|
-
background: linear-gradient(to right top, #252dd985, #aa6affbd);
|
|
448
|
-
backdrop-filter: blur(0.5em);
|
|
449
|
-
|
|
450
|
-
box-shadow: 0 0 5em #5d1fadaa;
|
|
451
|
-
border-top: 2px solid #fff4;
|
|
452
|
-
|
|
453
|
-
&::before {
|
|
454
|
-
content: "";
|
|
455
|
-
display: block;
|
|
456
|
-
position: absolute;
|
|
457
|
-
inset: 0;
|
|
458
|
-
border-radius: 0.5em;
|
|
459
|
-
background: #0007;
|
|
460
|
-
width: calc(100% - 0.3em);
|
|
461
|
-
height: calc(100% - 0.3em);
|
|
462
|
-
margin: auto;
|
|
463
|
-
z-index: 0;
|
|
464
|
-
}
|
|
495
|
+
gap: 0.5em;
|
|
465
496
|
|
|
466
497
|
> * {
|
|
467
|
-
|
|
468
|
-
|
|
498
|
+
flex: 1 1 10em;
|
|
499
|
+
min-width: 0;
|
|
469
500
|
}
|
|
470
501
|
}
|
|
471
502
|
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
503
|
+
.meta {
|
|
504
|
+
display: flex;
|
|
505
|
+
flex-direction: column;
|
|
506
|
+
gap: 1em;
|
|
476
507
|
}
|
|
477
508
|
|
|
478
|
-
.
|
|
479
|
-
flex: 1
|
|
509
|
+
.snippet {
|
|
510
|
+
flex: 1 0 auto;
|
|
480
511
|
display: flex;
|
|
481
512
|
flex-direction: column;
|
|
482
513
|
gap: 0.5em;
|
|
514
|
+
padding: 0.5em;
|
|
483
515
|
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
[view="shiny-tabs"] {
|
|
489
|
-
gap: 0.5em;
|
|
490
|
-
&::part(tabs) {
|
|
491
|
-
font-size: 0.8em;
|
|
492
|
-
opacity: 0.8;
|
|
493
|
-
}
|
|
494
|
-
}
|
|
495
|
-
|
|
496
|
-
.codes {
|
|
497
|
-
display: flex;
|
|
498
|
-
flex-direction: column;
|
|
499
|
-
gap: 0.2em;
|
|
500
|
-
}
|
|
516
|
+
background: #0002;
|
|
517
|
+
box-shadow: inset 0.2em 0.3em 2em #0004;
|
|
518
|
+
border-radius: 0.5em;
|
|
501
519
|
|
|
502
|
-
|
|
520
|
+
> header {
|
|
503
521
|
display: flex;
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
border-bottom: 1px solid #fff2;
|
|
507
|
-
box-shadow: inset 0.2em 0.3em 2em #0004;
|
|
522
|
+
flex-wrap: wrap;
|
|
523
|
+
align-items: center;
|
|
508
524
|
|
|
509
|
-
.
|
|
525
|
+
[view="shiny-copy"] { font-size: 1.5em; }
|
|
526
|
+
[view="shiny-tabs"] {
|
|
510
527
|
flex: 1 1 auto;
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
h3 {
|
|
516
|
-
opacity: 0.4;
|
|
517
|
-
font-size: 0.7em;
|
|
518
|
-
font-weight: normal;
|
|
519
|
-
font-style: italic;
|
|
520
|
-
}
|
|
528
|
+
font-size: 0.8em;
|
|
529
|
+
color: color-mix(in oklab, transparent, currentColor 50%);
|
|
530
|
+
}
|
|
531
|
+
}
|
|
521
532
|
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
white-space: pre;
|
|
525
|
-
text-wrap: wrap;
|
|
526
|
-
tab-size: 2;
|
|
527
|
-
word-break: break-word;
|
|
533
|
+
> code {
|
|
534
|
+
display: block;
|
|
528
535
|
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
536
|
+
white-space: pre;
|
|
537
|
+
text-wrap: wrap;
|
|
538
|
+
tab-size: 2;
|
|
539
|
+
word-break: keep-all;
|
|
540
|
+
overflow: auto;
|
|
534
541
|
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
padding: 0.2em;
|
|
539
|
-
}
|
|
542
|
+
color: var(--code);
|
|
543
|
+
font-size: 0.8em;
|
|
544
|
+
font-family: monospace;
|
|
540
545
|
}
|
|
541
546
|
}
|
|
542
547
|
|
|
543
|
-
.
|
|
544
|
-
flex: 1 1 10rem;
|
|
548
|
+
.box {
|
|
545
549
|
display: flex;
|
|
546
|
-
flex-
|
|
550
|
+
flex-wrap: wrap;
|
|
547
551
|
justify-content: center;
|
|
548
552
|
align-items: center;
|
|
553
|
+
align-content: center;
|
|
554
|
+
|
|
555
|
+
gap: 0.5em;
|
|
556
|
+
padding: 1em;
|
|
549
557
|
|
|
550
|
-
padding: 1rem;
|
|
551
558
|
border-radius: 0.5rem;
|
|
552
|
-
border: 1px dashed
|
|
559
|
+
border: 1px dashed color-mix(in oklab, transparent, currentColor 30%);
|
|
560
|
+
|
|
561
|
+
p.lipsum {
|
|
562
|
+
opacity: 0.7;
|
|
563
|
+
font-family: serif;
|
|
564
|
+
font-style: italic;
|
|
565
|
+
}
|
|
553
566
|
}
|
|
554
567
|
|
|
555
|
-
}`;var
|
|
556
|
-
<div class=codeblock slot=panel>
|
|
557
|
-
<div class=zone>
|
|
558
|
-
<h3>${s}</h3>
|
|
559
|
-
<code>${i}</code>
|
|
560
|
-
</div>
|
|
561
|
-
${N.ShinyCopy(i)}
|
|
562
|
-
</div>
|
|
563
|
-
`}return m`
|
|
568
|
+
}`;var _r=f(r=>(t,e,s)=>{r.name(`exhibit-${t.label}`),r.styles(A,$r,s,t.style);let o=r.once(()=>new E),n=t.snippets.at(o.index),i=n?Fe(n.code).trim():"";return h`
|
|
564
569
|
<div class=meta>
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
${t.snippets.map((
|
|
570
|
-
|
|
570
|
+
${t.explain}
|
|
571
|
+
|
|
572
|
+
<div class=snippet>
|
|
573
|
+
<header>
|
|
574
|
+
${T.ShinyTabs.props(o).attr("snug").children(t.snippets.map(l=>T.ShinyButton.props().attr("plain").children(l.label).render())).render()}
|
|
575
|
+
${T.ShinyCopy(i)}
|
|
576
|
+
</header>
|
|
577
|
+
<code>${i}</code>
|
|
578
|
+
</div>
|
|
571
579
|
</div>
|
|
572
580
|
|
|
573
|
-
<div class=
|
|
574
|
-
${t.
|
|
581
|
+
<div class=box>
|
|
582
|
+
${t.presentation(e)}
|
|
575
583
|
</div>
|
|
576
|
-
`});var
|
|
584
|
+
`});var H=f(r=>t=>{r.name(`showcase-${t.name}`),r.styles(A,pr);let e=r.once(()=>new E),s=r.once(()=>new E),o=ve.at(s.index)[1],n=t.exhibits.at(e.index);return h`
|
|
585
|
+
<header>
|
|
586
|
+
<h2>✨shiny-${t.name}✨</h2>
|
|
587
|
+
${T.ShinyTabs.props(e).attr("snug").children(t.exhibits.map(i=>T.ShinyButton.props().attr("sad").children(i.label).render())).render()}
|
|
588
|
+
${T.ShinyTabs.props(s).attr("snug").children(ve.map(([i])=>T.ShinyButton.props().children(i).render())).render()}
|
|
589
|
+
</header>
|
|
590
|
+
|
|
591
|
+
${_r(n,o,t.style)}
|
|
592
|
+
`});var Ar=`
|
|
593
|
+
shiny-copy {
|
|
594
|
+
font-size: 1em;
|
|
595
|
+
--happy: #0fa;
|
|
596
|
+
--angry: #f50;
|
|
597
|
+
--lame: #8888;
|
|
598
|
+
--inactive-opacity: 0.5;
|
|
599
|
+
}
|
|
600
|
+
`,Sr=()=>H({name:"copy",style:c`
|
|
601
|
+
.box {
|
|
602
|
+
> * { font-size: 4em; }
|
|
603
|
+
}
|
|
604
|
+
`,exhibits:[{label:"succeed",explain:h`<p>click-to-copy text button.</p>`,snippets:[{label:"html",code:'<shiny-copy text="hello world"></shiny-button>'},{label:"view",code:'ShinyCopy("hello world")'},{label:"css",code:Ar}],style:c``,presentation:r=>h`
|
|
605
|
+
${r.ShinyCopy("hello world")}
|
|
606
|
+
`},{label:"fail",explain:h`<p>copy text button, deliberately fails so you can see.</p>`,snippets:[{label:"html",code:"<shiny-copy fail></shiny-button>"},{label:"view",code:'ShinyCopy.props("").attr("fail").render()'},{label:"css",code:Ar}],style:c``,presentation:r=>h`
|
|
607
|
+
${r.ShinyCopy.props("").attr("fail").render()}
|
|
608
|
+
`}]});var we=N(),$e=N(),_e=N(),Ae=`
|
|
609
|
+
shiny-tabs {
|
|
610
|
+
&::part(tabs) {}
|
|
611
|
+
&::part(panels) {}
|
|
612
|
+
> shiny-button {}
|
|
613
|
+
}
|
|
614
|
+
`,kr=()=>H({name:"tabs",style:c`
|
|
615
|
+
.box {
|
|
616
|
+
place-content: start start;
|
|
617
|
+
p { margin-top: 0.5em; }
|
|
618
|
+
button { padding: 1em; }
|
|
619
|
+
}
|
|
620
|
+
`,exhibits:[{label:"shiny snug",explain:h`<p>button bar. panels optional.</p>`,snippets:[{label:"html",code:`
|
|
621
|
+
<shiny-tabs snug>
|
|
622
|
+
<shiny-button>tab1</shiny-button>
|
|
623
|
+
<shiny-button>tab2</shiny-button>
|
|
624
|
+
<shiny-button>tab3</shiny-button>
|
|
625
|
+
<div slot=panel>panel1</div>
|
|
626
|
+
<div slot=panel>panel2</div>
|
|
627
|
+
<div slot=panel>panel3</div>
|
|
628
|
+
</shiny-tabs>
|
|
629
|
+
`},{label:"view",code:`
|
|
630
|
+
ShinyTabs
|
|
631
|
+
.props()
|
|
632
|
+
.attr("snug")
|
|
633
|
+
.children(html\`
|
|
634
|
+
\${ShinyButton.props().children("tab1").render()}
|
|
635
|
+
\${ShinyButton.props().children("tab2").render()}
|
|
636
|
+
\${ShinyButton.props().children("tab3").render()}
|
|
637
|
+
<div slot=panel>panel1</div>
|
|
638
|
+
<div slot=panel>panel2</div>
|
|
639
|
+
<div slot=panel>panel3</div>
|
|
640
|
+
\`)
|
|
641
|
+
.render()
|
|
642
|
+
`},{label:"css",code:Ae}],style:c``,presentation:r=>h`
|
|
643
|
+
${r.ShinyTabs.props().attr("snug").children(h`
|
|
644
|
+
${r.ShinyButton.props().children("tab1").render()}
|
|
645
|
+
${r.ShinyButton.props().children("tab2").render()}
|
|
646
|
+
${r.ShinyButton.props().children("tab3").render()}
|
|
647
|
+
<p slot=panel class=lipsum>${we}</p>
|
|
648
|
+
<p slot=panel class=lipsum>${$e}</p>
|
|
649
|
+
<p slot=panel class=lipsum>${_e}</p>
|
|
650
|
+
`).render()}
|
|
651
|
+
`},{label:"regular",explain:h`<p>button bar. panels optional.</p>`,snippets:[{label:"html",code:`
|
|
652
|
+
<shiny-tabs>
|
|
653
|
+
<button>tab1</button>
|
|
654
|
+
<button>tab2</button>
|
|
655
|
+
<button>tab3</button>
|
|
656
|
+
<div slot=panel>panel1</div>
|
|
657
|
+
<div slot=panel>panel2</div>
|
|
658
|
+
<div slot=panel>panel3</div>
|
|
659
|
+
</shiny-tabs>
|
|
660
|
+
`},{label:"view",code:`
|
|
661
|
+
ShinyTabs
|
|
662
|
+
.props()
|
|
663
|
+
.children(html\`
|
|
664
|
+
<button>tab1</button>
|
|
665
|
+
<button>tab2</button>
|
|
666
|
+
<button>tab3</button>
|
|
667
|
+
<div slot=panel>panel1</div>
|
|
668
|
+
<div slot=panel>panel2</div>
|
|
669
|
+
<div slot=panel>panel3</div>
|
|
670
|
+
\`)
|
|
671
|
+
.render()
|
|
672
|
+
`},{label:"css",code:Ae}],style:c``,presentation:r=>h`
|
|
673
|
+
${r.ShinyTabs.props().children(h`
|
|
674
|
+
<button>tab1</button>
|
|
675
|
+
<button>tab2</button>
|
|
676
|
+
<button>tab3</button>
|
|
677
|
+
<p slot=panel class=lipsum>${we}</p>
|
|
678
|
+
<p slot=panel class=lipsum>${$e}</p>
|
|
679
|
+
<p slot=panel class=lipsum>${_e}</p>
|
|
680
|
+
`).render()}
|
|
681
|
+
`},{label:"regular snug",explain:h`<p>button bar. panels optional.</p>`,snippets:[{label:"html",code:`
|
|
682
|
+
<shiny-tabs snug>
|
|
683
|
+
<button>tab1</button>
|
|
684
|
+
<button>tab2</button>
|
|
685
|
+
<button>tab3</button>
|
|
686
|
+
<div slot=panel>panel1</div>
|
|
687
|
+
<div slot=panel>panel2</div>
|
|
688
|
+
<div slot=panel>panel3</div>
|
|
689
|
+
</shiny-tabs>
|
|
690
|
+
`},{label:"view",code:`
|
|
691
|
+
ShinyTabs
|
|
692
|
+
.props()
|
|
693
|
+
.attr("snug")
|
|
694
|
+
.children(html\`
|
|
695
|
+
<button>tab1</button>
|
|
696
|
+
<button>tab2</button>
|
|
697
|
+
<button>tab3</button>
|
|
698
|
+
<div slot=panel>panel1</div>
|
|
699
|
+
<div slot=panel>panel2</div>
|
|
700
|
+
<div slot=panel>panel3</div>
|
|
701
|
+
\`)
|
|
702
|
+
.render()
|
|
703
|
+
`},{label:"css",code:Ae}],style:c``,presentation:r=>h`
|
|
704
|
+
${r.ShinyTabs.props().attr("snug").children(h`
|
|
705
|
+
<button>tab1</button>
|
|
706
|
+
<button>tab2</button>
|
|
707
|
+
<button>tab3</button>
|
|
708
|
+
<p slot=panel class=lipsum>${we}</p>
|
|
709
|
+
<p slot=panel class=lipsum>${$e}</p>
|
|
710
|
+
<p slot=panel class=lipsum>${_e}</p>
|
|
711
|
+
`).render()}
|
|
712
|
+
`}]});var Se=`
|
|
713
|
+
shiny-button {
|
|
714
|
+
--padding: 0.3em;
|
|
715
|
+
font-size: 1em;
|
|
716
|
+
color: currentColor;
|
|
717
|
+
background: transparent;
|
|
718
|
+
}
|
|
719
|
+
`,Cr=()=>H({name:"button",style:c`
|
|
720
|
+
.box {
|
|
721
|
+
> * { font-size: 1.5em; }
|
|
722
|
+
}
|
|
723
|
+
`,exhibits:[{label:"basic",explain:h`<p>clicky-clacky pressy button.</p>`,snippets:[{label:"html",code:"<shiny-button>button</shiny-button>"},{label:"view",code:'ShinyButton("button")'},{label:"css",code:Se}],style:c``,presentation:r=>h`
|
|
724
|
+
${r.ShinyButton.props().children("button").render()}
|
|
725
|
+
`},{label:"gradient",explain:h`<p>added <code>gradient</code> attribute.</p>`,snippets:[{label:"html",code:"<shiny-button gradient>button</shiny-button>"},{label:"view",code:`
|
|
726
|
+
ShinyButton
|
|
727
|
+
.props("button")
|
|
728
|
+
.attr("gradient")
|
|
729
|
+
.render()
|
|
730
|
+
`},{label:"css",code:Se}],style:c``,presentation:r=>h`
|
|
731
|
+
${r.ShinyButton.props().attr("gradient").children("button").render()}
|
|
732
|
+
`},{label:"catalog",explain:h`<p>clicky-clacky pressy buttons.</p>`,snippets:[{label:"html",code:`
|
|
733
|
+
<shiny-button calm gradient>calm</shiny-button>
|
|
734
|
+
<shiny-button angry gradient>angry</shiny-button>
|
|
735
|
+
<shiny-button happy gradient>happy</shiny-button>
|
|
736
|
+
<shiny-button zesty gradient>zesty</shiny-button>
|
|
737
|
+
<shiny-button sad gradient>sad</shiny-button>
|
|
738
|
+
<shiny-button quirky gradient>quirky</shiny-button>
|
|
739
|
+
<shiny-button plain gradient>plain</shiny-button>
|
|
740
|
+
`},{label:"view",code:`
|
|
741
|
+
[
|
|
742
|
+
ShinyButton.props().attr("calm").attr("gradient").children("calm").render(),
|
|
743
|
+
ShinyButton.props().attr("angry").attr("gradient").children("angry").render(),
|
|
744
|
+
ShinyButton.props().attr("happy").attr("gradient").children("happy").render(),
|
|
745
|
+
ShinyButton.props().attr("zesty").attr("gradient").children("zesty").render(),
|
|
746
|
+
ShinyButton.props().attr("sad").attr("gradient").children("sad").render(),
|
|
747
|
+
ShinyButton.props().attr("quirky").attr("gradient").children("quirky").render(),
|
|
748
|
+
ShinyButton.props().attr("plain").children("plain").render(),
|
|
749
|
+
]
|
|
750
|
+
`},{label:"css",code:Se}],style:c``,presentation:r=>[r.ShinyButton.props().attr("calm").attr("gradient").children("calm").render(),r.ShinyButton.props().attr("angry").attr("gradient").children("angry").render(),r.ShinyButton.props().attr("happy").attr("gradient").children("happy").render(),r.ShinyButton.props().attr("zesty").attr("gradient").children("zesty").render(),r.ShinyButton.props().attr("sad").attr("gradient").children("sad").render(),r.ShinyButton.props().attr("quirky").attr("gradient").children("quirky").render(),r.ShinyButton.props().attr("plain").children("plain").render()]}]});var ns=N(),is=N(),as=N(),ls=`
|
|
751
|
+
shiny-drawer {
|
|
752
|
+
--button-size: 2em;
|
|
753
|
+
--anim-duration: 200ms;
|
|
754
|
+
--slate-hidden-opacity: 1;
|
|
755
|
+
--blanket-backdrop-filter: blur(0.5em);
|
|
756
|
+
--blanket-bg: color-mix(
|
|
757
|
+
in oklab,
|
|
758
|
+
transparent,
|
|
759
|
+
var(--bg)
|
|
760
|
+
);
|
|
761
|
+
}
|
|
762
|
+
`,Er=r=>({label:r,explain:h`<p>slide-out panel. button optional.</p>`,snippets:[{label:"html",code:`
|
|
763
|
+
<shiny-drawer button side=${r}>
|
|
764
|
+
<header>example</header>
|
|
765
|
+
<section slot=plate>lorem kettlebell..</section>
|
|
766
|
+
</shiny-drawer>
|
|
767
|
+
`},{label:"view",code:`
|
|
768
|
+
ShinyDrawer
|
|
769
|
+
.props({button: true, side: "${r}"})
|
|
770
|
+
.children(html\`
|
|
771
|
+
<header>example</header>
|
|
772
|
+
<section slot=plate>lorem kettlebell..</section>
|
|
773
|
+
\`)
|
|
774
|
+
.render()
|
|
775
|
+
`},{label:"css",code:ls}],style:c``,presentation:t=>h`
|
|
776
|
+
${t.ShinyDrawer.props({button:!0,side:r}).children(h`
|
|
777
|
+
<header>
|
|
778
|
+
<h2>example drawer</h2>
|
|
779
|
+
<p>you can put any content in here.</p>
|
|
780
|
+
<p class=lipsum>${ns}</p>
|
|
781
|
+
</header>
|
|
782
|
+
<section slot=plate>
|
|
783
|
+
<p class=lipsum>${is}</p>
|
|
784
|
+
<p class=lipsum>${as}</p>
|
|
785
|
+
</section>
|
|
786
|
+
`).render()}
|
|
787
|
+
`}),Tr=()=>H({name:"drawer",style:c`
|
|
788
|
+
.box sly-view {
|
|
789
|
+
border-radius: 0.5em;
|
|
790
|
+
overflow: hidden;
|
|
791
|
+
--button-size: 3em;
|
|
792
|
+
|
|
793
|
+
header {
|
|
794
|
+
> * + * { margin-top: 0.5em; }
|
|
795
|
+
}
|
|
796
|
+
|
|
797
|
+
section {
|
|
798
|
+
display: flex;
|
|
799
|
+
flex-direction: column;
|
|
800
|
+
justify-content: center;
|
|
801
|
+
min-height: 100%;
|
|
802
|
+
padding: 1em;
|
|
803
|
+
padding-top: 3em;
|
|
804
|
+
> * + * { margin-top: 0.5em; }
|
|
805
|
+
}
|
|
806
|
+
}
|
|
807
|
+
`,exhibits:[Er("left"),Er("right")]});d.register({ShinyDemo:f.component(r=>(r.styles(c`
|
|
577
808
|
:host {
|
|
578
809
|
display: flex;
|
|
579
810
|
flex-direction: column;
|
|
@@ -596,166 +827,7 @@ p.lipsum {
|
|
|
596
827
|
display: flex;
|
|
597
828
|
}
|
|
598
829
|
}
|
|
599
|
-
`)
|
|
600
|
-
<p>clicky-clacky pressy button.</p>
|
|
601
|
-
`,snippets:[[k.html,`
|
|
602
|
-
<shiny-button>hello</shiny-button>
|
|
603
|
-
`],[k.view,`
|
|
604
|
-
ShinyButton
|
|
605
|
-
.props()
|
|
606
|
-
.children("hello")
|
|
607
|
-
.render()
|
|
608
|
-
`],[k.css,`
|
|
609
|
-
shiny-button {
|
|
610
|
-
font-size: 1em;
|
|
611
|
-
--happy: #0fa;
|
|
612
|
-
--angry: #f50;
|
|
613
|
-
--lame: #8888;
|
|
614
|
-
--inactive-opacity: 0.5;
|
|
615
|
-
}
|
|
616
|
-
`]],content:[s.ShinyButton.props().children("button").render(),s.ShinyButton.props().attr("gradient",!0).children("gradient").render(),s.ShinyButton.props().attr("angry",!0).attr("gradient",!0).children("angry").render(),s.ShinyButton.props().attr("happy",!0).attr("gradient",!0).children("happy").render(),s.ShinyButton.props().attr("zesty",!0).attr("gradient",!0).children("zesty").render(),s.ShinyButton.props().attr("sad",!0).attr("gradient",!0).children("sad").render(),s.ShinyButton.props().attr("quirky",!0).attr("gradient",!0).children("quirky").render(),s.ShinyButton.props().attr("plain",!0).children("plain").render()],style:d`
|
|
617
|
-
.content {
|
|
618
|
-
flex-direction: row;
|
|
619
|
-
flex-wrap: wrap;
|
|
620
|
-
align-content: center;
|
|
621
|
-
gap: 0.5em;
|
|
622
|
-
|
|
623
|
-
sly-view {
|
|
624
|
-
font-size: 1.2em;
|
|
625
|
-
}
|
|
626
|
-
}
|
|
627
|
-
`}),xt({name:"tabs",explain:m`
|
|
628
|
-
<p>button bar. panels optional.</p>
|
|
629
|
-
`,snippets:[[k.html,`
|
|
630
|
-
<shiny-tabs>
|
|
631
|
-
<shiny-button>tab1</shiny-button>
|
|
632
|
-
<shiny-button>tab2</shiny-button>
|
|
633
|
-
<shiny-button>tab3</shiny-button>
|
|
634
|
-
<div slot=panel>panel1</div>
|
|
635
|
-
<div slot=panel>panel2</div>
|
|
636
|
-
<div slot=panel>panel3</div>
|
|
637
|
-
</shiny-tabs>
|
|
638
|
-
`],[k.view,`
|
|
639
|
-
ShinyTabs
|
|
640
|
-
.props()
|
|
641
|
-
.children(html\`
|
|
642
|
-
\${ShinyButton.props()
|
|
643
|
-
.children("tab1").render()}
|
|
644
|
-
\${ShinyButton.props()
|
|
645
|
-
.children("tab2").render()}
|
|
646
|
-
\${ShinyButton.props()
|
|
647
|
-
.children("tab3").render()}
|
|
648
|
-
<div slot=panel>panel1</div>
|
|
649
|
-
<div slot=panel>panel2</div>
|
|
650
|
-
<div slot=panel>panel3</div>
|
|
651
|
-
\`)
|
|
652
|
-
.render()
|
|
653
|
-
`],[k.css,`
|
|
654
|
-
shiny-tabs {
|
|
655
|
-
&::part(tabs) {}
|
|
656
|
-
&::part(panels) {}
|
|
657
|
-
> shiny-button {}
|
|
658
|
-
}
|
|
659
|
-
`]],content:s.ShinyTabs.props().children(m`
|
|
660
|
-
${s.ShinyButton.props().children("tab1").render()}
|
|
661
|
-
${s.ShinyButton.props().children("tab2").render()}
|
|
662
|
-
${s.ShinyButton.props().children("tab3").render()}
|
|
663
|
-
<p slot=panel class=lipsum>${ot()}</p>
|
|
664
|
-
<p slot=panel class=lipsum>${ot()}</p>
|
|
665
|
-
<p slot=panel class=lipsum>${ot()}</p>
|
|
666
|
-
`).render(),style:d`
|
|
667
|
-
.content {
|
|
668
|
-
justify-content: start;
|
|
669
|
-
p { margin-top: 0.5em; }
|
|
670
|
-
}
|
|
671
|
-
`}),xt({name:"copy",explain:m`
|
|
672
|
-
<p>click-to-copy text button.</p>
|
|
673
|
-
`,snippets:[[k.html,`
|
|
674
|
-
<shiny-copy text="hello world"></shiny-copy>
|
|
675
|
-
`],[k.view,`
|
|
676
|
-
ShinyCopy("hello world")
|
|
677
|
-
`],[k.css,`
|
|
678
|
-
shiny-copy {
|
|
679
|
-
font-size: 1em;
|
|
680
|
-
--happy: #0fa;
|
|
681
|
-
--angry: #f50;
|
|
682
|
-
--lame: #8888;
|
|
683
|
-
--inactive-opacity: 0.5;
|
|
684
|
-
}
|
|
685
|
-
`]],content:s.ShinyCopy("hello world"),style:d`
|
|
686
|
-
.content sly-view {
|
|
687
|
-
font-size: 4em;
|
|
688
|
-
}
|
|
689
|
-
`}),xt({name:"drawer",explain:m`
|
|
690
|
-
<p>slide-out panel. button optional.</p>
|
|
691
|
-
`,snippets:[[k.html,`
|
|
692
|
-
<shiny-drawer button side=left>
|
|
693
|
-
<header>example</header>
|
|
694
|
-
<section slot=plate>
|
|
695
|
-
lorem kettlebell..
|
|
696
|
-
</section>
|
|
697
|
-
</shiny-drawer>
|
|
698
|
-
`],[k.view,`
|
|
699
|
-
ShinyDrawer
|
|
700
|
-
.props({button: true, side: "left"})
|
|
701
|
-
.children(html\`
|
|
702
|
-
<header>example</header>
|
|
703
|
-
<section slot=plate>
|
|
704
|
-
lorem kettlebell..
|
|
705
|
-
</section>
|
|
706
|
-
\`)
|
|
707
|
-
.render()
|
|
708
|
-
`],[k.css,`
|
|
709
|
-
shiny-drawer {
|
|
710
|
-
--button-size: 2em;
|
|
711
|
-
--anim-duration: 200ms;
|
|
712
|
-
--blanket-backdrop-filter: blur(0.5em);
|
|
713
|
-
--blanket-bg: color-mix(
|
|
714
|
-
in oklab,
|
|
715
|
-
transparent,
|
|
716
|
-
var(--bg)
|
|
717
|
-
);
|
|
718
|
-
}
|
|
719
|
-
`]],content:s.ShinyDrawer.props({button:!0}).children(m`
|
|
720
|
-
<header>
|
|
721
|
-
<h2>example drawer</h2>
|
|
722
|
-
<p>you can put any content in here.</p>
|
|
723
|
-
<p class=lipsum>${ot()}</p>
|
|
724
|
-
</header>
|
|
725
|
-
<section slot=plate>
|
|
726
|
-
<p class=lipsum>${ot()}</p>
|
|
727
|
-
<p class=lipsum>${ot()}</p>
|
|
728
|
-
</section>
|
|
729
|
-
`).render(),style:d`
|
|
730
|
-
.content sly-view {
|
|
731
|
-
border-radius: 0.5em;
|
|
732
|
-
overflow: hidden;
|
|
733
|
-
--button-size: 3em;
|
|
734
|
-
|
|
735
|
-
header {
|
|
736
|
-
> * + * { margin-top: 0.5em; }
|
|
737
|
-
}
|
|
738
|
-
|
|
739
|
-
section {
|
|
740
|
-
display: flex;
|
|
741
|
-
flex-direction: column;
|
|
742
|
-
justify-content: center;
|
|
743
|
-
min-height: 100%;
|
|
744
|
-
padding: 1em;
|
|
745
|
-
padding-top: 3em;
|
|
746
|
-
> * + * { margin-top: 0.5em; }
|
|
747
|
-
}
|
|
748
|
-
}
|
|
749
|
-
`})];return m`
|
|
750
|
-
<div class=themes>
|
|
751
|
-
<span>theme</span>
|
|
752
|
-
${N.ShinyTabs.props(t).children(gr.map(i=>m`
|
|
753
|
-
${N.ShinyButton.props().children(i.label).render()}
|
|
754
|
-
`)).render()}
|
|
755
|
-
</div>
|
|
756
|
-
|
|
757
|
-
${o}
|
|
758
|
-
`})});console.log("\u2728shiny");
|
|
830
|
+
`),ge.takeAll(),[Cr(),Sr(),Tr(),kr()]))});console.log("\u2728shiny\u2728");
|
|
759
831
|
/*! Bundled license information:
|
|
760
832
|
|
|
761
833
|
@lit/reactive-element/css-tag.js:
|