@axel669/zephyr 1.0.0-beta.1 → 1.0.0-dev.1
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 +587 -0
- package/dist/zephyr-unstyled.min.js +1 -0
- package/dist/zephyr.js +2002 -0
- package/dist/zephyr.min.js +47 -0
- package/package.json +35 -33
- 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 -36
- 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/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 -40
- package/src/props.js +0 -24
- package/src/variant.js +0 -10
- package/src/wind.js +0 -4
- package/src/ws.js +0 -10
package/dist/zephyr.js
ADDED
|
@@ -0,0 +1,2002 @@
|
|
|
1
|
+
var n$1,l$3,u$3,i$3,r$3,o$3,e$2,f$3,c$3,a$3,s$3,h$3,p$3,v$3,y$3,d$3={},w$3=[],_$1=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i,g$3=Array.isArray;function m$3(n,l){for(var u in l)n[u]=l[u];return n}function b$2(n){n&&n.parentNode&&n.parentNode.removeChild(n);}function k$3(l,u,t){var i,r,o,e={};for(o in u)"key"==o?i=u[o]:"ref"==o?r=u[o]:e[o]=u[o];if(arguments.length>2&&(e.children=arguments.length>3?n$1.call(arguments,2):t),"function"==typeof l&&null!=l.defaultProps)for(o in l.defaultProps) void 0===e[o]&&(e[o]=l.defaultProps[o]);return x$3(l,e,i,r,null)}function x$3(n,t,i,r,o){var e={type:n,props:t,key:i,ref:r,__k:null,__:null,__b:0,__e:null,__c:null,constructor:void 0,__v:null==o?++u$3:o,__i:-1,__u:0};return null==o&&null!=l$3.vnode&&l$3.vnode(e),e}function S$1(n){return n.children}function C$3(n,l){this.props=n,this.context=l;}function $$2(n,l){if(null==l)return n.__?$$2(n.__,n.__i+1):null;for(var u;l<n.__k.length;l++)if(null!=(u=n.__k[l])&&null!=u.__e)return u.__e;return "function"==typeof n.type?$$2(n):null}function I$2(n){if(n.__P&&n.__d){var u=n.__v,t=u.__e,i=[],r=[],o=m$3({},u);o.__v=u.__v+1,l$3.vnode&&l$3.vnode(o),q$4(n.__P,o,u,n.__n,n.__P.namespaceURI,32&u.__u?[t]:null,i,null==t?$$2(u):t,!!(32&u.__u),r),o.__v=u.__v,o.__.__k[o.__i]=o,D$3(i,o,r),u.__e=u.__=null,o.__e!=t&&P$3(o);}}function P$3(n){if(null!=(n=n.__)&&null!=n.__c)return n.__e=n.__c.base=null,n.__k.some(function(l){if(null!=l&&null!=l.__e)return n.__e=n.__c.base=l.__e}),P$3(n)}function A$3(n){(!n.__d&&(n.__d=true)&&i$3.push(n)&&!H$2.__r++||r$3!=l$3.debounceRendering)&&((r$3=l$3.debounceRendering)||o$3)(H$2);}function H$2(){try{for(var n,l=1;i$3.length;)i$3.length>l&&i$3.sort(e$2),n=i$3.shift(),l=i$3.length,I$2(n);}finally{i$3.length=H$2.__r=0;}}function L$1(n,l,u,t,i,r,o,e,f,c,a){var s,h,p,v,y,_,g,m=t&&t.__k||w$3,b=l.length;for(f=T$3(u,l,m,f,b),s=0;s<b;s++)null!=(p=u.__k[s])&&(h=-1!=p.__i&&m[p.__i]||d$3,p.__i=s,_=q$4(n,p,h,i,r,o,e,f,c,a),v=p.__e,p.ref&&h.ref!=p.ref&&(h.ref&&J$2(h.ref,null,p),a.push(p.ref,p.__c||v,p)),null==y&&null!=v&&(y=v),(g=!!(4&p.__u))||h.__k===p.__k?(f=j$3(p,f,n,g),g&&h.__e&&(h.__e=null)):"function"==typeof p.type&&void 0!==_?f=_:v&&(f=v.nextSibling),p.__u&=-7);return u.__e=y,f}function T$3(n,l,u,t,i){var r,o,e,f,c,a=u.length,s=a,h=0;for(n.__k=new Array(i),r=0;r<i;r++)null!=(o=l[r])&&"boolean"!=typeof o&&"function"!=typeof o?("string"==typeof o||"number"==typeof o||"bigint"==typeof o||o.constructor==String?o=n.__k[r]=x$3(null,o,null,null,null):g$3(o)?o=n.__k[r]=x$3(S$1,{children:o},null,null,null):void 0===o.constructor&&o.__b>0?o=n.__k[r]=x$3(o.type,o.props,o.key,o.ref?o.ref:null,o.__v):n.__k[r]=o,f=r+h,o.__=n,o.__b=n.__b+1,e=null,-1!=(c=o.__i=O$2(o,u,f,s))&&(s--,(e=u[c])&&(e.__u|=2)),null==e||null==e.__v?(-1==c&&(i>a?h--:i<a&&h++),"function"!=typeof o.type&&(o.__u|=4)):c!=f&&(c==f-1?h--:c==f+1?h++:(c>f?h--:h++,o.__u|=4))):n.__k[r]=null;if(s)for(r=0;r<a;r++)null!=(e=u[r])&&0==(2&e.__u)&&(e.__e==t&&(t=$$2(e)),K$2(e,e));return t}function j$3(n,l,u,t){var i,r;if("function"==typeof n.type){for(i=n.__k,r=0;i&&r<i.length;r++)i[r]&&(i[r].__=n,l=j$3(i[r],l,u,t));return l}n.__e!=l&&(t&&(l&&n.type&&!l.parentNode&&(l=$$2(n)),u.insertBefore(n.__e,l||null)),l=n.__e);do{l=l&&l.nextSibling;}while(null!=l&&8==l.nodeType);return l}function F$1(n,l){return l=l||[],null==n||"boolean"==typeof n||(g$3(n)?n.some(function(n){F$1(n,l);}):l.push(n)),l}function O$2(n,l,u,t){var i,r,o,e=n.key,f=n.type,c=l[u],a=null!=c&&0==(2&c.__u);if(null===c&&null==e||a&&e==c.key&&f==c.type)return u;if(t>(a?1:0))for(i=u-1,r=u+1;i>=0||r<l.length;)if(null!=(c=l[o=i>=0?i--:r++])&&0==(2&c.__u)&&e==c.key&&f==c.type)return o;return -1}function z$3(n,l,u){"-"==l[0]?n.setProperty(l,null==u?"":u):n[l]=null==u?"":"number"!=typeof u||_$1.test(l)?u:u+"px";}function N$2(n,l,u,t,i){var r,o;n:if("style"==l)if("string"==typeof u)n.style.cssText=u;else {if("string"==typeof t&&(n.style.cssText=t=""),t)for(l in t)u&&l in u||z$3(n.style,l,"");if(u)for(l in u)t&&u[l]==t[l]||z$3(n.style,l,u[l]);}else if("o"==l[0]&&"n"==l[1])r=l!=(l=l.replace(s$3,"$1")),o=l.toLowerCase(),l=o in n||"onFocusOut"==l||"onFocusIn"==l?o.slice(2):l.slice(2),n.l||(n.l={}),n.l[l+r]=u,u?t?u[a$3]=t[a$3]:(u[a$3]=h$3,n.addEventListener(l,r?v$3:p$3,r)):n.removeEventListener(l,r?v$3:p$3,r);else {if("http://www.w3.org/2000/svg"==i)l=l.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if("width"!=l&&"height"!=l&&"href"!=l&&"list"!=l&&"form"!=l&&"tabIndex"!=l&&"download"!=l&&"rowSpan"!=l&&"colSpan"!=l&&"role"!=l&&"popover"!=l&&l in n)try{n[l]=null==u?"":u;break n}catch(n){}"function"==typeof u||(null==u||false===u&&"-"!=l[4]?n.removeAttribute(l):n.setAttribute(l,"popover"==l&&1==u?"":u));}}function V$3(n){return function(u){if(this.l){var t=this.l[u.type+n];if(null==u[c$3])u[c$3]=h$3++;else if(u[c$3]<t[a$3])return;return t(l$3.event?l$3.event(u):u)}}}function q$4(n,u,t,i,r,o,e,f,c,a){var s,h,p,v,y,d,_,k,x,M,$,I,P,A,H,T,j=u.type;if(void 0!==u.constructor)return null;128&t.__u&&(c=!!(32&t.__u),o=[f=u.__e=t.__e]),(s=l$3.__b)&&s(u);n:if("function"==typeof j){h=e.length;try{if(x=u.props,M=j.prototype&&j.prototype.render,$=(s=j.contextType)&&i[s.__c],I=s?$?$.props.value:s.__:i,t.__c?k=(p=u.__c=t.__c).__=p.__E:(M?u.__c=p=new j(x,I):(u.__c=p=new C$3(x,I),p.constructor=j,p.render=Q$1),$&&$.sub(p),p.state||(p.state={}),p.__n=i,v=p.__d=!0,p.__h=[],p._sb=[]),M&&null==p.__s&&(p.__s=p.state),M&&null!=j.getDerivedStateFromProps&&(p.__s==p.state&&(p.__s=m$3({},p.__s)),m$3(p.__s,j.getDerivedStateFromProps(x,p.__s))),y=p.props,d=p.state,p.__v=u,v)M&&null==j.getDerivedStateFromProps&&null!=p.componentWillMount&&p.componentWillMount(),M&&null!=p.componentDidMount&&p.__h.push(p.componentDidMount);else {if(M&&null==j.getDerivedStateFromProps&&x!==y&&null!=p.componentWillReceiveProps&&p.componentWillReceiveProps(x,I),u.__v==t.__v||!p.__e&&null!=p.shouldComponentUpdate&&!1===p.shouldComponentUpdate(x,p.__s,I)){u.__v!=t.__v&&(p.props=x,p.state=p.__s,p.__d=!1),u.__e=t.__e,u.__k=t.__k,u.__k.some(function(n){n&&(n.__=u);}),w$3.push.apply(p.__h,p._sb),p._sb=[],p.__h.length&&e.push(p);break n}null!=p.componentWillUpdate&&p.componentWillUpdate(x,p.__s,I),M&&null!=p.componentDidUpdate&&p.__h.push(function(){p.componentDidUpdate(y,d,_);});}if(p.context=I,p.props=x,p.__P=n,p.__e=!1,P=l$3.__r,A=0,M)p.state=p.__s,p.__d=!1,P&&P(u),s=p.render(p.props,p.state,p.context),w$3.push.apply(p.__h,p._sb),p._sb=[];else do{p.__d=!1,P&&P(u),s=p.render(p.props,p.state,p.context),p.state=p.__s;}while(p.__d&&++A<25);p.state=p.__s,null!=p.getChildContext&&(i=m$3(m$3({},i),p.getChildContext())),M&&!v&&null!=p.getSnapshotBeforeUpdate&&(_=p.getSnapshotBeforeUpdate(y,d)),H=null!=s&&s.type===S$1&&null==s.key?E$2(s.props.children):s,f=L$1(n,g$3(H)?H:[H],u,t,i,r,o,e,f,c,a),p.base=u.__e,u.__u&=-161,p.__h.length&&e.push(p),k&&(p.__E=p.__=null);}catch(n){if(e.length=h,u.__v=null,c||null!=o)if(n.then){for(u.__u|=c?160:128;f&&8==f.nodeType&&f.nextSibling;)f=f.nextSibling;null!=o&&(o[o.indexOf(f)]=null),u.__e=f;}else {if(null!=o)for(T=o.length;T--;)b$2(o[T]);B$3(u);}else u.__e=t.__e,!u.__k&&t.__k&&(u.__k=t.__k),n.then||B$3(u);l$3.__e(n,u,t);}}else null==o&&u.__v==t.__v?(u.__k=t.__k,u.__e=t.__e):f=u.__e=G$1(t.__e,u,t,i,r,o,e,c,a);return (s=l$3.diffed)&&s(u),128&u.__u?void 0:f}function B$3(n){n&&(n.__c&&(n.__c.__e=true),n.__k&&n.__k.some(B$3));}function D$3(n,u,t){for(var i=0;i<t.length;i++)J$2(t[i],t[++i],t[++i]);l$3.__c&&l$3.__c(u,n),n.some(function(u){try{n=u.__h,u.__h=[],n.some(function(n){n.call(u);});}catch(n){l$3.__e(n,u.__v);}});}function E$2(n){return "object"!=typeof n||null==n||n.__b>0?n:g$3(n)?n.map(E$2):void 0!==n.constructor?null:m$3({},n)}function G$1(u,t,i,r,o,e,f,c,a){var s,h,p,v,y,w,_,m=i.props||d$3,k=t.props,x=t.type;if("svg"==x?o="http://www.w3.org/2000/svg":"math"==x?o="http://www.w3.org/1998/Math/MathML":o||(o="http://www.w3.org/1999/xhtml"),null!=e)for(s=0;s<e.length;s++)if((y=e[s])&&"setAttribute"in y==!!x&&(x?y.localName==x:3==y.nodeType)){u=y,e[s]=null;break}if(null==u){if(null==x)return document.createTextNode(k);u=document.createElementNS(o,x,k.is&&k),c&&(l$3.__m&&l$3.__m(t,e),c=false),e=null;}if(null==x)m===k||c&&u.data==k||(u.data=k);else {if(e="textarea"==x&&null!=k.defaultValue?null:e&&n$1.call(u.childNodes),!c&&null!=e)for(m={},s=0;s<u.attributes.length;s++)m[(y=u.attributes[s]).name]=y.value;for(s in m)y=m[s],"dangerouslySetInnerHTML"==s?p=y:"children"==s||s in k||"value"==s&&"defaultValue"in k||"checked"==s&&"defaultChecked"in k||N$2(u,s,null,y,o);for(s in k)y=k[s],"children"==s?v=y:"dangerouslySetInnerHTML"==s?h=y:"value"==s?w=y:"checked"==s?_=y:c&&"function"!=typeof y||m[s]===y||N$2(u,s,y,m[s],o);if(h)c||p&&(h.__html==p.__html||h.__html==u.innerHTML)||(u.innerHTML=h.__html),t.__k=[];else if(p&&(u.innerHTML=""),L$1("template"==t.type?u.content:u,g$3(v)?v:[v],t,i,r,"foreignObject"==x?"http://www.w3.org/1999/xhtml":o,e,f,e?e[0]:i.__k&&$$2(i,0),c,a),null!=e)for(s=e.length;s--;)b$2(e[s]);c&&"textarea"!=x||(s="value","progress"==x&&null==w?u.removeAttribute("value"):null!=w&&(w!==u[s]||"progress"==x&&!w||"option"==x&&w!=m[s])&&N$2(u,s,w,m[s],o),s="checked",null!=_&&_!=u[s]&&N$2(u,s,_,m[s],o));}return u}function J$2(n,u,t){try{if("function"==typeof n){var i="function"==typeof n.__u;i&&n.__u(),i&&null==u||(n.__u=n(u));}else n.current=u;}catch(n){l$3.__e(n,t);}}function K$2(n,u,t){var i,r;if(l$3.unmount&&l$3.unmount(n),(i=n.ref)&&(i.current&&i.current!=n.__e||J$2(i,null,u)),null!=(i=n.__c)){if(i.componentWillUnmount)try{i.componentWillUnmount();}catch(n){l$3.__e(n,u);}i.base=i.__P=i.__n=null;}if(i=n.__k)for(r=0;r<i.length;r++)i[r]&&K$2(i[r],u,t||"function"!=typeof n.type);t||b$2(n.__e),n.__c=n.__=n.__e=void 0;}function Q$1(n,l,u){return this.constructor(n,u)}function R$1(u,t,i){var r,o,e,f;t==document&&(t=document.documentElement),l$3.__&&l$3.__(u,t),o=(r="function"==typeof i)?null:i&&i.__k||t.__k,e=[],f=[],q$4(t,u=(!r&&i||t).__k=k$3(S$1,null,[u]),o||d$3,d$3,t.namespaceURI,!r&&i?[i]:o?null:t.firstChild?n$1.call(t.childNodes):null,e,!r&&i?i:o?o.__e:t.firstChild,r,f),D$3(e,u,f),u.props.children=null;}function W$2(l,u,t){var i,r,o,e,f=m$3({},l.props);for(o in l.type&&l.type.defaultProps&&(e=l.type.defaultProps),u)"key"==o?i=u[o]:"ref"==o?r=u[o]:f[o]=void 0===u[o]&&null!=e?e[o]:u[o];return arguments.length>2&&(f.children=arguments.length>3?n$1.call(arguments,2):t),x$3(l.type,f,i||l.key,r||l.ref,null)}function X$1(n){function l(n){var u,t;return this.getChildContext||(u=new Set,(t={})[l.__c]=this,this.getChildContext=function(){return t},this.componentWillUnmount=function(){u=null;},this.shouldComponentUpdate=function(n){this.props.value!=n.value&&u.forEach(function(n){n.__e=true,A$3(n);});},this.sub=function(n){u.add(n);var l=n.componentWillUnmount;n.componentWillUnmount=function(){u&&u.delete(n),l&&l.call(n);};}),n.children}return l.__c="__cC"+y$3++,l.__=n,l.Provider=l.__l=(l.Consumer=function(n,l){return n.children(l)}).contextType=l,l}n$1=w$3.slice,l$3={__e:function(n,l,u,t){for(var i,r,o;l=l.__;)if((i=l.__c)&&!i.__)try{if((r=i.constructor)&&null!=r.getDerivedStateFromError&&(i.setState(r.getDerivedStateFromError(n)),o=i.__d),null!=i.componentDidCatch&&(i.componentDidCatch(n,t||{}),o=i.__d),o)return i.__E=i}catch(l){n=l;}throw n}},u$3=0,C$3.prototype.setState=function(n,l){var u;u=null!=this.__s&&this.__s!=this.state?this.__s:this.__s=m$3({},this.state),"function"==typeof n&&(n=n(m$3({},u),this.props)),n&&m$3(u,n),null!=n&&this.__v&&(l&&this._sb.push(l),A$3(this));},C$3.prototype.forceUpdate=function(n){this.__v&&(this.__e=true,n&&this.__h.push(n),A$3(this));},C$3.prototype.render=S$1,i$3=[],o$3="function"==typeof Promise?Promise.prototype.then.bind(Promise.resolve()):setTimeout,e$2=function(n,l){return n.__v.__b-l.__v.__b},H$2.__r=0,f$3=Math.random().toString(8),c$3="__d"+f$3,a$3="__a"+f$3,s$3=/(PointerCapture)$|Capture$/i,h$3=0,p$3=V$3(false),v$3=V$3(true),y$3=0;
|
|
2
|
+
|
|
3
|
+
var t$1,r$2,u$2,i$2,o$2=0,f$2=[],c$2=l$3,e$1=c$2.__b,a$2=c$2.__r,v$2=c$2.diffed,l$2=c$2.__c,m$2=c$2.unmount,p$2=c$2.__;function s$2(n,t){c$2.__h&&c$2.__h(r$2,n,o$2||t),o$2=0;var u=r$2.__H||(r$2.__H={__:[],__h:[]});return n>=u.__.length&&u.__.push({}),u.__[n]}function d$2(n){return o$2=1,y$2(D$2,n)}function y$2(n,u,i){var o=s$2(t$1++,2);if(o.t=n,!o.__c&&(o.__=[i?i(u):D$2(void 0,u),function(n){var t=o.__N?o.__N[0]:o.__[0],r=o.t(t,n);t!==r&&(o.__N=[r,o.__[1]],o.__c.setState({}));}],o.__c=r$2,!r$2.__f)){var f=function(n,t,r){if(!o.__c.__H)return true;var u=false,i=o.__c.props!==n;if(o.__c.__H.__.some(function(n){if(n.__N){u=true;var t=n.__[0];n.__=n.__N,n.__N=void 0,t!==n.__[0]&&(i=true);}}),c){var f=c.call(this,n,t,r);return u?f||i:f}return !u||i};r$2.__f=true;var c=r$2.shouldComponentUpdate,e=r$2.componentWillUpdate;r$2.componentWillUpdate=function(n,t,r){if(this.__e){var u=c;c=void 0,f(n,t,r),c=u;}e&&e.call(this,n,t,r);},r$2.shouldComponentUpdate=f;}return o.__N||o.__}function h$2(n,u){var i=s$2(t$1++,3);!c$2.__s&&C$2(i.__H,u)&&(i.__=n,i.u=u,r$2.__H.__h.push(i));}function T$2(n,r){var u=s$2(t$1++,7);return C$2(u.__H,r)&&(u.__=n(),u.__H=r,u.__h=n),u.__}function q$3(n,t){return o$2=8,T$2(function(){return n},t)}function x$2(n){var u=r$2.context[n.__c],i=s$2(t$1++,9);return i.c=n,u?(null==i.__&&(i.__=true,u.sub(r$2)),u.props.value):n.__}function j$2(){for(var n;n=f$2.shift();){var t=n.__H;if(n.__P&&t)try{t.__h.some(z$2),t.__h.some(B$2),t.__h=[];}catch(r){t.__h=[],c$2.__e(r,n.__v);}}}c$2.__b=function(n){r$2=null,e$1&&e$1(n);},c$2.__=function(n,t){n&&t.__k&&t.__k.__m&&(n.__m=t.__k.__m),p$2&&p$2(n,t);},c$2.__r=function(n){a$2&&a$2(n),t$1=0;var i=(r$2=n.__c).__H;i&&(u$2===r$2?(i.__h=[],r$2.__h=[],i.__.some(function(n){n.__N&&(n.__=n.__N),n.u=n.__N=void 0;})):(i.__h.length&&j$2(),t$1=0)),u$2=r$2;},c$2.diffed=function(n){v$2&&v$2(n);var t=n.__c;t&&t.__H&&(t.__H.__h.length&&(1!==f$2.push(t)&&i$2===c$2.requestAnimationFrame||((i$2=c$2.requestAnimationFrame)||w$2)(j$2)),t.__H.__.some(function(n){n.u&&(n.__H=n.u,n.u=void 0);})),u$2=r$2=null;},c$2.__c=function(n,t){t.some(function(n){try{n.__h.some(z$2),n.__h=n.__h.filter(function(n){return !n.__||B$2(n)});}catch(r){t.some(function(n){n.__h&&(n.__h=[]);}),t=[],c$2.__e(r,n.__v);}}),l$2&&l$2(n,t);},c$2.unmount=function(n){m$2&&m$2(n);var t,r=n.__c;r&&r.__H&&(r.__H.__.some(function(n){try{z$2(n);}catch(n){t=n;}}),r.__H=void 0,t&&c$2.__e(t,r.__v));};var k$2="function"==typeof requestAnimationFrame;function w$2(n){var t,r=function(){clearTimeout(u),k$2&&cancelAnimationFrame(t),setTimeout(n);},u=setTimeout(r,35);k$2&&(t=requestAnimationFrame(r));}function z$2(n){var t=r$2,u=n.__c;"function"==typeof u&&(n.__c=void 0,u()),r$2=t;}function B$2(n){var t=r$2;n.__c=n.__(),r$2=t;}function C$2(n,t){return !n||n.length!==t.length||t.some(function(t,r){return t!==n[r]})}function D$2(n,t){return "function"==typeof t?t(n):t}
|
|
4
|
+
|
|
5
|
+
function g$2(n,t){for(var e in t)n[e]=t[e];return n}function E$1(n,t){for(var e in n)if("__source"!==e&&!(e in t))return true;for(var r in t)if("__source"!==r&&n[r]!==t[r])return true;return false}function M$2(n,t){this.props=n,this.context=t;}function N$1(n,e){function r(n){var t=this.props.ref;return t!=n.ref&&t&&("function"==typeof t?t(null):t.current=null),e?!e(this.props,n)||t!=n.ref:E$1(this.props,n)}function u(e){return this.shouldComponentUpdate=r,k$3(n,e)}return u.displayName="Memo("+(n.displayName||n.name)+")",u.__f=u.prototype.isReactComponent=true,u.type=n,u}(M$2.prototype=new C$3).isPureReactComponent=true,M$2.prototype.shouldComponentUpdate=function(n,t){return E$1(this.props,n)||E$1(this.state,t)};var T$1=l$3.__b;l$3.__b=function(n){n.type&&n.type.__f&&n.ref&&(n.props.ref=n.ref,n.ref=null),T$1&&T$1(n);};var A$2="undefined"!=typeof Symbol&&Symbol.for&&Symbol.for("react.forward_ref")||3911;function D$1(n){function t(t){var e=g$2({},t);return delete e.ref,n(e,t.ref||null)}return t.$$typeof=A$2,t.render=n,t.prototype.isReactComponent=t.__f=true,t.displayName="ForwardRef("+(n.displayName||n.name)+")",t}var O$1=l$3.__e;l$3.__e=function(n,t,e,r){if(n.then)for(var u,o=t;o=o.__;)if((u=o.__c)&&u.__c)return null==t.__e&&(t.__e=e.__e,t.__k=e.__k),u.__c(n,t);O$1(n,t,e,r);};var U$1=l$3.unmount;function V$2(n,t,e){return n&&(n.__c&&n.__c.__H&&(n.__c.__H.__.forEach(function(n){"function"==typeof n.__c&&n.__c();}),n.__c.__H=null),null!=(n=g$2({},n)).__c&&(n.__c.__P===e&&(n.__c.__P=t),n.__c.__e=true,n.__c=null),n.__k=n.__k&&n.__k.map(function(n){return V$2(n,t,e)})),n}function W$1(n,t,e){return n&&e&&(n.__v=null,n.__k=n.__k&&n.__k.map(function(n){return W$1(n,t,e)}),n.__c&&n.__c.__P===t&&(n.__e&&e.appendChild(n.__e),n.__c.__e=true,n.__c.__P=e)),n}function P$2(){this.__u=0,this.o=null,this.__b=null;}function j$1(n){var t=n.__&&n.__.__c;return t&&t.__a&&t.__a(n)}function B$1(){this.i=null,this.l=null;}l$3.unmount=function(n){var t=n.__c;t&&(t.__z=true),t&&t.__R&&t.__R(),t&&32&n.__u&&(n.type=null),U$1&&U$1(n);},(P$2.prototype=new C$3).__c=function(n,t){var e=t.__c,r=this;null==r.o&&(r.o=[]),r.o.push(e);var u=j$1(r.__v),o=false,i=function(){o||r.__z||(o=true,e.__R=null,u?u(f):f());};e.__R=i;var l=e.__P;e.__P=null;var f=function(){if(!--r.__u){if(r.state.__a){var n=r.state.__a;r.__v.__k[0]=W$1(n,n.__c.__P,n.__c.__O);}var t;for(r.setState({__a:r.__b=null});t=r.o.pop();)t.__P=l,t.forceUpdate();}};r.__u++||32&t.__u||r.setState({__a:r.__b=r.__v.__k[0]}),n.then(i,i);},P$2.prototype.componentWillUnmount=function(){this.o=[];},P$2.prototype.render=function(n,e){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 i=document.createElement("div"),l=r.__k[0].__c;r.__k[0]=V$2(this.__b,i,l.__O=l.__P);}this.__b=null;}var f=e.__a&&k$3(S$1,null,n.fallback);return f&&(f.__u&=-33),[k$3(S$1,null,e.__a?null:n.children),f]};var H$1=function(n,t,e){if(++e[1]===e[0]&&n.l.delete(t),n.props.revealOrder&&("t"!==n.props.revealOrder[0]||!n.l.size))for(e=n.i;e;){for(;e.length>3;)e.pop()();if(e[1]<e[0])break;n.i=e=e[2];}};(B$1.prototype=new C$3).__a=function(n){var t=this,e=j$1(t.__v),r=t.l.get(n);return r[0]++,function(u){var o=function(){t.props.revealOrder?(r.push(u),H$1(t,n,r)):u();};e?e(o):o();}},B$1.prototype.render=function(n){this.i=null,this.l=new Map;var t=F$1(n.children);n.revealOrder&&"b"===n.revealOrder[0]&&t.reverse();for(var e=t.length;e--;)this.l.set(t[e],this.i=[1,0,this.i]);return n.children},B$1.prototype.componentDidUpdate=B$1.prototype.componentDidMount=function(){var n=this;this.l.forEach(function(t,e){H$1(n,e,t);});};var q$2="undefined"!=typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103,G=/^(?: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]/,J$1=/^on(Ani|Tra|Tou|BeforeInp|Compo)/,K$1=/[A-Z0-9]/g,Q="undefined"!=typeof document,X=function(n){return ("undefined"!=typeof Symbol&&"symbol"==typeof Symbol()?/fil|che|rad/:/fil|che|ra/).test(n)};C$3.prototype.isReactComponent=true,["componentWillMount","componentWillReceiveProps","componentWillUpdate"].forEach(function(t){Object.defineProperty(C$3.prototype,t,{configurable:true,get:function(){return this["UNSAFE_"+t]},set:function(n){Object.defineProperty(this,t,{configurable:true,writable:true,value:n});}});});var en=l$3.event;l$3.event=function(n){return en&&(n=en(n)),n.persist=function(){},n.isPropagationStopped=function(){return this.cancelBubble},n.isDefaultPrevented=function(){return this.defaultPrevented},n.nativeEvent=n};var un={configurable:true,get:function(){return this.class}},on=l$3.vnode;l$3.vnode=function(n){"string"==typeof n.type&&function(n){var t=n.props,e=n.type,u={},o=-1==e.indexOf("-");for(var i in t){var l=t[i];if(!("value"===i&&"defaultValue"in t&&null==l||Q&&"children"===i&&"noscript"===e||"class"===i||"className"===i)){var f=i.toLowerCase();"defaultValue"===i&&"value"in t&&null==t.value?i="value":"download"===i&&true===l?l="":"translate"===f&&"no"===l?l=false:"o"===f[0]&&"n"===f[1]?"ondoubleclick"===f?i="ondblclick":"onchange"!==f||"input"!==e&&"textarea"!==e||X(t.type)?"onfocus"===f?i="onfocusin":"onblur"===f?i="onfocusout":J$1.test(i)&&(i=f):f=i="oninput":o&&G.test(i)?i=i.replace(K$1,"-$&").toLowerCase():null===l&&(l=void 0),"oninput"===f&&u[i=f]&&(i="oninputCapture"),u[i]=l;}}"select"==e&&(u.multiple&&Array.isArray(u.value)&&(u.value=F$1(t.children).forEach(function(n){n.props.selected=-1!=u.value.indexOf(n.props.value);})),null!=u.defaultValue&&(u.value=F$1(t.children).forEach(function(n){n.props.selected=u.multiple?-1!=u.defaultValue.indexOf(n.props.value):u.defaultValue==n.props.value;}))),t.class&&!t.className?(u.class=t.class,Object.defineProperty(u,"className",un)):t.className&&(u.class=u.className=t.className),n.props=u;}(n),n.$$typeof=q$2,on&&on(n);};var ln=l$3.__r;l$3.__r=function(n){ln&&ln(n),n.__c;};var fn=l$3.diffed;l$3.diffed=function(n){fn&&fn(n);var t=n.props,e=n.__e;null!=e&&"textarea"===n.type&&"value"in t&&t.value!==e.value&&(e.value=null==t.value?"":t.value);};
|
|
6
|
+
|
|
7
|
+
var r$1="diffed",o$1="__c",i$1="__s",a$1="__c",c$1="__k",u$1="__d",s$1="__s",l$1=/[\s\n\\/='"\0<>]/,f$1=/^(xlink|xmlns|xml)([A-Z])/,p$1=/^(?: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])/,h$1=/^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/,d$1=new Set(["draggable","spellcheck"]);function v$1(e){ void 0!==e.__g?e.__g|=8:e[u$1]=true;}function m$1(e){ void 0!==e.__g?e.__g&=-9:e[u$1]=false;}function y$1(e){return void 0!==e.__g?!!(8&e.__g):true===e[u$1]}var _=/["&<]/;function g$1(e){if(0===e.length||false===_.test(e))return e;for(var t=0,n=0,r="",o="";n<e.length;n++){switch(e.charCodeAt(n)){case 34:o=""";break;case 38:o="&";break;case 60:o="<";break;default:continue}n!==t&&(r+=e.slice(t,n)),r+=o,t=n+1;}return n!==t&&(r+=e.slice(t,n)),r}var b$1={},x$1=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"]),k$1=/[A-Z]/g;function w$1(e){var t="";for(var n in e){var r=e[n];if(null!=r&&""!==r){var o="-"==n[0]?n:b$1[n]||(b$1[n]=n.replace(k$1,"-$&").toLowerCase()),i=";";"number"!=typeof r||o.startsWith("--")||x$1.has(o)||(i="px;"),t=t+o+":"+r+i;}}return t||void 0}function C$1(){this.__d=true;}function A$1(e,t){return {__v:e,context:t,props:e.props,setState:C$1,forceUpdate:C$1,__d:true,__h:new Array(0)}}var D,P$1,$$1,U,F={},M$1=[],W=Array.isArray,z$1=Object.assign,H="",N="\x3c!--$s--\x3e",q$1="\x3c!--/$s--\x3e";function B(e){return "string"==typeof e?N+e+q$1:W(e)?(e.unshift(N),e.push(q$1),e):e&&"function"==typeof e.then?e.then(B):N+e+q$1}function I$1(a,u,s){var l=l$3[i$1];l$3[i$1]=true,D=l$3.__b,P$1=l$3[r$1],$$1=l$3.__r,U=l$3.unmount;var f=k$3(S$1,null);f[c$1]=[a];try{var p=R(a,u||F,!1,void 0,f,!1,s);return W(p)?p.join(H):p}catch(e){if(e.then)throw new Error('Use "renderToStringAsync" for suspenseful rendering.');throw e}finally{l$3[o$1]&&l$3[o$1](a,M$1),l$3[i$1]=l,M$1.length=0;}}function O(e,t){var n,r=e.type,o=true;return e[a$1]?(o=false,(n=e[a$1]).state=n[s$1]):n=new r(e.props,t),e[a$1]=n,n.__v=e,n.props=e.props,n.context=t,v$1(n),null==n.state&&(n.state=F),null==n[s$1]&&(n[s$1]=n.state),r.getDerivedStateFromProps?n.state=z$1({},n.state,r.getDerivedStateFromProps(n.props,n.state)):o&&n.componentWillMount?(n.componentWillMount(),n.state=n[s$1]!==n.state?n[s$1]:n.state):!o&&n.componentWillUpdate&&n.componentWillUpdate(),$$1&&$$1(e),n.render(n.props,n.state,t)}function R(t,r,o,i,u,_,b){if(null==t||true===t||false===t||t===H)return H;var x=typeof t;if("object"!=x)return "function"==x?H:"string"==x?g$1(t):t+H;if(W(t)){var k,C=H;u[c$1]=t;for(var S=t.length,L=0;L<S;L++){var E=t[L];if(null!=E&&"boolean"!=typeof E){var j,T=R(E,r,o,i,u,_,b);"string"==typeof T?C+=T:(k||(k=new Array(S)),C&&k.push(C),C=H,W(T)?(j=k).push.apply(j,T):k.push(T));}}return k?(C&&k.push(C),k):C}if(void 0!==t.constructor)return H;t.__=u,D&&D(t);var Z=t.type,M=t.props;if("function"==typeof Z){var N,q,I,K=r;if(Z===S$1){if("tpl"in M){for(var G=H,Q=0;Q<M.tpl.length;Q++)if(G+=M.tpl[Q],M.exprs&&Q<M.exprs.length){var X=M.exprs[Q];if(null==X)continue;"object"!=typeof X||void 0!==X.constructor&&!W(X)?G+=X:G+=R(X,r,o,i,t,_,b);}return G}if("UNSTABLE_comment"in M)return "\x3c!--"+g$1(M.UNSTABLE_comment)+"--\x3e";q=M.children;}else {if(null!=(N=Z.contextType)){var Y=r[N.__c];K=Y?Y.props.value:N.__;}var ee=Z.prototype&&"function"==typeof Z.prototype.render;if(ee)q=/**#__NOINLINE__**/O(t,K),I=t[a$1];else {t[a$1]=I=/**#__NOINLINE__**/A$1(t,K);for(var te=0;y$1(I)&&te++<25;){m$1(I),$$1&&$$1(t);try{q=Z.call(I,M,K);}catch(e){throw e}}v$1(I);}if(null!=I.getChildContext&&(r=z$1({},r,I.getChildContext())),ee&&l$3.errorBoundaries&&(Z.getDerivedStateFromError||I.componentDidCatch)){q=null!=q&&q.type===S$1&&null==q.key&&null==q.props.tpl?q.props.children:q;try{return R(q,r,o,i,t,_,!1)}catch(e){return Z.getDerivedStateFromError&&(I[s$1]=Z.getDerivedStateFromError(e)),I.componentDidCatch&&I.componentDidCatch(e,F),y$1(I)?(q=O(t,r),null!=(I=t[a$1]).getChildContext&&(r=z$1({},r,I.getChildContext())),R(q=null!=q&&q.type===S$1&&null==q.key&&null==q.props.tpl?q.props.children:q,r,o,i,t,_,b)):H}finally{P$1&&P$1(t),U&&U(t);}}}q=null!=q&&q.type===S$1&&null==q.key&&null==q.props.tpl?q.props.children:q;try{var ne=R(q,r,o,i,t,_,b);return P$1&&P$1(t),l$3.unmount&&l$3.unmount(t),t._suspended?B(ne):ne}catch(n){if(b&&b.onError){var re=function e(n){return b.onError(n,t,function(t,n){try{return R(t,r,o,i,n,_,b)}catch(t){return e(t)}})}(n);if(void 0!==re)return re;var oe=l$3.__e;return oe&&oe(n,t),H}throw n;}}var ie,ae="<"+Z,ce=H;for(var ue in M){var se=M[ue];if("function"!=typeof(se=J(se)?se.value:se)||"class"===ue||"className"===ue){switch(ue){case "children":ie=se;continue;case "key":case "ref":case "__self":case "__source":continue;case "htmlFor":if("for"in M)continue;ue="for";break;case "className":if("class"in M)continue;ue="class";break;case "defaultChecked":ue="checked";break;case "defaultSelected":ue="selected";break;case "defaultValue":case "value":switch(ue="value",Z){case "textarea":ie=se;continue;case "select":i=se;continue;case "option":i!=se||"selected"in M||(ae+=" selected");}break;case "dangerouslySetInnerHTML":ce=se&&se.__html;continue;case "style":"object"==typeof se&&(se=w$1(se));break;case "acceptCharset":ue="accept-charset";break;case "httpEquiv":ue="http-equiv";break;default:if(l$1.test(ue))continue;f$1.test(ue)?ue=ue.replace(f$1,"$1:$2").toLowerCase():"-"!==ue[4]&&!d$1.has(ue)||null==se?o?h$1.test(ue)&&(ue="panose1"===ue?"panose-1":ue.replace(/([A-Z])/g,"-$1").toLowerCase()):p$1.test(ue)&&(ue=ue.toLowerCase()):se+=H;}null!=se&&false!==se&&(ae=true===se||se===H?ae+" "+ue:ae+" "+ue+'="'+("string"==typeof se?g$1(se):se+H)+'"');}}if(l$1.test(Z))throw new Error(Z+" is not a valid HTML tag name in "+ae+">");if(ce||("string"==typeof ie?ce=g$1(ie):null!=ie&&false!==ie&&true!==ie&&(ce=R(ie,r,"svg"===Z||"foreignObject"!==Z&&o,i,t,_,b))),P$1&&P$1(t),U&&U(t),!ce&&V$1.has(Z))return ae+"/>";var le="</"+Z+">",fe=ae+">";return W(ce)?[fe].concat(ce,[le]):"string"!=typeof ce?[fe,ce,le]:fe+ce+le}var V$1=new Set(["area","base","br","col","command","embed","hr","img","input","keygen","link","meta","param","source","track","wbr"]),K=I$1;function J(e){return null!==e&&"object"==typeof e&&"function"==typeof e.peek&&"value"in e}
|
|
8
|
+
|
|
9
|
+
/* eslint @typescript-eslint/no-explicit-any: off */
|
|
10
|
+
// symbols
|
|
11
|
+
const GET_ORIGINAL_SYMBOL = Symbol();
|
|
12
|
+
// get object prototype
|
|
13
|
+
const getProto = Object.getPrototypeOf;
|
|
14
|
+
const objectsToTrack = new WeakMap();
|
|
15
|
+
// check if obj is a plain object or an array
|
|
16
|
+
const isObjectToTrack = (obj) => obj &&
|
|
17
|
+
(objectsToTrack.has(obj)
|
|
18
|
+
? objectsToTrack.get(obj)
|
|
19
|
+
: getProto(obj) === Object.prototype || getProto(obj) === Array.prototype);
|
|
20
|
+
/**
|
|
21
|
+
* Unwrap proxy to get the original object.
|
|
22
|
+
*
|
|
23
|
+
* Used to retrieve the original object used to create the proxy instance with `createProxy`.
|
|
24
|
+
*
|
|
25
|
+
* @param {Proxy<object>} obj - The proxy wrapper of the originial object.
|
|
26
|
+
* @returns {object | null} - Return either the unwrapped object if exists.
|
|
27
|
+
*
|
|
28
|
+
* @example
|
|
29
|
+
* import { createProxy, getUntracked } from 'proxy-compare';
|
|
30
|
+
*
|
|
31
|
+
* const original = { a: "1", c: "2", d: { e: "3" } };
|
|
32
|
+
* const affected = new WeakMap();
|
|
33
|
+
*
|
|
34
|
+
* const proxy = createProxy(original, affected);
|
|
35
|
+
* const originalFromProxy = getUntracked(proxy)
|
|
36
|
+
*
|
|
37
|
+
* Object.is(original, originalFromProxy) // true
|
|
38
|
+
* isChanged(original, originalFromProxy, affected) // false
|
|
39
|
+
*/
|
|
40
|
+
const getUntracked = (obj) => {
|
|
41
|
+
if (isObjectToTrack(obj)) {
|
|
42
|
+
return obj[GET_ORIGINAL_SYMBOL] || null;
|
|
43
|
+
}
|
|
44
|
+
return null;
|
|
45
|
+
};
|
|
46
|
+
/**
|
|
47
|
+
* Mark object to be tracked.
|
|
48
|
+
*
|
|
49
|
+
* This function marks an object that will be passed into `createProxy`
|
|
50
|
+
* as marked to track or not. By default only Array and Object are marked to track,
|
|
51
|
+
* so this is useful for example to mark a class instance to track or to mark a object
|
|
52
|
+
* to be untracked when creating your proxy.
|
|
53
|
+
*
|
|
54
|
+
* @param obj - Object to mark as tracked or not.
|
|
55
|
+
* @param mark - Boolean indicating whether you want to track this object or not.
|
|
56
|
+
* @returns - No return.
|
|
57
|
+
*
|
|
58
|
+
* @example
|
|
59
|
+
* import { createProxy, markToTrack, isChanged } from 'proxy-compare';
|
|
60
|
+
*
|
|
61
|
+
* const nested = { e: "3" }
|
|
62
|
+
*
|
|
63
|
+
* markToTrack(nested, false)
|
|
64
|
+
*
|
|
65
|
+
* const original = { a: "1", c: "2", d: nested };
|
|
66
|
+
* const affected = new WeakMap();
|
|
67
|
+
*
|
|
68
|
+
* const proxy = createProxy(original, affected);
|
|
69
|
+
*
|
|
70
|
+
* proxy.d.e
|
|
71
|
+
*
|
|
72
|
+
* isChanged(original, { d: { e: "3" } }, affected) // true
|
|
73
|
+
*/
|
|
74
|
+
const markToTrack = (obj, mark = true) => {
|
|
75
|
+
objectsToTrack.set(obj, mark);
|
|
76
|
+
};
|
|
77
|
+
|
|
78
|
+
const isObject = (x) => typeof x === "object" && x !== null;
|
|
79
|
+
const canProxyDefault = (x) => isObject(x) && !refSet.has(x) && (Array.isArray(x) || !(Symbol.iterator in x)) && !(x instanceof WeakMap) && !(x instanceof WeakSet) && !(x instanceof Error) && !(x instanceof Number) && !(x instanceof Date) && !(x instanceof String) && !(x instanceof RegExp) && !(x instanceof ArrayBuffer) && !(x instanceof Promise);
|
|
80
|
+
const createSnapshotDefault = (target, version) => {
|
|
81
|
+
const cache = snapCache.get(target);
|
|
82
|
+
if ((cache == null ? void 0 : cache[0]) === version) {
|
|
83
|
+
return cache[1];
|
|
84
|
+
}
|
|
85
|
+
const snap = Array.isArray(target) ? [] : Object.create(Object.getPrototypeOf(target));
|
|
86
|
+
markToTrack(snap, true);
|
|
87
|
+
snapCache.set(target, [version, snap]);
|
|
88
|
+
Reflect.ownKeys(target).forEach((key) => {
|
|
89
|
+
if (Object.getOwnPropertyDescriptor(snap, key)) {
|
|
90
|
+
return;
|
|
91
|
+
}
|
|
92
|
+
const value = Reflect.get(target, key);
|
|
93
|
+
const { enumerable } = Reflect.getOwnPropertyDescriptor(
|
|
94
|
+
target,
|
|
95
|
+
key
|
|
96
|
+
);
|
|
97
|
+
const desc = {
|
|
98
|
+
value,
|
|
99
|
+
enumerable,
|
|
100
|
+
// This is intentional to avoid copying with proxy-compare.
|
|
101
|
+
// It's still non-writable, so it avoids assigning a value.
|
|
102
|
+
configurable: true
|
|
103
|
+
};
|
|
104
|
+
if (refSet.has(value)) {
|
|
105
|
+
markToTrack(value, false);
|
|
106
|
+
} else if (proxyStateMap.has(value)) {
|
|
107
|
+
const [target2, ensureVersion] = proxyStateMap.get(
|
|
108
|
+
value
|
|
109
|
+
);
|
|
110
|
+
desc.value = createSnapshotDefault(target2, ensureVersion());
|
|
111
|
+
}
|
|
112
|
+
Object.defineProperty(snap, key, desc);
|
|
113
|
+
});
|
|
114
|
+
return snap;
|
|
115
|
+
};
|
|
116
|
+
const createHandlerDefault = (isInitializing, addPropListener, removePropListener, notifyUpdate) => ({
|
|
117
|
+
deleteProperty(target, prop) {
|
|
118
|
+
Reflect.get(target, prop);
|
|
119
|
+
removePropListener(prop);
|
|
120
|
+
const deleted = Reflect.deleteProperty(target, prop);
|
|
121
|
+
if (deleted) {
|
|
122
|
+
notifyUpdate(void 0 );
|
|
123
|
+
}
|
|
124
|
+
return deleted;
|
|
125
|
+
},
|
|
126
|
+
set(target, prop, value, receiver) {
|
|
127
|
+
const hasPrevValue = !isInitializing() && Reflect.has(target, prop);
|
|
128
|
+
const prevValue = Reflect.get(target, prop, receiver);
|
|
129
|
+
if (hasPrevValue && (objectIs(prevValue, value) || proxyCache.has(value) && objectIs(prevValue, proxyCache.get(value)))) {
|
|
130
|
+
return true;
|
|
131
|
+
}
|
|
132
|
+
removePropListener(prop);
|
|
133
|
+
if (isObject(value)) {
|
|
134
|
+
value = getUntracked(value) || value;
|
|
135
|
+
}
|
|
136
|
+
const nextValue = !proxyStateMap.has(value) && canProxy(value) ? proxy(value) : value;
|
|
137
|
+
addPropListener(prop, nextValue);
|
|
138
|
+
Reflect.set(target, prop, nextValue, receiver);
|
|
139
|
+
notifyUpdate(void 0 );
|
|
140
|
+
return true;
|
|
141
|
+
}
|
|
142
|
+
});
|
|
143
|
+
const proxyStateMap = /* @__PURE__ */ new WeakMap();
|
|
144
|
+
const refSet = /* @__PURE__ */ new WeakSet();
|
|
145
|
+
const snapCache = /* @__PURE__ */ new WeakMap();
|
|
146
|
+
const versionHolder = [1];
|
|
147
|
+
const proxyCache = /* @__PURE__ */ new WeakMap();
|
|
148
|
+
let objectIs = Object.is;
|
|
149
|
+
let newProxy = (target, handler) => new Proxy(target, handler);
|
|
150
|
+
let canProxy = canProxyDefault;
|
|
151
|
+
let createSnapshot = createSnapshotDefault;
|
|
152
|
+
let createHandler = createHandlerDefault;
|
|
153
|
+
function proxy(baseObject = {}) {
|
|
154
|
+
if (!isObject(baseObject)) {
|
|
155
|
+
throw new Error("object required");
|
|
156
|
+
}
|
|
157
|
+
const found = proxyCache.get(baseObject);
|
|
158
|
+
if (found) {
|
|
159
|
+
return found;
|
|
160
|
+
}
|
|
161
|
+
let version = versionHolder[0];
|
|
162
|
+
const listeners = /* @__PURE__ */ new Set();
|
|
163
|
+
const notifyUpdate = (op, nextVersion = ++versionHolder[0]) => {
|
|
164
|
+
if (version !== nextVersion) {
|
|
165
|
+
checkVersion = version = nextVersion;
|
|
166
|
+
listeners.forEach((listener) => listener(op, nextVersion));
|
|
167
|
+
}
|
|
168
|
+
};
|
|
169
|
+
let checkVersion = version;
|
|
170
|
+
const ensureVersion = (nextCheckVersion = versionHolder[0]) => {
|
|
171
|
+
if (checkVersion !== nextCheckVersion) {
|
|
172
|
+
checkVersion = nextCheckVersion;
|
|
173
|
+
propProxyStates.forEach(([propProxyState]) => {
|
|
174
|
+
const propVersion = propProxyState[1](nextCheckVersion);
|
|
175
|
+
if (propVersion > version) {
|
|
176
|
+
version = propVersion;
|
|
177
|
+
}
|
|
178
|
+
});
|
|
179
|
+
}
|
|
180
|
+
return version;
|
|
181
|
+
};
|
|
182
|
+
const createPropListener = (prop) => (op, nextVersion) => {
|
|
183
|
+
let newOp;
|
|
184
|
+
if (op) {
|
|
185
|
+
newOp = [...op];
|
|
186
|
+
newOp[1] = [prop, ...newOp[1]];
|
|
187
|
+
}
|
|
188
|
+
notifyUpdate(newOp, nextVersion);
|
|
189
|
+
};
|
|
190
|
+
const propProxyStates = /* @__PURE__ */ new Map();
|
|
191
|
+
const addPropListener = (prop, propValue) => {
|
|
192
|
+
const propProxyState = !refSet.has(propValue) && proxyStateMap.get(propValue);
|
|
193
|
+
if (propProxyState) {
|
|
194
|
+
if ((import.meta.env ? import.meta.env.MODE : void 0) !== "production" && propProxyStates.has(prop)) {
|
|
195
|
+
throw new Error("prop listener already exists");
|
|
196
|
+
}
|
|
197
|
+
if (listeners.size) {
|
|
198
|
+
const remove = propProxyState[2](createPropListener(prop));
|
|
199
|
+
propProxyStates.set(prop, [propProxyState, remove]);
|
|
200
|
+
} else {
|
|
201
|
+
propProxyStates.set(prop, [propProxyState]);
|
|
202
|
+
}
|
|
203
|
+
}
|
|
204
|
+
};
|
|
205
|
+
const removePropListener = (prop) => {
|
|
206
|
+
var _a;
|
|
207
|
+
const entry = propProxyStates.get(prop);
|
|
208
|
+
if (entry) {
|
|
209
|
+
propProxyStates.delete(prop);
|
|
210
|
+
(_a = entry[1]) == null ? void 0 : _a.call(entry);
|
|
211
|
+
}
|
|
212
|
+
};
|
|
213
|
+
const addListener = (listener) => {
|
|
214
|
+
listeners.add(listener);
|
|
215
|
+
if (listeners.size === 1) {
|
|
216
|
+
propProxyStates.forEach(([propProxyState, prevRemove], prop) => {
|
|
217
|
+
if ((import.meta.env ? import.meta.env.MODE : void 0) !== "production" && prevRemove) {
|
|
218
|
+
throw new Error("remove already exists");
|
|
219
|
+
}
|
|
220
|
+
const remove = propProxyState[2](createPropListener(prop));
|
|
221
|
+
propProxyStates.set(prop, [propProxyState, remove]);
|
|
222
|
+
});
|
|
223
|
+
}
|
|
224
|
+
const removeListener = () => {
|
|
225
|
+
listeners.delete(listener);
|
|
226
|
+
if (listeners.size === 0) {
|
|
227
|
+
propProxyStates.forEach(([propProxyState, remove], prop) => {
|
|
228
|
+
if (remove) {
|
|
229
|
+
remove();
|
|
230
|
+
propProxyStates.set(prop, [propProxyState]);
|
|
231
|
+
}
|
|
232
|
+
});
|
|
233
|
+
}
|
|
234
|
+
};
|
|
235
|
+
return removeListener;
|
|
236
|
+
};
|
|
237
|
+
let initializing = true;
|
|
238
|
+
const handler = createHandler(
|
|
239
|
+
() => initializing,
|
|
240
|
+
addPropListener,
|
|
241
|
+
removePropListener,
|
|
242
|
+
notifyUpdate
|
|
243
|
+
);
|
|
244
|
+
const proxyObject = newProxy(baseObject, handler);
|
|
245
|
+
proxyCache.set(baseObject, proxyObject);
|
|
246
|
+
const proxyState = [baseObject, ensureVersion, addListener];
|
|
247
|
+
proxyStateMap.set(proxyObject, proxyState);
|
|
248
|
+
Reflect.ownKeys(baseObject).forEach((key) => {
|
|
249
|
+
const desc = Object.getOwnPropertyDescriptor(
|
|
250
|
+
baseObject,
|
|
251
|
+
key
|
|
252
|
+
);
|
|
253
|
+
if ("value" in desc && desc.writable) {
|
|
254
|
+
proxyObject[key] = baseObject[key];
|
|
255
|
+
}
|
|
256
|
+
});
|
|
257
|
+
initializing = false;
|
|
258
|
+
return proxyObject;
|
|
259
|
+
}
|
|
260
|
+
function getVersion(proxyObject) {
|
|
261
|
+
const proxyState = proxyStateMap.get(proxyObject);
|
|
262
|
+
return proxyState == null ? void 0 : proxyState[1]();
|
|
263
|
+
}
|
|
264
|
+
function subscribe(proxyObject, callback, notifyInSync) {
|
|
265
|
+
const proxyState = proxyStateMap.get(proxyObject);
|
|
266
|
+
if ((import.meta.env ? import.meta.env.MODE : void 0) !== "production" && !proxyState) {
|
|
267
|
+
console.warn("Please use proxy object");
|
|
268
|
+
}
|
|
269
|
+
let promise;
|
|
270
|
+
const ops = [];
|
|
271
|
+
const addListener = proxyState[2];
|
|
272
|
+
let isListenerActive = false;
|
|
273
|
+
const listener = (op) => {
|
|
274
|
+
if (op) {
|
|
275
|
+
ops.push(op);
|
|
276
|
+
}
|
|
277
|
+
if (notifyInSync) {
|
|
278
|
+
callback(ops.splice(0));
|
|
279
|
+
return;
|
|
280
|
+
}
|
|
281
|
+
if (!promise) {
|
|
282
|
+
promise = Promise.resolve().then(() => {
|
|
283
|
+
promise = void 0;
|
|
284
|
+
if (isListenerActive) {
|
|
285
|
+
callback(ops.splice(0));
|
|
286
|
+
}
|
|
287
|
+
});
|
|
288
|
+
}
|
|
289
|
+
};
|
|
290
|
+
const removeListener = addListener(listener);
|
|
291
|
+
isListenerActive = true;
|
|
292
|
+
return () => {
|
|
293
|
+
isListenerActive = false;
|
|
294
|
+
removeListener();
|
|
295
|
+
};
|
|
296
|
+
}
|
|
297
|
+
function snapshot(proxyObject) {
|
|
298
|
+
const proxyState = proxyStateMap.get(proxyObject);
|
|
299
|
+
if ((import.meta.env ? import.meta.env.MODE : void 0) !== "production" && !proxyState) {
|
|
300
|
+
console.warn("Please use proxy object");
|
|
301
|
+
}
|
|
302
|
+
const [target, ensureVersion] = proxyState;
|
|
303
|
+
return createSnapshot(target, ensureVersion());
|
|
304
|
+
}
|
|
305
|
+
function ref$1(obj) {
|
|
306
|
+
refSet.add(obj);
|
|
307
|
+
return obj;
|
|
308
|
+
}
|
|
309
|
+
|
|
310
|
+
const eventNames = {
|
|
311
|
+
"details.open": "toggle",
|
|
312
|
+
"input.value": "input",
|
|
313
|
+
"input.checked": "input",
|
|
314
|
+
"select.value": "change",
|
|
315
|
+
"select.selectedIndex": "change",
|
|
316
|
+
};
|
|
317
|
+
const boolProps = [
|
|
318
|
+
"allowfullscreen",
|
|
319
|
+
"alpha",
|
|
320
|
+
"async",
|
|
321
|
+
"autofocus",
|
|
322
|
+
"autoplay",
|
|
323
|
+
"checked",
|
|
324
|
+
"controls",
|
|
325
|
+
"default",
|
|
326
|
+
"defer",
|
|
327
|
+
"disabled",
|
|
328
|
+
"formnovalidate",
|
|
329
|
+
"inert",
|
|
330
|
+
"ismap",
|
|
331
|
+
"itemscope",
|
|
332
|
+
"loop",
|
|
333
|
+
"multiple",
|
|
334
|
+
"muted",
|
|
335
|
+
"nomodule",
|
|
336
|
+
"novalidate",
|
|
337
|
+
"open",
|
|
338
|
+
"playsinline",
|
|
339
|
+
"readonly",
|
|
340
|
+
"required",
|
|
341
|
+
"reversed",
|
|
342
|
+
"selected",
|
|
343
|
+
"shadowrootclonable",
|
|
344
|
+
"shadowrootcustomelementregistry",
|
|
345
|
+
"shadowrootdelegatesfocus",
|
|
346
|
+
"shadowrootserializable",
|
|
347
|
+
// from windstorm
|
|
348
|
+
"sticky-header"
|
|
349
|
+
];
|
|
350
|
+
|
|
351
|
+
const tagGetValue = {
|
|
352
|
+
details: (element) => element.open,
|
|
353
|
+
input: (element) => {
|
|
354
|
+
if (element.type === "checkbox") {
|
|
355
|
+
return element.checked
|
|
356
|
+
}
|
|
357
|
+
if (element.type === "number") {
|
|
358
|
+
if (isNaN(element.valueAsNumber) === true) {
|
|
359
|
+
return null
|
|
360
|
+
}
|
|
361
|
+
return element.valueAsNumber
|
|
362
|
+
}
|
|
363
|
+
if (element.type === "date") {
|
|
364
|
+
return element.valueAsDate
|
|
365
|
+
}
|
|
366
|
+
return element.value
|
|
367
|
+
}
|
|
368
|
+
};
|
|
369
|
+
const registerInputValue = (tag, getter) => {
|
|
370
|
+
const name = tag.toLowerCase();
|
|
371
|
+
if (tagGetValue[name] !== undefined) {
|
|
372
|
+
return
|
|
373
|
+
}
|
|
374
|
+
tagGetValue[tag.toLowerCase()] = getter;
|
|
375
|
+
};
|
|
376
|
+
|
|
377
|
+
var options = /*#__PURE__*/Object.freeze({
|
|
378
|
+
__proto__: null,
|
|
379
|
+
boolProps: boolProps,
|
|
380
|
+
eventNames: eventNames,
|
|
381
|
+
registerInputValue: registerInputValue,
|
|
382
|
+
tagGetValue: tagGetValue
|
|
383
|
+
});
|
|
384
|
+
|
|
385
|
+
const propMods = [
|
|
386
|
+
(comp, props) => {
|
|
387
|
+
if (typeof comp === "string") {
|
|
388
|
+
return props
|
|
389
|
+
}
|
|
390
|
+
|
|
391
|
+
const { slot, ...rest } = props;
|
|
392
|
+
const filtered = {
|
|
393
|
+
slot: slot ?? {}
|
|
394
|
+
};
|
|
395
|
+
Object.keys(rest).forEach(
|
|
396
|
+
(key) => {
|
|
397
|
+
const value = props[key];
|
|
398
|
+
if (key.startsWith("slot:") === true) {
|
|
399
|
+
filtered.slot[key.slice(5)] = value;
|
|
400
|
+
return
|
|
401
|
+
}
|
|
402
|
+
filtered[key] = value;
|
|
403
|
+
}
|
|
404
|
+
);
|
|
405
|
+
return filtered
|
|
406
|
+
},
|
|
407
|
+
(comp, props) => {
|
|
408
|
+
if (typeof comp !== "string") {
|
|
409
|
+
return props
|
|
410
|
+
}
|
|
411
|
+
const filtered = {};
|
|
412
|
+
Object.keys(props).forEach(
|
|
413
|
+
(key) => {
|
|
414
|
+
const value = props[key];
|
|
415
|
+
if (key === "slot") {
|
|
416
|
+
return
|
|
417
|
+
}
|
|
418
|
+
if (key.startsWith("$$") === true) {
|
|
419
|
+
const prop = key.slice(2);
|
|
420
|
+
const target = `${comp.toLowerCase()}.${prop}`;
|
|
421
|
+
const evtname = eventNames[target] ?? "input";
|
|
422
|
+
filtered[prop] = value.value;
|
|
423
|
+
filtered[`on${evtname}`] = value.update;
|
|
424
|
+
return
|
|
425
|
+
}
|
|
426
|
+
if (key.startsWith("$") === true) {
|
|
427
|
+
return
|
|
428
|
+
}
|
|
429
|
+
// if prop is a boolean then pass the bool value, even if false
|
|
430
|
+
if (boolProps.includes(key) === true) {
|
|
431
|
+
filtered[key] = (value === true);
|
|
432
|
+
return
|
|
433
|
+
}
|
|
434
|
+
if (value === false || value === null) {
|
|
435
|
+
return
|
|
436
|
+
}
|
|
437
|
+
filtered[key] = (value === true) ? "" : value;
|
|
438
|
+
}
|
|
439
|
+
);
|
|
440
|
+
return filtered
|
|
441
|
+
},
|
|
442
|
+
// allow ws prop across entire codebase, convert at last minute
|
|
443
|
+
(component, props) => {
|
|
444
|
+
if (typeof component !== "string") {
|
|
445
|
+
return props
|
|
446
|
+
}
|
|
447
|
+
if (props.ws === undefined) {
|
|
448
|
+
return props
|
|
449
|
+
}
|
|
450
|
+
const { ws, ...rest } = props;
|
|
451
|
+
return { "data-ws": ws, ...rest }
|
|
452
|
+
},
|
|
453
|
+
];
|
|
454
|
+
const modProps = (comp, props) => {
|
|
455
|
+
let modifiedProps = props;
|
|
456
|
+
for (const mod of propMods) {
|
|
457
|
+
modifiedProps = mod(comp, modifiedProps);
|
|
458
|
+
}
|
|
459
|
+
return modifiedProps
|
|
460
|
+
};
|
|
461
|
+
|
|
462
|
+
const diffChildren = (prev, next) => {
|
|
463
|
+
const nxt = next.children;
|
|
464
|
+
const prv = prev.children;
|
|
465
|
+
if (nxt.length !== prv.length) {
|
|
466
|
+
return true
|
|
467
|
+
}
|
|
468
|
+
const difIndex = nxt.findIndex(
|
|
469
|
+
(item, index) => prv[index] !== item
|
|
470
|
+
);
|
|
471
|
+
return difIndex !== -1
|
|
472
|
+
};
|
|
473
|
+
|
|
474
|
+
const versionCache = new WeakMap();
|
|
475
|
+
const valtimemo = (prev, next) => {
|
|
476
|
+
const prevVersion = versionCache.get(prev);
|
|
477
|
+
const nextVersion = Math.max(
|
|
478
|
+
...Object.values(next).map(
|
|
479
|
+
value => getVersion(value) ?? 0
|
|
480
|
+
)
|
|
481
|
+
);
|
|
482
|
+
versionCache.set(next, nextVersion);
|
|
483
|
+
if (prevVersion !== nextVersion) {
|
|
484
|
+
return false
|
|
485
|
+
}
|
|
486
|
+
|
|
487
|
+
const keys = [...Object.keys(prev), ...Object.keys(next)];
|
|
488
|
+
for (const key of keys) {
|
|
489
|
+
if (key === "children" && diffChildren(prev, next) === true) {
|
|
490
|
+
return false
|
|
491
|
+
}
|
|
492
|
+
if (prev[key] !== next[key]) {
|
|
493
|
+
return false
|
|
494
|
+
}
|
|
495
|
+
}
|
|
496
|
+
return true
|
|
497
|
+
};
|
|
498
|
+
|
|
499
|
+
const cache$1 = new WeakMap();
|
|
500
|
+
const memod = (component) => {
|
|
501
|
+
if (typeof component === "string") {
|
|
502
|
+
return component
|
|
503
|
+
}
|
|
504
|
+
if (component.noMemo === true) {
|
|
505
|
+
return component
|
|
506
|
+
}
|
|
507
|
+
if (cache$1.has(component) === true) {
|
|
508
|
+
return cache$1.get(component)
|
|
509
|
+
}
|
|
510
|
+
cache$1.set(
|
|
511
|
+
component,
|
|
512
|
+
N$1(component, valtimemo)
|
|
513
|
+
);
|
|
514
|
+
return cache$1.get(component)
|
|
515
|
+
};
|
|
516
|
+
const normalizeChildren = (props, children) => {
|
|
517
|
+
const source = (children.length > 0) ? children : props.children;
|
|
518
|
+
const list =
|
|
519
|
+
[source]
|
|
520
|
+
.flat(Number.POSITIVE_INFINITY)
|
|
521
|
+
.filter(
|
|
522
|
+
item => (
|
|
523
|
+
item !== null
|
|
524
|
+
&& item !== false
|
|
525
|
+
&& item !== undefined
|
|
526
|
+
)
|
|
527
|
+
);
|
|
528
|
+
return {
|
|
529
|
+
...props,
|
|
530
|
+
children: list,
|
|
531
|
+
}
|
|
532
|
+
};
|
|
533
|
+
const Element = (comp, props, ...children) => {
|
|
534
|
+
if (comp === undefined || comp === null) {
|
|
535
|
+
return null
|
|
536
|
+
}
|
|
537
|
+
|
|
538
|
+
return k$3(
|
|
539
|
+
memod(comp),
|
|
540
|
+
modProps(
|
|
541
|
+
comp,
|
|
542
|
+
normalizeChildren(props, children)
|
|
543
|
+
)
|
|
544
|
+
)
|
|
545
|
+
};
|
|
546
|
+
|
|
547
|
+
const randName = () => {
|
|
548
|
+
const rand = Math.floor(Math.random() * 1679615).toString(36);
|
|
549
|
+
return `${Date.now().toString(36)}${rand}`
|
|
550
|
+
};
|
|
551
|
+
const randKey = () => {
|
|
552
|
+
const rand = Math.floor(Math.random() * 4294967296).toString(36);
|
|
553
|
+
return `${Date.now().toString(36)}:${rand}`
|
|
554
|
+
};
|
|
555
|
+
|
|
556
|
+
const ref = (obj) => {
|
|
557
|
+
if (obj === null || obj === undefined) {
|
|
558
|
+
return null
|
|
559
|
+
}
|
|
560
|
+
return ref$1(obj)
|
|
561
|
+
};
|
|
562
|
+
|
|
563
|
+
const getInputValue = (element) => {
|
|
564
|
+
const tag = element.tagName?.toLowerCase?.() ?? null;
|
|
565
|
+
const getValue = tagGetValue[tag];
|
|
566
|
+
return getValue?.(element) ?? element.value
|
|
567
|
+
};
|
|
568
|
+
|
|
569
|
+
const __eachAlt = (list, alt) =>
|
|
570
|
+
(list.length > 0) ? list : alt();
|
|
571
|
+
|
|
572
|
+
const SubSlot = (props) => props.children;
|
|
573
|
+
const Slot = (props) => {
|
|
574
|
+
const { "*render": render, ...pass } = props;
|
|
575
|
+
if (render === null || render === undefined) {
|
|
576
|
+
return null
|
|
577
|
+
}
|
|
578
|
+
if (typeof render === "string") {
|
|
579
|
+
return render
|
|
580
|
+
}
|
|
581
|
+
return Element(
|
|
582
|
+
SubSlot,
|
|
583
|
+
{ children: render(pass) }
|
|
584
|
+
)
|
|
585
|
+
};
|
|
586
|
+
|
|
587
|
+
// import { updateFuncs } from "./merge-tools.js"
|
|
588
|
+
|
|
589
|
+
const sharedState = (proxy) => {
|
|
590
|
+
const [value, set] = d$2(
|
|
591
|
+
Date.now() + Math.random()
|
|
592
|
+
);
|
|
593
|
+
h$2(
|
|
594
|
+
() => subscribe(
|
|
595
|
+
proxy,
|
|
596
|
+
() => set(
|
|
597
|
+
Date.now() + Math.random()
|
|
598
|
+
)
|
|
599
|
+
),
|
|
600
|
+
[]
|
|
601
|
+
);
|
|
602
|
+
return proxy
|
|
603
|
+
};
|
|
604
|
+
|
|
605
|
+
const localState = (baseValue) => {
|
|
606
|
+
const [localProxy, cleanup] = T$2(
|
|
607
|
+
() => {
|
|
608
|
+
const state =
|
|
609
|
+
(typeof baseValue === "function")
|
|
610
|
+
? proxy(
|
|
611
|
+
baseValue()
|
|
612
|
+
)
|
|
613
|
+
: proxy(baseValue);
|
|
614
|
+
// updateFuncs(state)
|
|
615
|
+
const cleanup = subscribe(
|
|
616
|
+
state,
|
|
617
|
+
() => set(
|
|
618
|
+
Date.now() + Math.random()
|
|
619
|
+
)
|
|
620
|
+
);
|
|
621
|
+
return [state, cleanup]
|
|
622
|
+
},
|
|
623
|
+
[]
|
|
624
|
+
);
|
|
625
|
+
const [value, set] = d$2(
|
|
626
|
+
Date.now() + Math.random()
|
|
627
|
+
);
|
|
628
|
+
h$2(
|
|
629
|
+
() => {
|
|
630
|
+
return () => cleanup()
|
|
631
|
+
},
|
|
632
|
+
[]
|
|
633
|
+
);
|
|
634
|
+
return localProxy
|
|
635
|
+
};
|
|
636
|
+
|
|
637
|
+
const lock = (value) => {
|
|
638
|
+
if (typeof value === "function") {
|
|
639
|
+
return q$3(value, [])
|
|
640
|
+
}
|
|
641
|
+
const [lockedValue] = d$2(value);
|
|
642
|
+
return lockedValue
|
|
643
|
+
};
|
|
644
|
+
|
|
645
|
+
const calc = (f, changes = []) =>
|
|
646
|
+
T$2(f, changes);
|
|
647
|
+
|
|
648
|
+
const style$1 = document.createElement("style");
|
|
649
|
+
style$1.setAttribute("data-name", "zephyr-animations");
|
|
650
|
+
document.head.append(style$1);
|
|
651
|
+
|
|
652
|
+
const animation = (config) => {
|
|
653
|
+
const keyframes = [];
|
|
654
|
+
for (const [frame, styles] of Object.entries(config)) {
|
|
655
|
+
const entries = Object.entries(styles).map(
|
|
656
|
+
(entry) => `${entry[0]}: ${entry[1]};`
|
|
657
|
+
);
|
|
658
|
+
keyframes.push(`${frame} { ${entries.join("")} }`);
|
|
659
|
+
}
|
|
660
|
+
const name = `keyframes-${randName()}`;
|
|
661
|
+
style$1.sheet.insertRule(`@keyframes ${name} { ${keyframes.join(" ")} }`);
|
|
662
|
+
style$1.sheet.insertRule(`@keyframes ${name}-r { ${keyframes.join(" ")} }`);
|
|
663
|
+
return (duration, ease = "linear") =>
|
|
664
|
+
(suffix) => `${name}${suffix} ${duration}ms ${ease}`
|
|
665
|
+
};
|
|
666
|
+
const fade = animation({
|
|
667
|
+
"0%": {
|
|
668
|
+
opacity: 0
|
|
669
|
+
},
|
|
670
|
+
"100%": {
|
|
671
|
+
opacity: 1
|
|
672
|
+
},
|
|
673
|
+
});
|
|
674
|
+
const drop = animation({
|
|
675
|
+
"0%": {
|
|
676
|
+
scale: 1.4
|
|
677
|
+
},
|
|
678
|
+
"100%": {
|
|
679
|
+
scale: 1
|
|
680
|
+
},
|
|
681
|
+
});
|
|
682
|
+
const pop = animation({
|
|
683
|
+
"0%": {
|
|
684
|
+
scale: 0.6
|
|
685
|
+
},
|
|
686
|
+
"100%": {
|
|
687
|
+
scale: 1
|
|
688
|
+
},
|
|
689
|
+
});
|
|
690
|
+
const slideTop = animation({
|
|
691
|
+
"0%": {
|
|
692
|
+
translate: "0 -50px"
|
|
693
|
+
},
|
|
694
|
+
"100%": {
|
|
695
|
+
translate: "0 0px"
|
|
696
|
+
},
|
|
697
|
+
});
|
|
698
|
+
const slideBottom = animation({
|
|
699
|
+
"0%": {
|
|
700
|
+
translate: "0 50px"
|
|
701
|
+
},
|
|
702
|
+
"100%": {
|
|
703
|
+
translate: "0 0px"
|
|
704
|
+
},
|
|
705
|
+
});
|
|
706
|
+
const visible = animation({
|
|
707
|
+
"0%": {
|
|
708
|
+
visibility: "hidden",
|
|
709
|
+
},
|
|
710
|
+
"100%": {
|
|
711
|
+
visibility: "visible",
|
|
712
|
+
},
|
|
713
|
+
});
|
|
714
|
+
const spinCW = animation({
|
|
715
|
+
"0%": {
|
|
716
|
+
rotate: "0deg",
|
|
717
|
+
},
|
|
718
|
+
"100%": {
|
|
719
|
+
rotate: "360deg",
|
|
720
|
+
},
|
|
721
|
+
});
|
|
722
|
+
const fromLeft = animation({
|
|
723
|
+
"0%": {
|
|
724
|
+
translate: "-100% 0"
|
|
725
|
+
},
|
|
726
|
+
"100%": {
|
|
727
|
+
translate: "0% 0"
|
|
728
|
+
},
|
|
729
|
+
});
|
|
730
|
+
const fromRight = animation({
|
|
731
|
+
"0%": {
|
|
732
|
+
translate: "100% 0"
|
|
733
|
+
},
|
|
734
|
+
"100%": {
|
|
735
|
+
translate: "0% 0"
|
|
736
|
+
},
|
|
737
|
+
});
|
|
738
|
+
const fromTop = animation({
|
|
739
|
+
"0%": {
|
|
740
|
+
translate: "0 -100%"
|
|
741
|
+
},
|
|
742
|
+
"100%": {
|
|
743
|
+
translate: "0 0%"
|
|
744
|
+
},
|
|
745
|
+
});
|
|
746
|
+
const fromBottom = animation({
|
|
747
|
+
"0%": {
|
|
748
|
+
translate: "0 100%"
|
|
749
|
+
},
|
|
750
|
+
"100%": {
|
|
751
|
+
translate: "0 0%"
|
|
752
|
+
},
|
|
753
|
+
});
|
|
754
|
+
|
|
755
|
+
const register = (keyed, child, pos, local) => {
|
|
756
|
+
if (keyed.has(child.key) === true) {
|
|
757
|
+
const item = keyed.get(child.key);
|
|
758
|
+
item.child = child;
|
|
759
|
+
item.active = (item.phase === "none") ? child : item.active;
|
|
760
|
+
return item
|
|
761
|
+
}
|
|
762
|
+
const enter = [child.props.$enter ?? child.props.$animate].flat();
|
|
763
|
+
const exit = [child.props.$exit ?? child.props.$animate].flat();
|
|
764
|
+
const item = {
|
|
765
|
+
pos,
|
|
766
|
+
child,
|
|
767
|
+
phase: "enter",
|
|
768
|
+
anims: {
|
|
769
|
+
enter: enter.map(anim => `${anim("")} 0s 1 normal forwards`).join(", "),
|
|
770
|
+
enterCount: enter.length,
|
|
771
|
+
exit: exit.map(anim => `${anim("-r")} 0s 1 reverse forwards`).join(", "),
|
|
772
|
+
exitCount: exit.length,
|
|
773
|
+
},
|
|
774
|
+
clone(style, events) {
|
|
775
|
+
const baseStyle = child.props?.style ?? "";
|
|
776
|
+
return W$2(
|
|
777
|
+
child,
|
|
778
|
+
{
|
|
779
|
+
...child.props,
|
|
780
|
+
style: `${baseStyle};animation: ${style};`,
|
|
781
|
+
...events,
|
|
782
|
+
}
|
|
783
|
+
)
|
|
784
|
+
},
|
|
785
|
+
};
|
|
786
|
+
let count = 0;
|
|
787
|
+
item.active = item.clone(
|
|
788
|
+
item.anims.enter,
|
|
789
|
+
{
|
|
790
|
+
"onanimationend": () => {
|
|
791
|
+
count += 1;
|
|
792
|
+
if (count < item.anims.enterCount) {
|
|
793
|
+
return
|
|
794
|
+
}
|
|
795
|
+
item.phase = "none";
|
|
796
|
+
item.active = item.clone("none", {});
|
|
797
|
+
local.update = Math.random();
|
|
798
|
+
}
|
|
799
|
+
}
|
|
800
|
+
);
|
|
801
|
+
keyed.set(child.key, item);
|
|
802
|
+
return item
|
|
803
|
+
};
|
|
804
|
+
const Transitions = (props) => {
|
|
805
|
+
const { children, enter, exit = enter, anim } = props;
|
|
806
|
+
const keyed = lock(new Map());
|
|
807
|
+
const local = localState({
|
|
808
|
+
update: null
|
|
809
|
+
});
|
|
810
|
+
|
|
811
|
+
const display = [];
|
|
812
|
+
const current = children.map(
|
|
813
|
+
(child, pos) => {
|
|
814
|
+
const item = register(keyed, child, pos, local);
|
|
815
|
+
display.push(
|
|
816
|
+
item.active
|
|
817
|
+
);
|
|
818
|
+
return child.key
|
|
819
|
+
}
|
|
820
|
+
);
|
|
821
|
+
keyed.keys().forEach(
|
|
822
|
+
key => {
|
|
823
|
+
if (current.includes(key) === true) {
|
|
824
|
+
return
|
|
825
|
+
}
|
|
826
|
+
const item = keyed.get(key);
|
|
827
|
+
if (item.phase === "exit") {
|
|
828
|
+
display.splice(item.pos, 0, item.active);
|
|
829
|
+
return
|
|
830
|
+
}
|
|
831
|
+
let count = 0;
|
|
832
|
+
item.phase = "exit";
|
|
833
|
+
item.active = item.clone(
|
|
834
|
+
item.anims.exit,
|
|
835
|
+
{
|
|
836
|
+
"onanimationend": () => {
|
|
837
|
+
count += 1;
|
|
838
|
+
if (count < item.anims.exitCount) {
|
|
839
|
+
return
|
|
840
|
+
}
|
|
841
|
+
keyed.delete(key);
|
|
842
|
+
local.update = Math.random();
|
|
843
|
+
}
|
|
844
|
+
}
|
|
845
|
+
);
|
|
846
|
+
display.splice(item.pos, 0, item.active);
|
|
847
|
+
}
|
|
848
|
+
);
|
|
849
|
+
|
|
850
|
+
return display
|
|
851
|
+
};
|
|
852
|
+
|
|
853
|
+
const e=Symbol("no match"),t=(t,r)=>{const o=r=>{const o=r.length;return ()=>r===t.substr(N,o)?(N+=o,r):e},a=r=>()=>{const o=t.charAt(N);return false!==r.test(o)?(N+=1,o):e};let s=null;const i=o("@"),n=o(":"),l=a(/[^;]/),c=o(";"),d=o("*"),p=a(/[a-z0-9_\-]/i),h=o("!"),u=a(/[^{]/),g=o("{"),f=o("}"),b=a(/[a-zA-Z0-9\.\-_#\^\$\/]/),m=o("#"),x=a(/[^;#]/),v=a(/[\s]/m),w=()=>{const t=N;let r=null,o=null;return (r=P())===e||(o=z())===e?(N=t,e):[r,o]},y=()=>{const r=N;let o=null,a=null;return (o=m())===e||(a=(()=>{const r=N,o=N;for(;x()!==e;);return N-o==0?e:t.slice(r,N)})())===e?(N=r,e):[o,a]},k=()=>{s="rules";let t=N,r=null;const o=[];let a=null;for(;(a=w())!==e;)o.push(a);if(r=o,P()===e)return N=t,e;return r.map((e=>e[1]))},z=()=>{let t=null;return (t=$())!==e||(t=A())!==e||(t=L())!==e||(t=E())!==e?t:e},$=()=>{s="rule$0";let t=N,r=null;if((r=S())===e)return N=t,e;return r},A=()=>{s="rule$1";let t=N,r=null;if((r=q())===e)return N=t,e;return r},L=()=>{s="rule$2";let t=N,r=null;if((r=C())===e)return N=t,e;return r},E=()=>{s="rule$3";let t=N,r=null;if((r=T())===e)return N=t,e;return r},S=()=>{s="variable";let r=N,o=null,a=null;if(i()===e)return N=r,e;if((o=M())===e)return N=r,e;if(n()===e)return N=r,e;if(P()===e)return N=r,e;if((a=(()=>{const r=N,o=N;for(;l()!==e;);return N-o==0?e:t.slice(r,N)})())===e)return N=r,e;if(c()===e)return N=r,e;return ((e,t)=>({type:"var",name:e,value:t}))(o,a)},q=()=>{s="css";let r=N,o=null,a=null;if(d()===e)return N=r,e;if((o=M())===e)return N=r,e;if(n()===e)return N=r,e;if(P()===e)return N=r,e;if((a=(()=>{const r=N,o=N;for(;l()!==e;);return N-o==0?e:t.slice(r,N)})())===e)return N=r,e;if(c()===e)return N=r,e;return ((e,t)=>({type:"css",name:e,value:t}))(o,a)},M=()=>{s="cssName";let r=N,o=null;if((o=(()=>{const r=N,o=N;for(;p()!==e;);return N-o==0?e:t.slice(r,N)})())===e)return N=r,e;return o},C=()=>{s="subrule";let r=N,o=null,a=null;if(h()===e)return N=r,e;if(P()===e)return N=r,e;if((o=(()=>{const r=N,o=N;for(;u()!==e;);return N-o==0?e:t.slice(r,N)})())===e)return N=r,e;if(g()===e)return N=r,e;if((a=k())===e)return N=r,e;if(f()===e)return N=r,e;var i;return i=a,{type:"alt",selector:o.trim(),rules:i}},T=()=>{s="macro";let r=N,o=null,a=null;if((o=(()=>{const r=N,o=N;for(;b()!==e;);return N-o==0?e:t.slice(r,N)})())===e)return N=r,e;const i=(()=>{const t=N;let r=null,o=null,a=null;return (r=n())===e||(o=P())===e||(a=I())===e?(N=t,e):[r,o,a]})();if(a=i===e?null:i,c()===e)return N=r,e;return ((e,t)=>({type:"macro",name:e,value:t?.[2]}))(o,a)},I=()=>{let t=null;return (t=V())!==e||(t=j())!==e?t:e},V=()=>{s="macroValue$0";let t=null;const r=[];let o=null;for(;(o=y())!==e;)r.push(o);if(0===r.length)return e;t=r;return (e=>{const t=e.map((e=>e[1].trim()));return t.arg=t.join(" "),t})(t)},j=()=>{s="macroValue$1";let r=N,o=null;if((o=(()=>{const r=N,o=N;for(;l()!==e;);return N-o==0?e:t.slice(r,N)})())===e)return N=r,e;return (e=>{const t=[e.trim()];return t.arg=e,t})(o)},P=()=>{for(s="_";v()!==e;);};let N=0;const H=(()=>{s="$";let t=N,r=null;if((r=k())===e)return N=t,e;return r})();return N!==t.length?(console.log("last",s),console.log("@",N),console.log(t.slice(N-10,N+10)),new Error("End of input not found")):H},r=document.createElement("style");r.setAttribute("data-name","windstorm-generated"),r.innerHTML="@layer ws.custom ws.user ws.element;",document.head.append(r);const o=(e,...r)=>{const o=String.raw(e,...r);return a(t(o),{"&":[]},"&")},a=(e,t,r)=>{for(const o of e)i(o,t,r);return t},s=e=>e.replace(/@([a-zA-Z0-9\-_]+)/g,((e,t)=>`var(--${t})`)),i=(e,t,r)=>{if("var"===e.type)return void t[r].push(`--${e.name}: ${s(e.value)};`);if("css"===e.type)return void t[r].push(`${e.name}: ${s(e.value)};`);if("macro"===e.type){const o=n[e.name];if(void 0===o)return void console.warn(`no macro for "${e.name}"`);for(const[a,i]of Object.entries(o)){const o=a.replace("&",r);t[o]=t[o]??[],t[o].push(...i.map((t=>s(t.replace(/%(arg|\d+)/g,((t,r)=>e.value?.[r]??""))))));}return}const o=e.selector.replaceAll("&",r);t[o]=[...t[o]??[]],a(e.rules,t,o);},n={},l=e=>void 0!==n[e]?()=>{}:(t,...r)=>n[e]=o(t,...r),c=e=>Object.entries(e).reduce(((e,[t,r])=>{if(true===t.startsWith("|")){const o=t.lastIndexOf("|"),a=[`@media (${t.slice(1,o)}) {`,`${`&${t.slice(o+1)}`} {`,...r,"}","}"].join("\n");return e.push(a),e}return e.push(`${t} {\n${r.join("\n")}\n}`),e}),[]),d=(e,t="ws.custom")=>(a,...s)=>{const i=o(a,...s);e.startsWith("@");const n=c(i).map((t=>t.replaceAll("&",e))),l=`@layer ${t} { ${n.join("\n")} }`;r.sheet.insertRule(l);};const p={origin:"https://wind-cdn.axel669.net",...window.wsConfig,version:"1.0.0-beta.10",iconVersion:"3.34.0"},h={},u=async(e,t)=>{const r=h[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 a=new FontFace(o,`url(${p.origin}/icon/${t}.woff?v${p.iconVersion})`);h[t]=a;try{await a.load();}catch(e){console.error(e);}document.fonts.add(a),u(e,t);},g=e=>{if(void 0===e.tagName)return;const t=e.dataset.icon??null;null!==t&&u(e,t);},f={childList(e){0!==e.addedNodes.length&&e.addedNodes.forEach((e=>{if(void 0===e.tagName)return;[e,...e.querySelectorAll("*")].forEach(g);}));},attributes(e){g(e.target);}};new MutationObserver((e=>e.forEach((e=>f[e.type](e))))).observe(document.body,{subtree:true,attributes:true,childList:true,attributeFilter:["data-icon"]});const b=(...e)=>{for(const t of e)u(null,t);};l("appr")`*apperance:%arg; *-webkit-appearance:%arg;`,l("area")`*grid-area:%arg;`,l("b")`*border:%arg;`,l("b.b")`*border-bottom:%arg;`,l("b.b.c")`*border-bottom-color:%arg;`,l("b.b.s")`*border-bottom-style:%arg;`,l("b.b.w")`*border-bottom-width:%arg;`,l("b.c")`*border-color:%arg;`,l("b.l")`*border-left:%arg;`,l("b.l.c")`*border-left-color:%arg;`,l("b.l.s")`*border-left-style:%arg;`,l("b.l.w")`*border-left-width:%arg;`,l("b.r")`*border-right:%arg;`,l("b.r.c")`*border-right-color:%arg;`,l("b.r.s")`*border-right-style:%arg;`,l("b.r.w")`*border-right-width:%arg;`,l("b.s")`*border-style:%arg;`,l("b.t")`*border-top:%arg;`,l("b.t.c")`*border-top-color:%arg;`,l("b.t.s")`*border-top-style:%arg;`,l("b.t.w")`*border-top-width:%arg;`,l("b.w")`*border-width:%arg;`,l("b.x")`*border-left:%arg; *border-right:%arg;`,l("b.x.c")`*border-left-color:%arg; *border-right-color:%arg;`,l("b.x.s")`*border-left-style:%arg; *border-right-style:%arg;`,l("b.x.w")`*border-left-width:%arg; *border-right-width:%arg;`,l("b.y")`*border-top:%arg; *border-bottom:%arg;`,l("b.y.c")`*border-top-color:%arg; *border-bottom-color:%arg;`,l("b.y.s")`*border-top-style:%arg; *border-bottom-style:%arg;`,l("b.y.w")`*border-top-width:%arg; *border-bottom-width:%arg;`,l("bg")`*background:%arg;`,l("bg.att")`*background-attachment:%arg;`,l("bg.c")`*background-color:%arg;`,l("bg.img")`*background-image:%arg;`,l("bg.pos")`*background-position:%arg;`,l("bg.rep")`*background-repeat:%arg;`,l("bg.sz")`*background-size:%arg;`,l("c")`*color:%arg;`,l("col")`*grid-column:%arg;`,l("cur")`*cursor:%arg;`,l("disp")`*display:%arg;`,l("fl.basis")`*flex-basis:%arg;`,l("fl.cross")`*align-items:%arg;`,l("fl.dir")`*flex-direction:%arg;`,l("fl.flow")`*flex-flow:%arg;`,l("fl.grow")`*flex-grow:%arg;`,l("fl.main")`*justify-content:%arg;`,l("fl.shrink")`*flex-shrink:%arg;`,l("fl.size")`*flex:%arg;`,l("fl.wr")`*flex-wrap:%arg;`,l("font")`*font-family:%arg;`,l("gap")`*gap:%arg;`,l("gap.col")`*column-gap:%arg;`,l("gap.row")`*row-gap:%arg;`,l("gr.areas")`*grid-template-areas:%arg;`,l("gr.cols")`*grid-template-columns:%arg;`,l("gr.cols.a")`*grid-auto-columns:%arg;`,l("gr.flow")`*grid-auto-flow:%arg;`,l("gr.rows")`*grid-template-rows:%arg;`,l("gr.rows.a")`*grid-auto-rows:%arg;`,l("h")`*height:%arg;`,l("h.max")`*max-height:%arg;`,l("h.min")`*min-height:%arg;`,l("inset")`*top:%arg; *left:%arg; *bottom:%arg; *right:%arg;`,l("inset.x")`*left:%arg; *right:%arg;`,l("inset.y")`*top:%arg; *bottom:%arg;`,l("m")`*margin:%arg;`,l("m.b")`*margin-bottom:%arg;`,l("m.l")`*margin-left:%arg;`,l("m.r")`*margin-right:%arg;`,l("m.t")`*margin-top:%arg;`,l("m.x")`*margin-left:%arg; *margin-right:%arg;`,l("m.y")`*margin-bottom:%arg; *margin-top:%arg;`,l("o")`*opacity:%arg;`,l("outln")`*outline:%arg;`,l("over")`*overflow:%arg;`,l("over.x")`*overflow-x:%arg;`,l("over.y")`*overflow-y:%arg;`,l("p")`*padding:%arg;`,l("p.b")`*padding-bottom:%arg;`,l("p.l")`*padding-left:%arg;`,l("p.r")`*padding-right:%arg;`,l("p.t")`*padding-top:%arg;`,l("p.x")`*padding-left:%arg; *padding-right:%arg;`,l("p.y")`*padding-top:%arg; *padding-bottom:%arg;`,l("pos")`*position:%arg;`,l("pos.abs")`*position:absolute;`,l("pos.fix")`*position:fixed;`,l("pos.rel")`*position:relative;`,l("pos.stick")`*position:sticky;`,l("r")`*border-radius:%arg;`,l("r.b")`*border-bottom-left-radius:%arg; *border-bottom-right-radius:%arg;`,l("r.bl")`*border-bottom-left-radius:%arg;`,l("r.br")`*border-bottom-right-radius:%arg;`,l("r.l")`*border-top-left-radius:%arg; *border-bottom-left-radius:%arg;`,l("r.r")`*border-top-right-radius:%arg; *border-bottom-right-radius:%arg;`,l("r.t")`*border-top-left-radius:%arg; *border-top-right-radius:%arg;`,l("r.tl")`*border-top-left-radius:%arg;`,l("r.tr")`*border-top-right-radius:%arg;`,l("row")`*grid-row:%arg;`,l("sel")`*user-select:%arg;`,l("self.cross")`*align-self:%arg;`,l("self.main")`*justify-self:%arg;`,l("sh.box")`*box-shadow:%arg;`,l("sh.text")`*text-shadow:%arg;`,l("t.a")`*text-align:%arg;`,l("t.br")`*word-break:%arg;`,l("t.c")`*color:%arg;`,l("t.deco")`*text-decoration:%arg;`,l("t.lh")`*line-height:%arg;`,l("t.over")`*text-overflow:%arg;`,l("t.st")`*font-style:%arg;`,l("t.sz")`*font-size:%arg;`,l("t.tf")`*text-transform:%arg;`,l("t.var")`*font-variant:%arg;`,l("t.wrap")`*word-wrap:%arg;`,l("t.ws")`*white-space:%arg;`,l("t.wt")`*font-weight:%arg;`,l("tf")`*transform:%arg;`,l("tf.o")`*transform-origin:%arg;`,l("tf.p")`*perspective:%arg;`,l("tr")`*transition:%arg;`,l("v.a")`*vertical-align:%arg;`,l("vis")`*visibility:%arg;`,l("w")`*width:%arg;`,l("w.max")`*max-width:%arg;`,l("w.min")`*min-width:%arg;`,l("x")`*left:%arg;`,l("-x")`*right:%arg;`,l("y")`*top:%arg;`,l("-y")`*bottom:%arg;`,l("z")`*z-index:%arg;`,l("fl.cn")`fl.cross:center; fl.main:center;`,l("fl.cn.cross")`fl.cross:center;`,l("fl.cn.main")`fl.main:center;`,l("flex")`disp:flex; fl.dir:%arg;`,l("grid")`disp:grid; gr.flow:%arg;`,l("hide")`disp:none;`,l("invis")`vis:hidden;`,l("sticky")`pos:sticky; y:0px; z:+1;`,l("adorn")`disp:flex; fl.cn; p:4px;`,l("pad.compact")`p:0px 4px;`,l("var.outln")`b.w:1px;`,l("var.fill")` @text-color:@c2; @fill-color:@c1; @active:@c2; b.c:transparent; `,l("fill.reset")` @text-color:initial; @fill-color:initial; `,l("var.lined")`b.w:0px; b.b.w:@border-size; r.b:0px;`,l("gr.cols-fit")`*grid-template-columns:repeat(auto-fit, minmax(%arg));`,l("gr.cols-fill")`*grid-template-columns:repeat(auto-fill, minmax(%arg));`,l("text.subtitle")`t.sz:@text-size-subtitle; flex; fl.main:center; p:0px 8px;`,l("text.title")`t.sz:@text-size-title; flex; fl.main:center; p:4px 8px;`,l("raise")`sh.box:0px calc(%arg * 1px + 2px) calc(%arg * 1px + 1px) -1px @shadow-color; z:+%arg;`,l("raised")`raise:1;`,l("scrollable")`over:auto;`,l("#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; `,l("#no-animate")` @modal-transition:none; @dialog-transition:none; @popover-transition:none; @drawer-transition:none; `,l("#no-select-animate")` @select-cancel:none; `,l("layout.base")` over:hidden; disp:grid; ! body > & { pos:absolute; x:0px; y:0px; w:100%; h:100%; } ! :where(&) > * { area:content; } `,l("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] ; `,l("layout.3row-center")` @height:auto; layout.base; disp:grid; gr.cols.a:1fr; gr.rows:1fr @height 1fr; gr.areas:"top" "content" "bottom"; `,l("layout.3col-center")` @width:auto; layout.base; disp:grid; gr.cols:1fr @width 1fr; gr.rows.a:1fr; gr.areas:"left content right"; `,l("layout.3row-controls")` layout.base; disp:grid; gr.cols.a:1fr; gr.rows:min-content 1fr min-content; gr.areas:"header" "content" "footer"; `,l("layout.3col-controls")` layout.base; disp:grid; gr.cols:min-content 1fr min-content; gr.rows.a:1fr; gr.areas:"menu content action"; `,l("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 m=e=>Object.entries(e).reduce(((e,t)=>{const[r,o]=t;return null==o||false===o?e:true===o?(e.push(`${r};`),e):"object"==typeof o?(e.push(`${r} { ${m(o)} }`),e):(e.push(`${r}: ${o};`),e)}),[]).join(" "),x=(e,t="ws.user")=>d(e,t),v=p.version,w={get mobile(){return matchMedia("(hover: none)")}};d("*")` *box-sizing:border-box; *-webkit-tap-highlight-color:transparent; *border-width:0px; *border-style:solid; *outline-color:hsl(@mono, @layer-text); `,d("html, body")` *padding:0px; *margin:0px; *width:100%; *height:100%; *-webkit-tap-highlight-color:transparent; *-webkit-font-smoothing:antialiased; `,d("@font-face",null)` *font-family:Tektur; *font-display:swap; *src:url(${p.origin}/font/tektur.woff2?v${p.version}) format("woff2") ; `,d("@font-face",null)` *font-family:Roboto; *font-display:swap; *src:url(${p.origin}/font/roboto.woff2?v${p.version}) format("woff2") ; `;const y=Math.ceil(screen.height*devicePixelRatio*10)%10>=5;l("#theme.base")` font:@font; @sub-pixel-offset:${y?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; `,l("#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; `,l("#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; `,l("#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 k=(e,...t)=>{const r=String.raw(e,...t),o=document.createElement("template");return o.innerHTML=r,()=>o.content.cloneNode(true)};d("ws-circle-spinner, ws-hexagon-spinner")` @size:100px; w:@size; h:@size; disp:inline-block; `;const z=k` <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(z());}});const $=k` <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($());}});var A=(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; `;d("ws-avatar")` @color:@mono; @size:36px; ${A("@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; } `,d("ws-badge")` @color:@primary; ${A("@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 L=' 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; } ',E=' 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; } } ';d(":where(button[data-ws], a[data-ws][button], label[data-ws][button])")` @color:@primary; ${A("@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); } ${E} ${L} `,d("ws-chip")` @color:@mono; ${A("@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; ${L} } `,d("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; } `,b("caret-right-filled"),d(":where(details[data-ws])")` @color:@primary; @padding:8px; ${A("@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); } `,d("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; } `,d("ws-drawer")` pos:absolute; x:0px; y:0px; -y:0px; disp:grid; tr:var(--drawer-transition, none); tf:translateX(-100%); ! [open] > & { tf:unset; } `,d("ws-flex")` flex:column; gap:8px; p:8px; over:hidden; ! & > * { fl.shrink:0; } `,d("ws-grid")` disp:grid; over:hidden; gap:8px; p:8px; gr.rows.a:min-content; `,d("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); *word-break:keep-all; m.t:2px; } `,d("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 S=k` <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:true}),this.#e.append(S());}connectedCallback(){window.addEventListener("keydown",(e=>{ true!==(false===this.open||"Escape"!==e.key||true===this.persistent)&&this.hide();}));this.#e.querySelector("ws-modal-overlay").addEventListener("click",(e=>{ true!==this.persistent&&this.hide();}));}get open(){return this.hasAttribute("open")}set open(e){if(false===e){if(false===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){ false!==e?this.setAttribute("persistent",""):this.removeAttribute("persistent");}get managed(){return this.hasAttribute("managed")}set managed(e){ false!==e?this.setAttribute("managed",""):this.removeAttribute("managed");}show(){this.open=true;}hide(e){ true!==this.managed||true===e?this.open=false:this.dispatchEvent(new Event("close"));}});const q=k` <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:true}),this.#e.append(q()),this.#t=this.#e.querySelector("ws-modal");}connectedCallback(){this.#t.addEventListener("close",(()=>{this.hide(),this.dispatchEvent(new Event("close"));})),false!==this.open&&(this.#t.open=this.open,this.setVars());}attributeChangedCallback(e,t,r){null!==r?(this.#t[e]=true,"open"===e&&this.setVars()):this.#t[e]=false;}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,false!==e?this.setAttribute("open",""):this.removeAttribute("open");}get persistent(){return this.hasAttribute("persistent")}set persistent(e){this.#t.persistent=e,false!==e?this.setAttribute("persistent",""):this.removeAttribute("persistent");}show(){this.open=true,this.focus();}hide(){this.open=false;}});const M=k` <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(M()),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){ false===e&&this.removeAttribute("value"),this.setAttribute("value",e?.toString()??"");}set buffer(e){ false===e&&this.removeAttribute("buffer"),this.setAttribute("buffer",e?.toString()??"");}set min(e){ false===e&&this.removeAttribute("min"),this.setAttribute("min",e?.toString()??"");}set max(e){ false===e&&this.removeAttribute("max"),this.setAttribute("max",e?.toString()??"");}set busy(e){ false===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 C="caret-down-filled";b(C),d("ws-option")` ${A("@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; } ${E} ${L} `,d("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 T=k` <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-${C}; 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="${C}"></ws-sel-caret> </value-display> <ws-popover> <slot slot="popover" name="options"> <ws-options> <slot></slot> </ws-options> </slot> </ws-popover> `,I="ws-option";customElements.define("ws-select",class extends HTMLElement{static formAssociated=true;#a=null;#s=-1;#i=null;#n=null;#l=null;#c=null;#e=null;#d=null;#p(){return [...this.querySelectorAll(I)]}#h(e){const t=Array.from(e,(e=>[...e.addedNodes])).flat();if(false===t.some((e=>e.tagName?.toLowerCase()===I)))return;const r=t.findLast((e=>e.tagName?.toLowerCase()===I&&true===e.hasAttribute("selected")))??this.#i,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:true}),this.#e.append(T()),this.#c=this.#e.querySelector("slot[name=selected]"),this.#l=this.#e.querySelector("ws-popover"),this.#d=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.#h.bind(this));e.observe(this,{childList:true,subtree:true}),this.#n=e,this.role="combobox",this.addEventListener("click",(()=>{this.open(),this.#d.focus();}),{passive:true}),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:true})),this.dispatchEvent(new Event("input",{bubbles:true})));}));}disconnectedCallback(){this.#n.disconnect();}get value(){return this.#a}set value(e){if(this.#a=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.#i?.removeAttribute("selected");const t=this.#p(),r=Math.min(e,t.length);this.#i=t[r]??null,this.#s=r,this.#i?.setAttribute("selected",""),this.#a=this.#i?.value??this.#i?.getAttribute("value")??this.#a,this.updatePreview();}updatePreview(){const e=this.querySelector("[slot=selected]")??this.#c;this.display.innerHTML=e.innerHTML,this.display.querySelector("ws-selected").innerHTML=this.#i?.getAttribute("preview")??this.#i?.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.#i?.scrollIntoView();}close(){this.removeAttribute("open"),this.#l.hide();}__childValueMatch(e){const t=this.#p().indexOf(e);this.selectedIndex=t;}}),d("ws-surface")` @color:@mono; ${A("@layer-surface","@layer-border")} r:@base-radius; over:hidden; bg.c:@c1; b.c:@c2; disp:grid; gr.cols:1fr; gr.rows:1fr; `,d("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; } `,d("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; } `,d("ws-tabs")` @color:@primary; ${A("@layer-element","@layer-fill","@layer-border")} disp:grid; gr.cols.a:1fr; gr.rows.a:1fr; gr.flow:column; *user-select:none; gap:4px; `,d("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; } } ${L} `,d("ws-titlebar")` @border-size:2px; @color:@primary; @text-color:initial; @fill-color:initial; ${A("@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; `,d("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; } `,d("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; } `,b("square-dashed","square-check-filled","circle","circle-check-filled","circle-filled");const V=' @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; } ';d(":where(input[data-ws][type=checkbox]:not([switch]))")` ${V} ! &::after { font:ws-icon-square-dashed; *content:"square-dashed"; } ! &:checked::after { font:ws-icon-square-check-filled; *content:"square-check-filled"; } `,d(":where(input[data-ws][type=radio])")` ${V} ! &::after { font:ws-icon-circle; *content:"circle"; } ! &:checked::after { font:ws-icon-circle-check-filled; *content:"circle-check-filled"; } `,d(":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); } `,d("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); } `,d("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 j={},P=e=>{const t=(e=>{if(""===e||null===e||"true"===e)return;const t=c(o({raw:[e]})),a=(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(j[a]=(j[a]??0)+1,j[a]>1)return a;const s=t.map((e=>e.replaceAll("&",`[data-wsid="${a}"]`)));return r.sheet.insertRule(`@layer ws.element { ${s.join("\n")} }`,r.sheet.cssRules.length),a})(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)P(e);})).observe(document.body,{subtree:true,attributes:true,childList:true,attributeFilter:["data-ws"]});for(const e of document.querySelectorAll("*"))P(e);
|
|
854
|
+
|
|
855
|
+
var wsEsm = /*#__PURE__*/Object.freeze({
|
|
856
|
+
__proto__: null,
|
|
857
|
+
component: x,
|
|
858
|
+
macro: l,
|
|
859
|
+
pageis: w,
|
|
860
|
+
preloadIcons: b,
|
|
861
|
+
version: v,
|
|
862
|
+
x: m
|
|
863
|
+
});
|
|
864
|
+
|
|
865
|
+
const empty = () => ({});
|
|
866
|
+
const style = (Base, addProps = empty) =>
|
|
867
|
+
(parts, ...values) => {
|
|
868
|
+
const wsProp = Base.wsPass ?? "ws";
|
|
869
|
+
const name = randName();
|
|
870
|
+
l(name)(parts, ...values);
|
|
871
|
+
const wrapper = D$1(
|
|
872
|
+
(props, ref) => {
|
|
873
|
+
const addedProps = addProps?.(props) ?? {};
|
|
874
|
+
const { [wsProp]: ws, ...rest } = { ...props, ...addedProps };
|
|
875
|
+
const newWS = `${name}; ${ws ?? ""}`.trim();
|
|
876
|
+
return Element(
|
|
877
|
+
Base,
|
|
878
|
+
{ [wsProp]: newWS, ref, ...rest }
|
|
879
|
+
)
|
|
880
|
+
}
|
|
881
|
+
);
|
|
882
|
+
Object.defineProperty(
|
|
883
|
+
wrapper,
|
|
884
|
+
"name",
|
|
885
|
+
{ value: `Wrapped(${Base.name ?? Base})` }
|
|
886
|
+
);
|
|
887
|
+
return wrapper
|
|
888
|
+
};
|
|
889
|
+
|
|
890
|
+
const Adorn = style("ze-adorn")`
|
|
891
|
+
adorn;
|
|
892
|
+
`;
|
|
893
|
+
|
|
894
|
+
const Modal = (props) =>
|
|
895
|
+
Element("ws-modal", { ...props });
|
|
896
|
+
|
|
897
|
+
const none = Symbol("dialog none");
|
|
898
|
+
const Dialog = (props) => {
|
|
899
|
+
const { persistent, dialog, onclose, dialogWS, ...rest } = props;
|
|
900
|
+
|
|
901
|
+
return Element(
|
|
902
|
+
Modal,
|
|
903
|
+
{
|
|
904
|
+
open: true,
|
|
905
|
+
managed: true,
|
|
906
|
+
persistent: persistent,
|
|
907
|
+
onclose: onclose,
|
|
908
|
+
},
|
|
909
|
+
Element(
|
|
910
|
+
"ws-dialog",
|
|
911
|
+
{ ws: dialogWS },
|
|
912
|
+
Element(Slot, {
|
|
913
|
+
"*render": dialog,
|
|
914
|
+
...rest,
|
|
915
|
+
}),
|
|
916
|
+
),
|
|
917
|
+
)
|
|
918
|
+
};
|
|
919
|
+
Dialog.none = none;
|
|
920
|
+
|
|
921
|
+
const state$1 = proxy({
|
|
922
|
+
stack: [],
|
|
923
|
+
});
|
|
924
|
+
const DialogStack = (props) => {
|
|
925
|
+
const { stack } = sharedState(state$1);
|
|
926
|
+
|
|
927
|
+
const dialogs = stack.map((item) =>
|
|
928
|
+
Element(Dialog, { ...item }),
|
|
929
|
+
);
|
|
930
|
+
|
|
931
|
+
return Element(Transitions, {}, dialogs)
|
|
932
|
+
};
|
|
933
|
+
|
|
934
|
+
Dialog.show = (opts) =>
|
|
935
|
+
new Promise((resolve) => {
|
|
936
|
+
if (state$1.stack.length > 3) {
|
|
937
|
+
return
|
|
938
|
+
}
|
|
939
|
+
const { dialog, ...options } = opts;
|
|
940
|
+
const key = randKey();
|
|
941
|
+
|
|
942
|
+
const close = (value) => {
|
|
943
|
+
state$1.stack = state$1.stack.filter(
|
|
944
|
+
(dialog) => dialog.key !== key,
|
|
945
|
+
);
|
|
946
|
+
resolve(value);
|
|
947
|
+
};
|
|
948
|
+
|
|
949
|
+
state$1.stack.push(
|
|
950
|
+
ref({
|
|
951
|
+
$animate: [fade(100), pop(100)],
|
|
952
|
+
...options,
|
|
953
|
+
onclose: (e) => {
|
|
954
|
+
close(Dialog.none);
|
|
955
|
+
options.onclose?.(e);
|
|
956
|
+
},
|
|
957
|
+
close,
|
|
958
|
+
dialog,
|
|
959
|
+
key,
|
|
960
|
+
}),
|
|
961
|
+
);
|
|
962
|
+
});
|
|
963
|
+
|
|
964
|
+
const Flex = (props) =>
|
|
965
|
+
Element("ws-flex", { ...props });
|
|
966
|
+
|
|
967
|
+
const Grid = (props) =>
|
|
968
|
+
Element("ws-grid", { ...props });
|
|
969
|
+
|
|
970
|
+
const base = "disp: grid; gr.areas: 'content'; layout.base;";
|
|
971
|
+
const Surface = (props) => {
|
|
972
|
+
const { children, slot, layout = null, ws = "", ...rest } = props;
|
|
973
|
+
const layoutWS = layout === null ? base : `layout.${layout};`;
|
|
974
|
+
|
|
975
|
+
return Element(
|
|
976
|
+
"ws-surface",
|
|
977
|
+
{ ...rest, ws: `${layoutWS} ${ws}` },
|
|
978
|
+
children,
|
|
979
|
+
Object.entries(slot)?.map((slotItem) => [
|
|
980
|
+
Element(
|
|
981
|
+
"ze-surface-slot",
|
|
982
|
+
{ ws: `grid; area: ${slotItem[0]};` },
|
|
983
|
+
Element(Slot, {
|
|
984
|
+
"*render": slotItem[1],
|
|
985
|
+
}),
|
|
986
|
+
),
|
|
987
|
+
]) ?? [],
|
|
988
|
+
)
|
|
989
|
+
};
|
|
990
|
+
const Card = (props) =>
|
|
991
|
+
Element(Surface, {
|
|
992
|
+
"ze-card": true,
|
|
993
|
+
...props,
|
|
994
|
+
layout: "3row-controls",
|
|
995
|
+
});
|
|
996
|
+
|
|
997
|
+
const Button = (props) => {
|
|
998
|
+
const { ws = "", ...rest } = props;
|
|
999
|
+
return Element("button", { ws: ws, ...rest })
|
|
1000
|
+
};
|
|
1001
|
+
|
|
1002
|
+
const Icon = (props) => {
|
|
1003
|
+
const { name, ...rest } = props;
|
|
1004
|
+
|
|
1005
|
+
return Element("ws-icon", {
|
|
1006
|
+
"data-icon": name,
|
|
1007
|
+
...rest,
|
|
1008
|
+
})
|
|
1009
|
+
};
|
|
1010
|
+
|
|
1011
|
+
const Toast = (props) => {
|
|
1012
|
+
const { children, dismiss, ...rest } = props;
|
|
1013
|
+
|
|
1014
|
+
return Element(
|
|
1015
|
+
"ws-toast",
|
|
1016
|
+
{ ...rest },
|
|
1017
|
+
Element(
|
|
1018
|
+
"div",
|
|
1019
|
+
{ ws: "grid;", "notif-text": true },
|
|
1020
|
+
children,
|
|
1021
|
+
),
|
|
1022
|
+
Element(
|
|
1023
|
+
Button,
|
|
1024
|
+
{ ws: "area: end;", onclick: dismiss },
|
|
1025
|
+
Element(Icon, { name: "x" }),
|
|
1026
|
+
),
|
|
1027
|
+
)
|
|
1028
|
+
};
|
|
1029
|
+
|
|
1030
|
+
const state = proxy({
|
|
1031
|
+
topLeft: [],
|
|
1032
|
+
centerLeft: [],
|
|
1033
|
+
bottomLeft: [],
|
|
1034
|
+
topRight: [],
|
|
1035
|
+
centerRight: [],
|
|
1036
|
+
bottomRight: [],
|
|
1037
|
+
topCenter: [],
|
|
1038
|
+
bottomCenter: [],
|
|
1039
|
+
});
|
|
1040
|
+
const stackList = [
|
|
1041
|
+
["topLeft", "top-left"],
|
|
1042
|
+
["centerLeft", "center-left"],
|
|
1043
|
+
["bottomLeft", "bottom-left"],
|
|
1044
|
+
["topRight", "top-right"],
|
|
1045
|
+
["centerRight", "center-right"],
|
|
1046
|
+
["bottomRight", "bottom-right"],
|
|
1047
|
+
["topCenter", "top-center"],
|
|
1048
|
+
["bottomCenter", "bottom-center"],
|
|
1049
|
+
];
|
|
1050
|
+
const Toaster = (props) => {
|
|
1051
|
+
const stacks = sharedState(state);
|
|
1052
|
+
|
|
1053
|
+
const toasters = stackList.map((pair) => {
|
|
1054
|
+
const [key, pos] = pair;
|
|
1055
|
+
const stack = stacks[key];
|
|
1056
|
+
const toasts = stack.map((toastInfo) => {
|
|
1057
|
+
const { key, content, ...props } = toastInfo;
|
|
1058
|
+
return Element(
|
|
1059
|
+
Toast,
|
|
1060
|
+
{ key: key, ...props },
|
|
1061
|
+
content,
|
|
1062
|
+
)
|
|
1063
|
+
});
|
|
1064
|
+
return Element(
|
|
1065
|
+
"ws-toaster",
|
|
1066
|
+
{ pos: pos, key: key },
|
|
1067
|
+
Element(Transitions, {}, toasts),
|
|
1068
|
+
)
|
|
1069
|
+
});
|
|
1070
|
+
return Element("ze-toasters", {}, toasters)
|
|
1071
|
+
};
|
|
1072
|
+
|
|
1073
|
+
const skipEvent = Symbol("toaster timeout");
|
|
1074
|
+
Toaster.show = (opts) => {
|
|
1075
|
+
const { pos, timeout = 5000, ...options } = opts;
|
|
1076
|
+
const key = randKey();
|
|
1077
|
+
|
|
1078
|
+
const dismiss = (skip) => {
|
|
1079
|
+
clearTimeout(timer);
|
|
1080
|
+
state[pos] = state[pos].filter((toast) => toast.key !== key);
|
|
1081
|
+
if (skip === skipEvent) {
|
|
1082
|
+
return
|
|
1083
|
+
}
|
|
1084
|
+
options.ondismiss?.();
|
|
1085
|
+
};
|
|
1086
|
+
const timer = setTimeout(() => dismiss(skipEvent), timeout);
|
|
1087
|
+
|
|
1088
|
+
state[pos].push(
|
|
1089
|
+
ref({
|
|
1090
|
+
$animate: [fade(100)],
|
|
1091
|
+
...options,
|
|
1092
|
+
dismiss,
|
|
1093
|
+
key,
|
|
1094
|
+
}),
|
|
1095
|
+
);
|
|
1096
|
+
};
|
|
1097
|
+
|
|
1098
|
+
const App = (props) => {
|
|
1099
|
+
const { ws = "", layout = null, theme, children } = props;
|
|
1100
|
+
|
|
1101
|
+
document.body.dataset.ws = `#theme.${theme}; ${ws}`;
|
|
1102
|
+
|
|
1103
|
+
return Element(
|
|
1104
|
+
S$1,
|
|
1105
|
+
{},
|
|
1106
|
+
Element(
|
|
1107
|
+
Surface,
|
|
1108
|
+
{
|
|
1109
|
+
layout: layout,
|
|
1110
|
+
ws: "r: 0px;",
|
|
1111
|
+
"data-app-surface": true,
|
|
1112
|
+
},
|
|
1113
|
+
children,
|
|
1114
|
+
),
|
|
1115
|
+
Element(DialogStack, {}),
|
|
1116
|
+
Element(Toaster, {}),
|
|
1117
|
+
)
|
|
1118
|
+
};
|
|
1119
|
+
|
|
1120
|
+
const CircleSpinner = (props) =>
|
|
1121
|
+
Element("ws-circle-spinner", { ...props });
|
|
1122
|
+
|
|
1123
|
+
const ControlLabel = (props) => {
|
|
1124
|
+
const { ws = "", labelWS, slot, children, ...rest } = props;
|
|
1125
|
+
|
|
1126
|
+
return Element(
|
|
1127
|
+
"label",
|
|
1128
|
+
{ control: true, ws: ws, ...rest },
|
|
1129
|
+
slot.label
|
|
1130
|
+
? [
|
|
1131
|
+
Element(
|
|
1132
|
+
"ws-text",
|
|
1133
|
+
{ "label-text": true, ws: labelWS },
|
|
1134
|
+
Element(Slot, {
|
|
1135
|
+
"*render": slot.label,
|
|
1136
|
+
}),
|
|
1137
|
+
),
|
|
1138
|
+
]
|
|
1139
|
+
: [],
|
|
1140
|
+
children,
|
|
1141
|
+
slot.start
|
|
1142
|
+
? [
|
|
1143
|
+
Element(
|
|
1144
|
+
"ze-input-start",
|
|
1145
|
+
{ ws: "area: start; grid;" },
|
|
1146
|
+
Element(Slot, {
|
|
1147
|
+
"*render": slot.start,
|
|
1148
|
+
}),
|
|
1149
|
+
),
|
|
1150
|
+
]
|
|
1151
|
+
: [],
|
|
1152
|
+
slot.end
|
|
1153
|
+
? [
|
|
1154
|
+
Element(
|
|
1155
|
+
"ze-input-end",
|
|
1156
|
+
{ ws: "area: end; grid;" },
|
|
1157
|
+
Element(Slot, {
|
|
1158
|
+
"*render": slot.end,
|
|
1159
|
+
}),
|
|
1160
|
+
),
|
|
1161
|
+
]
|
|
1162
|
+
: [],
|
|
1163
|
+
slot.extra
|
|
1164
|
+
? [
|
|
1165
|
+
Element(
|
|
1166
|
+
"ze-input-extra",
|
|
1167
|
+
{ ws: "area: extra; grid;" },
|
|
1168
|
+
Element(Slot, {
|
|
1169
|
+
"*render": slot.extra,
|
|
1170
|
+
}),
|
|
1171
|
+
),
|
|
1172
|
+
]
|
|
1173
|
+
: [],
|
|
1174
|
+
)
|
|
1175
|
+
};
|
|
1176
|
+
|
|
1177
|
+
const Wrapper = style("ze-data-table")`
|
|
1178
|
+
pos.rel;
|
|
1179
|
+
grid;
|
|
1180
|
+
gr.cols: 1fr;
|
|
1181
|
+
gr.rows: 1fr min-content;
|
|
1182
|
+
p: 0px;
|
|
1183
|
+
h: 100%;
|
|
1184
|
+
w: 100%;
|
|
1185
|
+
h.max: 100%;
|
|
1186
|
+
w.max: 100%;
|
|
1187
|
+
|
|
1188
|
+
! & :where(thead, tbody) {
|
|
1189
|
+
w: "100%";
|
|
1190
|
+
}
|
|
1191
|
+
! & thead > tr {
|
|
1192
|
+
h: @header;
|
|
1193
|
+
z: +5;
|
|
1194
|
+
pos.rel: true;
|
|
1195
|
+
}
|
|
1196
|
+
! & tbody > tr {
|
|
1197
|
+
h: @row;
|
|
1198
|
+
}
|
|
1199
|
+
`;
|
|
1200
|
+
const Scroller = style("ze-data-scroller")`
|
|
1201
|
+
pos.rel;
|
|
1202
|
+
over: auto;
|
|
1203
|
+
! &::before {
|
|
1204
|
+
*content: "";
|
|
1205
|
+
pos.abs;
|
|
1206
|
+
w: 1px;
|
|
1207
|
+
h: 1px;
|
|
1208
|
+
y: calc(@h - 1px);
|
|
1209
|
+
}
|
|
1210
|
+
`;
|
|
1211
|
+
const FakeScroll = style("ze-fake-scroll")`
|
|
1212
|
+
disp: block;
|
|
1213
|
+
w: 100%;
|
|
1214
|
+
h: @h;
|
|
1215
|
+
pos.stick;
|
|
1216
|
+
y: 0px;
|
|
1217
|
+
over: hidden;
|
|
1218
|
+
`;
|
|
1219
|
+
const FooterArea = style("ze-data-footer")`
|
|
1220
|
+
pos: rel;
|
|
1221
|
+
grid;
|
|
1222
|
+
`;
|
|
1223
|
+
const FakeBody = style("tbody")`
|
|
1224
|
+
tf: translateY(@p);
|
|
1225
|
+
`;
|
|
1226
|
+
const itemRange = (info) => {
|
|
1227
|
+
const { scrollPos, scrollMax, rowSize, length, containerHeight } =
|
|
1228
|
+
info;
|
|
1229
|
+
if (scrollMax === null) {
|
|
1230
|
+
return [0, 0]
|
|
1231
|
+
}
|
|
1232
|
+
const displayed = Math.ceil(containerHeight / rowSize) - 1;
|
|
1233
|
+
const itemPos = Math.floor(
|
|
1234
|
+
(scrollPos / scrollMax) * (length - displayed),
|
|
1235
|
+
);
|
|
1236
|
+
return [itemPos - 1, itemPos + displayed + 1, displayed + 2]
|
|
1237
|
+
};
|
|
1238
|
+
const emptyRow = Symbol("empty row");
|
|
1239
|
+
const nullRow = Symbol("null row");
|
|
1240
|
+
|
|
1241
|
+
const sliceData = (data, range) => {
|
|
1242
|
+
const displayed = data.slice(Math.max(range[0], 0), range[1]);
|
|
1243
|
+
if (range[0] === -1) {
|
|
1244
|
+
return [emptyRow, ...displayed]
|
|
1245
|
+
}
|
|
1246
|
+
if (displayed.length < range[2]) {
|
|
1247
|
+
return [
|
|
1248
|
+
...displayed,
|
|
1249
|
+
...Array.from(
|
|
1250
|
+
{ length: range[2] - displayed.length },
|
|
1251
|
+
() => nullRow,
|
|
1252
|
+
),
|
|
1253
|
+
]
|
|
1254
|
+
}
|
|
1255
|
+
return displayed
|
|
1256
|
+
};
|
|
1257
|
+
|
|
1258
|
+
const Header$1 = (props) => {
|
|
1259
|
+
const { keys } = props;
|
|
1260
|
+
return Element(
|
|
1261
|
+
"tr",
|
|
1262
|
+
{},
|
|
1263
|
+
keys?.map((key) => [Element("th", {}, key)]) ?? [],
|
|
1264
|
+
)
|
|
1265
|
+
};
|
|
1266
|
+
const Row$1 = (props) => {
|
|
1267
|
+
const { item, keys } = props;
|
|
1268
|
+
return Element(
|
|
1269
|
+
"tr",
|
|
1270
|
+
{},
|
|
1271
|
+
keys?.map((key) => [Element("td", {}, item[key])])
|
|
1272
|
+
?? [],
|
|
1273
|
+
)
|
|
1274
|
+
};
|
|
1275
|
+
|
|
1276
|
+
const Footer = (props) => {
|
|
1277
|
+
const { show } = props;
|
|
1278
|
+
return Element(
|
|
1279
|
+
"div",
|
|
1280
|
+
{ ws: "flex; fl.cn; h.min: 32px; gap: 4px;" },
|
|
1281
|
+
Element(
|
|
1282
|
+
"div",
|
|
1283
|
+
{},
|
|
1284
|
+
`Showing: ${show.start} - ${show.end} of ${show.total}`,
|
|
1285
|
+
),
|
|
1286
|
+
)
|
|
1287
|
+
};
|
|
1288
|
+
|
|
1289
|
+
const DataTable = (props) => {
|
|
1290
|
+
const {
|
|
1291
|
+
rowSize = 30,
|
|
1292
|
+
headerSize = rowSize,
|
|
1293
|
+
slot,
|
|
1294
|
+
ws,
|
|
1295
|
+
tableWS = "",
|
|
1296
|
+
data,
|
|
1297
|
+
} = props;
|
|
1298
|
+
|
|
1299
|
+
const local = localState({
|
|
1300
|
+
scrollPos: 0,
|
|
1301
|
+
scrollMax: null,
|
|
1302
|
+
containerHeight: null,
|
|
1303
|
+
container: null,
|
|
1304
|
+
scrollWidth: 0,
|
|
1305
|
+
});
|
|
1306
|
+
const scrollHandler = (evt) => {
|
|
1307
|
+
local.scrollPos = local.container.scrollTop;
|
|
1308
|
+
};
|
|
1309
|
+
|
|
1310
|
+
const keys = calc(() => Object.keys(data?.[0] ?? {}), [data]);
|
|
1311
|
+
const itemsHeight = rowSize * data.length;
|
|
1312
|
+
const tableHeight = itemsHeight + headerSize;
|
|
1313
|
+
|
|
1314
|
+
const scrollWS = `@h: ${tableHeight}px; @header: ${headerSize}px; @row: ${rowSize}px;`;
|
|
1315
|
+
|
|
1316
|
+
const range = calc(
|
|
1317
|
+
() =>
|
|
1318
|
+
itemRange({
|
|
1319
|
+
scrollPos: local.scrollPos,
|
|
1320
|
+
scrollMax: local.scrollMax,
|
|
1321
|
+
containerHeight: local.containerHeight,
|
|
1322
|
+
rowSize,
|
|
1323
|
+
length: data.length,
|
|
1324
|
+
}),
|
|
1325
|
+
[
|
|
1326
|
+
local.scrollPos,
|
|
1327
|
+
local.scrollMax,
|
|
1328
|
+
local.containerHeight,
|
|
1329
|
+
rowSize,
|
|
1330
|
+
data.length,
|
|
1331
|
+
],
|
|
1332
|
+
);
|
|
1333
|
+
|
|
1334
|
+
h$2(() => {
|
|
1335
|
+
local.containerHeight = local.container.clientHeight;
|
|
1336
|
+
local.scrollMax =
|
|
1337
|
+
local.container.scrollHeight - local.containerHeight;
|
|
1338
|
+
local.container.addEventListener("scroll", scrollHandler, {
|
|
1339
|
+
passive: true,
|
|
1340
|
+
});
|
|
1341
|
+
const observer = new ResizeObserver(() => {
|
|
1342
|
+
local.containerHeight = local.container.clientHeight;
|
|
1343
|
+
local.scrollMax =
|
|
1344
|
+
local.container.scrollHeight - local.containerHeight;
|
|
1345
|
+
local.scrollWidth = local.container.scrollWidth;
|
|
1346
|
+
});
|
|
1347
|
+
observer.observe(local.container);
|
|
1348
|
+
return () => observer.unobserve(local.container)
|
|
1349
|
+
}, []);
|
|
1350
|
+
|
|
1351
|
+
const displayed = range[2];
|
|
1352
|
+
const displayedRows = calc(
|
|
1353
|
+
() => sliceData(data, range),
|
|
1354
|
+
[data, range],
|
|
1355
|
+
);
|
|
1356
|
+
const show = calc(
|
|
1357
|
+
() => ({
|
|
1358
|
+
start: Math.max(1, range[0] + 2),
|
|
1359
|
+
end: Math.min(data.length, range[1] - 1),
|
|
1360
|
+
total: data.length,
|
|
1361
|
+
}),
|
|
1362
|
+
[range, data.length],
|
|
1363
|
+
);
|
|
1364
|
+
(data.length - displayed) * rowSize;
|
|
1365
|
+
|
|
1366
|
+
const itemOffset = range[0] * rowSize - local.scrollPos;
|
|
1367
|
+
|
|
1368
|
+
const TableRow = slot.row ?? Row$1;
|
|
1369
|
+
const TableHeader = slot.header ?? Header$1;
|
|
1370
|
+
const TableFooter = slot.footer ?? Footer;
|
|
1371
|
+
|
|
1372
|
+
return Element(
|
|
1373
|
+
Wrapper,
|
|
1374
|
+
{ ws: ws },
|
|
1375
|
+
Element(
|
|
1376
|
+
Scroller,
|
|
1377
|
+
{
|
|
1378
|
+
ref: lock(
|
|
1379
|
+
(node) => (local.container = ref(node)),
|
|
1380
|
+
),
|
|
1381
|
+
ws: scrollWS,
|
|
1382
|
+
},
|
|
1383
|
+
Element(
|
|
1384
|
+
FakeScroll,
|
|
1385
|
+
{ ws: `@h: ${local.containerHeight}px;` },
|
|
1386
|
+
Element(
|
|
1387
|
+
"table",
|
|
1388
|
+
{
|
|
1389
|
+
ws: `w: 100%; *table-layout: fixed; ${tableWS}`,
|
|
1390
|
+
},
|
|
1391
|
+
Element(
|
|
1392
|
+
"thead",
|
|
1393
|
+
{},
|
|
1394
|
+
data?.length > 0
|
|
1395
|
+
? [
|
|
1396
|
+
Element(TableHeader, {
|
|
1397
|
+
keys: keys,
|
|
1398
|
+
}),
|
|
1399
|
+
]
|
|
1400
|
+
: [
|
|
1401
|
+
Element(
|
|
1402
|
+
"tr",
|
|
1403
|
+
{},
|
|
1404
|
+
Element(
|
|
1405
|
+
"td",
|
|
1406
|
+
{},
|
|
1407
|
+
"N/A",
|
|
1408
|
+
),
|
|
1409
|
+
),
|
|
1410
|
+
],
|
|
1411
|
+
),
|
|
1412
|
+
Element(
|
|
1413
|
+
FakeBody,
|
|
1414
|
+
{ style: `--p: ${itemOffset}px;` },
|
|
1415
|
+
__eachAlt(
|
|
1416
|
+
displayedRows?.map((item, index) => [
|
|
1417
|
+
Element(TableRow, {
|
|
1418
|
+
item: item,
|
|
1419
|
+
keys: keys,
|
|
1420
|
+
key: index,
|
|
1421
|
+
}),
|
|
1422
|
+
]) ?? [],
|
|
1423
|
+
() => [
|
|
1424
|
+
Element(
|
|
1425
|
+
"tr",
|
|
1426
|
+
{},
|
|
1427
|
+
Element(
|
|
1428
|
+
"td",
|
|
1429
|
+
{},
|
|
1430
|
+
"No Items",
|
|
1431
|
+
),
|
|
1432
|
+
),
|
|
1433
|
+
],
|
|
1434
|
+
),
|
|
1435
|
+
),
|
|
1436
|
+
),
|
|
1437
|
+
),
|
|
1438
|
+
),
|
|
1439
|
+
Element(
|
|
1440
|
+
FooterArea,
|
|
1441
|
+
{},
|
|
1442
|
+
Element(TableFooter, {
|
|
1443
|
+
show: show,
|
|
1444
|
+
displayedRows: displayedRows,
|
|
1445
|
+
}),
|
|
1446
|
+
),
|
|
1447
|
+
)
|
|
1448
|
+
};
|
|
1449
|
+
|
|
1450
|
+
const Details = (props) => {
|
|
1451
|
+
const { summaryWS, children, slot, ws = "", ...rest } = props;
|
|
1452
|
+
|
|
1453
|
+
return Element(
|
|
1454
|
+
"details",
|
|
1455
|
+
{ ws: ws, ...rest },
|
|
1456
|
+
Element(
|
|
1457
|
+
"summary",
|
|
1458
|
+
{ ws: summaryWS },
|
|
1459
|
+
Element(Slot, {
|
|
1460
|
+
"*render": slot.label,
|
|
1461
|
+
}),
|
|
1462
|
+
),
|
|
1463
|
+
children,
|
|
1464
|
+
)
|
|
1465
|
+
};
|
|
1466
|
+
|
|
1467
|
+
const Text = (props) => {
|
|
1468
|
+
const { size = null, notif, ...rest } = props;
|
|
1469
|
+
const sizeProp = size === null ? {} : { [size]: "" };
|
|
1470
|
+
const processed = {
|
|
1471
|
+
...rest,
|
|
1472
|
+
...sizeProp,
|
|
1473
|
+
"notif-text": notif === true ? "" : undefined,
|
|
1474
|
+
};
|
|
1475
|
+
|
|
1476
|
+
return Element("ws-text", { ...processed })
|
|
1477
|
+
};
|
|
1478
|
+
|
|
1479
|
+
const Titlebar = (props) => {
|
|
1480
|
+
const { ws, children, slot, ...rest } = props;
|
|
1481
|
+
|
|
1482
|
+
return Element(
|
|
1483
|
+
"ws-titlebar",
|
|
1484
|
+
{ ws: ws, ...rest },
|
|
1485
|
+
slot.menu !== undefined
|
|
1486
|
+
? [
|
|
1487
|
+
Element(
|
|
1488
|
+
"ze-menu",
|
|
1489
|
+
{ ws: "flex; area: menu;" },
|
|
1490
|
+
Element(Slot, {
|
|
1491
|
+
"*render": slot.menu,
|
|
1492
|
+
}),
|
|
1493
|
+
),
|
|
1494
|
+
]
|
|
1495
|
+
: [],
|
|
1496
|
+
children,
|
|
1497
|
+
slot.action !== undefined
|
|
1498
|
+
? [
|
|
1499
|
+
Element(
|
|
1500
|
+
"ze-action",
|
|
1501
|
+
{ ws: "flex; area: action;" },
|
|
1502
|
+
Element(Slot, {
|
|
1503
|
+
"*render": slot.action,
|
|
1504
|
+
}),
|
|
1505
|
+
),
|
|
1506
|
+
]
|
|
1507
|
+
: [],
|
|
1508
|
+
)
|
|
1509
|
+
};
|
|
1510
|
+
|
|
1511
|
+
const ws = "raised; var.outln; @color: @info; layout.3row-controls;";
|
|
1512
|
+
|
|
1513
|
+
const Alert = (props) => {
|
|
1514
|
+
const {
|
|
1515
|
+
close,
|
|
1516
|
+
message,
|
|
1517
|
+
title = "Alert",
|
|
1518
|
+
ok = "Ok",
|
|
1519
|
+
style,
|
|
1520
|
+
onanimationend,
|
|
1521
|
+
} = props;
|
|
1522
|
+
|
|
1523
|
+
const done = () => close(true);
|
|
1524
|
+
|
|
1525
|
+
return Element(
|
|
1526
|
+
Surface,
|
|
1527
|
+
{
|
|
1528
|
+
layout: "3row-controls",
|
|
1529
|
+
ws: ws,
|
|
1530
|
+
style: style,
|
|
1531
|
+
onanimationend: onanimationend,
|
|
1532
|
+
"slot:header": () => [
|
|
1533
|
+
Element(
|
|
1534
|
+
Titlebar,
|
|
1535
|
+
{ ws: "@color: @info;" },
|
|
1536
|
+
Element(Text, { title: true }, title),
|
|
1537
|
+
),
|
|
1538
|
+
],
|
|
1539
|
+
"slot:footer": () => [
|
|
1540
|
+
Element(
|
|
1541
|
+
Grid,
|
|
1542
|
+
{ ws: "p: 4px;" },
|
|
1543
|
+
Element(
|
|
1544
|
+
Button,
|
|
1545
|
+
{ onclick: done, ws: "@color: @success;" },
|
|
1546
|
+
ok,
|
|
1547
|
+
),
|
|
1548
|
+
),
|
|
1549
|
+
],
|
|
1550
|
+
},
|
|
1551
|
+
Element(
|
|
1552
|
+
Flex,
|
|
1553
|
+
{},
|
|
1554
|
+
Element(Slot, { "*render": message }),
|
|
1555
|
+
),
|
|
1556
|
+
)
|
|
1557
|
+
};
|
|
1558
|
+
|
|
1559
|
+
const Confirm = (props) => {
|
|
1560
|
+
const {
|
|
1561
|
+
close,
|
|
1562
|
+
message,
|
|
1563
|
+
title = "Confirm",
|
|
1564
|
+
ok = "Ok",
|
|
1565
|
+
cancel = "Cancel",
|
|
1566
|
+
style,
|
|
1567
|
+
onanimationend,
|
|
1568
|
+
} = props;
|
|
1569
|
+
|
|
1570
|
+
const done = () => close(true);
|
|
1571
|
+
const canc = () => close(false);
|
|
1572
|
+
|
|
1573
|
+
return Element(
|
|
1574
|
+
Surface,
|
|
1575
|
+
{
|
|
1576
|
+
layout: "3row-controls",
|
|
1577
|
+
ws: ws,
|
|
1578
|
+
style: style,
|
|
1579
|
+
onanimationend: onanimationend,
|
|
1580
|
+
"slot:header": () => [
|
|
1581
|
+
Element(
|
|
1582
|
+
Titlebar,
|
|
1583
|
+
{ ws: "@color: @info;" },
|
|
1584
|
+
Element(Text, { title: true }, title),
|
|
1585
|
+
),
|
|
1586
|
+
],
|
|
1587
|
+
"slot:footer": () => [
|
|
1588
|
+
Element(
|
|
1589
|
+
Grid,
|
|
1590
|
+
{ ws: "p: 4px; gr.cols: 1fr 1fr;" },
|
|
1591
|
+
Element(
|
|
1592
|
+
Button,
|
|
1593
|
+
{ onclick: canc, ws: "@color: @error;" },
|
|
1594
|
+
cancel,
|
|
1595
|
+
),
|
|
1596
|
+
Element(
|
|
1597
|
+
Button,
|
|
1598
|
+
{ onclick: done, ws: "@color: @success;" },
|
|
1599
|
+
ok,
|
|
1600
|
+
),
|
|
1601
|
+
),
|
|
1602
|
+
],
|
|
1603
|
+
},
|
|
1604
|
+
Element(S$1, {}, message),
|
|
1605
|
+
)
|
|
1606
|
+
};
|
|
1607
|
+
|
|
1608
|
+
const Prompt = (props) => {
|
|
1609
|
+
const {
|
|
1610
|
+
close,
|
|
1611
|
+
message,
|
|
1612
|
+
placeholder = "",
|
|
1613
|
+
title = "Prompt",
|
|
1614
|
+
ok = "Ok",
|
|
1615
|
+
cancel = "Cancel",
|
|
1616
|
+
style,
|
|
1617
|
+
onanimationend,
|
|
1618
|
+
} = props;
|
|
1619
|
+
|
|
1620
|
+
const local = localState({
|
|
1621
|
+
text: "",
|
|
1622
|
+
input: null,
|
|
1623
|
+
});
|
|
1624
|
+
|
|
1625
|
+
const done = () => close(local.text);
|
|
1626
|
+
const canc = () => close(false);
|
|
1627
|
+
const onsubmit = (e) => {
|
|
1628
|
+
e.preventDefault();
|
|
1629
|
+
done(local.text);
|
|
1630
|
+
};
|
|
1631
|
+
|
|
1632
|
+
h$2(() => {
|
|
1633
|
+
local.input.focus();
|
|
1634
|
+
}, []);
|
|
1635
|
+
|
|
1636
|
+
return Element(Surface, {
|
|
1637
|
+
layout: "3row-controls",
|
|
1638
|
+
ws: ws,
|
|
1639
|
+
style: style,
|
|
1640
|
+
onanimationend: onanimationend,
|
|
1641
|
+
"slot:header": () => [
|
|
1642
|
+
Element(
|
|
1643
|
+
Titlebar,
|
|
1644
|
+
{ ws: "@color: @info;" },
|
|
1645
|
+
Element(Text, { title: true }, title),
|
|
1646
|
+
),
|
|
1647
|
+
],
|
|
1648
|
+
"slot:content": () => [
|
|
1649
|
+
Element(
|
|
1650
|
+
"form",
|
|
1651
|
+
{ onsubmit: onsubmit },
|
|
1652
|
+
Element(
|
|
1653
|
+
Flex,
|
|
1654
|
+
{},
|
|
1655
|
+
Element(
|
|
1656
|
+
ControlLabel,
|
|
1657
|
+
{ label: message, ws: "var.lined; r: 0px;" },
|
|
1658
|
+
Element("input", {
|
|
1659
|
+
type: "text",
|
|
1660
|
+
placeholder: placeholder,
|
|
1661
|
+
$$value: {
|
|
1662
|
+
value: local.text,
|
|
1663
|
+
update: (e) =>
|
|
1664
|
+
(local.text =
|
|
1665
|
+
getInputValue(
|
|
1666
|
+
e.target,
|
|
1667
|
+
)),
|
|
1668
|
+
},
|
|
1669
|
+
ref: lock(
|
|
1670
|
+
(node) =>
|
|
1671
|
+
(local.input =
|
|
1672
|
+
ref(node)),
|
|
1673
|
+
),
|
|
1674
|
+
}),
|
|
1675
|
+
),
|
|
1676
|
+
),
|
|
1677
|
+
),
|
|
1678
|
+
],
|
|
1679
|
+
"slot:footer": () => [
|
|
1680
|
+
Element(
|
|
1681
|
+
Grid,
|
|
1682
|
+
{ ws: "p: 4px; gr.cols: 1fr 1fr;" },
|
|
1683
|
+
Element(
|
|
1684
|
+
Button,
|
|
1685
|
+
{ onclick: canc, ws: "@color: @error;" },
|
|
1686
|
+
cancel,
|
|
1687
|
+
),
|
|
1688
|
+
Element(
|
|
1689
|
+
Button,
|
|
1690
|
+
{ onclick: done, ws: "@color: @success;" },
|
|
1691
|
+
ok,
|
|
1692
|
+
),
|
|
1693
|
+
),
|
|
1694
|
+
],
|
|
1695
|
+
})
|
|
1696
|
+
};
|
|
1697
|
+
|
|
1698
|
+
eventNames["ws-modal.open"] = "close";
|
|
1699
|
+
registerInputValue("ws-modal", () => false);
|
|
1700
|
+
|
|
1701
|
+
const $animate = [fade(175), fromLeft(175)];
|
|
1702
|
+
const DrawerDisplay = (props) => {
|
|
1703
|
+
const { "inline-desktop": inline, key, onclose, ...rest } = props;
|
|
1704
|
+
|
|
1705
|
+
return Element(
|
|
1706
|
+
Modal,
|
|
1707
|
+
{
|
|
1708
|
+
"inline-desktop": inline,
|
|
1709
|
+
key: key,
|
|
1710
|
+
open: true,
|
|
1711
|
+
managed: true,
|
|
1712
|
+
onclose: onclose,
|
|
1713
|
+
},
|
|
1714
|
+
Element("ws-drawer", { ...rest }),
|
|
1715
|
+
)
|
|
1716
|
+
};
|
|
1717
|
+
|
|
1718
|
+
const Drawer = (props) => {
|
|
1719
|
+
const { open, $$open, onclose, ...rest } = props;
|
|
1720
|
+
const key = calc(() => randKey());
|
|
1721
|
+
const show = open === true || $$open?.value === true;
|
|
1722
|
+
const close = $$open?.update ?? onclose;
|
|
1723
|
+
|
|
1724
|
+
return Element(
|
|
1725
|
+
Transitions,
|
|
1726
|
+
{},
|
|
1727
|
+
show === true
|
|
1728
|
+
? [
|
|
1729
|
+
Element(DrawerDisplay, {
|
|
1730
|
+
key: key,
|
|
1731
|
+
$animate: $animate,
|
|
1732
|
+
...rest,
|
|
1733
|
+
onclose: close,
|
|
1734
|
+
}),
|
|
1735
|
+
]
|
|
1736
|
+
: [],
|
|
1737
|
+
)
|
|
1738
|
+
};
|
|
1739
|
+
|
|
1740
|
+
const HexSpinner = (props) =>
|
|
1741
|
+
Element("ws-hexagon-spinner", { ...props });
|
|
1742
|
+
|
|
1743
|
+
const Link = (props) => {
|
|
1744
|
+
const { ws = "", ...rest } = props;
|
|
1745
|
+
return Element("a", { ws: ws, ...rest })
|
|
1746
|
+
};
|
|
1747
|
+
|
|
1748
|
+
const Popover = (props) => {
|
|
1749
|
+
const { content, overlay, ws = "", ...rest } = props;
|
|
1750
|
+
|
|
1751
|
+
const local = localState({
|
|
1752
|
+
popover: null,
|
|
1753
|
+
});
|
|
1754
|
+
const show = () => local.popover.show();
|
|
1755
|
+
const hide = () => local.popover.hide();
|
|
1756
|
+
|
|
1757
|
+
return Element(
|
|
1758
|
+
"ws-popover",
|
|
1759
|
+
{
|
|
1760
|
+
ws: ws,
|
|
1761
|
+
...rest,
|
|
1762
|
+
ref: lock(
|
|
1763
|
+
(node) => (local.popover = ref(node)),
|
|
1764
|
+
),
|
|
1765
|
+
},
|
|
1766
|
+
Element(Slot, {
|
|
1767
|
+
"*render": content,
|
|
1768
|
+
show: show,
|
|
1769
|
+
}),
|
|
1770
|
+
Element(
|
|
1771
|
+
"ze-popover-overlay",
|
|
1772
|
+
{ slot: "popover" },
|
|
1773
|
+
Element(Slot, {
|
|
1774
|
+
"*render": overlay,
|
|
1775
|
+
hide: hide,
|
|
1776
|
+
}),
|
|
1777
|
+
),
|
|
1778
|
+
)
|
|
1779
|
+
};
|
|
1780
|
+
|
|
1781
|
+
const Progress = (props) =>
|
|
1782
|
+
Element("ws-progress", { ...props });
|
|
1783
|
+
|
|
1784
|
+
const Option = (props) =>
|
|
1785
|
+
Element("ws-option", { ...props });
|
|
1786
|
+
const Optgroup = (props) =>
|
|
1787
|
+
Element("ws-optgroup", { ...props });
|
|
1788
|
+
|
|
1789
|
+
const optionList = (items) =>
|
|
1790
|
+
items.map((item) => {
|
|
1791
|
+
if (item.group !== undefined) {
|
|
1792
|
+
return Element(
|
|
1793
|
+
Optgroup,
|
|
1794
|
+
{ label: item.group },
|
|
1795
|
+
optionList(item.items),
|
|
1796
|
+
)
|
|
1797
|
+
}
|
|
1798
|
+
return Element(
|
|
1799
|
+
Option,
|
|
1800
|
+
{ value: item.value },
|
|
1801
|
+
item.label,
|
|
1802
|
+
)
|
|
1803
|
+
});
|
|
1804
|
+
|
|
1805
|
+
const Select = (props) => {
|
|
1806
|
+
let { options, children, selected, ...rest } = props;
|
|
1807
|
+
|
|
1808
|
+
const items = calc(() => {
|
|
1809
|
+
if (Array.isArray(options) === true) {
|
|
1810
|
+
return optionList(options)
|
|
1811
|
+
}
|
|
1812
|
+
return children
|
|
1813
|
+
}, [children, options]);
|
|
1814
|
+
const selectedItem = calc(() => {
|
|
1815
|
+
if (selected !== undefined) {
|
|
1816
|
+
const Selected = selected;
|
|
1817
|
+
return Element(
|
|
1818
|
+
"div",
|
|
1819
|
+
{ slot: "selected" },
|
|
1820
|
+
Element(Selected, {}),
|
|
1821
|
+
)
|
|
1822
|
+
}
|
|
1823
|
+
return null
|
|
1824
|
+
}, [selected]);
|
|
1825
|
+
|
|
1826
|
+
return Element(
|
|
1827
|
+
"ws-select",
|
|
1828
|
+
{ ...rest },
|
|
1829
|
+
selectedItem,
|
|
1830
|
+
items,
|
|
1831
|
+
)
|
|
1832
|
+
};
|
|
1833
|
+
|
|
1834
|
+
const diff = (a = null, b = null) => {
|
|
1835
|
+
if (a === null || b === null) {
|
|
1836
|
+
return true
|
|
1837
|
+
}
|
|
1838
|
+
const akeys = Object.keys(a);
|
|
1839
|
+
const bkeys = Object.keys(b);
|
|
1840
|
+
|
|
1841
|
+
const missingKeys =
|
|
1842
|
+
akeys.find((k) => bkeys.includes(k) === false)
|
|
1843
|
+
|| bkeys.find((k) => akeys.includes(k) === false);
|
|
1844
|
+
if (missingKeys !== undefined) {
|
|
1845
|
+
return true
|
|
1846
|
+
}
|
|
1847
|
+
for (const k of akeys) {
|
|
1848
|
+
if (b[k] !== a[k]) {
|
|
1849
|
+
return true
|
|
1850
|
+
}
|
|
1851
|
+
}
|
|
1852
|
+
for (const k of bkeys) {
|
|
1853
|
+
if (b[k] !== a[k]) {
|
|
1854
|
+
return true
|
|
1855
|
+
}
|
|
1856
|
+
}
|
|
1857
|
+
return false
|
|
1858
|
+
};
|
|
1859
|
+
|
|
1860
|
+
const pdiff = (local, props) => {
|
|
1861
|
+
const current = Object.keys(props).reduce((c, key) => {
|
|
1862
|
+
const isPromise = props[key] instanceof Promise;
|
|
1863
|
+
if (isPromise === false) {
|
|
1864
|
+
return c
|
|
1865
|
+
}
|
|
1866
|
+
c[key] = props[key];
|
|
1867
|
+
return c
|
|
1868
|
+
}, {});
|
|
1869
|
+
if (diff(local.prev, current) === false) {
|
|
1870
|
+
return
|
|
1871
|
+
}
|
|
1872
|
+
const keys = Object.keys(current);
|
|
1873
|
+
const next = Promise.all(
|
|
1874
|
+
keys.map(async (key) => [key, await current[key]]),
|
|
1875
|
+
);
|
|
1876
|
+
next.keep = true;
|
|
1877
|
+
next.then((pairs) => {
|
|
1878
|
+
if (next.keep === false) {
|
|
1879
|
+
return
|
|
1880
|
+
}
|
|
1881
|
+
local.resolved = ref(Object.fromEntries(pairs));
|
|
1882
|
+
});
|
|
1883
|
+
local.promise.keep = false;
|
|
1884
|
+
local.promise = ref(next);
|
|
1885
|
+
local.resolved = null;
|
|
1886
|
+
local.prev = current;
|
|
1887
|
+
};
|
|
1888
|
+
|
|
1889
|
+
const cache = new Map();
|
|
1890
|
+
const suspend = (Target) => {
|
|
1891
|
+
if (cache.has(Target) === true) {
|
|
1892
|
+
return cache.get(Target)
|
|
1893
|
+
}
|
|
1894
|
+
const suspended = (props) => {
|
|
1895
|
+
const local = localState({
|
|
1896
|
+
promise: {},
|
|
1897
|
+
prev: {},
|
|
1898
|
+
resolved: null,
|
|
1899
|
+
});
|
|
1900
|
+
|
|
1901
|
+
pdiff(local, props);
|
|
1902
|
+
|
|
1903
|
+
if (local.resolved !== null) {
|
|
1904
|
+
return Element(Target, {
|
|
1905
|
+
...props,
|
|
1906
|
+
...local.resolved,
|
|
1907
|
+
})
|
|
1908
|
+
}
|
|
1909
|
+
|
|
1910
|
+
const Loading = local.loading ?? null;
|
|
1911
|
+
if (Loading === null) {
|
|
1912
|
+
return Element("div", {}, "Loading")
|
|
1913
|
+
}
|
|
1914
|
+
return Element(Loading, {})
|
|
1915
|
+
};
|
|
1916
|
+
cache.set(Target, suspended);
|
|
1917
|
+
return suspended
|
|
1918
|
+
};
|
|
1919
|
+
|
|
1920
|
+
const Header = (props) => {
|
|
1921
|
+
const { keys } = props;
|
|
1922
|
+
return Element(
|
|
1923
|
+
"tr",
|
|
1924
|
+
{},
|
|
1925
|
+
keys?.map((key) => [Element("th", {}, key)]) ?? [],
|
|
1926
|
+
)
|
|
1927
|
+
};
|
|
1928
|
+
const Row = (props) => {
|
|
1929
|
+
const { item, keys } = props;
|
|
1930
|
+
return Element(
|
|
1931
|
+
"tr",
|
|
1932
|
+
{},
|
|
1933
|
+
keys?.map((key) => [Element("td", {}, item[key])])
|
|
1934
|
+
?? [],
|
|
1935
|
+
)
|
|
1936
|
+
};
|
|
1937
|
+
|
|
1938
|
+
const Table = (props) => {
|
|
1939
|
+
const { data, slot, sticky, ws = "", ...rest } = props;
|
|
1940
|
+
const { header = Header, row = Row } = slot;
|
|
1941
|
+
|
|
1942
|
+
const keys = calc(() => Object.keys(data?.[0] ?? {}), [data]);
|
|
1943
|
+
|
|
1944
|
+
return Element(
|
|
1945
|
+
"table",
|
|
1946
|
+
{ ws: ws, "stick-header": sticky === true, ...rest },
|
|
1947
|
+
Element(
|
|
1948
|
+
"thead",
|
|
1949
|
+
{},
|
|
1950
|
+
data?.length > 0
|
|
1951
|
+
? [
|
|
1952
|
+
Element(Slot, {
|
|
1953
|
+
"*render": header,
|
|
1954
|
+
keys: keys,
|
|
1955
|
+
}),
|
|
1956
|
+
]
|
|
1957
|
+
: [
|
|
1958
|
+
Element(
|
|
1959
|
+
"tr",
|
|
1960
|
+
{},
|
|
1961
|
+
Element("th", {}, "N/A"),
|
|
1962
|
+
),
|
|
1963
|
+
],
|
|
1964
|
+
),
|
|
1965
|
+
Element(
|
|
1966
|
+
"tbody",
|
|
1967
|
+
{},
|
|
1968
|
+
__eachAlt(
|
|
1969
|
+
data?.map((item, rowNum) => [
|
|
1970
|
+
Element(Slot, {
|
|
1971
|
+
"*render": row,
|
|
1972
|
+
item: item,
|
|
1973
|
+
keys: keys,
|
|
1974
|
+
rowNum: rowNum,
|
|
1975
|
+
}),
|
|
1976
|
+
]) ?? [],
|
|
1977
|
+
() => [
|
|
1978
|
+
Element(
|
|
1979
|
+
"tr",
|
|
1980
|
+
{},
|
|
1981
|
+
Element("td", {}, "No Items"),
|
|
1982
|
+
),
|
|
1983
|
+
],
|
|
1984
|
+
),
|
|
1985
|
+
),
|
|
1986
|
+
)
|
|
1987
|
+
};
|
|
1988
|
+
|
|
1989
|
+
const ToggleLabel = (props) => {
|
|
1990
|
+
const { ws = "", children, ...rest } = props;
|
|
1991
|
+
|
|
1992
|
+
return Element(
|
|
1993
|
+
"label",
|
|
1994
|
+
{ toggle: true, ws: ws, ...rest },
|
|
1995
|
+
children,
|
|
1996
|
+
)
|
|
1997
|
+
};
|
|
1998
|
+
|
|
1999
|
+
const Tooltip = (props) =>
|
|
2000
|
+
Element("ws-tooltip", { ...props });
|
|
2001
|
+
|
|
2002
|
+
export { Adorn, Alert, App, Button, Card, CircleSpinner, Confirm, ControlLabel, DataTable, Details, Dialog, DialogStack, Drawer, Element, Flex, S$1 as Fragment, Grid, HexSpinner, Icon, Link, Modal, Optgroup, Option, Popover, Progress, Prompt, Select, Slot, Surface, Table, Text, Titlebar, Toast, Toaster, ToggleLabel, Tooltip, Transitions, __eachAlt, animation, calc, W$2 as cloneElement, X$1 as createContext, drop, fade, fromBottom, fromLeft, fromRight, fromTop, getInputValue, getVersion, localState, lock, N$1 as memo, options, pop, l$3 as preactOptions, proxy, randKey, randName, ref, R$1 as renderApp, K as renderString, sharedState, slideBottom, slideTop, snapshot, spinCW, style, subscribe, suspend, x$2 as useContext, h$2 as useEffect, T$2 as useMemo, d$2 as useState, visible, wsEsm as wind };
|