@dreamboard-games/ui-sdk 0.0.41

package/dist/utils/interaction-inputs.d.ts

@@ -0,0 +1,22 @@
+import type { InteractionDescriptor, InteractionInputDescriptor, InputSelection } from "../types/plugin-state.js";
+export type BoardTargetKind = "edge" | "vertex" | "space" | "tile";
+export declare function interactionInputKeys(descriptor: Pick<InteractionDescriptor, "inputs">): string[];
+export declare function applyInteractionInputDefaults<Params extends Record<string, unknown>>(descriptor: Pick<InteractionDescriptor, "inputs">, params: Readonly<Partial<Params>>): Partial<Params>;
+export declare function validateInteractionInputDomains(descriptor: Pick<InteractionDescriptor, "inputs">, params: Readonly<Record<string, unknown>>): Partial<Record<string, readonly string[]>>;
+export declare function isInputValueReady(input: InteractionInputDescriptor, value: unknown): boolean;
+export declare function isManyInput(input: InteractionInputDescriptor): boolean;
+export declare function maxSelectedForInput(input: InteractionInputDescriptor): number | undefined;
+export declare function toggleManyValue(current: unknown, value: string, selection: InputSelection): string[];
+export declare function isManyTargetSelectable(input: InteractionInputDescriptor, current: unknown, targetId: string): boolean;
+export declare function mergeInteractionFieldErrors(...sources: Array<Partial<Record<string, readonly string[]>>>): Partial<Record<string, readonly string[]>>;
+export declare function hasInteractionFieldErrors(fieldErrors: Partial<Record<string, readonly string[]>>): boolean;
+export declare function inputByKey(descriptor: Pick<InteractionDescriptor, "inputs">, key: string): InteractionInputDescriptor | undefined;
+export declare function inputByTarget(descriptor: Pick<InteractionDescriptor, "inputs">, targetKind: BoardTargetKind | "card", targetId: string): InteractionInputDescriptor | null;
+export declare function eligibleTargetsForInput(descriptor: Pick<InteractionDescriptor, "inputs">, key: string): readonly string[] | undefined;
+export declare function eligibleTargetsByInput(descriptor: Pick<InteractionDescriptor, "inputs">): Record<string, readonly string[]>;
+export declare function eligibleTargetsByBoardKind(descriptor: Pick<InteractionDescriptor, "inputs">): Partial<Record<BoardTargetKind, readonly string[]>>;
+export declare function hasBoardTargetInput(descriptor: Pick<InteractionDescriptor, "inputs">): boolean;
+export declare function hasCardTargetInput(descriptor: Pick<InteractionDescriptor, "inputs">): boolean;
+export declare function interactionArmScope(descriptor: Pick<InteractionDescriptor, "inputs" | "interactionKey" | "zoneId">): string;
+export declare function inputKeyForTarget(descriptor: Pick<InteractionDescriptor, "inputs">, targetKind: BoardTargetKind | "card", targetId: string): string | null;
+//# sourceMappingURL=interaction-inputs.d.ts.map

package/dist/utils/interaction-inputs.d.ts.map

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

package/dist/utils/interaction-inputs.js

@@ -0,0 +1,219 @@
+export function interactionInputKeys(descriptor) {
+    return descriptor.inputs.map((input) => input.key);
+}
+export function applyInteractionInputDefaults(descriptor, params) {
+    const next = { ...params };
+    for (const input of descriptor.inputs) {
+        if (next[input.key] !== undefined)
+            continue;
+        if (!("defaultValue" in input))
+            continue;
+        next[input.key] = input.defaultValue;
+    }
+    return next;
+}
+export function validateInteractionInputDomains(descriptor, params) {
+    const fieldErrors = {};
+    for (const input of descriptor.inputs) {
+        const value = params[input.key];
+        if (value === undefined || value === null)
+            continue;
+        const selectionErrors = validateInputSelection(input, value);
+        for (const error of selectionErrors) {
+            pushFieldError(fieldErrors, input.key, error);
+        }
+        if (input.domain.type === "choiceList") {
+            if (!Array.isArray(value)) {
+                pushFieldError(fieldErrors, input.key, "Expected a list of choices.");
+                continue;
+            }
+            const min = input.domain.min ?? 0;
+            const max = input.domain.max ??
+                input.domain.choices?.length ??
+                Number.POSITIVE_INFINITY;
+            if (value.length < min) {
+                pushFieldError(fieldErrors, input.key, `Choose at least ${min} ${pluralize("option", min)}.`);
+            }
+            if (value.length > max) {
+                pushFieldError(fieldErrors, input.key, `Choose at most ${max} ${pluralize("option", max)}.`);
+            }
+        }
+        if (input.domain.type === "target") {
+            const values = valuesForSelection(input.domain.selection, value);
+            const eligible = input.domain.eligibleTargets;
+            if (eligible) {
+                for (const item of values) {
+                    if (!eligible.includes(String(item))) {
+                        pushFieldError(fieldErrors, input.key, "Selected target is not eligible.");
+                        break;
+                    }
+                }
+            }
+        }
+    }
+    return fieldErrors;
+}
+export function isInputValueReady(input, value) {
+    if (value === undefined || value === null)
+        return false;
+    const selection = input.domain.selection;
+    if (selection?.mode !== "many")
+        return true;
+    return Array.isArray(value) && value.length >= (selection.min ?? 0);
+}
+export function isManyInput(input) {
+    return input.domain.selection?.mode === "many";
+}
+export function maxSelectedForInput(input) {
+    const selection = input.domain.selection;
+    return selection?.mode === "many" ? selection.max : undefined;
+}
+export function toggleManyValue(current, value, selection) {
+    const previous = Array.isArray(current)
+        ? current.map((item) => String(item))
+        : [];
+    const existing = previous.indexOf(value);
+    if (existing >= 0) {
+        return previous.filter((item) => item !== value);
+    }
+    if (selection.max !== undefined && previous.length >= selection.max) {
+        return previous;
+    }
+    return [...previous, value];
+}
+export function isManyTargetSelectable(input, current, targetId) {
+    const selection = input.domain.selection;
+    if (selection?.mode !== "many")
+        return true;
+    const currentValues = Array.isArray(current)
+        ? current.map((item) => String(item))
+        : [];
+    if (currentValues.includes(targetId))
+        return true;
+    if (selection.distinct && currentValues.includes(targetId))
+        return false;
+    return selection.max === undefined || currentValues.length < selection.max;
+}
+export function mergeInteractionFieldErrors(...sources) {
+    const merged = {};
+    for (const source of sources) {
+        for (const [key, messages] of Object.entries(source)) {
+            if (!messages || messages.length === 0)
+                continue;
+            merged[key] = [...(merged[key] ?? []), ...messages];
+        }
+    }
+    return merged;
+}
+export function hasInteractionFieldErrors(fieldErrors) {
+    return Object.values(fieldErrors).some((messages) => (messages?.length ?? 0) > 0);
+}
+export function inputByKey(descriptor, key) {
+    return descriptor.inputs.find((input) => input.key === key);
+}
+export function inputByTarget(descriptor, targetKind, targetId) {
+    for (const input of descriptor.inputs) {
+        if (input.domain.type !== "target")
+            continue;
+        if (input.domain.targetKind !== targetKind)
+            continue;
+        if (input.domain.eligibleTargets?.includes(targetId))
+            return input;
+    }
+    return null;
+}
+export function eligibleTargetsForInput(descriptor, key) {
+    const domain = inputByKey(descriptor, key)?.domain;
+    return domain?.type === "target" ? domain.eligibleTargets : undefined;
+}
+export function eligibleTargetsByInput(descriptor) {
+    return Object.fromEntries(descriptor.inputs.flatMap((input) => {
+        const targets = input.domain.type === "target"
+            ? input.domain.eligibleTargets
+            : undefined;
+        return targets ? [[input.key, targets]] : [];
+    }));
+}
+export function eligibleTargetsByBoardKind(descriptor) {
+    const result = {
+        edge: new Set(),
+        vertex: new Set(),
+        space: new Set(),
+        tile: new Set(),
+    };
+    for (const input of descriptor.inputs) {
+        if (input.domain.type !== "target")
+            continue;
+        const targetKind = input.domain.targetKind;
+        if (!isBoardTargetKind(targetKind))
+            continue;
+        for (const targetId of input.domain.eligibleTargets ?? []) {
+            result[targetKind].add(targetId);
+        }
+    }
+    return Object.fromEntries(Object.entries(result).flatMap(([kind, ids]) => ids.size > 0 ? [[kind, [...ids]]] : []));
+}
+export function hasBoardTargetInput(descriptor) {
+    return Object.keys(eligibleTargetsByBoardKind(descriptor)).length > 0;
+}
+export function hasCardTargetInput(descriptor) {
+    return descriptor.inputs.some((input) => input.domain.type === "target" && input.domain.targetKind === "card");
+}
+export function interactionArmScope(descriptor) {
+    const byKind = eligibleTargetsByBoardKind(descriptor);
+    const boardKinds = Object.keys(byKind).filter((kind) => byKind[kind] !== undefined);
+    if (boardKinds.length === 1)
+        return `board:${boardKinds[0]}`;
+    if (boardKinds.length > 1)
+        return "board";
+    if (descriptor.zoneId)
+        return `zone:${descriptor.zoneId}`;
+    return `interaction:${descriptor.interactionKey}`;
+}
+export function inputKeyForTarget(descriptor, targetKind, targetId) {
+    return inputByTarget(descriptor, targetKind, targetId)?.key ?? null;
+}
+function validateInputSelection(input, value) {
+    const selection = input.domain.selection;
+    if (selection?.mode !== "many")
+        return [];
+    if (!Array.isArray(value))
+        return ["Expected a list of values."];
+    const errors = [];
+    const min = selection.min ?? 0;
+    if (value.length < min) {
+        errors.push(`Choose at least ${min} ${pluralize("value", min)}.`);
+    }
+    if (selection.max !== undefined && value.length > selection.max) {
+        errors.push(`Choose at most ${selection.max} ${pluralize("value", selection.max)}.`);
+    }
+    if (selection.distinct) {
+        const seen = new Set();
+        for (const item of value) {
+            const key = String(item);
+            if (seen.has(key)) {
+                errors.push("Choose each value only once.");
+                break;
+            }
+            seen.add(key);
+        }
+    }
+    return errors;
+}
+function valuesForSelection(selection, value) {
+    if (selection?.mode === "many")
+        return Array.isArray(value) ? value : [];
+    return [value];
+}
+function isBoardTargetKind(value) {
+    return (value === "edge" ||
+        value === "vertex" ||
+        value === "space" ||
+        value === "tile");
+}
+function pushFieldError(fieldErrors, key, message) {
+    fieldErrors[key] = [...(fieldErrors[key] ?? []), message];
+}
+function pluralize(word, count) {
+    return count === 1 ? word : `${word}s`;
+}

package/dist/utils/interaction-labels.d.ts

@@ -0,0 +1,4 @@
+import type { InteractionDescriptor } from "../types/plugin-state.js";
+export declare function humanizeInteractionId(id: string): string;
+export declare function interactionLabel(descriptor: Pick<InteractionDescriptor, "interactionId" | "interactionKey">): string;
+//# sourceMappingURL=interaction-labels.d.ts.map

package/dist/utils/interaction-labels.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"interaction-labels.d.ts","sourceRoot":"","sources":["../../src/utils/interaction-labels.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAEtE,wBAAgB,qBAAqB,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,CAYxD;AAED,wBAAgB,gBAAgB,CAC9B,UAAU,EAAE,IAAI,CAAC,qBAAqB,EAAE,eAAe,GAAG,gBAAgB,CAAC,GAC1E,MAAM,CAIR"}

package/dist/utils/interaction-labels.js

@@ -0,0 +1,18 @@
+export function humanizeInteractionId(id) {
+    if (!id)
+        return id;
+    const withSpaces = id
+        .replace(/[-_]+/g, " ")
+        .replace(/([a-z0-9])([A-Z])/g, "$1 $2")
+        .replace(/([A-Z]+)([A-Z][a-z])/g, "$1 $2")
+        .trim();
+    if (!withSpaces)
+        return id;
+    return withSpaces
+        .split(/\s+/)
+        .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
+        .join(" ");
+}
+export function interactionLabel(descriptor) {
+    return humanizeInteractionId(descriptor.interactionId || descriptor.interactionKey);
+}

package/dist/utils/interaction-status.d.ts

@@ -0,0 +1,15 @@
+import type { InteractionHandleStatus } from "../hooks/useInteractionHandle.js";
+import type { InteractionDescriptor } from "../types/plugin-state.js";
+export type InteractionActionState = "available" | "unavailable" | "submitting" | "submitted";
+export type InteractionDisabledReason = "unavailable" | "selection-limit" | "submitting" | "submitted";
+export interface InteractionStatusSnapshot {
+    status: InteractionHandleStatus;
+    actionState: InteractionActionState;
+    disabled: boolean;
+    disabledReason?: InteractionDisabledReason;
+}
+export declare function interactionStatusSnapshot({ descriptor, status, }: {
+    descriptor: InteractionDescriptor;
+    status: InteractionHandleStatus;
+}): InteractionStatusSnapshot;
+//# sourceMappingURL=interaction-status.d.ts.map

package/dist/utils/interaction-status.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"interaction-status.d.ts","sourceRoot":"","sources":["../../src/utils/interaction-status.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,kCAAkC,CAAC;AAChF,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAEtE,MAAM,MAAM,sBAAsB,GAC9B,WAAW,GACX,aAAa,GACb,YAAY,GACZ,WAAW,CAAC;AAEhB,MAAM,MAAM,yBAAyB,GACjC,aAAa,GACb,iBAAiB,GACjB,YAAY,GACZ,WAAW,CAAC;AAEhB,MAAM,WAAW,yBAAyB;IACxC,MAAM,EAAE,uBAAuB,CAAC;IAChC,WAAW,EAAE,sBAAsB,CAAC;IACpC,QAAQ,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,yBAAyB,CAAC;CAC5C;AAED,wBAAgB,yBAAyB,CAAC,EACxC,UAAU,EACV,MAAM,GACP,EAAE;IACD,UAAU,EAAE,qBAAqB,CAAC;IAClC,MAAM,EAAE,uBAAuB,CAAC;CACjC,GAAG,yBAAyB,CA8B5B"}

package/dist/utils/interaction-status.js

@@ -0,0 +1,31 @@
+export function interactionStatusSnapshot({ descriptor, status, }) {
+    if (status === "submitted") {
+        return {
+            status,
+            actionState: "submitted",
+            disabled: true,
+            disabledReason: "submitted",
+        };
+    }
+    if (status === "submitting") {
+        return {
+            status,
+            actionState: "submitting",
+            disabled: true,
+            disabledReason: "submitting",
+        };
+    }
+    if (descriptor.available === false) {
+        return {
+            status,
+            actionState: "unavailable",
+            disabled: true,
+            disabledReason: "unavailable",
+        };
+    }
+    return {
+        status,
+        actionState: "available",
+        disabled: false,
+    };
+}

package/package.json

@@ -0,0 +1,101 @@
+{
+  "name": "@dreamboard-games/ui-sdk",
+  "version": "0.0.41",
+  "description": "UI SDK for dreamboard plugin development",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "bun": "./src/index.ts",
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./reducer": {
+      "bun": "./src/reducer.ts",
+      "types": "./dist/reducer.d.ts",
+      "import": "./dist/reducer.js"
+    },
+    "./components": {
+      "bun": "./src/components/index.ts",
+      "types": "./dist/components/index.d.ts",
+      "import": "./dist/components/index.js"
+    },
+    "./defaults": {
+      "bun": "./src/defaults/index.ts",
+      "types": "./dist/defaults/index.d.ts",
+      "import": "./dist/defaults/index.js"
+    },
+    "./primitives": {
+      "bun": "./src/primitives/index.ts",
+      "types": "./dist/primitives/index.d.ts",
+      "import": "./dist/primitives/index.js"
+    },
+    "./internal": {
+      "bun": "./src/internal.ts",
+      "types": "./dist/internal.d.ts",
+      "import": "./dist/internal.js"
+    },
+    "./types/runtime-api": {
+      "bun": "./src/types/runtime-api.ts",
+      "types": "./dist/types/runtime-api.d.ts",
+      "import": "./dist/types/runtime-api.js"
+    },
+    "./plugin-styles.css": "./dist/plugin-styles.css",
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "src",
+    "README.md",
+    "LICENSE",
+    "NOTICE"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "rm -rf dist tsconfig.tsbuildinfo && tsc -b && cp src/plugin-styles.css dist/plugin-styles.css && rollup -c rollup.config.js",
+    "postbuild": "echo '✅ Generated ui-sdk.d.ts'",
+    "typecheck": "tsc -b --pretty false",
+    "dev": "cosmos",
+    "cosmos": "cosmos",
+    "cosmos:export": "cosmos-export",
+    "lint": "eslint src --ext .ts,.tsx",
+    "lint:fix": "eslint src --ext .ts,.tsx --fix",
+    "test": "bun test",
+    "test:unit": "bun test",
+    "clean": "rm -rf dist"
+  },
+  "dependencies": {
+    "@dreamboard/sdk-types": "npm:@dreamboard-games/sdk-types@0.1.0",
+    "@radix-ui/react-accordion": "^1.2.12",
+    "@radix-ui/react-dialog": "^1.1.14",
+    "@radix-ui/react-label": "^2.1.6",
+    "@radix-ui/react-select": "^2.2.5",
+    "@radix-ui/react-slot": "^1.1.2",
+    "@radix-ui/react-tooltip": "^1.2.8",
+    "@use-gesture/react": "^10.3.1",
+    "clsx": "^2.1.1",
+    "framer-motion": "^11.15.0",
+    "lucide-react": "^0.562.0",
+    "react": "^19.2.0",
+    "tailwindcss": "^4.1.5",
+    "vaul": "^1.1.2",
+    "zustand": "^5.0.4"
+  },
+  "peerDependencies": {
+    "framer-motion": "^11.0.0",
+    "react": "^19.0.0",
+    "zod": "4.4.3"
+  },
+  "license": "SEE LICENSE IN LICENSE",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/dreamboard-games/dreamboard.git"
+  },
+  "homepage": "http://dreamboard.games/",
+  "bugs": {
+    "url": "https://github.com/dreamboard-games/dreamboard/issues"
+  }
+}

package/src/components/ActionButton.tsx

@@ -0,0 +1,48 @@
+/**
+ * Action button bound to an {@link InteractionHandle}. Availability, tooltip
+ * reason, and submission are delegated to the authoritative handle — callers
+ * MUST NOT recompute eligibility or affordability.
+ */
+
+import type { ButtonHTMLAttributes, ReactNode } from "react";
+import type { InteractionHandle } from "../hooks/useInteractionHandle.js";
+import { interactionLabel } from "../utils/interaction-labels.js";
+import { ThemedButton } from "./ThemedButton.js";
+
+export interface ActionButtonProps
+  extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "onClick"> {
+  handle: InteractionHandle;
+  children?: ReactNode;
+}
+
+export function ActionButton({
+  handle,
+  children,
+  disabled,
+  title,
+  ...rest
+}: ActionButtonProps) {
+  return (
+    <ThemedButton
+      type="button"
+      variant="secondary"
+      disabled={disabled || !handle.available}
+      title={title ?? formatUnavailableReason(handle.unavailableReason)}
+      onClick={() => {
+        void handle.submit();
+      }}
+      {...rest}
+    >
+      {children ?? interactionLabel(handle.descriptor)}
+    </ThemedButton>
+  );
+}
+
+function formatUnavailableReason(
+  reason: string | undefined,
+): string | undefined {
+  if (reason === "INSUFFICIENT_RESOURCES") {
+    return "Insufficient resources";
+  }
+  return reason;
+}