davaux 0.8.0 → 0.8.1

package/client/jsx-runtime.ts

@@ -1,209 +0,0 @@
-// Client JSX runtime — creates live DOM nodes instead of HTML strings.
-// When a signal is read during prop/child evaluation, a subscription is
-// created so that DOM node updates automatically when the signal changes.
-// No virtual DOM: changes are applied directly and surgically.
-
-import { createEffect } from './signal.js'
-
-type Child = Node | string | number | boolean | null | undefined | (() => Child) | Child[]
-type StyleObject = Record<string, string | number>
-
-export type Props = {
-  children?: Child | Child[]
-  key?: string | number
-  ref?: ((el: Element) => void) | { current: Element | null }
-  style?: string | StyleObject
-  className?: string
-  htmlFor?: string
-  [prop: string]: unknown
-}
-
-export type ComponentType<P extends Props = Props> = (props: P) => Node
-
-const SVG_NAMESPACE = 'http://www.w3.org/2000/svg'
-const SVG_TAGS = new Set([
-  'svg',
-  'circle',
-  'rect',
-  'path',
-  'line',
-  'polyline',
-  'polygon',
-  'ellipse',
-  'g',
-  'text',
-  'defs',
-  'use',
-  'symbol',
-  'clipPath',
-  'mask',
-  'filter',
-  'linearGradient',
-  'radialGradient',
-  'stop',
-  'pattern',
-  'image',
-  'foreignObject',
-])
-
-function normalizeAttrName(key: string): string {
-  if (key === 'className') return 'class'
-  if (key === 'htmlFor') return 'for'
-  if (key === 'tabIndex') return 'tabindex'
-  return key
-}
-
-function applyStyle(el: HTMLElement, style: string | StyleObject): void {
-  if (typeof style === 'string') {
-    el.style.cssText = style
-  } else {
-    for (const [k, v] of Object.entries(style)) {
-      // camelCase → kebab-case for CSS custom properties and standard props
-      el.style.setProperty(
-        k.replace(/[A-Z]/g, (c) => `-${c.toLowerCase()}`),
-        String(v),
-      )
-    }
-  }
-}
-
-function applyProp(el: Element, key: string, value: unknown): void {
-  if (key === 'ref') {
-    if (typeof value === 'function') (value as (el: Element) => void)(el)
-    else if (value && typeof value === 'object' && 'current' in value) {
-      ;(value as { current: Element | null }).current = el
-    }
-    return
-  }
-
-  if (key === 'style') {
-    applyStyle(el as HTMLElement, value as string | StyleObject)
-    return
-  }
-
-  // Event handlers
-  if (key.startsWith('on') && key[2] === key[2]?.toUpperCase()) {
-    const event = key.slice(2).toLowerCase()
-    el.addEventListener(event, value as EventListener)
-    return
-  }
-
-  const attr = normalizeAttrName(key)
-
-  if (value === false || value == null) {
-    el.removeAttribute(attr)
-  } else if (value === true) {
-    el.setAttribute(attr, '')
-  } else {
-    el.setAttribute(attr, String(value))
-  }
-}
-
-function toNode(child: Child): Node | Node[] {
-  if (child == null || child === false) return document.createTextNode('')
-  if (Array.isArray(child)) return child.flatMap((c) => toNode(c))
-  if (child instanceof Node) return child
-  if (typeof child === 'function') {
-    // Reactive child — re-evaluates when signals it reads change.
-    // The effect runs synchronously before `anchor` has a parent, so we
-    // capture the initial nodes here and return them in a fragment so they
-    // are inserted into the DOM immediately. Updates insert before `anchor`.
-    const anchor = document.createTextNode('')
-    let prevNodes: Node[] = []
-    let initialized = false
-
-    createEffect(() => {
-      const newNodes = [toNode((child as () => Child)())].flat()
-      if (!initialized) {
-        initialized = true
-        prevNodes = newNodes
-      } else {
-        const parent = anchor.parentNode
-        if (parent) {
-          for (const n of newNodes) parent.insertBefore(n, anchor)
-          for (const n of prevNodes) n.parentNode?.removeChild(n)
-          prevNodes = newNodes
-        }
-      }
-    })
-
-    const frag = document.createDocumentFragment()
-    for (const n of prevNodes) frag.append(n)
-    frag.append(anchor)
-    return frag as unknown as Node
-  }
-  return document.createTextNode(String(child))
-}
-
-function mountChildren(el: Element, children: Child | Child[] | undefined): void {
-  if (children == null) return
-
-  const flat = Array.isArray(children) ? children : [children]
-  for (const child of flat) {
-    const nodes = [toNode(child)].flat()
-    el.append(...nodes)
-  }
-}
-
-export function jsx(type: string | ComponentType, props: Props, _key?: string | number): Node {
-  if (typeof type === 'function') {
-    return type(props)
-  }
-
-  if (type === Fragment) {
-    const frag = document.createDocumentFragment()
-    mountChildren(frag as unknown as Element, props.children)
-    return frag
-  }
-
-  const el = SVG_TAGS.has(type)
-    ? document.createElementNS(SVG_NAMESPACE, type)
-    : document.createElement(type)
-
-  for (const [key, value] of Object.entries(props)) {
-    if (key === 'children') continue
-
-    if (typeof value === 'function' && !key.startsWith('on')) {
-      // Reactive prop — re-run when the signal it reads changes
-      createEffect(() => applyProp(el, key, (value as () => unknown)()))
-    } else {
-      applyProp(el, key, value)
-    }
-  }
-
-  mountChildren(el, props.children)
-
-  return el
-}
-
-export const jsxs = jsx
-export const jsxDEV = jsx
-
-export const Fragment = '__Fragment__'
-
-// Client-side JSX namespace. JSX.Element is Node (a live DOM node),
-// not Promise<string> — the two runtimes are intentionally separate.
-export namespace JSX {
-  export type Element = Node
-
-  /** Reactive child: a signal getter (or any zero-arg fn) re-runs on signal change. */
-  export type ReactiveChild = () => Child
-  export type Child = Node | string | number | boolean | null | undefined | ReactiveChild | Child[]
-
-  export interface ElementChildrenAttribute {
-    children: object
-  }
-
-  export interface IntrinsicAttributes {
-    key?: string | number
-  }
-
-  interface DOMAttributes {
-    children?: Child | Child[]
-    [attr: string]: unknown
-  }
-
-  export interface IntrinsicElements {
-    [tag: string]: DOMAttributes
-  }
-}

package/client/resource.ts

@@ -1,122 +0,0 @@
-import { createEffect, createSignal, onCleanup, untrack } from './signal.js'
-
-// ─── createResource ───────────────────────────────────────────────────────────
-
-/** A reactive async data accessor. Call it like a signal to read the resolved
- * value. Read `.loading` and `.error` inside effects or JSX to react to state changes. */
-export type Resource<T> = (() => T | undefined) & {
-  readonly loading: boolean
-  readonly error: Error | undefined
-}
-
-/** Options for `createResource`. */
-export interface ResourceOptions {
-  /** Poll the fetcher on this interval (ms). Cleared when the reactive scope is disposed. */
-  refetchInterval?: number
-}
-
-export type ResourceReturn<T> = [resource: Resource<T>, actions: { refetch: () => void }]
-
-/** No-source: fetcher is called immediately and on every `refetch()`. */
-export function createResource<T>(
-  fetcher: () => Promise<T>,
-  options?: ResourceOptions,
-): ResourceReturn<T>
-
-/** Reactive source: re-fetches whenever the source signal changes.
- *  Skips fetching when source returns `false`, `null`, or `undefined`. */
-export function createResource<T, S>(
-  source: () => S | false | null | undefined,
-  fetcher: (src: S) => Promise<T>,
-  options?: ResourceOptions,
-): ResourceReturn<T>
-
-export function createResource<T, S = never>(
-  fetcherOrSource: (() => Promise<T>) | (() => S | false | null | undefined),
-  fetcherOrOptions?: ((src: S) => Promise<T>) | ResourceOptions,
-  maybeOptions?: ResourceOptions,
-): ResourceReturn<T> {
-  const hasSource = typeof fetcherOrOptions === 'function'
-  const options: ResourceOptions = hasSource
-    ? (maybeOptions ?? {})
-    : ((fetcherOrOptions as ResourceOptions | undefined) ?? {})
-
-  // When using a source, don't start in loading=true if source is initially falsy.
-  const initialSrc = hasSource ? untrack(fetcherOrSource as () => unknown) : null
-  const startLoading = !hasSource || (initialSrc != null && initialSrc !== false)
-
-  const [data, setData] = createSignal<T | undefined>(undefined)
-  const [loading, setLoading] = createSignal(startLoading)
-  const [error, setError] = createSignal<Error | undefined>(undefined)
-
-  // Version counter discards results from superseded in-flight requests.
-  let version = 0
-
-  async function execute(call: () => Promise<T>): Promise<void> {
-    const v = ++version
-    setLoading(true)
-    setError(undefined)
-    try {
-      const result = await untrack(call)
-      if (v !== version) return
-      setData(result)
-    } catch (e) {
-      if (v !== version) return
-      setError(e instanceof Error ? e : new Error(String(e)))
-    } finally {
-      if (v === version) setLoading(false)
-    }
-  }
-
-  let refetch: () => void = () => {}
-
-  if (hasSource) {
-    const source = fetcherOrSource as () => S | false | null | undefined
-    const fetcher = fetcherOrOptions as (src: S) => Promise<T>
-
-    refetch = () => {
-      const src = untrack(source)
-      if (src != null && src !== false) execute(() => fetcher(src as S))
-    }
-
-    createEffect(() => {
-      const src = source()
-      if (src == null || src === false) return
-      execute(() => fetcher(src))
-    })
-  } else {
-    const fetcher = fetcherOrSource as () => Promise<T>
-    refetch = () => execute(fetcher)
-    refetch()
-  }
-
-  if (options.refetchInterval) {
-    const id = setInterval(refetch, options.refetchInterval)
-    onCleanup(() => clearInterval(id))
-  }
-
-  const resource = data as Resource<T>
-  Object.defineProperty(resource, 'loading', { get: loading, enumerable: true })
-  Object.defineProperty(resource, 'error', { get: error, enumerable: true })
-
-  return [resource, { refetch }]
-}
-
-// ─── createEventSource ────────────────────────────────────────────────────────
-
-/**
- * Subscribe to a [Server-Sent Events](https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events)
- * endpoint. Returns a signal getter that holds the latest event's `data` string
- * (`undefined` until the first message arrives) and the raw `EventSource` instance.
- * The connection is closed when the reactive scope is disposed.
- *
- * @example
- * const [message] = createEventSource('/api/events')
- * <p>Latest: {() => message() ?? '—'}</p>
- */
-export function createEventSource(url: string): [() => string | undefined, EventSource] {
-  const [message, setMessage] = createSignal<string | undefined>(undefined)
-  const es = new EventSource(url)
-  es.onmessage = (e: MessageEvent) => setMessage(String(e.data))
-  return [message, es]
-}

package/client/signal.ts

@@ -1,211 +0,0 @@
-// Fine-grained reactivity for browser islands.
-// Signal changes update only the DOM nodes that read them — no VDOM diffing.
-
-type Subscriber = () => void
-// biome-ignore lint/suspicious/noConfusingVoidType: void in this union is intentional — it lets createEffect accept functions that return nothing without an explicit `undefined` return
-type Cleanup = (() => void) | void
-
-let currentSubscriber: Subscriber | null = null
-let currentCleanups: (() => void)[] | null = null
-let batchDepth = 0
-const pendingEffects = new Set<Subscriber>()
-
-export type Signal<T> = [get: () => T, set: (value: T) => void]
-export type ReadonlySignal<T> = () => T
-
-/**
- * Create a reactive signal — a getter/setter pair.
- * Reading the getter inside an effect or reactive JSX child subscribes that
- * context to future updates; calling the setter notifies all subscribers.
- *
- * @example
- * const [count, setCount] = createSignal(0)
- * count()            // read: 0
- * setCount(1)        // write
- * setCount(n => n + 1)  // updater function
- */
-export function createSignal<T>(initialValue: T): Signal<T> {
-  let value = initialValue
-  const subscribers = new Set<Subscriber>()
-
-  const get = (): T => {
-    if (currentSubscriber) subscribers.add(currentSubscriber)
-    return value
-  }
-
-  const set = (next: T): void => {
-    if (Object.is(value, next)) return
-    value = next
-    if (batchDepth > 0) {
-      for (const sub of subscribers) pendingEffects.add(sub)
-    } else {
-      for (const sub of [...subscribers]) sub()
-    }
-  }
-
-  return [get, set]
-}
-
-/**
- * Run a side effect immediately and re-run it whenever its reactive
- * dependencies change. The effect automatically tracks which signals are
- * read during execution and subscribes to each of them.
- *
- * Return a cleanup function (or nothing) — it runs before the next execution
- * and when the enclosing scope is disposed.
- *
- * @example
- * createEffect(() => {
- *   document.title = name()  // re-runs whenever `name` changes
- * })
- */
-export function createEffect(fn: () => Cleanup): void {
-  // Use an object wrapper so the parent-scope disposal closure always reads
-  // the current cleanups array, not a stale reference from an earlier run.
-  const state = { cleanups: [] as (() => void)[] }
-
-  // If created inside a parent scope (createRoot or another createEffect),
-  // register disposal so this effect's cleanups run when the parent disposes.
-  if (currentCleanups) {
-    currentCleanups.push(() => {
-      for (const c of state.cleanups) c()
-      state.cleanups = []
-    })
-  }
-
-  const run: Subscriber = () => {
-    for (const c of state.cleanups) c()
-    state.cleanups = []
-
-    const prev = currentSubscriber
-    const prevCleanups = currentCleanups
-    currentSubscriber = run
-    currentCleanups = state.cleanups
-    try {
-      const cleanup = fn()
-      if (cleanup) state.cleanups.push(cleanup)
-    } finally {
-      currentSubscriber = prev
-      currentCleanups = prevCleanups
-    }
-  }
-
-  run()
-}
-
-/**
- * Create a memoized derived value. Recomputes only when its reactive
- * dependencies change; all readers share the same cached result.
- *
- * @example
- * const fullName = createMemo(() => `${firstName()} ${lastName()}`)
- * <h1>{() => fullName()}</h1>
- */
-export function createMemo<T>(fn: () => T): ReadonlySignal<T> {
-  const [get, set] = createSignal<T>(undefined as T)
-  createEffect(() => {
-    set(fn())
-  })
-  return get
-}
-
-/**
- * Register a teardown tied to the current reactive scope.
- * Called before the enclosing effect re-runs, or when the root is disposed.
- * No-op if called outside any reactive scope.
- *
- * @example
- * createEffect(() => {
- *   const id = setInterval(tick, 1000)
- *   onCleanup(() => clearInterval(id))
- * })
- */
-export function onCleanup(fn: () => void): void {
-  currentCleanups?.push(fn)
-}
-
-/**
- * Create a reactive scope with an explicit lifetime. The `dispose` function
- * tears down all effects and cleanups registered within the scope.
- * Useful for managing reactive state outside the normal component lifecycle.
- *
- * @example
- * const dispose = createRoot((d) => {
- *   createEffect(() => console.log(count()))
- *   return d
- * })
- * dispose()  // tear everything down
- */
-export function createRoot<T>(fn: (dispose: () => void) => T): T {
-  const cleanups: (() => void)[] = []
-  const dispose = (): void => {
-    for (const c of cleanups) c()
-    cleanups.length = 0
-  }
-  const prev = currentCleanups
-  currentCleanups = cleanups
-  try {
-    return fn(dispose)
-  } finally {
-    currentCleanups = prev
-  }
-}
-
-/**
- * Read signals inside `fn` without registering reactive dependencies.
- * The enclosing effect will not re-run when those signals change.
- *
- * @example
- * createEffect(() => {
- *   const a = a()              // tracked — effect re-runs when `a` changes
- *   const b = untrack(() => b())  // not tracked
- * })
- */
-export function untrack<T>(fn: () => T): T {
-  const prev = currentSubscriber
-  currentSubscriber = null
-  try {
-    return fn()
-  } finally {
-    currentSubscriber = prev
-  }
-}
-
-/**
- * Batch multiple signal writes into a single downstream notification pass.
- * Without batching, each setter triggers its own update cycle.
- *
- * @example
- * batch(() => {
- *   setX(1)
- *   setY(2)  // effects that read both x and y run once, not twice
- * })
- */
-export function batch<T>(fn: () => T): T {
-  batchDepth++
-  try {
-    return fn()
-  } finally {
-    batchDepth--
-    if (batchDepth === 0) {
-      const toRun = [...pendingEffects]
-      pendingEffects.clear()
-      for (const sub of toRun) sub()
-    }
-  }
-}
-
-// ─── Store integration hooks ──────────────────────────────────────────────────
-// Used by store.ts to participate in the same subscriber graph and batching.
-
-export function trackRead(subs: Set<Subscriber>): void {
-  if (currentSubscriber) subs.add(currentSubscriber)
-}
-
-export function notifySubs(subs: Set<Subscriber>): void {
-  if (batchDepth > 0) {
-    for (const sub of subs) pendingEffects.add(sub)
-  } else {
-    for (const sub of [...subs]) sub()
-  }
-}

package/client/store.ts

@@ -1,110 +0,0 @@
-import { notifySubs, trackRead } from './signal.js'
-
-type PlainObj = Record<string | symbol, unknown>
-type Subscriber = () => void
-
-// Per-property subscriber sets, keyed on the raw (unwrapped) target object.
-const nodeMap = new WeakMap<object, Map<string | symbol, Set<Subscriber>>>()
-
-function getSubs(target: object, key: string | symbol): Set<Subscriber> {
-  let keyMap = nodeMap.get(target)
-  if (!keyMap) {
-    keyMap = new Map()
-    nodeMap.set(target, keyMap)
-  }
-  let s = keyMap.get(key)
-  if (!s) {
-    s = new Set()
-    keyMap.set(key, s)
-  }
-  return s
-}
-
-function wrap<T extends object>(raw: T): T {
-  return new Proxy(raw, {
-    get(target, key, receiver) {
-      const val = Reflect.get(target, key, receiver)
-      // Only track string-keyed data reads (not Symbol builtins or methods)
-      if (typeof key === 'string' && typeof val !== 'function') {
-        trackRead(getSubs(target, key))
-      }
-      if (val !== null && typeof val === 'object') return wrap(val as object)
-      return val
-    },
-    set() {
-      throw new Error('[davaux] Store is read-only — use setStore() to update')
-    },
-    deleteProperty() {
-      throw new Error('[davaux] Store is read-only — use setStore() to update')
-    },
-  })
-}
-
-function setPath(raw: PlainObj, path: (string | number)[], value: unknown): void {
-  const [head, ...tail] = path
-  const key = String(head)
-  if (tail.length === 0) {
-    const prev = raw[key]
-    const next = typeof value === 'function' ? (value as (p: unknown) => unknown)(prev) : value
-    if (Object.is(prev, next)) return
-    raw[key] = next
-    notifySubs(getSubs(raw, key))
-  } else {
-    const child = raw[key]
-    if (child === null || typeof child !== 'object') {
-      throw new Error(`[davaux] setStore: "${key}" is not an object`)
-    }
-    setPath(child as PlainObj, tail, value)
-  }
-}
-
-/** A value or a function that receives the previous value and returns the next. */
-export type Updater<T> = T | ((prev: T) => T)
-
-/** Typed path-based setter for a store. Supports 1–3 level deep key paths;
- * deeper paths fall through to an untyped escape hatch. */
-export interface SetStoreFn<T extends object> {
-  <K extends keyof T>(k: K, v: Updater<T[K]>): void
-  <K1 extends keyof T, K2 extends keyof NonNullable<T[K1]>>(
-    k1: K1,
-    k2: K2,
-    v: Updater<NonNullable<T[K1]>[K2]>,
-  ): void
-  <
-    K1 extends keyof T,
-    K2 extends keyof NonNullable<T[K1]>,
-    K3 extends keyof NonNullable<NonNullable<T[K1]>[K2]>,
-  >(
-    k1: K1,
-    k2: K2,
-    k3: K3,
-    v: Updater<NonNullable<NonNullable<T[K1]>[K2]>[K3]>,
-  ): void
-  (...args: unknown[]): void
-}
-
-/**
- * Create a reactive store for shared inter-island state. Returns a
- * `[store, setStore]` pair. `store` is a deeply reactive readonly proxy —
- * reads inside effects and JSX are tracked at individual property granularity,
- * so only the effects that read a changed key re-run.
- *
- * Use `setStore` with dot-path key segments; functional updaters are supported
- * at every level. Arrays must be updated via functional updaters (not `.push()`).
- *
- * @example
- * const [cart, setCart] = createStore({ items: [] as Item[], total: 0 })
- * setCart('items', items => [...items, newItem])
- * setCart('total', t => t + newItem.price)
- */
-export function createStore<T extends object>(init: T): [store: T, setStore: SetStoreFn<T>] {
-  const raw = structuredClone(init) as PlainObj
-  const store = wrap(raw) as T
-
-  const setStore = (...args: unknown[]): void => {
-    if (args.length < 2) throw new Error('[davaux] setStore requires a path and a value')
-    setPath(raw, args.slice(0, -1) as (string | number)[], args[args.length - 1])
-  }
-
-  return [store, setStore as unknown as SetStoreFn<T>]
-}