@protobase/ui 0.12.22 → 0.13.0

package/dist/shell/assets/records-map-D0EOO5kZ.js

@@ -0,0 +1 @@
+import{r as e}from"./rolldown-runtime-hePW80VL.js";import{t}from"./react-Cvdyeg_0.js";import{G as n,_ as r,g as i}from"./app-DLjaMVJD.js";import{t as a}from"./jsx-runtime-NZYk81nU.js";import{Ft as o,it as s,n as c,r as l,t as u}from"./record-map-DL4b9dZO.js";var d=e(t(),1),f=e(a(),1),p=28,m={padding:48,maxZoom:15,duration:0},h=32,g=({style:e,points:t,selected:a,covered:g,onSelect:_,onClear:v,markerLabel:y})=>{let b=(0,d.useRef)(null),[x,S]=(0,d.useState)([]),C=new globalThis.Map(t.map(e=>[e.key,e])),w=t.map(e=>e.key).join(`,`),T=r(t),E=()=>{let e=b.current?.getMap();e&&S(i(t.map(t=>({key:t.key,...e.project([t.longitude,t.latitude])})),p))};(0,d.useEffect)(()=>{let e=b.current?.getMap();e&&(T&&e.fitBounds(T,m),E())},[w]);let D=x.find(e=>a!==void 0&&e.keys.some(e=>a.includes(e)))?.at;return(0,d.useEffect)(()=>{let e=b.current?.getMap(),t=D===void 0?void 0:C.get(D);if(!e||!t||g===0)return;let{y:n}=e.project([t.longitude,t.latitude]),r=e.getContainer().clientHeight-g;n>h&&n<r||e.easeTo({center:[t.longitude,t.latitude],offset:[0,(h-g)/2],duration:300})},[D,g]),(0,f.jsxs)(l,{ref:b,mapLib:s,mapStyle:e,initialViewState:T?{bounds:T,fitBoundsOptions:m}:{latitude:0,longitude:0,zoom:1},style:{width:`100%`,height:`100%`},onLoad:E,onZoomEnd:E,onClick:v,children:[(0,f.jsx)(u,{showCompass:!1}),x.map(e=>{let t=C.get(e.at);if(!t)return null;let r=a!==void 0&&e.keys.some(e=>a.includes(e));return(0,f.jsx)(c,{latitude:t.latitude,longitude:t.longitude,anchor:`bottom`,style:{zIndex:+!!r},children:(0,f.jsxs)(`button`,{type:`button`,"aria-label":y(e.keys),"aria-pressed":r,className:`relative block cursor-pointer`,onClick:t=>{t.stopPropagation(),_(e.keys)},children:[(0,f.jsx)(o,{"aria-hidden":!0,className:n(`size-8 drop-shadow`,r?`fill-foreground text-background`:`fill-primary text-primary-foreground`),strokeWidth:1.5}),e.keys.length>1&&(0,f.jsx)(`span`,{className:`absolute -right-2 -top-1 min-w-5 rounded-full border border-background bg-foreground px-1 text-center text-[11px] font-medium leading-4 text-background tabular-nums`,children:e.keys.length})]})},e.at)})]})};export{g as RecordsMap};

package/dist/shell/assets/shared-protobase-ui-B8UXOIeW.js

@@ -0,0 +1 @@
+import{r as e}from"./rolldown-runtime-hePW80VL.js";import{A as t,B as n,C as r,D as i,E as a,F as o,H as s,I as c,L as l,M as u,N as d,P as f,R as p,S as m,T as h,U as g,V as _,W as v,a as y,b,c as x,d as S,f as C,h as w,i as T,j as E,k as D,l as O,m as k,n as A,o as j,p as M,r as N,s as P,t as F,u as I,v as L,w as R,x as z,y as B,z as V}from"./app-DLjaMVJD.js";import{t as H}from"./jsx-runtime-NZYk81nU.js";var U=e(H(),1),W=({row:e,resource:t,recordKey:n,...r})=>{let i=w(),a=I(),o=t??i?.resource??a?.model.name;if(o===void 0)throw Error(`RecordLink needs a resource outside a list display or a record`);return(0,U.jsx)(L,{to:{kind:`record`,resource:o,key:e?e.key:n},...r})};export{o as ActionCard,s as ApiProvider,F as App,L as AppLink,r as AssistantDock,V as ChatMessage,p as ChatThread,d as CompactTable,l as Composer,t as DiffView,f as FieldList,h as PartView,W as RecordLink,c as SidePanel,D as StepList,a as definePlugin,i as defineUi,E as diffStats,A as isConflict,x as mergeUi,u as parseDiff,y as pluginApi,j as protobaseVersion,O as uiFromModule,_ as useApiToken,B as useAppAddress,m as useAssistant,z as useAssistantClient,R as useBackendData,g as useClient,S as useFacets,C as useHistogram,I as useLayoutRecord,T as useList,k as useListDisplay,b as useMeta,P as usePlugin,n as useRecord,v as useResourceClient,M as useSeries,N as useUpdateRecord};

package/dist/shell/index.html

@@ -6,15 +6,15 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
     <title>Protobase</title>
-    <script type="importmap">{"imports":{"react":"/assets/shared-react-DhkZ2M4l.js","react/jsx-runtime":"/assets/shared-react-jsx-runtime-xPQrWk0g.js","react-dom":"/assets/shared-react-dom-D508a1cq.js","@protobase/ui":"/assets/shared-protobase-ui-Bol6wL_S.js"}}</script>
-    <script type="module" crossorigin src="/assets/index-B8MhIaLr.js"></script>
+    <script type="importmap">{"imports":{"react":"/assets/shared-react-DhkZ2M4l.js","react/jsx-runtime":"/assets/shared-react-jsx-runtime-xPQrWk0g.js","react-dom":"/assets/shared-react-dom-D508a1cq.js","@protobase/ui":"/assets/shared-protobase-ui-B8UXOIeW.js"}}</script>
+    <script type="module" crossorigin src="/assets/index-D7IcSr6n.js"></script>
     <link rel="modulepreload" crossorigin href="/assets/rolldown-runtime-hePW80VL.js">
     <link rel="modulepreload" crossorigin href="/assets/react-Cvdyeg_0.js">
-    <link rel="modulepreload" crossorigin href="/assets/jsx-runtime-NZYk81nU.js">
     <link rel="modulepreload" crossorigin href="/assets/react-dom-B-VxWsjA.js">
-    <link rel="modulepreload" crossorigin href="/assets/app-BYw-8qpE.js">
+    <link rel="modulepreload" crossorigin href="/assets/jsx-runtime-NZYk81nU.js">
+    <link rel="modulepreload" crossorigin href="/assets/app-DLjaMVJD.js">
     <link rel="stylesheet" crossorigin href="/assets/app-GUjJKojE.css">
-    <link rel="stylesheet" crossorigin href="/assets/index-CdSIk0BQ.css">
+    <link rel="stylesheet" crossorigin href="/assets/index-BYPphaEm.css">
     <link rel="stylesheet" href="/protobase.theme.css">
   </head>
   <body>

package/dist/shell/protobase.shell.json

@@ -1,5 +1,5 @@
 {
-  "protobase": "0.12.22",
+  "protobase": "0.13.0",
   "pluginApi": 1,
   "paths": [
     "/index.html",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@protobase/ui",
-  "version": "0.12.22",
+  "version": "0.13.0",
   "description": "The Protobase admin app and the React hooks and components for custom UI.",
   "license": "Apache-2.0",
   "repository": {
@@ -38,13 +38,12 @@
   "dependencies": {
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",
-    "@protobase/client": "0.12.22",
-    "@protobase/layout": "0.12.22",
-    "@protobase/schema": "0.12.22",
+    "@protobase/client": "0.13.0",
+    "@protobase/layout": "0.13.0",
+    "@protobase/schema": "0.13.0",
     "@sentry/browser": "^11.7.0",
     "@tanstack/react-query": "^5.104.1",
     "@tanstack/react-table": "^9.2.6",
-    "@tanstack/react-virtual": "^3.14.13",
     "lucide-react": "^1.52.0",
     "maplibre-gl": "^6.14.0",
     "pmtiles": "^4.5.0",

package/dist/app/pages/record-table.js

@@ -1,114 +0,0 @@
-import { Button } from "../../primitives/button.js";
-import { humanize } from "../../live/naming.js";
-import { useAdminMeta } from "../meta-gate.js";
-import { AppLink } from "../use-app-address.js";
-import { scopeOf } from "./use-layout-data.js";
-import { FieldValue } from "./field-value.js";
-import { usePathValue } from "./use-path-value.js";
-import { useRelationLabels } from "./use-relation-labels.js";
-import { ChevronLeft, ChevronRight } from "lucide-react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { resolveFieldPath } from "@protobase/layout";
-//#region src/app/pages/record-table.tsx
-const isPath = (column) => column.includes(".");
-/** The header of a column: the label of the field it ends at, from that field's view. */
-const useHeader = (model) => {
-	const { resources, views } = useAdminMeta();
-	return (column) => {
-		const resolved = resolveFieldPath(resources, model.name, column);
-		const last = resolved.ok ? resolved.steps.at(-1) : void 0;
-		const name = last?.field.name ?? column;
-		return views[last?.model.name ?? model.name]?.fields[name]?.label ?? humanize(name);
-	};
-};
-/** A value through relations (`unitId.propertyId`), fetched like the record page fetches it and cached. */
-const PathCell = ({ model, row, column }) => {
-	const value = usePathValue(scopeOf(model, row), column);
-	if (value.state === "loading") return /* @__PURE__ */ jsx("span", {
-		className: "text-muted-foreground",
-		children: "…"
-	});
-	if (value.state === "missing") return /* @__PURE__ */ jsx("span", {
-		className: "text-muted-foreground",
-		children: "—"
-	});
-	return /* @__PURE__ */ jsx(FieldValue, {
-		model: value.model,
-		field: value.field,
-		value: value.value
-	});
-};
-/**
-* Records as table rows; the first column opens the record, unless it is a relation, which links to the record it
-* names instead (a join record's first column is usually what it joins). Columns may follow relations (`unitId.propertyId`).
-*/
-const RecordTable = ({ model, columns, rows, label, pager }) => {
-	const { resources } = useAdminMeta();
-	const header = useHeader(model);
-	const first = columns[0] === void 0 ? void 0 : resolveFieldPath(resources, model.name, columns[0]);
-	const opensRecord = !first?.ok || first.steps.at(-1).field.type !== "relation";
-	const labels = useRelationLabels(model, columns.filter((column) => !isPath(column)), rows);
-	const cell = (row, column) => isPath(column) ? /* @__PURE__ */ jsx(PathCell, {
-		model,
-		row,
-		column
-	}) : /* @__PURE__ */ jsx(FieldValue, {
-		model,
-		field: model.fields[column],
-		value: row[column],
-		relationLabel: labels.get(column)?.get(String(row[column]))
-	});
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
-		className: "-mx-4 overflow-x-auto",
-		children: /* @__PURE__ */ jsxs("table", {
-			className: "w-full min-w-max text-left text-[13px]",
-			children: [/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", {
-				className: "border-b text-xs text-muted-foreground",
-				children: columns.map((column) => /* @__PURE__ */ jsx("th", {
-					scope: "col",
-					className: "px-4 py-2 font-medium",
-					children: header(column)
-				}, column))
-			}) }), /* @__PURE__ */ jsx("tbody", { children: rows.map((row) => {
-				const scope = scopeOf(model, row);
-				return /* @__PURE__ */ jsx("tr", {
-					className: "border-b last:border-0 hover:bg-surface",
-					children: columns.map((column, index) => /* @__PURE__ */ jsx("td", {
-						className: "px-4 py-2",
-						children: index === 0 && opensRecord ? /* @__PURE__ */ jsx(AppLink, {
-							to: {
-								kind: "record",
-								resource: model.name,
-								key: scope.key
-							},
-							className: "font-medium text-primary-text hover:underline",
-							children: cell(row, column)
-						}) : cell(row, column)
-					}, column))
-				}, scope.key);
-			}) })]
-		})
-	}), pager && (pager.hasPrevious || pager.hasNext) && /* @__PURE__ */ jsxs("nav", {
-		"aria-label": `${label} pages`,
-		className: "mt-3 flex items-center justify-end gap-2 text-xs text-muted-foreground",
-		children: [
-			/* @__PURE__ */ jsxs("span", { children: ["Page ", pager.page] }),
-			/* @__PURE__ */ jsx(Button, {
-				size: "sm",
-				"aria-label": "Previous page",
-				disabled: !pager.hasPrevious || pager.busy,
-				onClick: pager.previous,
-				children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-3.5" })
-			}),
-			/* @__PURE__ */ jsx(Button, {
-				size: "sm",
-				"aria-label": "Next page",
-				disabled: !pager.hasNext || pager.busy,
-				onClick: pager.next,
-				children: /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5" })
-			})
-		]
-	})] });
-};
-//#endregion
-export { RecordTable };

package/dist/app/pages/use-relation-labels.js

@@ -1,30 +0,0 @@
-import { keys } from "../../data/query-keys.js";
-import { useClient } from "../../data/api-provider.js";
-import { fetchLabels } from "../../live/relation-labels.js";
-import { useAdminMeta } from "../meta-gate.js";
-import { useQueries, useQueryClient } from "@tanstack/react-query";
-//#region src/app/pages/use-relation-labels.ts
-/** Names for the relation columns of the rows on screen, one list call per column, by column then key. */
-const useRelationLabels = (model, columns, rows) => {
-	const { resources, views } = useAdminMeta();
-	const client = useClient();
-	const queryClient = useQueryClient();
-	const relations = columns.flatMap((name) => {
-		const field = model.fields[name];
-		const target = field?.type === "relation" && field.relation ? resources[field.relation.resource] : void 0;
-		if (!target || target.primaryKey.length !== 1) return [];
-		const ids = [...new Set(rows.flatMap((row) => row[name] === null || row[name] === void 0 ? [] : [String(row[name])]))].sort();
-		return ids.length > 0 ? [{
-			name,
-			target,
-			ids
-		}] : [];
-	});
-	const results = useQueries({ queries: relations.map(({ target, ids }) => ({
-		queryKey: keys.labelMap(target.name, ids.join(",")),
-		queryFn: () => fetchLabels(queryClient, client, target, ids, views[target.name])
-	})) });
-	return new Map(relations.flatMap(({ name }, index) => results[index]?.data ? [[name, results[index].data]] : []));
-};
-//#endregion
-export { useRelationLabels };