@kestack/kabuki 0.0.0-stage → 0.0.0

package/dist/react/registry.js

@@ -0,0 +1,25 @@
+const KEY = Symbol.for('@kestack/kabuki/apps');
+const apps = () => {
+    const global = globalThis;
+    return (global[KEY] ??= new Map());
+};
+export const registry = {
+    /** The History of the app mounted under this name, else the one its last mount left. */
+    history: (name) => apps().get(name)?.history,
+    /** Note that `app` is mounted with its History; false if another app of that name already is. */
+    claim: (name, app, history) => {
+        const live = apps().get(name)?.live;
+        if (live !== undefined && live !== app)
+            return false;
+        apps().set(name, { history, live: app });
+        return true;
+    },
+    /** Leave the History as the app closes. */
+    release: (name, app) => {
+        const kept = apps().get(name);
+        if (kept?.live === app)
+            apps().set(name, { history: kept.history });
+    },
+    /** Forget every app: for tests. */
+    clear: () => apps().clear(),
+};

package/dist/react/view.d.ts

@@ -0,0 +1,80 @@
+import type { CSSProperties, ReactNode, Ref } from 'react';
+import type { AnyActor, Many, Only, Types } from '../core/index.ts';
+/** One Instance in the tree, to draw: its ID and, for a keyed Child, its key. Never changes. */
+export interface Handle<A> {
+    readonly id: string;
+    readonly key?: string;
+    readonly actor?: A;
+}
+type HandleOf<S> = S extends Many<infer A> ? ReadonlyArray<Handle<A> & {
+    readonly key: string;
+}> : Handle<S>;
+type KidsIn<A, T> = T extends keyof Types<A>['children'] ? Types<A>['children'][T] : {};
+/**
+ * What a parent may hand the root element of a View: the `ref` and `style`
+ * Framer Motion animates through. Typed so it spreads on any element.
+ */
+export interface Root {
+    readonly ref: Ref<never> | undefined;
+    readonly style: CSSProperties | undefined;
+}
+/**
+ * What a View draws one Instance from, narrowed by its current State: `_tag`
+ * repeats the State's tag at the top so a `switch` on it narrows `state` and
+ * `children` together.
+ */
+export type ViewProps<A> = {
+    [T in Types<A>['state']['_tag']]: {
+        readonly _tag: T;
+        readonly id: string;
+        readonly model: Types<A>['model'];
+        readonly state: Only<Types<A>['state'], T>;
+        /** What its parent hands it now. */
+        readonly props: Types<A>['props'];
+        readonly children: {
+            readonly [K in keyof KidsIn<A, T>]: HandleOf<KidsIn<A, T>[K]>;
+        };
+        readonly send: (message: Types<A>['message']) => void;
+        /** Spread on the element the View draws as its root: `<li {...root}>`. */
+        readonly root: Root;
+    };
+}[Types<A>['state']['_tag']];
+/** The Instance's part of what a View draws from; `root` is added when drawing. */
+export type Drawable = Omit<ViewProps<AnyActor>, 'root'>;
+/** What Views read the app through, provided by `toReact`. */
+export interface DrawnApp {
+    readonly subscribe: (listener: () => void) => () => void;
+    /** The Instance with this ID in the Snapshot drawn now, the same object while it does not change. */
+    readonly instance: (id: string) => Drawable | undefined;
+    /** The Instance as first drawn, before any Runtime: what a server draws and the client hydrates against. */
+    readonly served: (id: string) => Drawable | undefined;
+}
+export declare const AppContext: import("react").Context<DrawnApp | undefined>;
+/**
+ * A View: a React component drawing one Instance of its Actor. A parent View hands it only where to draw: the Instance, and the
+ * `ref` and `style` to animate it by. Data from the parent is its Props, which
+ * the parent Actor hands it, so Update and Workers see it too.
+ */
+export type ViewOf<A> = (props: {
+    readonly instance: Handle<A>;
+    readonly ref?: Ref<Element> | undefined;
+    readonly style?: CSSProperties | undefined;
+}) => ReactNode;
+/**
+ * How one Actor is drawn: one function of its Instance. The result re-renders
+ * only when its own Instance's Model, State, Props or set of Children changes,
+ * or the parent hands it a new `ref` or `style`, never because a descendant
+ * did.
+ *
+ * Once the Instance stops, the View keeps drawing its last data, so an exit
+ * animation still has something to show.
+ *
+ * `style` counts as changed only when its values do: `motion.create` hands
+ * the View a new `style` object on every render, with the same values.
+ */
+declare const make: <A extends AnyActor>(actor: A, draw: (self: ViewProps<A>) => ReactNode) => ViewOf<A>;
+export declare const View: {
+    make: typeof make;
+};
+export {};
+//# sourceMappingURL=view.d.ts.map

package/dist/react/view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"view.d.ts","sourceRoot":"","sources":["../../src/react/view.tsx"],"names":[],"mappings":"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"}

package/dist/react/view.js

@@ -0,0 +1,47 @@
+import { createContext, memo, use, useRef, useSyncExternalStore } from 'react';
+export const AppContext = createContext(undefined);
+/**
+ * How one Actor is drawn: one function of its Instance. The result re-renders
+ * only when its own Instance's Model, State, Props or set of Children changes,
+ * or the parent hands it a new `ref` or `style`, never because a descendant
+ * did.
+ *
+ * Once the Instance stops, the View keeps drawing its last data, so an exit
+ * animation still has something to show.
+ *
+ * `style` counts as changed only when its values do: `motion.create` hands
+ * the View a new `style` object on every render, with the same values.
+ */
+const make = (actor, draw) => {
+    const View = memo(({ instance, ref, style, }) => {
+        const drawn = use(AppContext);
+        if (!drawn)
+            throw new Error(`[@kestack/kabuki] ${actor.name}View is drawn outside its app`);
+        const live = useSyncExternalStore(drawn.subscribe, () => drawn.instance(instance.id), () => drawn.served(instance.id));
+        // The last data drawn, for a View still on screen after its Instance
+        // stopped. Written during render on purpose: it only ever holds what
+        // the store gave, so a render React throws away cannot leave it wrong.
+        const last = useRef(live);
+        if (live)
+            last.current = live;
+        const self = live ?? last.current;
+        if (!self)
+            return null;
+        return draw({
+            ...self,
+            root: { ref: ref, style },
+        });
+    }, same);
+    View.displayName = `${actor.name}View`;
+    return View;
+};
+/** What the parent hands is the same when each is the same value, and `style` when each of its values is. */
+const same = (a, b) => {
+    const keys = Object.keys(b);
+    if (keys.length !== Object.keys(a).length)
+        return false;
+    return keys.every((key) => Object.is(a[key], b[key]) ||
+        (key === 'style' && sameValues(a[key], b[key])));
+};
+const sameValues = (a, b) => a !== undefined && b !== undefined && same(a, b);
+export const View = { make };

package/package.json

@@ -1,6 +1,58 @@
 {
   "name": "@kestack/kabuki",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.0.0",
+  "private": false,
+  "description": "An app as one tree of Actors outside React: each Actor a small state machine driven by Messages, one immutable Snapshot for the whole app, Effect running the work, and React only drawing it.",
+  "keywords": [
+    "effect",
+    "react",
+    "elm",
+    "state-machine",
+    "actor"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/pkishorez/monorepo",
+    "directory": "packages/kabuki"
+  },
+  "type": "module",
+  "files": [
+    "README.md",
+    "LICENSE",
+    "dist/"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/core/index.d.ts",
+      "default": "./dist/core/index.js"
+    },
+    "./react": {
+      "types": "./dist/react/index.d.ts",
+      "default": "./dist/react/index.js"
+    }
+  },
+  "peerDependencies": {
+    "effect": "^4.0.0",
+    "react": "^19.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "19.2.18",
+    "@types/react-dom": "19.2.7",
+    "effect": "4.0.0",
+    "jsdom": "29.1.1",
+    "motion": "13.2.0",
+    "react": "19.2.8",
+    "react-dom": "19.2.8",
+    "typescript": "7.0.2",
+    "vite": "npm:@voidzero-dev/vite-plus-core@1.0.0",
+    "vitest": "5.0.1",
+    "laymos": "0.0.11"
+  },
+  "scripts": {
+    "build": "rm -rf ./dist && tsc -p tsconfig.build.json",
+    "fmt": "vp fmt",
+    "lint": "vp check && tsc --noEmit && laymos lint",
+    "test": "vitest run"
+  }
 }