@tschk/moonshine-solid 0.4.0 → 0.4.4

package/src/props.ts

@@ -0,0 +1,152 @@
+/** Independent Solid-style prop composition; no compiler or host proxy ABI. */
+import { createMemo } from "@tschk/moonshine-dom/reactive";
+
+type Source =
+  object | (() => object | null | undefined | false) | null | undefined | false;
+type Resolved<T> = T extends () => infer R
+  ? Extract<R, object>
+  : Extract<T, object>;
+type Merge<T extends readonly unknown[]> = T extends readonly [
+  infer A,
+  ...infer B,
+]
+  ? Omit<Resolved<A>, keyof Merge<B>> & Merge<B>
+  : {};
+type Split<T, K extends readonly (readonly (keyof T)[])[]> = [
+  ...{ [I in keyof K]: Pick<T, K[I][number]> },
+  Omit<T, K[number][number]>,
+];
+const views = new WeakSet<object>();
+type Reader = () => object;
+const empty = Object.freeze({});
+function view(
+  read: (key: PropertyKey) => unknown,
+  has: (key: PropertyKey) => boolean,
+  keys: () => (string | symbol)[],
+): object {
+  const result = new Proxy(
+    {},
+    {
+      get: (_, key) => read(key),
+      has: (_, key) => has(key),
+      ownKeys: keys,
+      set: () => true,
+      deleteProperty: () => true,
+      getOwnPropertyDescriptor: (_, key) => ({
+        configurable: true,
+        enumerable: true,
+        get: () => read(key),
+        set: () => {},
+      }),
+    },
+  );
+  views.add(result);
+  return result;
+}
+export function mergeProps<T extends readonly Source[]>(
+  ...sources: T
+): Merge<T> {
+  const live = sources.some(
+    (source) => typeof source === "function" || (!!source && views.has(source)),
+  );
+  if (live) {
+    const readers: Reader[] = sources.map((source) => {
+      if (typeof source === "function") {
+        const memo = createMemo(
+          source as () => object | null | undefined | false,
+        );
+        return () => memo() || empty;
+      }
+      return () => source || empty;
+    });
+    return view(
+      (key) => {
+        for (let index = readers.length - 1; index >= 0; index--) {
+          const source = readers[index]!();
+          const value = Reflect.get(source, key);
+          if (value !== undefined) return value;
+        }
+      },
+      (key) => readers.some((read) => key in read()),
+      () => [...new Set(readers.flatMap((read) => Object.keys(read())))],
+    ) as Merge<T>;
+  }
+  const names = [
+    ...new Set(
+      sources
+        .toReversed()
+        .flatMap((source) =>
+          source ? Object.getOwnPropertyNames(source).toReversed() : [],
+        ),
+    ),
+  ].toReversed();
+  const result: Record<string, unknown> = {};
+  for (const key of names) {
+    if (key === "__proto__" || key === "constructor") continue;
+    const descriptors = sources.map((source) =>
+      source ? Object.getOwnPropertyDescriptor(source, key) : undefined,
+    );
+    let selected = descriptors.length - 1;
+    while (
+      selected >= 0 &&
+      (!descriptors[selected] ||
+        (!descriptors[selected]!.get &&
+          descriptors[selected]!.value === undefined))
+    )
+      selected--;
+    const descriptor = descriptors[selected];
+    if (descriptor && descriptor.get) {
+      Object.defineProperty(result, key, {
+        configurable: true,
+        enumerable: true,
+        get() {
+          for (let index = selected; index >= 0; index--) {
+            const desc = descriptors[index];
+            if (!desc) continue;
+            const value = desc.get ? desc.get.call(sources[index]) : desc.value;
+            if (value !== undefined) return value;
+          }
+        },
+      });
+    } else result[key] = descriptor ? descriptor.value : undefined;
+  }
+  return result as Merge<T>;
+}
+export function splitProps<
+  T extends object,
+  K extends readonly (readonly (keyof T)[])[],
+>(props: T, ...groups: K): Split<T, K> {
+  if (views.has(props)) {
+    const blocked = new Set<PropertyKey>(groups.flat());
+    const parts = groups.map((group) =>
+      view(
+        (key) =>
+          group.includes(key as keyof T) ? Reflect.get(props, key) : undefined,
+        (key) => group.includes(key as keyof T) && key in props,
+        () =>
+          group
+            .filter((key) => key in props)
+            .map((key) => (typeof key === "symbol" ? key : String(key))),
+      ),
+    );
+    parts.push(
+      view(
+        (key) => (blocked.has(key) ? undefined : Reflect.get(props, key)),
+        (key) => !blocked.has(key) && key in props,
+        () => Object.keys(props).filter((key) => !blocked.has(key)),
+      ),
+    );
+    return parts as Split<T, K>;
+  }
+  const parts = Array.from({ length: groups.length + 1 }, () => ({}));
+  for (const key of Object.getOwnPropertyNames(props)) {
+    const index = groups.findIndex((group) => group.includes(key as keyof T));
+    const descriptor = Object.getOwnPropertyDescriptor(props, key)!;
+    Object.defineProperty(
+      parts[index < 0 ? groups.length : index]!,
+      key,
+      descriptor,
+    );
+  }
+  return parts as Split<T, K>;
+}

package/src/reactive.ts

@@ -0,0 +1 @@
+export * from "@tschk/moonshine-dom/reactive";

package/src/solid.ts

@@ -1,25 +1,207 @@
-/**
- * solid-js library re-exports for moonshine apps.
- *
- * ```ts
- * import { createSignal, createEffect, For, Show } from "@tschk/moonshine-solid/solid";
- * ```
- */
+import { children as resolveChildren } from "./children";
+import { peekComponentContext } from "@tschk/moonshine-dom/component";
+/** Native source-level helpers; Solid compiler instructions are not supported. */
+import {
+  ErrorBoundary as nativeErrorBoundary,
+  For as nativeFor,
+  Index as nativeIndex,
+  Show as nativeShow,
+  Match as nativeMatch,
+  Switch as nativeSwitch,
+  type MatchBranch,
+} from "@tschk/moonshine-dom/control";
+import {
+  createMemo,
+  createComponentScope,
+  untrack,
+  type Accessor,
+} from "@tschk/moonshine-dom/reactive";
 export {
-  For,
-  Index,
-  Match,
-  Show,
-  Switch,
+  catchError,
   batch,
   createEffect,
   createMemo,
-  createResource,
-  createRoot,
   createSignal,
   on,
   onCleanup,
   onMount,
   untrack,
-} from "solid-js";
-export type { Accessor, Resource, Setter } from "solid-js";
+} from "@tschk/moonshine-dom/reactive";
+export type { Accessor, Setter } from "@tschk/moonshine-dom/reactive";
+export { createResource } from "@tschk/moonshine-dom/resource";
+export type { Resource } from "@tschk/moonshine-dom/resource";
+
+type ListProps<T, U> = {
+  readonly each: readonly T[] | false | null | undefined;
+  readonly fallback?: U;
+};
+function withFallback<U>(
+  mapped: Accessor<U[]>,
+  fallback: () => U | undefined,
+): Accessor<U[] | U | undefined> {
+  const selected = nativeShow<boolean, U | Accessor<U[]> | undefined>({
+    when: () => mapped().length > 0,
+    children: () => mapped,
+    fallback,
+  });
+  return () => {
+    const value = selected();
+    return value === mapped ? mapped() : (value as U | undefined);
+  };
+}
+export function For<T, U>(
+  props: ListProps<T, U> & {
+    children: (item: T, index: Accessor<number>) => U;
+  },
+): Accessor<U[] | U | undefined> {
+  const items = createMemo(() => props.each || []);
+  return withFallback(
+    nativeFor({
+      each: items,
+      children: (item, index) => props.children(item, index),
+    }),
+    () => props.fallback,
+  );
+}
+export function Index<T, U>(
+  props: ListProps<T, U> & {
+    children: (item: Accessor<T>, index: number) => U;
+  },
+): Accessor<U[] | U | undefined> {
+  const items = createMemo(() => props.each || []);
+  return withFallback(
+    nativeIndex({
+      each: items,
+      children: (item, index) => props.children(item, index),
+    }),
+    () => props.fallback,
+  );
+}
+type ConditionalProps<T, U, Keyed extends boolean = false> = {
+  readonly when: T;
+  readonly children:
+    | U
+    | ((
+        value: Keyed extends true ? NonNullable<T> : Accessor<NonNullable<T>>,
+      ) => U);
+  readonly fallback?: U;
+  readonly keyed?: Keyed;
+};
+function conditional<T, U>(
+  props: ConditionalProps<T, U, boolean>,
+  value: any,
+): U {
+  const child = props.children;
+  return typeof child === "function" && child.length > 0
+    ? (child as (value: any) => U)(value)
+    : (child as U);
+}
+function keyedBranch<T, U>(
+  props: ConditionalProps<T, U, boolean>,
+): Accessor<MatchBranch<T, U>> {
+  return createMemo(() => {
+    const value = props.when;
+    return nativeMatch({
+      when: () => value,
+      children: () => conditional(props, value),
+    });
+  });
+}
+const keyedBranches = /* @__PURE__ */ new WeakMap<
+  object,
+  Accessor<MatchBranch<any, any>>
+>();
+export function Show<T, U>(
+  props: ConditionalProps<T, U, true> & { readonly keyed: true },
+): Accessor<U | undefined>;
+export function Show<T, U>(
+  props: ConditionalProps<T, U>,
+): Accessor<U | undefined>;
+export function Show<T, U>(
+  props: ConditionalProps<T, U, boolean>,
+): Accessor<U | undefined> {
+  return createComponentScope(() => {
+    if (props.keyed) {
+      const condition = createMemo(() => props.when);
+      return createMemo(() => {
+        const value = condition();
+        return value
+          ? untrack(() => conditional(props, value))
+          : props.fallback;
+      });
+    }
+    return nativeShow({
+      when: () => props.when,
+      children: (value) => conditional(props, value),
+      fallback: () => props.fallback,
+    });
+  });
+}
+export function Match<T, U>(
+  props: ConditionalProps<T, U, true> & { readonly keyed: true },
+): MatchBranch<T, U>;
+export function Match<T, U>(props: ConditionalProps<T, U>): MatchBranch<T, U>;
+export function Match<T, U>(
+  props: ConditionalProps<T, U, boolean>,
+): MatchBranch<T, U> {
+  if (props.keyed) {
+    const branch = keyedBranch(props);
+    const initial = untrack(branch);
+    keyedBranches.set(initial, branch);
+    return initial;
+  }
+  return nativeMatch({
+    when: () => props.when,
+    children: (value) => conditional(props, value),
+  });
+}
+type SwitchChild<U> =
+  | MatchBranch<any, U>
+  | boolean
+  | readonly SwitchChild<U>[]
+  | (() => SwitchChild<U>);
+export function Switch<U>(props: {
+  readonly children: SwitchChild<U>;
+  readonly fallback?: U;
+}): Accessor<U | undefined> {
+  return createComponentScope(() => {
+    const resolved = resolveChildren<any>(() => props.children);
+    return nativeSwitch({
+      children: () => {
+        const value = resolved();
+        const branches = Array.isArray(value) ? value : [value];
+        return branches
+          .filter((branch) => typeof branch !== "boolean")
+          .map((branch) => keyedBranches.get(branch)?.() ?? branch);
+      },
+      fallback: () => props.fallback,
+    });
+  });
+}
+export { createContext, useContext, type Context } from "./context";
+
+export { children, type ResolvedChildren, type ChildValue } from "./children";
+
+export function ErrorBoundary<T>(props: {
+  readonly children: T;
+  readonly fallback: T | ((error: Error, reset: () => void) => T);
+}): Accessor<T | undefined> {
+  if (peekComponentContext()?.mode === "ssr")
+    throw new Error("Native Solid ErrorBoundary does not support SSR");
+  return nativeErrorBoundary({
+    children: () => props.children,
+    get fallback() {
+      const fallback = props.fallback;
+      return (error: Error, reset: () => void) =>
+        typeof fallback === "function" && fallback.length
+          ? (fallback as (error: Error, reset: () => void) => T)(error, reset)
+          : (fallback as T);
+    },
+  });
+}
+
+export { mergeProps, splitProps } from "./props";
+
+export { lazy } from "./lazy";
+
+export { createRoot } from "./cleanup-policy";

package/src/ssr.ts

@@ -0,0 +1,41 @@
+export * from "@tschk/moonshine-dom/ssr";
+import { h, type SSRChild } from "@tschk/moonshine-dom/ssr";
+import { createIrRenderer } from "./ir";
+export type { CrepusNode, CrepusIr, RenderCrepusOptions } from "./ir";
+export const { renderCrepusNodeSolid, renderCrepusIrSolid } =
+  /* @__PURE__ */ createIrRenderer<SSRChild>(h);
+
+/** Portals have no server output and never evaluate their children. */
+export function Portal(_props: {
+  children?: unknown;
+  mount?: unknown;
+  isSVG?: boolean;
+  useShadow?: boolean;
+}): undefined {}
+
+import { splitProps } from "./props";
+import type { DynamicComponent, DynamicProps } from "./dynamic";
+
+/** Server selection is evaluated once; no browser runtime is imported. */
+export function createDynamic<T extends DynamicComponent<SSRChild>>(
+  component: () => T | undefined,
+  props: DynamicProps<NoInfer<T>>,
+): SSRChild {
+  const value = component();
+  if (typeof value === "function")
+    return h(value, props as Record<string, unknown>);
+  if (typeof value !== "string") return undefined;
+  const attributes = Object.fromEntries(
+    Object.keys(props as object).map((key) => [
+      key,
+      () => Reflect.get(props as object, key, props),
+    ]),
+  );
+  return h(value, attributes);
+}
+export function Dynamic<T extends DynamicComponent<SSRChild>>(
+  props: { component: T | undefined } & DynamicProps<NoInfer<T>>,
+): SSRChild {
+  const [, rest] = splitProps(props, ["component"]);
+  return createDynamic(() => props.component, rest as DynamicProps<T>);
+}

package/src/store.ts

@@ -1,4 +1,7 @@
-/**
- * solid-js/store re-export.
- */
-export { createStore, produce, reconcile } from "solid-js/store";
+/** Independent native structured state on the Moonshine reactive graph. */
+export {
+  createStore,
+  createMutable,
+  produce,
+  reconcile,
+} from "@tschk/moonshine-dom/store";