@axel669/zephyr 1.0.0-beta.0 → 1.0.0-dev.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -21
- package/compiler/build.js +13 -0
- package/compiler/parser.js +2973 -0
- package/compiler/rollup.js +28 -0
- package/compiler/transpiler.js +140 -0
- package/dist/zephyr-unstyled.js +555 -0
- package/dist/zephyr-unstyled.min.js +1 -0
- package/dist/zephyr.js +1946 -0
- package/dist/zephyr.min.js +47 -0
- package/package.json +50 -48
- package/readme.md +194 -19
- package/src/changed.svelte.js +0 -23
- package/src/component/adorn.svelte +0 -9
- package/src/component/alert.svelte +0 -32
- package/src/component/application.svelte +0 -17
- package/src/component/async-button.svelte +0 -53
- package/src/component/avatar.svelte +0 -15
- package/src/component/badge.svelte +0 -7
- package/src/component/button.svelte +0 -7
- package/src/component/chip.svelte +0 -10
- package/src/component/circle-spinner.svelte +0 -6
- package/src/component/confirm.svelte +0 -40
- package/src/component/control-label.svelte +0 -41
- package/src/component/data-table.svelte +0 -227
- package/src/component/details.svelte +0 -22
- package/src/component/dialog-element.svelte +0 -35
- package/src/component/dialog.svelte +0 -43
- package/src/component/drawer.svelte +0 -20
- package/src/component/flex.svelte +0 -7
- package/src/component/grid.svelte +0 -7
- package/src/component/hexagon-spinner.svelte +0 -6
- package/src/component/icon.svelte +0 -7
- package/src/component/link.svelte +0 -11
- package/src/component/modal.svelte +0 -32
- package/src/component/paper.svelte +0 -33
- package/src/component/popover.svelte +0 -19
- package/src/component/progress.svelte +0 -6
- package/src/component/prompt.svelte +0 -58
- package/src/component/route.svelte +0 -62
- package/src/component/routing.svelte.js +0 -63
- package/src/component/screen.svelte +0 -30
- package/src/component/select.svelte +0 -40
- package/src/component/suspend.svelte +0 -44
- package/src/component/table.svelte +0 -49
- package/src/component/tabs.svelte +0 -2
- package/src/component/text.svelte +0 -26
- package/src/component/title.svelte +0 -28
- package/src/component/titlebar.svelte +0 -23
- package/src/component/toast.svelte +0 -7
- package/src/component/toaster.svelte +0 -60
- package/src/component/toggle-label.svelte +0 -11
- package/src/component/tooltip.svelte +0 -11
- package/src/custom-macros.js +0 -11
- package/src/handler$.js +0 -20
- package/src/hash.js +0 -14
- package/src/index.js +0 -65
- package/src/internals.js +0 -12
- package/src/main.js +0 -47
- package/src/props.js +0 -24
- package/src/variant.js +0 -10
- package/src/wind.js +0 -4
- package/src/ws.js +0 -10
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
var e,t,r,o,n,s,a,i,l,c,u,p,d,f,h,_={},m=[],g=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i,b=Array.isArray;function v(e,t){for(var r in t)e[r]=t[r];return e}function y(e){e&&e.parentNode&&e.parentNode.removeChild(e)}function w(t,r,o){var n,s,a,i={};for(a in r)"key"==a?n=r[a]:"ref"==a?s=r[a]:i[a]=r[a];if(arguments.length>2&&(i.children=arguments.length>3?e.call(arguments,2):o),"function"==typeof t&&null!=t.defaultProps)for(a in t.defaultProps)void 0===i[a]&&(i[a]=t.defaultProps[a]);return x(t,i,n,s,null)}function x(e,o,n,s,a){var i={type:e,props:o,key:n,ref:s,__k:null,__:null,__b:0,__e:null,__c:null,constructor:void 0,__v:null==a?++r:a,__i:-1,__u:0};return null==a&&null!=t.vnode&&t.vnode(i),i}function k(e){return e.children}function $(e,t){this.props=e,this.context=t}function z(e,t){if(null==t)return e.__?z(e.__,e.__i+1):null;for(var r;t<e.__k.length;t++)if(null!=(r=e.__k[t])&&null!=r.__e)return r.__e;return"function"==typeof e.type?z(e):null}function A(e){if(e.__P&&e.__d){var r=e.__v,o=r.__e,n=[],s=[],a=v({},r);a.__v=r.__v+1,t.vnode&&t.vnode(a),T(e.__P,a,r,e.__n,e.__P.namespaceURI,32&r.__u?[o]:null,n,null==o?z(r):o,!!(32&r.__u),s),a.__v=r.__v,a.__.__k[a.__i]=a,W(n,a,s),r.__e=r.__=null,a.__e!=o&&S(a)}}function S(e){if(null!=(e=e.__)&&null!=e.__c)return e.__e=e.__c.base=null,e.__k.some(function(t){if(null!=t&&null!=t.__e)return e.__e=e.__c.base=t.__e}),S(e)}function E(e){(!e.__d&&(e.__d=!0)&&o.push(e)&&!C.__r++||n!=t.debounceRendering)&&((n=t.debounceRendering)||s)(C)}function C(){try{for(var e,t=1;o.length;)o.length>t&&o.sort(a),e=o.shift(),t=o.length,A(e)}finally{o.length=C.__r=0}}function P(e,t,r,o,n,s,a,i,l,c,u){var p,d,f,h,g,v,y,w=o&&o.__k||m,$=t.length;for(l=function(e,t,r,o,n){var s,a,i,l,c,u=r.length,p=u,d=0;for(e.__k=new Array(n),s=0;s<n;s++)null!=(a=t[s])&&"boolean"!=typeof a&&"function"!=typeof a?("string"==typeof a||"number"==typeof a||"bigint"==typeof a||a.constructor==String?a=e.__k[s]=x(null,a,null,null,null):b(a)?a=e.__k[s]=x(k,{children:a},null,null,null):void 0===a.constructor&&a.__b>0?a=e.__k[s]=x(a.type,a.props,a.key,a.ref?a.ref:null,a.__v):e.__k[s]=a,l=s+d,a.__=e,a.__b=e.__b+1,i=null,-1!=(c=a.__i=O(a,r,l,p))&&(p--,(i=r[c])&&(i.__u|=2)),null==i||null==i.__v?(-1==c&&(n>u?d--:n<u&&d++),"function"!=typeof a.type&&(a.__u|=4)):c!=l&&(c==l-1?d--:c==l+1?d++:(c>l?d--:d++,a.__u|=4))):e.__k[s]=null;if(p)for(s=0;s<u;s++)null!=(i=r[s])&&!(2&i.__u)&&(i.__e==o&&(o=z(i)),F(i,i));return o}(r,t,w,l,$),p=0;p<$;p++)null!=(f=r.__k[p])&&(d=-1!=f.__i&&w[f.__i]||_,f.__i=p,v=T(e,f,d,n,s,a,i,l,c,u),h=f.__e,f.ref&&d.ref!=f.ref&&(d.ref&&U(d.ref,null,f),u.push(f.ref,f.__c||h,f)),null==g&&null!=h&&(g=h),(y=!!(4&f.__u))||d.__k===f.__k?(l=M(f,l,e,y),y&&d.__e&&(d.__e=null)):"function"==typeof f.type&&void 0!==v?l=v:h&&(l=h.nextSibling),f.__u&=-7);return r.__e=g,l}function M(e,t,r,o){var n,s;if("function"==typeof e.type){for(n=e.__k,s=0;n&&s<n.length;s++)n[s]&&(n[s].__=e,t=M(n[s],t,r,o));return t}e.__e!=t&&(o&&(t&&e.type&&!t.parentNode&&(t=z(e)),r.insertBefore(e.__e,t||null)),t=e.__e);do{t=t&&t.nextSibling}while(null!=t&&8==t.nodeType);return t}function L(e,t){return t=t||[],null==e||"boolean"==typeof e||(b(e)?e.some(function(e){L(e,t)}):t.push(e)),t}function O(e,t,r,o){var n,s,a,i=e.key,l=e.type,c=t[r],u=null!=c&&!(2&c.__u);if(null===c&&null==i||u&&i==c.key&&l==c.type)return r;if(o>(u?1:0))for(n=r-1,s=r+1;n>=0||s<t.length;)if(null!=(c=t[a=n>=0?n--:s++])&&!(2&c.__u)&&i==c.key&&l==c.type)return a;return-1}function j(e,t,r){"-"==t[0]?e.setProperty(t,null==r?"":r):e[t]=null==r?"":"number"!=typeof r||g.test(t)?r:r+"px"}function N(e,t,r,o,n){var s,a;e:if("style"==t)if("string"==typeof r)e.style.cssText=r;else{if("string"==typeof o&&(e.style.cssText=o=""),o)for(t in o)r&&t in r||j(e.style,t,"");if(r)for(t in r)o&&r[t]==o[t]||j(e.style,t,r[t])}else if("o"==t[0]&&"n"==t[1])s=t!=(t=t.replace(u,"$1")),a=t.toLowerCase(),t=a in e||"onFocusOut"==t||"onFocusIn"==t?a.slice(2):t.slice(2),e.l||(e.l={}),e.l[t+s]=r,r?o?r[c]=o[c]:(r[c]=p,e.addEventListener(t,s?f:d,s)):e.removeEventListener(t,s?f:d,s);else{if("http://www.w3.org/2000/svg"==n)t=t.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if("width"!=t&&"height"!=t&&"href"!=t&&"list"!=t&&"form"!=t&&"tabIndex"!=t&&"download"!=t&&"rowSpan"!=t&&"colSpan"!=t&&"role"!=t&&"popover"!=t&&t in e)try{e[t]=null==r?"":r;break e}catch(e){}"function"==typeof r||(null==r||!1===r&&"-"!=t[4]?e.removeAttribute(t):e.setAttribute(t,"popover"==t&&1==r?"":r))}}function H(e){return function(r){if(this.l){var o=this.l[r.type+e];if(null==r[l])r[l]=p++;else if(r[l]<o[c])return;return o(t.event?t.event(r):r)}}}function T(r,o,n,s,a,i,l,c,u,p){var d,f,h,g,w,x,A,S,E,C,M,L,O,j,H,T,W=o.type;if(void 0!==o.constructor)return null;128&n.__u&&(u=!!(32&n.__u),i=[c=o.__e=n.__e]),(d=t.__b)&&d(o);e:if("function"==typeof W){f=l.length;try{if(E=o.props,C=W.prototype&&W.prototype.render,M=(d=W.contextType)&&s[d.__c],L=d?M?M.props.value:d.__:s,n.__c?S=(h=o.__c=n.__c).__=h.__E:(C?o.__c=h=new W(E,L):(o.__c=h=new $(E,L),h.constructor=W,h.render=I),M&&M.sub(h),h.state||(h.state={}),h.__n=s,g=h.__d=!0,h.__h=[],h._sb=[]),C&&null==h.__s&&(h.__s=h.state),C&&null!=W.getDerivedStateFromProps&&(h.__s==h.state&&(h.__s=v({},h.__s)),v(h.__s,W.getDerivedStateFromProps(E,h.__s))),w=h.props,x=h.state,h.__v=o,g)C&&null==W.getDerivedStateFromProps&&null!=h.componentWillMount&&h.componentWillMount(),C&&null!=h.componentDidMount&&h.__h.push(h.componentDidMount);else{if(C&&null==W.getDerivedStateFromProps&&E!==w&&null!=h.componentWillReceiveProps&&h.componentWillReceiveProps(E,L),o.__v==n.__v||!h.__e&&null!=h.shouldComponentUpdate&&!1===h.shouldComponentUpdate(E,h.__s,L)){o.__v!=n.__v&&(h.props=E,h.state=h.__s,h.__d=!1),o.__e=n.__e,o.__k=n.__k,o.__k.some(function(e){e&&(e.__=o)}),m.push.apply(h.__h,h._sb),h._sb=[],h.__h.length&&l.push(h);break e}null!=h.componentWillUpdate&&h.componentWillUpdate(E,h.__s,L),C&&null!=h.componentDidUpdate&&h.__h.push(function(){h.componentDidUpdate(w,x,A)})}if(h.context=L,h.props=E,h.__P=r,h.__e=!1,O=t.__r,j=0,C)h.state=h.__s,h.__d=!1,O&&O(o),d=h.render(h.props,h.state,h.context),m.push.apply(h.__h,h._sb),h._sb=[];else do{h.__d=!1,O&&O(o),d=h.render(h.props,h.state,h.context),h.state=h.__s}while(h.__d&&++j<25);h.state=h.__s,null!=h.getChildContext&&(s=v(v({},s),h.getChildContext())),C&&!g&&null!=h.getSnapshotBeforeUpdate&&(A=h.getSnapshotBeforeUpdate(w,x)),H=null!=d&&d.type===k&&null==d.key?D(d.props.children):d,c=P(r,b(H)?H:[H],o,n,s,a,i,l,c,u,p),h.base=o.__e,o.__u&=-161,h.__h.length&&l.push(h),S&&(h.__E=h.__=null)}catch(r){if(l.length=f,o.__v=null,u||null!=i)if(r.then){for(o.__u|=u?160:128;c&&8==c.nodeType&&c.nextSibling;)c=c.nextSibling;null!=i&&(i[i.indexOf(c)]=null),o.__e=c}else{if(null!=i)for(T=i.length;T--;)y(i[T]);R(o)}else o.__e=n.__e,!o.__k&&n.__k&&(o.__k=n.__k),r.then||R(o);t.__e(r,o,n)}}else null==i&&o.__v==n.__v?(o.__k=n.__k,o.__e=n.__e):c=o.__e=function(r,o,n,s,a,i,l,c,u){var p,d,f,h,m,g,v,w=n.props||_,x=o.props,k=o.type;if("svg"==k?a="http://www.w3.org/2000/svg":"math"==k?a="http://www.w3.org/1998/Math/MathML":a||(a="http://www.w3.org/1999/xhtml"),null!=i)for(p=0;p<i.length;p++)if((m=i[p])&&"setAttribute"in m==!!k&&(k?m.localName==k:3==m.nodeType)){r=m,i[p]=null;break}if(null==r){if(null==k)return document.createTextNode(x);r=document.createElementNS(a,k,x.is&&x),c&&(t.__m&&t.__m(o,i),c=!1),i=null}if(null==k)w===x||c&&r.data==x||(r.data=x);else{if(i="textarea"==k&&null!=x.defaultValue?null:i&&e.call(r.childNodes),!c&&null!=i)for(w={},p=0;p<r.attributes.length;p++)w[(m=r.attributes[p]).name]=m.value;for(p in w)m=w[p],"dangerouslySetInnerHTML"==p?f=m:"children"==p||p in x||"value"==p&&"defaultValue"in x||"checked"==p&&"defaultChecked"in x||N(r,p,null,m,a);for(p in x)m=x[p],"children"==p?h=m:"dangerouslySetInnerHTML"==p?d=m:"value"==p?g=m:"checked"==p?v=m:c&&"function"!=typeof m||w[p]===m||N(r,p,m,w[p],a);if(d)c||f&&(d.__html==f.__html||d.__html==r.innerHTML)||(r.innerHTML=d.__html),o.__k=[];else if(f&&(r.innerHTML=""),P("template"==o.type?r.content:r,b(h)?h:[h],o,n,s,"foreignObject"==k?"http://www.w3.org/1999/xhtml":a,i,l,i?i[0]:n.__k&&z(n,0),c,u),null!=i)for(p=i.length;p--;)y(i[p]);c&&"textarea"!=k||(p="value","progress"==k&&null==g?r.removeAttribute("value"):null!=g&&(g!==r[p]||"progress"==k&&!g||"option"==k&&g!=w[p])&&N(r,p,g,w[p],a),p="checked",null!=v&&v!=r[p]&&N(r,p,v,w[p],a))}return r}(n.__e,o,n,s,a,i,l,u,p);return(d=t.diffed)&&d(o),128&o.__u?void 0:c}function R(e){e&&(e.__c&&(e.__c.__e=!0),e.__k&&e.__k.some(R))}function W(e,r,o){for(var n=0;n<o.length;n++)U(o[n],o[++n],o[++n]);t.__c&&t.__c(r,e),e.some(function(r){try{e=r.__h,r.__h=[],e.some(function(e){e.call(r)})}catch(e){t.__e(e,r.__v)}})}function D(e){return"object"!=typeof e||null==e||e.__b>0?e:b(e)?e.map(D):void 0!==e.constructor?null:v({},e)}function U(e,r,o){try{if("function"==typeof e){var n="function"==typeof e.__u;n&&e.__u(),n&&null==r||(e.__u=e(r))}else e.current=r}catch(e){t.__e(e,o)}}function F(e,r,o){var n,s;if(t.unmount&&t.unmount(e),(n=e.ref)&&(n.current&&n.current!=e.__e||U(n,null,r)),null!=(n=e.__c)){if(n.componentWillUnmount)try{n.componentWillUnmount()}catch(e){t.__e(e,r)}n.base=n.__P=n.__n=null}if(n=e.__k)for(s=0;s<n.length;s++)n[s]&&F(n[s],r,o||"function"!=typeof e.type);o||y(e.__e),e.__c=e.__=e.__e=void 0}function I(e,t,r){return this.constructor(e,r)}function q(r,o,n){var s,a,i,l;o==document&&(o=document.documentElement),t.__&&t.__(r,o),a=(s="function"==typeof n)?null:n&&n.__k||o.__k,i=[],l=[],T(o,r=(!s&&n||o).__k=w(k,null,[r]),a||_,_,o.namespaceURI,!s&&n?[n]:a?null:o.firstChild?e.call(o.childNodes):null,i,!s&&n?n:a?a.__e:o.firstChild,s,l),W(i,r,l),r.props.children=null}function V(t,r,o){var n,s,a,i,l=v({},t.props);for(a in t.type&&t.type.defaultProps&&(i=t.type.defaultProps),r)"key"==a?n=r[a]:"ref"==a?s=r[a]:l[a]=void 0===r[a]&&null!=i?i[a]:r[a];return arguments.length>2&&(l.children=arguments.length>3?e.call(arguments,2):o),x(t.type,l,n||t.key,s||t.ref,null)}function Z(e){function t(e){var r,o;return this.getChildContext||(r=new Set,(o={})[t.__c]=this,this.getChildContext=function(){return o},this.componentWillUnmount=function(){r=null},this.shouldComponentUpdate=function(e){this.props.value!=e.value&&r.forEach(function(e){e.__e=!0,E(e)})},this.sub=function(e){r.add(e);var t=e.componentWillUnmount;e.componentWillUnmount=function(){r&&r.delete(e),t&&t.call(e)}}),e.children}return t.__c="__cC"+h++,t.__=e,t.Provider=t.__l=(t.Consumer=function(e,t){return e.children(t)}).contextType=t,t}e=m.slice,t={__e:function(e,t,r,o){for(var n,s,a;t=t.__;)if((n=t.__c)&&!n.__)try{if((s=n.constructor)&&null!=s.getDerivedStateFromError&&(n.setState(s.getDerivedStateFromError(e)),a=n.__d),null!=n.componentDidCatch&&(n.componentDidCatch(e,o||{}),a=n.__d),a)return n.__E=n}catch(t){e=t}throw e}},r=0,$.prototype.setState=function(e,t){var r;r=null!=this.__s&&this.__s!=this.state?this.__s:this.__s=v({},this.state),"function"==typeof e&&(e=e(v({},r),this.props)),e&&v(r,e),null!=e&&this.__v&&(t&&this._sb.push(t),E(this))},$.prototype.forceUpdate=function(e){this.__v&&(this.__e=!0,e&&this.__h.push(e),E(this))},$.prototype.render=k,o=[],s="function"==typeof Promise?Promise.prototype.then.bind(Promise.resolve()):setTimeout,a=function(e,t){return e.__v.__b-t.__v.__b},C.__r=0,i=Math.random().toString(8),l="__d"+i,c="__a"+i,u=/(PointerCapture)$|Capture$/i,p=0,d=H(!1),f=H(!0),h=0;var B,Y,X,K,G=0,J=[],Q=t,ee=Q.__b,te=Q.__r,re=Q.diffed,oe=Q.__c,ne=Q.unmount,se=Q.__;function ae(e,t){Q.__h&&Q.__h(Y,e,G||t),G=0;var r=Y.__H||(Y.__H={__:[],__h:[]});return e>=r.__.length&&r.__.push({}),r.__[e]}function ie(e){return G=1,function(e,t,r){var o=ae(B++,2);if(o.t=e,!o.__c&&(o.__=[r?r(t):ge(void 0,t),function(e){var t=o.__N?o.__N[0]:o.__[0],r=o.t(t,e);t!==r&&(o.__N=[r,o.__[1]],o.__c.setState({}))}],o.__c=Y,!Y.__f)){var n=function(e,t,r){if(!o.__c.__H)return!0;var n=!1,a=o.__c.props!==e;if(o.__c.__H.__.some(function(e){if(e.__N){n=!0;var t=e.__[0];e.__=e.__N,e.__N=void 0,t!==e.__[0]&&(a=!0)}}),s){var i=s.call(this,e,t,r);return n?i||a:i}return!n||a};Y.__f=!0;var s=Y.shouldComponentUpdate,a=Y.componentWillUpdate;Y.componentWillUpdate=function(e,t,r){if(this.__e){var o=s;s=void 0,n(e,t,r),s=o}a&&a.call(this,e,t,r)},Y.shouldComponentUpdate=n}return o.__N||o.__}(ge,e)}function le(e,t){var r=ae(B++,3);!Q.__s&&me(r.__H,t)&&(r.__=e,r.u=t,Y.__H.__h.push(r))}function ce(e,t){var r=ae(B++,7);return me(r.__H,t)&&(r.__=e(),r.__H=t,r.__h=e),r.__}function ue(e){var t=Y.context[e.__c],r=ae(B++,9);return r.c=e,t?(null==r.__&&(r.__=!0,t.sub(Y)),t.props.value):e.__}function pe(){for(var e;e=J.shift();){var t=e.__H;if(e.__P&&t)try{t.__h.some(he),t.__h.some(_e),t.__h=[]}catch(r){t.__h=[],Q.__e(r,e.__v)}}}Q.__b=function(e){Y=null,ee&&ee(e)},Q.__=function(e,t){e&&t.__k&&t.__k.__m&&(e.__m=t.__k.__m),se&&se(e,t)},Q.__r=function(e){te&&te(e),B=0;var t=(Y=e.__c).__H;t&&(X===Y?(t.__h=[],Y.__h=[],t.__.some(function(e){e.__N&&(e.__=e.__N),e.u=e.__N=void 0})):(t.__h.length&&pe(),B=0)),X=Y},Q.diffed=function(e){re&&re(e);var t=e.__c;t&&t.__H&&(t.__H.__h.length&&(1!==J.push(t)&&K===Q.requestAnimationFrame||((K=Q.requestAnimationFrame)||fe)(pe)),t.__H.__.some(function(e){e.u&&(e.__H=e.u,e.u=void 0)})),X=Y=null},Q.__c=function(e,t){t.some(function(e){try{e.__h.some(he),e.__h=e.__h.filter(function(e){return!e.__||_e(e)})}catch(r){t.some(function(e){e.__h&&(e.__h=[])}),t=[],Q.__e(r,e.__v)}}),oe&&oe(e,t)},Q.unmount=function(e){ne&&ne(e);var t,r=e.__c;r&&r.__H&&(r.__H.__.some(function(e){try{he(e)}catch(e){t=e}}),r.__H=void 0,t&&Q.__e(t,r.__v))};var de="function"==typeof requestAnimationFrame;function fe(e){var t,r=function(){clearTimeout(o),de&&cancelAnimationFrame(t),setTimeout(e)},o=setTimeout(r,35);de&&(t=requestAnimationFrame(r))}function he(e){var t=Y,r=e.__c;"function"==typeof r&&(e.__c=void 0,r()),Y=t}function _e(e){var t=Y;e.__c=e.__(),Y=t}function me(e,t){return!e||e.length!==t.length||t.some(function(t,r){return t!==e[r]})}function ge(e,t){return"function"==typeof t?t(e):t}function be(e,t){for(var r in t)e[r]=t[r];return e}function ve(e,t){for(var r in e)if("__source"!==r&&!(r in t))return!0;for(var o in t)if("__source"!==o&&e[o]!==t[o])return!0;return!1}function ye(e,t){this.props=e,this.context=t}function we(e,t){function r(e){var r=this.props.ref;return r!=e.ref&&r&&("function"==typeof r?r(null):r.current=null),t?!t(this.props,e)||r!=e.ref:ve(this.props,e)}function o(t){return this.shouldComponentUpdate=r,w(e,t)}return o.displayName="Memo("+(e.displayName||e.name)+")",o.__f=o.prototype.isReactComponent=!0,o.type=e,o}(ye.prototype=new $).isPureReactComponent=!0,ye.prototype.shouldComponentUpdate=function(e,t){return ve(this.props,e)||ve(this.state,t)};var xe=t.__b;t.__b=function(e){e.type&&e.type.__f&&e.ref&&(e.props.ref=e.ref,e.ref=null),xe&&xe(e)};var ke="undefined"!=typeof Symbol&&Symbol.for&&Symbol.for("react.forward_ref")||3911;var $e=t.__e;t.__e=function(e,t,r,o){if(e.then)for(var n,s=t;s=s.__;)if((n=s.__c)&&n.__c)return null==t.__e&&(t.__e=r.__e,t.__k=r.__k),n.__c(e,t);$e(e,t,r,o)};var ze=t.unmount;function Ae(e,t,r){return e&&(e.__c&&e.__c.__H&&(e.__c.__H.__.forEach(function(e){"function"==typeof e.__c&&e.__c()}),e.__c.__H=null),null!=(e=be({},e)).__c&&(e.__c.__P===r&&(e.__c.__P=t),e.__c.__e=!0,e.__c=null),e.__k=e.__k&&e.__k.map(function(e){return Ae(e,t,r)})),e}function Se(e,t,r){return e&&r&&(e.__v=null,e.__k=e.__k&&e.__k.map(function(e){return Se(e,t,r)}),e.__c&&e.__c.__P===t&&(e.__e&&r.appendChild(e.__e),e.__c.__e=!0,e.__c.__P=r)),e}function Ee(){this.__u=0,this.o=null,this.__b=null}function Ce(e){var t=e.__&&e.__.__c;return t&&t.__a&&t.__a(e)}function Pe(){this.i=null,this.l=null}t.unmount=function(e){var t=e.__c;t&&(t.__z=!0),t&&t.__R&&t.__R(),t&&32&e.__u&&(e.type=null),ze&&ze(e)},(Ee.prototype=new $).__c=function(e,t){var r=t.__c,o=this;null==o.o&&(o.o=[]),o.o.push(r);var n=Ce(o.__v),s=!1,a=function(){s||o.__z||(s=!0,r.__R=null,n?n(l):l())};r.__R=a;var i=r.__P;r.__P=null;var l=function(){if(! --o.__u){if(o.state.__a){var e=o.state.__a;o.__v.__k[0]=Se(e,e.__c.__P,e.__c.__O)}var t;for(o.setState({__a:o.__b=null});t=o.o.pop();)t.__P=i,t.forceUpdate()}};o.__u++||32&t.__u||o.setState({__a:o.__b=o.__v.__k[0]}),e.then(a,a)},Ee.prototype.componentWillUnmount=function(){this.o=[]},Ee.prototype.render=function(e,t){var r=this.__v;if(!r.__m){for(var o=r;o.__;)o=o.__;o=o.__m||(o.__m=[0,0]),r.__m=[o[1]++,0]}if(this.__b){if(r.__k){var n=document.createElement("div"),s=r.__k[0].__c;r.__k[0]=Ae(this.__b,n,s.__O=s.__P)}this.__b=null}var a=t.__a&&w(k,null,e.fallback);return a&&(a.__u&=-33),[w(k,null,t.__a?null:e.children),a]};var Me=function(e,t,r){if(++r[1]===r[0]&&e.l.delete(t),e.props.revealOrder&&("t"!==e.props.revealOrder[0]||!e.l.size))for(r=e.i;r;){for(;r.length>3;)r.pop()();if(r[1]<r[0])break;e.i=r=r[2]}};(Pe.prototype=new $).__a=function(e){var t=this,r=Ce(t.__v),o=t.l.get(e);return o[0]++,function(n){var s=function(){t.props.revealOrder?(o.push(n),Me(t,e,o)):n()};r?r(s):s()}},Pe.prototype.render=function(e){this.i=null,this.l=new Map;var t=L(e.children);e.revealOrder&&"b"===e.revealOrder[0]&&t.reverse();for(var r=t.length;r--;)this.l.set(t[r],this.i=[1,0,this.i]);return e.children},Pe.prototype.componentDidUpdate=Pe.prototype.componentDidMount=function(){var e=this;this.l.forEach(function(t,r){Me(e,r,t)})};var Le="undefined"!=typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103,Oe=/^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|dominant|fill|flood|font|glyph(?!R)|horiz|image(!S)|letter|lighting|marker(?!H|W|U)|overline|paint|pointer|shape|stop|strikethrough|stroke|text(?!L)|transform|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/,je=/^on(Ani|Tra|Tou|BeforeInp|Compo)/,Ne=/[A-Z0-9]/g,He="undefined"!=typeof document,Te=function(e){return("undefined"!=typeof Symbol&&"symbol"==typeof Symbol()?/fil|che|rad/:/fil|che|ra/).test(e)};$.prototype.isReactComponent=!0,["componentWillMount","componentWillReceiveProps","componentWillUpdate"].forEach(function(e){Object.defineProperty($.prototype,e,{configurable:!0,get:function(){return this["UNSAFE_"+e]},set:function(t){Object.defineProperty(this,e,{configurable:!0,writable:!0,value:t})}})});var Re=t.event;t.event=function(e){return Re&&(e=Re(e)),e.persist=function(){},e.isPropagationStopped=function(){return this.cancelBubble},e.isDefaultPrevented=function(){return this.defaultPrevented},e.nativeEvent=e};var We={configurable:!0,get:function(){return this.class}},De=t.vnode;t.vnode=function(e){"string"==typeof e.type&&function(e){var t=e.props,r=e.type,o={},n=-1==r.indexOf("-");for(var s in t){var a=t[s];if(!("value"===s&&"defaultValue"in t&&null==a||He&&"children"===s&&"noscript"===r||"class"===s||"className"===s)){var i=s.toLowerCase();"defaultValue"===s&&"value"in t&&null==t.value?s="value":"download"===s&&!0===a?a="":"translate"===i&&"no"===a?a=!1:"o"===i[0]&&"n"===i[1]?"ondoubleclick"===i?s="ondblclick":"onchange"!==i||"input"!==r&&"textarea"!==r||Te(t.type)?"onfocus"===i?s="onfocusin":"onblur"===i?s="onfocusout":je.test(s)&&(s=i):i=s="oninput":n&&Oe.test(s)?s=s.replace(Ne,"-$&").toLowerCase():null===a&&(a=void 0),"oninput"===i&&o[s=i]&&(s="oninputCapture"),o[s]=a}}"select"==r&&(o.multiple&&Array.isArray(o.value)&&(o.value=L(t.children).forEach(function(e){e.props.selected=-1!=o.value.indexOf(e.props.value)})),null!=o.defaultValue&&(o.value=L(t.children).forEach(function(e){e.props.selected=o.multiple?-1!=o.defaultValue.indexOf(e.props.value):o.defaultValue==e.props.value}))),t.class&&!t.className?(o.class=t.class,Object.defineProperty(o,"className",We)):t.className&&(o.class=o.className=t.className),e.props=o}(e),e.$$typeof=Le,De&&De(e)};var Ue=t.__r;t.__r=function(e){Ue&&Ue(e),e.__c};var Fe=t.diffed;t.diffed=function(e){Fe&&Fe(e);var t=e.props,r=e.__e;null!=r&&"textarea"===e.type&&"value"in t&&t.value!==r.value&&(r.value=null==t.value?"":t.value)};var Ie="__s",qe="__c",Ve="__d",Ze="__s",Be=/[\s\n\\/='"\0<>]/,Ye=/^(xlink|xmlns|xml)([A-Z])/,Xe=/^(?:accessK|auto[A-Z]|cell|ch|col|cont|cross|dateT|encT|form[A-Z]|frame|hrefL|inputM|maxL|minL|noV|playsI|popoverT|readO|rowS|src[A-Z]|tabI|useM|item[A-Z])/,Ke=/^ac|^ali|arabic|basel|cap|clipPath$|clipRule$|color|dominant|enable|fill|flood|font|glyph[^R]|horiz|image|letter|lighting|marker[^WUH]|overline|panose|pointe|paint|rendering|shape|stop|strikethrough|stroke|text[^L]|transform|underline|unicode|units|^v[^i]|^w|^xH/,Ge=new Set(["draggable","spellcheck"]);function Je(e){void 0!==e.__g?e.__g|=8:e[Ve]=!0}function Qe(e){void 0!==e.__g?e.__g&=-9:e[Ve]=!1}function et(e){return void 0!==e.__g?!!(8&e.__g):!0===e[Ve]}var tt=/["&<]/;function rt(e){if(0===e.length||!1===tt.test(e))return e;for(var t=0,r=0,o="",n="";r<e.length;r++){switch(e.charCodeAt(r)){case 34:n=""";break;case 38:n="&";break;case 60:n="<";break;default:continue}r!==t&&(o+=e.slice(t,r)),o+=n,t=r+1}return r!==t&&(o+=e.slice(t,r)),o}var ot={},nt=new Set(["animation-iteration-count","border-image-outset","border-image-slice","border-image-width","box-flex","box-flex-group","box-ordinal-group","column-count","fill-opacity","flex","flex-grow","flex-negative","flex-order","flex-positive","flex-shrink","flood-opacity","font-weight","grid-column","grid-row","line-clamp","line-height","opacity","order","orphans","stop-opacity","stroke-dasharray","stroke-dashoffset","stroke-miterlimit","stroke-opacity","stroke-width","tab-size","widows","z-index","zoom"]),st=/[A-Z]/g;function at(e){var t="";for(var r in e){var o=e[r];if(null!=o&&""!==o){var n="-"==r[0]?r:ot[r]||(ot[r]=r.replace(st,"-$&").toLowerCase()),s=";";"number"!=typeof o||n.startsWith("--")||nt.has(n)||(s="px;"),t=t+n+":"+o+s}}return t||void 0}function it(){this.__d=!0}function lt(e,t){return{__v:e,context:t,props:e.props,setState:it,forceUpdate:it,__d:!0,__h:new Array(0)}}var ct,ut,pt,dt,ft={},ht=[],_t=Array.isArray,mt=Object.assign,gt="",bt="\x3c!--$s--\x3e",vt="\x3c!--/$s--\x3e";function yt(e){return"string"==typeof e?bt+e+vt:_t(e)?(e.unshift(bt),e.push(vt),e):e&&"function"==typeof e.then?e.then(yt):bt+e+vt}function wt(e,t){var r,o=e.type,n=!0;return e[qe]?(n=!1,(r=e[qe]).state=r[Ze]):r=new o(e.props,t),e[qe]=r,r.__v=e,r.props=e.props,r.context=t,Je(r),null==r.state&&(r.state=ft),null==r[Ze]&&(r[Ze]=r.state),o.getDerivedStateFromProps?r.state=mt({},r.state,o.getDerivedStateFromProps(r.props,r.state)):n&&r.componentWillMount?(r.componentWillMount(),r.state=r[Ze]!==r.state?r[Ze]:r.state):!n&&r.componentWillUpdate&&r.componentWillUpdate(),pt&&pt(e),r.render(r.props,r.state,t)}function xt(e,r,o,n,s,a,i){if(null==e||!0===e||!1===e||e===gt)return gt;var l=typeof e;if("object"!=l)return"function"==l?gt:"string"==l?rt(e):e+gt;if(_t(e)){var c,u=gt;s.__k=e;for(var p=e.length,d=0;d<p;d++){var f=e[d];if(null!=f&&"boolean"!=typeof f){var h,_=xt(f,r,o,n,s,a,i);"string"==typeof _?u+=_:(c||(c=new Array(p)),u&&c.push(u),u=gt,_t(_)?(h=c).push.apply(h,_):c.push(_))}}return c?(u&&c.push(u),c):u}if(void 0!==e.constructor)return gt;e.__=s,ct&&ct(e);var m=e.type,g=e.props;if("function"==typeof m){var b,v,y,w=r;if(m===k){if("tpl"in g){for(var x=gt,$=0;$<g.tpl.length;$++)if(x+=g.tpl[$],g.exprs&&$<g.exprs.length){var z=g.exprs[$];if(null==z)continue;"object"!=typeof z||void 0!==z.constructor&&!_t(z)?x+=z:x+=xt(z,r,o,n,e,a,i)}return x}if("UNSTABLE_comment"in g)return"\x3c!--"+rt(g.UNSTABLE_comment)+"--\x3e";v=g.children}else{if(null!=(b=m.contextType)){var A=r[b.__c];w=A?A.props.value:b.__}var S=m.prototype&&"function"==typeof m.prototype.render;if(S)v=wt(e,w),y=e[qe];else{e[qe]=y=lt(e,w);for(var E=0;et(y)&&E++<25;){Qe(y),pt&&pt(e);try{v=m.call(y,g,w)}catch(e){throw e}}Je(y)}if(null!=y.getChildContext&&(r=mt({},r,y.getChildContext())),S&&t.errorBoundaries&&(m.getDerivedStateFromError||y.componentDidCatch)){v=null!=v&&v.type===k&&null==v.key&&null==v.props.tpl?v.props.children:v;try{return xt(v,r,o,n,e,a,!1)}catch(t){return m.getDerivedStateFromError&&(y[Ze]=m.getDerivedStateFromError(t)),y.componentDidCatch&&y.componentDidCatch(t,ft),et(y)?(v=wt(e,r),null!=(y=e[qe]).getChildContext&&(r=mt({},r,y.getChildContext())),xt(v=null!=v&&v.type===k&&null==v.key&&null==v.props.tpl?v.props.children:v,r,o,n,e,a,i)):gt}finally{ut&&ut(e),dt&&dt(e)}}}v=null!=v&&v.type===k&&null==v.key&&null==v.props.tpl?v.props.children:v;try{var C=xt(v,r,o,n,e,a,i);return ut&&ut(e),t.unmount&&t.unmount(e),e._suspended?yt(C):C}catch(s){if(i&&i.onError){var P=function t(s){return i.onError(s,e,function(e,s){try{return xt(e,r,o,n,s,a,i)}catch(e){return t(e)}})}(s);if(void 0!==P)return P;var M=t.__e;return M&&M(s,e),gt}throw s}}var L,O="<"+m,j=gt;for(var N in g){var H=g[N];if("function"!=typeof(H=zt(H)?H.value:H)||"class"===N||"className"===N){switch(N){case"children":L=H;continue;case"key":case"ref":case"__self":case"__source":continue;case"htmlFor":if("for"in g)continue;N="for";break;case"className":if("class"in g)continue;N="class";break;case"defaultChecked":N="checked";break;case"defaultSelected":N="selected";break;case"defaultValue":case"value":switch(N="value",m){case"textarea":L=H;continue;case"select":n=H;continue;case"option":n!=H||"selected"in g||(O+=" selected")}break;case"dangerouslySetInnerHTML":j=H&&H.__html;continue;case"style":"object"==typeof H&&(H=at(H));break;case"acceptCharset":N="accept-charset";break;case"httpEquiv":N="http-equiv";break;default:if(Be.test(N))continue;Ye.test(N)?N=N.replace(Ye,"$1:$2").toLowerCase():"-"!==N[4]&&!Ge.has(N)||null==H?o?Ke.test(N)&&(N="panose1"===N?"panose-1":N.replace(/([A-Z])/g,"-$1").toLowerCase()):Xe.test(N)&&(N=N.toLowerCase()):H+=gt}null!=H&&!1!==H&&(O=!0===H||H===gt?O+" "+N:O+" "+N+'="'+("string"==typeof H?rt(H):H+gt)+'"')}}if(Be.test(m))throw new Error(m+" is not a valid HTML tag name in "+O+">");if(j||("string"==typeof L?j=rt(L):null!=L&&!1!==L&&!0!==L&&(j=xt(L,r,"svg"===m||"foreignObject"!==m&&o,n,e,a,i))),ut&&ut(e),dt&&dt(e),!j&&kt.has(m))return O+"/>";var T="</"+m+">",R=O+">";return _t(j)?[R].concat(j,[T]):"string"!=typeof j?[R,j,T]:R+j+T}var kt=new Set(["area","base","br","col","command","embed","hr","img","input","keygen","link","meta","param","source","track","wbr"]),$t=function(e,r,o){var n=t[Ie];t[Ie]=!0,ct=t.__b,ut=t.diffed,pt=t.__r,dt=t.unmount;var s=w(k,null);s.__k=[e];try{var a=xt(e,r||ft,!1,void 0,s,!1,o);return _t(a)?a.join(gt):a}catch(e){if(e.then)throw new Error('Use "renderToStringAsync" for suspenseful rendering.');throw e}finally{t.__c&&t.__c(e,ht),t[Ie]=n,ht.length=0}};function zt(e){return null!==e&&"object"==typeof e&&"function"==typeof e.peek&&"value"in e}const At=Symbol(),St=Object.getPrototypeOf,Et=new WeakMap,Ct=e=>(e=>e&&(Et.has(e)?Et.get(e):St(e)===Object.prototype||St(e)===Array.prototype))(e)&&e[At]||null,Pt=(e,t=!0)=>{Et.set(e,t)},Mt=e=>"object"==typeof e&&null!==e,Lt=(e,t)=>{const r=Nt.get(e);if((null==r?void 0:r[0])===t)return r[1];const o=Array.isArray(e)?[]:Object.create(Object.getPrototypeOf(e));return Pt(o,!0),Nt.set(e,[t,o]),Reflect.ownKeys(e).forEach(t=>{if(Object.getOwnPropertyDescriptor(o,t))return;const r=Reflect.get(e,t),{enumerable:n}=Reflect.getOwnPropertyDescriptor(e,t),s={value:r,enumerable:n,configurable:!0};if(jt.has(r))Pt(r,!1);else if(Ot.has(r)){const[e,t]=Ot.get(r);s.value=Lt(e,t())}Object.defineProperty(o,t,s)}),o},Ot=new WeakMap,jt=new WeakSet,Nt=new WeakMap,Ht=[1],Tt=new WeakMap;let Rt=Object.is,Wt=(e,t)=>new Proxy(e,t),Dt=e=>Mt(e)&&!jt.has(e)&&(Array.isArray(e)||!(Symbol.iterator in e))&&!(e instanceof WeakMap)&&!(e instanceof WeakSet)&&!(e instanceof Error)&&!(e instanceof Number)&&!(e instanceof Date)&&!(e instanceof String)&&!(e instanceof RegExp)&&!(e instanceof ArrayBuffer)&&!(e instanceof Promise),Ut=Lt,Ft=(e,t,r,o)=>({deleteProperty(e,t){Reflect.get(e,t),r(t);const n=Reflect.deleteProperty(e,t);return n&&o(void 0),n},set(n,s,a,i){const l=!e()&&Reflect.has(n,s),c=Reflect.get(n,s,i);if(l&&(Rt(c,a)||Tt.has(a)&&Rt(c,Tt.get(a))))return!0;r(s),Mt(a)&&(a=Ct(a)||a);const u=!Ot.has(a)&&Dt(a)?It(a):a;return t(s,u),Reflect.set(n,s,u,i),o(void 0),!0}});function It(e={}){if(!Mt(e))throw new Error("object required");const t=Tt.get(e);if(t)return t;let r=Ht[0];const o=new Set,n=(e,t=++Ht[0])=>{r!==t&&(s=r=t,o.forEach(r=>r(e,t)))};let s=r;const a=e=>(t,r)=>{let o;t&&(o=[...t],o[1]=[e,...o[1]]),n(o,r)},i=new Map;let l=!0;const c=Ft(()=>l,(e,t)=>{const r=!jt.has(t)&&Ot.get(t);if(r){if("production"!==(import.meta.env?import.meta.env.MODE:void 0)&&i.has(e))throw new Error("prop listener already exists");if(o.size){const t=r[2](a(e));i.set(e,[r,t])}else i.set(e,[r])}},e=>{var t;const r=i.get(e);r&&(i.delete(e),null==(t=r[1])||t.call(r))},n),u=Wt(e,c);Tt.set(e,u);const p=[e,(e=Ht[0])=>(s!==e&&(s=e,i.forEach(([t])=>{const o=t[1](e);o>r&&(r=o)})),r),e=>{o.add(e),1===o.size&&i.forEach(([e,t],r)=>{if("production"!==(import.meta.env?import.meta.env.MODE:void 0)&&t)throw new Error("remove already exists");const o=e[2](a(r));i.set(r,[e,o])});return()=>{o.delete(e),0===o.size&&i.forEach(([e,t],r)=>{t&&(t(),i.set(r,[e]))})}}];return Ot.set(u,p),Reflect.ownKeys(e).forEach(t=>{const r=Object.getOwnPropertyDescriptor(e,t);"value"in r&&r.writable&&(u[t]=e[t])}),l=!1,u}function qt(e){const t=Ot.get(e);return null==t?void 0:t[1]()}function Vt(e,t,r){const o=Ot.get(e);let n;"production"===(import.meta.env?import.meta.env.MODE:void 0)||o||console.warn("Please use proxy object");const s=[],a=o[2];let i=!1;const l=a(e=>{e&&s.push(e),r?t(s.splice(0)):n||(n=Promise.resolve().then(()=>{n=void 0,i&&t(s.splice(0))}))});return i=!0,()=>{i=!1,l()}}function Zt(e){const t=Ot.get(e);"production"===(import.meta.env?import.meta.env.MODE:void 0)||t||console.warn("Please use proxy object");const[r,o]=t;return Ut(r,o())}const Bt={"details.open":"toggle","input.value":"input","input.checked":"input","select.value":"change","select.selectedIndex":"change"},Yt=["checked","sticky-header"],Xt={details:e=>e.open,input:e=>"checkbox"===e.type?e.checked:"number"===e.type?!0===isNaN(e.valueAsNumber)?null:e.valueAsNumber:"date"===e.type?e.valueAsDate:e.value},Kt=(e,t)=>{const r=e.toLowerCase();void 0===Xt[r]&&(Xt[e.toLowerCase()]=t)};var Gt=Object.freeze({__proto__:null,boolProps:Yt,eventNames:Bt,registerInputValue:Kt,tagGetValue:Xt});const Jt=[(e,t)=>{if("string"==typeof e)return t;const{slot:r,...o}=t,n={slot:r??{}};return Object.keys(o).forEach(e=>{const r=t[e];!0!==e.startsWith("slot:")?n[e]=r:n.slot[e.slice(5)]=r}),n},(e,t)=>{if("string"!=typeof e)return t;const r={};return Object.keys(t).forEach(o=>{const n=t[o];if("slot"!==o){if(!0===o.startsWith("$$")){const t=o.slice(2),s=`${e.toLowerCase()}.${t}`,a=Bt[s]??"input";return r[t]=n.value,void(r[`on${a}`]=n.update)}!0!==o.startsWith("$")&&(!0!==Yt.includes(o)?!1!==n&&null!==n&&(r[o]=!0===n?"":n):r[o]=!0===n)}}),r},(e,t)=>{if("string"!=typeof e)return t;if(void 0===t.ws)return t;const{ws:r,...o}=t;return{"data-ws":r,...o}}],Qt=(e,t)=>{const r=t.children,o=e.children;if(r.length!==o.length)return!0;return-1!==r.findIndex((e,t)=>o[t]!==e)},er=new WeakMap,tr=(e,t)=>{const r=er.get(e),o=Math.max(...Object.values(t).map(e=>qt(e)??0));if(er.set(t,o),r!==o)return!1;const n=[...Object.keys(e),...Object.keys(t)];for(const r of n){if("children"===r&&!0===Qt(e,t))return!1;if(e[r]!==t[r])return!1}return!0},rr=new WeakMap,or=(e,t,...r)=>{return null==e?null:w("string"==typeof(o=e)||!0===o.noMemo?o:(!0===rr.has(o)||rr.set(o,we(o,tr)),rr.get(o)),((e,t)=>{let r=t;for(const t of Jt)r=t(e,r);return r})(e,((e,t)=>{const r=[t.length>0?t:e.children].flat(Number.POSITIVE_INFINITY).filter(e=>null!==e&&!1!==e&&void 0!==e);return{...e,children:r}})(t,r)));var o},nr=()=>{const e=Math.floor(1679615*Math.random()).toString(36);return`${Date.now().toString(36)}${e}`},sr=()=>{const e=Math.floor(4294967296*Math.random()).toString(36);return`${Date.now().toString(36)}:${e}`},ar=e=>null==e?null:function(e){return jt.add(e),e}(e),ir=e=>{const t=e.tagName?.toLowerCase?.()??null,r=Xt[t];return r?.(e)??e.value},lr=(e,t)=>e.length>0?e:t(),cr=e=>e.children,ur=e=>{const{"*render":t,...r}=e;return null==t?null:"string"==typeof t?t:or(cr,{children:t(r)})},pr=e=>{const[t,r]=ie(Date.now()+Math.random());return le(()=>Vt(e,()=>r(Date.now()+Math.random())),[]),e},dr=e=>{const[t,r]=ce(()=>{const t=It("function"==typeof e?e():e);return[t,Vt(t,()=>n(Date.now()+Math.random()))]},[]),[o,n]=ie(Date.now()+Math.random());return le(()=>()=>r(),[]),t},fr=e=>{if("function"==typeof e)return function(e,t){return G=8,ce(function(){return e},t)}(e,[]);const[t]=ie(e);return t},hr=(e,t=[])=>ce(e,t),_r=document.createElement("style");_r.setAttribute("data-name","zephyr-animations"),document.head.append(_r);const mr=e=>{const t=[];for(const[r,o]of Object.entries(e)){const e=Object.entries(o).map(e=>`${e[0]}: ${e[1]};`);t.push(`${r} { ${e.join("")} }`)}const r=`keyframes-${nr()}`;return _r.sheet.insertRule(`@keyframes ${r} { ${t.join(" ")} }`),_r.sheet.insertRule(`@keyframes ${r}-r { ${t.join(" ")} }`),(e,t="linear")=>o=>`${r}${o} ${e}ms ${t}`},gr=mr({"0%":{opacity:0},"100%":{opacity:1}}),br=mr({"0%":{scale:1.4},"100%":{scale:1}}),vr=mr({"0%":{scale:.6},"100%":{scale:1}}),yr=mr({"0%":{translate:"0 -50px"},"100%":{translate:"0 0px"}}),wr=mr({"0%":{translate:"0 50px"},"100%":{translate:"0 0px"}}),xr=mr({"0%":{visibility:"hidden"},"100%":{visibility:"visible"}}),kr=mr({"0%":{rotate:"0deg"},"100%":{rotate:"360deg"}}),$r=mr({"0%":{translate:"-100% 0"},"100%":{translate:"0% 0"}}),zr=e=>{const{children:t,enter:r,exit:o=r,anim:n}=e,s=fr(new Map),a=dr({update:null}),i=[],l=t.map((e,t)=>{const r=((e,t,r,o)=>{if(!0===e.has(t.key)){const r=e.get(t.key);return r.child=t,r.active="none"===r.phase?t:r.active,r}const n=[t.props.$enter??t.props.$animate].flat(),s=[t.props.$exit??t.props.$animate].flat(),a={pos:r,child:t,phase:"enter",anims:{enter:n.map(e=>`${e("")} 0s 1 normal forwards`).join(", "),enterCount:n.length,exit:s.map(e=>`${e("-r")} 0s 1 reverse forwards`).join(", "),exitCount:s.length},clone(e,r){const o=t.props?.style??"";return V(t,{...t.props,style:`${o};animation: ${e};`,...r})}};let i=0;return a.active=a.clone(a.anims.enter,{onanimationend:()=>{i+=1,i<a.anims.enterCount||(a.phase="none",a.active=a.clone("none",{}),o.update=Math.random())}}),e.set(t.key,a),a})(s,e,t,a);return i.push(r.active),e.key});return s.keys().forEach(e=>{if(!0===l.includes(e))return;const t=s.get(e);if("exit"===t.phase)return void i.splice(t.pos,0,t.active);let r=0;t.phase="exit",t.active=t.clone(t.anims.exit,{onanimationend:()=>{r+=1,r<t.anims.exitCount||(s.delete(e),a.update=Math.random())}}),i.splice(t.pos,0,t.active)}),i},Ar=Symbol("no match"),Sr=(e,t)=>{const r=t=>{const r=t.length;return()=>t===e.substr(H,r)?(H+=r,t):Ar},o=t=>()=>{const r=e.charAt(H);return!1!==t.test(r)?(H+=1,r):Ar};let n=null;const s=r("@"),a=r(":"),i=o(/[^;]/),l=r(";"),c=r("*"),u=o(/[a-z0-9_\-]/i),p=r("!"),d=o(/[^{]/),f=r("{"),h=r("}"),_=o(/[a-zA-Z0-9\.\-_#\^\$\/]/),m=r("#"),g=o(/[^;#]/),b=o(/[\s]/m),v=()=>{const e=H;let t=null,r=null;return(t=N())===Ar||(r=x())===Ar?(H=e,Ar):[t,r]},y=()=>{const t=H;let r=null,o=null;return(r=m())===Ar||(o=(()=>{const t=H,r=H;for(;g()!==Ar;);return H-r==0?Ar:e.slice(t,H)})())===Ar?(H=t,Ar):[r,o]},w=()=>{n="rules";let e=H,t=null;const r=[];let o=null;for(;(o=v())!==Ar;)r.push(o);return t=r,N()===Ar?(H=e,Ar):t.map(e=>e[1])},x=()=>{let e=null;return(e=k())!==Ar||(e=$())!==Ar||(e=z())!==Ar||(e=A())!==Ar?e:Ar},k=()=>{n="rule$0";let e=H,t=null;return(t=S())===Ar?(H=e,Ar):t},$=()=>{n="rule$1";let e=H,t=null;return(t=E())===Ar?(H=e,Ar):t},z=()=>{n="rule$2";let e=H,t=null;return(t=P())===Ar?(H=e,Ar):t},A=()=>{n="rule$3";let e=H,t=null;return(t=M())===Ar?(H=e,Ar):t},S=()=>{n="variable";let t=H,r=null,o=null;return s()===Ar||(r=C())===Ar||a()===Ar||N()===Ar||(o=(()=>{const t=H,r=H;for(;i()!==Ar;);return H-r==0?Ar:e.slice(t,H)})())===Ar||l()===Ar?(H=t,Ar):((e,t)=>({type:"var",name:e,value:t}))(r,o)},E=()=>{n="css";let t=H,r=null,o=null;return c()===Ar||(r=C())===Ar||a()===Ar||N()===Ar||(o=(()=>{const t=H,r=H;for(;i()!==Ar;);return H-r==0?Ar:e.slice(t,H)})())===Ar||l()===Ar?(H=t,Ar):((e,t)=>({type:"css",name:e,value:t}))(r,o)},C=()=>{n="cssName";let t=H,r=null;return(r=(()=>{const t=H,r=H;for(;u()!==Ar;);return H-r==0?Ar:e.slice(t,H)})())===Ar?(H=t,Ar):r},P=()=>{n="subrule";let t=H,r=null,o=null;return p()===Ar||N()===Ar||(r=(()=>{const t=H,r=H;for(;d()!==Ar;);return H-r==0?Ar:e.slice(t,H)})())===Ar||f()===Ar||(o=w())===Ar||h()===Ar?(H=t,Ar):(s=o,{type:"alt",selector:r.trim(),rules:s});var s},M=()=>{n="macro";let t=H,r=null,o=null;if((r=(()=>{const t=H,r=H;for(;_()!==Ar;);return H-r==0?Ar:e.slice(t,H)})())===Ar)return H=t,Ar;const s=(()=>{const e=H;let t=null,r=null,o=null;return(t=a())===Ar||(r=N())===Ar||(o=L())===Ar?(H=e,Ar):[t,r,o]})();return o=s===Ar?null:s,l()===Ar?(H=t,Ar):((e,t)=>({type:"macro",name:e,value:t?.[2]}))(r,o)},L=()=>{let e=null;return(e=O())!==Ar||(e=j())!==Ar?e:Ar},O=()=>{n="macroValue$0";let e=null;const t=[];let r=null;for(;(r=y())!==Ar;)t.push(r);return 0===t.length?Ar:(e=t,(e=>{const t=e.map(e=>e[1].trim());return t.arg=t.join(" "),t})(e))},j=()=>{n="macroValue$1";let t=H,r=null;return(r=(()=>{const t=H,r=H;for(;i()!==Ar;);return H-r==0?Ar:e.slice(t,H)})())===Ar?(H=t,Ar):(e=>{const t=[e.trim()];return t.arg=e,t})(r)},N=()=>{for(n="_";b()!==Ar;);};let H=0;const T=(()=>{n="$";let e=H,t=null;return(t=w())===Ar?(H=e,Ar):t})();return H!==e.length?(console.log("last",n),console.log("@",H),console.log(e.slice(H-10,H+10)),new Error("End of input not found")):T},Er=document.createElement("style");Er.setAttribute("data-name","windstorm-generated"),Er.innerHTML="@layer ws.custom ws.user ws.element;",document.head.append(Er);const Cr=(e,...t)=>{const r=String.raw(e,...t);return Pr(Sr(r),{"&":[]},"&")},Pr=(e,t,r)=>{for(const o of e)Lr(o,t,r);return t},Mr=e=>e.replace(/@([a-zA-Z0-9\-_]+)/g,(e,t)=>`var(--${t})`),Lr=(e,t,r)=>{if("var"===e.type)return void t[r].push(`--${e.name}: ${Mr(e.value)};`);if("css"===e.type)return void t[r].push(`${e.name}: ${Mr(e.value)};`);if("macro"===e.type){const o=Or[e.name];if(void 0===o)return void console.warn(`no macro for "${e.name}"`);for(const[n,s]of Object.entries(o)){const o=n.replace("&",r);t[o]=t[o]??[],t[o].push(...s.map(t=>Mr(t.replace(/%(arg|\d+)/g,(t,r)=>e.value?.[r]??""))))}return}const o=e.selector.replaceAll("&",r);t[o]=[...t[o]??[]],Pr(e.rules,t,o)},Or={},jr=e=>void 0!==Or[e]?()=>{}:(t,...r)=>Or[e]=Cr(t,...r),Nr=e=>Object.entries(e).reduce((e,[t,r])=>{if(!0===t.startsWith("|")){const o=t.lastIndexOf("|"),n=[`@media (${t.slice(1,o)}) {`,`&${t.slice(o+1)} {`,...r,"}","}"].join("\n");return e.push(n),e}return e.push(`${t} {\n${r.join("\n")}\n}`),e},[]),Hr=(e,t="ws.custom")=>(r,...o)=>{const n=Cr(r,...o);e.startsWith("@");const s=Nr(n).map(t=>t.replaceAll("&",e)),a=`@layer ${t} { ${s.join("\n")} }`;Er.sheet.insertRule(a)},Tr={origin:"https://wind-cdn.axel669.net",...window.wsConfig,version:"1.0.0-beta.9",iconVersion:"3.34.0"},Rr={},Wr=async(e,t)=>{const r=Rr[t],o=`ws-icon-${t}`;if(void 0!==r){if(await r.loaded,"loaded"!==r.status||null===e)return;return void e.style.setProperty("--icon-font",o)}const n=new FontFace(o,`url(${Tr.origin}/icon/${t}.woff?v${Tr.iconVersion})`);Rr[t]=n;try{await n.load()}catch(e){console.error(e)}document.fonts.add(n),Wr(e,t)},Dr=e=>{if(void 0===e.tagName)return;const t=e.dataset.icon??null;null!==t&&Wr(e,t)},Ur={childList(e){0!==e.addedNodes.length&&e.addedNodes.forEach(e=>{void 0!==e.tagName&&[e,...e.querySelectorAll("*")].forEach(Dr)})},attributes(e){Dr(e.target)}};new MutationObserver(e=>e.forEach(e=>Ur[e.type](e))).observe(document.body,{subtree:!0,attributes:!0,childList:!0,attributeFilter:["data-icon"]});const Fr=(...e)=>{for(const t of e)Wr(null,t)};jr("appr")`*apperance:%arg; *-webkit-appearance:%arg;`,jr("area")`*grid-area:%arg;`,jr("b")`*border:%arg;`,jr("b.b")`*border-bottom:%arg;`,jr("b.b.c")`*border-bottom-color:%arg;`,jr("b.b.s")`*border-bottom-style:%arg;`,jr("b.b.w")`*border-bottom-width:%arg;`,jr("b.c")`*border-color:%arg;`,jr("b.l")`*border-left:%arg;`,jr("b.l.c")`*border-left-color:%arg;`,jr("b.l.s")`*border-left-style:%arg;`,jr("b.l.w")`*border-left-width:%arg;`,jr("b.r")`*border-right:%arg;`,jr("b.r.c")`*border-right-color:%arg;`,jr("b.r.s")`*border-right-style:%arg;`,jr("b.r.w")`*border-right-width:%arg;`,jr("b.s")`*border-style:%arg;`,jr("b.t")`*border-top:%arg;`,jr("b.t.c")`*border-top-color:%arg;`,jr("b.t.s")`*border-top-style:%arg;`,jr("b.t.w")`*border-top-width:%arg;`,jr("b.w")`*border-width:%arg;`,jr("b.x")`*border-left:%arg; *border-right:%arg;`,jr("b.x.c")`*border-left-color:%arg; *border-right-color:%arg;`,jr("b.x.s")`*border-left-style:%arg; *border-right-style:%arg;`,jr("b.x.w")`*border-left-width:%arg; *border-right-width:%arg;`,jr("b.y")`*border-top:%arg; *border-bottom:%arg;`,jr("b.y.c")`*border-top-color:%arg; *border-bottom-color:%arg;`,jr("b.y.s")`*border-top-style:%arg; *border-bottom-style:%arg;`,jr("b.y.w")`*border-top-width:%arg; *border-bottom-width:%arg;`,jr("bg")`*background:%arg;`,jr("bg.att")`*background-attachment:%arg;`,jr("bg.c")`*background-color:%arg;`,jr("bg.img")`*background-image:%arg;`,jr("bg.pos")`*background-position:%arg;`,jr("bg.rep")`*background-repeat:%arg;`,jr("bg.sz")`*background-size:%arg;`,jr("c")`*color:%arg;`,jr("col")`*grid-column:%arg;`,jr("cur")`*cursor:%arg;`,jr("disp")`*display:%arg;`,jr("fl.basis")`*flex-basis:%arg;`,jr("fl.cross")`*align-items:%arg;`,jr("fl.dir")`*flex-direction:%arg;`,jr("fl.flow")`*flex-flow:%arg;`,jr("fl.grow")`*flex-grow:%arg;`,jr("fl.main")`*justify-content:%arg;`,jr("fl.shrink")`*flex-shrink:%arg;`,jr("fl.size")`*flex:%arg;`,jr("fl.wr")`*flex-wrap:%arg;`,jr("font")`*font-family:%arg;`,jr("gap")`*gap:%arg;`,jr("gap.col")`*column-gap:%arg;`,jr("gap.row")`*row-gap:%arg;`,jr("gr.areas")`*grid-template-areas:%arg;`,jr("gr.cols")`*grid-template-columns:%arg;`,jr("gr.cols.a")`*grid-auto-columns:%arg;`,jr("gr.flow")`*grid-auto-flow:%arg;`,jr("gr.rows")`*grid-template-rows:%arg;`,jr("gr.rows.a")`*grid-auto-rows:%arg;`,jr("h")`*height:%arg;`,jr("h.max")`*max-height:%arg;`,jr("h.min")`*min-height:%arg;`,jr("inset")`*top:%arg; *left:%arg; *bottom:%arg; *right:%arg;`,jr("inset.x")`*left:%arg; *right:%arg;`,jr("inset.y")`*top:%arg; *bottom:%arg;`,jr("m")`*margin:%arg;`,jr("m.b")`*margin-bottom:%arg;`,jr("m.l")`*margin-left:%arg;`,jr("m.r")`*margin-right:%arg;`,jr("m.t")`*margin-top:%arg;`,jr("m.x")`*margin-left:%arg; *margin-right:%arg;`,jr("m.y")`*margin-bottom:%arg; *margin-top:%arg;`,jr("o")`*opacity:%arg;`,jr("outln")`*outline:%arg;`,jr("over")`*overflow:%arg;`,jr("over.x")`*overflow-x:%arg;`,jr("over.y")`*overflow-y:%arg;`,jr("p")`*padding:%arg;`,jr("p.b")`*padding-bottom:%arg;`,jr("p.l")`*padding-left:%arg;`,jr("p.r")`*padding-right:%arg;`,jr("p.t")`*padding-top:%arg;`,jr("p.x")`*padding-left:%arg; *padding-right:%arg;`,jr("p.y")`*padding-top:%arg; *padding-bottom:%arg;`,jr("pos")`*position:%arg;`,jr("pos.abs")`*position:absolute;`,jr("pos.fix")`*position:fixed;`,jr("pos.rel")`*position:relative;`,jr("pos.stick")`*position:sticky;`,jr("r")`*border-radius:%arg;`,jr("r.b")`*border-bottom-left-radius:%arg; *border-bottom-right-radius:%arg;`,jr("r.bl")`*border-bottom-left-radius:%arg;`,jr("r.br")`*border-bottom-right-radius:%arg;`,jr("r.l")`*border-top-left-radius:%arg; *border-bottom-left-radius:%arg;`,jr("r.r")`*border-top-right-radius:%arg; *border-bottom-right-radius:%arg;`,jr("r.t")`*border-top-left-radius:%arg; *border-top-right-radius:%arg;`,jr("r.tl")`*border-top-left-radius:%arg;`,jr("r.tr")`*border-top-right-radius:%arg;`,jr("row")`*grid-row:%arg;`,jr("sel")`*user-select:%arg;`,jr("self.cross")`*align-self:%arg;`,jr("self.main")`*justify-self:%arg;`,jr("sh.box")`*box-shadow:%arg;`,jr("sh.text")`*text-shadow:%arg;`,jr("t.a")`*text-align:%arg;`,jr("t.br")`*word-break:%arg;`,jr("t.c")`*color:%arg;`,jr("t.deco")`*text-decoration:%arg;`,jr("t.lh")`*line-height:%arg;`,jr("t.over")`*text-overflow:%arg;`,jr("t.st")`*font-style:%arg;`,jr("t.sz")`*font-size:%arg;`,jr("t.tf")`*text-transform:%arg;`,jr("t.var")`*font-variant:%arg;`,jr("t.wrap")`*word-wrap:%arg;`,jr("t.ws")`*white-space:%arg;`,jr("t.wt")`*font-weight:%arg;`,jr("tf")`*transform:%arg;`,jr("tf.o")`*transform-origin:%arg;`,jr("tf.p")`*perspective:%arg;`,jr("tr")`*transition:%arg;`,jr("v.a")`*vertical-align:%arg;`,jr("vis")`*visibility:%arg;`,jr("w")`*width:%arg;`,jr("w.max")`*max-width:%arg;`,jr("w.min")`*min-width:%arg;`,jr("x")`*left:%arg;`,jr("-x")`*right:%arg;`,jr("y")`*top:%arg;`,jr("-y")`*bottom:%arg;`,jr("z")`*z-index:%arg;`,jr("fl.cn")`fl.cross:center; fl.main:center;`,jr("fl.cn.cross")`fl.cross:center;`,jr("fl.cn.main")`fl.main:center;`,jr("flex")`disp:flex; fl.dir:%arg;`,jr("grid")`disp:grid; gr.flow:%arg;`,jr("hide")`disp:none;`,jr("invis")`vis:hidden;`,jr("sticky")`pos:sticky; y:0px; z:+1;`,jr("adorn")`disp:flex; fl.cn; p:4px;`,jr("pad.compact")`p:0px 4px;`,jr("var.outln")`b.w:1px;`,jr("var.fill")` @text-color:@c2; @fill-color:@c1; @active:@c2; b.c:transparent; `,jr("fill.reset")` @text-color:initial; @fill-color:initial; `,jr("var.lined")`b.w:0px; b.b.w:@border-size; r.b:0px;`,jr("gr.cols-fit")`*grid-template-columns:repeat(auto-fit, minmax(%arg));`,jr("gr.cols-fill")`*grid-template-columns:repeat(auto-fill, minmax(%arg));`,jr("text.subtitle")`t.sz:@text-size-subtitle; flex; fl.main:center; p:0px 8px;`,jr("text.title")`t.sz:@text-size-title; flex; fl.main:center; p:4px 8px;`,jr("raise")`sh.box:0px calc(%arg * 1px + 2px) calc(%arg * 1px + 1px) -1px @shadow-color; z:+%arg;`,jr("raised")`raise:1;`,jr("scrollable")`over:auto;`,jr("#animate")` @modal-transition:visibility @anim-time linear; @dialog-transition:opacity @anim-time ease; @popover-transition:opacity @anim-time ease; @drawer-transition:transform @anim-time ease; `,jr("#no-animate")` @modal-transition:none; @dialog-transition:none; @popover-transition:none; @drawer-transition:none; `,jr("#no-select-animate")` @select-cancel:none; `,jr("layout.base")` over:hidden; disp:grid; ! body > & { pos:absolute; x:0px; y:0px; w:100%; h:100%; } ! :where(&) > * { area:content; } `,jr("layout.3x3-center")` layout.base; @width:auto; @height:auto; disp:grid; gr.cols:[left-start top-start bottom-start] 1fr [left-end content-start] @width [content-end right-start] 1fr [right-end top-end bottom-end] ; gr.rows:[top-start left-start right-start] 1fr [top-end content-start] @height [content-end bottom-start] 1fr [bottom-end left-end right-end] ; `,jr("layout.3row-center")` @height:auto; layout.base; disp:grid; gr.cols.a:1fr; gr.rows:1fr @height 1fr; gr.areas:"top" "content" "bottom"; `,jr("layout.3col-center")` @width:auto; layout.base; disp:grid; gr.cols:1fr @width 1fr; gr.rows.a:1fr; gr.areas:"left content right"; `,jr("layout.3row-controls")` layout.base; disp:grid; gr.cols.a:1fr; gr.rows:min-content 1fr min-content; gr.areas:"header" "content" "footer"; `,jr("layout.3col-controls")` layout.base; disp:grid; gr.cols:min-content 1fr min-content; gr.rows.a:1fr; gr.areas:"menu content action"; `,jr("layout.2col-sidebar")` layout.base; @col-a:1fr; @col-b:2fr; disp:grid; gr.cols:@col-a @col-b; gr.rows.a:1fr; gr.areas:"sidebar content"; `;const Ir=e=>Object.entries(e).reduce((e,t)=>{const[r,o]=t;return null==o||!1===o?e:!0===o?(e.push(`${r};`),e):"object"==typeof o?(e.push(`${r} { ${Ir(o)} }`),e):(e.push(`${r}: ${o};`),e)},[]).join(" "),qr=Tr.version,Vr={get mobile(){return matchMedia("(hover: none)")}};Hr("*")` *box-sizing:border-box; *-webkit-tap-highlight-color:transparent; *border-width:0px; *border-style:solid; *outline-color:hsl(@mono, @layer-text); `,Hr("html, body")` *padding:0px; *margin:0px; *width:100%; *height:100%; *-webkit-tap-highlight-color:transparent; *-webkit-font-smoothing:antialiased; `,Hr("@font-face",null)` *font-family:Tektur; *font-display:swap; *src:url(${Tr.origin}/font/tektur.woff2?v${Tr.version}) format("woff2") ; `,Hr("@font-face",null)` *font-family:Roboto; *font-display:swap; *src:url(${Tr.origin}/font/roboto.woff2?v${Tr.version}) format("woff2") ; `;const Zr=Math.ceil(screen.height*devicePixelRatio*10)%10>=5;jr("#theme.base")` font:@font; @sub-pixel-offset:${Zr?1:0}px; @z-info:5; @z-cover:25; @z-notif:50; @z-layer:100; @base-radius:4px; @anim-time:250ms; @short-anim-time:150ms; @text-size-normal:15px; @text-size-title:calc(@text-size-normal * 2); @text-size-header:calc(@text-size-normal * 1.5); @text-size-subtitle:calc(@text-size-normal * 0.9); @text-size-info:calc(@text-size-normal * 0.75); @color:@mono; @page-text-color:hsl(@color, @layer-text); bg.c:hsl(@color, @layer-bg); t.c:@page-text-color; t.sz:@text-size-normal; `,jr("#theme.tron")` #theme.base; @font:Tektur; @mono:0, 0%; @primary:184, 80%; @accent:160, 80%; @info:208, 80%; @success:130, 80%; @warning:58, 80%; @error:4, 80%; @layer-bg:10%; @layer-surface:5%; @layer-element:60%; @layer-container:10%; @layer-border:25%; @layer-text:95%; @layer-fill:5%; @shadow-color:hsla(0, 0%, 69%, 0.25); @modal-color:hsla(0, 0%, 0%, 0.05); *color-scheme:dark; `,jr("#theme.dark")` #theme.base; @font:Roboto; @mono:0, 0%; @primary:184, 80%; @accent:160, 80%; @info:208, 80%; @success:130, 80%; @warning:58, 80%; @error:4, 80%; @layer-bg:20%; @layer-surface:10%; @layer-element:50%; @layer-container:15%; @layer-border:30%; @layer-text:90%; @layer-fill:10%; @shadow-color:hsla(0, 0%, 69%, 0.25); @modal-color:hsla(0, 0%, 0%, 0.05); *color-scheme:dark; `,jr("#theme.light")` #theme.base; @font:Roboto; @mono:0, 0%; @primary:184, 70%; @accent:160, 85%; @info:208, 85%; @success:130, 90%; @warning:58, 85%; @error:4, 80%; @layer-bg:85%; @layer-surface:95%; @layer-element:37.5%; @layer-container:90%; @layer-border:80%; @layer-text:10%; @layer-fill:95%; @shadow-color:hsla(0, 0%, 20%, 0.25); @modal-color:hsla(0, 0%, 0%, 0.05); `;var Br=(e,...t)=>{const r=String.raw(e,...t),o=document.createElement("template");return o.innerHTML=r,()=>o.content.cloneNode(!0)};Hr("ws-circle-spinner, ws-hexagon-spinner")` @size:100px; w:@size; h:@size; disp:inline-block; `;const Yr=Br` <style> :host { --color:var(--primary); --core-color:hsl(var(--color), var(--layer-element)); --alt-color:hsl(var(--color), var(--layer-border)); --size:200px; } svg { width:var(--size); height:var(--size); } @keyframes turn { 0% { transform:rotate(0deg); } 100% { transform:rotate(360deg); } } circle { animation-name:turn; animation-duration:calc(1000ms * var(--n)); animation-iteration-count:infinite; animation-timing-function:ease; stroke:var(--c); stroke-width:6; fill:none; animation-direction:var(--anim); } </style> <svg viewbox="-50 -50 100 100"> <circle style="--c:var(--core-color);--o:1; --anim:forward; --n:2.5;" cx=0 cy=0 r=45 stroke-dasharray="45 45"></circle> <circle style="--c:var(--alt-color);--o:0.5; --anim:reverse; --n:2;" cx=0 cy=0 r=35 stroke-dasharray="35 35"></circle> <circle style="--c:var(--core-color);--o:0.75; --anim:forward; --n:3.5;" cx=0 cy=0 r=25 stroke-dasharray="25 25"></circle> </svg> `;customElements.define("ws-circle-spinner",class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"closed"}).appendChild(Yr())}});const Xr=Br` <style> :host { --color:var(--primary); --core-color:hsl(var(--color), var(--layer-element)); --alt-color:hsl(var(--color), var(--layer-border)); --size:200px; } svg { width:var(--size); height:var(--size); } circle { stroke-width:0; fill:var(--c); offset-path:path("M 0 -45 L 39 -22.5 L 39 22.5 L 0 45 L -39 22.5 L -39 -22.5 L 0 -45"); animation-name:mover; animation-duration:3000ms; animation-iteration-count:infinite; animation-timing-function:linear; } @keyframes mover { 0% { offset-distance:0%; } 100% { offset-distance:100%; } } @keyframes trail { 0% { stroke-dashoffset:0; } 100% { stroke-dashoffset:var(--len); } } path { animation-name:trail; animation-duration:3000ms; animation-iteration-count:infinite; animation-timing-function:linear; stroke:var(--c); stroke-width:6; fill:none; animation-direction:var(--anim); } </style> <svg viewbox="-50 -50 100 100"> <path d="M 0 -36 L 31 -18 L 31 18 L 0 36 L -31 18 L -31 -18 L 0 -36 Z" style="--c:var(--alt-color); --len:216;" stroke-dasharray="36 36" /> <path d="M 0 -22.5 L 19.5 -11.25 L 19.5 11.25 L 0 22.5 L -19.5 11.25 L -19.5 -11.25 L 0 -22.5 Z" style="--c:var(--core-color); --anim:reverse; --len:135;" stroke-dasharray="22.5 22.5" /> <circle r="3" style="--c:var(--core-color); animation-delay:-250ms;"/> <circle r="3" style="--c:var(--core-color); animation-delay:-1250ms;" /> <circle r="3" style="--c:var(--core-color); animation-delay:-2250ms;" /> </svg> `;customElements.define("ws-hexagon-spinner",class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"closed"}).appendChild(Xr())}});var Kr=(e,t,r)=>` @l1:${e}; @l2:${t}; @l3:${r}; @c1:hsl(@color, @l1); @c2:hsl(@color, @l2); @c3:hsl(@color, @l3); @fill:var(--fill-color, transparent); @text:var(--text-color, @c1); @border:var(--border-color, @c3); @active:@text; `;Hr("ws-avatar")` @color:@mono; @size:36px; ${Kr("@layer-element","@layer-fill")} disp:inline-flex; over:hidden; r:500px; fl.cross:center; fl.main:center; w:@size; h:@size; bg.c:@fill; t.c:@text; v.a:text-bottom; ! & > img { w:100%; } ! & > object { w:100%; h:100%; disp:flex; fl.cross:center; fl.main:center; } `,Hr("ws-badge")` @color:@primary; ${Kr("@layer-element","@layer-fill")} pos:relative; disp:inline-grid; over:visible; ! &::after { pos:absolute; *content:attr(ws-text); -x:-10px; y:0px; tf:translateY(-50%); bg.c:@c1; *pointer-events:none; r:20px; p:4px; w.min:20px; h:20px; *box-sizing:border-box; t.a:center; t.sz:@text-size-subtitle; t.c:@c2; t.lh:14px; z:@z-info; t.wt:600; } `;var Gr=' over:hidden; pos:relative; cur:pointer; ! &::after { *content:""; pos:absolute; y:0px; x:0px; -y:0px; -x:0px; *pointer-events:none; o:0; bg.c:@active; tr:opacity @anim-time linear; } ! &:where(:not(:disabled)):active::after { tr:none; o:0.3; } ',Jr=' over:hidden; pos:relative; ! |hover:hover| { ! &::before { *content:""; pos:absolute; y:0px; x:0px; -y:0px; -x:0px; *pointer-events:none; o:0; bg.c:@active; } ! &:where(:not(:disabled)):hover::before { tr:none; o:0.1; } } ';Hr(":where(button[data-ws], a[data-ws][button], label[data-ws][button])")` @color:@primary; ${Kr("@layer-element","@layer-fill","@layer-border")} pos:relative; b:0px solid @border; font:@font; t.c:@text; bg.c:@fill; r:@base-radius; cur:pointer; p:8px 16px; over:hidden; *user-select:none; disp:inline-flex; fl.cross:center; fl.main:center; t.deco:none; t.wt:500; ! &:disabled { cur:default; *filter:saturate(30%) brightness(0.7); } ${Jr} ${Gr} `,Hr("ws-chip")` @color:@mono; ${Kr("@layer-element","@layer-fill","@layer-border")} disp:inline-flex; fl.cross:center; fl.main:center; r:100px; p:4px 12px; *user-select:none; v.a:text-bottom; t.c:@text-color; bg:@fill-color; b:1px solid @border; ! &[clickable] { cur:pointer; ${Gr} } `,Hr("label[control][data-ws]")` @color:@primary; @active:@mono; pos:relative; disp:inline-grid; gr.areas:"label label label" "start control end" "extra extra extra"; gr.rows:minmax(0px, min-content) auto minmax(0px, min-content); gr.cols:minmax(0px, min-content) auto minmax(0px, min-content); *user-select:none; over:hidden; b:0px solid hsl(@color, @layer-border); bg.c:hsl(@active, @layer-container); r:@base-radius; ! &:focus-within { @active:@color; } ! &:has(:not(button):disabled) { *filter:saturate(50%) brightness(0.7); } ! & > :is(input, select, ws-select, textarea) { area:control; b.w:0px; @color:inherit; ! &:focus { outln:none; } } ! & > :where(input, textarea) { t.c:hsl(@mono, @layer-text); font:@font; h.min:28px; w:100%; h:100%; p:4px; bg.c:transparent; w.min:16px; } ! & > :where(input[type="file"]) { pos:relative; p:0px; ! &::file-selector-button { font:@font; h:100%; m:0px; m.r:4px; p:4px; t.c:hsl(@color, @layer-element); bg.c:transparent; b.w:0px; t.deco:underline; } } ! & > [label-text] { area:label; p:4px; disp:flex; fl.dir:column; fl.cross:start; t.c:hsl(@color, @layer-element); t.ws:nowrap; t.sz:@text-size-normal; } `,Fr("caret-right-filled"),Hr(":where(details[data-ws])")` @color:@primary; @padding:8px; ${Kr("@layer-element","@layer-fill")} b:0px solid @c3; p:0px @padding; r:4px; over:hidden; ! &:open { p.b:@padding; } ! & > summary { t.c:@c1; pos:relative; p:4px; p.l:24px; m.x:calc(-1 * @padding); cur:pointer; *user-select:none; ! &::before { pos:absolute; x:0px; y:50%; -y:0px; w:1em; disp:flex; fl.cross:center; fl.main:center; font:ws-icon-caret-right-filled; *speak:none; t.st:normal; t.wt:400; t.var:normal; t.tf:none; *content:"caret-right-filled"; tf:translateY(-50%); tr:transform 100ms linear; w:24px; h:24px; t.lh:24px; t.sz:18px; } ! &::marker, &::-webkit-details-marker { *content:""; disp:none; } } ! &:open > summary::before { tf:translateY(-50%) rotate(90deg); } `,Hr("ws-dialog")` pos:absolute; x:50%; y:50%; tf:translate(-50%, -50%); tr:var(--dialog-transition, none); o:0; ! [open] > & { o:unset; } ! [inline-desktop] > & { pos:relative; } `,Hr("ws-drawer")` pos:absolute; x:0px; y:0px; -y:0px; disp:grid; tr:var(--drawer-transition, none); tf:translateX(-100%); ! [open] > & { tf:unset; } `,Hr("ws-flex")` flex:column; gap:8px; p:8px; over:hidden; ! & > * { fl.shrink:0; } `,Hr("ws-grid")` disp:grid; over:hidden; gap:8px; p:8px; gr.rows.a:min-content; `,Hr("ws-icon")` disp:var(--icon-font, none); t.lh:1; ! &::before { disp:inline-block; font:@icon-font; *-webkit-font-smoothing:antialiased; *-moz-osx-font-smoothing:grayscale; *content:attr(data-icon); m.t:2px; } `,Hr("a[data-ws]:not([button])")` @color:@primary; t.c:hsl(@color, @layer-element); ! &:visited, &:hover { t.c:hsl(@color, @layer-element); } ! &[disabled] { *pointer-events:none; *filter:saturation(30%) brightness(0.7); } `;const Qr=Br` <style> :host { position:fixed; top:0px; left:0px; width:100vw; height:100vh; background-color:var(--modal-color); z-index:var(--z-cover); transition:var(--modal-transition, none); backdrop-filter:blur(2px); } ws-modal-overlay { position:absolute; inset:0px; } ws-modal-overlay:focus { outline:none; } :host(:not([open])) { visibility:hidden; } :host([clear]) { background-color:transparent; } @media (hover:hover) { :host([inline-desktop]) { position:relative; width:unset; height:unset; display:grid; grid-template-columns:1fr; grid-template-rows:1fr; z-index:unset; } :host([inline-desktop]) ws-modal-overlay { display:none; } } </style> <ws-modal-overlay> </ws-modal-overlay> <slot></slot> `;customElements.define("ws-modal",class extends HTMLElement{#e=null;constructor(){super(),this.#e=this.attachShadow({mode:"closed",delegatesFocus:!0}),this.#e.append(Qr())}connectedCallback(){window.addEventListener("keydown",e=>{!0!=(!1===this.open||"Escape"!==e.key||!0===this.persistent)&&this.hide()}),this.#e.querySelector("ws-modal-overlay").addEventListener("click",e=>{!0!==this.persistent&&this.hide()})}get open(){return this.hasAttribute("open")}set open(e){if(!1===e){if(!1===this.open)return;return this.removeAttribute("open"),void this.dispatchEvent(new Event("close"))}this.setAttribute("open","")}get persistent(){return this.hasAttribute("persistent")}set persistent(e){!1!==e?this.setAttribute("persistent",""):this.removeAttribute("persistent")}get managed(){return this.hasAttribute("managed")}set managed(e){!1!==e?this.setAttribute("managed",""):this.removeAttribute("managed")}show(){this.open=!0}hide(e){!0!==this.managed||!0===e?this.open=!1:this.dispatchEvent(new Event("close"))}});const eo=Br` <style> ws-popover-position { transition:var(--popover-transition, none); opacity:0; } [open] ws-popover-position { opacity:unset; } </style> <slot></slot> <ws-modal> <ws-popover-position> <slot name="popover"></slot> </ws-popover-position> </ws-modal> `;customElements.define("ws-popover",class extends HTMLElement{static observedAttributes=["open","persistent"];#e=null;#t=null;constructor(){super(),this.#e=this.attachShadow({mode:"closed",delegatesFocus:!0}),this.#e.append(eo()),this.#t=this.#e.querySelector("ws-modal")}connectedCallback(){this.#t.addEventListener("close",()=>{this.hide(),this.dispatchEvent(new Event("close"))}),!1!==this.open&&(this.#t.open=this.open,this.setVars())}attributeChangedCallback(e,t,r){null!==r?(this.#t[e]=!0,"open"===e&&this.setVars()):this.#t[e]=!1}setVars(){const e=(this.sizeTarget??this).getBoundingClientRect();this.style.setProperty("--x",`${e.x}px`),this.style.setProperty("--y",`${e.y}px`),this.style.setProperty("--w",`${e.width}px`),this.style.setProperty("--h",`${e.height}px`)}get open(){return this.hasAttribute("open")}set open(e){this.#t.open=e,!1!==e?this.setAttribute("open",""):this.removeAttribute("open")}get persistent(){return this.hasAttribute("persistent")}set persistent(e){this.#t.persistent=e,!1!==e?this.setAttribute("persistent",""):this.removeAttribute("persistent")}show(){this.open=!0,this.focus()}hide(){this.open=!1}});const to=Br` <style> @keyframes busy-load { from { transform:translateX(-100%); } to { transform:translateX(400%); } } :host { display:block; height:8px; border-radius:var(--base-radius); background-color:hsl(var(--mono), var(--layer-border)); position:relative; overflow:hidden; --color:var(--mono); } div::before, div::after { content:""; position:absolute; top:0px; left:0px; height:100%; --range:calc(var(--max, 1) - var(--min, 0)); --bar-width:calc(100% * var(--value, 0) / var(--range)); --buffer-width:calc(100% * var(--buffer, 0) / var(--range)); } div::before { background-color:hsl(var(--color), var(--layer-element)); } div::after { opacity:0.3; background-color:hsl(var(--color), var(--layer-element)); } :host(:not([busy])) div::before { width:var(--bar-width); } :host(:not([busy])) div::after { width:var(--buffer-width); } :host([busy]) div::before { width:25%; animation-name:busy-load; animation-iteration-count:infinite; animation-duration:2s; } </style> <div></div> `;customElements.define("ws-progress",class extends HTMLElement{static observedAttributes=["min","max","value","buffer"];#r=null;constructor(){super();const e=this.attachShadow({mode:"closed"});e.append(to()),this.#r=e.querySelector("div")}get value(){return parseFloat(this.getAttribute("value")??"0")}get buffer(){return parseFloat(this.getAttribute("buffer")??"0")}get min(){return parseFloat(this.getAttribute("min")??"0")}get max(){return parseFloat(this.getAttribute("max")??"1")}get busy(){return this.hasAttribute("busy")}set value(e){!1===e&&this.removeAttribute("value"),this.setAttribute("value",e?.toString()??"")}set buffer(e){!1===e&&this.removeAttribute("buffer"),this.setAttribute("buffer",e?.toString()??"")}set min(e){!1===e&&this.removeAttribute("min"),this.setAttribute("min",e?.toString()??"")}set max(e){!1===e&&this.removeAttribute("max"),this.setAttribute("max",e?.toString()??"")}set busy(e){!1===e&&this.removeAttribute("busy"),this.setAttribute("busy",e)}#o(e,t){this.#r.style.setProperty(`--${e}`,this.getAttribute(e)||t)}connectedCallback(){this.#o("value","0"),this.#o("buffer","0"),this.#o("min","0"),this.#o("max","1")}attributeChangedCallback(e,t,r){this.#o(e,r)}});const ro="caret-down-filled";Fr(ro),Hr("ws-option")` ${Kr("@layer-element","@layer-fill")} disp:block; p:8px; *pointer-events:auto; t.c:@text-color-normal; w.min:fit-content; ! &[selected] { bg.c:@c1; t.c:@c2; } ! & * { *pointer-events:none; } ${Jr} ${Gr} `,Hr("ws-optgroup")` grid; gr.cols:16px 1fr; *pointer-events:none; ! &::before { *content:attr(label); disp:block; p:8px; col:1 / -1; bg.c:hsl(@color, @layer-container); } ! & > * { col:2; } `;const oo=Br` <style> :host { --color:var(--mono); --modal-color:transparent; --max-height:250px; --c1:hsl(var(--color), var(--layer-border)); --c2:hsl(var(--color), var(--layer-surface)); display:inline-grid; grid-template-rows:1fr 0px; user-select:none; cursor:default; position:relative; border:1px solid var(--c1); border-radius:var(--base-radius); padding:4px; --modal-transition:var(--select-cancel, visibility var(--anim-time) linear); --popover-transition:var(--select-cancel, opacity var(--anim-time) ease-out); --select-transition:var(--select-cancel, transform var(--anim-time) ease-out); } slot[name=options] { display:block; overflow:visible; } ws-options { box-sizing:border-box; border:1px solid var(--c1); border-radius:var(--base-radius); color:hsl(var(--mono), var(--layer-text)); display:grid; position:absolute; max-height:var(--max-height); overflow:auto; background-color:var(--c2); grid-template-columns:1fr; border-radius:var(--base-radius); box-shadow:0px 2px 4px var(--shadow-color); transform:translateY(10px); transition:var(--select-transition); --sign:sign(var(--y) - 100vh + var(--opt-h)); --pos:calc( var(--y) - calc( max(var(--sign), 0)* (var(--opt-h) - var(--h)) ) ); top:var(--pos); left:var(--x); width:var(--w); transform-origin:top center; } :host([open]) ws-options { transform:translateY(0); } value-display { display:grid; user-select:none; grid-template-columns:1fr min-content; height:100%; } value-display:focus { outline:none; } ws-sel-caret { display:flex; align-items:center; justify-content:center; padding:4px; padding-right:0px; width:24px; } ws-sel-caret::before { display:block; font-family:ws-icon-${ro}; content:attr(data-icon); } slot[name="selected"] { display:none; } slot[name="display"] { display:flex; align-items:center; } :host(:focus:not(:disabled)) { outline-style:auto; outline-width:1px; } :host(:disabled) { filter:saturate(50%) brightness(0.8); } </style> <value-display tabindex="0"> <slot name="selected"> <ws-selected>No Selection</ws-selected> </slot> <slot name="display"></slot> <ws-sel-caret data-icon="${ro}"></ws-sel-caret> </value-display> <ws-popover> <slot slot="popover" name="options"> <ws-options> <slot></slot> </ws-options> </slot> </ws-popover> `,no="ws-option";customElements.define("ws-select",class extends HTMLElement{static formAssociated=!0;#n=null;#s=-1;#a=null;#i=null;#l=null;#c=null;#e=null;#u=null;#p(){return[...this.querySelectorAll(no)]}#d(e){const t=Array.from(e,e=>[...e.addedNodes]).flat();if(!1===t.some(e=>e.tagName?.toLowerCase()===no))return;const r=t.findLast(e=>e.tagName?.toLowerCase()===no&&!0===e.hasAttribute("selected"))??this.#a,o=this.#p();for(const e of o)e.removeAttribute("selected");this.selectedIndex=o.indexOf(r),this.updatePreview()}constructor(){super(),this.#e=this.attachShadow({mode:"closed",delegatesFocus:!0}),this.#e.append(oo()),this.#c=this.#e.querySelector("slot[name=selected]"),this.#l=this.#e.querySelector("ws-popover"),this.#u=this.#e.querySelector("value-display"),this.#l.sizeTarget=this,this.removeAttribute("open"),this.display=document.createElement("ws-display"),this.display.slot="display"}connectedCallback(){this.insertBefore(this.display,this.firstChild),this.updatePreview(),this.tabIndex=this.getAttribute("tabindex")??"0";const e=new MutationObserver(this.#d.bind(this));e.observe(this,{childList:!0,subtree:!0}),this.#i=e,this.role="combobox",this.addEventListener("click",()=>{this.open(),this.#u.focus()},{passive:!0}),this.#l.addEventListener("close",()=>this.close()),this.#l.addEventListener("pointerdown",e=>e.preventDefault()),this.#l.addEventListener("click",e=>{e.stopPropagation(),e.preventDefault()}),this.#e.querySelector("slot[name='options']").addEventListener("pointerdown",e=>e.preventDefault()),this.#e.querySelector("slot[name='options']").addEventListener("click",e=>{e.stopPropagation(),e.preventDefault();const t=e.target.tagName?.toLowerCase();"ws-option"===t&&(this.selectedIndex=this.#p().indexOf(e.target),this.close(),this.dispatchEvent(new Event("change",{bubbles:!0})),this.dispatchEvent(new Event("input",{bubbles:!0})))})}disconnectedCallback(){this.#i.disconnect()}get value(){return this.#n}set value(e){if(this.#n=e,null===e)return void(this.selectedIndex=-1);const t=this.#p(),r=t.find(t=>t.value===e||t.getAttribute("value")===e);this.selectedIndex=t.indexOf(r)}get selectedIndex(){return this.#s}set selectedIndex(e){this.#a?.removeAttribute("selected");const t=this.#p(),r=Math.min(e,t.length);this.#a=t[r]??null,this.#s=r,this.#a?.setAttribute("selected",""),this.#n=this.#a?.value??this.#a?.getAttribute("value")??this.#n,this.updatePreview()}updatePreview(){const e=this.querySelector("[slot=selected]")??this.#c;this.display.innerHTML=e.innerHTML,this.display.querySelector("ws-selected").innerHTML=this.#a?.getAttribute("preview")??this.#a?.innerHTML??this.getAttribute("blank")??"No Selection"}toggle(){null!==this.getAttribute("open")?this.close():this.open()}open(){this.setAttribute("open","");const e=this.querySelector("ws-options")??this.#e.querySelector("ws-options"),t=e.getBoundingClientRect();e.style.setProperty("--opt-h",`${t.height}px`),e.style.setProperty("--opt-w",`${t.width}px`),this.#l.show(),e.scrollTop=0,this.#a?.scrollIntoView()}close(){this.removeAttribute("open"),this.#l.hide()}__childValueMatch(e){const t=this.#p().indexOf(e);this.selectedIndex=t}}),Hr("ws-surface")` @color:@mono; ${Kr("@layer-surface","@layer-border")} r:@base-radius; over:hidden; bg.c:@c1; b.c:@c2; disp:grid; gr.cols:1fr; gr.rows:1fr; `,Hr("table[data-ws]")` @color:@primary; *border-collapse:separate; *border-spacing:0px; b.s:solid; b.c:hsl(@color, @layer-border); b.b.w:1px; ! & th { bg.c:hsl(@color, @layer-container); } ! & :is(th, td:not(:empty)) { b.s:solid; b.c:hsl(@color, @layer-border); b.b.w:1px; p:4px; } ! & tbody tr:last-child :is(td, th) { b.b.w:0px; } ! &[sticky-header] thead { pos.stick; y:0px; z:+2; } ! &[sticky-header] th:first-child { pos.stick; z:+1; x:0px; -x:0px; } `,Hr("ws-text")` ! &[title] { t.sz:@text-size-title; disp:flex; fl.dir:column; p:0px 8px; fl.cross:start; fl.main:center; } ! &[header] { t.sz:@text-size-header; disp:flex; fl.dir:column; p:0px 8px; fl.cross:start; fl.main:center; } ! &[subtitle] { disp:inline-block; t.sz:@text-size-subtitle; p:0px 8px; } ! &[info] { disp:inline-block; t.sz:@text-size-info; } `,Hr("ws-tabs")` @color:@primary; ${Kr("@layer-element","@layer-fill","@layer-border")} disp:grid; gr.cols.a:1fr; gr.rows.a:1fr; gr.flow:column; *user-select:none; gap:4px; `,Hr("label[tab]")` @fill:transparent; @text:@c1; @active:@c1; bg.c:@fill; t.c:@text; grid; gr.cols:1fr; gr.rows:min-content 2px; gr.areas:"content" "border"; pos:relative; ! & > input[type="radio"] { hide; } ! & > :where(*) { area:content; flex; fl.cn; p:8px; } ! &::before { *content:""; pos:absolute; -y:0px; x:0px; w:100%; h:2px; area:border; } ! &:has(input[type="radio"]:checked) { @fill:var(--fill-color, transparent); @text:var(--text-color, @c1); @active:unset; ! &::before { bg.c:@c1; } } ${Gr} `,Hr("ws-titlebar")` @border-size:2px; @color:@primary; @text-color:initial; @fill-color:initial; ${Kr("@layer-element","@layer-fill","@layer-border")} layout.3col-controls; h.min:52px; *user-select:none; pos:relative; p:0px 2px; t.c:@text; bg.c:@fill; b.y:@border-size solid @border; `,Hr("ws-toast")` @color:@primary; t.c:@page-text-color; bg.c:hsl(@color, @layer-surface); pos:relative; disp:inline-grid; gr.cols:auto 1fr auto; gr.areas:"start content end"; r:@base-radius; *user-select:none; b:2px solid hsl(@color, @layer-element); h.min:32px; z:+0; ! & > :where(*) { area:content; } ! &::before, &::after { *content:""; w.min:20px; bg.c:hsl(@color, @layer-element); z:-1; } ! &::before { area:start; } ! &::after { area:end; } ! & > [notif-text] { disp:flex; fl.dir:column; fl.main:center; p:4px; } ! & > :not([notif-text]) { t.c:hsl(@mono, @layer-fill); @color:inherit; var.fill; } `,Hr("ws-toaster")` pos:fixed; z:var(--z-notif); disp:grid; gr.cols:fr; p:0px; gap:8px; h:min-content; w:280px; ! &[pos^="top-"] { y:20px; } ! &[pos^="center-"] { y:50%; tf:translateY(-50%); } ! &[pos^="bottom-"] { -y:20px; } ! &[pos$="-left"] { x:20px; } ! &[pos$="-center"] { x:50%; tf:translateX(-50%); } ! &[pos$="-right"] { -x:20px; } `,Fr("square-dashed","square-check-filled","circle","circle-check-filled","circle-filled");const so=' @color:var(--toggle-color, @primary); @size:20px; @core-color:hsl(@color, @layer-element); pos:relative; w:@size; h:@size; appr:none; m:0px; t.c:@core-color; v.a:middle; ! &::after { *content:""; pos:absolute; t.sz:calc(@size - 2px); *speak:none; t.st:normal; t.wt:400; t.var:normal; t.tf:none; y:50%; x:50%; w:@size; h:@size; tf:translate(-50%, -50%); disp:flex; fl.cross:center; fl.main:center; over:hidden; } ';Hr(":where(input[data-ws][type=checkbox]:not([switch]))")` ${so} ! &::after { font:ws-icon-square-dashed; *content:"square-dashed"; } ! &:checked::after { font:ws-icon-square-check-filled; *content:"square-check-filled"; } `,Hr(":where(input[data-ws][type=radio])")` ${so} ! &::after { font:ws-icon-circle; *content:"circle"; } ! &:checked::after { font:ws-icon-circle-check-filled; *content:"circle-check-filled"; } `,Hr(":where(input[data-ws][type=checkbox][switch])")` @color:@primary; @size:20px; @anim-time:100ms; appr:none; m:0px; pos:relative; w:calc(@size * 2); h:@size; v.a:middle; ! &::before { *content:""; pos:absolute; inset:calc(@size / 4); b:1px solid @color; r:calc(@size / 2); bg.c:hsl(@color, @layer-element); o:0.5; tr:background-color @anim-time linear; } ! &::after { *content:""; pos:absolute; w:@size; h:@size; y:0px; x:0px; tr:left @anim-time linear, background-color @anim-time linear; bg.c:hsl(@mono, @layer-element); r:@size; } ! &:checked::after { x:@size; bg.c:hsl(@color, @layer-element); } `,Hr("label[data-ws][toggle]")` @color:@primary; @active:@mono; pos:relative; *user-select:none; over:hidden; b:0px solid hsl(@color, @layer-border); bg.c:hsl(@active, @layer-container); r:@base-radius; p:4px; disp:flex; fl.main:space-between; ! &:focus-within { @active:@color; } ! & > input { @color:inherit; ! &:focus { outln:none; } } ! &:has(:not(button):disabled) { *filter:saturate(50%) brightness(0.7); } `,Hr("ws-tooltip")` @color:@mono; pos.rel; disp:inline-grid; ! &[pos]:hover::before { *content:attr(text); pos.abs; p:4px; bg.c:hsl(@color, @layer-container); b:1px solid hsl(@color, @layer-border); t.ws:nowrap; r:4px; z:+1; } ! &[pos="top"]:hover::before { -y:calc(100% + 8px); x:50%; tf:translateX(-50%); } ! &[pos="bottom"]:hover::before { y:calc(100% + 8px); x:50%; tf:translateX(-50%); } ! &[pos="left"]:hover::before { -x:calc(100% + 8px); y:50%; tf:translateY(-50%); } ! &[pos="right"]:hover::before { x:calc(100% + 8px); y:50%; tf:translateY(-50%); } `;const ao={},io=e=>{const t=(e=>{if(""===e||null===e||"true"===e)return;const t=Nr(Cr({raw:[e]})),r=(e=>{let t=5381;for(let r=0;r<e.length;r+=1)t=33*t^e.charCodeAt(r);return t.toString(36)})(t.join("\n"));if(ao[r]=(ao[r]??0)+1,ao[r]>1)return r;const o=t.map(e=>e.replaceAll("&",`[data-wsid="${r}"]`));return Er.sheet.insertRule(`@layer ws.element { ${o.join("\n")} }`,Er.sheet.cssRules.length),r})(e.dataset?.ws?.trim()??"");void 0!==t?e.dataset.wsid=t:delete e.dataset?.wsid};new MutationObserver(e=>{const t=new Set(Array.from(e,e=>[e.target,...Array.from(e.addedNodes,e=>[e,...e.querySelectorAll?.("*")||[]])]).flat(3));for(const e of t)io(e)}).observe(document.body,{subtree:!0,attributes:!0,childList:!0,attributeFilter:["data-ws"]});for(const e of document.querySelectorAll("*"))io(e);var lo=Object.freeze({__proto__:null,component:(e,t="ws.user")=>Hr(e,t),macro:jr,pageis:Vr,preloadIcons:Fr,version:qr,x:Ir});const co=()=>({}),uo=(e,t=co)=>(r,...o)=>{const n=e.wsPass??"ws",s=nr();jr(s)(r,...o);const a=function(e){function t(t){var r=be({},t);return delete r.ref,e(r,t.ref||null)}return t.$$typeof=ke,t.render=e,t.prototype.isReactComponent=t.__f=!0,t.displayName="ForwardRef("+(e.displayName||e.name)+")",t}((r,o)=>{const a=t?.(r)??{},{[n]:i,...l}={...r,...a},c=`${s}; ${i??""}`.trim();return or(e,{[n]:c,ref:o,...l})});return Object.defineProperty(a,"name",{value:`Wrapped(${e.name??e})`}),a},po=uo("ze-adorn")`
|
|
2
|
+
adorn;
|
|
3
|
+
`,fo=e=>or("ws-modal",{...e}),ho=Symbol("dialog none"),_o=e=>{const{persistent:t,dialog:r,onclose:o,dialogWS:n,...s}=e;return or(fo,{open:!0,managed:!0,persistent:t,onclose:o},or("ws-dialog",{ws:n},or(ur,{"*render":r,...s})))};_o.none=ho;const mo=It({stack:[]}),go=e=>{const{stack:t}=pr(mo),r=t.map(e=>or(_o,{...e}));return or(zr,{},r)};_o.show=e=>new Promise(t=>{if(mo.stack.length>3)return;const{dialog:r,...o}=e,n=sr(),s=e=>{mo.stack=mo.stack.filter(e=>e.key!==n),t(e)};mo.stack.push(ar({$animate:[gr(100),vr(100)],...o,onclose:e=>{s(_o.none),o.onclose?.(e)},close:s,dialog:r,key:n}))});const bo=e=>or("ws-flex",{...e}),vo=e=>or("ws-grid",{...e}),yo=e=>{const{children:t,slot:r,layout:o=null,ws:n="",...s}=e;return or("ws-surface",{...s,ws:`${null===o?"disp: grid; gr.areas: 'content'; layout.base;":`layout.${o};`} ${n}`},t,Object.entries(r)?.map(e=>[or("ze-surface-slot",{ws:`grid; area: ${e[0]};`},or(ur,{"*render":e[1]}))])??[])},wo=e=>or(yo,{"ze-card":!0,...e,layout:"3row-controls"}),xo=e=>{const{ws:t="",...r}=e;return or("button",{ws:t,...r})},ko=e=>{const{name:t,...r}=e;return or("ws-icon",{"data-icon":t,...r})},$o=e=>{const{children:t,dismiss:r,...o}=e;return or("ws-toast",{...o},or("div",{ws:"grid;","notif-text":!0},t),or(xo,{ws:"area: end;",onclick:r},or(ko,{name:"x"})))},zo=It({topLeft:[],centerLeft:[],bottomLeft:[],topRight:[],centerRight:[],bottomRight:[],topCenter:[],bottomCenter:[]}),Ao=[["topLeft","top-left"],["centerLeft","center-left"],["bottomLeft","bottom-left"],["topRight","top-right"],["centerRight","center-right"],["bottomRight","bottom-right"],["topCenter","top-center"],["bottomCenter","bottom-center"]],So=e=>{const t=pr(zo),r=Ao.map(e=>{const[r,o]=e,n=t[r].map(e=>{const{key:t,content:r,...o}=e;return or($o,{key:t,...o},r)});return or("ws-toaster",{pos:o,key:r},or(zr,{},n))});return or("ze-toasters",{},r)},Eo=Symbol("toaster timeout");So.show=e=>{const{pos:t,timeout:r=5e3,...o}=e,n=sr(),s=e=>{clearTimeout(a),zo[t]=zo[t].filter(e=>e.key!==n),e!==Eo&&o.ondismiss?.()},a=setTimeout(()=>s(Eo),r);zo[t].push(ar({$animate:[gr(100)],...o,dismiss:s,key:n}))};const Co=e=>{const{ws:t="",layout:r=null,theme:o,children:n}=e;return document.body.dataset.ws=`#theme.${o}; ${t}`,or(k,{},or(yo,{layout:r,ws:"r: 0px;","data-app-surface":!0},n),or(go,{}),or(So,{}))},Po=e=>or("ws-circle-spinner",{...e}),Mo=e=>{const{ws:t="",labelWS:r,slot:o,children:n,...s}=e;return or("label",{control:!0,ws:t,...s},o.label?[or("ws-text",{"label-text":!0,ws:r},or(ur,{"*render":o.label}))]:[],n,o.start?[or("ze-input-start",{ws:"area: start; grid;"},or(ur,{"*render":o.start}))]:[],o.end?[or("ze-input-end",{ws:"area: end; grid;"},or(ur,{"*render":o.end}))]:[],o.extra?[or("ze-input-extra",{ws:"area: extra; grid;"},or(ur,{"*render":o.extra}))]:[])},Lo=uo("ze-data-table")`
|
|
4
|
+
pos.rel;
|
|
5
|
+
grid;
|
|
6
|
+
gr.cols: 1fr;
|
|
7
|
+
gr.rows: 1fr min-content;
|
|
8
|
+
p: 0px;
|
|
9
|
+
h: 100%;
|
|
10
|
+
w: 100%;
|
|
11
|
+
h.max: 100%;
|
|
12
|
+
w.max: 100%;
|
|
13
|
+
|
|
14
|
+
! & :where(thead, tbody) {
|
|
15
|
+
w: "100%";
|
|
16
|
+
}
|
|
17
|
+
! & thead > tr {
|
|
18
|
+
h: @header;
|
|
19
|
+
z: +5;
|
|
20
|
+
pos.rel: true;
|
|
21
|
+
}
|
|
22
|
+
! & tbody > tr {
|
|
23
|
+
h: @row;
|
|
24
|
+
}
|
|
25
|
+
`,Oo=uo("ze-data-scroller")`
|
|
26
|
+
pos.rel;
|
|
27
|
+
over: auto;
|
|
28
|
+
! &::before {
|
|
29
|
+
*content: "";
|
|
30
|
+
pos.abs;
|
|
31
|
+
w: 1px;
|
|
32
|
+
h: 1px;
|
|
33
|
+
y: calc(@h - 1px);
|
|
34
|
+
}
|
|
35
|
+
`,jo=uo("ze-fake-scroll")`
|
|
36
|
+
disp: block;
|
|
37
|
+
w: 100%;
|
|
38
|
+
h: @h;
|
|
39
|
+
pos.stick;
|
|
40
|
+
y: 0px;
|
|
41
|
+
over: hidden;
|
|
42
|
+
`,No=uo("ze-data-footer")`
|
|
43
|
+
pos: rel;
|
|
44
|
+
grid;
|
|
45
|
+
`,Ho=uo("tbody")`
|
|
46
|
+
tf: translateY(@p);
|
|
47
|
+
`,To=Symbol("empty row"),Ro=Symbol("null row"),Wo=e=>{const{keys:t}=e;return or("tr",{},t?.map(e=>[or("th",{},e)])??[])},Do=e=>{const{item:t,keys:r}=e;return or("tr",{},r?.map(e=>[or("td",{},t[e])])??[])},Uo=e=>{const{show:t}=e;return or("div",{ws:"flex; fl.cn; h.min: 32px; gap: 4px;"},or("div",{},`Showing: ${t.start} - ${t.end} of ${t.total}`))},Fo=e=>{const{rowSize:t=30,headerSize:r=t,slot:o,ws:n,tableWS:s="",data:a}=e,i=dr({scrollPos:0,scrollMax:null,containerHeight:null,container:null,scrollWidth:0}),l=e=>{i.scrollPos=i.container.scrollTop},c=hr(()=>Object.keys(a?.[0]??{}),[a]),u=`@h: ${t*a.length+r}px; @header: ${r}px; @row: ${t}px;`,p=hr(()=>(e=>{const{scrollPos:t,scrollMax:r,rowSize:o,length:n,containerHeight:s}=e;if(null===r)return[0,0];const a=Math.ceil(s/o)-1,i=Math.floor(t/r*(n-a));return[i-1,i+a+1,a+2]})({scrollPos:i.scrollPos,scrollMax:i.scrollMax,containerHeight:i.containerHeight,rowSize:t,length:a.length}),[i.scrollPos,i.scrollMax,i.containerHeight,t,a.length]);le(()=>{i.containerHeight=i.container.clientHeight,i.scrollMax=i.container.scrollHeight-i.containerHeight,i.container.addEventListener("scroll",l,{passive:!0});const e=new ResizeObserver(()=>{i.containerHeight=i.container.clientHeight,i.scrollMax=i.container.scrollHeight-i.containerHeight,i.scrollWidth=i.container.scrollWidth});return e.observe(i.container),()=>e.unobserve(i.container)},[]);p[2];const d=hr(()=>((e,t)=>{const r=e.slice(Math.max(t[0],0),t[1]);return-1===t[0]?[To,...r]:r.length<t[2]?[...r,...Array.from({length:t[2]-r.length},()=>Ro)]:r})(a,p),[a,p]),f=hr(()=>({start:Math.max(1,p[0]+2),end:Math.min(a.length,p[1]-1),total:a.length}),[p,a.length]);a.length;const h=p[0]*t-i.scrollPos,_=o.row??Do,m=o.header??Wo,g=o.footer??Uo;return or(Lo,{ws:n},or(Oo,{ref:fr(e=>i.container=ar(e)),ws:u},or(jo,{ws:`@h: ${i.containerHeight}px;`},or("table",{ws:`w: 100%; *table-layout: fixed; ${s}`},or("thead",{},a?.length>0?[or(m,{keys:c})]:[or("tr",{},or("td",{},"N/A"))]),or(Ho,{style:`--p: ${h}px;`},lr(d?.map((e,t)=>[or(_,{item:e,keys:c,key:t})])??[],()=>[or("tr",{},or("td",{},"No Items"))]))))),or(No,{},or(g,{show:f,displayedRows:d})))},Io=e=>{const{summaryWS:t,children:r,slot:o,ws:n="",...s}=e;return or("details",{ws:n,...s},or("summary",{ws:t},or(ur,{"*render":o.label})),r)},qo=e=>{const{size:t=null,notif:r,...o}=e,n={...o,...null===t?{}:{[t]:""},"notif-text":!0===r?"":void 0};return or("ws-text",{...n})},Vo=e=>{const{ws:t,children:r,slot:o,...n}=e;return or("ws-titlebar",{ws:t,...n},void 0!==o.menu?[or("ze-menu",{ws:"flex; area: menu;"},or(ur,{"*render":o.menu}))]:[],r,void 0!==o.action?[or("ze-action",{ws:"flex; area: action;"},or(ur,{"*render":o.action}))]:[])},Zo="raised; var.outln; @color: @info; layout.3row-controls;",Bo=e=>{const{close:t,message:r,title:o="Alert",ok:n="Ok",style:s,onanimationend:a}=e,i=()=>t(!0);return or(yo,{layout:"3row-controls",ws:Zo,style:s,onanimationend:a,"slot:header":()=>[or(Vo,{ws:"@color: @info;"},or(qo,{title:!0},o))],"slot:footer":()=>[or(vo,{ws:"p: 4px;"},or(xo,{onclick:i,ws:"@color: @success;"},n))]},or(bo,{},or(ur,{"*render":r})))},Yo=e=>{const{close:t,message:r,title:o="Confirm",ok:n="Ok",cancel:s="Cancel",style:a,onanimationend:i}=e,l=()=>t(!0),c=()=>t(!1);return or(yo,{layout:"3row-controls",ws:Zo,style:a,onanimationend:i,"slot:header":()=>[or(Vo,{ws:"@color: @info;"},or(qo,{title:!0},o))],"slot:footer":()=>[or(vo,{ws:"p: 4px; gr.cols: 1fr 1fr;"},or(xo,{onclick:c,ws:"@color: @error;"},s),or(xo,{onclick:l,ws:"@color: @success;"},n))]},or(k,{},r))},Xo=e=>{const{close:t,message:r,placeholder:o="",title:n="Prompt",ok:s="Ok",cancel:a="Cancel",style:i,onanimationend:l}=e,c=dr({text:"",input:null}),u=()=>t(c.text),p=()=>t(!1),d=e=>{e.preventDefault(),u(c.text)};return le(()=>{c.input.focus()},[]),or(yo,{layout:"3row-controls",ws:Zo,style:i,onanimationend:l,"slot:header":()=>[or(Vo,{ws:"@color: @info;"},or(qo,{title:!0},n))],"slot:content":()=>[or("form",{onsubmit:d},or(bo,{},or(Mo,{label:r,ws:"var.lined; r: 0px;"},or("input",{type:"text",placeholder:o,$$value:{value:c.text,update:e=>c.text=ir(e.target)},ref:fr(e=>c.input=ar(e))}))))],"slot:footer":()=>[or(vo,{ws:"p: 4px; gr.cols: 1fr 1fr;"},or(xo,{onclick:p,ws:"@color: @error;"},a),or(xo,{onclick:u,ws:"@color: @success;"},s))]})};Bt["ws-modal.open"]="close",Kt("ws-modal",()=>!1);const Ko=[gr(175),$r(175)],Go=e=>{const{"inline-desktop":t,key:r,onclose:o,...n}=e;return or(fo,{"inline-desktop":t,key:r,open:!0,managed:!0,onclose:o},or("ws-drawer",{...n}))},Jo=e=>{const{open:t,$$open:r,onclose:o,...n}=e,s=hr(()=>sr());return or(zr,{},!0===(!0===t||!0===r?.value)?[or(Go,{key:s,$animate:Ko,...n,onclose:r?.update??o})]:[])},Qo=e=>or("ws-hexagon-spinner",{...e}),en=e=>{const{ws:t="",...r}=e;return or("a",{ws:t,...r})},tn=e=>{const{content:t,overlay:r,ws:o="",...n}=e,s=dr({popover:null});return or("ws-popover",{ws:o,...n,ref:fr(e=>s.popover=ar(e))},or(ur,{"*render":t,show:()=>s.popover.show()}),or("ze-popover-overlay",{slot:"popover"},or(ur,{"*render":r,hide:()=>s.popover.hide()})))},rn=e=>or("ws-progress",{...e}),on=e=>or("ws-option",{...e}),nn=e=>or("ws-optgroup",{...e}),sn=e=>e.map(e=>void 0!==e.group?or(nn,{label:e.group},sn(e.items)):or(on,{value:e.value},e.label)),an=e=>{let{options:t,children:r,selected:o,...n}=e;const s=hr(()=>!0===Array.isArray(t)?sn(t):r,[r,t]),a=hr(()=>{if(void 0!==o){return or("div",{slot:"selected"},or(o,{}))}return null},[o]);return or("ws-select",{...n},a,s)},ln=(e,t)=>{const r=Object.keys(t).reduce((e,r)=>(!1===t[r]instanceof Promise||(e[r]=t[r]),e),{});if(!1===((e=null,t=null)=>{if(null===e||null===t)return!0;const r=Object.keys(e),o=Object.keys(t),n=r.find(e=>!1===o.includes(e))||o.find(e=>!1===r.includes(e));if(void 0!==n)return!0;for(const o of r)if(t[o]!==e[o])return!0;for(const r of o)if(t[r]!==e[r])return!0;return!1})(e.prev,r))return;const o=Object.keys(r),n=Promise.all(o.map(async e=>[e,await r[e]]));n.keep=!0,n.then(t=>{!1!==n.keep&&(e.resolved=ar(Object.fromEntries(t)))}),e.promise.keep=!1,e.promise=ar(n),e.resolved=null,e.prev=r},cn=new Map,un=e=>{if(!0===cn.has(e))return cn.get(e);const t=t=>{const r=dr({promise:{},prev:{},resolved:null});if(ln(r,t),null!==r.resolved)return or(e,{...t,...r.resolved});const o=r.loading??null;return null===o?or("div",{},"Loading"):or(o,{})};return cn.set(e,t),t},pn=e=>{const{keys:t}=e;return or("tr",{},t?.map(e=>[or("th",{},e)])??[])},dn=e=>{const{item:t,keys:r}=e;return or("tr",{},r?.map(e=>[or("td",{},t[e])])??[])},fn=e=>{const{data:t,slot:r,sticky:o,ws:n="",...s}=e,{header:a=pn,row:i=dn}=r,l=hr(()=>Object.keys(t?.[0]??{}),[t]);return or("table",{ws:n,"stick-header":!0===o,...s},or("thead",{},t?.length>0?[or(ur,{"*render":a,keys:l})]:[or("tr",{},or("th",{},"N/A"))]),or("tbody",{},lr(t?.map((e,t)=>[or(ur,{"*render":i,item:e,keys:l,rowNum:t})])??[],()=>[or("tr",{},or("td",{},"No Items"))])))},hn=e=>{const{ws:t="",children:r,...o}=e;return or("label",{toggle:!0,ws:t,...o},r)},_n=e=>or("ws-tooltip",{...e});export{po as Adorn,Bo as Alert,Co as App,xo as Button,wo as Card,Po as CircleSpinner,Yo as Confirm,Mo as ControlLabel,Fo as DataTable,Io as Details,_o as Dialog,go as DialogStack,Jo as Drawer,or as Element,bo as Flex,k as Fragment,vo as Grid,Qo as HexSpinner,ko as Icon,en as Link,fo as Modal,nn as Optgroup,on as Option,tn as Popover,rn as Progress,Xo as Prompt,an as Select,ur as Slot,yo as Surface,fn as Table,qo as Text,Vo as Titlebar,$o as Toast,So as Toaster,hn as ToggleLabel,_n as Tooltip,zr as Transitions,lr as __eachAlt,mr as animation,hr as calc,V as cloneElement,Z as createContext,br as drop,gr as fade,ir as getInputValue,qt as getVersion,dr as localState,fr as lock,we as memo,Gt as options,vr as pop,t as preactOptions,It as proxy,sr as randKey,nr as randName,ar as ref,q as renderApp,$t as renderString,pr as sharedState,wr as slideBottom,$r as slideLeft,yr as slideTop,Zt as snapshot,kr as spinCW,uo as style,Vt as subscribe,un as suspend,ue as useContext,le as useEffect,ce as useMemo,ie as useState,xr as visible,lo as wind};
|
package/package.json
CHANGED
|
@@ -1,48 +1,50 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@axel669/zephyr",
|
|
3
|
-
"version": "1.0.0-
|
|
4
|
-
"description": "",
|
|
5
|
-
"main": "
|
|
6
|
-
"
|
|
7
|
-
|
|
8
|
-
"
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
"
|
|
13
|
-
"
|
|
14
|
-
"
|
|
15
|
-
"dependencies": {
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
},
|
|
19
|
-
"devDependencies": {
|
|
20
|
-
"@axel669/
|
|
21
|
-
"@axel669/
|
|
22
|
-
"@
|
|
23
|
-
"@
|
|
24
|
-
"@rollup/plugin-
|
|
25
|
-
"@rollup/plugin-terser": "^0.
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
"
|
|
29
|
-
"
|
|
30
|
-
"
|
|
31
|
-
"rollup": "^
|
|
32
|
-
"
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
"
|
|
38
|
-
|
|
39
|
-
"exports": {
|
|
40
|
-
".": "./
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
"
|
|
44
|
-
"
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
1
|
+
{
|
|
2
|
+
"name": "@axel669/zephyr",
|
|
3
|
+
"version": "1.0.0-dev.0",
|
|
4
|
+
"description": "",
|
|
5
|
+
"main": "index.js",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"build": "rollup -c lib/rollup.config.js",
|
|
8
|
+
"build.test": "rollup -c test/rollup.config.js"
|
|
9
|
+
},
|
|
10
|
+
"keywords": [],
|
|
11
|
+
"author": "",
|
|
12
|
+
"license": "ISC",
|
|
13
|
+
"packageManager": "pnpm@10.9.0",
|
|
14
|
+
"type": "module",
|
|
15
|
+
"dependencies": {
|
|
16
|
+
"fs-jetpack": "^5.1.0",
|
|
17
|
+
"prettier": "^3.9.4"
|
|
18
|
+
},
|
|
19
|
+
"devDependencies": {
|
|
20
|
+
"@axel669/rollup-html-input": "^0.1.2",
|
|
21
|
+
"@axel669/windstorm": "1.0.0-beta.9",
|
|
22
|
+
"@rollup/plugin-commonjs": "^29.0.3",
|
|
23
|
+
"@rollup/plugin-node-resolve": "^16.0.3",
|
|
24
|
+
"@rollup/plugin-replace": "^6.0.3",
|
|
25
|
+
"@rollup/plugin-terser": "^1.0.0",
|
|
26
|
+
"peggy": "^5.1.0",
|
|
27
|
+
"preact": "10.29.3",
|
|
28
|
+
"preact-render-to-string": "6.7.0",
|
|
29
|
+
"preact-transitioning": "^1.5.3",
|
|
30
|
+
"rolldown": "1.1.5",
|
|
31
|
+
"rollup": "^4.62.2",
|
|
32
|
+
"valtio": "2.3.2"
|
|
33
|
+
},
|
|
34
|
+
"imports": {
|
|
35
|
+
"#core": "./lib/main.js",
|
|
36
|
+
"#styled": "./lib/styled.js",
|
|
37
|
+
"#state/*": "./test/state/*.js"
|
|
38
|
+
},
|
|
39
|
+
"exports": {
|
|
40
|
+
".": "./dist/zephyr.min.js",
|
|
41
|
+
"./dev": "./dist/zephyr.js",
|
|
42
|
+
"./unstyled": "./dist/zephyr-unstyled.min.js",
|
|
43
|
+
"./unstyled-dev": "./dist/zephyr-unstyled.js",
|
|
44
|
+
"./rollup": "./compiler/rollup.js"
|
|
45
|
+
},
|
|
46
|
+
"files": [
|
|
47
|
+
"compiler",
|
|
48
|
+
"dist/"
|
|
49
|
+
]
|
|
50
|
+
}
|
package/readme.md
CHANGED
|
@@ -1,26 +1,201 @@
|
|
|
1
1
|
# Zephyr
|
|
2
|
-
Zephyr is a
|
|
3
|
-
|
|
2
|
+
Zephyr is a component suite with extension to the JSX syntax, built on top of
|
|
3
|
+
preact and valtio.
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
## Syntax Extensions
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
7
|
+
### Short Closing Tags
|
|
8
|
+
`<//>` can be used to close any tag without repeating its name. This is most
|
|
9
|
+
useful with the Extended Tag Names that Zephyr also allows.
|
|
10
|
+
```jsx
|
|
11
|
+
const div = <div>Content<//>
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
### Extended Tag Names
|
|
15
|
+
Tag names can have the usual html tags and dot notation (thing.component), but
|
|
16
|
+
Zephyr also allows function calls as tag names. The normal rules apply for the
|
|
17
|
+
standard tags (capitalized single words are interpreted as component functions),
|
|
18
|
+
and the function return syntax is always treated as that.
|
|
12
19
|
|
|
13
|
-
|
|
14
|
-
|
|
20
|
+
```jsx
|
|
21
|
+
// Allowed
|
|
22
|
+
<div />
|
|
23
|
+
<custom-tag />
|
|
24
|
+
<Component />
|
|
25
|
+
<zephyr.Button />
|
|
26
|
+
<zephyr.Suspend(Thing) />
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
### Fragments
|
|
30
|
+
Preact Fragments are usable using the `Fragment` component, but the normal
|
|
31
|
+
shorthand is not allowed. `<>` is nice until someone filled in a placeholder
|
|
32
|
+
and forgot to go back and put the component they intended. To fix this, Zephyr
|
|
33
|
+
uses `<#frag>` for fragment opening tags, so that its always clear a fragment
|
|
34
|
+
was the intention at that point. The `key` prop is still supported as normal.
|
|
35
|
+
```jsx
|
|
36
|
+
const fragment = (
|
|
37
|
+
<#frag>
|
|
38
|
+
Content
|
|
39
|
+
<//>
|
|
40
|
+
)
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
### on:X Event Props
|
|
44
|
+
Zephyr allows `on:X` in addition to `onX` for event handler props, because I
|
|
45
|
+
like the syntax with the colon in it. The transpiler will convert the `on:X`
|
|
46
|
+
props at transpile time, so they will arrive as their `onX` version during
|
|
47
|
+
runtime.
|
|
48
|
+
```jsx
|
|
49
|
+
<input on:input={handler} />
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
### #effect
|
|
53
|
+
The function call of useEffect bothers me because of the added indentation so
|
|
54
|
+
Zephyr transpiles `#effect [...items] {}` blocks into the useEffect function
|
|
55
|
+
setup that is required, but it looks nicer in the file.
|
|
56
|
+
```js
|
|
57
|
+
const Component = (props) => {
|
|
58
|
+
#effect [props.thing] {
|
|
59
|
+
// do effect stuff here
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
```
|
|
15
63
|
|
|
16
|
-
|
|
17
|
-
|
|
64
|
+
### {prop} Shorthand
|
|
65
|
+
Props that use the same name as the variable they are pulling from can be sent
|
|
66
|
+
to components by just saying `{<name>}` just like in Svelte.
|
|
67
|
+
```jsx
|
|
68
|
+
<Component {prop} another={value} />
|
|
18
69
|
```
|
|
19
70
|
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
71
|
+
### $$props
|
|
72
|
+
Adding event listeners separetely from the values they are working with can get
|
|
73
|
+
annoying fast, so Zephyr allows a shorthand to set both values in one prop
|
|
74
|
+
using a single object (which also has its own shorthand).
|
|
75
|
+
|
|
76
|
+
Props starting with "`$$`" need to take in values that are objects of the form
|
|
77
|
+
`{ value, update }`. Zephyr will pass the prop through the components under the
|
|
78
|
+
`$$<name>` prop, and will automatically expand it when the prop is sent to an
|
|
79
|
+
html element, so that wrapper components can modify or use them as needed.
|
|
80
|
+
|
|
81
|
+
When the prop is sent to an html element, the `.value` is sent to the prop named
|
|
82
|
+
after the `$$`, and the `.update` is sent to the defined event handler. Custom
|
|
83
|
+
associations can be created for html elements adding to the `eventNames` mapping
|
|
84
|
+
that is exported by Zephyr. Additionally, the value that comes from the element
|
|
85
|
+
is processed and sent to the update function, and handle things like numeric
|
|
86
|
+
inputs and date inputs. Custom behavior can also be registered for this step
|
|
87
|
+
using the `registerInputValue` function.
|
|
88
|
+
|
|
89
|
+
Finally, when binding to a piece of valtio state, the value can start with a `#`
|
|
90
|
+
and it will automatically have an update function created that assigns back to
|
|
91
|
+
the value, so the case of tracking a value can be done with very little syntax.
|
|
92
|
+
|
|
93
|
+
```jsx
|
|
94
|
+
import * as zephyr from "@axel669/zephyr"
|
|
95
|
+
|
|
96
|
+
// this is defined in the library, but this is how it would look to create one
|
|
97
|
+
ze.eventNames["input.value"] = "input"
|
|
98
|
+
|
|
99
|
+
let thingValue = ""
|
|
100
|
+
const thingBind = {
|
|
101
|
+
get value() { return thingValue },
|
|
102
|
+
update(nextValue) {
|
|
103
|
+
thingValue = nextValue.toUpperCase()
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
// this will be expanded to:
|
|
107
|
+
// value={thingBind.value} oninput={thingBind.update}
|
|
108
|
+
const thing = <input type="text" $$value={thingBind} />
|
|
109
|
+
|
|
110
|
+
|
|
111
|
+
const state = ze.proxy({
|
|
112
|
+
text: ""
|
|
113
|
+
})
|
|
114
|
+
// this will be expanded to:
|
|
115
|
+
// value={state.text} oninput={(next) => state.text = next}
|
|
116
|
+
const thing2 = <input type="text" $$value={#state.text} />
|
|
117
|
+
```
|
|
118
|
+
|
|
119
|
+
### $: Render
|
|
120
|
+
If a tag starts with `$:` the underlying component will evaluate the variable
|
|
121
|
+
and render based on the result:
|
|
122
|
+
- `value === null || value === undefined` -> null
|
|
123
|
+
- `typeof value === "string"` -> renders the string as a string
|
|
124
|
+
- else -> renders as a component (and props can be passed)
|
|
125
|
+
```jsx
|
|
126
|
+
const things = [null, "string", zephyr.Button]
|
|
127
|
+
|
|
128
|
+
const items = (
|
|
129
|
+
<#frag>
|
|
130
|
+
// wont render anything (null)
|
|
131
|
+
<$:things[0] />
|
|
132
|
+
// renders "string" as text
|
|
133
|
+
<$:things[1] />
|
|
134
|
+
// renders the Button component
|
|
135
|
+
<$:things[2] />
|
|
136
|
+
<//>
|
|
137
|
+
)
|
|
138
|
+
```
|
|
139
|
+
|
|
140
|
+
### If
|
|
141
|
+
Conditionally renders and item. This can be done using the ternary operator
|
|
142
|
+
that react loves to have, but I think it looks better in the template, and
|
|
143
|
+
that's what this syntax allows.
|
|
144
|
+
|
|
145
|
+
Defined using the syntax `{#if <condition>}...{#else}...{#/}` with the else
|
|
146
|
+
block not being required.
|
|
147
|
+
```jsx
|
|
148
|
+
<div>
|
|
149
|
+
{#if Math.random() < 0.5)}
|
|
150
|
+
<span>Low Number<//>
|
|
151
|
+
{#else}
|
|
152
|
+
<span>High Number<//>
|
|
153
|
+
{#/}
|
|
154
|
+
<//>
|
|
155
|
+
```
|
|
156
|
+
|
|
157
|
+
### Each
|
|
158
|
+
Renders a list of items with an optional fallback if no items are in the source
|
|
159
|
+
list. Can be accomplished using the map function outside of the JSX, but like
|
|
160
|
+
the case with the `if` I think it's nicer to have it inside the template
|
|
161
|
+
sometimes.
|
|
162
|
+
|
|
163
|
+
Defined using the syntax `{#each <list> -> <map args>}...{#else}...{#/}`
|
|
164
|
+
```jsx
|
|
165
|
+
const list = [1, 2, 3, 4]
|
|
166
|
+
|
|
167
|
+
<#frag>
|
|
168
|
+
{#each list -> number, index}
|
|
169
|
+
<div>Item #{index}: {number}<//>
|
|
170
|
+
{#else}
|
|
171
|
+
<div>No items<//>
|
|
172
|
+
{#/}
|
|
173
|
+
<//>
|
|
174
|
+
```
|
|
175
|
+
|
|
176
|
+
### Slots
|
|
177
|
+
Slots function similar to how they work in Svelte. They can be defined inline
|
|
178
|
+
or using the `slot:<name>` props, and are always passed in a `slot` property
|
|
179
|
+
in component props.
|
|
180
|
+
|
|
181
|
+
Slots are defined inline using `{#slot <name>}...{#/}`
|
|
182
|
+
```jsx
|
|
183
|
+
const Component = (props) => {
|
|
184
|
+
return (
|
|
185
|
+
<div>
|
|
186
|
+
<props.slot.header />
|
|
187
|
+
{children}
|
|
188
|
+
<//>
|
|
189
|
+
)
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
const thing = (
|
|
193
|
+
<Component>
|
|
194
|
+
{#slot header}
|
|
195
|
+
<div>Header<//>
|
|
196
|
+
{#/}
|
|
197
|
+
|
|
198
|
+
Content
|
|
199
|
+
<//>
|
|
200
|
+
)
|
|
201
|
+
```
|
package/src/changed.svelte.js
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
// export const trackChanges = (initial) => {
|
|
2
|
-
// let current = initial
|
|
3
|
-
// return (next) => {
|
|
4
|
-
// if (next !== current) {
|
|
5
|
-
// current = next
|
|
6
|
-
// return true
|
|
7
|
-
// }
|
|
8
|
-
// return false
|
|
9
|
-
// }
|
|
10
|
-
// }
|
|
11
|
-
|
|
12
|
-
export const track = (...args) => {
|
|
13
|
-
let called = false
|
|
14
|
-
const f = args[args.length - 1]
|
|
15
|
-
const params = args.slice(0, -1)
|
|
16
|
-
$effect(() => {
|
|
17
|
-
if (called === false) {
|
|
18
|
-
called = true
|
|
19
|
-
return
|
|
20
|
-
}
|
|
21
|
-
f(...params)
|
|
22
|
-
})
|
|
23
|
-
}
|