xote 6.1.2 → 6.2.0

package/src/Node.res.mjs

@@ -1,572 +1,65 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
 
-import * as Effect$Xote from "./Effect.res.mjs";
-import * as Signal$Xote from "./Signal.res.mjs";
-import * as Stdlib_Dict from "@rescript/runtime/lib/es6/Stdlib_Dict.js";
-import * as Computed$Xote from "./Computed.res.mjs";
-import * as Stdlib_Option from "@rescript/runtime/lib/es6/Stdlib_Option.js";
-import * as Primitive_option from "@rescript/runtime/lib/es6/Primitive_option.js";
+import * as View$Xote from "./View.res.mjs";
 
-let svgNamespace = "http://www.w3.org/2000/svg";
+let DOM = View$Xote.DOM;
 
-let svgTags = [
-  "svg",
-  "path",
-  "circle",
-  "ellipse",
-  "line",
-  "polygon",
-  "polyline",
-  "rect",
-  "g",
-  "defs",
-  "clipPath",
-  "mask",
-  "pattern",
-  "marker",
-  "symbol",
-  "use",
-  "text",
-  "tspan",
-  "image",
-  "foreignObject",
-  "linearGradient",
-  "radialGradient",
-  "stop",
-  "filter",
-  "feBlend",
-  "feColorMatrix",
-  "feComposite",
-  "feFlood",
-  "feGaussianBlur",
-  "feMerge",
-  "feMergeNode",
-  "feOffset",
-  "animate",
-  "animateTransform",
-  "desc",
-  "title",
-  "metadata"
-];
+let Reactivity = View$Xote.Reactivity;
 
-let d = {};
+let Attributes = View$Xote.Attributes;
 
-svgTags.forEach(tag => {
-  d[tag] = true;
-});
+let attr = View$Xote.attr;
 
-function isSvgTag(tag) {
-  return Stdlib_Option.isSome(d[tag]);
-}
-
-function setAttrOrProp(el, key, value) {
-  switch (key) {
-    case "checked" :
-      el.checked = value === "true";
-      return;
-    case "disabled" :
-      el.disabled = value === "true";
-      return;
-    case "aria-expanded" :
-    case "aria-hidden" :
-    case "aria-selected" :
-    case "autofocus" :
-    case "contenteditable" :
-    case "draggable" :
-    case "hidden" :
-    case "multiple" :
-    case "readonly" :
-    case "required" :
-    case "spellcheck" :
-      break;
-    case "value" :
-      el.value = value;
-      return;
-    default:
-      el.setAttribute(key, value);
-      return;
-  }
-  if (value === "true") {
-    el.setAttribute(key, "");
-  } else {
-    el.removeAttribute(key);
-  }
-}
-
-let DOM = {
-  setAttrOrProp: setAttrOrProp
-};
-
-let currentOwner = {
-  contents: undefined
-};
-
-function createOwner() {
-  return {
-    disposers: [],
-    computeds: []
-  };
-}
-
-function runWithOwner(owner, fn) {
-  let previousOwner = currentOwner.contents;
-  currentOwner.contents = owner;
-  let result = fn();
-  currentOwner.contents = previousOwner;
-  return result;
-}
-
-function addDisposer(owner, disposer) {
-  owner.disposers.push(disposer);
-}
-
-function disposeOwner(owner) {
-  owner.disposers.forEach(disposer => disposer.dispose());
-  owner.computeds.forEach(Computed$Xote.dispose);
-}
-
-function setOwner(element, owner) {
-  ((element["__xote_owner__"] = owner));
-}
-
-function getOwner(element) {
-  return Primitive_option.fromNullable((element["__xote_owner__"]));
-}
-
-let Reactivity = {
-  currentOwner: currentOwner,
-  createOwner: createOwner,
-  runWithOwner: runWithOwner,
-  addDisposer: addDisposer,
-  disposeOwner: disposeOwner,
-  setOwner: setOwner,
-  getOwner: getOwner
-};
-
-function $$static(key, value) {
-  return [
-    key,
-    {
-      TAG: "Static",
-      _0: value
-    }
-  ];
-}
-
-function signal(key, signal$1) {
-  return [
-    key,
-    {
-      TAG: "SignalValue",
-      _0: signal$1
-    }
-  ];
-}
+let signalAttr = View$Xote.signalAttr;
 
-function computed(key, compute) {
-  return [
-    key,
-    {
-      TAG: "Compute",
-      _0: compute
-    }
-  ];
-}
+let computedAttr = View$Xote.computedAttr;
 
-let Attributes = {
-  $$static: $$static,
-  signal: signal,
-  computed: computed
-};
+let Attr = View$Xote.Attr;
 
-function disposeElement(el) {
-  let owner = getOwner(el);
-  if (owner !== undefined) {
-    disposeOwner(owner);
-  }
-  let childNodes = (Array.from(el.childNodes || []));
-  childNodes.forEach(disposeElement);
-}
+let Render = View$Xote.Render;
 
-function render(node) {
-  switch (node.TAG) {
-    case "Element" :
-      let children = node.children;
-      let events = node.events;
-      let attrs = node.attrs;
-      let tag = node.tag;
-      let el = Stdlib_Option.isSome(d[tag]) ? document.createElementNS(svgNamespace, tag) : document.createElement(tag);
-      let owner = {
-        disposers: [],
-        computeds: []
-      };
-      setOwner(el, owner);
-      runWithOwner(owner, () => {
-        let shouldDeferAttrUntilAfterChildren = param => {
-          if (tag === "select") {
-            return param[0] === "value";
-          } else {
-            return false;
-          }
-        };
-        let applyAttr = param => {
-          let value = param[1];
-          let key = param[0];
-          switch (value.TAG) {
-            case "Static" :
-              return setAttrOrProp(el, key, value._0);
-            case "SignalValue" :
-              let signal = value._0;
-              setAttrOrProp(el, key, Signal$Xote.peek(signal));
-              let disposer = Effect$Xote.runWithDisposer(() => {
-                setAttrOrProp(el, key, Signal$Xote.get(signal));
-              }, undefined);
-              return addDisposer(owner, disposer);
-            case "Compute" :
-              let compute = value._0;
-              let disposer$1 = Effect$Xote.runWithDisposer(() => {
-                setAttrOrProp(el, key, compute());
-              }, undefined);
-              return addDisposer(owner, disposer$1);
-          }
-        };
-        attrs.forEach(attr => {
-          if (!shouldDeferAttrUntilAfterChildren(attr)) {
-            return applyAttr(attr);
-          }
-        });
-        events.forEach(param => {
-          el.addEventListener(param[0], param[1]);
-        });
-        children.forEach(child => {
-          let childEl = render(child);
-          el.appendChild(childEl);
-        });
-        attrs.forEach(attr => {
-          if (shouldDeferAttrUntilAfterChildren(attr)) {
-            return applyAttr(attr);
-          }
-        });
-      });
-      return el;
-    case "Text" :
-      return document.createTextNode(node._0);
-    case "SignalText" :
-      let signal = node._0;
-      let textNode = document.createTextNode(Signal$Xote.peek(signal));
-      let owner$1 = {
-        disposers: [],
-        computeds: []
-      };
-      setOwner(textNode, owner$1);
-      runWithOwner(owner$1, () => {
-        let disposer = Effect$Xote.runWithDisposer(() => {
-          textNode.textContent = Signal$Xote.get(signal);
-        }, undefined);
-        addDisposer(owner$1, disposer);
-      });
-      return textNode;
-    case "Fragment" :
-      let fragment = document.createDocumentFragment();
-      node._0.forEach(child => {
-        let childEl = render(child);
-        fragment.appendChild(childEl);
-      });
-      return fragment;
-    case "SignalFragment" :
-      let signal$1 = node._0;
-      let owner$2 = {
-        disposers: [],
-        computeds: []
-      };
-      let container = document.createElement("div");
-      container.setAttribute("style", "display: contents");
-      setOwner(container, owner$2);
-      runWithOwner(owner$2, () => {
-        let disposer = Effect$Xote.runWithDisposer(() => {
-          let children = Signal$Xote.get(signal$1);
-          let childNodes = (Array.from(container.childNodes || []));
-          childNodes.forEach(disposeElement);
-          ((container.innerHTML = ''));
-          children.forEach(child => {
-            let childEl = render(child);
-            container.appendChild(childEl);
-          });
-        }, undefined);
-        addDisposer(owner$2, disposer);
-      });
-      return container;
-    case "LazyComponent" :
-      let owner$3 = {
-        disposers: [],
-        computeds: []
-      };
-      let childNode = runWithOwner(owner$3, node._0);
-      let el$1 = render(childNode);
-      setOwner(el$1, owner$3);
-      return el$1;
-    case "KeyedList" :
-      let renderItem = node.renderItem;
-      let keyFn = node.keyFn;
-      let signal$2 = node.signal;
-      let owner$4 = {
-        disposers: [],
-        computeds: []
-      };
-      let startAnchor = document.createComment(" keyed-list-start ");
-      let endAnchor = document.createComment(" keyed-list-end ");
-      setOwner(startAnchor, owner$4);
-      let keyedItems = {};
-      let reconcile = () => {
-        let parentOpt = endAnchor.parentNode;
-        if (parentOpt == null) {
-          return;
-        }
-        let newItems = Signal$Xote.get(signal$2);
-        let newKeyMap = {};
-        newItems.forEach(item => {
-          newKeyMap[keyFn(item)] = item;
-        });
-        let keysToRemove = [];
-        Object.keys(keyedItems).forEach(key => {
-          let match = newKeyMap[key];
-          if (match !== undefined) {
-            return;
-          } else {
-            keysToRemove.push(key);
-            return;
-          }
-        });
-        keysToRemove.forEach(key => {
-          let keyedItem = keyedItems[key];
-          if (keyedItem !== undefined) {
-            disposeElement(keyedItem.element);
-            ((keyedItem.element.remove()));
-            Stdlib_Dict.$$delete(keyedItems, key);
-            return;
-          }
-        });
-        let newOrder = [];
-        let elementsToReplace = {};
-        newItems.forEach(item => {
-          let key = keyFn(item);
-          let existing = keyedItems[key];
-          if (existing !== undefined) {
-            if (existing.item !== item) {
-              elementsToReplace[key] = true;
-              let node = renderItem(item);
-              let element = render(node);
-              let keyedItem = {
-                key: key,
-                item: item,
-                element: element
-              };
-              newOrder.push(keyedItem);
-              keyedItems[key] = keyedItem;
-              return;
-            }
-            newOrder.push(existing);
-            return;
-          }
-          let node$1 = renderItem(item);
-          let element$1 = render(node$1);
-          let keyedItem$1 = {
-            key: key,
-            item: item,
-            element: element$1
-          };
-          newOrder.push(keyedItem$1);
-          keyedItems[key] = keyedItem$1;
-        });
-        let marker = {
-          contents: startAnchor.nextSibling
-        };
-        newOrder.forEach(keyedItem => {
-          let currentElement = marker.contents;
-          if (currentElement == null) {
-            parentOpt.insertBefore(keyedItem.element, endAnchor);
-            return;
-          }
-          if (currentElement === endAnchor) {
-            parentOpt.insertBefore(keyedItem.element, endAnchor);
-            return;
-          }
-          if (currentElement === keyedItem.element) {
-            marker.contents = currentElement.nextSibling;
-            return;
-          }
-          let needsReplacement = Stdlib_Option.getOr(elementsToReplace[keyedItem.key], false);
-          if (needsReplacement) {
-            disposeElement(currentElement);
-            parentOpt.replaceChild(keyedItem.element, currentElement);
-            marker.contents = keyedItem.element.nextSibling;
-          } else {
-            parentOpt.insertBefore(keyedItem.element, currentElement);
-            marker.contents = keyedItem.element.nextSibling;
-          }
-        });
-      };
-      let fragment$1 = document.createDocumentFragment();
-      fragment$1.appendChild(startAnchor);
-      let initialItems = Signal$Xote.peek(signal$2);
-      initialItems.forEach(item => {
-        let key = keyFn(item);
-        let node = renderItem(item);
-        let element = render(node);
-        let keyedItem = {
-          key: key,
-          item: item,
-          element: element
-        };
-        keyedItems[key] = keyedItem;
-        fragment$1.appendChild(element);
-      });
-      fragment$1.appendChild(endAnchor);
-      runWithOwner(owner$4, () => {
-        let disposer = Effect$Xote.runWithDisposer(() => {
-          reconcile();
-        }, undefined);
-        addDisposer(owner$4, disposer);
-      });
-      return fragment$1;
-  }
-}
+let text = View$Xote.text;
 
-let Render = {
-  disposeElement: disposeElement,
-  render: render
-};
+let signalText = View$Xote.signalText;
 
-function text(content) {
-  return {
-    TAG: "Text",
-    _0: content
-  };
-}
+let signalInt = View$Xote.signalInt;
 
-function signalText(compute) {
-  let signal = Computed$Xote.make(compute, undefined, undefined);
-  return {
-    TAG: "SignalText",
-    _0: signal
-  };
-}
+let signalFloat = View$Xote.signalFloat;
 
-function signalInt(compute) {
-  let signal = Computed$Xote.make(() => compute().toString(), undefined, undefined);
-  return {
-    TAG: "SignalText",
-    _0: signal
-  };
-}
+let int = View$Xote.int;
 
-function signalFloat(compute) {
-  let signal = Computed$Xote.make(() => compute().toString(), undefined, undefined);
-  return {
-    TAG: "SignalText",
-    _0: signal
-  };
-}
+let float = View$Xote.float;
 
-function int(value) {
-  return {
-    TAG: "Text",
-    _0: value.toString()
-  };
-}
+let fragment = View$Xote.fragment;
 
-function float(value) {
-  return {
-    TAG: "Text",
-    _0: value.toString()
-  };
-}
+let signalFragment = View$Xote.signalFragment;
 
-function fragment(children) {
-  return {
-    TAG: "Fragment",
-    _0: children
-  };
-}
+let each = View$Xote.each;
 
-function signalFragment(signal) {
-  return {
-    TAG: "SignalFragment",
-    _0: signal
-  };
-}
-
-function list(signal, renderItem) {
-  let nodesSignal = Computed$Xote.make(() => Signal$Xote.get(signal).map(renderItem), undefined, undefined);
-  return {
-    TAG: "SignalFragment",
-    _0: nodesSignal
-  };
-}
-
-function keyedList(signal, keyFn, renderItem) {
-  return {
-    TAG: "KeyedList",
-    signal: signal,
-    keyFn: keyFn,
-    renderItem: renderItem
-  };
-}
+let list = View$Xote.list;
 
-function element(tag, attrsOpt, eventsOpt, childrenOpt, param) {
-  let attrs = attrsOpt !== undefined ? attrsOpt : [].map(x => x);
-  let events = eventsOpt !== undefined ? eventsOpt : [].map(x => x);
-  let children = childrenOpt !== undefined ? childrenOpt : [].map(x => x);
-  return {
-    TAG: "Element",
-    tag: tag,
-    attrs: attrs,
-    events: events,
-    children: children
-  };
-}
+let eachWithKey = View$Xote.eachWithKey;
 
-function $$null() {
-  return {
-    TAG: "Text",
-    _0: ""
-  };
-}
+let keyedList = View$Xote.keyedList;
 
-function mount(node, container) {
-  let el = render(node);
-  container.appendChild(el);
-}
-
-function mountById(node, containerId) {
-  let container = document.getElementById(containerId);
-  if (container == null) {
-    console.error("Container element not found: " + containerId);
-    return;
-  } else {
-    return mount(node, container);
-  }
-}
+let element = View$Xote.element;
 
-let svgTagSet = d;
+let $$null = View$Xote.$$null;
 
-let attr = $$static;
+let empty = View$Xote.empty;
 
-let signalAttr = signal;
+let mount = View$Xote.mount;
 
-let computedAttr = computed;
+let mountById = View$Xote.mountById;
 
 export {
-  svgNamespace,
-  svgTags,
-  svgTagSet,
-  isSvgTag,
   DOM,
   Reactivity,
   Attributes,
   attr,
   signalAttr,
   computedAttr,
+  Attr,
   Render,
   text,
   signalText,
@@ -576,11 +69,14 @@ export {
   float,
   fragment,
   signalFragment,
+  each,
   list,
+  eachWithKey,
   keyedList,
   element,
   $$null,
+  empty,
   mount,
   mountById,
 }
-/*  Not a pure module */
+/* View-Xote Not a pure module */

package/src/Prop.res

@@ -0,0 +1,16 @@
+/* Defines a property that can either be a signal (Reactive) or a static value
+ (Static) */
+type t<'a> = Reactive(Signal.t<'a>) | Static('a)
+
+let get = value =>
+  switch value {
+  | Reactive(signal) => Signal.get(signal)
+  | Static(value) => value
+  }
+
+/* Helper functions for creating reactive props */
+let static = value => Static(value)
+
+let reactive = signal => Reactive(signal)
+
+let signal = reactive

package/src/Prop.res.mjs

@@ -0,0 +1,35 @@
+// Generated by ReScript, PLEASE EDIT WITH CARE
+
+import * as Signal$Xote from "./Signal.res.mjs";
+
+function get(value) {
+  if (value.TAG === "Reactive") {
+    return Signal$Xote.get(value._0);
+  } else {
+    return value._0;
+  }
+}
+
+function $$static(value) {
+  return {
+    TAG: "Static",
+    _0: value
+  };
+}
+
+function reactive(signal) {
+  return {
+    TAG: "Reactive",
+    _0: signal
+  };
+}
+
+let signal = reactive;
+
+export {
+  get,
+  $$static,
+  reactive,
+  signal,
+}
+/* No side effect */

package/src/ReactiveProp.res

@@ -1,14 +1,2 @@
-/* Defines a property that can either be a signal (Reactive) or a static value
- (Static) */
-type t<'a> = Reactive(Signal.t<'a>) | Static('a)
-
-let get = value =>
-  switch value {
-  | Reactive(signal) => Signal.get(signal)
-  | Static(value) => value
-  }
-
-/* Helper functions for creating reactive props */
-let static = value => Static(value)
-
-let reactive = signal => Reactive(signal)
+@deprecated("Use Prop instead. ReactiveProp is deprecated and will be removed in a future release.")
+include Prop