@hanzo/ui 8.0.21 → 8.0.23

package/dist/framework.js

@@ -0,0 +1,727 @@
+'use client';
+import { HanzoMark } from './chunk-7P7R7FC5.js';
+import './chunk-77AMCLN4.js';
+import { classifyBackend, PageHeader, BackendStateCard, PrimaryButton, EmptyState } from './chunk-P2P6ST6J.js';
+import './chunk-FVQXROBK.js';
+import './chunk-ZGTJCJ55.js';
+import { YStack, Text, Card, XStack, Button } from '@hanzo/gui';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { useState, useCallback, useEffect, useMemo } from 'react';
+import { Plus, TriangleAlert, Boxes, X, Save, Trash2, Ban, Send, PenOff, Globe, Pencil, ArrowLeft, RefreshCw } from '@hanzogui/lucide-icons-2';
+import { RecordsView, RecordForm, RecordDetail } from '@hanzo/data';
+
+// src/framework/types.ts
+var REDACTED_MARKER = "__set__";
+
+// src/framework/fields.ts
+var TYPE_MAP = {
+  Data: "text",
+  SmallText: "text",
+  Text: "longText",
+  LongText: "longText",
+  RichText: "richText",
+  Int: "number",
+  Float: "number",
+  Currency: "currency",
+  Check: "boolean",
+  Date: "date",
+  Datetime: "dateTime",
+  Select: "select",
+  Link: "relation",
+  Table: "json",
+  Attach: "url",
+  JSON: "json",
+  Password: "text"
+};
+var ACRONYMS = /* @__PURE__ */ new Set(["id", "url", "seo", "api", "ip"]);
+function humanize(name) {
+  return name.replace(/[_-]+/g, " ").replace(/([a-z0-9])([A-Z])/g, "$1 $2").trim().split(/\s+/).filter(Boolean).map((w) => ACRONYMS.has(w.toLowerCase()) ? w.toUpperCase() : w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
+}
+function selectOptions(options) {
+  return (options ?? "").split("\n").map((s) => s.replace(/\r$/, "").trim()).filter(Boolean).map((v) => ({ value: v, label: v }));
+}
+function metadataFor(f) {
+  switch (f.fieldtype) {
+    case "Select":
+      return { options: selectOptions(f.options) };
+    case "Currency":
+      return { currencyCode: "USD" };
+    case "Int":
+      return { decimals: 0 };
+    case "Link":
+      return { objectName: f.options };
+    default:
+      return void 0;
+  }
+}
+function autonameSource(dt) {
+  const a = (dt.autoname ?? "").trim();
+  return a.startsWith("field:") ? a.slice("field:".length).trim() : "";
+}
+function docTypeToFields(dt, opts = {}) {
+  const src = autonameSource(dt);
+  return (dt.fields ?? []).filter((f) => !f.hidden).map((f) => {
+    const readOnly = f.readOnly || opts.editing && f.fieldname === src || void 0;
+    const metadata = metadataFor(f);
+    return {
+      name: f.fieldname,
+      label: f.label || humanize(f.fieldname),
+      type: TYPE_MAP[f.fieldtype] ?? "text",
+      ...metadata ? { metadata } : {},
+      ...readOnly ? { readOnly: true } : {}
+    };
+  });
+}
+function statusField(dt) {
+  const f = (dt.fields ?? []).find(
+    (x) => x.fieldtype === "Select" && x.fieldname === "status" && (x.options ?? "").includes("Published")
+  );
+  return f ? f.fieldname : "";
+}
+function listHiddenFields(dt) {
+  const anyListed = (dt.fields ?? []).some((f) => f.inListView);
+  if (!anyListed) return [];
+  return (dt.fields ?? []).filter((f) => !f.inListView && !f.hidden).map((f) => f.fieldname);
+}
+function isMediaDoctype(dt) {
+  return (dt.fields ?? []).some((f) => f.fieldtype === "Attach" && f.reqd);
+}
+function mediaFileField(dt) {
+  const f = (dt.fields ?? []).find((x) => x.fieldtype === "Attach" && x.reqd) ?? (dt.fields ?? []).find((x) => x.fieldtype === "Attach");
+  return f ? f.fieldname : "";
+}
+function moduleDoctypes(dts, module) {
+  return dts.filter((dt) => (dt.module ?? "") === module);
+}
+var PROJECT_FIELD = "project";
+function hasProjectField(dt) {
+  return (dt.fields ?? []).some((f) => f.fieldname === PROJECT_FIELD);
+}
+function titleOf(doc, dt) {
+  if (dt.titleField && typeof doc[dt.titleField] === "string" && doc[dt.titleField]) return String(doc[dt.titleField]);
+  return typeof doc.name === "string" && doc.name ? doc.name : "(untitled)";
+}
+function slugify(s) {
+  return String(s ?? "").normalize("NFKD").replace(/[\u0300-\u036f]/g, "").toLowerCase().trim().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
+}
+function isValidDoctypeName(name) {
+  return /^[A-Za-z0-9][A-Za-z0-9_-]*$/.test(name.trim());
+}
+var secToMs = (v) => {
+  const n = Number(v);
+  return Number.isFinite(n) && n > 0 ? n * 1e3 : void 0;
+};
+var numOrNull = (v) => {
+  const n = Number(v);
+  return Number.isFinite(n) ? n : null;
+};
+function coerceForDisplay(f, v) {
+  switch (f.fieldtype) {
+    case "Currency":
+      return { amount: numOrNull(v), currencyCode: "USD" };
+    case "Check":
+      return v === 1 || v === true || v === "1";
+    case "Datetime":
+      return typeof v === "string" ? v.replace(" ", "T") : v;
+    case "Password":
+      return v === REDACTED_MARKER ? "" : v;
+    // never surface the marker
+    default:
+      return v;
+  }
+}
+function toRecord(doc, dt) {
+  const rec = {
+    id: doc.name,
+    name: doc.name,
+    doctype: doc.doctype,
+    docstatus: doc.docstatus,
+    createdAt: secToMs(doc.createdAt),
+    updatedAt: secToMs(doc.updatedAt)
+  };
+  for (const f of dt.fields ?? []) {
+    if (!(f.fieldname in doc)) continue;
+    rec[f.fieldname] = coerceForDisplay(f, doc[f.fieldname]);
+  }
+  return rec;
+}
+function coerceForWrite(f, v) {
+  switch (f.fieldtype) {
+    case "Currency":
+      return v && typeof v === "object" && "amount" in v ? Number(v.amount) : Number(v);
+    case "Check":
+      return Boolean(v);
+    case "Int":
+    case "Float":
+      return Number(v);
+    case "Datetime":
+      if (v instanceof Date) return v.toISOString();
+      if (typeof v === "number" && Number.isFinite(v)) return new Date(v).toISOString();
+      return v;
+    case "Link":
+      if (v == null || v === "") return "";
+      if (typeof v === "object") return String(v.id ?? v.value ?? "");
+      return v;
+    default:
+      return v;
+  }
+}
+function enrichLinks(record, dt, optionsByField) {
+  const out = { ...record };
+  for (const f of dt.fields ?? []) {
+    if (f.fieldtype !== "Link") continue;
+    const raw = out[f.fieldname];
+    if (typeof raw === "string" && raw) {
+      const opt = (optionsByField[f.fieldname] ?? []).find((o) => o.value === raw);
+      out[f.fieldname] = { id: raw, label: opt?.label ?? raw };
+    }
+  }
+  return out;
+}
+function linkFields(dt) {
+  return (dt.fields ?? []).filter((f) => f.fieldtype === "Link");
+}
+function newDraft(dt) {
+  const out = {};
+  for (const f of dt.fields ?? []) {
+    if (f.default === void 0 || f.default === "") continue;
+    out[f.fieldname] = f.fieldtype === "Check" ? f.default === "1" || f.default === "true" : f.default;
+  }
+  return out;
+}
+function savePayload(draft, dt) {
+  const src = autonameSource(dt);
+  const out = {};
+  for (const f of dt.fields ?? []) {
+    if (f.readOnly) continue;
+    let v = draft[f.fieldname];
+    if (v === void 0) continue;
+    v = coerceForWrite(f, v);
+    if (f.fieldname === src && typeof v === "string") v = slugify(v);
+    out[f.fieldname] = v;
+  }
+  return out;
+}
+
+// src/framework/client.ts
+var enc = encodeURIComponent;
+var asRecord = (v) => v && typeof v === "object" && !Array.isArray(v) ? v : {};
+function rows(payload) {
+  if (Array.isArray(payload)) return payload.filter((x) => x && typeof x === "object");
+  const o = asRecord(payload);
+  for (const k of ["data", "items", "rows"]) {
+    if (Array.isArray(o[k])) return o[k].filter((x) => x && typeof x === "object");
+  }
+  return [];
+}
+var asDoc = (v) => asRecord(v);
+var asDocType = (v) => {
+  const r = asRecord(v);
+  return { ...r, name: String(r.name ?? ""), fields: Array.isArray(r.fields) ? r.fields : [] };
+};
+function listQuery(q) {
+  if (!q) return "";
+  const p = new URLSearchParams();
+  if (q.filters && Object.keys(q.filters).length) p.set("filters", JSON.stringify(q.filters));
+  if (q.fields && q.fields.length) p.set("fields", q.fields.join(","));
+  if (q.orderBy) p.set("order_by", q.orderBy);
+  if (q.limit) p.set("limit", String(q.limit));
+  const s = p.toString();
+  return s ? `?${s}` : "";
+}
+function createFrameworkClient(t) {
+  return {
+    /** The DocType registry (schemas) — the collection definitions of every app lane. */
+    doctypes: {
+      list: () => t.get("doctypes").then((r) => rows(r).map(asDocType)),
+      get: (name) => t.get(`doctypes/${enc(name)}`).then(asDocType),
+      create: (dt) => t.post("doctypes", dt).then(asDocType),
+      update: (name, dt) => t.put(`doctypes/${enc(name)}`, dt).then(asDocType),
+      remove: (name) => t.del(`doctypes/${enc(name)}`)
+    },
+    /** Generic, metadata-driven document CRUD — the SAME calls for ANY doctype. */
+    records: {
+      list: (doctype, q) => t.get(`${enc(doctype)}${listQuery(q)}`).then((r) => rows(r).map(asDoc)),
+      get: (doctype, name) => t.get(`${enc(doctype)}/${enc(name)}`).then(asDoc),
+      create: (doctype, data) => t.post(enc(doctype), data).then(asDoc),
+      update: (doctype, name, data) => t.put(`${enc(doctype)}/${enc(name)}`, data).then(asDoc),
+      remove: (doctype, name) => t.del(`${enc(doctype)}/${enc(name)}`),
+      submit: (doctype, name) => t.post(`${enc(doctype)}/${enc(name)}/submit`).then(asDoc),
+      cancel: (doctype, name) => t.post(`${enc(doctype)}/${enc(name)}/cancel`).then(asDoc)
+    },
+    /** App-lane fixtures: list the registered lanes, inspect one, install into the org. */
+    modules: {
+      list: () => t.get("modules").then(
+        (r) => rows(r).map((m) => ({
+          module: String(m.module ?? ""),
+          doctypes: Array.isArray(m.doctypes) ? m.doctypes : []
+        }))
+      ),
+      get: (module) => t.get(`modules/${enc(module)}`).then((v) => {
+        const r = asRecord(v);
+        return {
+          module: String(r.module ?? module),
+          doctypes: Array.isArray(r.doctypes) ? r.doctypes : [],
+          installed: Array.isArray(r.installed) ? r.installed : []
+        };
+      }),
+      install: (module) => t.post(`modules/${enc(module)}/install`).then((v) => {
+        const r = asRecord(v);
+        return {
+          module: String(r.module ?? module),
+          created: Array.isArray(r.created) ? r.created : [],
+          existing: Array.isArray(r.existing) ? r.existing : []
+        };
+      })
+    },
+    /** Per-org role assignments (grant editors; the owner is seeded System Manager). */
+    roles: {
+      list: () => t.get("roles").then((r) => rows(r).map((x) => ({ user: String(x.user ?? ""), role: String(x.role ?? "") }))),
+      assign: (user, role) => t.post("roles", { user, role }).then(() => void 0),
+      revoke: (user, role) => t.del(`roles/${enc(user)}/${enc(role)}`)
+    }
+  };
+}
+var FrameworkHttpError = class extends Error {
+  constructor(status, message) {
+    super(message);
+    this.status = status;
+    this.name = "FrameworkHttpError";
+  }
+  status;
+};
+function fetchTransport(opts) {
+  const base = opts.baseUrl.replace(/\/+$/, "");
+  const doFetch = opts.fetchImpl ?? ((...a) => fetch(...a));
+  async function req(method, path, body) {
+    const tok = opts.token?.();
+    const res = await doFetch(`${base}/${path}`, {
+      method,
+      headers: {
+        Accept: "application/json",
+        ...body === void 0 ? null : { "Content-Type": "application/json" },
+        ...tok ? { Authorization: `Bearer ${tok}` } : null
+      },
+      ...body === void 0 ? null : { body: JSON.stringify(body) }
+    });
+    const text = await res.text();
+    let payload = null;
+    try {
+      payload = text ? JSON.parse(text) : null;
+    } catch {
+      payload = null;
+    }
+    if (!res.ok) {
+      const o = asRecord(payload);
+      const said = [o.error, o.msg, o.message].find((v) => typeof v === "string" && v.trim() !== "");
+      throw new FrameworkHttpError(res.status, typeof said === "string" ? said : `HTTP ${res.status}`);
+    }
+    return payload;
+  }
+  return {
+    get: (p) => req("GET", p),
+    post: (p, b) => req("POST", p, b),
+    put: (p, b) => req("PUT", p, b),
+    del: (p) => req("DELETE", p).then(() => void 0)
+  };
+}
+
+// src/framework/data.ts
+async function loadLinkOptions(client, dt) {
+  const links = linkFields(dt);
+  const out = {};
+  await Promise.all(
+    links.map(async (f) => {
+      const target = f.options;
+      if (!target) return;
+      const [tdt, docs] = await Promise.all([
+        client.doctypes.get(target).catch(() => null),
+        client.records.list(target, { limit: 200 }).catch(() => [])
+      ]);
+      out[f.fieldname] = docs.map((d) => ({
+        value: String(d.name),
+        label: tdt ? titleOf(d, tdt) : String(d.name)
+      }));
+    })
+  );
+  return out;
+}
+function makeFieldOptions(linkOptions) {
+  return (field) => {
+    if (field.type === "relation") return linkOptions[field.name] ?? [];
+    if (field.type === "select" || field.type === "multiSelect") {
+      return field.metadata?.options;
+    }
+    return void 0;
+  };
+}
+function Loader({ label, size = 40 }) {
+  return /* @__PURE__ */ jsxs(YStack, { flex: 1, minH: 280, items: "center", justify: "center", gap: "$3", children: [
+    /* @__PURE__ */ jsx("style", { children: "@keyframes hz-pulse{0%,100%{opacity:.45}50%{opacity:1}}.hz-pulse{animation:hz-pulse 1.5s ease-in-out infinite;display:inline-flex}@media (prefers-reduced-motion:reduce){.hz-pulse{animation:none}}" }),
+    /* @__PURE__ */ jsx("div", { className: "hz-pulse", children: /* @__PURE__ */ jsx(HanzoMark, { size }) }),
+    label ? /* @__PURE__ */ jsx(Text, { fontSize: "$3", color: "$color11", children: label }) : null
+  ] });
+}
+function CollectionsBrowser({ client, module, label, subtitle, onOpen, setupDescription, setupBullets, renderBuilder }) {
+  const [state, setState] = useState({ phase: "loading" });
+  const [busy, setBusy] = useState(false);
+  const [creating, setCreating] = useState(false);
+  const [actionError, setActionError] = useState(null);
+  const load = useCallback(
+    async (signal) => {
+      setState({ phase: "loading" });
+      try {
+        const [dts, mod] = await Promise.all([
+          client.doctypes.list(),
+          client.modules.get(module).catch(() => null)
+          // module may not be registered on older cloud
+        ]);
+        if (signal.cancelled) return;
+        setState({ phase: "ready", collections: moduleDoctypes(dts, module), registered: Boolean(mod && mod.doctypes.length) });
+      } catch (e) {
+        if (!signal.cancelled) setState({ phase: "error", error: classifyBackend(e) });
+      }
+    },
+    [client, module]
+  );
+  useEffect(() => {
+    const signal = { cancelled: false };
+    void load(signal);
+    return () => {
+      signal.cancelled = true;
+    };
+  }, [load]);
+  const reload = useCallback(() => void load({ cancelled: false }), [load]);
+  const install = useCallback(async () => {
+    setBusy(true);
+    setActionError(null);
+    try {
+      await client.modules.install(module);
+      reload();
+    } catch (e) {
+      setActionError(classifyBackend(e).message);
+    } finally {
+      setBusy(false);
+    }
+  }, [client, module, reload]);
+  if (state.phase === "loading") return /* @__PURE__ */ jsx(Loader, { label: `Loading ${label}\u2026` });
+  if (state.phase === "error") {
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(PageHeader, { title: label, subtitle }),
+      /* @__PURE__ */ jsx(BackendStateCard, { state: state.error, onRetry: reload, hint: "framework \xB7 GET /v1/framework/doctypes" })
+    ] });
+  }
+  const { collections } = state;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      PageHeader,
+      {
+        title: label,
+        subtitle,
+        actions: renderBuilder && collections.length && !creating ? /* @__PURE__ */ jsx(PrimaryButton, { size: "$2", icon: /* @__PURE__ */ jsx(Plus, { size: 15 }), onPress: () => {
+          setCreating(true);
+          setActionError(null);
+        }, children: "New collection" }) : void 0
+      }
+    ),
+    actionError ? /* @__PURE__ */ jsx(Card, { borderWidth: 1, borderColor: "$red7", bg: "$red2", p: "$3", mb: "$3", maxWidth: 620, children: /* @__PURE__ */ jsxs(XStack, { gap: "$2", items: "center", children: [
+      /* @__PURE__ */ jsx(TriangleAlert, { size: 15 }),
+      /* @__PURE__ */ jsx(Text, { fontSize: "$3", color: "$red11", children: actionError })
+    ] }) }) : null,
+    creating && renderBuilder ? /* @__PURE__ */ jsx(YStack, { mb: "$3", children: renderBuilder({
+      onSaved: (name) => {
+        setCreating(false);
+        onOpen(name);
+      },
+      onCancel: () => setCreating(false)
+    }) }) : null,
+    collections.length === 0 && !creating ? /* @__PURE__ */ jsx(
+      EmptyState,
+      {
+        icon: Boxes,
+        title: `Set up ${label}`,
+        description: setupDescription ?? `${label} is a set of content collections \u2014 Pages, Posts, Articles, Media, and Navigation \u2014 as DocTypes on the Hanzo Framework, per organization.`,
+        bullets: setupBullets ?? [
+          "Installs the default collections into your organization",
+          "Content is documents on the framework \u2014 versioned, permissioned, per-org",
+          "Add your own collections and fields any time"
+        ],
+        primary: state.registered ? { label: busy ? "Setting up\u2026" : `Set up ${label}`, onPress: install } : void 0,
+        secondary: renderBuilder ? { label: "New collection", onPress: () => setCreating(true) } : void 0
+      }
+    ) : !creating ? /* @__PURE__ */ jsx(XStack, { gap: "$3", flexWrap: "wrap", children: collections.map((dt) => /* @__PURE__ */ jsxs(
+      YStack,
+      {
+        onPress: () => onOpen(dt.name),
+        hoverStyle: { borderColor: "$color8" },
+        cursor: "pointer",
+        borderWidth: 1,
+        borderColor: "$borderColor",
+        rounded: "$4",
+        p: "$4",
+        gap: "$2",
+        width: 240,
+        children: [
+          /* @__PURE__ */ jsxs(XStack, { gap: "$2", items: "center", children: [
+            /* @__PURE__ */ jsx(Boxes, { size: 16 }),
+            /* @__PURE__ */ jsx(Text, { fontSize: "$4", fontWeight: "700", numberOfLines: 1, children: dt.name })
+          ] }),
+          /* @__PURE__ */ jsxs(Text, { fontSize: "$2", color: "$color10", children: [
+            dt.fields?.length ?? 0,
+            " field",
+            (dt.fields?.length ?? 0) === 1 ? "" : "s",
+            dt.isSubmittable ? " \xB7 submittable" : ""
+          ] })
+        ]
+      },
+      dt.name
+    )) }) : null
+  ] });
+}
+function DocTypeRecords({ client, doctype, onOpen, onCreate, project, title, renderMedia }) {
+  const [state, setState] = useState({ phase: "loading" });
+  const [mutationError, setMutationError] = useState(null);
+  const load = useCallback(
+    async (signal) => {
+      setState({ phase: "loading" });
+      try {
+        const dt = await client.doctypes.get(doctype);
+        const linkOptions = await loadLinkOptions(client, dt);
+        const filters = project && hasProjectField(dt) ? { [PROJECT_FIELD]: project } : void 0;
+        const docs = await client.records.list(doctype, { limit: 200, ...filters ? { filters } : {} });
+        if (signal.cancelled) return;
+        const records = docs.map((d) => enrichLinks(toRecord(d, dt), dt, linkOptions));
+        setState({ phase: "ready", dt, fields: docTypeToFields(dt), docs, records, linkOptions });
+      } catch (e) {
+        if (!signal.cancelled) setState({ phase: "error", error: classifyBackend(e) });
+      }
+    },
+    [client, doctype, project]
+  );
+  useEffect(() => {
+    const signal = { cancelled: false };
+    void load(signal);
+    return () => {
+      signal.cancelled = true;
+    };
+  }, [load]);
+  const reload = useCallback(() => void load({ cancelled: false }), [load]);
+  const fieldOptions = useMemo(
+    () => state.phase === "ready" ? makeFieldOptions(state.linkOptions) : void 0,
+    [state]
+  );
+  const onEditCommit = useCallback(
+    async (record, field, value) => {
+      if (state.phase !== "ready") return;
+      const name = typeof record.name === "string" ? record.name : "";
+      if (!name) return;
+      setMutationError(null);
+      try {
+        const body = savePayload({ ...record, [field.name]: value }, state.dt);
+        const saved = await client.records.update(doctype, name, body);
+        const next = enrichLinks(toRecord(saved, state.dt), state.dt, state.linkOptions);
+        setState((s) => s.phase === "ready" ? { ...s, records: s.records.map((r) => r.name === name ? next : r) } : s);
+      } catch (e) {
+        setMutationError(classifyBackend(e).message);
+        throw e;
+      }
+    },
+    [client, doctype, state]
+  );
+  if (state.phase === "error") {
+    return /* @__PURE__ */ jsx(BackendStateCard, { state: state.error, onRetry: reload, hint: `framework \xB7 GET /v1/framework/${doctype}` });
+  }
+  const refresh = /* @__PURE__ */ jsx(Button, { size: "$2", icon: /* @__PURE__ */ jsx(RefreshCw, { size: 15 }), onPress: reload, children: "Refresh" });
+  if (renderMedia && state.phase === "ready" && isMediaDoctype(state.dt)) {
+    return /* @__PURE__ */ jsx(Fragment, { children: renderMedia({ dt: state.dt, docs: state.docs, onOpen, onChanged: reload, toolbarExtra: refresh }) });
+  }
+  const ready = state.phase === "ready" ? state : void 0;
+  return /* @__PURE__ */ jsx(
+    RecordsView,
+    {
+      title,
+      fields: ready?.fields ?? [],
+      records: ready?.records ?? [],
+      loading: state.phase === "loading",
+      onOpen: (r) => onOpen(String(r.name ?? r.id ?? "")),
+      onCreate,
+      createLabel: "New record",
+      onEditCommit,
+      fieldOptions,
+      toolbarExtra: refresh,
+      empty: mutationError ?? `No records in ${doctype} yet.`
+    }
+  );
+}
+function DocTypeDetail({ client, doctype, name, project, onBack, onView }) {
+  const isNew = name === "new";
+  const [state, setState] = useState({ phase: "loading" });
+  const [editing, setEditing] = useState(isNew);
+  const [draft, setDraft] = useState({});
+  const [busy, setBusy] = useState(false);
+  const [saveError, setSaveError] = useState(null);
+  const [confirmingDelete, setConfirmingDelete] = useState(false);
+  const load = useCallback(
+    async (signal) => {
+      setState({ phase: "loading" });
+      try {
+        const dt2 = await client.doctypes.get(doctype);
+        const linkOptions = await loadLinkOptions(client, dt2);
+        const doc = isNew ? null : await client.records.get(doctype, name);
+        if (signal.cancelled) return;
+        const record2 = doc ? enrichLinks(toRecord(doc, dt2), dt2, linkOptions) : null;
+        setState({ phase: "ready", dt: dt2, record: record2, linkOptions });
+        const seed = newDraft(dt2);
+        if (record2 == null && project && hasProjectField(dt2)) seed[PROJECT_FIELD] = project;
+        setDraft(record2 ? { ...record2 } : seed);
+        setEditing(isNew);
+        setSaveError(null);
+        setConfirmingDelete(false);
+      } catch (e) {
+        if (!signal.cancelled) setState({ phase: "error", error: classifyBackend(e) });
+      }
+    },
+    [client, doctype, name, isNew, project]
+  );
+  useEffect(() => {
+    const signal = { cancelled: false };
+    void load(signal);
+    return () => {
+      signal.cancelled = true;
+    };
+  }, [load]);
+  const reload = useCallback(() => void load({ cancelled: false }), [load]);
+  const ready = state.phase === "ready" ? state : void 0;
+  const dt = ready?.dt;
+  const record = ready?.record ?? null;
+  const fields = useMemo(
+    () => dt ? docTypeToFields(dt, { editing: !isNew }) : [],
+    [dt, isNew]
+  );
+  const fieldOptions = useMemo(() => ready ? makeFieldOptions(ready.linkOptions) : void 0, [ready]);
+  const title = dt ? isNew ? `New ${doctype}` : titleOf(record ?? {}, dt) : doctype;
+  const onChange = useCallback((field, value) => {
+    setDraft((d) => ({ ...d, [field]: value }));
+  }, []);
+  const reflect = useCallback(
+    (saved) => {
+      if (!dt || !ready) return;
+      const next = enrichLinks(toRecord(saved, dt), dt, ready.linkOptions);
+      setState({ phase: "ready", dt, record: next, linkOptions: ready.linkOptions });
+      setDraft({ ...next });
+    },
+    [dt, ready]
+  );
+  const save = useCallback(async () => {
+    if (!dt) return;
+    setBusy(true);
+    setSaveError(null);
+    try {
+      const body = savePayload(draft, dt);
+      if (isNew) {
+        const created = await client.records.create(doctype, body);
+        if (created.name) onView(String(created.name));
+        else onBack();
+        return;
+      }
+      if (!record?.name) throw new Error("This record has no name to update.");
+      reflect(await client.records.update(doctype, String(record.name), body));
+      setEditing(false);
+    } catch (e) {
+      setSaveError(classifyBackend(e).message);
+    } finally {
+      setBusy(false);
+    }
+  }, [client, doctype, draft, dt, isNew, onBack, onView, record, reflect]);
+  const run = useCallback(
+    async (op) => {
+      setBusy(true);
+      setSaveError(null);
+      try {
+        const saved = await op();
+        if (saved) reflect(saved);
+      } catch (e) {
+        setSaveError(classifyBackend(e).message);
+      } finally {
+        setBusy(false);
+      }
+    },
+    [reflect]
+  );
+  const remove = useCallback(async () => {
+    if (!record?.name) return;
+    setBusy(true);
+    setSaveError(null);
+    try {
+      await client.records.remove(doctype, String(record.name));
+      onBack();
+    } catch (e) {
+      setSaveError(classifyBackend(e).message);
+      setBusy(false);
+      setConfirmingDelete(false);
+    }
+  }, [client, doctype, onBack, record]);
+  const backButton = /* @__PURE__ */ jsx(Button, { size: "$2", icon: /* @__PURE__ */ jsx(ArrowLeft, { size: 15 }), onPress: onBack, children: "Back" });
+  if (state.phase === "error") {
+    return /* @__PURE__ */ jsxs(YStack, { gap: "$3", children: [
+      backButton,
+      /* @__PURE__ */ jsx(BackendStateCard, { state: state.error, onRetry: reload, hint: `framework \xB7 ${doctype}/${name}` })
+    ] });
+  }
+  if (!dt) return /* @__PURE__ */ jsx(YStack, { gap: "$3", children: backButton });
+  const statusF = statusField(dt);
+  const status = record ? String(record[statusF] ?? "") : "";
+  const docstatus = record ? Number(record.docstatus ?? 0) : 0;
+  const canPublish = !editing && !isNew && statusF && docstatus === 0;
+  const canSubmit = !editing && !isNew && dt.isSubmittable && docstatus === 0;
+  const canCancel = !editing && !isNew && dt.isSubmittable && docstatus === 1;
+  return /* @__PURE__ */ jsxs(YStack, { gap: "$3", children: [
+    /* @__PURE__ */ jsxs(XStack, { items: "center", justify: "space-between", gap: "$4", flexWrap: "wrap", children: [
+      /* @__PURE__ */ jsxs(XStack, { items: "center", gap: "$3", flex: 1, children: [
+        backButton,
+        /* @__PURE__ */ jsxs(YStack, { flex: 1, children: [
+          /* @__PURE__ */ jsx(Text, { fontSize: "$6", fontWeight: "800", numberOfLines: 1, children: title }),
+          /* @__PURE__ */ jsxs(Text, { fontSize: "$2", color: "$color10", children: [
+            doctype,
+            status ? ` \xB7 ${status}` : "",
+            docstatus === 1 ? " \xB7 submitted" : docstatus === 2 ? " \xB7 cancelled" : ""
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(XStack, { items: "center", gap: "$2", flexWrap: "wrap", children: editing ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        !isNew ? /* @__PURE__ */ jsx(Button, { size: "$2", icon: /* @__PURE__ */ jsx(X, { size: 15 }), disabled: busy, onPress: () => {
+          setDraft(record ? { ...record } : {});
+          setEditing(false);
+          setSaveError(null);
+        }, children: "Cancel" }) : null,
+        /* @__PURE__ */ jsx(PrimaryButton, { size: "$2", icon: /* @__PURE__ */ jsx(Save, { size: 15 }), disabled: busy, onPress: save, children: busy ? "Saving\u2026" : isNew ? "Create" : "Save" })
+      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Button, { size: "$2", theme: "red", icon: /* @__PURE__ */ jsx(Trash2, { size: 15 }), disabled: busy, onPress: () => setConfirmingDelete(true), children: "Delete" }),
+        canCancel ? /* @__PURE__ */ jsx(Button, { size: "$2", icon: /* @__PURE__ */ jsx(Ban, { size: 15 }), disabled: busy, onPress: () => run(() => client.records.cancel(doctype, String(record.name))), children: "Cancel doc" }) : null,
+        canSubmit ? /* @__PURE__ */ jsx(Button, { size: "$2", icon: /* @__PURE__ */ jsx(Send, { size: 15 }), disabled: busy, onPress: () => run(() => client.records.submit(doctype, String(record.name))), children: "Submit" }) : null,
+        canPublish ? status === "Published" ? /* @__PURE__ */ jsx(Button, { size: "$2", icon: /* @__PURE__ */ jsx(PenOff, { size: 15 }), disabled: busy, onPress: () => run(async () => client.records.update(doctype, String(record.name), savePayload({ ...record, [statusF]: "Draft" }, dt))), children: "Unpublish" }) : /* @__PURE__ */ jsx(PrimaryButton, { size: "$2", icon: /* @__PURE__ */ jsx(Globe, { size: 15 }), disabled: busy, onPress: () => run(async () => client.records.update(doctype, String(record.name), savePayload({ ...record, [statusF]: "Published" }, dt))), children: "Publish" }) : null,
+        /* @__PURE__ */ jsx(PrimaryButton, { size: "$2", icon: /* @__PURE__ */ jsx(Pencil, { size: 15 }), onPress: () => setEditing(true), children: "Edit" })
+      ] }) })
+    ] }),
+    confirmingDelete ? /* @__PURE__ */ jsxs(Card, { borderWidth: 1, borderColor: "$red7", bg: "$red2", p: "$3", gap: "$2", maxWidth: 620, children: [
+      /* @__PURE__ */ jsxs(Text, { fontSize: "$3", fontWeight: "700", children: [
+        "Delete \u201C",
+        title,
+        "\u201D? This cannot be undone."
+      ] }),
+      /* @__PURE__ */ jsxs(XStack, { gap: "$2", children: [
+        /* @__PURE__ */ jsx(Button, { size: "$2", theme: "red", disabled: busy, onPress: remove, children: busy ? "Deleting\u2026" : "Confirm delete" }),
+        /* @__PURE__ */ jsx(Button, { size: "$2", disabled: busy, onPress: () => setConfirmingDelete(false), children: "Cancel" })
+      ] })
+    ] }) : null,
+    saveError ? /* @__PURE__ */ jsx(Card, { borderWidth: 1, borderColor: "$red7", bg: "$red2", p: "$3", maxWidth: 620, children: /* @__PURE__ */ jsxs(XStack, { gap: "$2", items: "center", children: [
+      /* @__PURE__ */ jsx(TriangleAlert, { size: 15 }),
+      /* @__PURE__ */ jsx(Text, { fontSize: "$3", color: "$red11", children: saveError })
+    ] }) }) : null,
+    /* @__PURE__ */ jsx(Card, { borderWidth: 1, borderColor: "$borderColor", p: "$4", maxWidth: 760, children: editing ? /* @__PURE__ */ jsx(RecordForm, { fields, values: draft, onChange, fieldOptions }) : record ? /* @__PURE__ */ jsx(RecordDetail, { title, fields, record, fieldOptions }) : null })
+  ] });
+}
+
+export { CollectionsBrowser, DocTypeDetail, DocTypeRecords, FrameworkHttpError, Loader, PROJECT_FIELD, REDACTED_MARKER, autonameSource, createFrameworkClient, docTypeToFields, enrichLinks, fetchTransport, hasProjectField, humanize, isMediaDoctype, isValidDoctypeName, linkFields, listHiddenFields, listQuery, loadLinkOptions, makeFieldOptions, mediaFileField, moduleDoctypes, newDraft, savePayload, slugify, statusField, titleOf, toRecord };
+//# sourceMappingURL=framework.js.map
+//# sourceMappingURL=framework.js.map