@panneau/lists 5.0.0-alpha.16 → 5.0.0-alpha.18

package/dist/actions/ConfirmDialog.js

@@ -1,5 +1,6 @@
 import { messages } from "../messages.js";
 import Actions_module_default from "./Actions.module.js";
+import { asksConfirmation } from "@panneau/core";
 import { c } from "react/compiler-runtime";
 import { getActionLabel } from "@panneau/intl";
 import { Button, Dialog, Spinner, usePanneauIntl } from "@panneau/ui";
@@ -13,10 +14,13 @@ function formatDefinitionMessage(intl, message, values) {
 		return message;
 	}
 }
-/** Whether an action needs a confirmation: it asks for one, or some selected items are skipped. */
+/**
+* Whether an action needs a confirmation: it asks for one, or it is undoable but runs on more items
+* than an undo can put back (`asksConfirmation()`, decision 0063), or some selected items are
+* skipped.
+*/
 function needsConfirmation(event) {
-	const { confirm } = event.action;
-	return confirm !== void 0 && confirm !== false || event.skipped.length > 0;
+	return asksConfirmation(event.action, event.count) || event.skipped.length > 0;
 }
 /**
 * Asks before running an action (decision 0017): the action's `confirm` title and message (an ICU

package/dist/actions/ConfirmDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConfirmDialog.js","names":["IntlShape","getActionLabel","Button","Dialog","Spinner","usePanneauIntl","messages","ListActionEvent","ListActionPreview","styles","formatDefinitionMessage","intl","message","values","Record","String","formatters","getMessageFormat","locale","format","needsConfirmation","event","confirm","action","undefined","skipped","length","ConfirmPreview","status","ConfirmDialogProps","preview","onConfirm","onCancel","ConfirmDialog","t0","$","_c","t1","count","loading","T0","t10","t2","t3","t4","t5","t6","t7","t8","t9","label","open","title","formatMessage","confirmTitle","t11","cancelLabel","cancel","destructive","confirmLabel","confirmMessage","t12","confirmChecking","confirmSkipped","t13","_c","_Fragment","styles"],"sources":["../../src/actions/ConfirmDialog.tsx"],"sourcesContent":["import type { IntlShape } from 'react-intl';\n\nimport { getActionLabel } from '@panneau/intl';\nimport { Button, Dialog, Spinner, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport type { ListActionEvent, ListActionPreview } from '../types';\nimport styles from './Actions.module.css';\n\n/** Formats an ICU message of the definition (`{count, plural, …}`) in the locale. */\nfunction formatDefinitionMessage(\n    intl: IntlShape,\n    message: string,\n    values: Record<string, unknown>,\n) {\n    try {\n        return String(\n            intl.formatters\n                .getMessageFormat(message, intl.locale)\n                .format(values as Record<string, string | number>),\n        );\n    } catch {\n        return message;\n    }\n}\n\n/** Whether an action needs a confirmation: it asks for one, or some selected items are skipped. */\nexport function needsConfirmation(event: ListActionEvent): boolean {\n    const { confirm } = event.action;\n    return (confirm !== undefined && confirm !== false) || event.skipped.length > 0;\n}\n\n/** The dry run of a query selection: in progress, or done with the backend's count. */\nexport type ConfirmPreview = { status: 'loading' } | ({ status: 'done' } & ListActionPreview);\n\nexport interface ConfirmDialogProps {\n    /** The action to confirm, or `null` when the dialog is closed. */\n    event: ListActionEvent | null;\n    /**\n     * What the backend told about a query selection. Its count of skipped items replaces the\n     * count of the current page; while it loads, the dialog says so and can't be confirmed.\n     */\n    preview?: ConfirmPreview | null;\n    onConfirm: (event: ListActionEvent) => void;\n    onCancel: () => void;\n}\n\n/**\n * Asks before running an action (decision 0017): the action's `confirm` title and message (an ICU\n * message with `{count}`), or default ones, and how many selected items will be skipped: those of\n * the current page that don't allow it, or the backend's count for every item matching a query.\n */\nexport function ConfirmDialog({ event, preview = null, onConfirm, onCancel }: ConfirmDialogProps) {\n    const intl = usePanneauIntl();\n    if (event === null) {\n        return null;\n    }\n    const { action, count } = event;\n    const loading = preview?.status === 'loading';\n    const skipped = preview?.status === 'done' ? preview.skipped : event.skipped.length;\n    const confirm = typeof action.confirm === 'object' ? action.confirm : {};\n    const label = getActionLabel(action, intl);\n    const values = { count, action: label };\n    return (\n        <Dialog\n            isOpen\n            onOpenChange={(open) => {\n                if (!open) {\n                    onCancel();\n                }\n            }}\n            role=\"alertdialog\"\n            isDismissable={false}\n            size=\"sm\"\n            title={\n                confirm.title !== undefined\n                    ? formatDefinitionMessage(intl, confirm.title, values)\n                    : intl.formatMessage(messages.confirmTitle, { action: label })\n            }\n            footer={\n                <>\n                    <Button variant=\"ghost\" onPress={onCancel}>\n                        {confirm.cancelLabel ?? intl.formatMessage(messages.cancel)}\n                    </Button>\n                    <Button\n                        variant={action.destructive === true ? 'danger' : 'primary'}\n                        autoFocus\n                        isDisabled={loading}\n                        onPress={() => onConfirm(event)}\n                    >\n                        {confirm.confirmLabel ?? label}\n                    </Button>\n                </>\n            }\n        >\n            <p className={styles.message}>\n                {confirm.message !== undefined\n                    ? formatDefinitionMessage(intl, confirm.message, values)\n                    : intl.formatMessage(messages.confirmMessage, values)}\n            </p>\n            {loading ? (\n                <div className={styles.skipped}>\n                    <Spinner\n                        size=\"sm\"\n                        label={intl.formatMessage(messages.confirmChecking)}\n                        showLabel\n                    />\n                </div>\n            ) : skipped > 0 ? (\n                <p className={styles.skipped}>\n                    {intl.formatMessage(messages.confirmSkipped, { count: skipped })}\n                </p>\n            ) : null}\n        </Dialog>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ConfirmDialog.js","names":["IntlShape","asksConfirmation","getActionLabel","Button","Dialog","Spinner","usePanneauIntl","messages","ListActionEvent","ListActionPreview","styles","formatDefinitionMessage","intl","message","values","Record","String","formatters","getMessageFormat","locale","format","needsConfirmation","event","action","count","skipped","length","ConfirmPreview","status","ConfirmDialogProps","preview","onConfirm","onCancel","ConfirmDialog","t0","$","_c","t1","undefined","loading","T0","t10","t2","t3","t4","t5","t6","t7","t8","t9","confirm","label","open","title","formatMessage","confirmTitle","t11","cancelLabel","cancel","destructive","confirmLabel","confirmMessage","t12","confirmChecking","confirmSkipped","t13","_c","_Fragment","styles"],"sources":["../../src/actions/ConfirmDialog.tsx"],"sourcesContent":["import type { IntlShape } from 'react-intl';\n\nimport { asksConfirmation } from '@panneau/core';\nimport { getActionLabel } from '@panneau/intl';\nimport { Button, Dialog, Spinner, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport type { ListActionEvent, ListActionPreview } from '../types';\nimport styles from './Actions.module.css';\n\n/** Formats an ICU message of the definition (`{count, plural, …}`) in the locale. */\nfunction formatDefinitionMessage(\n    intl: IntlShape,\n    message: string,\n    values: Record<string, unknown>,\n) {\n    try {\n        return String(\n            intl.formatters\n                .getMessageFormat(message, intl.locale)\n                .format(values as Record<string, string | number>),\n        );\n    } catch {\n        return message;\n    }\n}\n\n/**\n * Whether an action needs a confirmation: it asks for one, or it is undoable but runs on more items\n * than an undo can put back (`asksConfirmation()`, decision 0063), or some selected items are\n * skipped.\n */\nexport function needsConfirmation(event: ListActionEvent): boolean {\n    return asksConfirmation(event.action, event.count) || event.skipped.length > 0;\n}\n\n/** The dry run of a query selection: in progress, or done with the backend's count. */\nexport type ConfirmPreview = { status: 'loading' } | ({ status: 'done' } & ListActionPreview);\n\nexport interface ConfirmDialogProps {\n    /** The action to confirm, or `null` when the dialog is closed. */\n    event: ListActionEvent | null;\n    /**\n     * What the backend told about a query selection. Its count of skipped items replaces the\n     * count of the current page; while it loads, the dialog says so and can't be confirmed.\n     */\n    preview?: ConfirmPreview | null;\n    onConfirm: (event: ListActionEvent) => void;\n    onCancel: () => void;\n}\n\n/**\n * Asks before running an action (decision 0017): the action's `confirm` title and message (an ICU\n * message with `{count}`), or default ones, and how many selected items will be skipped: those of\n * the current page that don't allow it, or the backend's count for every item matching a query.\n */\nexport function ConfirmDialog({ event, preview = null, onConfirm, onCancel }: ConfirmDialogProps) {\n    const intl = usePanneauIntl();\n    if (event === null) {\n        return null;\n    }\n    const { action, count } = event;\n    const loading = preview?.status === 'loading';\n    const skipped = preview?.status === 'done' ? preview.skipped : event.skipped.length;\n    const confirm = typeof action.confirm === 'object' ? action.confirm : {};\n    const label = getActionLabel(action, intl);\n    const values = { count, action: label };\n    return (\n        <Dialog\n            isOpen\n            onOpenChange={(open) => {\n                if (!open) {\n                    onCancel();\n                }\n            }}\n            role=\"alertdialog\"\n            isDismissable={false}\n            size=\"sm\"\n            title={\n                confirm.title !== undefined\n                    ? formatDefinitionMessage(intl, confirm.title, values)\n                    : intl.formatMessage(messages.confirmTitle, { action: label })\n            }\n            footer={\n                <>\n                    <Button variant=\"ghost\" onPress={onCancel}>\n                        {confirm.cancelLabel ?? intl.formatMessage(messages.cancel)}\n                    </Button>\n                    <Button\n                        variant={action.destructive === true ? 'danger' : 'primary'}\n                        autoFocus\n                        isDisabled={loading}\n                        onPress={() => onConfirm(event)}\n                    >\n                        {confirm.confirmLabel ?? label}\n                    </Button>\n                </>\n            }\n        >\n            <p className={styles.message}>\n                {confirm.message !== undefined\n                    ? formatDefinitionMessage(intl, confirm.message, values)\n                    : intl.formatMessage(messages.confirmMessage, values)}\n            </p>\n            {loading ? (\n                <div className={styles.skipped}>\n                    <Spinner\n                        size=\"sm\"\n                        label={intl.formatMessage(messages.confirmChecking)}\n                        showLabel\n                    />\n                </div>\n            ) : skipped > 0 ? (\n                <p className={styles.skipped}>\n                    {intl.formatMessage(messages.confirmSkipped, { count: skipped })}\n                </p>\n            ) : null}\n        </Dialog>\n    );\n}\n"],"mappings":"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"}

package/dist/actions/RowActions.d.ts

@@ -4,16 +4,33 @@ import { type ActionIcons } from './icons.js';
 export interface RowActionsProps {
     /** The label of the item, for the accessible names of its actions. */
     itemLabel: string;
-    /** Actions shown as buttons, with their links (`getItemActions()` of `@panneau/core`). */
+    /** Actions placed in `row`, with their links (`selectItemActions()` of `@panneau/core`). */
     actions: readonly ItemAction[];
-    /** Actions in the overflow menu. */
+    /** Actions placed in `menu`: icons too while they fit, the first to go in the menu. */
     menu: readonly ItemAction[];
     /** Id of the action that is running on this item, if any. */
     pending: string | null;
     onRun: (action: Action) => void;
     /** Icons of actions by id, over the icon the action names. */
     icons?: ActionIcons | undefined;
+    /**
+     * The actions of every row of the list, in order (`orderRowActions()`): a row keeps the place
+     * of those it doesn't have, so the actions of the rows line up. Without it, its own.
+     */
+    slots?: readonly ItemAction[] | undefined;
+    /** The id of the main action of rows, which keeps its label (`show` or `edit`). */
+    primary?: string | null | undefined;
 }
-/** The actions of a row: buttons, then an overflow menu. */
-export declare function RowActions({ itemLabel, actions, menu, pending, onRun, icons }: RowActionsProps): import("react").JSX.Element;
+/**
+ * The actions of a row in their order: those placed in `row`, then those placed in `menu`, and
+ * those that destroy last. The last ones are the first to go in the menu.
+ */
+export declare function orderRowActions(actions: readonly ItemAction[], menu: readonly ItemAction[]): ItemAction[];
+/**
+ * The actions of a row (decision 0060): their icons, in their colors, with their labels as names
+ * and tooltips, but the main action, which keeps its label while the row has room; and when the
+ * icons don't fit, the last ones in an overflow menu, which never holds a single action. How they fit is the same for every row of the list (`RowActionsFit`), and a
+ * row keeps the place of the actions of other rows that it doesn't have, so they line up.
+ */
+export declare function RowActions({ itemLabel, actions, menu, pending, onRun, icons, slots, primary, }: RowActionsProps): import("react").JSX.Element;
 //# sourceMappingURL=RowActions.d.ts.map

package/dist/actions/RowActions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RowActions.d.ts","sourceRoot":"","sources":["../../src/actions/RowActions.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAEhD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAMhD,OAAO,EAAE,KAAK,WAAW,EAAiB,MAAM,SAAS,CAAC;AAE1D,MAAM,WAAW,eAAe;IAC5B,sEAAsE;IACtE,SAAS,EAAE,MAAM,CAAC;IAClB,0FAA0F;IAC1F,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;IAC/B,oCAAoC;IACpC,IAAI,EAAE,SAAS,UAAU,EAAE,CAAC;IAC5B,6DAA6D;IAC7D,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,8DAA8D;IAC9D,KAAK,CAAC,EAAE,WAAW,GAAG,SAAS,CAAC;CACnC;AAED,4DAA4D;AAC5D,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,eAAe,+BAyD9F"}
+{"version":3,"file":"RowActions.d.ts","sourceRoot":"","sources":["../../src/actions/RowActions.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAEhD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAOhD,OAAO,EAAE,KAAK,WAAW,EAAiB,MAAM,SAAS,CAAC;AAE1D,MAAM,WAAW,eAAe;IAC5B,sEAAsE;IACtE,SAAS,EAAE,MAAM,CAAC;IAClB,4FAA4F;IAC5F,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;IAC/B,uFAAuF;IACvF,IAAI,EAAE,SAAS,UAAU,EAAE,CAAC;IAC5B,6DAA6D;IAC7D,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,8DAA8D;IAC9D,KAAK,CAAC,EAAE,WAAW,GAAG,SAAS,CAAC;IAChC;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,UAAU,EAAE,GAAG,SAAS,CAAC;IAC1C,mFAAmF;IACnF,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;CACvC;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAC3B,OAAO,EAAE,SAAS,UAAU,EAAE,EAC9B,IAAI,EAAE,SAAS,UAAU,EAAE,GAC5B,UAAU,EAAE,CASd;AAED;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,EACvB,SAAS,EACT,OAAO,EACP,IAAI,EACJ,OAAO,EACP,KAAK,EACL,KAAK,EACL,KAAK,EACL,OAAc,GACjB,EAAE,eAAe,+BA0FjB"}

package/dist/actions/RowActions.js

@@ -1,105 +1,170 @@
 import { messages } from "../messages.js";
 import Actions_module_default from "./Actions.module.js";
 import { getActionIcon } from "./icons.js";
+import { RowActionsFit } from "./fit.js";
 import { ActionButton } from "./ActionButton.js";
 import { c } from "react/compiler-runtime";
 import { getActionLabel } from "@panneau/intl";
 import { IconButton, Menu, MenuItem, MenuTrigger, usePanneauIntl } from "@panneau/ui";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Ellipsis } from "lucide-react";
+import { use } from "react";
 //#region src/actions/RowActions.tsx
-/** The actions of a row: buttons, then an overflow menu. */
+/**
+* The actions of a row in their order: those placed in `row`, then those placed in `menu`, and
+* those that destroy last. The last ones are the first to go in the menu.
+*/
+function orderRowActions(actions, menu) {
+	const all = [...actions, ...menu].filter((entry, index, list) => list.findIndex((other) => other.action.id === entry.action.id) === index);
+	return [...all.filter(({ action }) => action.destructive !== true), ...all.filter(({ action }) => action.destructive === true)];
+}
+/**
+* The actions of a row (decision 0060): their icons, in their colors, with their labels as names
+* and tooltips, but the main action, which keeps its label while the row has room; and when the
+* icons don't fit, the last ones in an overflow menu, which never holds a single action. How they fit is the same for every row of the list (`RowActionsFit`), and a
+* row keeps the place of the actions of other rows that it doesn't have, so they line up.
+*/
 function RowActions(t0) {
-	const $ = c(23);
-	const { itemLabel, actions, menu, pending, onRun, icons } = t0;
+	const $ = c(30);
+	const { itemLabel, actions, menu, pending, onRun, icons, slots, primary: t1 } = t0;
+	const primary = t1 === void 0 ? null : t1;
 	const intl = usePanneauIntl();
-	let t1;
-	if ($[0] !== actions || $[1] !== icons || $[2] !== intl || $[3] !== itemLabel || $[4] !== onRun || $[5] !== pending) {
-		let t2;
-		if ($[7] !== icons || $[8] !== intl || $[9] !== itemLabel || $[10] !== onRun || $[11] !== pending) {
-			t2 = (t3) => {
-				const { action, href } = t3;
-				return /* @__PURE__ */ jsx(ActionButton, {
-					action,
-					icons,
-					href,
-					isPending: pending === action.id,
-					isDisabled: pending !== null && pending !== action.id,
-					"aria-label": intl.formatMessage(messages.actionOnItem, {
-						action: getActionLabel(action, intl),
-						item: itemLabel
-					}),
-					onPress: () => onRun(action)
-				}, action.id);
+	const level = use(RowActionsFit);
+	let t2;
+	if ($[0] !== actions || $[1] !== icons || $[2] !== intl || $[3] !== itemLabel || $[4] !== level || $[5] !== menu || $[6] !== onRun || $[7] !== pending || $[8] !== primary || $[9] !== slots) {
+		const own = orderRowActions(actions, menu);
+		let t3;
+		if ($[11] !== slots) {
+			t3 = (t4) => {
+				const { action } = t4;
+				return slots?.some((slot) => slot.action.id === action.id) !== true;
 			};
-			$[7] = icons;
-			$[8] = intl;
-			$[9] = itemLabel;
-			$[10] = onRun;
-			$[11] = pending;
-			$[12] = t2;
-		} else t2 = $[12];
-		t1 = actions.map(t2);
+			$[11] = slots;
+			$[12] = t3;
+		} else t3 = $[12];
+		const all = [...slots ?? [], ...own.filter(t3)];
+		const find = (slot_0) => own.find((t4) => {
+			const { action: action_0 } = t4;
+			return action_0.id === slot_0.action.id;
+		});
+		const inMenu = level >= 2 && all.length >= 2 ? Math.min(level, all.length) : 0;
+		const shown = all.slice(0, all.length - inMenu);
+		const overflow = all.slice(all.length - inMenu).flatMap((slot_1) => find(slot_1) ?? []);
+		let t5;
+		if ($[13] !== intl || $[14] !== itemLabel) {
+			t5 = (action_1) => intl.formatMessage(messages.actionOnItem, {
+				action: getActionLabel(action_1, intl),
+				item: itemLabel
+			});
+			$[13] = intl;
+			$[14] = itemLabel;
+			$[15] = t5;
+		} else t5 = $[15];
+		const name = t5;
+		let t6;
+		if ($[16] !== icons || $[17] !== level || $[18] !== name || $[19] !== onRun || $[20] !== pending || $[21] !== primary) {
+			t6 = (entry) => /* @__PURE__ */ jsx(ActionButton, {
+				action: entry.action,
+				icons,
+				href: entry.href,
+				iconOnly: level >= 1 || entry.action.id !== primary,
+				isPending: pending === entry.action.id,
+				isDisabled: pending !== null && pending !== entry.action.id,
+				"aria-label": name(entry.action),
+				onPress: () => onRun(entry.action)
+			}, entry.action.id);
+			$[16] = icons;
+			$[17] = level;
+			$[18] = name;
+			$[19] = onRun;
+			$[20] = pending;
+			$[21] = primary;
+			$[22] = t6;
+		} else t6 = $[22];
+		const button = t6;
+		const placeholder = _temp;
+		let t7;
+		if ($[23] !== intl || $[24] !== itemLabel) {
+			t7 = intl.formatMessage(messages.itemActions, { item: itemLabel });
+			$[23] = intl;
+			$[24] = itemLabel;
+			$[25] = t7;
+		} else t7 = $[25];
+		const t8 = overflow.length >= 2;
+		const t9 = pending !== null && overflow.some((t10) => {
+			const { action: action_2 } = t10;
+			return action_2.id === pending;
+		});
+		let t11;
+		if ($[26] !== t7 || $[27] !== t8 || $[28] !== t9) {
+			t11 = /* @__PURE__ */ jsx(IconButton, {
+				icon: Ellipsis,
+				size: "sm",
+				appearance: "subtle",
+				label: t7,
+				showTooltip: t8,
+				isPending: t9
+			});
+			$[26] = t7;
+			$[27] = t8;
+			$[28] = t9;
+			$[29] = t11;
+		} else t11 = $[29];
+		const menuButton = t11;
+		t2 = /* @__PURE__ */ jsxs("div", {
+			className: Actions_module_default.row,
+			"data-row-actions": all.length,
+			children: [shown.map((slot_2) => {
+				const entry_0 = find(slot_2);
+				return entry_0 !== void 0 ? button(entry_0) : placeholder(slot_2.action.id, button({
+					...slot_2,
+					href: null
+				}));
+			}), overflow.length >= 2 ? /* @__PURE__ */ jsxs(MenuTrigger, { children: [menuButton, /* @__PURE__ */ jsx(Menu, {
+				placement: "bottom end",
+				onAction: (key_0) => {
+					const entry_1 = overflow.find((t12) => {
+						const { action: action_3 } = t12;
+						return action_3.id === key_0;
+					});
+					if (entry_1 !== void 0 && entry_1.href === null) onRun(entry_1.action);
+				},
+				children: overflow.map((t13) => {
+					const { action: action_4, href } = t13;
+					const icon = getActionIcon(action_4, icons);
+					return /* @__PURE__ */ jsx(MenuItem, {
+						id: action_4.id,
+						isDanger: action_4.destructive === true,
+						...icon !== void 0 ? { icon } : {},
+						...href !== null ? { href } : {},
+						children: getActionLabel(action_4, intl)
+					}, action_4.id);
+				})
+			})] }) : overflow.length === 1 && overflow[0] !== void 0 ? button(overflow[0]) : inMenu > 0 ? placeholder("menu", menuButton) : null]
+		});
 		$[0] = actions;
 		$[1] = icons;
 		$[2] = intl;
 		$[3] = itemLabel;
-		$[4] = onRun;
-		$[5] = pending;
-		$[6] = t1;
-	} else t1 = $[6];
-	let t2;
-	if ($[13] !== icons || $[14] !== intl || $[15] !== itemLabel || $[16] !== menu || $[17] !== onRun || $[18] !== pending) {
-		t2 = menu.length > 0 ? /* @__PURE__ */ jsxs(MenuTrigger, { children: [/* @__PURE__ */ jsx(IconButton, {
-			icon: Ellipsis,
-			size: "sm",
-			label: intl.formatMessage(messages.itemActions, { item: itemLabel }),
-			isPending: pending !== null && menu.some((t3) => {
-				const { action: action_0 } = t3;
-				return action_0.id === pending;
-			})
-		}), /* @__PURE__ */ jsx(Menu, {
-			placement: "bottom end",
-			onAction: (key) => {
-				const entry = menu.find((t4) => {
-					const { action: action_1 } = t4;
-					return action_1.id === key;
-				});
-				if (entry !== void 0 && entry.href === null) onRun(entry.action);
-			},
-			children: menu.map((t5) => {
-				const { action: action_2, href: href_0 } = t5;
-				const icon = getActionIcon(action_2, icons);
-				return /* @__PURE__ */ jsx(MenuItem, {
-					id: action_2.id,
-					isDanger: action_2.destructive === true,
-					...icon !== void 0 ? { icon } : {},
-					...href_0 !== null ? { href: href_0 } : {},
-					children: getActionLabel(action_2, intl)
-				}, action_2.id);
-			})
-		})] }) : null;
-		$[13] = icons;
-		$[14] = intl;
-		$[15] = itemLabel;
-		$[16] = menu;
-		$[17] = onRun;
-		$[18] = pending;
-		$[19] = t2;
-	} else t2 = $[19];
-	let t3;
-	if ($[20] !== t1 || $[21] !== t2) {
-		t3 = /* @__PURE__ */ jsxs("div", {
-			className: Actions_module_default.row,
-			children: [t1, t2]
-		});
-		$[20] = t1;
-		$[21] = t2;
-		$[22] = t3;
-	} else t3 = $[22];
-	return t3;
+		$[4] = level;
+		$[5] = menu;
+		$[6] = onRun;
+		$[7] = pending;
+		$[8] = primary;
+		$[9] = slots;
+		$[10] = t2;
+	} else t2 = $[10];
+	return t2;
+}
+function _temp(key, content) {
+	return /* @__PURE__ */ jsx("span", {
+		className: Actions_module_default.placeholder,
+		"aria-hidden": "true",
+		inert: true,
+		children: content
+	}, key);
 }
 //#endregion
-export { RowActions };
+export { RowActions, orderRowActions };
 
 //# sourceMappingURL=RowActions.js.map

package/dist/actions/RowActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"RowActions.js","names":["Ellipsis","ItemAction","getActionLabel","Action","IconButton","Menu","MenuItem","MenuTrigger","usePanneauIntl","messages","ActionButton","styles","ActionIcons","getActionIcon","RowActionsProps","itemLabel","actions","menu","pending","onRun","action","icons","RowActions","t0","$","_c","intl","t1","t2","t3","href","id","formatMessage","actionOnItem","item","map","length","itemActions","some","action_0","key","entry","find","t4","action_1","undefined","t5","action_2","href_0","icon","destructive","row","_c","styles"],"sources":["../../src/actions/RowActions.tsx"],"sourcesContent":["import { Ellipsis } from 'lucide-react';\n\nimport type { ItemAction } from '@panneau/core';\nimport { getActionLabel } from '@panneau/intl';\nimport type { Action } from '@panneau/protocol';\nimport { IconButton, Menu, MenuItem, MenuTrigger, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport { ActionButton } from './ActionButton';\nimport styles from './Actions.module.css';\nimport { type ActionIcons, getActionIcon } from './icons';\n\nexport interface RowActionsProps {\n    /** The label of the item, for the accessible names of its actions. */\n    itemLabel: string;\n    /** Actions shown as buttons, with their links (`getItemActions()` of `@panneau/core`). */\n    actions: readonly ItemAction[];\n    /** Actions in the overflow menu. */\n    menu: readonly ItemAction[];\n    /** Id of the action that is running on this item, if any. */\n    pending: string | null;\n    onRun: (action: Action) => void;\n    /** Icons of actions by id, over the icon the action names. */\n    icons?: ActionIcons | undefined;\n}\n\n/** The actions of a row: buttons, then an overflow menu. */\nexport function RowActions({ itemLabel, actions, menu, pending, onRun, icons }: RowActionsProps) {\n    const intl = usePanneauIntl();\n    return (\n        <div className={styles.row}>\n            {actions.map(({ action, href }) => (\n                <ActionButton\n                    key={action.id}\n                    action={action}\n                    icons={icons}\n                    href={href}\n                    isPending={pending === action.id}\n                    isDisabled={pending !== null && pending !== action.id}\n                    aria-label={intl.formatMessage(messages.actionOnItem, {\n                        action: getActionLabel(action, intl),\n                        item: itemLabel,\n                    })}\n                    onPress={() => onRun(action)}\n                />\n            ))}\n            {menu.length > 0 ? (\n                <MenuTrigger>\n                    <IconButton\n                        icon={Ellipsis}\n                        size=\"sm\"\n                        label={intl.formatMessage(messages.itemActions, { item: itemLabel })}\n                        isPending={\n                            pending !== null && menu.some(({ action }) => action.id === pending)\n                        }\n                    />\n                    <Menu\n                        placement=\"bottom end\"\n                        onAction={(key) => {\n                            const entry = menu.find(({ action }) => action.id === key);\n                            if (entry !== undefined && entry.href === null) {\n                                onRun(entry.action);\n                            }\n                        }}\n                    >\n                        {menu.map(({ action, href }) => {\n                            const icon = getActionIcon(action, icons);\n                            return (\n                                <MenuItem\n                                    key={action.id}\n                                    id={action.id}\n                                    isDanger={action.destructive === true}\n                                    {...(icon !== undefined ? { icon } : {})}\n                                    {...(href !== null ? { href } : {})}\n                                >\n                                    {getActionLabel(action, intl)}\n                                </MenuItem>\n                            );\n                        })}\n                    </Menu>\n                </MenuTrigger>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"RowActions.js","names":["Ellipsis","ReactNode","use","ItemAction","getActionLabel","Action","IconButton","Menu","MenuItem","MenuTrigger","usePanneauIntl","messages","ActionButton","styles","RowActionsFit","ActionIcons","getActionIcon","RowActionsProps","itemLabel","actions","menu","pending","onRun","action","icons","slots","primary","orderRowActions","all","filter","entry","index","list","findIndex","other","id","destructive","RowActions","t0","$","_c","t1","undefined","intl","level","t2","own","t3","t4","some","slot","find","slot_0","action_0","inMenu","length","Math","min","shown","slice","overflow","flatMap","slot_1","t5","action_1","formatMessage","actionOnItem","item","name","t6","href","button","placeholder","_temp","t7","itemActions","t8","t9","t10","action_2","t11","menuButton","row","map","slot_2","entry_0","key_0","entry_1","t12","action_3","key","t13","action_4","icon","content","_c","styles"],"sources":["../../src/actions/RowActions.tsx"],"sourcesContent":["import { Ellipsis } from 'lucide-react';\nimport { type ReactNode, use } from 'react';\n\nimport type { ItemAction } from '@panneau/core';\nimport { getActionLabel } from '@panneau/intl';\nimport type { Action } from '@panneau/protocol';\nimport { IconButton, Menu, MenuItem, MenuTrigger, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport { ActionButton } from './ActionButton';\nimport styles from './Actions.module.css';\nimport { RowActionsFit } from './fit';\nimport { type ActionIcons, getActionIcon } from './icons';\n\nexport interface RowActionsProps {\n    /** The label of the item, for the accessible names of its actions. */\n    itemLabel: string;\n    /** Actions placed in `row`, with their links (`selectItemActions()` of `@panneau/core`). */\n    actions: readonly ItemAction[];\n    /** Actions placed in `menu`: icons too while they fit, the first to go in the menu. */\n    menu: readonly ItemAction[];\n    /** Id of the action that is running on this item, if any. */\n    pending: string | null;\n    onRun: (action: Action) => void;\n    /** Icons of actions by id, over the icon the action names. */\n    icons?: ActionIcons | undefined;\n    /**\n     * The actions of every row of the list, in order (`orderRowActions()`): a row keeps the place\n     * of those it doesn't have, so the actions of the rows line up. Without it, its own.\n     */\n    slots?: readonly ItemAction[] | undefined;\n    /** The id of the main action of rows, which keeps its label (`show` or `edit`). */\n    primary?: string | null | undefined;\n}\n\n/**\n * The actions of a row in their order: those placed in `row`, then those placed in `menu`, and\n * those that destroy last. The last ones are the first to go in the menu.\n */\nexport function orderRowActions(\n    actions: readonly ItemAction[],\n    menu: readonly ItemAction[],\n): ItemAction[] {\n    const all = [...actions, ...menu].filter(\n        (entry, index, list) =>\n            list.findIndex((other) => other.action.id === entry.action.id) === index,\n    );\n    return [\n        ...all.filter(({ action }) => action.destructive !== true),\n        ...all.filter(({ action }) => action.destructive === true),\n    ];\n}\n\n/**\n * The actions of a row (decision 0060): their icons, in their colors, with their labels as names\n * and tooltips, but the main action, which keeps its label while the row has room; and when the\n * icons don't fit, the last ones in an overflow menu, which never holds a single action. How they fit is the same for every row of the list (`RowActionsFit`), and a\n * row keeps the place of the actions of other rows that it doesn't have, so they line up.\n */\nexport function RowActions({\n    itemLabel,\n    actions,\n    menu,\n    pending,\n    onRun,\n    icons,\n    slots,\n    primary = null,\n}: RowActionsProps) {\n    const intl = usePanneauIntl();\n    const level = use(RowActionsFit);\n    const own = orderRowActions(actions, menu);\n    const all = [\n        ...(slots ?? []),\n        ...own.filter(({ action }) => slots?.some((slot) => slot.action.id === action.id) !== true),\n    ];\n    const find = (slot: ItemAction) => own.find(({ action }) => action.id === slot.action.id);\n    const inMenu = level >= 2 && all.length >= 2 ? Math.min(level, all.length) : 0;\n    const shown = all.slice(0, all.length - inMenu);\n    const overflow = all.slice(all.length - inMenu).flatMap((slot) => find(slot) ?? []);\n    const name = (action: Action) =>\n        intl.formatMessage(messages.actionOnItem, {\n            action: getActionLabel(action, intl),\n            item: itemLabel,\n        });\n    const button = (entry: ItemAction) => (\n        <ActionButton\n            key={entry.action.id}\n            action={entry.action}\n            icons={icons}\n            href={entry.href}\n            iconOnly={level >= 1 || entry.action.id !== primary}\n            isPending={pending === entry.action.id}\n            isDisabled={pending !== null && pending !== entry.action.id}\n            aria-label={name(entry.action)}\n            onPress={() => onRun(entry.action)}\n        />\n    );\n    // The place of an action of other rows: the same button, unseen and out of reach\n    const placeholder = (key: string, content: ReactNode) => (\n        <span key={key} className={styles.placeholder} aria-hidden=\"true\" inert>\n            {content}\n        </span>\n    );\n    const menuButton = (\n        <IconButton\n            icon={Ellipsis}\n            size=\"sm\"\n            appearance=\"subtle\"\n            label={intl.formatMessage(messages.itemActions, { item: itemLabel })}\n            showTooltip={overflow.length >= 2}\n            isPending={pending !== null && overflow.some(({ action }) => action.id === pending)}\n        />\n    );\n    return (\n        <div className={styles.row} data-row-actions={all.length}>\n            {shown.map((slot) => {\n                const entry = find(slot);\n                return entry !== undefined\n                    ? button(entry)\n                    : placeholder(slot.action.id, button({ ...slot, href: null }));\n            })}\n            {overflow.length >= 2 ? (\n                <MenuTrigger>\n                    {menuButton}\n                    <Menu\n                        placement=\"bottom end\"\n                        onAction={(key) => {\n                            const entry = overflow.find(({ action }) => action.id === key);\n                            if (entry !== undefined && entry.href === null) {\n                                onRun(entry.action);\n                            }\n                        }}\n                    >\n                        {overflow.map(({ action, href }) => {\n                            const icon = getActionIcon(action, icons);\n                            return (\n                                <MenuItem\n                                    key={action.id}\n                                    id={action.id}\n                                    isDanger={action.destructive === true}\n                                    {...(icon !== undefined ? { icon } : {})}\n                                    {...(href !== null ? { href } : {})}\n                                >\n                                    {getActionLabel(action, intl)}\n                                </MenuItem>\n                            );\n                        })}\n                    </Menu>\n                </MenuTrigger>\n            ) : overflow.length === 1 && overflow[0] !== undefined ? (\n                // A single action is no menu: its button, in the menu's place\n                button(overflow[0])\n            ) : inMenu > 0 ? (\n                placeholder('menu', menuButton)\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":"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"}

package/dist/actions/fit.d.ts

@@ -0,0 +1,25 @@
+/**
+ * How the actions of rows fit (decision 0060), the same for every row of a list: `0`, every
+ * action as an icon but the main one, with its label; `1`, every action as an icon; `n` from 2,
+ * the last `n` actions of each row in its menu.
+ */
+export declare const RowActionsFit: import("react").Context<number>;
+/** What the fit of a list depends on, besides its width: its items and its columns. */
+export declare function fitContent(items: readonly {
+    id: string;
+}[], columns: readonly {
+    id: string;
+}[]): string;
+/**
+ * Fits the actions of the rows of a list in the room they have (decision 0060). It draws each
+ * level in turn, from every action as an icon but the main one, labelled, then the main one as an
+ * icon too, then a menu of two actions, three…, while the next one may help, and keeps the best:
+ * where the actions crowd least (the list overflows, the actions of a row wrap or take more than
+ * 40% of it), then, on rows of five actions or more, where the rows are shortest (their content
+ * wraps or is cut less), then the fewest actions in the menu.
+ *
+ * @returns the level, and a callback ref for the element to measure: the list, which holds the
+ * actions.
+ */
+export declare function useRowActionsFit(content: string): [level: number, measure: (element: HTMLElement | null) => void];
+//# sourceMappingURL=fit.d.ts.map

package/dist/actions/fit.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fit.d.ts","sourceRoot":"","sources":["../../src/actions/fit.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,eAAO,MAAM,aAAa,iCAAmB,CAAC;AAE9C,uFAAuF;AACvF,wBAAgB,UAAU,CACtB,KAAK,EAAE,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,EAAE,EAChC,OAAO,EAAE,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,EAAE,GACnC,MAAM,CAER;AAgKD;;;;;;;;;;GAUG;AACH,wBAAgB,gBAAgB,CAC5B,OAAO,EAAE,MAAM,GAChB,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC,CA8BjE"}