@maykonpaulo/maestro-admin 0.1.2 → 0.2.0-next.1

package/dist/index.js

@@ -1,5 +1,5 @@
 // src/components/MaestroAdmin.tsx
-import { useMemo as useMemo2, useState as useState4 } from "react";
+import { useMemo as useMemo3, useState as useState9 } from "react";
 
 // src/client/MaestroClient.ts
 var MaestroApiError = class extends Error {
@@ -21,6 +21,9 @@ function buildListParams(query = {}) {
     if (query.searchFields?.length) params.set("searchFields", query.searchFields.join(","));
   }
   for (const s of query.sort ?? []) params.append("sort", `${s.field}:${s.direction}`);
+  for (const f of query.filters ?? []) {
+    params.append("filter", f.value === void 0 ? `${f.field}:${f.operator}` : `${f.field}:${f.operator}:${f.value}`);
+  }
   const qs = params.toString();
   return qs ? `?${qs}` : "";
 }
@@ -98,6 +101,15 @@ function useClient() {
   }
   return client;
 }
+var EntitiesContext = createContext([]);
+var AdminEntitiesProvider = EntitiesContext.Provider;
+function useEntities() {
+  return useContext(EntitiesContext);
+}
+function useEntity(entityId) {
+  const entities = useEntities();
+  return entityId ? entities.find((e) => e.id === entityId) : void 0;
+}
 
 // src/hooks.ts
 import { useCallback, useEffect, useState } from "react";
@@ -140,6 +152,45 @@ function useEntityRecord(entityId, id) {
 function listFields(entity) {
   return entity.fields.filter((f) => f.list.visible && !f.hidden).sort((a, b) => (a.list.order ?? 0) - (b.list.order ?? 0));
 }
+var LIST_EXCLUDED_TYPES = /* @__PURE__ */ new Set(["json", "array", "text"]);
+function listColumnRank(field) {
+  switch (field.type) {
+    case "string":
+    case "email":
+    case "document":
+    case "phone":
+      return 1;
+    case "enum":
+      return 2;
+    case "relation":
+      return 3;
+    case "boolean":
+      return 4;
+    case "date":
+    case "datetime":
+    case "time":
+      return 5;
+    case "uuid":
+      return 7;
+    case "url":
+      return 8;
+    default:
+      return 6;
+  }
+}
+function primaryListFields(entity, max = 8) {
+  const all = listFields(entity);
+  const curated = all.some((f) => f.list.order !== void 0 || f.list.width !== void 0);
+  if (curated || all.length <= max) return all;
+  const scored = all.filter((f) => !f.sensitive && f.name !== entity.primaryKey && !LIST_EXCLUDED_TYPES.has(f.type)).map((field, index) => {
+    let score = listColumnRank(field) * 10 + index * 0.01;
+    if (field.searchable) score -= 5;
+    if (field.required) score -= 2;
+    if (field.name === entity.displayField) score = -100;
+    return { field, score };
+  }).sort((a, b) => a.score - b.score);
+  return scored.slice(0, max).map((s) => s.field);
+}
 function detailFields(entity) {
   return entity.fields.filter((f) => f.detail.visible).sort((a, b) => (a.detail.order ?? 0) - (b.detail.order ?? 0));
 }
@@ -148,33 +199,303 @@ function formFields(entity, mode) {
 }
 
 // src/components/Sidebar.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect as useEffect2, useMemo, useRef, useState as useState2 } from "react";
+
+// src/grouping.ts
+var MIN_PREFIX = 4;
+function commonPrefix(a, b) {
+  let i = 0;
+  while (i < a.length && i < b.length && a[i] === b[i]) i += 1;
+  return a.slice(0, i);
+}
+function humanize(prefix) {
+  return prefix.charAt(0).toUpperCase() + prefix.slice(1);
+}
+function buildMenu(entities, labels) {
+  const byGroup = /* @__PURE__ */ new Map();
+  const rest = [];
+  for (const entity of entities) {
+    const override = labels?.entities?.[entity.id] ?? labels?.entities?.[entity.table];
+    if (override?.group) {
+      const existing = byGroup.get(override.group);
+      if (existing) existing.entities.push(entity);
+      else byGroup.set(override.group, { id: override.group, label: override.group, entities: [entity] });
+    } else {
+      rest.push(entity);
+    }
+  }
+  const sorted = [...rest].sort((a, b) => a.table < b.table ? -1 : a.table > b.table ? 1 : 0);
+  const ungrouped = [];
+  let i = 0;
+  while (i < sorted.length) {
+    let prefix = i + 1 < sorted.length ? commonPrefix(sorted[i].table, sorted[i + 1].table) : "";
+    if (prefix.length < MIN_PREFIX) {
+      ungrouped.push(sorted[i]);
+      i += 1;
+      continue;
+    }
+    let end = i + 1;
+    while (end + 1 < sorted.length) {
+      const next = commonPrefix(prefix, sorted[end + 1].table);
+      if (next.length < MIN_PREFIX) break;
+      prefix = next;
+      end += 1;
+    }
+    const members = sorted.slice(i, end + 1);
+    const label = labels?.groups?.[prefix] ?? humanize(prefix);
+    const existing = byGroup.get(prefix);
+    if (existing) existing.entities.push(...members);
+    else byGroup.set(prefix, { id: prefix, label, entities: members });
+    i = end + 1;
+  }
+  const collator = (a, b) => a.localeCompare(b);
+  const groups = [...byGroup.values()].sort((a, b) => collator(a.label, b.label));
+  for (const group of groups) {
+    group.entities.sort((a, b) => collator(a.label.plural, b.label.plural));
+  }
+  ungrouped.sort((a, b) => collator(a.label.plural, b.label.plural));
+  return { groups, ungrouped };
+}
+
+// src/i18n.ts
+import { createContext as createContext2, useContext as useContext2 } from "react";
+var EN = {
+  loading: "Loading\u2026",
+  loadingMetadata: "Loading metadata\u2026",
+  records: (total) => `${total} record${total === 1 ? "" : "s"}`,
+  searchPlaceholder: (plural) => `Search ${plural.toLowerCase()}\u2026`,
+  newRecord: "+ New",
+  view: "View",
+  edit: "Edit",
+  clone: "Clone",
+  remove: "Remove",
+  copyId: "Copy ID",
+  copyObject: "Copy object",
+  copyValue: "Copy value",
+  copied: "Copied!",
+  addToFilter: "Add to filter",
+  openRelated: (label) => `Open ${label}`,
+  filters: "Filters",
+  clearFilters: "Clear filters",
+  actions: "Actions",
+  noRecords: "No records",
+  tryDifferentSearch: "Try a different search.",
+  deleteConfirm: (singular) => `Delete this ${singular.toLowerCase()}? This cannot be undone.`,
+  page: (page, total) => `Page ${page} of ${total}`,
+  previous: "Previous",
+  next: "Next",
+  cancel: "Cancel",
+  save: "Save",
+  saving: "Saving\u2026",
+  create: "Create",
+  newTitle: (singular) => `New ${singular}`,
+  editTitle: (singular) => `Edit ${singular}`,
+  cloneTitle: (singular) => `Clone ${singular}`,
+  entitiesFooter: (count) => `${count} entities \xB7 Maestro`,
+  yes: "true",
+  no: "false",
+  searchMenu: "Search menu\u2026",
+  recents: "Recents",
+  menus: "Menus",
+  noMenuResults: "No matches"
+};
+var PT_BR = {
+  loading: "Carregando\u2026",
+  loadingMetadata: "Carregando metadados\u2026",
+  records: (total) => `${total} registro${total === 1 ? "" : "s"}`,
+  searchPlaceholder: (plural) => `Buscar ${plural.toLowerCase()}\u2026`,
+  newRecord: "+ Novo",
+  view: "Visualizar",
+  edit: "Editar",
+  clone: "Clonar",
+  remove: "Remover",
+  copyId: "Copiar ID",
+  copyObject: "Copiar objeto",
+  copyValue: "Copiar valor",
+  copied: "Copiado!",
+  addToFilter: "Adicionar ao filtro",
+  openRelated: (label) => `Abrir ${label}`,
+  filters: "Filtros",
+  clearFilters: "Limpar filtros",
+  actions: "A\xE7\xF5es",
+  noRecords: "Nenhum registro",
+  tryDifferentSearch: "Tente uma busca diferente.",
+  deleteConfirm: (singular) => `Remover este registro de ${singular}? Essa a\xE7\xE3o n\xE3o pode ser desfeita.`,
+  page: (page, total) => `P\xE1gina ${page} de ${total}`,
+  previous: "Anterior",
+  next: "Pr\xF3xima",
+  cancel: "Cancelar",
+  save: "Salvar",
+  saving: "Salvando\u2026",
+  create: "Criar",
+  newTitle: (singular) => `Novo(a) ${singular}`,
+  editTitle: (singular) => `Editar ${singular}`,
+  cloneTitle: (singular) => `Clonar ${singular}`,
+  entitiesFooter: (count) => `${count} entidades \xB7 Maestro`,
+  yes: "sim",
+  no: "n\xE3o",
+  searchMenu: "Buscar no menu\u2026",
+  recents: "Recentes",
+  menus: "Menus",
+  noMenuResults: "Nada encontrado"
+};
+var LOCALES = { en: EN, "pt-BR": PT_BR };
+function stringsFor(locale) {
+  return LOCALES[locale] ?? EN;
+}
+var I18nContext = createContext2(EN);
+var I18nProvider = I18nContext.Provider;
+function useT() {
+  return useContext2(I18nContext);
+}
+
+// src/components/Sidebar.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function normalize(text) {
+  return text.toLowerCase().normalize("NFD").replace(/\p{M}/gu, "");
+}
+function Highlight({ label, query }) {
+  const foldedQuery = normalize(query);
+  if (!foldedQuery) return label;
+  const folded = [];
+  const originalIndex = [];
+  for (let i = 0; i < label.length; i += 1) {
+    for (const ch of normalize(label[i])) {
+      folded.push(ch);
+      originalIndex.push(i);
+    }
+  }
+  const idx = folded.join("").indexOf(foldedQuery);
+  if (idx === -1) return label;
+  const start = originalIndex[idx];
+  const end = (originalIndex[idx + foldedQuery.length - 1] ?? label.length - 1) + 1;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    label.slice(0, start),
+    /* @__PURE__ */ jsx("mark", { className: "rounded-sm bg-amber-200 text-inherit", children: label.slice(start, end) }),
+    label.slice(end)
+  ] });
+}
+function EntityButton({
+  entity,
+  active,
+  onSelect,
+  subtitle,
+  query
+}) {
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      onClick: () => onSelect(entity.id),
+      className: `flex w-full flex-col rounded-md px-3 py-1.5 text-left text-sm transition-colors ${active ? "bg-indigo-100 font-medium text-indigo-700" : "text-slate-700 hover:bg-slate-100"}`,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "truncate", children: query ? /* @__PURE__ */ jsx(Highlight, { label: entity.label.plural, query }) : entity.label.plural }),
+        subtitle && /* @__PURE__ */ jsx("span", { className: "truncate text-xs font-normal text-slate-400", children: subtitle })
+      ]
+    }
+  );
+}
+function SectionTitle({ children }) {
+  return /* @__PURE__ */ jsx("div", { className: "px-3 pb-1 pt-3 text-xs font-semibold uppercase tracking-wide text-slate-400", children });
+}
 function Sidebar({
   entities,
   activeId,
   onSelect,
-  title
+  title,
+  labels,
+  recents = []
 }) {
-  return /* @__PURE__ */ jsxs("aside", { className: "flex w-60 shrink-0 flex-col border-r border-slate-200 bg-slate-50", children: [
+  const t = useT();
+  const [query, setQuery] = useState2("");
+  const [expanded, setExpanded] = useState2({});
+  const searchRef = useRef(null);
+  const menu = useMemo(() => buildMenu(entities, labels), [entities, labels]);
+  const groupOf = useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const group of menu.groups) for (const e of group.entities) map.set(e.id, group.label);
+    return map;
+  }, [menu]);
+  const recentEntities = recents.map((id) => entities.find((e) => e.id === id)).filter((e) => Boolean(e)).slice(0, 6);
+  const results = useMemo(() => {
+    if (!query) return [];
+    const q = normalize(query);
+    return entities.filter((e) => normalize(`${e.label.plural} ${e.label.singular} ${e.table}`).includes(q)).sort((a, b) => a.label.plural.localeCompare(b.label.plural));
+  }, [entities, query]);
+  useEffect2(() => {
+    const onKey = (e) => {
+      if ((e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "k") {
+        e.preventDefault();
+        searchRef.current?.focus();
+      }
+    };
+    document.addEventListener("keydown", onKey);
+    return () => document.removeEventListener("keydown", onKey);
+  }, []);
+  const select = (entityId) => {
+    setQuery("");
+    onSelect(entityId);
+  };
+  const isExpanded = (groupId, hasActive) => expanded[groupId] ?? hasActive;
+  return /* @__PURE__ */ jsxs("aside", { className: "flex w-64 shrink-0 flex-col border-r border-slate-200 bg-slate-50", children: [
     /* @__PURE__ */ jsx("div", { className: "border-b border-slate-200 px-4 py-4", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold tracking-tight text-slate-900", children: title }) }),
-    /* @__PURE__ */ jsx("nav", { className: "flex-1 overflow-y-auto p-2", children: entities.map((e) => /* @__PURE__ */ jsx(
-      "button",
+    /* @__PURE__ */ jsx("div", { className: "px-2 pt-2", children: /* @__PURE__ */ jsx(
+      "input",
       {
-        onClick: () => onSelect(e.id),
-        className: `flex w-full items-center justify-between rounded-md px-3 py-2 text-left text-sm transition-colors ${e.id === activeId ? "bg-indigo-100 font-medium text-indigo-700" : "text-slate-700 hover:bg-slate-100"}`,
-        children: /* @__PURE__ */ jsx("span", { className: "truncate", children: e.label.plural })
+        ref: searchRef,
+        type: "search",
+        value: query,
+        onChange: (e) => setQuery(e.target.value),
+        onKeyDown: (e) => {
+          if (e.key === "Escape") setQuery("");
+          if (e.key === "Enter" && results[0]) select(results[0].id);
+        },
+        placeholder: `${t.searchMenu}  (Ctrl+K)`,
+        className: "w-full rounded-md border border-slate-300 bg-white px-3 py-1.5 text-sm focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500"
+      }
+    ) }),
+    /* @__PURE__ */ jsx("nav", { className: "flex-1 overflow-y-auto p-2", children: query ? results.length === 0 ? /* @__PURE__ */ jsx("p", { className: "px-3 py-2 text-sm text-slate-400", children: t.noMenuResults }) : results.map((e) => /* @__PURE__ */ jsx(
+      EntityButton,
+      {
+        entity: e,
+        active: e.id === activeId,
+        onSelect: select,
+        subtitle: groupOf.get(e.id),
+        query
       },
       e.id
-    )) }),
-    /* @__PURE__ */ jsxs("div", { className: "border-t border-slate-200 px-4 py-3 text-xs text-slate-400", children: [
-      entities.length,
-      " entities \xB7 Maestro"
-    ] })
+    )) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      recentEntities.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(SectionTitle, { children: t.recents }),
+        recentEntities.map((e) => /* @__PURE__ */ jsx(EntityButton, { entity: e, active: e.id === activeId, onSelect: select }, e.id))
+      ] }),
+      /* @__PURE__ */ jsx(SectionTitle, { children: t.menus }),
+      menu.groups.map((group) => {
+        const hasActive = group.entities.some((e) => e.id === activeId);
+        const open = isExpanded(group.id, hasActive);
+        return /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => setExpanded((prev) => ({ ...prev, [group.id]: !open })),
+              className: "flex w-full items-center gap-1.5 rounded-md px-3 py-1.5 text-left text-sm font-medium text-slate-600 hover:bg-slate-100",
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "text-xs text-slate-400", children: open ? "\u25BE" : "\u25B8" }),
+                /* @__PURE__ */ jsx("span", { className: "truncate", children: group.label }),
+                /* @__PURE__ */ jsx("span", { className: "ml-auto text-xs text-slate-400", children: group.entities.length })
+              ]
+            }
+          ),
+          open && /* @__PURE__ */ jsx("div", { className: "ml-3 border-l border-slate-200 pl-1", children: group.entities.map((e) => /* @__PURE__ */ jsx(EntityButton, { entity: e, active: e.id === activeId, onSelect: select }, e.id)) })
+        ] }, group.id);
+      }),
+      menu.ungrouped.map((e) => /* @__PURE__ */ jsx(EntityButton, { entity: e, active: e.id === activeId, onSelect: select }, e.id))
+    ] }) }),
+    /* @__PURE__ */ jsx("div", { className: "border-t border-slate-200 px-4 py-3 text-xs text-slate-400", children: t.entitiesFooter(entities.length) })
   ] });
 }
 
 // src/components/EntityList.tsx
-import { useMemo, useState as useState2 } from "react";
+import { useMemo as useMemo2, useState as useState5 } from "react";
 
 // src/components/ui.tsx
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
@@ -223,57 +544,235 @@ function ErrorBanner({ error }) {
   return /* @__PURE__ */ jsx2("div", { className: "rounded-md border border-red-200 bg-red-50 p-3 text-sm text-red-700", role: "alert", children: error.message });
 }
 
+// src/components/RelationValue.tsx
+import { useEffect as useEffect3, useState as useState3 } from "react";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var displayCache = /* @__PURE__ */ new Map();
+function resolveDisplay(client, entityId, displayField, id) {
+  const key = `${entityId}/${id}`;
+  let cached = displayCache.get(key);
+  if (!cached) {
+    cached = client.findById(entityId, id).then((record) => {
+      const value = record[displayField];
+      return value === null || value === void 0 || value === "" ? void 0 : String(value);
+    }).catch(() => void 0);
+    displayCache.set(key, cached);
+  }
+  return cached;
+}
+function shortId(id) {
+  return id.length > 12 ? `${id.slice(0, 6)}\u2026${id.slice(-4)}` : id;
+}
+function RelationValue({ field, value }) {
+  const client = useClient();
+  const target = useEntity(field.relationEntity);
+  const id = String(value);
+  const [display, setDisplay] = useState3(void 0);
+  useEffect3(() => {
+    let cancelled = false;
+    setDisplay(void 0);
+    if (!target || target.displayField === target.primaryKey) return;
+    resolveDisplay(client, target.id, target.displayField, id).then((resolved) => {
+      if (!cancelled) setDisplay(resolved);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [client, target, id]);
+  return /* @__PURE__ */ jsxs3(
+    "span",
+    {
+      title: id,
+      className: "inline-flex max-w-56 items-center gap-1 truncate rounded border border-slate-200 bg-slate-50 px-1.5 py-0.5 text-xs font-medium text-slate-700",
+      children: [
+        target && /* @__PURE__ */ jsxs3("span", { className: "text-slate-400", children: [
+          target.label.singular,
+          ":"
+        ] }),
+        /* @__PURE__ */ jsx3("span", { className: "truncate", children: display ?? shortId(id) })
+      ]
+    }
+  );
+}
+
 // src/components/FieldValue.tsx
-import { jsx as jsx3 } from "react/jsx-runtime";
+import { jsx as jsx4 } from "react/jsx-runtime";
 function enumLabel(field, value) {
   const opt = field.enumOptions?.find((o) => o.value === value);
   return opt ? opt.label : String(value);
 }
-function FieldValue({ field, value }) {
+function FieldValue({ field, value, compact = false }) {
+  const t = useT();
   if (value === null || value === void 0 || value === "") {
-    return /* @__PURE__ */ jsx3("span", { className: "text-slate-400", children: "\u2014" });
+    return /* @__PURE__ */ jsx4("span", { className: "text-slate-400", children: "\u2014" });
   }
   if (field.sensitive) {
-    return /* @__PURE__ */ jsx3("span", { className: "text-slate-400", children: "\u2022\u2022\u2022\u2022\u2022\u2022" });
+    return /* @__PURE__ */ jsx4("span", { className: "text-slate-400", children: "\u2022\u2022\u2022\u2022\u2022\u2022" });
   }
   switch (field.type) {
     case "boolean":
-      return value ? /* @__PURE__ */ jsx3(Badge, { tone: "green", children: "true" }) : /* @__PURE__ */ jsx3(Badge, { tone: "slate", children: "false" });
+      return value ? /* @__PURE__ */ jsx4(Badge, { tone: "green", children: t.yes }) : /* @__PURE__ */ jsx4(Badge, { tone: "slate", children: t.no });
     case "enum":
-      return /* @__PURE__ */ jsx3(Badge, { tone: "indigo", children: enumLabel(field, value) });
+      return /* @__PURE__ */ jsx4(Badge, { tone: "indigo", children: enumLabel(field, value) });
+    case "relation":
+      return field.relationEntity ? /* @__PURE__ */ jsx4(RelationValue, { field, value }) : /* @__PURE__ */ jsx4("span", { className: "text-slate-700", children: String(value) });
     case "date":
     case "datetime": {
       const d = new Date(String(value));
-      return /* @__PURE__ */ jsx3("span", { children: Number.isNaN(d.getTime()) ? String(value) : d.toLocaleString() });
+      return /* @__PURE__ */ jsx4("span", { className: "whitespace-nowrap", children: Number.isNaN(d.getTime()) ? String(value) : d.toLocaleString() });
     }
     case "json":
-      return /* @__PURE__ */ jsx3("code", { className: "block max-w-md overflow-x-auto rounded bg-slate-50 px-1.5 py-0.5 text-xs text-slate-700", children: JSON.stringify(value) });
+      return /* @__PURE__ */ jsx4("code", { className: `block overflow-x-auto rounded bg-slate-50 px-1.5 py-0.5 text-xs text-slate-700 ${compact ? "max-w-xs truncate" : "max-w-md"}`, children: JSON.stringify(value) });
     default:
-      return /* @__PURE__ */ jsx3("span", { className: "text-slate-700", children: String(value) });
+      return /* @__PURE__ */ jsx4("span", { className: `text-slate-700 ${compact ? "block max-w-64 truncate" : ""}`, children: String(value) });
   }
 }
 
+// src/components/menu.tsx
+import { useEffect as useEffect4, useLayoutEffect, useRef as useRef2, useState as useState4 } from "react";
+import { createPortal } from "react-dom";
+import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+function PopMenu({ anchor, items, onClose }) {
+  const ref = useRef2(null);
+  const [pos, setPos] = useState4(anchor);
+  useLayoutEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    const rect = el.getBoundingClientRect();
+    setPos({
+      x: Math.max(4, Math.min(anchor.x, window.innerWidth - rect.width - 8)),
+      y: Math.max(4, Math.min(anchor.y, window.innerHeight - rect.height - 8))
+    });
+  }, [anchor]);
+  useEffect4(() => {
+    const onDown = (e) => {
+      if (ref.current && !ref.current.contains(e.target)) onClose();
+    };
+    const onKey = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    document.addEventListener("mousedown", onDown);
+    document.addEventListener("keydown", onKey);
+    window.addEventListener("scroll", onClose, true);
+    window.addEventListener("resize", onClose);
+    return () => {
+      document.removeEventListener("mousedown", onDown);
+      document.removeEventListener("keydown", onKey);
+      window.removeEventListener("scroll", onClose, true);
+      window.removeEventListener("resize", onClose);
+    };
+  }, [onClose]);
+  return createPortal(
+    /* @__PURE__ */ jsx5(
+      "div",
+      {
+        ref,
+        role: "menu",
+        style: { position: "fixed", left: pos.x, top: pos.y, zIndex: 50 },
+        className: "min-w-44 rounded-md border border-slate-200 bg-white py-1 shadow-lg",
+        children: items.map((item) => /* @__PURE__ */ jsx5(
+          "button",
+          {
+            role: "menuitem",
+            onClick: () => {
+              onClose();
+              item.onSelect();
+            },
+            className: `block w-full px-3 py-1.5 text-left text-sm ${item.danger ? "text-red-600 hover:bg-red-50" : "text-slate-700 hover:bg-slate-100"}`,
+            children: item.label
+          },
+          item.id
+        ))
+      }
+    ),
+    document.body
+  );
+}
+function MenuButton({ items, label }) {
+  const [anchor, setAnchor] = useState4(void 0);
+  return /* @__PURE__ */ jsxs4(Fragment2, { children: [
+    /* @__PURE__ */ jsx5(
+      "button",
+      {
+        type: "button",
+        "aria-label": label,
+        title: label,
+        onClick: (e) => {
+          const rect = e.currentTarget.getBoundingClientRect();
+          setAnchor({ x: rect.right - 176, y: rect.bottom + 4 });
+        },
+        className: "rounded-md px-2 py-1 text-slate-500 hover:bg-slate-100 hover:text-slate-900",
+        children: "\u22EE"
+      }
+    ),
+    anchor && /* @__PURE__ */ jsx5(PopMenu, { anchor, items, onClose: () => setAnchor(void 0) })
+  ] });
+}
+
+// src/clipboard.ts
+async function copyText(text) {
+  if (navigator.clipboard?.writeText) {
+    try {
+      await navigator.clipboard.writeText(text);
+      return;
+    } catch {
+    }
+  }
+  const textarea = document.createElement("textarea");
+  textarea.value = text;
+  textarea.style.position = "fixed";
+  textarea.style.opacity = "0";
+  document.body.appendChild(textarea);
+  textarea.select();
+  document.execCommand("copy");
+  textarea.remove();
+}
+
 // src/components/EntityList.tsx
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
 var PAGE_SIZE = 20;
+function filterFor(field, value) {
+  if (value === null || value === void 0) return { field: field.name, operator: "isNull" };
+  if (field.type === "boolean") return { field: field.name, operator: value ? "isTrue" : "isFalse" };
+  if (field.type === "json" || field.type === "array") return void 0;
+  return { field: field.name, operator: "equals", value: String(value) };
+}
+function filterChipText(entity, filter) {
+  const label = entity.fields.find((f) => f.name === filter.field)?.label ?? filter.field;
+  if (filter.operator === "isNull") return `${label} = \u2205`;
+  if (filter.operator === "isTrue") return `${label} = \u2713`;
+  if (filter.operator === "isFalse") return `${label} = \u2717`;
+  const value = filter.value ?? "";
+  return `${label} = ${value.length > 24 ? `${value.slice(0, 24)}\u2026` : value}`;
+}
 function EntityList({
   entity,
   onOpen,
   onCreate,
-  onEdit
+  onEdit,
+  onClone,
+  onNavigate,
+  initialFilters
 }) {
   const client = useClient();
-  const columns = useMemo(() => listFields(entity), [entity]);
-  const searchFields = useMemo(() => entity.fields.filter((f) => f.searchable).map((f) => f.name), [entity]);
-  const [page, setPage] = useState2(1);
-  const [search, setSearch] = useState2("");
-  const [sort, setSort] = useState2(void 0);
+  const t = useT();
+  const entities = useEntities();
+  const relatedLabel = (entityId) => entities.find((e) => e.id === entityId)?.label.singular ?? entityId;
+  const columns = useMemo2(() => primaryListFields(entity), [entity]);
+  const searchFields = useMemo2(() => entity.fields.filter((f) => f.searchable).map((f) => f.name), [entity]);
+  const [page, setPage] = useState5(1);
+  const [search, setSearch] = useState5("");
+  const [sort, setSort] = useState5(void 0);
+  const [filters, setFilters] = useState5(initialFilters ?? []);
+  const [cellMenu, setCellMenu] = useState5(void 0);
+  const [copied, setCopied] = useState5(false);
   const query = {
     page,
     pageSize: PAGE_SIZE,
     search: search || void 0,
     searchFields,
-    sort: sort ? [sort] : void 0
+    sort: sort ? [sort] : void 0,
+    filters: filters.length ? filters : void 0
   };
   const { data, error, loading, reload } = useEntityList(entity.id, query);
   const toggleSort = (fieldName) => {
@@ -281,27 +780,81 @@ function EntityList({
       (prev) => prev?.field === fieldName ? { field: fieldName, direction: prev.direction === "asc" ? "desc" : "asc" } : { field: fieldName, direction: "asc" }
     );
   };
+  const flashCopied = () => {
+    setCopied(true);
+    setTimeout(() => setCopied(false), 1500);
+  };
+  const copy = async (text) => {
+    await copyText(text);
+    flashCopied();
+  };
+  const addFilter = (filter) => {
+    setFilters((prev) => {
+      const others = prev.filter((f) => f.field !== filter.field);
+      return [...others, filter];
+    });
+    setPage(1);
+  };
   const onDelete = async (id) => {
-    if (!globalThis.confirm(`Delete this ${entity.label.singular.toLowerCase()}? This cannot be undone.`)) return;
+    if (!globalThis.confirm(t.deleteConfirm(entity.label.singular))) return;
     await client.remove(entity.id, id);
     reload();
   };
+  const rowMenuItems = (record) => {
+    const id = String(record[entity.primaryKey]);
+    const items = [{ id: "view", label: `\u{1F441} ${t.view}`, onSelect: () => onOpen(id) }];
+    if (entity.capabilities.update) items.push({ id: "edit", label: `\u270F\uFE0F ${t.edit}`, onSelect: () => onEdit(id) });
+    if (entity.capabilities.clone && entity.capabilities.create) {
+      items.push({ id: "clone", label: `\u29C9 ${t.clone}`, onSelect: () => onClone(id) });
+    }
+    items.push(
+      { id: "copy-id", label: `\u2398 ${t.copyId}`, onSelect: () => void copy(id) },
+      { id: "copy-object", label: `{} ${t.copyObject}`, onSelect: () => void copy(JSON.stringify(record, null, 2)) }
+    );
+    if (entity.capabilities.delete) {
+      items.push({ id: "remove", label: `\u{1F5D1} ${t.remove}`, danger: true, onSelect: () => void onDelete(id) });
+    }
+    return items;
+  };
+  const cellMenuItems = (state) => {
+    const { field, record } = state;
+    const id = String(record[entity.primaryKey]);
+    const value = record[field.name];
+    const items = [];
+    const filter = filterFor(field, value);
+    if (filter) items.push({ id: "filter", label: `\u25BC ${t.addToFilter}`, onSelect: () => addFilter(filter) });
+    items.push({ id: "view", label: `\u{1F441} ${t.view}`, onSelect: () => onOpen(id) });
+    if (entity.capabilities.update) items.push({ id: "edit", label: `\u270F\uFE0F ${t.edit}`, onSelect: () => onEdit(id) });
+    if (field.type === "relation" && field.relationEntity && value !== null && value !== void 0) {
+      const targetId = field.relationEntity;
+      items.push({
+        id: "open-related",
+        label: `\u2197 ${t.openRelated(relatedLabel(targetId))}`,
+        onSelect: () => onNavigate(targetId, String(value))
+      });
+    }
+    if (value !== null && value !== void 0) {
+      items.push({
+        id: "copy-value",
+        label: `\u2398 ${t.copyValue}`,
+        onSelect: () => void copy(typeof value === "object" ? JSON.stringify(value) : String(value))
+      });
+    }
+    return items;
+  };
   const totalPages = data?.totalPages ?? (data ? Math.max(1, Math.ceil(data.total / PAGE_SIZE)) : 1);
-  return /* @__PURE__ */ jsxs3("section", { className: "space-y-4", children: [
-    /* @__PURE__ */ jsxs3("header", { className: "flex flex-wrap items-center justify-between gap-3", children: [
-      /* @__PURE__ */ jsxs3("div", { children: [
-        /* @__PURE__ */ jsx4("h1", { className: "text-lg font-semibold text-slate-900", children: entity.label.plural }),
-        data && /* @__PURE__ */ jsxs3("p", { className: "text-sm text-slate-500", children: [
-          data.total,
-          " records"
-        ] })
+  return /* @__PURE__ */ jsxs5("section", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxs5("header", { className: "flex flex-wrap items-center justify-between gap-3", children: [
+      /* @__PURE__ */ jsxs5("div", { children: [
+        /* @__PURE__ */ jsx6("h1", { className: "text-lg font-semibold text-slate-900", children: entity.label.plural }),
+        data && /* @__PURE__ */ jsx6("p", { className: "text-sm text-slate-500", children: t.records(data.total) })
       ] }),
-      /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-2", children: [
-        searchFields.length > 0 && /* @__PURE__ */ jsx4(
+      /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
+        searchFields.length > 0 && /* @__PURE__ */ jsx6(
           "input",
           {
             type: "search",
-            placeholder: `Search ${entity.label.plural.toLowerCase()}\u2026`,
+            placeholder: t.searchPlaceholder(entity.label.plural),
             value: search,
             onChange: (e) => {
               setSearch(e.target.value);
@@ -310,13 +863,46 @@ function EntityList({
             className: "rounded-md border border-slate-300 px-3 py-1.5 text-sm focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500"
           }
         ),
-        entity.capabilities.create && /* @__PURE__ */ jsx4(Button, { variant: "primary", onClick: onCreate, children: "+ New" })
+        entity.capabilities.create && /* @__PURE__ */ jsx6(Button, { variant: "primary", onClick: onCreate, children: t.newRecord })
       ] })
     ] }),
-    error && /* @__PURE__ */ jsx4(ErrorBanner, { error }),
-    loading && !data ? /* @__PURE__ */ jsx4(Spinner, { label: `Loading ${entity.label.plural.toLowerCase()}\u2026` }) : data && data.records.length === 0 ? /* @__PURE__ */ jsx4(EmptyState, { title: "No records", hint: search ? "Try a different search." : void 0 }) : /* @__PURE__ */ jsx4("div", { className: "overflow-x-auto rounded-lg border border-slate-200", children: /* @__PURE__ */ jsxs3("table", { className: "min-w-full divide-y divide-slate-200 text-sm", children: [
-      /* @__PURE__ */ jsx4("thead", { className: "bg-slate-50", children: /* @__PURE__ */ jsxs3("tr", { children: [
-        columns.map((f) => /* @__PURE__ */ jsxs3(
+    filters.length > 0 && /* @__PURE__ */ jsxs5("div", { className: "flex flex-wrap items-center gap-2 text-sm", children: [
+      /* @__PURE__ */ jsxs5("span", { className: "text-slate-500", children: [
+        t.filters,
+        ":"
+      ] }),
+      filters.map((f) => /* @__PURE__ */ jsxs5(
+        "button",
+        {
+          onClick: () => {
+            setFilters((prev) => prev.filter((p) => p.field !== f.field));
+            setPage(1);
+          },
+          title: f.value,
+          className: "inline-flex items-center gap-1 rounded-full bg-indigo-50 px-2.5 py-0.5 text-xs font-medium text-indigo-700 hover:bg-indigo-100",
+          children: [
+            filterChipText(entity, f),
+            /* @__PURE__ */ jsx6("span", { "aria-hidden": true, children: "\xD7" })
+          ]
+        },
+        f.field
+      )),
+      /* @__PURE__ */ jsx6(
+        "button",
+        {
+          onClick: () => {
+            setFilters([]);
+            setPage(1);
+          },
+          className: "text-xs text-slate-500 underline hover:text-slate-700",
+          children: t.clearFilters
+        }
+      )
+    ] }),
+    error && /* @__PURE__ */ jsx6(ErrorBanner, { error }),
+    loading && !data ? /* @__PURE__ */ jsx6(Spinner, { label: t.loading }) : data && data.records.length === 0 ? /* @__PURE__ */ jsx6(EmptyState, { title: t.noRecords, hint: search || filters.length ? t.tryDifferentSearch : void 0 }) : /* @__PURE__ */ jsx6("div", { className: "overflow-x-auto rounded-lg border border-slate-200", children: /* @__PURE__ */ jsxs5("table", { className: "min-w-full divide-y divide-slate-200 text-sm", children: [
+      /* @__PURE__ */ jsx6("thead", { className: "bg-slate-50", children: /* @__PURE__ */ jsxs5("tr", { children: [
+        columns.map((f) => /* @__PURE__ */ jsxs5(
           "th",
           {
             onClick: () => f.sortable && toggleSort(f.name),
@@ -328,78 +914,128 @@ function EntityList({
           },
           f.name
         )),
-        /* @__PURE__ */ jsx4("th", { className: "px-3 py-2" })
+        /* @__PURE__ */ jsx6("th", { className: "px-3 py-2 text-right font-medium text-slate-600", children: t.actions })
       ] }) }),
-      /* @__PURE__ */ jsx4("tbody", { className: "divide-y divide-slate-100 bg-white", children: data?.records.map((record, i) => {
+      /* @__PURE__ */ jsx6("tbody", { className: "divide-y divide-slate-100 bg-white", children: data?.records.map((record, i) => {
         const id = String(record[entity.primaryKey]);
-        return /* @__PURE__ */ jsxs3("tr", { className: "hover:bg-slate-50", children: [
-          columns.map((f) => /* @__PURE__ */ jsx4(
+        return /* @__PURE__ */ jsxs5("tr", { className: "hover:bg-slate-50", children: [
+          columns.map((f) => /* @__PURE__ */ jsx6(
             "td",
             {
               className: "cursor-pointer px-3 py-2 align-top",
-              onClick: () => onOpen(id),
-              children: /* @__PURE__ */ jsx4(FieldValue, { field: f, value: record[f.name] })
+              onClick: (e) => setCellMenu({ anchor: { x: e.clientX, y: e.clientY }, field: f, record }),
+              onDoubleClick: () => onOpen(id),
+              children: /* @__PURE__ */ jsx6(FieldValue, { field: f, value: record[f.name], compact: true })
             },
             f.name
           )),
-          /* @__PURE__ */ jsxs3("td", { className: "whitespace-nowrap px-3 py-2 text-right", children: [
-            entity.capabilities.update && /* @__PURE__ */ jsx4(Button, { variant: "ghost", onClick: () => onEdit(id), children: "Edit" }),
-            entity.capabilities.delete && /* @__PURE__ */ jsx4(Button, { variant: "ghost", className: "text-red-600", onClick: () => onDelete(id), children: "Delete" })
-          ] })
+          /* @__PURE__ */ jsx6("td", { className: "whitespace-nowrap px-3 py-2 text-right", children: /* @__PURE__ */ jsx6(MenuButton, { label: t.actions, items: rowMenuItems(record) }) })
         ] }, id || i);
       }) })
     ] }) }),
-    data && totalPages > 1 && /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-end gap-2 text-sm", children: [
-      /* @__PURE__ */ jsx4(Button, { variant: "secondary", disabled: page <= 1, onClick: () => setPage((p) => p - 1), children: "Previous" }),
-      /* @__PURE__ */ jsxs3("span", { className: "text-slate-500", children: [
-        "Page ",
-        page,
-        " of ",
-        totalPages
-      ] }),
-      /* @__PURE__ */ jsx4(Button, { variant: "secondary", disabled: page >= totalPages, onClick: () => setPage((p) => p + 1), children: "Next" })
+    cellMenu && /* @__PURE__ */ jsx6(PopMenu, { anchor: cellMenu.anchor, items: cellMenuItems(cellMenu), onClose: () => setCellMenu(void 0) }),
+    copied && /* @__PURE__ */ jsx6("div", { className: "fixed bottom-4 right-4 z-50 rounded-md bg-slate-900 px-3 py-1.5 text-sm text-white shadow-lg", children: t.copied }),
+    data && totalPages > 1 && /* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-end gap-2 text-sm", children: [
+      /* @__PURE__ */ jsx6(Button, { variant: "secondary", disabled: page <= 1, onClick: () => setPage((p) => p - 1), children: t.previous }),
+      /* @__PURE__ */ jsx6("span", { className: "text-slate-500", children: t.page(page, totalPages) }),
+      /* @__PURE__ */ jsx6(Button, { variant: "secondary", disabled: page >= totalPages, onClick: () => setPage((p) => p + 1), children: t.next })
     ] })
   ] });
 }
 
 // src/components/EntityDetail.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+import { useState as useState6 } from "react";
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
 function EntityDetail({
   entity,
   id,
   onBack,
-  onEdit
+  onEdit,
+  onClone,
+  onDeleted,
+  onNavigate
 }) {
+  const client = useClient();
+  const t = useT();
+  const entities = useEntities();
   const { data, error, loading } = useEntityRecord(entity.id, id);
   const fields = detailFields(entity);
-  return /* @__PURE__ */ jsxs4("section", { className: "space-y-4", children: [
-    /* @__PURE__ */ jsxs4("header", { className: "flex items-center justify-between gap-3", children: [
-      /* @__PURE__ */ jsxs4("div", { children: [
-        /* @__PURE__ */ jsxs4("button", { onClick: onBack, className: "text-sm text-indigo-600 hover:underline", children: [
+  const [copied, setCopied] = useState6(false);
+  const copy = async (text) => {
+    await copyText(text);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 1500);
+  };
+  const onDelete = async () => {
+    if (!globalThis.confirm(t.deleteConfirm(entity.label.singular))) return;
+    await client.remove(entity.id, id);
+    onDeleted();
+  };
+  const menuItems = [];
+  if (entity.capabilities.clone && entity.capabilities.create) {
+    menuItems.push({ id: "clone", label: `\u29C9 ${t.clone}`, onSelect: onClone });
+  }
+  menuItems.push({ id: "copy-id", label: `\u2398 ${t.copyId}`, onSelect: () => void copy(id) });
+  if (data) {
+    menuItems.push({
+      id: "copy-object",
+      label: `{} ${t.copyObject}`,
+      onSelect: () => void copy(JSON.stringify(data, null, 2))
+    });
+  }
+  if (entity.capabilities.delete) {
+    menuItems.push({ id: "remove", label: `\u{1F5D1} ${t.remove}`, danger: true, onSelect: () => void onDelete() });
+  }
+  return /* @__PURE__ */ jsxs6("section", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxs6("header", { className: "flex items-center justify-between gap-3", children: [
+      /* @__PURE__ */ jsxs6("div", { children: [
+        /* @__PURE__ */ jsxs6("button", { onClick: onBack, className: "text-sm text-indigo-600 hover:underline", children: [
           "\u2190 ",
           entity.label.plural
         ] }),
-        /* @__PURE__ */ jsxs4("h1", { className: "text-lg font-semibold text-slate-900", children: [
+        /* @__PURE__ */ jsxs6("h1", { className: "text-lg font-semibold text-slate-900", children: [
           entity.label.singular,
           " ",
           data ? String(data[entity.displayField] ?? id) : ""
         ] })
       ] }),
-      entity.capabilities.update && /* @__PURE__ */ jsx5(Button, { variant: "primary", onClick: onEdit, children: "Edit" })
+      /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-1", children: [
+        entity.capabilities.update && /* @__PURE__ */ jsx7(Button, { variant: "primary", onClick: onEdit, children: t.edit }),
+        /* @__PURE__ */ jsx7(MenuButton, { label: t.actions, items: menuItems })
+      ] })
     ] }),
-    error && /* @__PURE__ */ jsx5(ErrorBanner, { error }),
-    loading && !data ? /* @__PURE__ */ jsx5(Spinner, {}) : data && /* @__PURE__ */ jsx5("dl", { className: "divide-y divide-slate-100 rounded-lg border border-slate-200 bg-white", children: fields.map((f) => /* @__PURE__ */ jsxs4("div", { className: "grid grid-cols-3 gap-4 px-4 py-3", children: [
-      /* @__PURE__ */ jsx5("dt", { className: "text-sm font-medium text-slate-500", children: f.label }),
-      /* @__PURE__ */ jsx5("dd", { className: "col-span-2 text-sm", children: /* @__PURE__ */ jsx5(FieldValue, { field: f, value: data[f.name] }) })
-    ] }, f.name)) })
+    error && /* @__PURE__ */ jsx7(ErrorBanner, { error }),
+    loading && !data ? /* @__PURE__ */ jsx7(Spinner, {}) : data && /* @__PURE__ */ jsx7("dl", { className: "divide-y divide-slate-100 rounded-lg border border-slate-200 bg-white", children: fields.map((f) => {
+      const value = data[f.name];
+      const isRelation = f.type === "relation" && f.relationEntity && value !== null && value !== void 0;
+      const target = isRelation ? entities.find((e) => e.id === f.relationEntity) : void 0;
+      return /* @__PURE__ */ jsxs6("div", { className: "grid grid-cols-3 gap-4 px-4 py-3", children: [
+        /* @__PURE__ */ jsx7("dt", { className: "text-sm font-medium text-slate-500", children: f.label }),
+        /* @__PURE__ */ jsxs6("dd", { className: "col-span-2 flex items-center gap-2 text-sm", children: [
+          /* @__PURE__ */ jsx7(FieldValue, { field: f, value }),
+          isRelation && /* @__PURE__ */ jsxs6(
+            "button",
+            {
+              onClick: () => onNavigate(f.relationEntity, String(value)),
+              className: "text-xs text-indigo-600 hover:underline",
+              children: [
+                t.openRelated(target?.label.singular ?? f.relationEntity),
+                " \u2197"
+              ]
+            }
+          )
+        ] })
+      ] }, f.name);
+    }) }),
+    copied && /* @__PURE__ */ jsx7("div", { className: "fixed bottom-4 right-4 z-50 rounded-md bg-slate-900 px-3 py-1.5 text-sm text-white shadow-lg", children: t.copied })
   ] });
 }
 
 // src/components/EntityForm.tsx
-import { useEffect as useEffect2, useState as useState3 } from "react";
+import { useEffect as useEffect5, useState as useState7 } from "react";
 
 // src/components/FieldInput.tsx
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
 var inputClass = "w-full rounded-md border border-slate-300 px-3 py-1.5 text-sm text-slate-800 shadow-sm focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500 disabled:bg-slate-100";
 function FieldInput({
   field,
@@ -410,7 +1046,7 @@ function FieldInput({
   const id = `field-${field.name}`;
   switch (field.type) {
     case "boolean":
-      return /* @__PURE__ */ jsx6(
+      return /* @__PURE__ */ jsx8(
         "input",
         {
           id,
@@ -426,7 +1062,7 @@ function FieldInput({
     case "float":
     case "decimal":
     case "currency":
-      return /* @__PURE__ */ jsx6(
+      return /* @__PURE__ */ jsx8(
         "input",
         {
           id,
@@ -440,7 +1076,7 @@ function FieldInput({
         }
       );
     case "enum":
-      return /* @__PURE__ */ jsxs5(
+      return /* @__PURE__ */ jsxs7(
         "select",
         {
           id,
@@ -449,13 +1085,13 @@ function FieldInput({
           onChange: (e) => onChange(e.target.value),
           className: inputClass,
           children: [
-            /* @__PURE__ */ jsx6("option", { value: "", children: "\u2014" }),
-            field.enumOptions?.map((o) => /* @__PURE__ */ jsx6("option", { value: String(o.value), children: o.label }, String(o.value)))
+            /* @__PURE__ */ jsx8("option", { value: "", children: "\u2014" }),
+            field.enumOptions?.map((o) => /* @__PURE__ */ jsx8("option", { value: String(o.value), children: o.label }, String(o.value)))
           ]
         }
       );
     case "date":
-      return /* @__PURE__ */ jsx6(
+      return /* @__PURE__ */ jsx8(
         "input",
         {
           id,
@@ -468,7 +1104,7 @@ function FieldInput({
       );
     case "text":
     case "json":
-      return /* @__PURE__ */ jsx6(
+      return /* @__PURE__ */ jsx8(
         "textarea",
         {
           id,
@@ -491,7 +1127,7 @@ function FieldInput({
         }
       );
     default:
-      return /* @__PURE__ */ jsx6(
+      return /* @__PURE__ */ jsx8(
         "input",
         {
           id,
@@ -507,23 +1143,37 @@ function FieldInput({
 }
 
 // src/components/EntityForm.tsx
-import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
 function EntityForm({
   entity,
   mode,
   id,
+  cloneFromId,
   onCancel,
   onSaved
 }) {
   const client = useClient();
+  const t = useT();
   const fields = formFields(entity, mode);
-  const existing = useEntityRecord(entity.id, mode === "edit" ? id : void 0);
-  const [values, setValues] = useState3({});
-  const [saving, setSaving] = useState3(false);
-  const [error, setError] = useState3(void 0);
-  useEffect2(() => {
-    if (mode === "edit" && existing.data) setValues(existing.data);
-  }, [mode, existing.data]);
+  const sourceId = mode === "edit" ? id : cloneFromId;
+  const existing = useEntityRecord(entity.id, sourceId);
+  const [values, setValues] = useState7({});
+  const [saving, setSaving] = useState7(false);
+  const [error, setError] = useState7(void 0);
+  useEffect5(() => {
+    if (!existing.data || !sourceId) return;
+    if (mode === "edit") {
+      setValues(existing.data);
+      return;
+    }
+    const seed = {};
+    for (const f of entity.fields) {
+      if (f.name === entity.primaryKey) continue;
+      if (!f.form.cloneable || f.readonly) continue;
+      if (existing.data[f.name] !== void 0) seed[f.name] = existing.data[f.name];
+    }
+    setValues(seed);
+  }, [mode, sourceId, existing.data, entity]);
   const submit = async (e) => {
     e.preventDefault();
     setSaving(true);
@@ -541,25 +1191,26 @@ function EntityForm({
       setSaving(false);
     }
   };
-  if (mode === "edit" && existing.loading && !existing.data) {
-    return /* @__PURE__ */ jsx7(Spinner, {});
+  if (sourceId && existing.loading && !existing.data) {
+    return /* @__PURE__ */ jsx9(Spinner, {});
   }
-  return /* @__PURE__ */ jsxs6("section", { className: "max-w-2xl space-y-4", children: [
-    /* @__PURE__ */ jsxs6("header", { children: [
-      /* @__PURE__ */ jsxs6("button", { onClick: onCancel, className: "text-sm text-indigo-600 hover:underline", children: [
+  const title = mode === "edit" ? t.editTitle(entity.label.singular) : cloneFromId ? t.cloneTitle(entity.label.singular) : t.newTitle(entity.label.singular);
+  return /* @__PURE__ */ jsxs8("section", { className: "max-w-2xl space-y-4", children: [
+    /* @__PURE__ */ jsxs8("header", { children: [
+      /* @__PURE__ */ jsxs8("button", { onClick: onCancel, className: "text-sm text-indigo-600 hover:underline", children: [
         "\u2190 ",
         entity.label.plural
       ] }),
-      /* @__PURE__ */ jsx7("h1", { className: "text-lg font-semibold text-slate-900", children: mode === "create" ? `New ${entity.label.singular}` : `Edit ${entity.label.singular}` })
+      /* @__PURE__ */ jsx9("h1", { className: "text-lg font-semibold text-slate-900", children: title })
     ] }),
-    error && /* @__PURE__ */ jsx7(ErrorBanner, { error }),
-    /* @__PURE__ */ jsxs6("form", { onSubmit: submit, className: "space-y-4 rounded-lg border border-slate-200 bg-white p-5", children: [
-      fields.map((f) => /* @__PURE__ */ jsxs6("div", { className: "space-y-1", children: [
-        /* @__PURE__ */ jsxs6("label", { htmlFor: `field-${f.name}`, className: "block text-sm font-medium text-slate-700", children: [
+    error && /* @__PURE__ */ jsx9(ErrorBanner, { error }),
+    /* @__PURE__ */ jsxs8("form", { onSubmit: submit, className: "space-y-4 rounded-lg border border-slate-200 bg-white p-5", children: [
+      fields.map((f) => /* @__PURE__ */ jsxs8("div", { className: "space-y-1", children: [
+        /* @__PURE__ */ jsxs8("label", { htmlFor: `field-${f.name}`, className: "block text-sm font-medium text-slate-700", children: [
           f.label,
-          f.required && /* @__PURE__ */ jsx7("span", { className: "ml-0.5 text-red-500", children: "*" })
+          f.required && /* @__PURE__ */ jsx9("span", { className: "ml-0.5 text-red-500", children: "*" })
         ] }),
-        /* @__PURE__ */ jsx7(
+        /* @__PURE__ */ jsx9(
           FieldInput,
           {
             field: f,
@@ -568,77 +1219,154 @@ function EntityForm({
             onChange: (next) => setValues((v) => ({ ...v, [f.name]: next }))
           }
         ),
-        f.form.helpText && /* @__PURE__ */ jsx7("p", { className: "text-xs text-slate-500", children: f.form.helpText })
+        f.form.helpText && /* @__PURE__ */ jsx9("p", { className: "text-xs text-slate-500", children: f.form.helpText })
       ] }, f.name)),
-      /* @__PURE__ */ jsxs6("div", { className: "flex justify-end gap-2 border-t border-slate-100 pt-4", children: [
-        /* @__PURE__ */ jsx7(Button, { type: "button", variant: "secondary", onClick: onCancel, disabled: saving, children: "Cancel" }),
-        /* @__PURE__ */ jsx7(Button, { type: "submit", variant: "primary", disabled: saving, children: saving ? "Saving\u2026" : mode === "create" ? "Create" : "Save" })
+      /* @__PURE__ */ jsxs8("div", { className: "flex justify-end gap-2 border-t border-slate-100 pt-4", children: [
+        /* @__PURE__ */ jsx9(Button, { type: "button", variant: "secondary", onClick: onCancel, disabled: saving, children: t.cancel }),
+        /* @__PURE__ */ jsx9(Button, { type: "submit", variant: "primary", disabled: saving, children: saving ? t.saving : mode === "create" ? t.create : t.save })
       ] })
     ] })
   ] });
 }
 
+// src/labels.ts
+function relabelField(field, entityOverride, globalFields) {
+  const label = entityOverride?.fields?.[field.name] ?? globalFields[field.name];
+  return label ? { ...field, label } : field;
+}
+function relabelEntity(entity, labels) {
+  const override = labels.entities?.[entity.id] ?? labels.entities?.[entity.table];
+  const globalFields = labels.fields ?? {};
+  return {
+    ...entity,
+    label: {
+      singular: override?.singular ?? entity.label.singular,
+      plural: override?.plural ?? override?.singular ?? entity.label.plural
+    },
+    fields: entity.fields.map((f) => relabelField(f, override, globalFields))
+  };
+}
+function applyLabels(metadata, labels) {
+  if (!labels || !labels.entities && !labels.fields) return metadata;
+  return { ...metadata, entities: metadata.entities.map((e) => relabelEntity(e, labels)) };
+}
+
+// src/recents.ts
+import { useCallback as useCallback2, useState as useState8 } from "react";
+var STORAGE_KEY = "maestro-admin:recents";
+var MAX_RECENTS = 8;
+function read(key) {
+  try {
+    const raw = globalThis.localStorage?.getItem(key);
+    const parsed = raw ? JSON.parse(raw) : [];
+    return Array.isArray(parsed) ? parsed.filter((x) => typeof x === "string") : [];
+  } catch {
+    return [];
+  }
+}
+function write(key, ids) {
+  try {
+    globalThis.localStorage?.setItem(key, JSON.stringify(ids));
+  } catch {
+  }
+}
+function useRecents(scope) {
+  const key = scope ? `${STORAGE_KEY}:${scope}` : STORAGE_KEY;
+  const [recents, setRecents] = useState8(() => read(key));
+  const push = useCallback2(
+    (entityId) => {
+      setRecents((prev) => {
+        const next = [entityId, ...prev.filter((id) => id !== entityId)].slice(0, MAX_RECENTS);
+        write(key, next);
+        return next;
+      });
+    },
+    [key]
+  );
+  return { recents, push };
+}
+
 // src/components/MaestroAdmin.tsx
-import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
-function AdminShell({ title }) {
+import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+function AdminShell({ title, labels }) {
   const { data, error, loading } = useMetadata();
-  const [view, setView] = useState4(void 0);
-  const entities = data?.entities ?? [];
+  const t = useT();
+  const [view, setView] = useState9(void 0);
+  const { recents, push: pushRecent } = useRecents();
+  const metadata = useMemo3(() => data ? applyLabels(data, labels) : void 0, [data, labels]);
+  const entities = metadata?.entities ?? [];
   const activeId = view?.entityId ?? entities[0]?.id;
   const activeEntity = entities.find((e) => e.id === activeId);
   const effectiveView = view ?? (activeId ? { kind: "list", entityId: activeId } : void 0);
+  const openEntity = (entityId) => {
+    pushRecent(entityId);
+    setView({ kind: "list", entityId });
+  };
+  const navigateToRecord = (entityId, id) => {
+    pushRecent(entityId);
+    setView({ kind: "detail", entityId, id });
+  };
   if (loading && !data) {
-    return /* @__PURE__ */ jsx8("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ jsx8(Spinner, { label: "Loading metadata\u2026" }) });
+    return /* @__PURE__ */ jsx10("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ jsx10(Spinner, { label: t.loadingMetadata }) });
   }
-  return /* @__PURE__ */ jsxs7("div", { className: "flex h-full min-h-screen bg-white text-slate-800", children: [
-    /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx10(AdminEntitiesProvider, { value: entities, children: /* @__PURE__ */ jsxs9("div", { className: "flex h-screen overflow-hidden bg-white text-slate-800", children: [
+    /* @__PURE__ */ jsx10(
       Sidebar,
       {
         entities,
         activeId,
         title,
-        onSelect: (entityId) => setView({ kind: "list", entityId })
+        labels,
+        recents,
+        onSelect: openEntity
       }
     ),
-    /* @__PURE__ */ jsxs7("main", { className: "flex-1 overflow-y-auto p-6", children: [
-      error && /* @__PURE__ */ jsx8(ErrorBanner, { error }),
-      activeEntity && effectiveView && effectiveView.kind === "list" && /* @__PURE__ */ jsx8(
+    /* @__PURE__ */ jsxs9("main", { className: "flex-1 overflow-y-auto p-6", children: [
+      error && /* @__PURE__ */ jsx10(ErrorBanner, { error }),
+      activeEntity && effectiveView && effectiveView.kind === "list" && /* @__PURE__ */ jsx10(
         EntityList,
         {
           entity: activeEntity,
           onOpen: (id) => setView({ kind: "detail", entityId: activeEntity.id, id }),
           onCreate: () => setView({ kind: "create", entityId: activeEntity.id }),
-          onEdit: (id) => setView({ kind: "edit", entityId: activeEntity.id, id })
+          onEdit: (id) => setView({ kind: "edit", entityId: activeEntity.id, id }),
+          onClone: (id) => setView({ kind: "create", entityId: activeEntity.id, cloneFromId: id }),
+          onNavigate: navigateToRecord
         }
       ),
-      activeEntity && effectiveView?.kind === "detail" && /* @__PURE__ */ jsx8(
+      activeEntity && effectiveView?.kind === "detail" && /* @__PURE__ */ jsx10(
         EntityDetail,
         {
           entity: activeEntity,
           id: effectiveView.id,
           onBack: () => setView({ kind: "list", entityId: activeEntity.id }),
-          onEdit: () => setView({ kind: "edit", entityId: activeEntity.id, id: effectiveView.id })
+          onEdit: () => setView({ kind: "edit", entityId: activeEntity.id, id: effectiveView.id }),
+          onClone: () => setView({ kind: "create", entityId: activeEntity.id, cloneFromId: effectiveView.id }),
+          onDeleted: () => setView({ kind: "list", entityId: activeEntity.id }),
+          onNavigate: navigateToRecord
         }
       ),
-      activeEntity && (effectiveView?.kind === "create" || effectiveView?.kind === "edit") && /* @__PURE__ */ jsx8(
+      activeEntity && (effectiveView?.kind === "create" || effectiveView?.kind === "edit") && /* @__PURE__ */ jsx10(
         EntityForm,
         {
           entity: activeEntity,
           mode: effectiveView.kind,
           id: effectiveView.kind === "edit" ? effectiveView.id : void 0,
+          cloneFromId: effectiveView.kind === "create" ? effectiveView.cloneFromId : void 0,
           onCancel: () => setView({ kind: "list", entityId: activeEntity.id }),
           onSaved: () => setView({ kind: "list", entityId: activeEntity.id })
         }
       )
     ] })
-  ] });
+  ] }) });
 }
 function MaestroAdmin(props) {
-  const client = useMemo2(
+  const client = useMemo3(
     () => props.client ?? new MaestroClient({ apiUrl: props.apiUrl ?? "", headers: props.headers }),
     [props.client, props.apiUrl, props.headers]
   );
-  return /* @__PURE__ */ jsx8(AdminClientProvider, { value: client, children: /* @__PURE__ */ jsx8(AdminShell, { title: props.title ?? "Maestro Admin" }) });
+  const strings = useMemo3(() => stringsFor(props.locale ?? "en"), [props.locale]);
+  return /* @__PURE__ */ jsx10(AdminClientProvider, { value: client, children: /* @__PURE__ */ jsx10(I18nProvider, { value: strings, children: /* @__PURE__ */ jsx10(AdminShell, { title: props.title ?? "Maestro Admin", labels: props.labels }) }) });
 }
 export {
   AdminClientProvider,
@@ -647,17 +1375,24 @@ export {
   EntityList,
   FieldInput,
   FieldValue,
+  I18nProvider,
   MaestroAdmin,
   MaestroApiError,
   MaestroClient,
   Sidebar,
+  applyLabels,
+  buildMenu,
   detailFields,
   formFields,
   listFields,
+  primaryListFields,
+  stringsFor,
   useAsync,
   useClient,
   useEntityList,
   useEntityRecord,
-  useMetadata
+  useMetadata,
+  useRecents,
+  useT
 };
 //# sourceMappingURL=index.js.map