@protobase/ui 0.58.3 → 0.58.5

package/dist/app/list-actions/use-list-actions.js

@@ -2,25 +2,24 @@ import { useAdminMeta } from "../meta-gate.js";
 import { useAppAddress } from "../use-app-address.js";
 import { ConfirmAction } from "../pages/confirm-action.js";
 import { isDanger } from "../pages/action-prompt.js";
-import { actionApplies } from "../pages/action-when.js";
-import { actionFor, linkTarget, openLink } from "../pages/action-href.js";
+import { actionFor } from "../pages/action-href.js";
 import { useActionRunner } from "../pages/use-run-action.js";
 import { text } from "../list-messages.js";
+import { actionLink } from "../pages/action-link.js";
 import { rowRecord } from "./row-record.js";
 import { useState } from "react";
-import { fillAddress } from "@protobase/schema/internal";
 import { jsx } from "react/jsx-runtime";
 //#region src/app/list-actions/use-list-actions.tsx
 /**
 * The named actions of `model`'s view for its list, those without inputs (which ask in a dialog of their own): each
 * in the row menu of the rows it shows for, disabled with its reason where `when` disables it, and in red when it is a
-* delete or a danger action; a link is a link there. Updates and handlers marked `bulk` are offered for a selection
+* delete or a danger action; a link is a link there, and a disabled one a disabled item without one. Updates and handlers marked `bulk` are offered for a selection
 * while one selected row applies, and run on those that do. `prompt` is the question one asks before it runs.
 */
 const useListActions = (model) => {
 	const { views } = useAdminMeta();
 	const runner = useActionRunner(model.name, void 0);
-	const { go, href } = useAppAddress();
+	const app = useAppAddress();
 	const [asking, setAsking] = useState();
 	const listed = (views[model.name]?.actions ?? []).filter((action) => !action.inputs?.length);
 	const perform = (run) => "row" in run ? runner.run(run.action, run.row) : runner.runEach(run.action, run.selection, run.skipped);
@@ -36,33 +35,18 @@ const useListActions = (model) => {
 				destructive: isDanger(action)
 			};
 			const run = action.run;
-			if (run?.kind === "link") {
-				const available = (row) => shown(row) !== void 0 && actionApplies(action, rowRecord(model, row).record);
-				if ("to" in run) {
-					const address = (row) => fillAddress(run.to, rowRecord(model, row).record);
-					return {
-						...base,
-						available,
-						link: (row) => ({
-							href: href(address(row)),
-							onFollow: () => go(address(row))
-						})
-					};
-				}
-				const target = (row) => linkTarget(run.href, rowRecord(model, row).record) ?? "";
-				return {
-					...base,
-					available,
-					link: (row) => ({
-						href: target(row),
-						onFollow: () => openLink(target(row))
-					})
-				};
-			}
+			const blocked = (row) => runner.blockedOn(action, rowRecord(model, row));
+			const available = (row) => shown(row) !== void 0;
+			if (run?.kind === "link") return {
+				...base,
+				available,
+				blocked,
+				link: (row) => actionLink(run, rowRecord(model, row).record, app)
+			};
 			return {
 				...base,
-				available: (row) => shown(row) !== void 0,
-				blocked: (row) => runner.blockedOn(action, rowRecord(model, row)),
+				available,
+				blocked,
 				onSelect: (row) => start({
 					action,
 					row: rowRecord(model, row)

package/dist/app/pages/action-link.js

@@ -0,0 +1,25 @@
+import { linkTarget } from "./action-href.js";
+import { fillAddress } from "@protobase/schema/internal";
+//#region src/app/pages/action-link.ts
+/**
+* A link action on `record` as a link: an address in the app is followed in place, a page outside it, an `https:` or
+* `http:` one in a new tab, is left to the browser. A link whose `href` has no target on the record is never shown
+* (`actionFor` leaves it out), so asking for it is a mistake.
+*/
+const actionLink = (run, record, { href, go }) => {
+	if ("to" in run) {
+		const to = fillAddress(run.to, record);
+		return {
+			href: href(to),
+			onFollow: () => go(to)
+		};
+	}
+	const target = linkTarget(run.href, record);
+	if (target === void 0) throw new Error("A link action without a target on the record is not shown");
+	return {
+		href: target,
+		newTab: /^https?:/i.test(target)
+	};
+};
+//#endregion
+export { actionLink };

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

@@ -1,4 +1,5 @@
 import { ActionRail } from "../../record-view/action-rail.js";
+import { RouteLink } from "../../primitives/route-link.js";
 import { AppLink, useAppAddress } from "../use-app-address.js";
 import { ActionMenu } from "../../record-view/action-menu.js";
 import { ActionPrompt, asksFirst, isDanger } from "./action-prompt.js";
@@ -6,6 +7,7 @@ import { useActionRunner } from "./use-run-action.js";
 import { useTopBarSlot } from "../../app-shell/top-bar-slot.js";
 import "../../app-shell/top-bar.js";
 import { text } from "../record-messages.js";
+import { actionLink } from "./action-link.js";
 import { actionIcon } from "../action-icon.js";
 import { useState } from "react";
 import { Pencil, Trash2 } from "lucide-react";
@@ -19,7 +21,8 @@ import { createPortal } from "react-dom";
 * however long the record is, when the shell has a top bar.
 */
 const RecordActions = ({ model, stored, recordKey, edit, onDelete }) => {
-	const { go } = useAppAddress();
+	const app = useAppAddress();
+	const { go } = app;
 	const slot = useTopBarSlot();
 	const scope = {
 		model,
@@ -33,14 +36,24 @@ const RecordActions = ({ model, stored, recordKey, edit, onDelete }) => {
 		resource: model.name
 	}, { replace: true }));
 	const [asking, setAsking] = useState();
-	const named = runner.actions.map((action) => ({
-		name: action.label,
-		icon: actionIcon(action.icon),
-		blocked: runner.blocked(action),
-		running: runner.running === action.name,
-		...isDanger(action) && { tone: "danger" },
-		onRun: () => asksFirst(action) ? setAsking(action) : void runner.run(action)
-	}));
+	const named = runner.actions.map((action) => {
+		const blocked = runner.blocked(action);
+		const link = action.run?.kind === "link" && !blocked ? actionLink(action.run, stored.record, app) : void 0;
+		return {
+			name: action.label,
+			icon: actionIcon(action.icon),
+			blocked,
+			running: runner.running === action.name,
+			...isDanger(action) && { tone: "danger" },
+			onRun: () => asksFirst(action) ? setAsking(action) : void runner.run(action),
+			...link && { render: ({ className, children, role }) => /* @__PURE__ */ jsx(RouteLink, {
+				to: link,
+				role,
+				className,
+				children
+			}) }
+		};
+	});
 	const deletes = runner.actions.some((action) => action.run?.kind === "delete");
 	const actions = [
 		...edit ? [{

package/dist/data-grid/row-menu.js

@@ -40,7 +40,7 @@ const RowMenu = ({ row, actions }) => {
 				const itemClass = cn("block w-full px-3 py-1.5 text-left hover:bg-muted disabled:cursor-default disabled:opacity-60 disabled:hover:bg-transparent", action.destructive && "text-danger-text");
 				return /* @__PURE__ */ jsx("li", {
 					role: "none",
-					children: action.link ? /* @__PURE__ */ jsx(RouteLink, {
+					children: action.link && blocked === void 0 ? /* @__PURE__ */ jsx(RouteLink, {
 						role: "menuitem",
 						to: action.link(row),
 						onClick: () => setOpen(false),
@@ -54,7 +54,7 @@ const RowMenu = ({ row, actions }) => {
 						className: itemClass,
 						onClick: () => {
 							setOpen(false);
-							action.onSelect(row);
+							action.onSelect?.(row);
 						},
 						children: label
 					})

package/dist/package.js

@@ -1,5 +1,5 @@
 //#region package.json
-var version = "0.58.3";
+var version = "0.58.5";
 var protobase = { "pluginApi": 1 };
 //#endregion
 export { protobase, version };

package/dist/primitives/route-link.js

@@ -6,15 +6,22 @@ import { jsx } from "react/jsx-runtime";
 * with Ctrl, Cmd, Shift or Alt opens it in a new tab or window, or saves it, as on any link. Every navigation a click
 * starts is one of these, never a button that moves the page, so the browser shows where it goes and can open it.
 */
-const RouteLink = ({ to, onClick, ...rest }) => /* @__PURE__ */ jsx("a", {
-	href: to.href,
-	onClick: (event) => {
-		onClick?.(event);
-		if (event.defaultPrevented || !inApp(event)) return;
-		event.preventDefault();
-		to.onFollow();
-	},
-	...rest
-});
+const RouteLink = ({ to, onClick, ...rest }) => {
+	const { href, onFollow, newTab } = to;
+	return /* @__PURE__ */ jsx("a", {
+		href,
+		...newTab && {
+			target: "_blank",
+			rel: "noreferrer"
+		},
+		onClick: (event) => {
+			onClick?.(event);
+			if (!onFollow || event.defaultPrevented || !inApp(event)) return;
+			event.preventDefault();
+			onFollow();
+		},
+		...rest
+	});
+};
 //#endregion
 export { RouteLink };