solid-ctrl-flow 1.0.5 → 1.0.7

package/dist/index.d.ts

@@ -95,6 +95,12 @@ export declare namespace Debug {
  */
 export declare function memoProps<T, K extends readonly (keyof T)[] = (keyof T)[]>(obj: T, keys?: K): Pick<T, K[number]>;
 
+/** Wraps an element with a div with the specified {@link JSX.CustomAttributes.classList} if at least one of them is `true` */
+export declare function OptionalWrapper(props: {
+    classList: Record<string, boolean | undefined>;
+    children: JSX.Element;
+}): JSX.Element;
+
 /**
  * Esecutes {@link splitProps} and memoizes the first of the two returned objects
  * @param obj Object to split and partially memoize

package/dist/index.mjs

@@ -1,5 +1,242 @@
-import { createContext, createMemo, createComponent, useContext, Match, mergeProps, onCleanup, Show, splitProps } from "solid-js";
+import { sharedConfig, createRenderEffect, untrack, createContext, createMemo, createComponent, useContext, Match, mergeProps, onCleanup, Show, splitProps } from "solid-js";
 import { createMutable } from "solid-js/store";
+function reconcileArrays(parentNode, a, b) {
+  let bLength = b.length, aEnd = a.length, bEnd = bLength, aStart = 0, bStart = 0, after = a[aEnd - 1].nextSibling, map = null;
+  while (aStart < aEnd || bStart < bEnd) {
+    if (a[aStart] === b[bStart]) {
+      aStart++;
+      bStart++;
+      continue;
+    }
+    while (a[aEnd - 1] === b[bEnd - 1]) {
+      aEnd--;
+      bEnd--;
+    }
+    if (aEnd === aStart) {
+      const node = bEnd < bLength ? bStart ? b[bStart - 1].nextSibling : b[bEnd - bStart] : after;
+      while (bStart < bEnd)
+        parentNode.insertBefore(b[bStart++], node);
+    } else if (bEnd === bStart) {
+      while (aStart < aEnd) {
+        if (!map || !map.has(a[aStart]))
+          a[aStart].remove();
+        aStart++;
+      }
+    } else if (a[aStart] === b[bEnd - 1] && b[bStart] === a[aEnd - 1]) {
+      const node = a[--aEnd].nextSibling;
+      parentNode.insertBefore(b[bStart++], a[aStart++].nextSibling);
+      parentNode.insertBefore(b[--bEnd], node);
+      a[aEnd] = b[bEnd];
+    } else {
+      if (!map) {
+        map = /* @__PURE__ */ new Map();
+        let i = bStart;
+        while (i < bEnd)
+          map.set(b[i], i++);
+      }
+      const index = map.get(a[aStart]);
+      if (index != null) {
+        if (bStart < index && index < bEnd) {
+          let i = aStart, sequence = 1, t;
+          while (++i < aEnd && i < bEnd) {
+            if ((t = map.get(a[i])) == null || t !== index + sequence)
+              break;
+            sequence++;
+          }
+          if (sequence > index - bStart) {
+            const node = a[aStart];
+            while (bStart < index)
+              parentNode.insertBefore(b[bStart++], node);
+          } else
+            parentNode.replaceChild(b[bStart++], a[aStart++]);
+        } else
+          aStart++;
+      } else
+        a[aStart++].remove();
+    }
+  }
+}
+function template(html, isCE, isSVG) {
+  let node;
+  const create = () => {
+    const t = document.createElement("template");
+    t.innerHTML = html;
+    return isSVG ? t.content.firstChild.firstChild : t.content.firstChild;
+  };
+  const fn = isCE ? () => untrack(() => document.importNode(node || (node = create()), true)) : () => (node || (node = create())).cloneNode(true);
+  fn.cloneNode = fn;
+  return fn;
+}
+function className(node, value) {
+  if (sharedConfig.context)
+    return;
+  if (value == null)
+    node.removeAttribute("class");
+  else
+    node.className = value;
+}
+function insert(parent, accessor, marker, initial) {
+  if (marker !== void 0 && !initial)
+    initial = [];
+  if (typeof accessor !== "function")
+    return insertExpression(parent, accessor, initial, marker);
+  createRenderEffect((current) => insertExpression(parent, accessor(), current, marker), initial);
+}
+function insertExpression(parent, value, current, marker, unwrapArray) {
+  if (sharedConfig.context) {
+    !current && (current = [...parent.childNodes]);
+    let cleaned = [];
+    for (let i = 0; i < current.length; i++) {
+      const node = current[i];
+      if (node.nodeType === 8 && node.data.slice(0, 2) === "!$")
+        node.remove();
+      else
+        cleaned.push(node);
+    }
+    current = cleaned;
+  }
+  while (typeof current === "function")
+    current = current();
+  if (value === current)
+    return current;
+  const t = typeof value, multi = marker !== void 0;
+  parent = multi && current[0] && current[0].parentNode || parent;
+  if (t === "string" || t === "number") {
+    if (sharedConfig.context)
+      return current;
+    if (t === "number")
+      value = value.toString();
+    if (multi) {
+      let node = current[0];
+      if (node && node.nodeType === 3) {
+        node.data = value;
+      } else
+        node = document.createTextNode(value);
+      current = cleanChildren(parent, current, marker, node);
+    } else {
+      if (current !== "" && typeof current === "string") {
+        current = parent.firstChild.data = value;
+      } else
+        current = parent.textContent = value;
+    }
+  } else if (value == null || t === "boolean") {
+    if (sharedConfig.context)
+      return current;
+    current = cleanChildren(parent, current, marker);
+  } else if (t === "function") {
+    createRenderEffect(() => {
+      let v = value();
+      while (typeof v === "function")
+        v = v();
+      current = insertExpression(parent, v, current, marker);
+    });
+    return () => current;
+  } else if (Array.isArray(value)) {
+    const array = [];
+    const currentArray = current && Array.isArray(current);
+    if (normalizeIncomingArray(array, value, current, unwrapArray)) {
+      createRenderEffect(() => current = insertExpression(parent, array, current, marker, true));
+      return () => current;
+    }
+    if (sharedConfig.context) {
+      if (!array.length)
+        return current;
+      if (marker === void 0)
+        return [...parent.childNodes];
+      let node = array[0];
+      let nodes = [node];
+      while ((node = node.nextSibling) !== marker)
+        nodes.push(node);
+      return current = nodes;
+    }
+    if (array.length === 0) {
+      current = cleanChildren(parent, current, marker);
+      if (multi)
+        return current;
+    } else if (currentArray) {
+      if (current.length === 0) {
+        appendNodes(parent, array, marker);
+      } else
+        reconcileArrays(parent, current, array);
+    } else {
+      current && cleanChildren(parent);
+      appendNodes(parent, array);
+    }
+    current = array;
+  } else if (value.nodeType) {
+    if (sharedConfig.context && value.parentNode)
+      return current = multi ? [value] : value;
+    if (Array.isArray(current)) {
+      if (multi)
+        return current = cleanChildren(parent, current, marker, value);
+      cleanChildren(parent, current, null, value);
+    } else if (current == null || current === "" || !parent.firstChild) {
+      parent.appendChild(value);
+    } else
+      parent.replaceChild(value, parent.firstChild);
+    current = value;
+  } else
+    ;
+  return current;
+}
+function normalizeIncomingArray(normalized, array, current, unwrap) {
+  let dynamic = false;
+  for (let i = 0, len = array.length; i < len; i++) {
+    let item = array[i], prev = current && current[i], t;
+    if (item == null || item === true || item === false)
+      ;
+    else if ((t = typeof item) === "object" && item.nodeType) {
+      normalized.push(item);
+    } else if (Array.isArray(item)) {
+      dynamic = normalizeIncomingArray(normalized, item, prev) || dynamic;
+    } else if (t === "function") {
+      if (unwrap) {
+        while (typeof item === "function")
+          item = item();
+        dynamic = normalizeIncomingArray(
+          normalized,
+          Array.isArray(item) ? item : [item],
+          Array.isArray(prev) ? prev : [prev]
+        ) || dynamic;
+      } else {
+        normalized.push(item);
+        dynamic = true;
+      }
+    } else {
+      const value = String(item);
+      if (prev && prev.nodeType === 3 && prev.data === value)
+        normalized.push(prev);
+      else
+        normalized.push(document.createTextNode(value));
+    }
+  }
+  return dynamic;
+}
+function appendNodes(parent, array, marker = null) {
+  for (let i = 0, len = array.length; i < len; i++)
+    parent.insertBefore(array[i], marker);
+}
+function cleanChildren(parent, current, marker, replacement) {
+  if (marker === void 0)
+    return parent.textContent = "";
+  const node = replacement || document.createTextNode("");
+  if (current.length) {
+    let inserted = false;
+    for (let i = current.length - 1; i >= 0; i--) {
+      const el = current[i];
+      if (node !== el) {
+        const isParent = el.parentNode === parent;
+        if (!inserted && !i)
+          isParent ? parent.replaceChild(node, el) : parent.insertBefore(node, marker);
+        else
+          isParent && el.remove();
+      } else
+        inserted = true;
+    }
+  } else
+    parent.insertBefore(node, marker);
+  return [node];
+}
 const ctx$1 = createContext(() => void 0, {
   name: "case-when"
 });
@@ -98,6 +335,25 @@ function Joint(props) {
     }
   });
 }
+const _tmpl$ = /* @__PURE__ */ template(`<div>`);
+function OptionalWrapper(props) {
+  const classList = createMemo(() => Object.entries(props.classList).filter((x) => x[1]).map((x) => x[0]));
+  const children = createMemo(() => props.children);
+  return createComponent(Show, {
+    get when() {
+      return classList().length;
+    },
+    get fallback() {
+      return children();
+    },
+    get children() {
+      const _el$ = _tmpl$();
+      insert(_el$, children);
+      createRenderEffect(() => className(_el$, classList().join(" ")));
+      return _el$;
+    }
+  });
+}
 function memoProps(obj, keys = Object.keys(obj)) {
   const out = {};
   for (const elm of keys)
@@ -113,6 +369,7 @@ function splitAndMemoProps(obj, keys) {
 export {
   Case,
   Debug,
+  OptionalWrapper,
   When,
   createExtractor,
   memoProps,

package/dist/index.umd.js

@@ -2,6 +2,243 @@
   typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("solid-js"), require("solid-js/store")) : typeof define === "function" && define.amd ? define(["exports", "solid-js", "solid-js/store"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.solidCtrlFlow = {}, global.solidJs, global.solidJsStore));
 })(this, function(exports2, solidJs, store) {
   "use strict";
+  function reconcileArrays(parentNode, a, b) {
+    let bLength = b.length, aEnd = a.length, bEnd = bLength, aStart = 0, bStart = 0, after = a[aEnd - 1].nextSibling, map = null;
+    while (aStart < aEnd || bStart < bEnd) {
+      if (a[aStart] === b[bStart]) {
+        aStart++;
+        bStart++;
+        continue;
+      }
+      while (a[aEnd - 1] === b[bEnd - 1]) {
+        aEnd--;
+        bEnd--;
+      }
+      if (aEnd === aStart) {
+        const node = bEnd < bLength ? bStart ? b[bStart - 1].nextSibling : b[bEnd - bStart] : after;
+        while (bStart < bEnd)
+          parentNode.insertBefore(b[bStart++], node);
+      } else if (bEnd === bStart) {
+        while (aStart < aEnd) {
+          if (!map || !map.has(a[aStart]))
+            a[aStart].remove();
+          aStart++;
+        }
+      } else if (a[aStart] === b[bEnd - 1] && b[bStart] === a[aEnd - 1]) {
+        const node = a[--aEnd].nextSibling;
+        parentNode.insertBefore(b[bStart++], a[aStart++].nextSibling);
+        parentNode.insertBefore(b[--bEnd], node);
+        a[aEnd] = b[bEnd];
+      } else {
+        if (!map) {
+          map = /* @__PURE__ */ new Map();
+          let i = bStart;
+          while (i < bEnd)
+            map.set(b[i], i++);
+        }
+        const index = map.get(a[aStart]);
+        if (index != null) {
+          if (bStart < index && index < bEnd) {
+            let i = aStart, sequence = 1, t;
+            while (++i < aEnd && i < bEnd) {
+              if ((t = map.get(a[i])) == null || t !== index + sequence)
+                break;
+              sequence++;
+            }
+            if (sequence > index - bStart) {
+              const node = a[aStart];
+              while (bStart < index)
+                parentNode.insertBefore(b[bStart++], node);
+            } else
+              parentNode.replaceChild(b[bStart++], a[aStart++]);
+          } else
+            aStart++;
+        } else
+          a[aStart++].remove();
+      }
+    }
+  }
+  function template(html, isCE, isSVG) {
+    let node;
+    const create = () => {
+      const t = document.createElement("template");
+      t.innerHTML = html;
+      return isSVG ? t.content.firstChild.firstChild : t.content.firstChild;
+    };
+    const fn = isCE ? () => solidJs.untrack(() => document.importNode(node || (node = create()), true)) : () => (node || (node = create())).cloneNode(true);
+    fn.cloneNode = fn;
+    return fn;
+  }
+  function className(node, value) {
+    if (solidJs.sharedConfig.context)
+      return;
+    if (value == null)
+      node.removeAttribute("class");
+    else
+      node.className = value;
+  }
+  function insert(parent, accessor, marker, initial) {
+    if (marker !== void 0 && !initial)
+      initial = [];
+    if (typeof accessor !== "function")
+      return insertExpression(parent, accessor, initial, marker);
+    solidJs.createRenderEffect((current) => insertExpression(parent, accessor(), current, marker), initial);
+  }
+  function insertExpression(parent, value, current, marker, unwrapArray) {
+    if (solidJs.sharedConfig.context) {
+      !current && (current = [...parent.childNodes]);
+      let cleaned = [];
+      for (let i = 0; i < current.length; i++) {
+        const node = current[i];
+        if (node.nodeType === 8 && node.data.slice(0, 2) === "!$")
+          node.remove();
+        else
+          cleaned.push(node);
+      }
+      current = cleaned;
+    }
+    while (typeof current === "function")
+      current = current();
+    if (value === current)
+      return current;
+    const t = typeof value, multi = marker !== void 0;
+    parent = multi && current[0] && current[0].parentNode || parent;
+    if (t === "string" || t === "number") {
+      if (solidJs.sharedConfig.context)
+        return current;
+      if (t === "number")
+        value = value.toString();
+      if (multi) {
+        let node = current[0];
+        if (node && node.nodeType === 3) {
+          node.data = value;
+        } else
+          node = document.createTextNode(value);
+        current = cleanChildren(parent, current, marker, node);
+      } else {
+        if (current !== "" && typeof current === "string") {
+          current = parent.firstChild.data = value;
+        } else
+          current = parent.textContent = value;
+      }
+    } else if (value == null || t === "boolean") {
+      if (solidJs.sharedConfig.context)
+        return current;
+      current = cleanChildren(parent, current, marker);
+    } else if (t === "function") {
+      solidJs.createRenderEffect(() => {
+        let v = value();
+        while (typeof v === "function")
+          v = v();
+        current = insertExpression(parent, v, current, marker);
+      });
+      return () => current;
+    } else if (Array.isArray(value)) {
+      const array = [];
+      const currentArray = current && Array.isArray(current);
+      if (normalizeIncomingArray(array, value, current, unwrapArray)) {
+        solidJs.createRenderEffect(() => current = insertExpression(parent, array, current, marker, true));
+        return () => current;
+      }
+      if (solidJs.sharedConfig.context) {
+        if (!array.length)
+          return current;
+        if (marker === void 0)
+          return [...parent.childNodes];
+        let node = array[0];
+        let nodes = [node];
+        while ((node = node.nextSibling) !== marker)
+          nodes.push(node);
+        return current = nodes;
+      }
+      if (array.length === 0) {
+        current = cleanChildren(parent, current, marker);
+        if (multi)
+          return current;
+      } else if (currentArray) {
+        if (current.length === 0) {
+          appendNodes(parent, array, marker);
+        } else
+          reconcileArrays(parent, current, array);
+      } else {
+        current && cleanChildren(parent);
+        appendNodes(parent, array);
+      }
+      current = array;
+    } else if (value.nodeType) {
+      if (solidJs.sharedConfig.context && value.parentNode)
+        return current = multi ? [value] : value;
+      if (Array.isArray(current)) {
+        if (multi)
+          return current = cleanChildren(parent, current, marker, value);
+        cleanChildren(parent, current, null, value);
+      } else if (current == null || current === "" || !parent.firstChild) {
+        parent.appendChild(value);
+      } else
+        parent.replaceChild(value, parent.firstChild);
+      current = value;
+    } else
+      ;
+    return current;
+  }
+  function normalizeIncomingArray(normalized, array, current, unwrap) {
+    let dynamic = false;
+    for (let i = 0, len = array.length; i < len; i++) {
+      let item = array[i], prev = current && current[i], t;
+      if (item == null || item === true || item === false)
+        ;
+      else if ((t = typeof item) === "object" && item.nodeType) {
+        normalized.push(item);
+      } else if (Array.isArray(item)) {
+        dynamic = normalizeIncomingArray(normalized, item, prev) || dynamic;
+      } else if (t === "function") {
+        if (unwrap) {
+          while (typeof item === "function")
+            item = item();
+          dynamic = normalizeIncomingArray(
+            normalized,
+            Array.isArray(item) ? item : [item],
+            Array.isArray(prev) ? prev : [prev]
+          ) || dynamic;
+        } else {
+          normalized.push(item);
+          dynamic = true;
+        }
+      } else {
+        const value = String(item);
+        if (prev && prev.nodeType === 3 && prev.data === value)
+          normalized.push(prev);
+        else
+          normalized.push(document.createTextNode(value));
+      }
+    }
+    return dynamic;
+  }
+  function appendNodes(parent, array, marker = null) {
+    for (let i = 0, len = array.length; i < len; i++)
+      parent.insertBefore(array[i], marker);
+  }
+  function cleanChildren(parent, current, marker, replacement) {
+    if (marker === void 0)
+      return parent.textContent = "";
+    const node = replacement || document.createTextNode("");
+    if (current.length) {
+      let inserted = false;
+      for (let i = current.length - 1; i >= 0; i--) {
+        const el = current[i];
+        if (node !== el) {
+          const isParent = el.parentNode === parent;
+          if (!inserted && !i)
+            isParent ? parent.replaceChild(node, el) : parent.insertBefore(node, marker);
+          else
+            isParent && el.remove();
+        } else
+          inserted = true;
+      }
+    } else
+      parent.insertBefore(node, marker);
+    return [node];
+  }
   const ctx$1 = solidJs.createContext(() => void 0, {
     name: "case-when"
   });
@@ -100,6 +337,25 @@
       }
     });
   }
+  const _tmpl$ = /* @__PURE__ */ template(`<div>`);
+  function OptionalWrapper(props) {
+    const classList = solidJs.createMemo(() => Object.entries(props.classList).filter((x) => x[1]).map((x) => x[0]));
+    const children = solidJs.createMemo(() => props.children);
+    return solidJs.createComponent(solidJs.Show, {
+      get when() {
+        return classList().length;
+      },
+      get fallback() {
+        return children();
+      },
+      get children() {
+        const _el$ = _tmpl$();
+        insert(_el$, children);
+        solidJs.createRenderEffect(() => className(_el$, classList().join(" ")));
+        return _el$;
+      }
+    });
+  }
   function memoProps(obj, keys = Object.keys(obj)) {
     const out = {};
     for (const elm of keys)
@@ -114,6 +370,7 @@
   }
   exports2.Case = Case;
   exports2.Debug = Debug;
+  exports2.OptionalWrapper = OptionalWrapper;
   exports2.When = When;
   exports2.createExtractor = createExtractor;
   exports2.memoProps = memoProps;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "solid-ctrl-flow",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "description": "Control flow components for solid-js",
   "author": "AFatNiBBa",
   "license": "ISC",