@almadar/shell-web 0.0.0-stage → 1.0.0

package/dist/chunk-DZBQA2OW.js

@@ -0,0 +1,176 @@
+import { effectCategoryOf, EFFECT_CATEGORY_COLORS, asEffectOperator } from './chunk-UXLE3IPR.js';
+import { createLogger } from '@almadar/logger';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+var log = createLogger("almadar:ui:avl:effect");
+function headIcon(type, x, y, s, color) {
+  switch (type) {
+    case "render-ui":
+      return /* @__PURE__ */ jsxs("g", { children: [
+        /* @__PURE__ */ jsx("rect", { x: x - s, y: y - s, width: s * 2, height: s * 2, fill: "none", stroke: color, strokeWidth: 1.5, rx: 1 }),
+        /* @__PURE__ */ jsx("line", { x1: x, y1: y - s, x2: x, y2: y + s, stroke: color, strokeWidth: 1 }),
+        /* @__PURE__ */ jsx("line", { x1: x - s, y1: y, x2: x + s, y2: y, stroke: color, strokeWidth: 1 })
+      ] });
+    case "set":
+      return /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: `M${x - s * 0.6},${y + s} L${x - s},${y + s * 0.4} L${x + s * 0.4},${y - s} L${x + s},${y - s * 0.4} Z`,
+          fill: "none",
+          stroke: color,
+          strokeWidth: 1.5,
+          strokeLinejoin: "round"
+        }
+      );
+    case "persist":
+      return /* @__PURE__ */ jsxs("g", { children: [
+        /* @__PURE__ */ jsx("ellipse", { cx: x, cy: y - s * 0.6, rx: s, ry: s * 0.4, fill: "none", stroke: color, strokeWidth: 1.5 }),
+        /* @__PURE__ */ jsx("line", { x1: x - s, y1: y - s * 0.6, x2: x - s, y2: y + s * 0.4, stroke: color, strokeWidth: 1.5 }),
+        /* @__PURE__ */ jsx("line", { x1: x + s, y1: y - s * 0.6, x2: x + s, y2: y + s * 0.4, stroke: color, strokeWidth: 1.5 }),
+        /* @__PURE__ */ jsx("ellipse", { cx: x, cy: y + s * 0.4, rx: s, ry: s * 0.4, fill: "none", stroke: color, strokeWidth: 1.5 })
+      ] });
+    case "fetch":
+      return /* @__PURE__ */ jsxs("g", { children: [
+        /* @__PURE__ */ jsx("line", { x1: x, y1: y - s, x2: x, y2: y + s * 0.6, stroke: color, strokeWidth: 1.5 }),
+        /* @__PURE__ */ jsx("polyline", { points: `${x - s * 0.5},${y + s * 0.1} ${x},${y + s} ${x + s * 0.5},${y + s * 0.1}`, fill: "none", stroke: color, strokeWidth: 1.5, strokeLinejoin: "round" })
+      ] });
+    case "emit":
+      return /* @__PURE__ */ jsxs("g", { children: [
+        /* @__PURE__ */ jsx("circle", { cx: x, cy: y, r: s * 0.3, fill: color }),
+        /* @__PURE__ */ jsx("path", { d: `M${x - s * 0.7},${y - s * 0.7} A${s},${s} 0 0,1 ${x + s * 0.7},${y - s * 0.7}`, fill: "none", stroke: color, strokeWidth: 1.5 }),
+        /* @__PURE__ */ jsx("path", { d: `M${x - s},${y - s} A${s * 1.4},${s * 1.4} 0 0,1 ${x + s},${y - s}`, fill: "none", stroke: color, strokeWidth: 1, opacity: 0.6 })
+      ] });
+    case "navigate":
+      return /* @__PURE__ */ jsxs("g", { children: [
+        /* @__PURE__ */ jsx("line", { x1: x - s, y1: y, x2: x + s * 0.6, y2: y, stroke: color, strokeWidth: 1.5 }),
+        /* @__PURE__ */ jsx("polyline", { points: `${x + s * 0.1},${y - s * 0.5} ${x + s},${y} ${x + s * 0.1},${y + s * 0.5}`, fill: "none", stroke: color, strokeWidth: 1.5, strokeLinejoin: "round" })
+      ] });
+    case "call-service":
+      return /* @__PURE__ */ jsxs("g", { children: [
+        /* @__PURE__ */ jsx("line", { x1: x - s, y1: y - s * 0.3, x2: x + s, y2: y - s * 0.3, stroke: color, strokeWidth: 1.5 }),
+        /* @__PURE__ */ jsx("polyline", { points: `${x + s * 0.5},${y - s * 0.7} ${x + s},${y - s * 0.3} ${x + s * 0.5},${y + s * 0.1}`, fill: "none", stroke: color, strokeWidth: 1.5, strokeLinejoin: "round" }),
+        /* @__PURE__ */ jsx("line", { x1: x + s, y1: y + s * 0.3, x2: x - s, y2: y + s * 0.3, stroke: color, strokeWidth: 1.5 }),
+        /* @__PURE__ */ jsx("polyline", { points: `${x - s * 0.5},${y - s * 0.1} ${x - s},${y + s * 0.3} ${x - s * 0.5},${y + s * 0.7}`, fill: "none", stroke: color, strokeWidth: 1.5, strokeLinejoin: "round" })
+      ] });
+    case "spawn":
+      return /* @__PURE__ */ jsxs("g", { children: [
+        /* @__PURE__ */ jsx("circle", { cx: x, cy: y, r: s, fill: "none", stroke: color, strokeWidth: 1.5 }),
+        /* @__PURE__ */ jsx("line", { x1: x - s * 0.5, y1: y, x2: x + s * 0.5, y2: y, stroke: color, strokeWidth: 1.5 }),
+        /* @__PURE__ */ jsx("line", { x1: x, y1: y - s * 0.5, x2: x, y2: y + s * 0.5, stroke: color, strokeWidth: 1.5 })
+      ] });
+    case "despawn":
+      return /* @__PURE__ */ jsxs("g", { children: [
+        /* @__PURE__ */ jsx("circle", { cx: x, cy: y, r: s, fill: "none", stroke: color, strokeWidth: 1.5 }),
+        /* @__PURE__ */ jsx("line", { x1: x - s * 0.5, y1: y, x2: x + s * 0.5, y2: y, stroke: color, strokeWidth: 1.5 })
+      ] });
+    case "do":
+      return /* @__PURE__ */ jsxs("g", { children: [
+        /* @__PURE__ */ jsx("circle", { cx: x, cy: y, r: s, fill: "none", stroke: color, strokeWidth: 1.5 }),
+        /* @__PURE__ */ jsx("polygon", { points: `${x - s * 0.3},${y - s * 0.5} ${x + s * 0.5},${y} ${x - s * 0.3},${y + s * 0.5}`, fill: color })
+      ] });
+    case "if":
+      return /* @__PURE__ */ jsx(
+        "polygon",
+        {
+          points: `${x},${y - s} ${x + s * 0.7},${y} ${x},${y + s} ${x - s * 0.7},${y}`,
+          fill: "none",
+          stroke: color,
+          strokeWidth: 1.5,
+          strokeLinejoin: "round"
+        }
+      );
+    case "log":
+      return /* @__PURE__ */ jsx(
+        "text",
+        {
+          x,
+          y,
+          textAnchor: "middle",
+          dominantBaseline: "central",
+          fill: color,
+          fontSize: s * 2.2,
+          fontFamily: "serif",
+          children: "\xB6"
+        }
+      );
+    default:
+      return null;
+  }
+}
+var clock = (x, y, s, color) => /* @__PURE__ */ jsxs("g", { children: [
+  /* @__PURE__ */ jsx("circle", { cx: x, cy: y, r: s, fill: "none", stroke: color, strokeWidth: 1.5 }),
+  /* @__PURE__ */ jsx("polyline", { points: `${x},${y - s * 0.6} ${x},${y} ${x + s * 0.5},${y + s * 0.3}`, fill: "none", stroke: color, strokeWidth: 1.5, strokeLinejoin: "round" })
+] });
+var neuron = (x, y, s, color) => /* @__PURE__ */ jsxs("g", { children: [
+  /* @__PURE__ */ jsx("line", { x1: x - s, y1: y - s * 0.6, x2: x + s * 0.8, y2: y, stroke: color, strokeWidth: 1 }),
+  /* @__PURE__ */ jsx("line", { x1: x - s, y1: y + s * 0.6, x2: x + s * 0.8, y2: y, stroke: color, strokeWidth: 1 }),
+  /* @__PURE__ */ jsx("circle", { cx: x - s, cy: y - s * 0.6, r: s * 0.3, fill: color }),
+  /* @__PURE__ */ jsx("circle", { cx: x - s, cy: y + s * 0.6, r: s * 0.3, fill: color }),
+  /* @__PURE__ */ jsx("circle", { cx: x + s * 0.8, cy: y, r: s * 0.35, fill: color })
+] });
+var gear = (x, y, s, color) => /* @__PURE__ */ jsxs("g", { children: [
+  /* @__PURE__ */ jsx("circle", { cx: x, cy: y, r: s * 0.75, fill: "none", stroke: color, strokeWidth: 1.5, strokeDasharray: `${s * 0.5} ${s * 0.3}` }),
+  /* @__PURE__ */ jsx("circle", { cx: x, cy: y, r: s * 0.3, fill: color })
+] });
+var unknown = (x, y, s, color) => /* @__PURE__ */ jsxs("g", { children: [
+  /* @__PURE__ */ jsx("circle", { cx: x, cy: y, r: s, fill: "none", stroke: color, strokeWidth: 1.2, strokeDasharray: "2 2" }),
+  /* @__PURE__ */ jsx("text", { x, y, textAnchor: "middle", dominantBaseline: "central", fill: color, fontSize: s * 1.4, children: "?" })
+] });
+var CATEGORY_GLYPH = {
+  ui: (x, y, s, c) => headIcon("render-ui", x, y, s, c),
+  data: (x, y, s, c) => headIcon("set", x, y, s, c),
+  communication: (x, y, s, c) => headIcon("emit", x, y, s, c),
+  lifecycle: (x, y, s, c) => headIcon("spawn", x, y, s, c),
+  control: (x, y, s, c) => headIcon("if", x, y, s, c),
+  async: clock,
+  compute: neuron,
+  system: gear
+};
+function effectIcon(type, x, y, s, color) {
+  const op = asEffectOperator(type);
+  const own = op ? headIcon(op, x, y, s, color) : null;
+  if (own) return own;
+  const category = effectCategoryOf(type);
+  if (category) return CATEGORY_GLYPH[category](x, y, s, color);
+  log.error("unknown-effect-operator", { effectType: type });
+  return unknown(x, y, s, color);
+}
+var AvlEffect = ({
+  x = 0,
+  y = 0,
+  effectType,
+  size = 8,
+  label,
+  color = "var(--color-primary)",
+  opacity = 1,
+  className,
+  showBackground = false
+}) => {
+  const category = effectCategoryOf(effectType);
+  const catColors = category ? EFFECT_CATEGORY_COLORS[category] : null;
+  const iconColor = showBackground && catColors ? catColors.color : color;
+  return /* @__PURE__ */ jsxs("g", { className, opacity, children: [
+    showBackground && catColors && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("circle", { cx: x, cy: y, r: size * 1.2, fill: catColors.bg }),
+      /* @__PURE__ */ jsx("circle", { cx: x, cy: y, r: size * 1.2, fill: "none", stroke: catColors.color, strokeWidth: 0.5, opacity: 0.3 })
+    ] }),
+    effectIcon(effectType, x, y, size, iconColor),
+    label && /* @__PURE__ */ jsx(
+      "text",
+      {
+        x,
+        y: y + size + 10,
+        textAnchor: "middle",
+        fill: iconColor,
+        fontSize: 11,
+        fontWeight: 500,
+        fontFamily: "inherit",
+        opacity: 0.7,
+        children: label
+      }
+    )
+  ] });
+};
+AvlEffect.displayName = "AvlEffect";
+
+export { AvlEffect };

package/dist/chunk-E6KA4J6N.js

@@ -0,0 +1,227 @@
+import { AvlState, AvlEntity, AvlFieldType, AvlPage } from './chunk-HH5KSMH5.js';
+import { AvlExplain, useEffectLines } from './chunk-AB3X7QTE.js';
+import { AvlEffect } from './chunk-DZBQA2OW.js';
+import { getStateRole, CONNECTION_COLORS } from './chunk-UXLE3IPR.js';
+import { useTranslate, Box, cn, domPassthrough } from './chunk-4YXBKHHM.js';
+import { useNodeId, ReactFlowProvider, Handle, Position } from '@xyflow/react';
+import React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var hitStyle = (b) => ({ position: "absolute", left: b.left, top: b.top, width: b.width, height: b.height });
+var HIT_CLASS = "rounded-full cursor-help focus:outline-none focus-visible:ring-2 focus-visible:ring-ring";
+var EffectHit = ({ effectType, box, note }) => {
+  const lines = useEffectLines(effectType);
+  return /* @__PURE__ */ jsx(AvlExplain, { lines, note, children: /* @__PURE__ */ jsx(Box, { as: "span", role: "img", tabIndex: 0, "aria-label": effectType, className: HIT_CLASS, style: hitStyle(box) }) });
+};
+var NODE_W = 24;
+var NODE_H = 16;
+var GAP = 8;
+var ARROW_W = 16;
+var INITIAL_MARGIN = 24;
+var TERMINAL_OUTSET = 4;
+var EFFECT_SIZE = 5;
+var EFFECT_R = EFFECT_SIZE * 1.2;
+var EFFECT_GAP = 4;
+var ROW_GAP = 6;
+var EDGE = 2;
+var MiniStateMachine = ({ data, annotations, className }) => {
+  const { t } = useTranslate();
+  const states = data.states;
+  if (states.length === 0) return null;
+  const transitionCounts = {};
+  for (const s of states) transitionCounts[s.name] = 0;
+  for (const t2 of data.transitions) {
+    transitionCounts[t2.from] = (transitionCounts[t2.from] ?? 0) + 1;
+    transitionCounts[t2.to] = (transitionCounts[t2.to] ?? 0) + 1;
+  }
+  const maxTC = Math.max(...Object.values(transitionCounts), 0);
+  const effectTypes = /* @__PURE__ */ new Set();
+  for (const t2 of data.transitions) {
+    for (const e of t2.effects) effectTypes.add(e.type);
+  }
+  const effectList = Array.from(effectTypes).slice(0, 6);
+  const stateStep = NODE_W + GAP + ARROW_W + GAP;
+  const rowTop = TERMINAL_OUTSET + EDGE;
+  const statesRight = INITIAL_MARGIN + (states.length - 1) * stateStep + NODE_W + TERMINAL_OUTSET;
+  const effectTop = rowTop + NODE_H + TERMINAL_OUTSET + ROW_GAP;
+  const effectCy = effectTop + EFFECT_R;
+  const effectStep = EFFECT_R * 2 + EFFECT_GAP;
+  const effectsRight = EDGE + effectList.length * effectStep - EFFECT_GAP;
+  const svgW = Math.max(statesRight, effectsRight) + EDGE;
+  const svgH = (effectList.length > 0 ? effectTop + EFFECT_R * 2 : rowTop + NODE_H + TERMINAL_OUTSET) + EDGE;
+  return /* @__PURE__ */ jsxs(Box, { className: cn("relative inline-block", className), style: { width: svgW, height: svgH }, children: [
+    /* @__PURE__ */ jsxs("svg", { width: svgW, height: svgH, viewBox: `0 0 ${svgW} ${svgH}`, "aria-hidden": "true", children: [
+      states.map((s, i) => {
+        const x = INITIAL_MARGIN + i * stateStep;
+        const tc = transitionCounts[s.name] ?? 0;
+        const role = getStateRole(s.isInitial ?? void 0, s.isTerminal ?? void 0, tc, maxTC);
+        return /* @__PURE__ */ jsxs(React.Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            AvlState,
+            {
+              x,
+              y: rowTop,
+              width: NODE_W,
+              height: NODE_H,
+              name: "",
+              role,
+              isInitial: s.isInitial ?? void 0,
+              isTerminal: s.isTerminal ?? void 0
+            }
+          ),
+          i < states.length - 1 && /* @__PURE__ */ jsxs("g", { children: [
+            /* @__PURE__ */ jsx(
+              "line",
+              {
+                x1: x + NODE_W + GAP,
+                y1: rowTop + NODE_H / 2,
+                x2: x + NODE_W + GAP + ARROW_W - 3,
+                y2: rowTop + NODE_H / 2,
+                stroke: "var(--color-muted-foreground)",
+                strokeWidth: 1,
+                opacity: 0.4
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "polygon",
+              {
+                points: `${x + NODE_W + GAP + ARROW_W - 3},${rowTop + NODE_H / 2 - 2.5} ${x + NODE_W + GAP + ARROW_W},${rowTop + NODE_H / 2} ${x + NODE_W + GAP + ARROW_W - 3},${rowTop + NODE_H / 2 + 2.5}`,
+                fill: "var(--color-muted-foreground)",
+                opacity: 0.4
+              }
+            )
+          ] })
+        ] }, s.name);
+      }),
+      effectList.length > 0 && /* @__PURE__ */ jsx("g", { children: effectList.map((et, i) => /* @__PURE__ */ jsx("g", { "data-testid": "mini-sm-effect", children: /* @__PURE__ */ jsx(
+        AvlEffect,
+        {
+          x: EDGE + EFFECT_R + i * effectStep,
+          y: effectCy,
+          effectType: et,
+          size: EFFECT_SIZE,
+          showBackground: true
+        }
+      ) }, et)) })
+    ] }),
+    states.map((s, i) => {
+      const marks = [...s.isInitial ? [t("avl.stateInitial")] : [], ...s.isTerminal ? [t("avl.stateTerminal")] : []];
+      return /* @__PURE__ */ jsx(AvlExplain, { lines: marks.length > 0 ? [s.name, marks.join(" \xB7 ")] : [s.name], note: annotations?.states?.[s.name], children: /* @__PURE__ */ jsx(
+        Box,
+        {
+          as: "span",
+          role: "img",
+          tabIndex: 0,
+          "aria-label": s.name,
+          className: HIT_CLASS,
+          style: hitStyle({ left: INITIAL_MARGIN + i * stateStep, top: rowTop, width: NODE_W, height: NODE_H })
+        }
+      ) }, `hit-${s.name}`);
+    }),
+    effectList.map((et, i) => /* @__PURE__ */ jsx(
+      EffectHit,
+      {
+        effectType: et,
+        note: annotations?.effects?.[et],
+        box: { left: EDGE + i * effectStep, top: effectTop, width: EFFECT_R * 2, height: EFFECT_R * 2 }
+      },
+      `hit-${et}`
+    ))
+  ] });
+};
+MiniStateMachine.displayName = "MiniStateMachine";
+function toFieldKind(type) {
+  const normalized = type.toLowerCase();
+  if (["string", "number", "boolean", "date", "enum", "object", "array"].includes(normalized)) {
+    return normalized;
+  }
+  return "string";
+}
+var PERSISTENCE_BORDER = {
+  persistent: "border-l-[3px] border-l-primary border-solid",
+  runtime: "border-l-[3px] border-l-primary border-dashed",
+  singleton: "border-l-[3px] border-l-primary border-double",
+  instance: "border-l-[3px] border-l-primary border-dotted"
+};
+var PERSISTENCE_ICON = {
+  persistent: "\u26C1",
+  // ⛁ cylinder
+  runtime: "\u27F3",
+  // ⟳ cycle
+  singleton: "\u25CE",
+  // ◎ double ring
+  instance: "\u22A1"
+  // ⊡ box
+};
+var ModuleCardInner = ({ data, annotations, ...rest }) => {
+  const {
+    orbitalName,
+    entityName,
+    persistence,
+    fields,
+    traits,
+    pages,
+    traitDetails,
+    externalLinks
+  } = data;
+  const cols = Math.min(3, Math.max(2, Math.ceil(fields.length / 3)));
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...domPassthrough(rest),
+      className: "rounded-lg border border-[var(--color-border)] bg-[var(--color-card)] shadow-sm overflow-hidden",
+      style: { minWidth: 280, maxWidth: 400 },
+      children: [
+        /* @__PURE__ */ jsx(Handle, { type: "target", position: Position.Left, className: "!w-2.5 !h-2.5 !bg-warning" }),
+        /* @__PURE__ */ jsx(Handle, { type: "source", position: Position.Right, className: "!w-2.5 !h-2.5 !bg-warning" }),
+        /* @__PURE__ */ jsx("div", { className: "px-3 py-2 border-b border-[var(--color-border)]", children: /* @__PURE__ */ jsx("span", { className: "text-base font-bold text-[var(--color-foreground)]", children: orbitalName }) }),
+        /* @__PURE__ */ jsxs("div", { className: `px-3 py-2 border-b border-[var(--color-border)] ${PERSISTENCE_BORDER[persistence] ?? ""}`, children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 mb-1.5", children: [
+            /* @__PURE__ */ jsx("svg", { width: 18, height: 18, viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx(AvlEntity, { x: 10, y: 10, r: 8, persistence }) }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-[var(--color-foreground)]", children: entityName }),
+            /* @__PURE__ */ jsx("span", { className: "ml-auto text-xs opacity-50", title: persistence, children: PERSISTENCE_ICON[persistence] ?? "" })
+          ] }),
+          fields.length > 0 && /* @__PURE__ */ jsx("div", { className: `grid gap-x-3 gap-y-0.5`, style: { gridTemplateColumns: `repeat(${cols}, 1fr)` }, children: fields.map((f) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+            /* @__PURE__ */ jsx(AvlExplain, { lines: [f.name, f.type], children: /* @__PURE__ */ jsx(Box, { as: "span", role: "img", tabIndex: 0, "aria-label": `${f.name}: ${f.type}`, className: "inline-flex cursor-help rounded-full focus:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: /* @__PURE__ */ jsx("svg", { width: 14, height: 14, viewBox: "0 0 16 16", "aria-hidden": "true", children: /* @__PURE__ */ jsx(AvlFieldType, { x: 8, y: 8, kind: toFieldKind(f.type), size: 6 }) }) }) }),
+            /* @__PURE__ */ jsx("span", { className: "text-xs text-[var(--color-muted-foreground)] truncate", children: f.name })
+          ] }, f.name)) })
+        ] }),
+        traits.map((trait) => {
+          const detail = traitDetails[trait.name];
+          const traitEmits = externalLinks.filter((l) => l.direction === "out" && l.traitName === trait.name);
+          const traitListens = externalLinks.filter((l) => l.direction === "in" && l.traitName === trait.name);
+          return /* @__PURE__ */ jsxs("div", { className: "px-3 py-2 border-b border-[var(--color-border)]", children: [
+            /* @__PURE__ */ jsx("div", { className: "text-xs font-semibold text-[var(--color-foreground)] mb-1", children: trait.name }),
+            detail && /* @__PURE__ */ jsx(MiniStateMachine, { data: detail, annotations: annotations?.[trait.name], className: "mb-1" }),
+            (traitEmits.length > 0 || traitListens.length > 0) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-[9px] mt-1", children: [
+              traitListens.map((l) => /* @__PURE__ */ jsxs("span", { style: { color: CONNECTION_COLORS.emitListen.color }, children: [
+                "\u25C0~~",
+                " ",
+                l.eventName
+              ] }, l.eventName)),
+              traitListens.length > 0 && traitEmits.length > 0 && /* @__PURE__ */ jsx("span", { className: "flex-1" }),
+              traitEmits.map((l) => /* @__PURE__ */ jsxs("span", { style: { color: CONNECTION_COLORS.emitListen.color }, className: "ml-auto", children: [
+                l.eventName,
+                " ",
+                "~~\u25B6"
+              ] }, l.eventName))
+            ] })
+          ] }, trait.name);
+        }),
+        pages.length > 0 && /* @__PURE__ */ jsx("div", { className: "px-3 py-1.5 flex items-center gap-2 flex-wrap", children: pages.map((p) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-0.5", children: [
+          /* @__PURE__ */ jsx("svg", { width: 10, height: 10, viewBox: "0 0 12 12", children: /* @__PURE__ */ jsx(AvlPage, { x: 6, y: 6, size: 5 }) }),
+          /* @__PURE__ */ jsx("span", { className: "text-xs font-mono text-[var(--color-muted-foreground)]", children: p.route })
+        ] }, p.name)) })
+      ]
+    }
+  );
+};
+ModuleCardInner.displayName = "ModuleCardInner";
+var ModuleCard = (props) => {
+  const nodeId = useNodeId();
+  if (nodeId !== null) return /* @__PURE__ */ jsx(ModuleCardInner, { ...props });
+  return /* @__PURE__ */ jsx(ReactFlowProvider, { children: /* @__PURE__ */ jsx(ModuleCardInner, { ...props }) });
+};
+ModuleCard.displayName = "ModuleCard";
+
+export { MiniStateMachine, ModuleCard };

package/dist/chunk-EOWMARUB.js

@@ -0,0 +1,16 @@
+import { createContext, useContext } from 'react';
+
+var DEFAULT_CONFIG = {
+  modelOverrides: {},
+  effectsEnabled: true,
+  palette: null
+};
+var Avl3DContext = createContext(DEFAULT_CONFIG);
+function useAvl3DConfig() {
+  return useContext(Avl3DContext);
+}
+function useAvl3DPalette() {
+  return useContext(Avl3DContext).palette;
+}
+
+export { Avl3DContext, useAvl3DConfig, useAvl3DPalette };

package/dist/chunk-G7DCAZ22.js

@@ -0,0 +1,19 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+
+export { __export, __reExport };