@duckmind/dm-darwin-x64 0.33.4 → 0.33.5

package/extensions/dm-design-md/node_modules/@json-render/ink/dist/index.js

@@ -1,2918 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/index.ts
-var index_exports = {};
-__export(index_exports, {
-  ActionProvider: () => ActionProvider,
-  ConfirmDialog: () => ConfirmDialog,
-  FocusProvider: () => FocusProvider,
-  JSONUIProvider: () => JSONUIProvider,
-  Renderer: () => Renderer,
-  RepeatScopeProvider: () => RepeatScopeProvider,
-  StateProvider: () => StateProvider,
-  ValidationProvider: () => ValidationProvider,
-  VisibilityProvider: () => VisibilityProvider,
-  createRenderer: () => createRenderer,
-  createStateStore: () => import_core8.createStateStore,
-  defineRegistry: () => defineRegistry,
-  flatToTree: () => flatToTree,
-  schema: () => schema,
-  standardActionDefinitions: () => standardActionDefinitions,
-  standardComponentDefinitions: () => standardComponentDefinitions,
-  standardComponents: () => standardComponents,
-  useAction: () => useAction,
-  useActions: () => useActions,
-  useBoundProp: () => useBoundProp,
-  useFieldValidation: () => useFieldValidation,
-  useFocus: () => useFocus,
-  useFocusDisable: () => useFocusDisable,
-  useIsVisible: () => useIsVisible,
-  useOptionalValidation: () => useOptionalValidation,
-  useRepeatScope: () => useRepeatScope,
-  useStateBinding: () => useStateBinding,
-  useStateStore: () => useStateStore,
-  useStateValue: () => useStateValue,
-  useUIStream: () => useUIStream,
-  useValidation: () => useValidation,
-  useVisibility: () => useVisibility
-});
-module.exports = __toCommonJS(index_exports);
-
-// ../react-state/dist/index.mjs
-var import_react = require("react");
-var import_core = require("@json-render/core");
-var import_store_utils = require("@json-render/core/store-utils");
-var import_jsx_runtime = require("react/jsx-runtime");
-var StateContext = (0, import_react.createContext)(null);
-function computeInitialFlat(isControlled, initialState) {
-  if (isControlled) return null;
-  if (Object.keys(initialState).length === 0) return {};
-  return (0, import_store_utils.flattenToPointers)(initialState);
-}
-function StateProvider({
-  store: externalStore,
-  initialState = {},
-  onStateChange,
-  children
-}) {
-  const internalStoreRef = (0, import_react.useRef)(void 0);
-  if (!externalStore && !internalStoreRef.current) {
-    internalStoreRef.current = (0, import_core.createStateStore)(initialState);
-  }
-  const store = externalStore ?? internalStoreRef.current;
-  const storeRef = (0, import_react.useRef)(store);
-  storeRef.current = store;
-  const isControlledRef = (0, import_react.useRef)(!!externalStore);
-  isControlledRef.current = !!externalStore;
-  const initialModeRef = (0, import_react.useRef)(externalStore ? "controlled" : "uncontrolled");
-  const modeWarnedRef = (0, import_react.useRef)(false);
-  if (process.env.NODE_ENV !== "production") {
-    const currentMode = externalStore ? "controlled" : "uncontrolled";
-    if (currentMode !== initialModeRef.current && !modeWarnedRef.current) {
-      modeWarnedRef.current = true;
-      console.warn(
-        `StateProvider: switching from ${initialModeRef.current} to ${currentMode} mode is not supported.`
-      );
-    }
-  }
-  const prevInitialStateRef = (0, import_react.useRef)(initialState);
-  const prevFlatRef = (0, import_react.useRef)(
-    computeInitialFlat(!!externalStore, initialState)
-  );
-  (0, import_react.useEffect)(() => {
-    if (externalStore) return;
-    if (initialState === prevInitialStateRef.current) return;
-    prevInitialStateRef.current = initialState;
-    const nextFlat = initialState && Object.keys(initialState).length > 0 ? (0, import_store_utils.flattenToPointers)(initialState) : {};
-    const prevFlat = prevFlatRef.current ?? {};
-    const allKeys = /* @__PURE__ */ new Set([
-      ...Object.keys(prevFlat),
-      ...Object.keys(nextFlat)
-    ]);
-    const updates = {};
-    for (const key of allKeys) {
-      if (prevFlat[key] !== nextFlat[key]) {
-        updates[key] = key in nextFlat ? nextFlat[key] : void 0;
-      }
-    }
-    prevFlatRef.current = nextFlat;
-    if (Object.keys(updates).length > 0) {
-      store.update(updates);
-    }
-  }, [externalStore, initialState, store]);
-  const state = (0, import_react.useSyncExternalStore)(
-    store.subscribe,
-    store.getSnapshot,
-    store.getServerSnapshot ?? store.getSnapshot
-  );
-  const onStateChangeRef = (0, import_react.useRef)(onStateChange);
-  onStateChangeRef.current = onStateChange;
-  const set = (0, import_react.useCallback)((path, value2) => {
-    const s = storeRef.current;
-    const prev = s.getSnapshot();
-    s.set(path, value2);
-    if (!isControlledRef.current && s.getSnapshot() !== prev) {
-      onStateChangeRef.current?.([{ path, value: value2 }]);
-    }
-  }, []);
-  const update = (0, import_react.useCallback)((updates) => {
-    const s = storeRef.current;
-    const prev = s.getSnapshot();
-    s.update(updates);
-    if (!isControlledRef.current && s.getSnapshot() !== prev) {
-      const changes = [];
-      for (const [path, value2] of Object.entries(updates)) {
-        if ((0, import_core.getByPath)(prev, path) !== value2) {
-          changes.push({ path, value: value2 });
-        }
-      }
-      if (changes.length > 0) {
-        onStateChangeRef.current?.(changes);
-      }
-    }
-  }, []);
-  const get = (0, import_react.useCallback)((path) => storeRef.current.get(path), []);
-  const getSnapshot = (0, import_react.useCallback)(() => storeRef.current.getSnapshot(), []);
-  const value = (0, import_react.useMemo)(
-    () => ({ state, get, set, update, getSnapshot }),
-    [state, get, set, update, getSnapshot]
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StateContext.Provider, { value, children });
-}
-function useStateStore() {
-  const ctx = (0, import_react.useContext)(StateContext);
-  if (!ctx) {
-    throw new Error("useStateStore must be used within a StateProvider");
-  }
-  return ctx;
-}
-function useStateValue(path) {
-  const { state } = useStateStore();
-  return (0, import_core.getByPath)(state, path);
-}
-function useStateBinding(path) {
-  const { state, set } = useStateStore();
-  const value = (0, import_core.getByPath)(state, path);
-  const setValue = (0, import_react.useCallback)(
-    (newValue) => set(path, newValue),
-    [path, set]
-  );
-  return [value, setValue];
-}
-
-// src/contexts/visibility.tsx
-var import_react2 = require("react");
-var import_core2 = require("@json-render/core");
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var VisibilityContext = (0, import_react2.createContext)(null);
-function VisibilityProvider({ children }) {
-  const { state } = useStateStore();
-  const ctx = (0, import_react2.useMemo)(
-    () => ({
-      stateModel: state
-    }),
-    [state]
-  );
-  const isVisible = (0, import_react2.useMemo)(
-    () => (condition) => (0, import_core2.evaluateVisibility)(condition, ctx),
-    [ctx]
-  );
-  const value = (0, import_react2.useMemo)(
-    () => ({ isVisible, ctx }),
-    [isVisible, ctx]
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(VisibilityContext.Provider, { value, children });
-}
-function useVisibility() {
-  const ctx = (0, import_react2.useContext)(VisibilityContext);
-  if (!ctx) {
-    throw new Error("useVisibility must be used within a VisibilityProvider");
-  }
-  return ctx;
-}
-function useIsVisible(condition) {
-  const { isVisible } = useVisibility();
-  return isVisible(condition);
-}
-
-// src/contexts/actions.tsx
-var import_react4 = require("react");
-var import_ink2 = require("ink");
-var import_core3 = require("@json-render/core");
-
-// src/contexts/focus.tsx
-var import_react3 = require("react");
-var import_ink = require("ink");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var FocusContext = (0, import_react3.createContext)(null);
-function focusReducer(state, action) {
-  switch (action.type) {
-    case "register": {
-      if (state.ids.includes(action.id)) return state;
-      const ids = [...state.ids, action.id];
-      const focusedId = state.focusedId ?? action.id;
-      return { ids, focusedId };
-    }
-    case "unregister": {
-      const ids = state.ids.filter((x) => x !== action.id);
-      let focusedId = state.focusedId;
-      if (focusedId === action.id) {
-        focusedId = ids[0] ?? null;
-      }
-      return { ids, focusedId };
-    }
-    case "cycle": {
-      const { ids, focusedId } = state;
-      if (ids.length === 0) return { ...state, focusedId: null };
-      const idx = focusedId ? ids.indexOf(focusedId) : -1;
-      const next = action.direction === "next" ? ids[(idx + 1) % ids.length] : ids[(idx - 1 + ids.length) % ids.length];
-      return { ...state, focusedId: next };
-    }
-  }
-}
-function FocusProvider({ children }) {
-  const [state, dispatch] = (0, import_react3.useReducer)(focusReducer, {
-    ids: [],
-    focusedId: null
-  });
-  const [disableCount, setDisableCount] = (0, import_react3.useState)(0);
-  const disabled = disableCount > 0;
-  const setDisabled = (0, import_react3.useCallback)((value2) => {
-    setDisableCount((prev) => value2 ? prev + 1 : Math.max(0, prev - 1));
-  }, []);
-  const register = (0, import_react3.useCallback)(
-    (id) => dispatch({ type: "register", id }),
-    []
-  );
-  const unregister = (0, import_react3.useCallback)(
-    (id) => dispatch({ type: "unregister", id }),
-    []
-  );
-  const isFocused = (0, import_react3.useCallback)(
-    (id) => !disabled && state.focusedId === id,
-    [state.focusedId, disabled]
-  );
-  (0, import_ink.useInput)((_input, key) => {
-    if (disabled) return;
-    if (!key.tab) return;
-    dispatch({ type: "cycle", direction: key.shift ? "prev" : "next" });
-  });
-  const value = (0, import_react3.useMemo)(
-    () => ({
-      register,
-      unregister,
-      focusedId: state.focusedId,
-      isFocused,
-      setDisabled
-    }),
-    [register, unregister, state.focusedId, isFocused, setDisabled]
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(FocusContext.Provider, { value, children });
-}
-function useFocus() {
-  const ctx = (0, import_react3.useContext)(FocusContext);
-  const id = (0, import_react3.useId)();
-  (0, import_react3.useEffect)(() => {
-    ctx?.register(id);
-    return () => {
-      ctx?.unregister(id);
-    };
-  }, [ctx, id]);
-  const isActive = ctx?.isFocused(id) ?? false;
-  return { isActive, id };
-}
-function useFocusDisable(disabled) {
-  const ctx = (0, import_react3.useContext)(FocusContext);
-  (0, import_react3.useEffect)(() => {
-    if (!disabled) return;
-    ctx?.setDisabled(true);
-    return () => {
-      ctx?.setDisabled(false);
-    };
-  }, [ctx, disabled]);
-}
-
-// src/contexts/actions.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
-function generateUniqueId() {
-  if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
-    return crypto.randomUUID();
-  }
-  return `${Date.now()}-${Math.random().toString(36).slice(2)}`;
-}
-var MAX_RESOLVE_DEPTH = 10;
-function deepResolveValue(value, get, depth = 0) {
-  if (depth > MAX_RESOLVE_DEPTH) return value;
-  if (value === null || value === void 0) return value;
-  if (value === "$id") {
-    return generateUniqueId();
-  }
-  if (typeof value === "object" && !Array.isArray(value)) {
-    const obj = value;
-    const keys = Object.keys(obj);
-    if (keys.length === 1 && typeof obj.$state === "string") {
-      return get(obj.$state);
-    }
-    if (keys.length === 1 && "$id" in obj) {
-      return generateUniqueId();
-    }
-    const resolved = {};
-    for (const [key, val] of Object.entries(obj)) {
-      resolved[key] = deepResolveValue(val, get, depth + 1);
-    }
-    return resolved;
-  }
-  if (Array.isArray(value)) {
-    return value.map((item) => deepResolveValue(item, get, depth + 1));
-  }
-  return value;
-}
-var ActionContext = (0, import_react4.createContext)(null);
-function ActionProvider({
-  handlers: initialHandlers = {},
-  navigate,
-  children
-}) {
-  const { get, set, getSnapshot } = useStateStore();
-  const initialHandlersRef = (0, import_react4.useRef)(initialHandlers);
-  initialHandlersRef.current = initialHandlers;
-  const navigateRef = (0, import_react4.useRef)(navigate);
-  navigateRef.current = navigate;
-  const [loadingActions, setLoadingActions] = (0, import_react4.useState)(
-    /* @__PURE__ */ new Map()
-  );
-  const [pendingConfirmation, setPendingConfirmation] = (0, import_react4.useState)(null);
-  const pendingRef = (0, import_react4.useRef)(null);
-  const lookupHandler = (0, import_react4.useCallback)(
-    (name) => initialHandlersRef.current[name],
-    []
-  );
-  const execute = (0, import_react4.useCallback)(
-    async (binding) => {
-      const resolved = (0, import_core3.resolveAction)(binding, getSnapshot());
-      const customHandler = lookupHandler(resolved.action);
-      if (resolved.action === "setState" && !customHandler && resolved.params) {
-        const statePath = resolved.params.statePath;
-        const value2 = resolved.params.value;
-        if (statePath) {
-          set(statePath, value2);
-        }
-        return;
-      }
-      if (resolved.action === "pushState" && !customHandler && resolved.params) {
-        const statePath = resolved.params.statePath;
-        const rawValue = resolved.params.value;
-        if (statePath) {
-          const resolvedValue = deepResolveValue(rawValue, get);
-          const raw = get(statePath);
-          const arr = Array.isArray(raw) ? raw : [];
-          set(statePath, [...arr, resolvedValue]);
-          const clearStatePath = resolved.params.clearStatePath;
-          if (clearStatePath) {
-            set(clearStatePath, "");
-          }
-        }
-        return;
-      }
-      if (resolved.action === "removeState" && !customHandler && resolved.params) {
-        const statePath = resolved.params.statePath;
-        const index = resolved.params.index;
-        if (statePath !== void 0 && index !== void 0) {
-          const raw = get(statePath);
-          if (!Array.isArray(raw)) return;
-          set(
-            statePath,
-            raw.filter((_, i) => i !== index)
-          );
-        }
-        return;
-      }
-      if (resolved.action === "log" && !customHandler) {
-        const message = resolved.params?.message ?? resolved.params?.value ?? "";
-        console.log("[json-render]", message);
-        return;
-      }
-      if (resolved.action === "exit" && !customHandler) {
-        return;
-      }
-      const handler = customHandler;
-      if (!handler) {
-        console.warn(
-          `[json-render] No handler registered for action: ${resolved.action}`
-        );
-        return;
-      }
-      if (resolved.confirm) {
-        pendingRef.current?.reject();
-        const confirmed = await new Promise((res) => {
-          const entry = {
-            action: resolved,
-            handler,
-            resolve: () => {
-              pendingRef.current = null;
-              setPendingConfirmation(null);
-              res(true);
-            },
-            reject: () => {
-              pendingRef.current = null;
-              setPendingConfirmation(null);
-              res(false);
-            }
-          };
-          pendingRef.current = entry;
-          setPendingConfirmation(entry);
-        });
-        if (!confirmed) return;
-      }
-      const actionName = resolved.action;
-      setLoadingActions((prev) => {
-        const next = new Map(prev);
-        next.set(actionName, (next.get(actionName) ?? 0) + 1);
-        return next;
-      });
-      try {
-        await (0, import_core3.executeAction)({
-          action: resolved,
-          handler,
-          setState: set,
-          navigate: navigateRef.current,
-          executeAction: async (name) => {
-            const subBinding = { action: name };
-            await execute(subBinding);
-          }
-        });
-      } finally {
-        setLoadingActions((prev) => {
-          const next = new Map(prev);
-          const count = (next.get(actionName) ?? 1) - 1;
-          if (count <= 0) {
-            next.delete(actionName);
-          } else {
-            next.set(actionName, count);
-          }
-          return next;
-        });
-      }
-    },
-    [lookupHandler, get, set, getSnapshot]
-  );
-  const confirm = (0, import_react4.useCallback)(() => {
-    pendingRef.current?.resolve();
-  }, []);
-  const cancel = (0, import_react4.useCallback)(() => {
-    pendingRef.current?.reject();
-  }, []);
-  const value = (0, import_react4.useMemo)(
-    () => ({
-      handlers: initialHandlers,
-      loadingActions,
-      pendingConfirmation,
-      execute,
-      confirm,
-      cancel
-    }),
-    [
-      initialHandlers,
-      loadingActions,
-      pendingConfirmation,
-      execute,
-      confirm,
-      cancel
-    ]
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ActionContext.Provider, { value, children });
-}
-function useActions() {
-  const ctx = (0, import_react4.useContext)(ActionContext);
-  if (!ctx) {
-    throw new Error("useActions must be used within an ActionProvider");
-  }
-  return ctx;
-}
-function useAction(binding) {
-  const { execute, loadingActions } = useActions();
-  const executeAction2 = (0, import_react4.useCallback)(() => execute(binding), [execute, binding]);
-  const isLoading = (loadingActions.get(binding.action) ?? 0) > 0;
-  return { execute: executeAction2, isLoading };
-}
-function ConfirmDialog({
-  confirm,
-  onConfirm,
-  onCancel
-}) {
-  const isDanger = confirm.variant === "danger";
-  useFocusDisable(true);
-  (0, import_ink2.useInput)((input, key) => {
-    if (input.toLowerCase() === "y") {
-      onConfirm();
-    } else if (input.toLowerCase() === "n" || key.escape) {
-      onCancel();
-    }
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-    import_ink2.Box,
-    {
-      flexDirection: "column",
-      borderStyle: "round",
-      borderColor: isDanger ? "red" : "blue",
-      paddingX: 2,
-      paddingY: 1,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_ink2.Text, { bold: true, children: confirm.title }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_ink2.Text, { dimColor: true, children: confirm.message }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_ink2.Box, { marginTop: 1, gap: 2, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_ink2.Text, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_ink2.Text, { color: isDanger ? "red" : "green", bold: true, children: "[Y]" }),
-            " ",
-            confirm.confirmLabel ?? "Confirm"
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_ink2.Text, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_ink2.Text, { bold: true, children: "[N]" }),
-            " ",
-            confirm.cancelLabel ?? "Cancel"
-          ] })
-        ] })
-      ]
-    }
-  );
-}
-
-// src/contexts/validation.tsx
-var import_react5 = require("react");
-var import_core4 = require("@json-render/core");
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var ValidationContext = (0, import_react5.createContext)(null);
-function dynamicArgsEqual(a, b) {
-  if (a === b) return true;
-  if (!a || !b) return false;
-  const keysA = Object.keys(a);
-  const keysB = Object.keys(b);
-  if (keysA.length !== keysB.length) return false;
-  for (const key of keysA) {
-    const va = a[key];
-    const vb = b[key];
-    if (va === vb) continue;
-    if (typeof va === "object" && va !== null && typeof vb === "object" && vb !== null) {
-      const sa = va.$state;
-      const sb = vb.$state;
-      if (typeof sa === "string" && sa === sb) continue;
-    }
-    return false;
-  }
-  return true;
-}
-function validationConfigEqual(a, b) {
-  if (a === b) return true;
-  if (a.validateOn !== b.validateOn) return false;
-  const ac = a.checks ?? [];
-  const bc = b.checks ?? [];
-  if (ac.length !== bc.length) return false;
-  for (let i = 0; i < ac.length; i++) {
-    const ca = ac[i];
-    const cb = bc[i];
-    if (ca.type !== cb.type) return false;
-    if (ca.message !== cb.message) return false;
-    if (!dynamicArgsEqual(ca.args, cb.args)) return false;
-  }
-  return true;
-}
-function ValidationProvider({
-  customFunctions = {},
-  children
-}) {
-  const { getSnapshot } = useStateStore();
-  const [fieldStates, setFieldStates] = (0, import_react5.useState)({});
-  const [fieldConfigs, setFieldConfigs] = (0, import_react5.useState)({});
-  const registerField = (0, import_react5.useCallback)(
-    (path, config) => {
-      setFieldConfigs((prev) => {
-        const existing = prev[path];
-        if (existing && validationConfigEqual(existing, config)) {
-          return prev;
-        }
-        return { ...prev, [path]: config };
-      });
-    },
-    []
-  );
-  const unregisterField = (0, import_react5.useCallback)((path) => {
-    setFieldConfigs((prev) => {
-      const { [path]: _, ...rest } = prev;
-      return rest;
-    });
-    setFieldStates((prev) => {
-      const { [path]: _, ...rest } = prev;
-      return rest;
-    });
-  }, []);
-  const validate = (0, import_react5.useCallback)(
-    (path, config) => {
-      const currentState = getSnapshot();
-      const segments = path.split("/").filter(Boolean);
-      let value2 = currentState;
-      for (const seg of segments) {
-        if (value2 != null && typeof value2 === "object") {
-          value2 = value2[seg];
-        } else {
-          value2 = void 0;
-          break;
-        }
-      }
-      const result = (0, import_core4.runValidation)(config, {
-        value: value2,
-        stateModel: currentState,
-        customFunctions
-      });
-      setFieldStates((prev) => ({
-        ...prev,
-        [path]: {
-          touched: prev[path]?.touched ?? true,
-          validated: true,
-          result
-        }
-      }));
-      return result;
-    },
-    [getSnapshot, customFunctions]
-  );
-  const touch = (0, import_react5.useCallback)((path) => {
-    setFieldStates((prev) => ({
-      ...prev,
-      [path]: {
-        ...prev[path],
-        touched: true,
-        validated: prev[path]?.validated ?? false,
-        result: prev[path]?.result ?? null
-      }
-    }));
-  }, []);
-  const clear = (0, import_react5.useCallback)((path) => {
-    setFieldStates((prev) => {
-      const { [path]: _, ...rest } = prev;
-      return rest;
-    });
-  }, []);
-  const validateAll = (0, import_react5.useCallback)(() => {
-    let allValid = true;
-    for (const [path, config] of Object.entries(fieldConfigs)) {
-      const result = validate(path, config);
-      if (!result.valid) {
-        allValid = false;
-      }
-    }
-    return allValid;
-  }, [fieldConfigs, validate]);
-  const value = (0, import_react5.useMemo)(
-    () => ({
-      customFunctions,
-      fieldStates,
-      validate,
-      touch,
-      clear,
-      validateAll,
-      registerField,
-      unregisterField
-    }),
-    [
-      customFunctions,
-      fieldStates,
-      validate,
-      touch,
-      clear,
-      validateAll,
-      registerField,
-      unregisterField
-    ]
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ValidationContext.Provider, { value, children });
-}
-function useValidation() {
-  const ctx = (0, import_react5.useContext)(ValidationContext);
-  if (!ctx) {
-    throw new Error("useValidation must be used within a ValidationProvider");
-  }
-  return ctx;
-}
-function useOptionalValidation() {
-  return (0, import_react5.useContext)(ValidationContext);
-}
-function useFieldValidation(path, config) {
-  const {
-    fieldStates,
-    validate: validateField,
-    touch: touchField,
-    clear: clearField,
-    registerField,
-    unregisterField
-  } = useValidation();
-  (0, import_react5.useEffect)(() => {
-    if (config) {
-      registerField(path, config);
-    }
-  }, [path, config, registerField]);
-  (0, import_react5.useEffect)(() => {
-    return () => {
-      unregisterField(path);
-    };
-  }, [path]);
-  const state = fieldStates[path] ?? {
-    touched: false,
-    validated: false,
-    result: null
-  };
-  const validate = (0, import_react5.useCallback)(
-    () => validateField(path, config ?? { checks: [] }),
-    [path, config, validateField]
-  );
-  const touch = (0, import_react5.useCallback)(() => touchField(path), [path, touchField]);
-  const clear = (0, import_react5.useCallback)(() => clearField(path), [path, clearField]);
-  return {
-    state,
-    validate,
-    touch,
-    clear,
-    errors: state.result?.errors ?? [],
-    isValid: state.result?.valid ?? true
-  };
-}
-
-// src/contexts/repeat-scope.tsx
-var import_react6 = require("react");
-var import_jsx_runtime6 = require("react/jsx-runtime");
-var RepeatScopeContext = (0, import_react6.createContext)(null);
-function RepeatScopeProvider({
-  item,
-  index,
-  basePath,
-  children
-}) {
-  const value = (0, import_react6.useMemo)(
-    () => ({ item, index, basePath }),
-    [item, index, basePath]
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(RepeatScopeContext.Provider, { value, children });
-}
-function useRepeatScope() {
-  return (0, import_react6.useContext)(RepeatScopeContext);
-}
-
-// src/schema.ts
-var import_core5 = require("@json-render/core");
-var schema = (0, import_core5.defineSchema)(
-  (s) => ({
-    // What the AI-generated SPEC looks like
-    spec: s.object({
-      /** Root element key */
-      root: s.string(),
-      /** Flat map of elements by key */
-      elements: s.record(
-        s.object({
-          /** Component type from catalog */
-          type: s.ref("catalog.components"),
-          /** Component props */
-          props: s.propsOf("catalog.components"),
-          /** Child element keys (flat reference) */
-          children: s.array(s.string()),
-          /** Visibility condition */
-          visible: s.any()
-        })
-      )
-    }),
-    // What the CATALOG must provide
-    catalog: s.object({
-      /** Component definitions */
-      components: s.map({
-        /** Zod schema for component props */
-        props: s.zod(),
-        /** Slots for this component. Use ['default'] for children, or named slots like ['header', 'footer'] */
-        slots: s.array(s.string()),
-        /** Description for AI generation hints */
-        description: s.string(),
-        /** Example prop values used in prompt examples (auto-generated from Zod schema if omitted) */
-        example: s.any()
-      }),
-      /** Action definitions (optional) */
-      actions: s.map({
-        /** Zod schema for action params */
-        params: s.zod(),
-        /** Description for AI generation hints */
-        description: s.string()
-      })
-    })
-  }),
-  {
-    builtInActions: [
-      {
-        name: "setState",
-        description: "Update a value in the state model at the given statePath. Params: { statePath: string, value: any }"
-      },
-      {
-        name: "pushState",
-        description: 'Append an item to an array in state. Params: { statePath: string, value: any, clearStatePath?: string }. Value can contain {"$state":"/path"} refs and "$id" for auto IDs.'
-      },
-      {
-        name: "removeState",
-        description: "Remove an item from an array in state by index. Params: { statePath: string, index: number }"
-      }
-    ],
-    defaultRules: [
-      // Element integrity
-      "CRITICAL INTEGRITY CHECK: Before outputting ANY element that references children, you MUST have already output (or will output) each child as its own element. If an element has children: ['a', 'b'], then elements 'a' and 'b' MUST exist. A missing child element causes that entire branch of the UI to be invisible.",
-      "SELF-CHECK: After generating all elements, mentally walk the tree from root. Every key in every children array must resolve to a defined element. If you find a gap, output the missing element immediately.",
-      // Field placement
-      'CRITICAL: The "visible" field goes on the ELEMENT object, NOT inside "props". Correct: {"type":"<ComponentName>","props":{},"visible":{"$state":"/tab","eq":"home"},"children":[...]}.',
-      'CRITICAL: The "on" field goes on the ELEMENT object, NOT inside "props". Use on.press, on.change, on.submit etc. NEVER put action/actionParams inside props.',
-      // State and data
-      "When the user asks for a UI that displays data (e.g. logs, tasks, metrics), ALWAYS include a state field with realistic sample data. The state field is a top-level field on the spec (sibling of root/elements).",
-      'When building repeating content backed by a state array, use the "repeat" field on a container element. Example: { "type": "Box", "props": { "flexDirection": "column" }, "repeat": { "statePath": "/items", "key": "id" }, "children": ["item-row"] }. Inside repeated children, use { "$item": "field" } to read a field from the current item, and { "$index": true } for the current array index.',
-      // Terminal UI design
-      "This UI renders in a terminal using Ink. Use Box for layout (flexDirection, padding, gap), Text for text content. Keep designs compact and readable in monospace.",
-      "Terminal UIs have limited width (~80-120 columns). Prefer vertical layouts (flexDirection: column) for main structure. Use horizontal layouts (flexDirection: row) for inline elements like badges, key-value pairs, and table rows.",
-      "Use borderStyle on Box for visual grouping (single, double, round, bold). Use padding sparingly \u2014 1 unit is usually enough.",
-      "For color, use named terminal colors: red, green, yellow, blue, magenta, cyan, white, gray. Use hex colors sparingly.",
-      "Always include realistic, professional-looking sample data. For lists include 3-5 items with varied content. Never leave data empty.",
-      "Use Heading for section titles, Divider to separate sections, Badge for status indicators, KeyValue for labeled data, and Card for bordered groups.",
-      "Use Tabs for multi-view UIs \u2014 bind the active tab to state and use visible conditions on child content to show/hide tab panels. Use MultiSelect for picking multiple items. Use ConfirmInput for yes/no prompts before destructive actions.",
-      "Use Sparkline for inline trend visualization (compact, one line). Use BarChart for comparing values across categories (horizontal bars with labels). Both work well in dashboards alongside KeyValue and ProgressBar."
-    ]
-  }
-);
-
-// src/index.ts
-var import_core8 = require("@json-render/core");
-
-// src/renderer.tsx
-var import_react9 = __toESM(require("react"));
-var import_ink4 = require("ink");
-var import_core7 = require("@json-render/core");
-
-// src/components/standard.tsx
-var import_react8 = require("react");
-var import_ink3 = require("ink");
-var import_marked = require("marked");
-
-// src/hooks.ts
-var import_react7 = require("react");
-var import_core6 = require("@json-render/core");
-function useBoundProp(propValue, bindingPath) {
-  const { set } = useStateStore();
-  const setValue = (0, import_react7.useCallback)(
-    (value) => {
-      if (bindingPath) set(bindingPath, value);
-    },
-    [bindingPath, set]
-  );
-  return [propValue, setValue];
-}
-function looksLikeJson(line) {
-  return line.startsWith("{") || line.startsWith("[");
-}
-function parsePatchLine(line) {
-  const trimmed = line.trim();
-  if (!trimmed || trimmed.startsWith("//")) {
-    return { patch: null, malformed: false };
-  }
-  if (!looksLikeJson(trimmed)) {
-    return { patch: null, malformed: false };
-  }
-  try {
-    const parsed = JSON.parse(trimmed);
-    if (parsed && typeof parsed === "object" && typeof parsed.op === "string") {
-      return { patch: parsed, malformed: false };
-    }
-    return { patch: null, malformed: false };
-  } catch {
-  }
-  let attempt = trimmed;
-  for (let i = 0; i < 8; i++) {
-    const last = attempt[attempt.length - 1];
-    if (last === "}" || last === "]") {
-      attempt = attempt.slice(0, -1);
-      try {
-        const result = JSON.parse(attempt);
-        if (result && typeof result === "object" && typeof result.op === "string") {
-          console.warn(
-            `[json-render] Recovered malformed JSONL line by removing ${i + 1} trailing '${last}'`
-          );
-          return { patch: result, malformed: false };
-        }
-        return { patch: null, malformed: true };
-      } catch {
-      }
-    } else {
-      break;
-    }
-  }
-  return { patch: null, malformed: true };
-}
-function useUIStream({
-  api,
-  onComplete,
-  onError,
-  fetch: fetchFn = globalThis.fetch,
-  validate: enableValidation = false,
-  maxRetries = 5
-}) {
-  const [spec, setSpec] = (0, import_react7.useState)(null);
-  const [isStreaming, setIsStreaming] = (0, import_react7.useState)(false);
-  const [error, setError] = (0, import_react7.useState)(null);
-  const abortControllerRef = (0, import_react7.useRef)(null);
-  const requestIdRef = (0, import_react7.useRef)(0);
-  const onCompleteRef = (0, import_react7.useRef)(onComplete);
-  onCompleteRef.current = onComplete;
-  const onErrorRef = (0, import_react7.useRef)(onError);
-  onErrorRef.current = onError;
-  const stop = (0, import_react7.useCallback)(() => {
-    abortControllerRef.current?.abort();
-    setIsStreaming(false);
-  }, []);
-  const clear = (0, import_react7.useCallback)(() => {
-    setSpec(null);
-    setError(null);
-  }, []);
-  const streamRequest = (0, import_react7.useCallback)(
-    async (prompt, context, initialSpec, abortOnMalformed, controller) => {
-      let currentSpec = initialSpec;
-      setSpec(currentSpec);
-      const malformedLines = [];
-      const response = await fetchFn(api, {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          prompt,
-          context,
-          currentSpec
-        }),
-        signal: controller.signal
-      });
-      if (!response.ok) {
-        let errorMessage = `HTTP error: ${response.status}`;
-        try {
-          const errorData = await response.json();
-          if (errorData.message) {
-            errorMessage = errorData.message;
-          } else if (errorData.error) {
-            errorMessage = errorData.error;
-          }
-        } catch {
-        }
-        throw new Error(errorMessage);
-      }
-      const reader = response.body?.getReader();
-      if (!reader) {
-        throw new Error("No response body");
-      }
-      const decoder = new TextDecoder();
-      let buffer = "";
-      let aborted = false;
-      while (true) {
-        const { done, value } = await reader.read();
-        if (done) {
-          break;
-        }
-        const decoded = decoder.decode(value, { stream: true });
-        buffer += decoded;
-        const lines = buffer.split("\n");
-        buffer = lines.pop() ?? "";
-        for (const line of lines) {
-          const { patch, malformed } = parsePatchLine(line);
-          if (patch) {
-            currentSpec = (0, import_core6.applySpecPatch)(structuredClone(currentSpec), patch);
-            setSpec(currentSpec);
-          } else if (malformed) {
-            malformedLines.push(line.trim());
-            if (abortOnMalformed) {
-              await reader.cancel();
-              aborted = true;
-              break;
-            }
-          }
-        }
-        if (aborted) break;
-      }
-      if (!aborted && buffer.trim()) {
-        const { patch, malformed } = parsePatchLine(buffer);
-        if (patch) {
-          currentSpec = (0, import_core6.applySpecPatch)(structuredClone(currentSpec), patch);
-          setSpec(currentSpec);
-        } else if (malformed) {
-          malformedLines.push(buffer.trim());
-        }
-      }
-      return { spec: currentSpec, completed: !aborted, malformedLines };
-    },
-    [api, fetchFn]
-  );
-  const send = (0, import_react7.useCallback)(
-    async (prompt, context) => {
-      abortControllerRef.current?.abort();
-      const controller = new AbortController();
-      abortControllerRef.current = controller;
-      const thisRequestId = ++requestIdRef.current;
-      setIsStreaming(true);
-      setError(null);
-      const previousSpec = context?.previousSpec;
-      let currentSpec = previousSpec && previousSpec.root ? { ...previousSpec, elements: { ...previousSpec.elements } } : { root: "", elements: {} };
-      let retriesUsed = 0;
-      let currentPrompt = prompt;
-      let currentContext = context;
-      try {
-        while (retriesUsed <= maxRetries) {
-          const result = await streamRequest(
-            currentPrompt,
-            currentContext,
-            currentSpec,
-            enableValidation,
-            // only abort on malformed when validation is on
-            controller
-          );
-          currentSpec = result.spec;
-          if (!result.completed && result.malformedLines.length > 0) {
-            if (retriesUsed >= maxRetries) {
-              break;
-            }
-            retriesUsed++;
-            currentContext = { ...context, previousSpec: currentSpec };
-            currentPrompt = `The previous generation contained malformed JSON that could not be parsed. The line was:
-${result.malformedLines[result.malformedLines.length - 1]?.slice(0, 500)}
-
-The current spec state is provided. Continue generating from where you left off. Output ONLY the remaining patches needed to complete the UI.`;
-            continue;
-          }
-          if (!enableValidation || !currentSpec.root) {
-            break;
-          }
-          const { spec: fixedSpec, fixes } = (0, import_core6.autoFixSpec)(currentSpec);
-          if (fixes.length > 0) {
-            currentSpec = fixedSpec;
-            setSpec({ ...currentSpec });
-          }
-          const validation = (0, import_core6.validateSpec)(currentSpec);
-          if (validation.valid) {
-            break;
-          }
-          if (retriesUsed >= maxRetries) {
-            break;
-          }
-          retriesUsed++;
-          const issueText = (0, import_core6.formatSpecIssues)(validation.issues);
-          currentContext = { ...context, previousSpec: currentSpec };
-          currentPrompt = `FIX THE FOLLOWING ERRORS in the current UI spec. Output ONLY the patches needed to fix these issues, do not recreate the entire UI.
-
-` + issueText;
-        }
-        if (enableValidation && retriesUsed >= maxRetries && currentSpec.root) {
-          const finalValidation = (0, import_core6.validateSpec)(currentSpec);
-          if (!finalValidation.valid) {
-            const issueText = (0, import_core6.formatSpecIssues)(finalValidation.issues);
-            const validationError = new Error(
-              `Spec validation failed after ${maxRetries} retries:
-${issueText}`
-            );
-            setError(validationError);
-            onErrorRef.current?.(validationError);
-            return;
-          }
-        }
-        onCompleteRef.current?.(currentSpec);
-      } catch (err) {
-        if (err.name === "AbortError") {
-          return;
-        }
-        const error2 = err instanceof Error ? err : new Error(String(err));
-        setError(error2);
-        onErrorRef.current?.(error2);
-      } finally {
-        if (requestIdRef.current === thisRequestId) {
-          setIsStreaming(false);
-        }
-      }
-    },
-    [api, fetchFn, enableValidation, maxRetries, streamRequest]
-  );
-  (0, import_react7.useEffect)(() => {
-    return () => {
-      abortControllerRef.current?.abort();
-    };
-  }, []);
-  return {
-    spec,
-    isStreaming,
-    error,
-    send,
-    stop,
-    clear
-  };
-}
-function flatToTree(elements) {
-  const elementMap = {};
-  let root = "";
-  for (const element of elements) {
-    elementMap[element.key] = {
-      type: element.type,
-      props: element.props,
-      children: [],
-      visible: element.visible
-    };
-  }
-  for (const element of elements) {
-    if (element.parentKey) {
-      const parent = elementMap[element.parentKey];
-      if (parent) {
-        if (!parent.children) {
-          parent.children = [];
-        }
-        parent.children.push(element.key);
-      } else {
-        console.warn(
-          `[json-render] flatToTree: element "${element.key}" references parent "${element.parentKey}" which does not exist. Element will be orphaned.`
-        );
-      }
-    } else {
-      if (root) {
-        console.warn(
-          `[json-render] flatToTree: multiple root elements found ("${root}" and "${element.key}"). Using "${element.key}" as root.`
-        );
-      }
-      root = element.key;
-    }
-  }
-  return { root, elements: elementMap };
-}
-
-// src/components/standard.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
-var BLOCKED_PROPS = /* @__PURE__ */ new Set([
-  "key",
-  "ref",
-  "children",
-  "dangerouslySetInnerHTML",
-  "style",
-  "className",
-  "id"
-]);
-var INVISIBLE_COLORS = /* @__PURE__ */ new Set(["black", "#000", "#000000"]);
-function safeColor(color) {
-  if (color && INVISIBLE_COLORS.has(color)) return void 0;
-  return color;
-}
-function safeBoxProps(obj) {
-  const result = {};
-  for (const [k, v] of Object.entries(obj)) {
-    if (v !== void 0 && v !== null && !BLOCKED_PROPS.has(k)) {
-      if (k === "color" && typeof v === "string" && INVISIBLE_COLORS.has(v)) {
-        continue;
-      }
-      result[k] = v;
-    }
-  }
-  return result;
-}
-function BoxComponent({ element, children }) {
-  const p = element.props;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { ...safeBoxProps(p), children });
-}
-function TextComponent({ element }) {
-  const { text, ...style } = element.props;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { ...safeBoxProps(style), children: text ?? "" });
-}
-function NewlineComponent({ element }) {
-  const p = element.props;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Newline, { count: p.count });
-}
-function SpacerComponent() {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Spacer, {});
-}
-function HeadingComponent({ element }) {
-  const p = element.props;
-  const level = p.level ?? "h2";
-  switch (level) {
-    case "h1":
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, underline: true, color: safeColor(p.color), children: p.text ?? "" });
-    case "h2":
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, color: safeColor(p.color), children: p.text ?? "" });
-    case "h3":
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, dimColor: true, color: safeColor(p.color), children: p.text ?? "" });
-    case "h4":
-    default:
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, color: safeColor(p.color), children: p.text ?? "" });
-  }
-}
-function DividerComponent({ element }) {
-  const p = element.props;
-  const char = Array.from(p.character ?? "\u2500")[0] || "\u2500";
-  const totalWidth = p.width ?? 40;
-  if (p.title) {
-    const titleStr = ` ${p.title} `;
-    const available = Math.max(0, totalWidth - titleStr.length);
-    const leftLen = Math.floor(available / 2);
-    const rightLen = available - leftLen;
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Text, { color: safeColor(p.color), dimColor: p.dimColor, children: [
-      char.repeat(leftLen),
-      titleStr,
-      char.repeat(rightLen)
-    ] });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: safeColor(p.color), dimColor: p.dimColor, children: char.repeat(totalWidth) });
-}
-var BADGE_COLORS = {
-  default: "white",
-  info: "blue",
-  success: "green",
-  warning: "yellow",
-  error: "red"
-};
-function BadgeComponent({ element }) {
-  const p = element.props;
-  const color = BADGE_COLORS[p.variant ?? "default"] ?? "white";
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { backgroundColor: color, bold: true, children: ` ${p.label ?? ""} ` });
-}
-var SPINNER_FRAMES = ["\u280B", "\u2819", "\u2839", "\u2838", "\u283C", "\u2834", "\u2826", "\u2827", "\u2807", "\u280F"];
-function SpinnerComponent({ element }) {
-  const p = element.props;
-  const [frame, setFrame] = (0, import_react8.useState)(0);
-  (0, import_react8.useEffect)(() => {
-    const timer = setInterval(() => {
-      setFrame((prev) => (prev + 1) % SPINNER_FRAMES.length);
-    }, 80);
-    return () => clearInterval(timer);
-  }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: safeColor(p.color), children: SPINNER_FRAMES[frame] }),
-    p.label ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: p.label }) : null
-  ] });
-}
-function ProgressBarComponent({ element }) {
-  const p = element.props;
-  const progress = Math.min(1, Math.max(0, p.progress ?? 0));
-  const barWidth = p.width ?? 30;
-  const filled = Math.round(progress * barWidth);
-  const empty = barWidth - filled;
-  const percentage = Math.round(progress * 100);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-    p.label ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: p.label }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Text, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: safeColor(p.color) ?? "green", children: "\u2588".repeat(filled) }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: "\u2591".repeat(empty) })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Text, { dimColor: true, children: [
-      percentage,
-      "%"
-    ] })
-  ] });
-}
-var SPARK_BLOCKS = ["\u2581", "\u2582", "\u2583", "\u2584", "\u2585", "\u2586", "\u2587", "\u2588"];
-function SparklineComponent({ element }) {
-  const p = element.props;
-  const data = p.data ?? [];
-  if (data.length === 0) {
-    return p.label ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Text, { dimColor: true, children: [
-      p.label,
-      ": (no data)"
-    ] }) : null;
-  }
-  const minVal = p.min ?? Math.min(...data);
-  const maxVal = p.max ?? Math.max(...data);
-  const range = maxVal - minVal || 1;
-  const maxWidth = p.width ?? data.length;
-  let sampled = data;
-  if (maxWidth < data.length) {
-    sampled = [];
-    for (let i = 0; i < maxWidth; i++) {
-      const idx = maxWidth === 1 ? 0 : Math.round(i / (maxWidth - 1) * (data.length - 1));
-      sampled.push(data[idx]);
-    }
-  }
-  const blocks = sampled.map((v) => {
-    const normalized = (v - minVal) / range;
-    const idx = Math.min(
-      SPARK_BLOCKS.length - 1,
-      Math.round(normalized * (SPARK_BLOCKS.length - 1))
-    );
-    return SPARK_BLOCKS[idx];
-  }).join("");
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-    p.label ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: p.label }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: safeColor(p.color) ?? "green", children: blocks })
-  ] });
-}
-function BarChartComponent({ element }) {
-  const p = element.props;
-  const data = p.data ?? [];
-  if (data.length === 0) return null;
-  const maxValue = Math.max(...data.map((d) => d.value), 1);
-  const total = data.reduce((sum, d) => sum + d.value, 0);
-  const maxLabelLen = Math.max(...data.map((d) => d.label.length));
-  const barWidth = p.width ?? 30;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { flexDirection: "column", children: data.map((item) => {
-    const filled = Math.round(item.value / maxValue * barWidth);
-    const padded = item.label.padEnd(maxLabelLen);
-    const suffix = [];
-    if (p.showValues) suffix.push(String(item.value));
-    if (p.showPercentage && total > 0)
-      suffix.push(`${Math.round(item.value / total * 100)}%`);
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: padded }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: item.color ?? "green", children: "\u2588".repeat(filled) }),
-      suffix.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: suffix.join(" ") }) : null
-    ] }, item.label);
-  }) });
-}
-function TableComponent({ element }) {
-  const p = element.props;
-  const columns = p.columns ?? [];
-  const rows = p.rows ?? [];
-  const colWidths = columns.map((col) => {
-    if (col.width) return col.width;
-    let max = col.header.length;
-    for (const row of rows) {
-      const val = row[col.key] ?? "";
-      if (val.length > max) max = val.length;
-    }
-    return max + 2;
-  });
-  const padCell = (text, width, align) => {
-    const truncated = text.length > width ? text.slice(0, width - 1) + "\u2026" : text;
-    const pad = width - truncated.length;
-    if (align === "right") return " ".repeat(pad) + truncated;
-    if (align === "center") {
-      const left = Math.floor(pad / 2);
-      return " ".repeat(left) + truncated + " ".repeat(pad - left);
-    }
-    return truncated + " ".repeat(pad);
-  };
-  const borderStyleProp = p.borderStyle;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
-    import_ink3.Box,
-    {
-      flexDirection: "column",
-      alignSelf: "flex-start",
-      borderStyle: borderStyleProp,
-      backgroundColor: p.backgroundColor,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { children: columns.map((col, i) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, color: safeColor(p.headerColor), children: padCell(col.header, colWidths[i], col.align) }, col.key)) }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: colWidths.map((w) => "\u2500".repeat(w)).join("\u2500") }),
-        rows.map((row, rowIdx) => {
-          const rowKey = columns.map((c) => row[c.key] ?? "").join("\0") || String(rowIdx);
-          return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { gap: 0, children: columns.map((col, i) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: padCell(row[col.key] || "\u2014", colWidths[i], col.align) }, col.key)) }, rowKey);
-        })
-      ]
-    }
-  );
-}
-function ListComponent({ element }) {
-  const p = element.props;
-  const items = p.items ?? [];
-  const bullet = p.bulletChar ?? "\u2022";
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { flexDirection: "column", gap: p.spacing ?? 0, children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: p.ordered ? `${i + 1}.` : bullet }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: item })
-  ] }, `${i}:${item}`)) });
-}
-function ListItemComponent({ element }) {
-  const p = element.props;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-    p.leading ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: p.leading }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { flexDirection: "column", flexGrow: 1, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, children: p.title ?? "" }),
-      p.subtitle ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: p.subtitle }) : null
-    ] }),
-    p.trailing ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: String(p.trailing) }) : null
-  ] });
-}
-function CardComponent({ element, children }) {
-  const p = element.props;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
-    import_ink3.Box,
-    {
-      flexDirection: "column",
-      alignSelf: "flex-start",
-      backgroundColor: p.backgroundColor ?? "#1a1a1a",
-      padding: p.padding ?? 1,
-      children: [
-        p.title ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { marginBottom: 1, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, children: p.title }) }) : null,
-        children
-      ]
-    }
-  );
-}
-function coerceToString(val) {
-  if (val == null) return "";
-  if (typeof val === "string") return val;
-  if (typeof val === "number") return val.toLocaleString();
-  if (typeof val === "boolean") return val ? "true" : "false";
-  if (Array.isArray(val)) return val.map(coerceToString).join(", ");
-  if (typeof val === "object") {
-    const values = Object.values(val);
-    return values.map(coerceToString).join(" ");
-  }
-  return String(val);
-}
-function KeyValueComponent({ element }) {
-  const p = element.props;
-  const sep = p.separator ?? ":";
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Text, { color: safeColor(p.labelColor), bold: true, dimColor: true, children: [
-      p.label ?? "",
-      sep
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: coerceToString(p.value) || "\u2014" })
-  ] });
-}
-function LinkComponent({ element }) {
-  const p = element.props;
-  const url = p.url ?? "";
-  const label = p.label ?? url;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Text, { color: safeColor(p.color) ?? "cyan", underline: true, children: [
-    label,
-    label !== url ? ` (${url})` : ""
-  ] });
-}
-var STATUS_CONFIG = {
-  info: { icon: "\u2139", color: "blue" },
-  success: { icon: "\u2714", color: "green" },
-  warning: { icon: "\u26A0", color: "yellow" },
-  error: { icon: "\u2716", color: "red" }
-};
-function StatusLineComponent({ element }) {
-  const p = element.props;
-  const status = p.status ?? "info";
-  const config = STATUS_CONFIG[status];
-  const icon = p.icon ?? config?.icon ?? "\u2022";
-  const color = config?.color ?? "white";
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color, children: icon }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: p.text ?? "" })
-  ] });
-}
-var TREND_CONFIG = {
-  up: { prefix: "+", color: "green" },
-  down: { prefix: "", color: "red" },
-  neutral: { prefix: "~", color: "gray" }
-};
-function MetricComponent({ element }) {
-  const p = element.props;
-  const trend = p.trend ? TREND_CONFIG[p.trend] : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { flexDirection: "column", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: p.label ?? "" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, children: p.value ?? "" }),
-      trend && p.detail ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Text, { color: trend.color, children: [
-        trend.prefix,
-        p.detail
-      ] }) : null
-    ] }),
-    !trend && p.detail ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: p.detail }) : null
-  ] });
-}
-var CALLOUT_CONFIG = {
-  info: { label: "INFO", color: "blue" },
-  tip: { label: "TIP", color: "green" },
-  warning: { label: "WARNING", color: "yellow" },
-  important: { label: "IMPORTANT", color: "magenta" }
-};
-function CalloutComponent({ element }) {
-  const p = element.props;
-  const config = CALLOUT_CONFIG[p.type ?? "info"] ?? CALLOUT_CONFIG.info;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
-    import_ink3.Box,
-    {
-      flexDirection: "column",
-      borderStyle: "bold",
-      borderLeft: true,
-      borderRight: false,
-      borderTop: false,
-      borderBottom: false,
-      borderColor: config.color,
-      paddingLeft: 1,
-      children: [
-        p.title ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, color: config.color, children: p.title }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: p.content ?? "" })
-      ]
-    }
-  );
-}
-var TIMELINE_DOT = {
-  completed: { dot: "\u25CF", color: "green" },
-  current: { dot: "\u25C6", color: "cyan" },
-  upcoming: { dot: "\u25CB", color: "gray" }
-};
-function TimelineComponent({ element }) {
-  const p = element.props;
-  const items = p.items ?? [];
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { flexDirection: "column", gap: 1, children: items.map((item, i) => {
-    const cfg = TIMELINE_DOT[item.status ?? "upcoming"] ?? TIMELINE_DOT.upcoming;
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { flexDirection: "column", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: cfg.color, children: cfg.dot }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, children: item.title ?? "" }),
-        item.date ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: item.date }) : null
-      ] }),
-      item.description ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { paddingLeft: 2, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: item.description }) }) : null
-    ] }, i);
-  }) });
-}
-function codePointLength(s) {
-  return Array.from(s).length;
-}
-function codePointSlice(s, start, end) {
-  return Array.from(s).slice(start, end).join("");
-}
-function TextInputComponent({ element, emit, bindings }) {
-  const p = element.props;
-  const { isActive } = useFocus();
-  const [value, setValue] = useBoundProp(
-    p.value ?? "",
-    bindings?.value
-  );
-  const currentValue = value ?? "";
-  const [cursorPos, setCursorPos] = (0, import_react8.useState)(codePointLength(currentValue));
-  (0, import_react8.useEffect)(() => {
-    setCursorPos((prev) => Math.min(prev, codePointLength(currentValue)));
-  }, [currentValue]);
-  (0, import_ink3.useInput)(
-    (input, key) => {
-      if (key.return) {
-        emit("submit");
-        return;
-      }
-      if (key.backspace || key.delete) {
-        if (cursorPos > 0) {
-          const newVal = codePointSlice(currentValue, 0, cursorPos - 1) + codePointSlice(currentValue, cursorPos);
-          setValue(newVal);
-          setCursorPos((prev) => prev - 1);
-          emit("change");
-        }
-        return;
-      }
-      if (key.leftArrow) {
-        setCursorPos((prev) => Math.max(0, prev - 1));
-        return;
-      }
-      if (key.rightArrow) {
-        setCursorPos(
-          (prev) => Math.min(codePointLength(currentValue), prev + 1)
-        );
-        return;
-      }
-      if (key.ctrl || key.meta || key.escape || key.tab) return;
-      if (key.upArrow || key.downArrow) return;
-      if (input) {
-        const newVal = codePointSlice(currentValue, 0, cursorPos) + input + codePointSlice(currentValue, cursorPos);
-        setValue(newVal);
-        setCursorPos((prev) => prev + codePointLength(input));
-        emit("change");
-      }
-    },
-    { isActive }
-  );
-  const displayValue = currentValue ? p.mask ? p.mask.repeat(codePointLength(currentValue)) : currentValue : "";
-  const before = codePointSlice(displayValue, 0, cursorPos);
-  const after = codePointSlice(displayValue, cursorPos);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-    p.label ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Text, { bold: true, children: [
-      p.label,
-      ":"
-    ] }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: currentValue ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-      before,
-      isActive ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: "cyan", children: "\u258E" }) : null,
-      after
-    ] }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-      isActive ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: "cyan", children: "\u258E" }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: p.placeholder ?? "" })
-    ] }) })
-  ] });
-}
-function SelectComponent({ element, emit, bindings }) {
-  const p = element.props;
-  const { isActive } = useFocus();
-  const options = p.options ?? [];
-  const [selectedValue, setSelectedValue] = useBoundProp(
-    p.value ?? "",
-    bindings?.value
-  );
-  const currentIndex = options.findIndex((o) => o.value === selectedValue);
-  const [highlightIndex, setHighlightIndex] = (0, import_react8.useState)(
-    currentIndex >= 0 ? currentIndex : 0
-  );
-  const optionsKey = options.map((o) => o.value).join("\0");
-  (0, import_react8.useEffect)(() => {
-    const idx = options.findIndex((o) => o.value === selectedValue);
-    if (idx >= 0) {
-      setHighlightIndex(idx);
-    } else if (options.length > 0) {
-      setHighlightIndex((prev) => Math.min(prev, options.length - 1));
-    } else {
-      setHighlightIndex(0);
-    }
-  }, [selectedValue, optionsKey]);
-  (0, import_ink3.useInput)(
-    (_input, key) => {
-      if (options.length === 0) return;
-      if (key.upArrow) {
-        setHighlightIndex((prev) => prev > 0 ? prev - 1 : options.length - 1);
-      } else if (key.downArrow) {
-        setHighlightIndex((prev) => prev < options.length - 1 ? prev + 1 : 0);
-      } else if (key.return) {
-        const option = options[highlightIndex];
-        if (option) {
-          setSelectedValue(option.value);
-          emit("change");
-        }
-      }
-    },
-    { isActive }
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { flexDirection: "column", children: [
-    p.label ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { marginBottom: 1, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Text, { bold: true, children: [
-      p.label,
-      ":"
-    ] }) }) : null,
-    options.map((option, i) => {
-      const isHighlighted = i === highlightIndex;
-      const isSelected = option.value === selectedValue;
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: isHighlighted ? "cyan" : void 0, children: isHighlighted ? "\u276F" : " " }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-          import_ink3.Text,
-          {
-            color: isSelected ? "green" : isHighlighted ? "cyan" : void 0,
-            bold: isSelected,
-            children: option.label
-          }
-        )
-      ] }, option.value);
-    })
-  ] });
-}
-function MultiSelectComponent({
-  element,
-  emit,
-  bindings
-}) {
-  const p = element.props;
-  const { isActive } = useFocus();
-  const options = p.options ?? [];
-  const [selectedValues, setSelectedValues] = useBoundProp(
-    p.value ?? [],
-    bindings?.value
-  );
-  const selected = selectedValues ?? [];
-  const [highlightIndex, setHighlightIndex] = (0, import_react8.useState)(0);
-  const optionsKey = options.map((o) => o.value).join("\0");
-  (0, import_react8.useEffect)(() => {
-    if (options.length > 0) {
-      setHighlightIndex((prev) => Math.min(prev, options.length - 1));
-    } else {
-      setHighlightIndex(0);
-    }
-  }, [optionsKey]);
-  (0, import_ink3.useInput)(
-    (_input, key) => {
-      if (options.length === 0) return;
-      if (key.upArrow) {
-        setHighlightIndex((prev) => prev > 0 ? prev - 1 : options.length - 1);
-      } else if (key.downArrow) {
-        setHighlightIndex((prev) => prev < options.length - 1 ? prev + 1 : 0);
-      } else if (_input === " ") {
-        const option = options[highlightIndex];
-        if (!option) return;
-        const isSelected = selected.includes(option.value);
-        let next;
-        if (isSelected) {
-          if (p.min != null && selected.length <= p.min) return;
-          next = selected.filter((v) => v !== option.value);
-        } else {
-          if (p.max != null && selected.length >= p.max) return;
-          next = [...selected, option.value];
-        }
-        setSelectedValues(next);
-        emit("change");
-      } else if (key.return) {
-        emit("submit");
-      }
-    },
-    { isActive }
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { flexDirection: "column", children: [
-    p.label ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { marginBottom: 1, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Text, { bold: true, children: [
-        p.label,
-        ":"
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: " (space to toggle, enter to confirm)" })
-    ] }) : null,
-    options.map((option, i) => {
-      const isHighlighted = i === highlightIndex;
-      const isChecked = selected.includes(option.value);
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: isHighlighted ? "cyan" : void 0, children: isHighlighted ? "\u276F" : " " }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: isChecked ? "green" : void 0, children: isChecked ? "\u25C9" : "\u25EF" }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: isHighlighted ? "cyan" : void 0, bold: isChecked, children: option.label })
-      ] }, option.value);
-    }),
-    selected.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { marginTop: 1, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Text, { dimColor: true, children: [
-      "Selected: ",
-      selected.length
-    ] }) }) : null
-  ] });
-}
-function ConfirmInputComponent({ element, emit }) {
-  const p = element.props;
-  const { isActive } = useFocus();
-  const [value, setValue] = (0, import_react8.useState)(p.defaultValue ?? null);
-  (0, import_ink3.useInput)(
-    (input, key) => {
-      const lower = input.toLowerCase();
-      if (lower === "y") {
-        setValue(true);
-        emit("confirm");
-      } else if (lower === "n") {
-        setValue(false);
-        emit("deny");
-      } else if (key.return && value !== null) {
-        emit(value ? "confirm" : "deny");
-      }
-    },
-    { isActive }
-  );
-  const yesLabel = p.yesLabel ?? "Yes";
-  const noLabel = p.noLabel ?? "No";
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, children: p.message ?? "Are you sure?" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Text, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: value === true ? "green" : "gray", bold: value === true, children: yesLabel }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: " / " }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: value === false ? "red" : "gray", bold: value === false, children: noLabel })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: "(y/n)" })
-  ] });
-}
-function TabsComponent({
-  element,
-  emit,
-  bindings,
-  children
-}) {
-  const p = element.props;
-  const { isActive } = useFocus();
-  const tabs = p.tabs ?? [];
-  const [activeTab, setActiveTab] = useBoundProp(
-    p.value ?? tabs[0]?.value ?? "",
-    bindings?.value
-  );
-  const activeIndex = tabs.findIndex((t) => t.value === activeTab);
-  (0, import_ink3.useInput)(
-    (_input, key) => {
-      if (tabs.length === 0) return;
-      const currentIdx = activeIndex >= 0 ? activeIndex : 0;
-      if (key.leftArrow) {
-        const next = currentIdx > 0 ? currentIdx - 1 : tabs.length - 1;
-        const tab = tabs[next];
-        if (tab) {
-          setActiveTab(tab.value);
-          emit("change");
-        }
-      } else if (key.rightArrow) {
-        const next = currentIdx < tabs.length - 1 ? currentIdx + 1 : 0;
-        const tab = tabs[next];
-        if (tab) {
-          setActiveTab(tab.value);
-          emit("change");
-        }
-      }
-    },
-    { isActive }
-  );
-  const accentColor = p.color ?? "cyan";
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { flexDirection: "column", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { gap: 2, children: tabs.map((tab) => {
-      const isActive2 = tab.value === activeTab;
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
-        import_ink3.Text,
-        {
-          color: isActive2 ? accentColor : void 0,
-          bold: isActive2,
-          dimColor: !isActive2,
-          children: [
-            tab.icon ? `${tab.icon} ` : "",
-            tab.label
-          ]
-        },
-        tab.value
-      );
-    }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { color: accentColor, children: tabs.map((tab) => {
-      const isActive2 = tab.value === activeTab;
-      const labelWidth = (tab.icon ? tab.icon.length + 1 : 0) + tab.label.length;
-      return isActive2 ? "\u2501".repeat(labelWidth) + "  " : " ".repeat(labelWidth) + "  ";
-    }).join("") }),
-    children
-  ] });
-}
-function renderInline(tokens) {
-  const nodes = [];
-  for (let i = 0; i < tokens.length; i++) {
-    const t = tokens[i];
-    switch (t.type) {
-      case "strong":
-        nodes.push(
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, children: renderInline(t.tokens) }, i)
-        );
-        break;
-      case "em":
-        nodes.push(
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { italic: true, children: renderInline(t.tokens) }, i)
-        );
-        break;
-      case "codespan":
-        nodes.push(
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-            import_ink3.Text,
-            {
-              bold: true,
-              dimColor: true,
-              children: `\`${t.text}\``
-            },
-            i
-          )
-        );
-        break;
-      case "del":
-        nodes.push(
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { strikethrough: true, children: renderInline(t.tokens) }, i)
-        );
-        break;
-      case "link":
-        nodes.push(
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { underline: true, children: renderInline(t.tokens) }, i)
-        );
-        break;
-      case "text": {
-        const tt = t;
-        if (tt.tokens) {
-          nodes.push(...renderInline(tt.tokens));
-        } else {
-          nodes.push(tt.text);
-        }
-        break;
-      }
-      case "br":
-        nodes.push("\n");
-        break;
-      case "escape":
-        nodes.push(t.text);
-        break;
-      default:
-        if ("text" in t) nodes.push(t.text);
-        break;
-    }
-  }
-  return nodes;
-}
-function renderBlock(token, key) {
-  switch (token.type) {
-    case "heading": {
-      const h = token;
-      const content = renderInline(h.tokens);
-      if (h.depth === 1)
-        return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, underline: true, children: content }, key);
-      if (h.depth === 2)
-        return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, children: content }, key);
-      if (h.depth === 3)
-        return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { bold: true, dimColor: true, children: content }, key);
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: content }, key);
-    }
-    case "paragraph": {
-      const p = token;
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: renderInline(p.tokens) }, key);
-    }
-    case "code": {
-      const c = token;
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-        import_ink3.Box,
-        {
-          borderStyle: "single",
-          borderColor: "gray",
-          paddingX: 1,
-          marginY: 0,
-          children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: c.text })
-        },
-        key
-      );
-    }
-    case "blockquote": {
-      const bq = token;
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-        import_ink3.Box,
-        {
-          paddingLeft: 1,
-          borderStyle: "bold",
-          borderLeft: true,
-          borderTop: false,
-          borderBottom: false,
-          borderRight: false,
-          borderColor: "gray",
-          children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { flexDirection: "column", children: bq.tokens.map((child, i) => renderBlock(child, i)) })
-        },
-        key
-      );
-    }
-    case "list": {
-      const l = token;
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { flexDirection: "column", children: l.items.map((item, idx) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_ink3.Box, { gap: 1, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: l.ordered ? `${Number(l.start ?? 1) + idx}.` : "\u2022" }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: item.tokens.flatMap((child) => {
-          if (child.type === "text") {
-            const tt = child;
-            return tt.tokens ? renderInline(tt.tokens) : [tt.text];
-          }
-          if (child.type === "list") return [renderBlock(child, idx)];
-          return "tokens" in child ? renderInline(child.tokens) : [];
-        }) })
-      ] }, idx)) }, key);
-    }
-    case "hr":
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { dimColor: true, children: "\u2500".repeat(40) }, key);
-    case "space":
-      return null;
-    default:
-      if ("text" in token)
-        return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Text, { children: token.text }, key);
-      return null;
-  }
-}
-function MarkdownText({ text }) {
-  const tokens = (0, import_react8.useMemo)(
-    () => import_marked.marked.lexer(text, { gfm: true, breaks: true }),
-    [text]
-  );
-  const blocks = tokens.map((t, i) => renderBlock(t, i)).filter((n) => n != null);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_ink3.Box, { flexDirection: "column", gap: 0, children: blocks });
-}
-function MarkdownComponent({ element }) {
-  const p = element.props;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MarkdownText, { text: p.text ?? "" });
-}
-var standardComponents = {
-  Box: BoxComponent,
-  Text: TextComponent,
-  Newline: NewlineComponent,
-  Spacer: SpacerComponent,
-  Heading: HeadingComponent,
-  Divider: DividerComponent,
-  Badge: BadgeComponent,
-  Spinner: SpinnerComponent,
-  ProgressBar: ProgressBarComponent,
-  Sparkline: SparklineComponent,
-  BarChart: BarChartComponent,
-  Table: TableComponent,
-  List: ListComponent,
-  ListItem: ListItemComponent,
-  Card: CardComponent,
-  KeyValue: KeyValueComponent,
-  Link: LinkComponent,
-  StatusLine: StatusLineComponent,
-  Metric: MetricComponent,
-  Callout: CalloutComponent,
-  Timeline: TimelineComponent,
-  TextInput: TextInputComponent,
-  Select: SelectComponent,
-  MultiSelect: MultiSelectComponent,
-  ConfirmInput: ConfirmInputComponent,
-  Tabs: TabsComponent,
-  Markdown: MarkdownComponent
-};
-
-// src/renderer.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
-var ElementErrorBoundary = class extends import_react9.default.Component {
-  constructor(props) {
-    super(props);
-    this.state = { hasError: false, errorType: null };
-  }
-  static getDerivedStateFromError() {
-    return { hasError: true, errorType: "__pending__" };
-  }
-  static getDerivedStateFromProps(props, state) {
-    if (state.hasError && state.errorType !== null && state.errorType !== "__pending__" && state.errorType !== props.elementType) {
-      return { hasError: false, errorType: null };
-    }
-    return null;
-  }
-  componentDidCatch(error, info) {
-    this.setState({ errorType: this.props.elementType });
-    console.error(
-      `[json-render] Rendering error in <${this.props.elementType}>:`,
-      error,
-      info.componentStack
-    );
-  }
-  render() {
-    if (this.state.hasError) {
-      return null;
-    }
-    return this.props.children;
-  }
-};
-var ElementRenderer = import_react9.default.memo(function ElementRenderer2({
-  element,
-  spec,
-  registry,
-  loading,
-  fallback
-}) {
-  const repeatScope = useRepeatScope();
-  const { ctx } = useVisibility();
-  const { execute } = useActions();
-  const { getSnapshot } = useStateStore();
-  const fullCtx = (0, import_react9.useMemo)(
-    () => repeatScope ? {
-      ...ctx,
-      repeatItem: repeatScope.item,
-      repeatIndex: repeatScope.index,
-      repeatBasePath: repeatScope.basePath
-    } : ctx,
-    [ctx, repeatScope]
-  );
-  const isVisible = element.visible === void 0 ? true : (0, import_core7.evaluateVisibility)(element.visible, fullCtx);
-  const onBindings = element.on;
-  const emit = (0, import_react9.useCallback)(
-    (eventName) => {
-      const binding = onBindings?.[eventName];
-      if (!binding) return;
-      const actionBindings = Array.isArray(binding) ? binding : [binding];
-      (async () => {
-        for (const b of actionBindings) {
-          if (!b.params) {
-            await execute(b);
-            continue;
-          }
-          const liveCtx = {
-            ...fullCtx,
-            stateModel: getSnapshot()
-          };
-          const resolved = {};
-          for (const [key, val] of Object.entries(b.params)) {
-            resolved[key] = (0, import_core7.resolveActionParam)(val, liveCtx);
-          }
-          await execute({ ...b, params: resolved });
-        }
-      })().catch((err) => {
-        console.error(
-          `[json-render] Error handling event "${eventName}":`,
-          err
-        );
-      });
-    },
-    [onBindings, execute, fullCtx, getSnapshot]
-  );
-  if (!isVisible) {
-    return null;
-  }
-  const rawProps = element.props;
-  const elementBindings = (0, import_core7.resolveBindings)(rawProps, fullCtx);
-  const resolvedProps = (0, import_core7.resolveElementProps)(rawProps, fullCtx);
-  const resolvedElement = resolvedProps !== element.props ? { ...element, props: resolvedProps } : element;
-  const Component = registry[resolvedElement.type] ?? fallback;
-  if (!Component) {
-    console.warn(
-      `[json-render] No renderer for component type: ${resolvedElement.type}`
-    );
-    return null;
-  }
-  const children = resolvedElement.repeat ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    RepeatChildren,
-    {
-      element: resolvedElement,
-      spec,
-      registry,
-      loading,
-      fallback
-    }
-  ) : resolvedElement.children?.map((childKey) => {
-    const childElement = spec.elements[childKey];
-    if (!childElement) {
-      if (!loading) {
-        console.warn(
-          `[json-render] Missing element "${childKey}" referenced as child of "${resolvedElement.type}". This element will not render.`
-        );
-        return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_ink4.Text, { color: "red", children: `[Missing: ${childKey}]` }, childKey);
-      }
-      return null;
-    }
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-      ElementRenderer2,
-      {
-        element: childElement,
-        spec,
-        registry,
-        loading,
-        fallback
-      },
-      childKey
-    );
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ElementErrorBoundary, { elementType: resolvedElement.type, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    Component,
-    {
-      element: resolvedElement,
-      emit,
-      bindings: elementBindings,
-      loading,
-      children
-    }
-  ) });
-});
-function RepeatChildren({
-  element,
-  spec,
-  registry,
-  loading,
-  fallback
-}) {
-  const { state } = useStateStore();
-  const repeat = element.repeat;
-  const statePath = repeat.statePath;
-  const raw = (0, import_core7.getByPath)(state, statePath);
-  const items = Array.isArray(raw) ? raw : [];
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_jsx_runtime8.Fragment, { children: items.map((itemValue, index) => {
-    const key = repeat.key && typeof itemValue === "object" && itemValue !== null ? String(
-      itemValue[repeat.key] ?? index
-    ) : String(index);
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-      RepeatScopeProvider,
-      {
-        item: itemValue,
-        index,
-        basePath: `${statePath}/${index}`,
-        children: element.children?.map((childKey) => {
-          const childElement = spec.elements[childKey];
-          if (!childElement) {
-            if (!loading) {
-              console.warn(
-                `[json-render] Missing element "${childKey}" referenced as child of "${element.type}" (repeat). This element will not render.`
-              );
-              return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-                import_ink4.Text,
-                {
-                  color: "red",
-                  children: `[Missing: ${childKey}]`
-                },
-                `${key}:${childKey}`
-              );
-            }
-            return null;
-          }
-          return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-            ElementRenderer,
-            {
-              element: childElement,
-              spec,
-              registry,
-              loading,
-              fallback
-            },
-            `${key}:${childKey}`
-          );
-        })
-      },
-      key
-    );
-  }) });
-}
-function Renderer({
-  spec,
-  registry: customRegistry,
-  includeStandard = true,
-  loading,
-  fallback
-}) {
-  const registry = (0, import_react9.useMemo)(
-    () => ({
-      ...includeStandard ? standardComponents : {},
-      ...customRegistry
-    }),
-    [customRegistry, includeStandard]
-  );
-  if (!spec || !spec.root) {
-    return null;
-  }
-  const rootElement = spec.elements[spec.root];
-  if (!rootElement) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    ElementRenderer,
-    {
-      element: rootElement,
-      spec,
-      registry,
-      loading,
-      fallback
-    }
-  );
-}
-function JSONUIProvider({
-  store,
-  initialState,
-  handlers,
-  navigate,
-  validationFunctions,
-  onStateChange,
-  children
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    StateProvider,
-    {
-      store,
-      initialState,
-      onStateChange,
-      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(VisibilityProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ValidationProvider, { customFunctions: validationFunctions, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ActionProvider, { handlers, navigate, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(FocusProvider, { children: [
-        children,
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ConfirmationDialogManager, {})
-      ] }) }) }) })
-    }
-  );
-}
-function ConfirmationDialogManager() {
-  const { pendingConfirmation, confirm, cancel } = useActions();
-  if (!pendingConfirmation?.action.confirm) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    ConfirmDialog,
-    {
-      confirm: pendingConfirmation.action.confirm,
-      onConfirm: confirm,
-      onCancel: cancel
-    }
-  );
-}
-function defineRegistry(_catalog, options) {
-  const registry = {};
-  if (options.components) {
-    for (const [name, componentFn] of Object.entries(options.components)) {
-      registry[name] = ({
-        element,
-        children,
-        emit,
-        bindings,
-        loading
-      }) => {
-        return componentFn({
-          props: element.props,
-          children,
-          emit,
-          bindings,
-          loading
-        });
-      };
-    }
-  }
-  const actionMap = options.actions ? Object.entries(options.actions) : [];
-  const handlers = (getSetState, getState) => {
-    const result = {};
-    for (const [name, actionFn] of actionMap) {
-      result[name] = async (params) => {
-        const setState = getSetState();
-        const state = getState();
-        if (setState) {
-          await actionFn(params, setState, state);
-        } else {
-          console.warn(
-            `[json-render] Action "${name}" skipped: setState not available. Ensure the action handler is used within a mounted StateProvider.`
-          );
-        }
-      };
-    }
-    return result;
-  };
-  const executeAction2 = async (actionName, params, setState, state = {}) => {
-    const entry = actionMap.find(([name]) => name === actionName);
-    if (entry) {
-      await entry[1](params, setState, state);
-    } else {
-      console.warn(`[json-render] Unknown action: ${actionName}`);
-    }
-  };
-  return { registry, handlers, executeAction: executeAction2 };
-}
-function createRenderer(_catalog, components) {
-  const registry = components;
-  return function CatalogRenderer({
-    spec,
-    store,
-    state,
-    onAction,
-    onStateChange,
-    loading,
-    fallback
-  }) {
-    const actionHandlers = (0, import_react9.useMemo)(
-      () => onAction ? new Proxy(
-        {},
-        {
-          get: (_target, prop) => {
-            return (params) => onAction(prop, params);
-          },
-          has: () => true
-        }
-      ) : void 0,
-      [onAction]
-    );
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-      JSONUIProvider,
-      {
-        store,
-        initialState: state,
-        handlers: actionHandlers,
-        onStateChange,
-        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-          Renderer,
-          {
-            spec,
-            registry,
-            loading,
-            fallback
-          }
-        )
-      }
-    );
-  };
-}
-
-// src/catalog.ts
-var import_zod = require("zod");
-var standardComponentDefinitions = {
-  // ==========================================================================
-  // Layout Components (Ink Primitives)
-  // ==========================================================================
-  Box: {
-    props: import_zod.z.object({
-      flexDirection: import_zod.z.enum(["row", "row-reverse", "column", "column-reverse"]).nullable(),
-      alignItems: import_zod.z.enum(["flex-start", "center", "flex-end", "stretch"]).nullable(),
-      justifyContent: import_zod.z.enum([
-        "flex-start",
-        "center",
-        "flex-end",
-        "space-between",
-        "space-around",
-        "space-evenly"
-      ]).nullable(),
-      flexGrow: import_zod.z.number().nullable(),
-      flexShrink: import_zod.z.number().nullable(),
-      flexWrap: import_zod.z.enum(["nowrap", "wrap", "wrap-reverse"]).nullable(),
-      width: import_zod.z.union([import_zod.z.number().max(500), import_zod.z.string()]).nullable(),
-      height: import_zod.z.union([import_zod.z.number().max(500), import_zod.z.string()]).nullable(),
-      minWidth: import_zod.z.union([import_zod.z.number().max(500), import_zod.z.string()]).nullable(),
-      minHeight: import_zod.z.union([import_zod.z.number().max(500), import_zod.z.string()]).nullable(),
-      padding: import_zod.z.number().nullable(),
-      paddingX: import_zod.z.number().nullable(),
-      paddingY: import_zod.z.number().nullable(),
-      paddingTop: import_zod.z.number().nullable(),
-      paddingBottom: import_zod.z.number().nullable(),
-      paddingLeft: import_zod.z.number().nullable(),
-      paddingRight: import_zod.z.number().nullable(),
-      margin: import_zod.z.number().nullable(),
-      marginX: import_zod.z.number().nullable(),
-      marginY: import_zod.z.number().nullable(),
-      marginTop: import_zod.z.number().nullable(),
-      marginBottom: import_zod.z.number().nullable(),
-      marginLeft: import_zod.z.number().nullable(),
-      marginRight: import_zod.z.number().nullable(),
-      gap: import_zod.z.number().nullable(),
-      columnGap: import_zod.z.number().nullable(),
-      rowGap: import_zod.z.number().nullable(),
-      borderStyle: import_zod.z.enum([
-        "single",
-        "double",
-        "round",
-        "bold",
-        "singleDouble",
-        "doubleSingle",
-        "classic"
-      ]).nullable(),
-      borderColor: import_zod.z.string().nullable(),
-      borderTop: import_zod.z.boolean().nullable(),
-      borderBottom: import_zod.z.boolean().nullable(),
-      borderLeft: import_zod.z.boolean().nullable(),
-      borderRight: import_zod.z.boolean().nullable(),
-      borderDimColor: import_zod.z.boolean().nullable(),
-      display: import_zod.z.enum(["flex", "none"]).nullable(),
-      overflow: import_zod.z.enum(["visible", "hidden"]).nullable(),
-      backgroundColor: import_zod.z.string().nullable()
-    }),
-    slots: ["default"],
-    description: "Flexbox layout container (like a terminal <div>). Use for grouping, spacing, borders, and alignment. Default flexDirection is row.",
-    example: {
-      flexDirection: "column",
-      padding: 1,
-      gap: 1,
-      borderStyle: "round"
-    }
-  },
-  Text: {
-    props: import_zod.z.object({
-      text: import_zod.z.string(),
-      color: import_zod.z.string().nullable(),
-      backgroundColor: import_zod.z.string().nullable(),
-      bold: import_zod.z.boolean().nullable(),
-      italic: import_zod.z.boolean().nullable(),
-      underline: import_zod.z.boolean().nullable(),
-      strikethrough: import_zod.z.boolean().nullable(),
-      dimColor: import_zod.z.boolean().nullable(),
-      inverse: import_zod.z.boolean().nullable(),
-      wrap: import_zod.z.enum([
-        "wrap",
-        "truncate",
-        "truncate-end",
-        "truncate-middle",
-        "truncate-start"
-      ]).nullable()
-    }),
-    slots: [],
-    description: "Text output with optional styling (color, bold, italic, etc.). Use for all text content in the terminal.",
-    example: { text: "Hello, world!", bold: true, color: "green" }
-  },
-  Newline: {
-    props: import_zod.z.object({
-      count: import_zod.z.number().nullable()
-    }),
-    slots: [],
-    description: "Inserts one or more blank lines. Must be placed inside a Box with flexDirection column.",
-    example: { count: 1 }
-  },
-  Spacer: {
-    props: import_zod.z.object({}),
-    slots: [],
-    description: "Flexible empty space that expands to fill available room along the main axis. Use between elements to push them apart."
-  },
-  // ==========================================================================
-  // Content Components (Higher-Level)
-  // ==========================================================================
-  Heading: {
-    props: import_zod.z.object({
-      text: import_zod.z.string(),
-      level: import_zod.z.enum(["h1", "h2", "h3", "h4"]).nullable(),
-      color: import_zod.z.string().nullable()
-    }),
-    slots: [],
-    description: "Section heading. h1 is bold + underlined, h2 is bold, h3 is bold + dimmed, h4 is dimmed.",
-    example: { text: "Dashboard", level: "h1" }
-  },
-  Divider: {
-    props: import_zod.z.object({
-      character: import_zod.z.string().nullable(),
-      color: import_zod.z.string().nullable(),
-      dimColor: import_zod.z.boolean().nullable(),
-      title: import_zod.z.string().nullable(),
-      width: import_zod.z.number().max(500).nullable()
-    }),
-    slots: [],
-    description: "Horizontal separator line. Default width is 40 characters. Optionally includes a centered title.",
-    example: { title: "Section", color: "gray", width: 40 }
-  },
-  Badge: {
-    props: import_zod.z.object({
-      label: import_zod.z.string(),
-      variant: import_zod.z.enum(["default", "info", "success", "warning", "error"]).nullable()
-    }),
-    slots: [],
-    description: "Small colored inline label for status, counts, and categories.",
-    example: { label: "ACTIVE", variant: "success" }
-  },
-  Spinner: {
-    props: import_zod.z.object({
-      label: import_zod.z.string().nullable(),
-      color: import_zod.z.string().nullable()
-    }),
-    slots: [],
-    description: "Animated loading spinner with optional label text. Uses braille animation characters.",
-    example: { label: "Loading...", color: "cyan" }
-  },
-  ProgressBar: {
-    props: import_zod.z.object({
-      progress: import_zod.z.number(),
-      width: import_zod.z.number().max(500).nullable(),
-      color: import_zod.z.string().nullable(),
-      label: import_zod.z.string().nullable()
-    }),
-    slots: [],
-    description: "Horizontal progress bar. Set progress from 0 to 1. Default width is 30 characters.",
-    example: { progress: 0.65, width: 30, color: "green", label: "Uploading" }
-  },
-  Sparkline: {
-    props: import_zod.z.object({
-      data: import_zod.z.array(import_zod.z.number()),
-      width: import_zod.z.number().max(500).nullable(),
-      color: import_zod.z.string().nullable(),
-      label: import_zod.z.string().nullable(),
-      min: import_zod.z.number().nullable(),
-      max: import_zod.z.number().nullable()
-    }),
-    slots: [],
-    description: "Inline sparkline chart using Unicode block characters (\u2581\u2582\u2583\u2584\u2585\u2586\u2587\u2588). Pass an array of numbers to visualize trends compactly. Set min/max to fix the scale across multiple sparklines.",
-    example: {
-      data: [3, 7, 2, 9, 4, 8, 1, 6, 5],
-      color: "cyan",
-      label: "CPU"
-    }
-  },
-  BarChart: {
-    props: import_zod.z.object({
-      data: import_zod.z.array(
-        import_zod.z.object({
-          label: import_zod.z.string(),
-          value: import_zod.z.number(),
-          color: import_zod.z.string().nullable()
-        })
-      ),
-      width: import_zod.z.number().max(500).nullable(),
-      showValues: import_zod.z.boolean().nullable(),
-      showPercentage: import_zod.z.boolean().nullable()
-    }),
-    slots: [],
-    description: "Horizontal bar chart. Each item has a label, numeric value, and optional color. Set showValues to display raw numbers, showPercentage to show % of total. Default bar width is 30.",
-    example: {
-      data: [
-        { label: "TypeScript", value: 65, color: "blue" },
-        { label: "Python", value: 20, color: "yellow" },
-        { label: "Rust", value: 15, color: "red" }
-      ],
-      showPercentage: true
-    }
-  },
-  Table: {
-    props: import_zod.z.object({
-      columns: import_zod.z.array(
-        import_zod.z.object({
-          header: import_zod.z.string(),
-          key: import_zod.z.string(),
-          width: import_zod.z.number().max(200).nullable(),
-          align: import_zod.z.enum(["left", "center", "right"]).nullable()
-        })
-      ),
-      rows: import_zod.z.array(import_zod.z.record(import_zod.z.string(), import_zod.z.string())),
-      borderStyle: import_zod.z.enum(["single", "double", "round", "bold", "classic"]).nullable(),
-      backgroundColor: import_zod.z.string().nullable(),
-      headerColor: import_zod.z.string().nullable()
-    }),
-    slots: [],
-    description: "Tabular data display with headers and rows. Each row is a record mapping column keys to string values. Set both borderStyle and backgroundColor together so borders share the same shading.",
-    example: {
-      columns: [
-        { header: "Name", key: "name", width: 20 },
-        { header: "Status", key: "status", width: 10 }
-      ],
-      rows: [
-        { name: "api-server", status: "running" },
-        { name: "worker", status: "stopped" }
-      ],
-      headerColor: "cyan"
-    }
-  },
-  List: {
-    props: import_zod.z.object({
-      items: import_zod.z.array(import_zod.z.string()),
-      ordered: import_zod.z.boolean().nullable(),
-      bulletChar: import_zod.z.string().nullable(),
-      spacing: import_zod.z.number().nullable()
-    }),
-    slots: [],
-    description: "Bulleted or numbered list. Each item is a string. Use for simple enumerations.",
-    example: {
-      items: ["Install dependencies", "Run tests", "Deploy"],
-      ordered: true
-    }
-  },
-  ListItem: {
-    props: import_zod.z.object({
-      title: import_zod.z.string(),
-      subtitle: import_zod.z.string().nullable(),
-      leading: import_zod.z.string().nullable(),
-      trailing: import_zod.z.string().nullable()
-    }),
-    slots: [],
-    description: "Structured list row with title, optional subtitle, and leading/trailing text. Use with repeat for dynamic lists.",
-    example: {
-      title: "package.json",
-      subtitle: "Modified 2 hours ago",
-      leading: "*",
-      trailing: "2.1 KB"
-    }
-  },
-  Card: {
-    props: import_zod.z.object({
-      title: import_zod.z.string().nullable(),
-      backgroundColor: import_zod.z.string().nullable(),
-      padding: import_zod.z.number().nullable()
-    }),
-    slots: ["default"],
-    description: "Shaded container with optional title. Renders as a filled background area for grouping related content. Default background is a subtle dark shade.",
-    example: { title: "Details", padding: 1 }
-  },
-  KeyValue: {
-    props: import_zod.z.object({
-      label: import_zod.z.string(),
-      value: import_zod.z.union([import_zod.z.string(), import_zod.z.number(), import_zod.z.array(import_zod.z.string())]),
-      labelColor: import_zod.z.string().nullable(),
-      separator: import_zod.z.string().nullable()
-    }),
-    slots: [],
-    description: "Key-value pair display. Renders label and value on the same line. Value can be a string, number, or array of strings (joined with commas). Default separator is a colon.",
-    example: { label: "Status", value: "Running", labelColor: "cyan" }
-  },
-  Link: {
-    props: import_zod.z.object({
-      url: import_zod.z.string(),
-      label: import_zod.z.string().nullable(),
-      color: import_zod.z.string().nullable()
-    }),
-    slots: [],
-    description: 'Renders a URL as underlined text. If label is provided, shows "label (url)". Most terminals make URLs clickable automatically.',
-    example: { url: "https://github.com/vercel/next.js", label: "Next.js" }
-  },
-  StatusLine: {
-    props: import_zod.z.object({
-      text: import_zod.z.string(),
-      status: import_zod.z.enum(["info", "success", "warning", "error"]).nullable(),
-      icon: import_zod.z.string().nullable()
-    }),
-    slots: [],
-    description: "Status message with colored icon. Default icons: info=\u2139, success=\u2714, warning=\u26A0, error=\u2716.",
-    example: { text: "Build completed successfully", status: "success" }
-  },
-  Metric: {
-    props: import_zod.z.object({
-      label: import_zod.z.string(),
-      value: import_zod.z.string(),
-      detail: import_zod.z.string().nullable(),
-      trend: import_zod.z.enum(["up", "down", "neutral"]).nullable()
-    }),
-    slots: [],
-    description: "Key metric display with prominent value and optional trend indicator. Use for important numbers that deserve visual emphasis (price, temperature, stars, market cap).",
-    example: {
-      label: "Price",
-      value: "$70,686",
-      detail: "24h change",
-      trend: "up"
-    }
-  },
-  Callout: {
-    props: import_zod.z.object({
-      type: import_zod.z.enum(["info", "tip", "warning", "important"]).nullable(),
-      title: import_zod.z.string().nullable(),
-      content: import_zod.z.string()
-    }),
-    slots: [],
-    description: "Highlighted callout block with colored left border. Use for key takeaways, tips, warnings, or important notes that should stand out from surrounding content.",
-    example: {
-      type: "tip",
-      title: "Key Takeaway",
-      content: "Revenue peaked in FY2022 driven by iPhone 13/14 upgrade cycles."
-    }
-  },
-  Timeline: {
-    props: import_zod.z.object({
-      items: import_zod.z.array(
-        import_zod.z.object({
-          title: import_zod.z.string(),
-          description: import_zod.z.string().nullable(),
-          date: import_zod.z.string().nullable(),
-          status: import_zod.z.enum(["completed", "current", "upcoming"]).nullable()
-        })
-      )
-    }),
-    slots: [],
-    description: "Vertical timeline showing ordered events, steps, or milestones. Each item has a status-colored dot, title, optional date, and optional description.",
-    example: {
-      items: [
-        {
-          title: "Project Started",
-          description: "Initial commit and setup",
-          date: "Jan 2024",
-          status: "completed"
-        },
-        {
-          title: "Beta Release",
-          description: "Public beta launched",
-          date: "Mar 2024",
-          status: "current"
-        },
-        { title: "v1.0", date: "Q2 2024", status: "upcoming" }
-      ]
-    }
-  },
-  // ==========================================================================
-  // Interactive Components
-  // ==========================================================================
-  TextInput: {
-    props: import_zod.z.object({
-      placeholder: import_zod.z.string().nullable(),
-      value: import_zod.z.string().nullable(),
-      label: import_zod.z.string().nullable(),
-      mask: import_zod.z.string().nullable()
-    }),
-    events: ["submit", "change"],
-    slots: [],
-    description: "Text input field for terminal. Use $bindState to bind to the state model for two-way binding. Press Enter to submit. Set mask to '*' for password fields.",
-    example: { placeholder: "Type here...", label: "Name" }
-  },
-  Select: {
-    props: import_zod.z.object({
-      options: import_zod.z.array(
-        import_zod.z.object({
-          label: import_zod.z.string(),
-          value: import_zod.z.string()
-        })
-      ),
-      value: import_zod.z.string().nullable(),
-      label: import_zod.z.string().nullable()
-    }),
-    events: ["change"],
-    slots: [],
-    description: "Selection menu navigated with arrow keys. Use $bindState on value to bind the selected value to state. Press Enter to confirm selection.",
-    example: {
-      options: [
-        { label: "Development", value: "dev" },
-        { label: "Staging", value: "staging" },
-        { label: "Production", value: "prod" }
-      ],
-      label: "Environment"
-    }
-  },
-  MultiSelect: {
-    props: import_zod.z.object({
-      options: import_zod.z.array(
-        import_zod.z.object({
-          label: import_zod.z.string(),
-          value: import_zod.z.string()
-        })
-      ),
-      value: import_zod.z.array(import_zod.z.string()).nullable(),
-      label: import_zod.z.string().nullable(),
-      min: import_zod.z.number().nullable(),
-      max: import_zod.z.number().nullable()
-    }),
-    events: ["change", "submit"],
-    slots: [],
-    description: "Multi-selection menu. Navigate with arrow keys, toggle with space, confirm with enter. Use $bindState on value to bind the selected values array to state. Set min/max to constrain selection count.",
-    example: {
-      options: [
-        { label: "TypeScript", value: "ts" },
-        { label: "Python", value: "py" },
-        { label: "Rust", value: "rs" },
-        { label: "Go", value: "go" }
-      ],
-      label: "Languages"
-    }
-  },
-  ConfirmInput: {
-    props: import_zod.z.object({
-      message: import_zod.z.string().nullable(),
-      defaultValue: import_zod.z.boolean().nullable(),
-      yesLabel: import_zod.z.string().nullable(),
-      noLabel: import_zod.z.string().nullable()
-    }),
-    events: ["confirm", "deny"],
-    slots: [],
-    description: "Yes/No confirmation prompt. Press Y to confirm, N to deny. Use for destructive or irreversible actions.",
-    example: {
-      message: "Delete all files?"
-    }
-  },
-  Tabs: {
-    props: import_zod.z.object({
-      tabs: import_zod.z.array(
-        import_zod.z.object({
-          label: import_zod.z.string(),
-          value: import_zod.z.string(),
-          icon: import_zod.z.string().nullable()
-        })
-      ),
-      value: import_zod.z.string().nullable(),
-      color: import_zod.z.string().nullable()
-    }),
-    events: ["change"],
-    slots: ["default"],
-    description: "Tab bar navigation. Navigate with left/right arrow keys. Use $bindState on value to bind the active tab to state. Place child content inside and use visible conditions on children to show content for the active tab.",
-    example: {
-      tabs: [
-        { label: "Overview", value: "overview" },
-        { label: "Logs", value: "logs" },
-        { label: "Settings", value: "settings" }
-      ]
-    }
-  },
-  Markdown: {
-    props: import_zod.z.object({
-      text: import_zod.z.string()
-    }),
-    slots: [],
-    description: "Renders markdown-formatted text with proper terminal styling. Supports headings (#), **bold**, *italic*, `inline code`, ~~strikethrough~~, fenced code blocks, lists (ordered and unordered), blockquotes (>), and horizontal rules (---).",
-    example: {
-      text: "## Overview\n\nThis is **bold** and *italic* text with `inline code`.\n\n- First item\n- Second item\n\n> A blockquote"
-    }
-  }
-};
-var standardActionDefinitions = {
-  setState: {
-    params: import_zod.z.object({
-      statePath: import_zod.z.string(),
-      value: import_zod.z.unknown()
-    }),
-    description: "Update a value in the state model at the given statePath."
-  },
-  pushState: {
-    params: import_zod.z.object({
-      statePath: import_zod.z.string(),
-      value: import_zod.z.unknown(),
-      clearStatePath: import_zod.z.string().optional()
-    }),
-    description: 'Append an item to an array in the state model. The value can contain { $state: "/statePath" } references and "$id" for auto IDs. Use clearStatePath to reset another path after pushing.'
-  },
-  removeState: {
-    params: import_zod.z.object({
-      statePath: import_zod.z.string(),
-      index: import_zod.z.number()
-    }),
-    description: "Remove an item from an array in the state model at the given index."
-  },
-  exit: {
-    params: import_zod.z.object({
-      code: import_zod.z.number().optional()
-    }),
-    description: "Exit the terminal application. Optional exit code (default 0)."
-  },
-  log: {
-    params: import_zod.z.object({
-      message: import_zod.z.string()
-    }),
-    description: "Write a message to stdout outside the Ink render. Useful for persistent output that should remain visible after the UI updates."
-  }
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  ActionProvider,
-  ConfirmDialog,
-  FocusProvider,
-  JSONUIProvider,
-  Renderer,
-  RepeatScopeProvider,
-  StateProvider,
-  ValidationProvider,
-  VisibilityProvider,
-  createRenderer,
-  createStateStore,
-  defineRegistry,
-  flatToTree,
-  schema,
-  standardActionDefinitions,
-  standardComponentDefinitions,
-  standardComponents,
-  useAction,
-  useActions,
-  useBoundProp,
-  useFieldValidation,
-  useFocus,
-  useFocusDisable,
-  useIsVisible,
-  useOptionalValidation,
-  useRepeatScope,
-  useStateBinding,
-  useStateStore,
-  useStateValue,
-  useUIStream,
-  useValidation,
-  useVisibility
-});
-//# sourceMappingURL=index.js.map