jsxtra - npm Package Compare versions
Comparing version 0.0.20 to 0.0.21
@@ -54,3 +54,49 @@ var __defProp = Object.defineProperty; | ||
| }; | ||
| const isExternalPath = (path) => /^https?:\/\//.test(path); | ||
| const history = createBrowserHistory(); | ||
| const initRouter = (routerOptions, appContainer, baseComponent) => { | ||
| const { routes, persistState = false } = routerOptions; | ||
| store.routerInfo.history = history; | ||
| appContainer.addEventListener("click", (event) => { | ||
| const target = event.composedPath()[0]; | ||
| const getLink = (target2) => { | ||
| if (target2.tagName === "A") { | ||
| return target2.getAttribute("href"); | ||
| } | ||
| if (target2.closest("a")) { | ||
| return target2.closest("a").getAttribute("href"); | ||
| } | ||
| return null; | ||
| }; | ||
| const link = getLink(target); | ||
| if (!link || isExternalPath(link)) { | ||
| return; | ||
| } | ||
| event.preventDefault(); | ||
| history.push(link); | ||
| }); | ||
| store.routerInfo.enabled = true; | ||
| const router = new UniversalRouter(routes); | ||
| const container = appContainer; | ||
| const render = (pathname) => router.resolve(pathname).then((html) => { | ||
| store.routerInfo.currentPath = pathname; | ||
| container.innerHTML = html; | ||
| container.dataset.route = pathname; | ||
| }); | ||
| const location = history.location; | ||
| container.dataset.route = location.pathname; | ||
| if (location.pathname !== "/") { | ||
| render(location.pathname); | ||
| } else { | ||
| appContainer.innerHTML = baseComponent(); | ||
| } | ||
| history.listen(({ location: location2, action }) => { | ||
| if (!persistState) { | ||
| clearGlobalState(); | ||
| } | ||
| render(location2.pathname); | ||
| }); | ||
| }; | ||
| const Fragment = ({ children }) => h(null, null, ...children); | ||
| const reroute = (path) => history.push(path); | ||
| const sanitized = {}; | ||
@@ -118,3 +164,4 @@ const updateTree = {}; | ||
| getKey, | ||
| getThis: () => getReference(webComponentInfo, key) | ||
| getThis: () => getReference(webComponentInfo, key), | ||
| reroute | ||
| }; | ||
@@ -276,47 +323,2 @@ attrs = __spreadProps(__spreadValues({}, attrs), { HELPERS: helpers }); | ||
| const store = new Proxy(initialStore, storeHandler()); | ||
| const isExternalPath = (path) => /^https?:\/\//.test(path); | ||
| const initRouter = (routerOptions, appContainer, baseComponent) => { | ||
| const { routes, persistState = false } = routerOptions; | ||
| const history = createBrowserHistory(); | ||
| store.routerInfo.history = history; | ||
| appContainer.addEventListener("click", (event) => { | ||
| const target = event.composedPath()[0]; | ||
| const getLink = (target2) => { | ||
| if (target2.tagName === "A") { | ||
| return target2.getAttribute("href"); | ||
| } | ||
| if (target2.closest("a")) { | ||
| return target2.closest("a").getAttribute("href"); | ||
| } | ||
| return null; | ||
| }; | ||
| const link = getLink(target); | ||
| if (!link || isExternalPath(link)) { | ||
| return; | ||
| } | ||
| event.preventDefault(); | ||
| history.push(link); | ||
| }); | ||
| store.routerInfo.enabled = true; | ||
| const router = new UniversalRouter(routes); | ||
| const container = appContainer; | ||
| const render = (pathname) => router.resolve(pathname).then((html) => { | ||
| store.routerInfo.currentPath = pathname; | ||
| container.innerHTML = html; | ||
| container.dataset.route = pathname; | ||
| }); | ||
| const location = history.location; | ||
| container.dataset.route = location.pathname; | ||
| if (location.pathname !== "/") { | ||
| render(location.pathname); | ||
| } else { | ||
| appContainer.innerHTML = baseComponent(); | ||
| } | ||
| history.listen(({ location: location2, action }) => { | ||
| if (!persistState) { | ||
| clearGlobalState(); | ||
| } | ||
| render(location2.pathname); | ||
| }); | ||
| }; | ||
| const globalCSS = []; | ||
@@ -323,0 +325,0 @@ const jsxtraInit = (optionsObj) => { |
@@ -1,1 +0,1 @@ | ||
| var ot=Object.defineProperty,st=Object.defineProperties;var rt=Object.getOwnPropertyDescriptors;var G=Object.getOwnPropertySymbols;var it=Object.prototype.hasOwnProperty,ct=Object.prototype.propertyIsEnumerable;var K=(s,r,a)=>r in s?ot(s,r,{enumerable:!0,configurable:!0,writable:!0,value:a}):s[r]=a,j=(s,r)=>{for(var a in r||(r={}))it.call(r,a)&&K(s,a,r[a]);if(G)for(var a of G(r))ct.call(r,a)&&K(s,a,r[a]);return s},H=(s,r)=>st(s,rt(r));(function(s,r){typeof exports=="object"&&typeof module!="undefined"?r(exports,require("universal-router"),require("history"),require("htm"),require("uuid")):typeof define=="function"&&define.amd?define(["exports","universal-router","history","htm","uuid"],r):(s=typeof globalThis!="undefined"?globalThis:s||self,r(s.jsxtra={},s["universal-router"],s.history,s.htm,s.uuid))})(this,function(s,r,a,O,W){"use strict";function q(t){return t&&typeof t=="object"&&"default"in t?t:{default:t}}var z=q(r),B=q(O);let v={};const J=()=>{v={}},X=t=>e=>{const o={set(c,l,m){return c[l]=m,U(t),!0},get(c,l){return c[l]}};return v[t]||(v[t]=new Proxy(j({},e),o)),v[t]},M=()=>W.v4(),I=(t,e)=>{const o=f[e].thisReference;return o.shadowRoot||o},Q=t=>e=>I(f,t).querySelector(e),P=({children:t})=>E(null,null,...t),N={},k={},f={},U=t=>{if(!f[t].thisReference)return;const e=f[t].thisReference,o=e.shadowRoot||e;o.innerHTML=f[t].rerender()};function E(t,e){const o=typeof t=="function",l=!["area","base","br","col","command","embed","hr","img","input","keygen","link","meta","param","source","track","wbr"].includes(t),m={"&":"amp","<":"lt",">":"gt",'"':"quot","'":"apos"},w=u=>String(u).replace(/[&<>"']/g,n=>`&${m[n]};`);e=e||{};let S=[];for(let u=arguments.length;u-- >2;)S.push(arguments[u]);if(o){const u=B.default.bind(E),n=e.key||M(),d=t.name;if(e=j({},e),e.children=S.reverse(),t.name==="Fragment")return u`${t(e)}`;const L=i=>{for(const h of i)k[h]=k[h]?[...k[h],n]:[n]},A={key:n,$:Q(n),getState:X(n),watch:i=>L(i),onMount:i=>f[n].onMount=i,onUnmount:i=>f[n].onUnmount=i,store:C,getKey:M,getThis:()=>I(f,n)};e=H(j({},e),{HELPERS:A}),f[n]={},f[n].rerender=()=>t(H(j({},e),{HELPERS:A})),f[n].onUnmount=e.onUnmount;class x extends HTMLElement{constructor(){super();this.key=this.getAttribute("key"),this.info=f[this.key],this.info.thisReference=this;const h=this.attachShadow({mode:"open"});h.innerHTML=this.info.rerender(),T.length&&(h.adoptedStyleSheets=T)}connectedCallback(){this.info.onMount&&this.info.onMount()}disconnectedCallback(){this.info.onUnmount&&this.info.onUnmount();const h=this.info.hasShadowDom?[...this.shadowRoot.querySelectorAll("[onclick]")]:[...this.querySelectorAll("[onclick]")],nt=this.info.hasShadowDom?[...this.shadowRoot.querySelectorAll("[onsubmit]")]:[...this.querySelectorAll("[onsubmit]")],F=b=>{const y=b.replace("()","").replace("window.jsxtraEvents.","");delete window.jsxtraEvents[y]};for(const b of h){const y=b.attributes.onclick.textContent;F(y)}for(const b of nt){const y=b.attributes.onsubmit.textContent;F(y)}Object.keys(k).map(b=>{k[b].filter(y=>y!==this.key)})}}return customElements.get("jsxtra-wc")===void 0&&customElements.define("jsxtra-wc",x),u`<${"jsxtra-wc"} component-name=${d} key=${n}></${"jsxtra-wc"}>`}const R=(u,n)=>{if(!u)return"";let d={className:"class",htmlFor:"for"};const L=["onClick","onSubmit"];return`<${u} ${(()=>{let x="";if(n)for(let i in n)if(L.includes(i)){const h=`jsxtra${M().replaceAll("-","_")}`;switch(window.jsxtraEvents||(window.jsxtraEvents={}),window.jsxtraEvents[h]=n[i],i){case"onClick":x+=`onclick='window.jsxtraEvents.${h}()'`;break;case"onSubmit":x+=`onsubmit='window.jsxtraEvents.${h}(event)'`}}else n[i]!==!1&&n[i]!=null&&(x+=` ${d[i]?d[i]:w(i)}="${w(n[i])}"`);return x})()}>`},$=()=>{let u="";if(l)for(;S.length;){let n=S.pop();if(n)if(n.pop)for(let d=n.length;d--;)S.push(n[d]);else u+=N[n]===!0?n:w(n)}return u},g=u=>l&&u?`</${u}>`:"",p=`${R(t,e)}${$()}${g(t)}`;return N[p]=!0,p}E.Fragment=P;const _={routerInfo:{enabled:!1,currentPath:null}},V=t=>{if(!t){console.warn("JSXTRA: No store initialised");return}for(const e of t){const{name:o,store:c}=e;_[o]=c}},Y=(t,e,o)=>{const c=e[t];if(c)for(const l of c)U(l)},D=t=>({set(e,o,c){e[o]=c;const l=[...t,o].join(".");return Y(l,k),!0},get(e,o){return typeof e[o]=="object"&&e[o]!==null?new Proxy(e[o],D(t?[...t,o]:[o])):e[o]}}),C=new Proxy(_,D()),Z=t=>/^https?:\/\//.test(t),tt=(t,e,o)=>{const{routes:c,persistState:l=!1}=t,m=a.createBrowserHistory();C.routerInfo.history=m,e.addEventListener("click",g=>{const p=g.composedPath()[0],n=(d=>d.tagName==="A"?d.getAttribute("href"):d.closest("a")?d.closest("a").getAttribute("href"):null)(p);!n||Z(n)||(g.preventDefault(),m.push(n))}),C.routerInfo.enabled=!0;const w=new z.default(c),S=e,R=g=>w.resolve(g).then(p=>{C.routerInfo.currentPath=g,S.innerHTML=p,S.dataset.route=g}),$=m.location;S.dataset.route=$.pathname,$.pathname!=="/"?R($.pathname):e.innerHTML=o(),m.listen(({location:g,action:p})=>{l||J(),R(g.pathname)})},T=[],et=t=>{const{stores:e,appContainer:o,baseComponent:c,router:l,globalStyles:m}=t,w=new CSSStyleSheet;w.replace(m),T.push(w),document.adoptedStyleSheets=T,V(e),l?tt(l,o,c):o.innerHTML=c()};s.Fragment=P,s.globalCSS=T,s.h=E,s.jsxtraInit=et,s.store=C,Object.defineProperty(s,"__esModule",{value:!0}),s[Symbol.toStringTag]="Module"}); | ||
| var rt=Object.defineProperty,it=Object.defineProperties;var ct=Object.getOwnPropertyDescriptors;var K=Object.getOwnPropertySymbols;var ut=Object.prototype.hasOwnProperty,lt=Object.prototype.propertyIsEnumerable;var O=(s,i,a)=>i in s?rt(s,i,{enumerable:!0,configurable:!0,writable:!0,value:a}):s[i]=a,v=(s,i)=>{for(var a in i||(i={}))ut.call(i,a)&&O(s,a,i[a]);if(K)for(var a of K(i))lt.call(i,a)&&O(s,a,i[a]);return s},q=(s,i)=>it(s,ct(i));(function(s,i){typeof exports=="object"&&typeof module!="undefined"?i(exports,require("universal-router"),require("history"),require("htm"),require("uuid")):typeof define=="function"&&define.amd?define(["exports","universal-router","history","htm","uuid"],i):(s=typeof globalThis!="undefined"?globalThis:s||self,i(s.jsxtra={},s["universal-router"],s.history$1,s.htm,s.uuid))})(this,function(s,i,a,W,z){"use strict";function I(t){return t&&typeof t=="object"&&"default"in t?t:{default:t}}var B=I(i),J=I(W);let E={};const X=()=>{E={}},Q=t=>e=>{const o={set(u,l,S){return u[l]=S,_(t),!0},get(u,l){return u[l]}};return E[t]||(E[t]=new Proxy(v({},e),o)),E[t]},M=()=>z.v4(),P=(t,e)=>{const o=f[e].thisReference;return o.shadowRoot||o},V=t=>e=>P(f,t).querySelector(e),Y=t=>/^https?:\/\//.test(t),C=a.createBrowserHistory(),Z=(t,e,o)=>{const{routes:u,persistState:l=!1}=t;T.routerInfo.history=C,e.addEventListener("click",m=>{const k=m.composedPath()[0],r=(n=>n.tagName==="A"?n.getAttribute("href"):n.closest("a")?n.closest("a").getAttribute("href"):null)(k);!r||Y(r)||(m.preventDefault(),C.push(r))}),T.routerInfo.enabled=!0;const S=new B.default(u),d=e,g=m=>S.resolve(m).then(k=>{T.routerInfo.currentPath=m,d.innerHTML=k,d.dataset.route=m}),j=C.location;d.dataset.route=j.pathname,j.pathname!=="/"?g(j.pathname):e.innerHTML=o(),C.listen(({location:m,action:k})=>{l||X(),g(m.pathname)})},N=({children:t})=>R(null,null,...t),tt=t=>C.push(t),U={},y={},f={},_=t=>{if(!f[t].thisReference)return;const e=f[t].thisReference,o=e.shadowRoot||e;o.innerHTML=f[t].rerender()};function R(t,e){const o=typeof t=="function",l=!["area","base","br","col","command","embed","hr","img","input","keygen","link","meta","param","source","track","wbr"].includes(t),S={"&":"amp","<":"lt",">":"gt",'"':"quot","'":"apos"},d=r=>String(r).replace(/[&<>"']/g,n=>`&${S[n]};`);e=e||{};let g=[];for(let r=arguments.length;r-- >2;)g.push(arguments[r]);if(o){const r=J.default.bind(R),n=e.key||M(),w=t.name;if(e=v({},e),e.children=g.reverse(),t.name==="Fragment")return r`${t(e)}`;const A=c=>{for(const h of c)y[h]=y[h]?[...y[h],n]:[n]},H={key:n,$:V(n),getState:Q(n),watch:c=>A(c),onMount:c=>f[n].onMount=c,onUnmount:c=>f[n].onUnmount=c,store:T,getKey:M,getThis:()=>P(f,n),reroute:tt};e=q(v({},e),{HELPERS:H}),f[n]={},f[n].rerender=()=>t(q(v({},e),{HELPERS:H})),f[n].onUnmount=e.onUnmount;class x extends HTMLElement{constructor(){super();this.key=this.getAttribute("key"),this.info=f[this.key],this.info.thisReference=this;const h=this.attachShadow({mode:"open"});h.innerHTML=this.info.rerender(),$.length&&(h.adoptedStyleSheets=$)}connectedCallback(){this.info.onMount&&this.info.onMount()}disconnectedCallback(){this.info.onUnmount&&this.info.onUnmount();const h=this.info.hasShadowDom?[...this.shadowRoot.querySelectorAll("[onclick]")]:[...this.querySelectorAll("[onclick]")],st=this.info.hasShadowDom?[...this.shadowRoot.querySelectorAll("[onsubmit]")]:[...this.querySelectorAll("[onsubmit]")],G=p=>{const b=p.replace("()","").replace("window.jsxtraEvents.","");delete window.jsxtraEvents[b]};for(const p of h){const b=p.attributes.onclick.textContent;G(b)}for(const p of st){const b=p.attributes.onsubmit.textContent;G(b)}Object.keys(y).map(p=>{y[p].filter(b=>b!==this.key)})}}return customElements.get("jsxtra-wc")===void 0&&customElements.define("jsxtra-wc",x),r`<${"jsxtra-wc"} component-name=${w} key=${n}></${"jsxtra-wc"}>`}const j=(r,n)=>{if(!r)return"";let w={className:"class",htmlFor:"for"};const A=["onClick","onSubmit"];return`<${r} ${(()=>{let x="";if(n)for(let c in n)if(A.includes(c)){const h=`jsxtra${M().replaceAll("-","_")}`;switch(window.jsxtraEvents||(window.jsxtraEvents={}),window.jsxtraEvents[h]=n[c],c){case"onClick":x+=`onclick='window.jsxtraEvents.${h}()'`;break;case"onSubmit":x+=`onsubmit='window.jsxtraEvents.${h}(event)'`}}else n[c]!==!1&&n[c]!=null&&(x+=` ${w[c]?w[c]:d(c)}="${d(n[c])}"`);return x})()}>`},m=()=>{let r="";if(l)for(;g.length;){let n=g.pop();if(n)if(n.pop)for(let w=n.length;w--;)g.push(n[w]);else r+=U[n]===!0?n:d(n)}return r},k=r=>l&&r?`</${r}>`:"",L=`${j(t,e)}${m()}${k(t)}`;return U[L]=!0,L}R.Fragment=N;const D={routerInfo:{enabled:!1,currentPath:null}},et=t=>{if(!t){console.warn("JSXTRA: No store initialised");return}for(const e of t){const{name:o,store:u}=e;D[o]=u}},nt=(t,e,o)=>{const u=e[t];if(u)for(const l of u)_(l)},F=t=>({set(e,o,u){e[o]=u;const l=[...t,o].join(".");return nt(l,y),!0},get(e,o){return typeof e[o]=="object"&&e[o]!==null?new Proxy(e[o],F(t?[...t,o]:[o])):e[o]}}),T=new Proxy(D,F()),$=[],ot=t=>{const{stores:e,appContainer:o,baseComponent:u,router:l,globalStyles:S}=t,d=new CSSStyleSheet;d.replace(S),$.push(d),document.adoptedStyleSheets=$,et(e),l?Z(l,o,u):o.innerHTML=u()};s.Fragment=N,s.globalCSS=$,s.h=R,s.jsxtraInit=ot,s.store=T,Object.defineProperty(s,"__esModule",{value:!0}),s[Symbol.toStringTag]="Module"}); |
@@ -17,3 +17,3 @@ { | ||
| }, | ||
| "version": "0.0.20", | ||
| "version": "0.0.21", | ||
| "scripts": { | ||
@@ -20,0 +20,0 @@ "dev": "vite", |
No alert changes
Improved metrics
- Total package byte prevSize
- increased by0.32%
28499
- Lines of code
- increased by0.56%
356
No dependency changes