xote 4.2.0 → 4.3.1

package/src/Xote__JSX.res

@@ -0,0 +1,305 @@
+open Signals
+module Component = Xote__Component
+
+/* ReScript JSX transform type aliases */
+type element = Component.node
+
+type component<'props> = 'props => element
+
+type componentLike<'props, 'return> = 'props => 'return
+
+/* JSX functions for component creation */
+let jsx = (component: component<'props>, props: 'props): element => component(props)
+
+let jsxs = (component: component<'props>, props: 'props): element => component(props)
+
+let jsxKeyed = (
+  component: component<'props>,
+  props: 'props,
+  ~key: option<string>=?,
+  _: unit,
+): element => {
+  let _ = key /* TODO: Implement key support for list reconciliation */
+  component(props)
+}
+
+let jsxsKeyed = (
+  component: component<'props>,
+  props: 'props,
+  ~key: option<string>=?,
+  _: unit,
+): element => {
+  let _ = key
+  component(props)
+}
+
+/* Fragment support */
+type fragmentProps = {children?: element}
+
+let jsxFragment = (props: fragmentProps): element => {
+  switch props.children {
+  | Some(child) => child
+  | None => Component.fragment([])
+  }
+}
+
+/* Element converters for JSX expressions */
+let array = (children: array<element>): element => Component.fragment(children)
+
+let null = (): element => Component.text("")
+
+/* Elements module for lowercase HTML tags */
+module Elements = {
+  /* Attribute value type that can be static, signal, or computed */
+  @unboxed
+  type rec attributeValue = Any('a): attributeValue
+
+  /* Automatic conversion from string to attributeValue */
+  external fromString: string => attributeValue = "%identity"
+
+  /* Helper to convert a signal to an attributeValue */
+  let signal = (s: Signals.Signal.t<string>): attributeValue => Any(s)
+
+  /* Helper to convert a computed function to an attributeValue */
+  let computed = (f: unit => string): attributeValue => Any(f)
+
+  /* Props type for HTML elements - supports common attributes and events */
+  type props<'id, 'class, 'style, 'typ, 'value, 'placeholder, 'href, 'target, 'data> = {
+    /* Standard attributes - can be static strings or reactive values */
+    id?: 'id,
+    class?: 'class,
+    style?: 'style,
+    /* Input attributes */
+    @as("type") type_?: 'typ,
+    value?: 'value,
+    placeholder?: 'placeholder,
+    disabled?: bool,
+    checked?: bool,
+    /* Link attributes */
+    href?: 'href,
+    target?: 'target,
+    /* Data attributes */
+    data?: 'data,
+    /* Event handlers */
+    onClick?: Dom.event => unit,
+    onInput?: Dom.event => unit,
+    onChange?: Dom.event => unit,
+    onSubmit?: Dom.event => unit,
+    onFocus?: Dom.event => unit,
+    onBlur?: Dom.event => unit,
+    onKeyDown?: Dom.event => unit,
+    onKeyUp?: Dom.event => unit,
+    onMouseEnter?: Dom.event => unit,
+    onMouseLeave?: Dom.event => unit,
+    /* Children */
+    children?: element,
+  }
+
+  /* Helper to detect if a value is a signal (has an id property) */
+  @get external hasId: 'a => option<int> = "id"
+
+  /* Helper to convert any value to Component.attrValue */
+  let convertAttrValue = (key: string, value: 'a): (string, Component.attrValue) => {
+    // Check if it's a function (computed)
+    if typeof(value) == #function {
+      // It's a computed function
+      let f: unit => string = Obj.magic(value)
+      Component.computedAttr(key, f)
+    } else if typeof(value) == #object && hasId(value)->Option.isSome {
+      // It's a signal (has an id property)
+      let sig: Signal.t<string> = Obj.magic(value)
+      Component.signalAttr(key, sig)
+    } else {
+      // It's a static string
+      let s: string = Obj.magic(value)
+      Component.attr(key, s)
+    }
+  }
+
+  /* Convert props to attrs array */
+  let propsToAttrs = (
+    props: props<'id, 'class, 'style, 'typ, 'value, 'placeholder, 'href, 'target, 'data>,
+  ): array<(string, Component.attrValue)> => {
+    let attrs = []
+
+    switch props.id {
+    | Some(v) => attrs->Array.push(convertAttrValue("id", v))
+    | None => ()
+    }
+
+    switch props.class {
+    | Some(v) => attrs->Array.push(convertAttrValue("class", v))
+    | None => ()
+    }
+
+    switch props.style {
+    | Some(v) => attrs->Array.push(convertAttrValue("style", v))
+    | None => ()
+    }
+
+    switch props.type_ {
+    | Some(v) => attrs->Array.push(convertAttrValue("type", v))
+    | None => ()
+    }
+
+    switch props.value {
+    | Some(v) => attrs->Array.push(convertAttrValue("value", v))
+    | None => ()
+    }
+
+    switch props.placeholder {
+    | Some(v) => attrs->Array.push(convertAttrValue("placeholder", v))
+    | None => ()
+    }
+
+    switch props.disabled {
+    | Some(true) => attrs->Array.push(Component.attr("disabled", "true"))
+    | _ => ()
+    }
+
+    switch props.checked {
+    | Some(true) => attrs->Array.push(Component.attr("checked", "true"))
+    | _ => ()
+    }
+
+    switch props.href {
+    | Some(v) => attrs->Array.push(convertAttrValue("href", v))
+    | None => ()
+    }
+
+    switch props.target {
+    | Some(v) => attrs->Array.push(convertAttrValue("target", v))
+    | None => ()
+    }
+
+    switch props.data {
+    | Some(_dataObj) => {
+        let _ = %raw(`
+          Object.entries(_dataObj).forEach(([key, value]) => {
+            attrs.push(convertAttrValue("data-" + key, value))
+          })
+        `)
+      }
+    | None => ()
+    }
+
+    attrs
+  }
+
+  /* Convert props to events array */
+  let propsToEvents = (
+    props: props<'id, 'class, 'style, 'typ, 'value, 'placeholder, 'href, 'target, 'data>,
+  ): array<(string, Dom.event => unit)> => {
+    let events = []
+
+    switch props.onClick {
+    | Some(handler) => events->Array.push(("click", handler))
+    | None => ()
+    }
+
+    switch props.onInput {
+    | Some(handler) => events->Array.push(("input", handler))
+    | None => ()
+    }
+
+    switch props.onChange {
+    | Some(handler) => events->Array.push(("change", handler))
+    | None => ()
+    }
+
+    switch props.onSubmit {
+    | Some(handler) => events->Array.push(("submit", handler))
+    | None => ()
+    }
+
+    switch props.onFocus {
+    | Some(handler) => events->Array.push(("focus", handler))
+    | None => ()
+    }
+
+    switch props.onBlur {
+    | Some(handler) => events->Array.push(("blur", handler))
+    | None => ()
+    }
+
+    switch props.onKeyDown {
+    | Some(handler) => events->Array.push(("keydown", handler))
+    | None => ()
+    }
+
+    switch props.onKeyUp {
+    | Some(handler) => events->Array.push(("keyup", handler))
+    | None => ()
+    }
+
+    switch props.onMouseEnter {
+    | Some(handler) => events->Array.push(("mouseenter", handler))
+    | None => ()
+    }
+
+    switch props.onMouseLeave {
+    | Some(handler) => events->Array.push(("mouseleave", handler))
+    | None => ()
+    }
+
+    events
+  }
+
+  /* Extract children from props */
+  let getChildren = (
+    props: props<'id, 'class, 'style, 'typ, 'value, 'placeholder, 'href, 'target, 'data>,
+  ): array<element> => {
+    switch props.children {
+    | Some(Fragment(children)) => children
+    | Some(child) => [child]
+    | None => []
+    }
+  }
+
+  /* Create an element from a tag string and props */
+  let createElement = (
+    tag: string,
+    props: props<'id, 'class, 'style, 'typ, 'value, 'placeholder, 'href, 'target, 'data>,
+  ): element => {
+    Component.Element({
+      tag,
+      attrs: propsToAttrs(props),
+      events: propsToEvents(props),
+      children: getChildren(props),
+    })
+  }
+
+  /* JSX functions for HTML elements */
+  let jsx = (
+    tag: string,
+    props: props<'id, 'class, 'style, 'typ, 'value, 'placeholder, 'href, 'target, 'data>,
+  ): element => createElement(tag, props)
+
+  let jsxs = (
+    tag: string,
+    props: props<'id, 'class, 'style, 'typ, 'value, 'placeholder, 'href, 'target, 'data>,
+  ): element => createElement(tag, props)
+
+  let jsxKeyed = (
+    tag: string,
+    props: props<'id, 'class, 'style, 'typ, 'value, 'placeholder, 'href, 'target, 'data>,
+    ~key: option<string>=?,
+    _: unit,
+  ): element => {
+    let _ = key
+    createElement(tag, props)
+  }
+
+  let jsxsKeyed = (
+    tag: string,
+    props: props<'id, 'class, 'style, 'typ, 'value, 'placeholder, 'href, 'target, 'data>,
+    ~key: option<string>=?,
+    _: unit,
+  ): element => {
+    let _ = key
+    createElement(tag, props)
+  }
+
+  /* Element helper for ReScript JSX type checking */
+  external someElement: element => option<element> = "%identity"
+}

package/src/Xote__JSX.res.mjs

@@ -0,0 +1,244 @@
+// Generated by ReScript, PLEASE EDIT WITH CARE
+
+import * as Core__Option from "@rescript/core/src/Core__Option.res.mjs";
+import * as Xote__Component from "./Xote__Component.res.mjs";
+import * as Primitive_option from "@rescript/runtime/lib/es6/Primitive_option.js";
+
+function jsx(component, props) {
+  return component(props);
+}
+
+function jsxs(component, props) {
+  return component(props);
+}
+
+function jsxKeyed(component, props, key, param) {
+  return component(props);
+}
+
+function jsxsKeyed(component, props, key, param) {
+  return component(props);
+}
+
+function jsxFragment(props) {
+  let child = props.children;
+  if (child !== undefined) {
+    return child;
+  } else {
+    return Xote__Component.fragment([]);
+  }
+}
+
+let array = Xote__Component.fragment;
+
+function $$null() {
+  return Xote__Component.text("");
+}
+
+function signal(s) {
+  return s;
+}
+
+function computed(f) {
+  return f;
+}
+
+function convertAttrValue(key, value) {
+  if (typeof value === "function") {
+    return Xote__Component.computedAttr(key, value);
+  } else if (typeof value === "object" && Core__Option.isSome(value.id)) {
+    return Xote__Component.signalAttr(key, value);
+  } else {
+    return Xote__Component.attr(key, value);
+  }
+}
+
+function propsToAttrs(props) {
+  let attrs = [];
+  let v = props.id;
+  if (v !== undefined) {
+    attrs.push(convertAttrValue("id", Primitive_option.valFromOption(v)));
+  }
+  let v$1 = props.class;
+  if (v$1 !== undefined) {
+    attrs.push(convertAttrValue("class", Primitive_option.valFromOption(v$1)));
+  }
+  let v$2 = props.style;
+  if (v$2 !== undefined) {
+    attrs.push(convertAttrValue("style", Primitive_option.valFromOption(v$2)));
+  }
+  let v$3 = props.type;
+  if (v$3 !== undefined) {
+    attrs.push(convertAttrValue("type", Primitive_option.valFromOption(v$3)));
+  }
+  let v$4 = props.value;
+  if (v$4 !== undefined) {
+    attrs.push(convertAttrValue("value", Primitive_option.valFromOption(v$4)));
+  }
+  let v$5 = props.placeholder;
+  if (v$5 !== undefined) {
+    attrs.push(convertAttrValue("placeholder", Primitive_option.valFromOption(v$5)));
+  }
+  let match = props.disabled;
+  if (match !== undefined && match) {
+    attrs.push(Xote__Component.attr("disabled", "true"));
+  }
+  let match$1 = props.checked;
+  if (match$1 !== undefined && match$1) {
+    attrs.push(Xote__Component.attr("checked", "true"));
+  }
+  let v$6 = props.href;
+  if (v$6 !== undefined) {
+    attrs.push(convertAttrValue("href", Primitive_option.valFromOption(v$6)));
+  }
+  let v$7 = props.target;
+  if (v$7 !== undefined) {
+    attrs.push(convertAttrValue("target", Primitive_option.valFromOption(v$7)));
+  }
+  let _dataObj = props.data;
+  if (_dataObj !== undefined) {
+    ((Object.entries(_dataObj).forEach(([key, value]) => {
+            attrs.push(convertAttrValue("data-" + key, value))
+          })));
+  }
+  return attrs;
+}
+
+function propsToEvents(props) {
+  let events = [];
+  let handler = props.onClick;
+  if (handler !== undefined) {
+    events.push([
+      "click",
+      handler
+    ]);
+  }
+  let handler$1 = props.onInput;
+  if (handler$1 !== undefined) {
+    events.push([
+      "input",
+      handler$1
+    ]);
+  }
+  let handler$2 = props.onChange;
+  if (handler$2 !== undefined) {
+    events.push([
+      "change",
+      handler$2
+    ]);
+  }
+  let handler$3 = props.onSubmit;
+  if (handler$3 !== undefined) {
+    events.push([
+      "submit",
+      handler$3
+    ]);
+  }
+  let handler$4 = props.onFocus;
+  if (handler$4 !== undefined) {
+    events.push([
+      "focus",
+      handler$4
+    ]);
+  }
+  let handler$5 = props.onBlur;
+  if (handler$5 !== undefined) {
+    events.push([
+      "blur",
+      handler$5
+    ]);
+  }
+  let handler$6 = props.onKeyDown;
+  if (handler$6 !== undefined) {
+    events.push([
+      "keydown",
+      handler$6
+    ]);
+  }
+  let handler$7 = props.onKeyUp;
+  if (handler$7 !== undefined) {
+    events.push([
+      "keyup",
+      handler$7
+    ]);
+  }
+  let handler$8 = props.onMouseEnter;
+  if (handler$8 !== undefined) {
+    events.push([
+      "mouseenter",
+      handler$8
+    ]);
+  }
+  let handler$9 = props.onMouseLeave;
+  if (handler$9 !== undefined) {
+    events.push([
+      "mouseleave",
+      handler$9
+    ]);
+  }
+  return events;
+}
+
+function getChildren(props) {
+  let child = props.children;
+  if (child !== undefined) {
+    if (child.TAG === "Fragment") {
+      return child._0;
+    } else {
+      return [child];
+    }
+  } else {
+    return [];
+  }
+}
+
+function createElement(tag, props) {
+  return {
+    TAG: "Element",
+    tag: tag,
+    attrs: propsToAttrs(props),
+    events: propsToEvents(props),
+    children: getChildren(props)
+  };
+}
+
+let jsx$1 = createElement;
+
+let jsxs$1 = createElement;
+
+function jsxKeyed$1(tag, props, key, param) {
+  return createElement(tag, props);
+}
+
+function jsxsKeyed$1(tag, props, key, param) {
+  return createElement(tag, props);
+}
+
+let Elements = {
+  signal: signal,
+  computed: computed,
+  convertAttrValue: convertAttrValue,
+  propsToAttrs: propsToAttrs,
+  propsToEvents: propsToEvents,
+  getChildren: getChildren,
+  createElement: createElement,
+  jsx: jsx$1,
+  jsxs: jsxs$1,
+  jsxKeyed: jsxKeyed$1,
+  jsxsKeyed: jsxsKeyed$1
+};
+
+let Component;
+
+export {
+  Component,
+  jsx,
+  jsxs,
+  jsxKeyed,
+  jsxsKeyed,
+  jsxFragment,
+  array,
+  $$null,
+  Elements,
+}
+/* Xote__Component Not a pure module */

package/src/Xote__Route.res

@@ -0,0 +1,62 @@
+// Pure route matching logic (no signals, no DOM)
+
+// Route parameter map
+type params = Dict.t<string>
+
+// Match result
+type matchResult =
+  | Match(params)
+  | NoMatch
+
+// Route segment - either static or dynamic parameter
+type segment =
+  | Static(string)
+  | Param(string)
+
+// Parse a route pattern like "/users/:id/posts/:postId"
+// Returns array of segments, where dynamic segments are marked
+let parsePattern = (pattern: string): array<segment> => {
+  pattern
+  ->String.split("/")
+  ->Array.filterMap(seg => {
+    if seg == "" {
+      None
+    } else if String.startsWith(seg, ":") {
+      Some(Param(String.sliceToEnd(seg, ~start=1)))
+    } else {
+      Some(Static(seg))
+    }
+  })
+}
+
+// Match a pathname against a parsed pattern
+let matchPath = (pattern: array<segment>, pathname: string): matchResult => {
+  let pathSegments =
+    pathname
+    ->String.split("/")
+    ->Array.filter(s => s != "")
+
+  // Length must match
+  if Array.length(pattern) != Array.length(pathSegments) {
+    NoMatch
+  } else {
+    let params = Dict.make()
+    let matches = pattern->Array.everyWithIndex((seg, idx) => {
+      let pathSeg = pathSegments->Array.getUnsafe(idx)
+      switch seg {
+      | Static(expected) => pathSeg == expected
+      | Param(name) => {
+          params->Dict.set(name, pathSeg)
+          true
+        }
+      }
+    })
+
+    matches ? Match(params) : NoMatch
+  }
+}
+
+// Convenience: match a pattern string against pathname
+let match = (pattern: string, pathname: string): matchResult => {
+  matchPath(parsePattern(pattern), pathname)
+}

package/src/Xote__Route.res.mjs

@@ -0,0 +1,56 @@
+// Generated by ReScript, PLEASE EDIT WITH CARE
+
+import * as Core__Array from "@rescript/core/src/Core__Array.res.mjs";
+
+function parsePattern(pattern) {
+  return Core__Array.filterMap(pattern.split("/"), seg => {
+    if (seg === "") {
+      return;
+    } else if (seg.startsWith(":")) {
+      return {
+        TAG: "Param",
+        _0: seg.slice(1)
+      };
+    } else {
+      return {
+        TAG: "Static",
+        _0: seg
+      };
+    }
+  });
+}
+
+function matchPath(pattern, pathname) {
+  let pathSegments = pathname.split("/").filter(s => s !== "");
+  if (pattern.length !== pathSegments.length) {
+    return "NoMatch";
+  }
+  let params = {};
+  let matches = pattern.every((seg, idx) => {
+    let pathSeg = pathSegments[idx];
+    if (seg.TAG === "Static") {
+      return pathSeg === seg._0;
+    }
+    params[seg._0] = pathSeg;
+    return true;
+  });
+  if (matches) {
+    return {
+      TAG: "Match",
+      _0: params
+    };
+  } else {
+    return "NoMatch";
+  }
+}
+
+function match(pattern, pathname) {
+  return matchPath(parsePattern(pattern), pathname);
+}
+
+export {
+  parsePattern,
+  matchPath,
+  match,
+}
+/* No side effect */