basefn 1.10.0 → 1.11.0

package/src/components/Basefn__Spotlight.res.mjs

@@ -1,10 +1,14 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
 
-import * as Xote from "xote/src/Xote.res.mjs";
-import * as Xote__JSX from "xote/src/Xote__JSX.res.mjs";
+import * as Node$Xote from "xote/src/Node.res.mjs";
 import * as Basefn__Dom from "../Basefn__Dom.res.mjs";
+import * as Effect$Xote from "xote/src/Effect.res.mjs";
+import * as Signal$Xote from "xote/src/Signal.res.mjs";
 import * as Basefn__Icon from "./Basefn__Icon.res.mjs";
+import * as XoteJSX$Xote from "xote/src/XoteJSX.res.mjs";
+import * as Computed$Xote from "xote/src/Computed.res.mjs";
 import * as Primitive_int from "@rescript/runtime/lib/es6/Primitive_int.js";
+import * as ReactiveProp$Xote from "xote/src/ReactiveProp.res.mjs";
 
 import './Basefn__Spotlight.css'
 ;
@@ -18,8 +22,8 @@ function Basefn__Spotlight(props) {
   let isOpen = props.isOpen;
   let placeholder = __placeholder !== undefined ? __placeholder : "Search...";
   let emptyMessage = __emptyMessage !== undefined ? __emptyMessage : "No results found.";
-  let query = Xote.Signal.make("", undefined, undefined);
-  let activeIndex = Xote.Signal.make(0, undefined, undefined);
+  let query = Signal$Xote.make("", undefined, undefined);
+  let activeIndex = Signal$Xote.make(0, undefined, undefined);
   let defaultFilter = (q, item) => {
     let q$1 = q.toLowerCase();
     if (item.label.toLowerCase().includes(q$1)) {
@@ -33,8 +37,8 @@ function Basefn__Spotlight(props) {
     }
   };
   let filterItem = filterFn !== undefined ? filterFn : defaultFilter;
-  let filteredItems = Xote.Computed.make(() => {
-    let q = Xote.Signal.get(query);
+  let filteredItems = Computed$Xote.make(() => {
+    let q = Signal$Xote.get(query);
     if (q === "") {
       return items;
     } else {
@@ -43,18 +47,18 @@ function Basefn__Spotlight(props) {
   }, undefined);
   let handleSelect = item => {
     item.onSelect();
-    Xote.Signal.set(query, "");
-    Xote.Signal.set(activeIndex, 0);
+    Signal$Xote.set(query, "");
+    Signal$Xote.set(activeIndex, 0);
     onClose();
   };
   let handleKeyDown = evt => {
     let k = evt.key;
-    let currentItems = Xote.Signal.get(filteredItems);
+    let currentItems = Signal$Xote.get(filteredItems);
     let len = currentItems.length;
     switch (k) {
       case "ArrowDown" :
         Basefn__Dom.preventDefault(evt);
-        Xote.Signal.update(activeIndex, i => Primitive_int.mod_(i + 1 | 0, Primitive_int.max(len, 1)));
+        Signal$Xote.update(activeIndex, i => Primitive_int.mod_(i + 1 | 0, Primitive_int.max(len, 1)));
         ((requestAnimationFrame(() => {
           const el = document.querySelector(".basefn-spotlight__item--active");
           if (el) el.scrollIntoView({ block: "nearest" });
@@ -62,7 +66,7 @@ function Basefn__Spotlight(props) {
         return;
       case "ArrowUp" :
         Basefn__Dom.preventDefault(evt);
-        Xote.Signal.update(activeIndex, i => Primitive_int.mod_((i - 1 | 0) + Primitive_int.max(len, 1) | 0, Primitive_int.max(len, 1)));
+        Signal$Xote.update(activeIndex, i => Primitive_int.mod_((i - 1 | 0) + Primitive_int.max(len, 1) | 0, Primitive_int.max(len, 1)));
         ((requestAnimationFrame(() => {
           const el = document.querySelector(".basefn-spotlight__item--active");
           if (el) el.scrollIntoView({ block: "nearest" });
@@ -72,7 +76,7 @@ function Basefn__Spotlight(props) {
         if (len <= 0) {
           return;
         }
-        let idx = Xote.Signal.get(activeIndex);
+        let idx = Signal$Xote.get(activeIndex);
         let item = currentItems[idx];
         if (item !== undefined) {
           return handleSelect(item);
@@ -80,8 +84,8 @@ function Basefn__Spotlight(props) {
           return;
         }
       case "Escape" :
-        Xote.Signal.set(query, "");
-        Xote.Signal.set(activeIndex, 0);
+        Signal$Xote.set(query, "");
+        Signal$Xote.set(activeIndex, 0);
         return onClose();
       default:
         return;
@@ -89,20 +93,20 @@ function Basefn__Spotlight(props) {
   };
   let handleInput = evt => {
     let value = Basefn__Dom.target(evt).value;
-    Xote.Signal.set(query, value);
-    Xote.Signal.set(activeIndex, 0);
+    Signal$Xote.set(query, value);
+    Signal$Xote.set(activeIndex, 0);
   };
   let handleBackdropClick = evt => {
     let target = evt.target;
     let currentTarget = evt.currentTarget;
     if (target === currentTarget) {
-      Xote.Signal.set(query, "");
-      Xote.Signal.set(activeIndex, 0);
+      Signal$Xote.set(query, "");
+      Signal$Xote.set(activeIndex, 0);
       return onClose();
     }
   };
-  Xote.Effect.run(() => {
-    if (Xote.Signal.get(isOpen)) {
+  Effect$Xote.run(() => {
+    if (Signal$Xote.get(isOpen)) {
       ((requestAnimationFrame(() => {
         requestAnimationFrame(() => {
           const el = document.querySelector(".basefn-spotlight__input");
@@ -112,11 +116,11 @@ function Basefn__Spotlight(props) {
     }
   }, undefined);
   let renderResults = () => {
-    let currentItems = Xote.Signal.get(filteredItems);
+    let currentItems = Signal$Xote.get(filteredItems);
     if (currentItems.length === 0) {
-      return Xote__JSX.Elements.jsx("div", {
+      return XoteJSX$Xote.Elements.jsx("div", {
         class: "basefn-spotlight__empty",
-        children: Xote.Component.text(emptyMessage)
+        children: Node$Xote.text(emptyMessage)
       });
     }
     let lastGroup = {
@@ -127,99 +131,99 @@ function Basefn__Spotlight(props) {
       let group = item.group;
       if (group !== undefined && group !== lastGroup.contents) {
         lastGroup.contents = group;
-        elements.push(Xote__JSX.Elements.jsxKeyed("div", {
+        elements.push(XoteJSX$Xote.Elements.jsxKeyed("div", {
           class: "basefn-spotlight__group-label",
-          children: Xote.Component.text(group)
+          children: Node$Xote.text(group)
         }, "group-" + group, undefined));
       }
       let itemClass = "basefn-spotlight__item" + (
-        index === Xote.Signal.get(activeIndex) ? " basefn-spotlight__item--active" : ""
+        index === Signal$Xote.get(activeIndex) ? " basefn-spotlight__item--active" : ""
       );
       let desc = item.description;
-      elements.push(Xote__JSX.Elements.jsxKeyed("button", {
+      elements.push(XoteJSX$Xote.Elements.jsxKeyed("button", {
         class: itemClass,
         onClick: param => handleSelect(item),
-        children: Xote__JSX.Elements.jsxs("div", {
+        children: XoteJSX$Xote.Elements.jsxs("div", {
           class: "basefn-spotlight__item-content",
-          children: Xote__JSX.array([
-            Xote__JSX.Elements.jsx("div", {
+          children: XoteJSX$Xote.array([
+            XoteJSX$Xote.Elements.jsx("div", {
               class: "basefn-spotlight__item-label",
-              children: Xote.Component.text(item.label)
+              children: Node$Xote.text(item.label)
             }),
-            desc !== undefined ? Xote__JSX.Elements.jsx("div", {
+            desc !== undefined ? XoteJSX$Xote.Elements.jsx("div", {
                 class: "basefn-spotlight__item-description",
-                children: Xote.Component.text(desc)
-              }) : Xote__JSX.jsx(Xote__JSX.jsxFragment, {})
+                children: Node$Xote.text(desc)
+              }) : XoteJSX$Xote.jsx(XoteJSX$Xote.jsxFragment, {})
           ])
         })
       }, item.id, undefined));
     });
-    return Xote.Component.fragment(elements);
+    return Node$Xote.fragment(elements);
   };
-  return Xote.Component.signalFragment(Xote.Computed.make(() => {
-    if (Xote.Signal.get(isOpen)) {
-      return [Xote__JSX.Elements.jsx("div", {
+  return Node$Xote.signalFragment(Computed$Xote.make(() => {
+    if (Signal$Xote.get(isOpen)) {
+      return [XoteJSX$Xote.Elements.jsx("div", {
           class: "basefn-spotlight-backdrop",
           onClick: handleBackdropClick,
-          children: Xote__JSX.Elements.jsxs("div", {
+          children: XoteJSX$Xote.Elements.jsxs("div", {
             class: "basefn-spotlight",
             onKeyDown: handleKeyDown,
-            children: Xote__JSX.array([
-              Xote__JSX.Elements.jsxs("div", {
+            children: XoteJSX$Xote.array([
+              XoteJSX$Xote.Elements.jsxs("div", {
                 class: "basefn-spotlight__input-wrapper",
-                children: Xote__JSX.array([
-                  Xote__JSX.jsx(Basefn__Icon.make, {
+                children: XoteJSX$Xote.array([
+                  XoteJSX$Xote.jsx(Basefn__Icon.make, {
                     name: "Search",
                     size: "Sm"
                   }),
-                  Xote__JSX.Elements.jsx("input", {
+                  XoteJSX$Xote.Elements.jsx("input", {
                     class: "basefn-spotlight__input",
                     type: "text",
-                    value: Xote.ReactiveProp.reactive(query),
+                    value: ReactiveProp$Xote.reactive(query),
                     placeholder: placeholder,
                     onInput: handleInput
                   })
                 ])
               }),
-              Xote__JSX.Elements.jsx("div", {
+              XoteJSX$Xote.Elements.jsx("div", {
                 class: "basefn-spotlight__results",
                 children: renderResults()
               }),
-              Xote__JSX.Elements.jsxs("div", {
+              XoteJSX$Xote.Elements.jsxs("div", {
                 class: "basefn-spotlight__footer",
-                children: Xote__JSX.array([
-                  Xote__JSX.Elements.jsxs("span", {
+                children: XoteJSX$Xote.array([
+                  XoteJSX$Xote.Elements.jsxs("span", {
                     class: "basefn-spotlight__footer-hint",
-                    children: Xote__JSX.array([
-                      Xote__JSX.Elements.jsx("span", {
+                    children: XoteJSX$Xote.array([
+                      XoteJSX$Xote.Elements.jsx("span", {
                         class: "basefn-spotlight__footer-key",
-                        children: Xote.Component.text("\u2191")
+                        children: Node$Xote.text("\u2191")
                       }),
-                      Xote__JSX.Elements.jsx("span", {
+                      XoteJSX$Xote.Elements.jsx("span", {
                         class: "basefn-spotlight__footer-key",
-                        children: Xote.Component.text("\u2193")
+                        children: Node$Xote.text("\u2193")
                       }),
-                      Xote.Component.text("to navigate")
+                      Node$Xote.text("to navigate")
                     ])
                   }),
-                  Xote__JSX.Elements.jsxs("span", {
+                  XoteJSX$Xote.Elements.jsxs("span", {
                     class: "basefn-spotlight__footer-hint",
-                    children: Xote__JSX.array([
-                      Xote__JSX.Elements.jsx("span", {
+                    children: XoteJSX$Xote.array([
+                      XoteJSX$Xote.Elements.jsx("span", {
                         class: "basefn-spotlight__footer-key",
-                        children: Xote.Component.text("\u21b5")
+                        children: Node$Xote.text("\u21b5")
                       }),
-                      Xote.Component.text("to select")
+                      Node$Xote.text("to select")
                     ])
                   }),
-                  Xote__JSX.Elements.jsxs("span", {
+                  XoteJSX$Xote.Elements.jsxs("span", {
                     class: "basefn-spotlight__footer-hint",
-                    children: Xote__JSX.array([
-                      Xote__JSX.Elements.jsx("span", {
+                    children: XoteJSX$Xote.array([
+                      XoteJSX$Xote.Elements.jsx("span", {
                         class: "basefn-spotlight__footer-key",
-                        children: Xote.Component.text("esc")
+                        children: Node$Xote.text("esc")
                       }),
-                      Xote.Component.text("to close")
+                      Node$Xote.text("to close")
                     ])
                   })
                 ])

package/src/components/Basefn__Stepper.res

@@ -64,16 +64,16 @@ let make = (
         <div class="basefn-stepper__step-header" onClick={_ => handleStepClick(index, step.status)}>
           <div class="basefn-stepper__step-indicator">
             {switch step.status {
-            | Completed => Component.text("\u2713")
-            | Error => Component.text("\u00d7")
-            | _ => Component.text(Int.toString(index + 1))
+            | Completed => Node.text("\u2713")
+            | Error => Node.text("\u00d7")
+            | _ => Node.text(Int.toString(index + 1))
             }}
           </div>
           <div class="basefn-stepper__step-content">
-            <div class="basefn-stepper__step-title"> {Component.text(step.title)} </div>
+            <div class="basefn-stepper__step-title"> {Node.text(step.title)} </div>
             {switch step.description {
             | Some(desc) =>
-              <div class="basefn-stepper__step-description"> {Component.text(desc)} </div>
+              <div class="basefn-stepper__step-description"> {Node.text(desc)} </div>
             | None => <> </>
             }}
           </div>
@@ -81,6 +81,6 @@ let make = (
         <div class="basefn-stepper__connector" />
       </div>
     })
-    ->Component.fragment}
+    ->Node.fragment}
   </div>
 }

package/src/components/Basefn__Stepper.res.mjs

@@ -1,8 +1,8 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
 
-import * as Xote from "xote/src/Xote.res.mjs";
-import * as Xote__JSX from "xote/src/Xote__JSX.res.mjs";
+import * as Node$Xote from "xote/src/Node.res.mjs";
 import * as Core__Option from "@rescript/core/src/Core__Option.res.mjs";
+import * as XoteJSX$Xote from "xote/src/XoteJSX.res.mjs";
 
 import './Basefn__Stepper.css'
 ;
@@ -34,33 +34,29 @@ function Basefn__Stepper(props) {
     let clickableClass = clickable ? " basefn-stepper__step--clickable" : "";
     return "basefn-stepper__step " + statusClass + clickableClass;
   };
-  return Xote__JSX.Elements.jsx("div", {
+  return XoteJSX$Xote.Elements.jsx("div", {
     class: getStepperClass(),
-    children: Xote.Component.fragment(props.steps.map((step, index) => {
+    children: Node$Xote.fragment(props.steps.map((step, index) => {
       let isClickable = Core__Option.isSome(onStepClick) && (step.status === "Completed" || step.status === "Active");
       let match = step.status;
       let tmp;
-      let exit = 0;
       switch (match) {
         case "Inactive" :
         case "Active" :
-          exit = 1;
+          tmp = Node$Xote.text((index + 1 | 0).toString());
           break;
         case "Completed" :
-          tmp = Xote.Component.text("\u2713");
+          tmp = Node$Xote.text("\u2713");
           break;
         case "Error" :
-          tmp = Xote.Component.text("\u00d7");
+          tmp = Node$Xote.text("\u00d7");
           break;
       }
-      if (exit === 1) {
-        tmp = Xote.Component.text((index + 1 | 0).toString());
-      }
       let desc = step.description;
-      return Xote__JSX.Elements.jsxsKeyed("div", {
+      return XoteJSX$Xote.Elements.jsxsKeyed("div", {
         class: getStepClass(step.status, isClickable),
-        children: Xote__JSX.array([
-          Xote__JSX.Elements.jsxs("div", {
+        children: XoteJSX$Xote.array([
+          XoteJSX$Xote.Elements.jsxs("div", {
             class: "basefn-stepper__step-header",
             onClick: param => {
               let status = step.status;
@@ -76,27 +72,27 @@ function Basefn__Stepper(props) {
                   return;
               }
             },
-            children: Xote__JSX.array([
-              Xote__JSX.Elements.jsx("div", {
+            children: XoteJSX$Xote.array([
+              XoteJSX$Xote.Elements.jsx("div", {
                 class: "basefn-stepper__step-indicator",
                 children: tmp
               }),
-              Xote__JSX.Elements.jsxs("div", {
+              XoteJSX$Xote.Elements.jsxs("div", {
                 class: "basefn-stepper__step-content",
-                children: Xote__JSX.array([
-                  Xote__JSX.Elements.jsx("div", {
+                children: XoteJSX$Xote.array([
+                  XoteJSX$Xote.Elements.jsx("div", {
                     class: "basefn-stepper__step-title",
-                    children: Xote.Component.text(step.title)
+                    children: Node$Xote.text(step.title)
                   }),
-                  desc !== undefined ? Xote__JSX.Elements.jsx("div", {
+                  desc !== undefined ? XoteJSX$Xote.Elements.jsx("div", {
                       class: "basefn-stepper__step-description",
-                      children: Xote.Component.text(desc)
-                    }) : Xote__JSX.jsx(Xote__JSX.jsxFragment, {})
+                      children: Node$Xote.text(desc)
+                    }) : XoteJSX$Xote.jsx(XoteJSX$Xote.jsxFragment, {})
                 ])
               })
             ])
           }),
-          Xote__JSX.Elements.jsx("div", {
+          XoteJSX$Xote.Elements.jsx("div", {
             class: "basefn-stepper__connector"
           })
         ])

package/src/components/Basefn__Switch.res

@@ -55,7 +55,7 @@ let make = (
       <div class="basefn-switch__slider" />
     </div>
     {switch label {
-    | Some(labelText) => <span class="basefn-switch-label"> {Component.text(labelText)} </span>
+    | Some(labelText) => <span class="basefn-switch-label"> {Node.text(labelText)} </span>
     | None => <> </>
     }}
   </label>

package/src/components/Basefn__Switch.res.mjs

@@ -1,7 +1,9 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
 
-import * as Xote from "xote/src/Xote.res.mjs";
-import * as Xote__JSX from "xote/src/Xote__JSX.res.mjs";
+import * as Node$Xote from "xote/src/Node.res.mjs";
+import * as Signal$Xote from "xote/src/Signal.res.mjs";
+import * as XoteJSX$Xote from "xote/src/XoteJSX.res.mjs";
+import * as Computed$Xote from "xote/src/Computed.res.mjs";
 
 import './Basefn__Switch.css'
 ;
@@ -27,7 +29,7 @@ function Basefn__Switch(props) {
   let size = __size !== undefined ? __size : "Md";
   let handleClick = param => {
     if (!disabled) {
-      Xote.Signal.update(checked, prev => !prev);
+      Signal$Xote.update(checked, prev => !prev);
       if (onChange !== undefined) {
         return onChange();
       } else {
@@ -41,8 +43,8 @@ function Basefn__Switch(props) {
   };
   let getSwitchClass = () => {
     let sizeClass = size !== "Md" ? " basefn-switch--" + sizeToString(size) : "";
-    Xote.Computed.make(() => {
-      if (Xote.Signal.get(checked)) {
+    Computed$Xote.make(() => {
+      if (Signal$Xote.get(checked)) {
         return " basefn-switch--checked";
       } else {
         return "";
@@ -51,26 +53,26 @@ function Basefn__Switch(props) {
     let disabledClass = disabled ? " basefn-switch--disabled" : "";
     return "basefn-switch" + sizeClass + disabledClass;
   };
-  return Xote__JSX.Elements.jsxs("label", {
+  return XoteJSX$Xote.Elements.jsxs("label", {
     class: getWrapperClass(),
-    children: Xote__JSX.array([
-      Xote__JSX.Elements.jsx("div", {
-        class: Xote.Computed.make(() => getSwitchClass() + Xote.Signal.get(Xote.Computed.make(() => {
-          if (Xote.Signal.get(checked)) {
+    children: XoteJSX$Xote.array([
+      XoteJSX$Xote.Elements.jsx("div", {
+        class: Computed$Xote.make(() => getSwitchClass() + Signal$Xote.get(Computed$Xote.make(() => {
+          if (Signal$Xote.get(checked)) {
             return " basefn-switch--checked";
           } else {
             return "";
           }
         }, undefined)), undefined),
         onClick: handleClick,
-        children: Xote__JSX.Elements.jsx("div", {
+        children: XoteJSX$Xote.Elements.jsx("div", {
           class: "basefn-switch__slider"
         })
       }),
-      label !== undefined ? Xote__JSX.Elements.jsx("span", {
+      label !== undefined ? XoteJSX$Xote.Elements.jsx("span", {
           class: "basefn-switch-label",
-          children: Xote.Component.text(label)
-        }) : Xote__JSX.jsx(Xote__JSX.jsxFragment, {})
+          children: Node$Xote.text(label)
+        }) : XoteJSX$Xote.jsx(XoteJSX$Xote.jsxFragment, {})
     ])
   });
 }

package/src/components/Basefn__Tabs.res

@@ -5,7 +5,7 @@ open Xote
 type tab = {
   value: string,
   label: string,
-  content: Component.node,
+  content: Node.node,
   disabled?: bool,
 }
 
@@ -51,10 +51,10 @@ let make = (~tabs: array<tab>, ~defaultValue: option<string>=?) => {
               onClick={_ => handleTabClick(tab.value, tab.disabled)}
               disabled={tab.disabled->Option.getOr(false)}
             >
-              {Component.text(tab.label)}
+              {Node.text(tab.label)}
             </button>
           })
-          ->Component.fragment}
+          ->Node.fragment}
         </div>
         <div class="basefn-tabs__content">
           {
@@ -69,5 +69,5 @@ let make = (~tabs: array<tab>, ~defaultValue: option<string>=?) => {
     ]
   })
 
-  Component.signalFragment(computed)
+  Node.signalFragment(computed)
 }

package/src/components/Basefn__Tabs.res.mjs

@@ -1,8 +1,10 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
 
-import * as Xote from "xote/src/Xote.res.mjs";
-import * as Xote__JSX from "xote/src/Xote__JSX.res.mjs";
+import * as Node$Xote from "xote/src/Node.res.mjs";
+import * as Signal$Xote from "xote/src/Signal.res.mjs";
 import * as Core__Option from "@rescript/core/src/Core__Option.res.mjs";
+import * as XoteJSX$Xote from "xote/src/XoteJSX.res.mjs";
+import * as Computed$Xote from "xote/src/Computed.res.mjs";
 
 import './Basefn__Tabs.css'
 ;
@@ -10,21 +12,21 @@ import './Basefn__Tabs.css'
 function Basefn__Tabs(props) {
   let defaultValue = props.defaultValue;
   let tabs = props.tabs;
-  let activeTabSignal = Xote.Signal.make(defaultValue !== undefined ? defaultValue : Core__Option.getOr(Core__Option.map(tabs[0], tab => tab.value), ""), undefined, undefined);
-  return Xote.Component.signalFragment(Xote.Computed.make(() => {
-    let activeValue = Xote.Signal.get(activeTabSignal);
-    return [Xote__JSX.Elements.jsxs("div", {
+  let activeTabSignal = Signal$Xote.make(defaultValue !== undefined ? defaultValue : Core__Option.getOr(Core__Option.map(tabs[0], tab => tab.value), ""), undefined, undefined);
+  return Node$Xote.signalFragment(Computed$Xote.make(() => {
+    let activeValue = Signal$Xote.get(activeTabSignal);
+    return [XoteJSX$Xote.Elements.jsxs("div", {
         class: "basefn-tabs",
-        children: Xote__JSX.array([
-          Xote__JSX.Elements.jsx("div", {
+        children: XoteJSX$Xote.array([
+          XoteJSX$Xote.Elements.jsx("div", {
             class: "basefn-tabs__list",
-            children: Xote.Component.fragment(tabs.map(tab => {
-              let isActive = Xote.Computed.make(() => Xote.Signal.get(activeTabSignal) === tab.value, undefined);
-              let className = Xote.Computed.make(() => {
-                let activeClass = Xote.Signal.get(isActive) ? " basefn-tabs__trigger--active" : "";
+            children: Node$Xote.fragment(tabs.map(tab => {
+              let isActive = Computed$Xote.make(() => Signal$Xote.get(activeTabSignal) === tab.value, undefined);
+              let className = Computed$Xote.make(() => {
+                let activeClass = Signal$Xote.get(isActive) ? " basefn-tabs__trigger--active" : "";
                 return "basefn-tabs__trigger" + activeClass;
               }, undefined);
-              return Xote__JSX.Elements.jsxKeyed("button", {
+              return XoteJSX$Xote.Elements.jsxKeyed("button", {
                 class: className,
                 disabled: Core__Option.getOr(tab.disabled, false),
                 onClick: param => {
@@ -33,16 +35,16 @@ function Basefn__Tabs(props) {
                   if (disabled !== undefined && disabled) {
                     return;
                   } else {
-                    return Xote.Signal.set(activeTabSignal, value);
+                    return Signal$Xote.set(activeTabSignal, value);
                   }
                 },
-                children: Xote.Component.text(tab.label)
+                children: Node$Xote.text(tab.label)
               }, tab.value, undefined);
             }))
           }),
-          Xote__JSX.Elements.jsx("div", {
+          XoteJSX$Xote.Elements.jsx("div", {
             class: "basefn-tabs__content",
-            children: Core__Option.getOr(Core__Option.map(tabs.find(tab => tab.value === activeValue), tab => tab.content), Xote__JSX.jsx(Xote__JSX.jsxFragment, {}))
+            children: Core__Option.getOr(Core__Option.map(tabs.find(tab => tab.value === activeValue), tab => tab.content), XoteJSX$Xote.jsx(XoteJSX$Xote.jsxFragment, {}))
           })
         ])
       })];

package/src/components/Basefn__Textarea.res.mjs

@@ -1,8 +1,8 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
 
-import * as Xote from "xote/src/Xote.res.mjs";
-import * as Xote__JSX from "xote/src/Xote__JSX.res.mjs";
 import * as Basefn__Dom from "../Basefn__Dom.res.mjs";
+import * as Signal$Xote from "xote/src/Signal.res.mjs";
+import * as XoteJSX$Xote from "xote/src/XoteJSX.res.mjs";
 
 import './Basefn__Textarea.css'
 ;
@@ -18,13 +18,13 @@ function Basefn__Textarea(props) {
     let t = Basefn__Dom.target(e);
     let v = t.value;
     if (value.TAG === "Reactive") {
-      Xote.Signal.set(value._0, v);
+      Signal$Xote.set(value._0, v);
     }
     if (onInput !== undefined) {
       return onInput(v);
     }
   };
-  return Xote__JSX.Elements.jsx("textarea", {
+  return XoteJSX$Xote.Elements.jsx("textarea", {
     class: "basefn-textarea",
     value: value,
     placeholder: placeholder,

package/src/components/Basefn__ThemeToggle.res

@@ -23,7 +23,7 @@ let make = (~size: [#Sm | #Md | #Lg]=#Md) => {
     <Basefn__Button
       variant=Ghost onClick={handleClick} class={"basefn-theme-toggle"->ReactiveProp.static}
     >
-      {Component.signalFragment(icon)}
+      {Node.signalFragment(icon)}
     </Basefn__Button>
   </Basefn__Tooltip>
 }

package/src/components/Basefn__ThemeToggle.res.mjs

@@ -1,12 +1,15 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
 
-import * as Xote from "xote/src/Xote.res.mjs";
-import * as Xote__JSX from "xote/src/Xote__JSX.res.mjs";
+import * as Node$Xote from "xote/src/Node.res.mjs";
 import * as Basefn__Dom from "../Basefn__Dom.res.mjs";
+import * as Signal$Xote from "xote/src/Signal.res.mjs";
 import * as Basefn__Icon from "./Basefn__Icon.res.mjs";
+import * as XoteJSX$Xote from "xote/src/XoteJSX.res.mjs";
 import * as Basefn__Theme from "../styles/Basefn__Theme.res.mjs";
+import * as Computed$Xote from "xote/src/Computed.res.mjs";
 import * as Basefn__Button from "./Basefn__Button.res.mjs";
 import * as Basefn__Tooltip from "./Basefn__Tooltip.res.mjs";
+import * as ReactiveProp$Xote from "xote/src/ReactiveProp.res.mjs";
 
 import './Basefn__ThemeToggle.css'
 ;
@@ -17,24 +20,24 @@ function Basefn__ThemeToggle(props) {
     Basefn__Dom.stopPropagation(e);
     Basefn__Theme.toggleTheme();
   };
-  let icon = Xote.Computed.make(() => {
-    let match = Xote.Signal.get(Basefn__Theme.currentTheme);
+  let icon = Computed$Xote.make(() => {
+    let match = Signal$Xote.get(Basefn__Theme.currentTheme);
     if (match === "Light") {
-      return [Xote__JSX.jsx(Basefn__Icon.make, {
+      return [XoteJSX$Xote.jsx(Basefn__Icon.make, {
           name: "Sun"
         })];
     } else {
-      return [Xote__JSX.jsx(Basefn__Icon.make, {
+      return [XoteJSX$Xote.jsx(Basefn__Icon.make, {
           name: "Moon"
         })];
     }
   }, undefined);
-  return Xote__JSX.jsx(Basefn__Tooltip.make, {
+  return XoteJSX$Xote.jsx(Basefn__Tooltip.make, {
     content: "Toggle theme",
     position: "Bottom",
-    children: Xote__JSX.jsx(Basefn__Button.make, {
-      children: Xote.Component.signalFragment(icon),
-      class: Xote.ReactiveProp.$$static("basefn-theme-toggle"),
+    children: XoteJSX$Xote.jsx(Basefn__Button.make, {
+      children: Node$Xote.signalFragment(icon),
+      class: ReactiveProp$Xote.$$static("basefn-theme-toggle"),
       onClick: handleClick,
       variant: "Ghost"
     })