ajo 0.0.10 → 0.0.14

package/index.cjs

@@ -96,7 +96,7 @@ const Fragment = ({ children }) => children, h = (nodeName, props, ...children)
 }, propagate = (host, error) => {
   for (let interceptor; host; host = host.parentNode)
     if (interceptor = interceptors.get(host))
-      return render(host, interceptor(error));
+      return render(interceptor(error), host);
   throw error;
 }, cleanup = (host, cleaner) => {
   if (!isFn(cleaner))

package/index.js

@@ -0,0 +1,198 @@
+export const
+  Fragment = ({ children }) => children,
+
+  h = (nodeName, props, ...children) => {
+    children = children.length == 0 ? null : children.length == 1 ? children[0] : children
+    return { children, ...props, nodeName }
+  },
+
+  component = setup => ({ is, key, host, ref, ...props }) => h(is ?? setup.is ?? 'div', {
+    key, ...setup.host, ...host, skip: true, ref: host => (refresh(host, props, setup), isFn(ref) && ref(host))
+  }),
+
+  render = (h, host) => {
+
+    let child = host.firstChild, node, byKey = keyed.get(host)
+
+    for (h of normalize(h, host)) {
+
+      if (typeof h == 'string') {
+
+        for (node = child; node; node = node.nextSibling) if (node.nodeType == 3) break
+        node ? node.data !== h && (node.data = h) : node = document.createTextNode(h)
+
+      } else if (h instanceof Node) {
+
+        node = h
+
+      } else {
+
+        const { key, nodeName, skip, block, children, ref, ...props } = h
+
+        if (key != null && (node = byKey?.get(key)));
+        else for (node = child; node; node = node.nextSibling) if (node.localName == nodeName) break
+
+        node ||= document.createElement(nodeName)
+
+        key != null && (byKey ||= keyed.set(host, new Map)).set(key, node)
+
+        update(props, node)
+
+        !(skip || block != null && every(deps.get(node), deps.set(node, block))) && render(children, node)
+
+        isFn(ref) && ref(node)
+      }
+
+      node === child ? child = child.nextSibling : before(host, child, node)
+    }
+
+    while (child) {
+      const next = child.nextSibling
+      host.removeChild(child).nodeType == 1 && dispose(child)
+      child = next
+    }
+  },
+
+  refresh = (host, props, setup) => {
+    try {
+      if (setup && !isFn(setup)) throwTypeError('Setup', setup, fn)
+      props = props ? memo.set(host, { ...setup?.props, ...props }) : memo.get(host) ?? {}
+      render((renders.get(host) ?? renders.set(host, setup(props, host)))(props, host), host)
+    } catch (error) {
+      propagate(host, error)
+    }
+  },
+
+  provide = (host, key, value) => (provisions.get(host) ?? provisions.set(host, new Map)).set(key, value),
+
+  consume = (host, key, fallback) => {
+    let map
+    while (host) {
+      if ((map = provisions.get(host)) && map.has(key)) return map.get(key)
+      host = host.parentNode
+    }
+    return fallback
+  },
+
+  intercept = (host, interceptor) => {
+    if (!isFn(interceptor)) throwTypeError('Interceptor', interceptor, fn)
+    interceptors.set(host, interceptor)
+  },
+
+  propagate = (host, error) => {
+    for (let interceptor; host; host = host.parentNode)
+      if (interceptor = interceptors.get(host)) return render(interceptor(error), host)
+    throw error
+  },
+
+  cleanup = (host, cleaner) => {
+    if (!isFn(cleaner)) throwTypeError('Cleaner', cleaner, fn);
+    (cleaners.get(host) ?? cleaners.set(host, new Set)).add(cleaner)
+  },
+
+  clx = o => keys(o).filter(k => o[k]).join(' ') || null,
+  stx = o => entries(o).map(t => t.join(':')).join(';') || null,
+  keb = o => keys(o).reduce((r, k) => ((r[k.replace(search, replace).toLowerCase()] = o[k]), r), {})
+
+const
+  wm = () => {
+    const instance = new WeakMap, { set } = instance
+    instance.set = (key, value) => (set.call(instance, key, value), value)
+    return instance
+  },
+
+  throwTypeError = (name, value, expected) => {
+    throw new TypeError(`Expected ${name} to be of type ${expected}, got ${typeof value} instead`)
+  },
+
+  every = (a, b) => a === b || isArray(a) && isArray(b) && a.length == b.length && a.every((v, i) => v === b[i]),
+  apply = (o, { name, value }) => ((o[name] = value), o),
+  reduce = list => from(list).reduce(apply, {}),
+  isFn = v => typeof v == fn,
+
+  { keys, entries } = Object, { isArray, from } = Array,
+
+  fn = 'function', search = /([a-z0-9])([A-Z])/g, replace = '$1-$2',
+
+  keyed = wm(), deps = wm(), memo = wm(), renders = wm(), provisions = wm(), interceptors = wm(), cleaners = wm(), cache = wm(),
+
+  normalize = function* (h, host) {
+
+    let type, buffer = ''
+
+    for (h of isFn(h?.[Symbol.iterator]) ? h : [h]) {
+
+      if (h == null || (type = typeof h) == 'boolean') continue
+
+      if (type == 'string' || type == 'number') {
+        buffer += h
+        continue
+      }
+
+      if ('nodeName' in Object(h)) {
+
+        if (isFn(h.nodeName)) {
+          yield* normalize(h.nodeName(h, host), host)
+          continue
+        }
+
+        if (buffer) {
+          yield buffer
+          buffer = ''
+        }
+
+        yield h
+        continue
+      }
+
+      isFn(h[Symbol.iterator]) ? yield* normalize(h, host) : buffer += h
+    }
+
+    if (buffer) yield buffer
+  },
+
+  update = (props, host) => {
+
+    const prev = cache.get(host) ?? (host.hasAttributes() ? reduce(host.attributes) : {})
+
+    for (const name in { ...prev, ...props }) {
+
+      let value = props[name]
+
+      if (value === prev[name]) continue
+
+      if (name.startsWith('set:')) {
+        host[name.slice(4)] = value
+        continue
+      }
+
+      if (value === true) value = ''
+      else if (value == null || value === false) {
+        host.removeAttribute(name)
+        continue
+      }
+
+      host.setAttribute(name, value)
+    }
+
+    cache.set(host, props)
+  },
+
+  before = (host, child, node) => {
+    if (node.contains?.(document.activeElement)) {
+
+      const ref = node.nextSibling
+
+      while (child && child !== node) {
+        const next = child.nextSibling
+        host.insertBefore(child, ref)
+        child = next
+      }
+
+    } else host.insertBefore(node, child)
+  },
+
+  dispose = host => {
+    for (const child of host.children) dispose(child)
+    for (const cleaner of cleaners.get(host) ?? []) cleaner(host)
+  }

package/index.min.js

@@ -1 +1 @@
-var ajo=(()=>{var d=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var W=Object.prototype.hasOwnProperty;var I=(e,n)=>{for(var t in n)d(e,t,{get:n[t],enumerable:!0})},K=(e,n,t,r)=>{if(n&&typeof n=="object"||typeof n=="function")for(let i of O(n))!W.call(e,i)&&i!==t&&d(e,i,{get:()=>n[i],enumerable:!(r=F(n,i))||r.enumerable});return e};var L=e=>K(d({},"__esModule",{value:!0}),e);var re={};I(re,{Fragment:()=>Z,cleanup:()=>J,clx:()=>P,component:()=>q,consume:()=>G,h:()=>A,intercept:()=>H,keb:()=>R,propagate:()=>E,provide:()=>D,refresh:()=>j,render:()=>c,stx:()=>Q});const Z=({children:e})=>e,A=(e,n,...t)=>(t=t.length==0?null:t.length==1?t[0]:t,{children:t,...n,nodeName:e}),q=e=>({is:n,key:t,host:r,ref:i,...l})=>A(n??e.is??"div",{key:t,...e.host,...r,skip:!0,ref:o=>(j(o,l,e),f(i)&&i(o))}),c=(e,n)=>{let t=n.firstChild,r,i=x.get(n);for(e of m(e,n)){if(typeof e=="string"){for(r=t;r&&r.nodeType!=3;r=r.nextSibling);r?r.data!==e&&(r.data=e):r=document.createTextNode(e)}else if(e instanceof Node)r=e;else{const{key:l,nodeName:o,skip:M,block:p,children:z,ref:b,...B}=e;if(!(l!=null&&(r=i?.get(l))))for(r=t;r&&r.localName!=o;r=r.nextSibling);r||=document.createElement(o),l!=null&&(i||=x.set(n,new Map)).set(l,r),ne(B,r),!(M||p!=null&&U(S.get(r),S.set(r,p)))&&c(z,r),f(b)&&b(r)}r===t?t=t.nextSibling:te(n,t,r)}for(;t;){const l=t.nextSibling;n.removeChild(t).nodeType==1&&C(t),t=l}},j=(e,n,t)=>{try{t&&!f(t)&&s("Setup",t,u),n=n?v.set(e,{...t?.props,...n}):v.get(e)??{},c((N.get(e)??N.set(e,t(n,e)))(n,e),e)}catch(r){E(e,r)}},D=(e,n,t)=>(g.get(e)??g.set(e,new Map)).set(n,t),G=(e,n,t)=>{let r;for(;e;){if((r=g.get(e))&&r.has(n))return r.get(n);e=e.parentNode}return t},H=(e,n)=>{f(n)||s("Interceptor",n,u),$.set(e,n)},E=(e,n)=>{for(let t;e;e=e.parentNode)if(t=$.get(e))return c(e,t(n));throw n},J=(e,n)=>{f(n)||s("Cleaner",n,u),(y.get(e)??y.set(e,new Set)).add(n)},P=e=>T(e).filter(n=>e[n]).join(" ")||null,Q=e=>Y(e).map(n=>n.join(":")).join(";")||null,R=e=>T(e).reduce((n,t)=>(n[t.replace(h,ee).toLowerCase()]=e[t],n),{}),a=()=>{const e=new WeakMap,{set:n}=e;return e.set=(t,r)=>(n.call(e,t,r),r),e},s=(e,n,t)=>{throw new TypeError(`Expected ${e} to be of type ${t}, got ${typeof n} instead`)},U=(e,n)=>e===n||w(e)&&w(n)&&e.length==n.length&&e.every((t,r)=>t===n[r]),V=(e,{name:n,value:t})=>(e[n]=t,e),X=e=>_(e).reduce(V,{}),f=e=>typeof e==u,{keys:T,entries:Y}=Object,{isArray:w,from:_}=Array,u="function",h=/([a-z0-9])([A-Z])/g,ee="$1-$2",x=a(),S=a(),v=a(),N=a(),g=a(),$=a(),y=a(),k=a(),m=function*(e,n){let t,r="";for(e of f(e?.[Symbol.iterator])?e:[e])if(!(e==null||(t=typeof e)=="boolean")){if(t=="string"||t=="number"){r+=e;continue}if("nodeName"in Object(e)){if(f(e.nodeName)){yield*m(e.nodeName(e,n),n);continue}r&&(yield r,r=""),yield e;continue}f(e[Symbol.iterator])?yield*m(e,n):r+=e}r&&(yield r)},ne=(e,n)=>{const t=k.get(n)??(n.hasAttributes()?X(n.attributes):{});for(const r in{...t,...e}){let i=e[r];if(i!==t[r]){if(r.startsWith("set:")){n[r.slice(4)]=i;continue}if(i===!0)i="";else if(i==null||i===!1){n.removeAttribute(r);continue}n.setAttribute(r,i)}}k.set(n,e)},te=(e,n,t)=>{if(t.contains?.(document.activeElement)){const r=t.nextSibling;for(;n&&n!==t;){const i=n.nextSibling;e.insertBefore(n,r),n=i}}else e.insertBefore(t,n)},C=e=>{for(const n of e.children)C(n);for(const n of y.get(e)??[])n(e)};return L(re);})();
+var ajo=(()=>{var d=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var W=Object.prototype.hasOwnProperty;var I=(e,n)=>{for(var t in n)d(e,t,{get:n[t],enumerable:!0})},K=(e,n,t,r)=>{if(n&&typeof n=="object"||typeof n=="function")for(let i of O(n))!W.call(e,i)&&i!==t&&d(e,i,{get:()=>n[i],enumerable:!(r=F(n,i))||r.enumerable});return e};var L=e=>K(d({},"__esModule",{value:!0}),e);var re={};I(re,{Fragment:()=>Z,cleanup:()=>J,clx:()=>P,component:()=>q,consume:()=>G,h:()=>A,intercept:()=>H,keb:()=>R,propagate:()=>E,provide:()=>D,refresh:()=>j,render:()=>c,stx:()=>Q});const Z=({children:e})=>e,A=(e,n,...t)=>(t=t.length==0?null:t.length==1?t[0]:t,{children:t,...n,nodeName:e}),q=e=>({is:n,key:t,host:r,ref:i,...l})=>A(n??e.is??"div",{key:t,...e.host,...r,skip:!0,ref:o=>(j(o,l,e),f(i)&&i(o))}),c=(e,n)=>{let t=n.firstChild,r,i=x.get(n);for(e of m(e,n)){if(typeof e=="string"){for(r=t;r&&r.nodeType!=3;r=r.nextSibling);r?r.data!==e&&(r.data=e):r=document.createTextNode(e)}else if(e instanceof Node)r=e;else{const{key:l,nodeName:o,skip:M,block:p,children:z,ref:b,...B}=e;if(!(l!=null&&(r=i?.get(l))))for(r=t;r&&r.localName!=o;r=r.nextSibling);r||=document.createElement(o),l!=null&&(i||=x.set(n,new Map)).set(l,r),ne(B,r),!(M||p!=null&&U(S.get(r),S.set(r,p)))&&c(z,r),f(b)&&b(r)}r===t?t=t.nextSibling:te(n,t,r)}for(;t;){const l=t.nextSibling;n.removeChild(t).nodeType==1&&C(t),t=l}},j=(e,n,t)=>{try{t&&!f(t)&&s("Setup",t,u),n=n?v.set(e,{...t?.props,...n}):v.get(e)??{},c((N.get(e)??N.set(e,t(n,e)))(n,e),e)}catch(r){E(e,r)}},D=(e,n,t)=>(g.get(e)??g.set(e,new Map)).set(n,t),G=(e,n,t)=>{let r;for(;e;){if((r=g.get(e))&&r.has(n))return r.get(n);e=e.parentNode}return t},H=(e,n)=>{f(n)||s("Interceptor",n,u),$.set(e,n)},E=(e,n)=>{for(let t;e;e=e.parentNode)if(t=$.get(e))return c(t(n),e);throw n},J=(e,n)=>{f(n)||s("Cleaner",n,u),(y.get(e)??y.set(e,new Set)).add(n)},P=e=>T(e).filter(n=>e[n]).join(" ")||null,Q=e=>Y(e).map(n=>n.join(":")).join(";")||null,R=e=>T(e).reduce((n,t)=>(n[t.replace(h,ee).toLowerCase()]=e[t],n),{}),a=()=>{const e=new WeakMap,{set:n}=e;return e.set=(t,r)=>(n.call(e,t,r),r),e},s=(e,n,t)=>{throw new TypeError(`Expected ${e} to be of type ${t}, got ${typeof n} instead`)},U=(e,n)=>e===n||w(e)&&w(n)&&e.length==n.length&&e.every((t,r)=>t===n[r]),V=(e,{name:n,value:t})=>(e[n]=t,e),X=e=>_(e).reduce(V,{}),f=e=>typeof e==u,{keys:T,entries:Y}=Object,{isArray:w,from:_}=Array,u="function",h=/([a-z0-9])([A-Z])/g,ee="$1-$2",x=a(),S=a(),v=a(),N=a(),g=a(),$=a(),y=a(),k=a(),m=function*(e,n){let t,r="";for(e of f(e?.[Symbol.iterator])?e:[e])if(!(e==null||(t=typeof e)=="boolean")){if(t=="string"||t=="number"){r+=e;continue}if("nodeName"in Object(e)){if(f(e.nodeName)){yield*m(e.nodeName(e,n),n);continue}r&&(yield r,r=""),yield e;continue}f(e[Symbol.iterator])?yield*m(e,n):r+=e}r&&(yield r)},ne=(e,n)=>{const t=k.get(n)??(n.hasAttributes()?X(n.attributes):{});for(const r in{...t,...e}){let i=e[r];if(i!==t[r]){if(r.startsWith("set:")){n[r.slice(4)]=i;continue}if(i===!0)i="";else if(i==null||i===!1){n.removeAttribute(r);continue}n.setAttribute(r,i)}}k.set(n,e)},te=(e,n,t)=>{if(t.contains?.(document.activeElement)){const r=t.nextSibling;for(;n&&n!==t;){const i=n.nextSibling;e.insertBefore(n,r),n=i}}else e.insertBefore(t,n)},C=e=>{for(const n of e.children)C(n);for(const n of y.get(e)??[])n(e)};return L(re);})();

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "ajo",
-  "version": "0.0.10",
+  "version": "0.0.14",
   "description": "ajo is a JavaScript view library for building user interfaces",
   "type": "module",
   "module": "index.js",
   "main": "index.cjs",
+  "unpkg": "index.min.js",
   "exports": {
     ".": {
       "import": "./index.js",
@@ -13,6 +14,7 @@
     }
   },
   "files": [
+    "index.js",
     "index.min.js"
   ],
   "scripts": {

package/readme.md

@@ -45,7 +45,7 @@ const Counter = component(({ start = 0 }, host) => {
   }
   
   return () =>
-    <button onclick={increment}>
+    <button set:onclick={increment}>
       Current: {count}
     </button>
 })