@panneau/lists 4.1.1 → 5.0.0-alpha.1

package/dist/toolbar/SearchField.js

@@ -0,0 +1,64 @@
+import { messages } from "../messages.js";
+import { useDraft } from "../useDraft.js";
+import Toolbar_module_default from "./Toolbar.module.js";
+import { c } from "react/compiler-runtime";
+import { Icon, TextInput, usePanneauIntl } from "@panneau/ui";
+import { jsx } from "react/jsx-runtime";
+import { Search } from "lucide-react";
+//#region src/toolbar/SearchField.tsx
+/** The search of a list (`q`). */
+function SearchField(t0) {
+	const $ = c(13);
+	const { value, onChange } = t0;
+	const intl = usePanneauIntl();
+	const { draft, setDraft, flush } = useDraft(value, onChange);
+	let t1;
+	if ($[0] !== intl) {
+		t1 = intl.formatMessage(messages.search);
+		$[0] = intl;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== intl) {
+		t2 = intl.formatMessage(messages.searchPlaceholder);
+		$[2] = intl;
+		$[3] = t2;
+	} else t2 = $[3];
+	let t3;
+	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = /* @__PURE__ */ jsx(Icon, { icon: Search });
+		$[4] = t3;
+	} else t3 = $[4];
+	let t4;
+	if ($[5] !== flush) {
+		t4 = (event) => {
+			if (event.key === "Enter") flush();
+		};
+		$[5] = flush;
+		$[6] = t4;
+	} else t4 = $[6];
+	let t5;
+	if ($[7] !== draft || $[8] !== setDraft || $[9] !== t1 || $[10] !== t2 || $[11] !== t4) {
+		t5 = /* @__PURE__ */ jsx(TextInput, {
+			type: "search",
+			"aria-label": t1,
+			placeholder: t2,
+			prefix: t3,
+			value: draft,
+			onChange: setDraft,
+			onKeyDown: t4,
+			className: Toolbar_module_default.search
+		});
+		$[7] = draft;
+		$[8] = setDraft;
+		$[9] = t1;
+		$[10] = t2;
+		$[11] = t4;
+		$[12] = t5;
+	} else t5 = $[12];
+	return t5;
+}
+//#endregion
+export { SearchField };
+
+//# sourceMappingURL=SearchField.js.map

package/dist/toolbar/SearchField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchField.js","names":["Search","draft","setDraft","_c","styles"],"sources":["../../src/toolbar/SearchField.tsx"],"sourcesContent":["import { Search } from 'lucide-react';\n\nimport { Icon, TextInput, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport { useDraft } from '../useDraft';\nimport styles from './Toolbar.module.css';\n\nexport interface SearchFieldProps {\n    /** The search of the query. */\n    value: string;\n    /** Called once the user stops typing, or presses Enter. */\n    onChange: (q: string) => void;\n}\n\n/** The search of a list (`q`). */\nexport function SearchField({ value, onChange }: SearchFieldProps) {\n    const intl = usePanneauIntl();\n    const { draft, setDraft, flush } = useDraft(value, onChange);\n    return (\n        <TextInput\n            type=\"search\"\n            aria-label={intl.formatMessage(messages.search)}\n            placeholder={intl.formatMessage(messages.searchPlaceholder)}\n            prefix={<Icon icon={Search} />}\n            value={draft}\n            onChange={setDraft}\n            onKeyDown={(event) => {\n                if (event.key === 'Enter') {\n                    flush();\n                }\n            }}\n            className={styles.search}\n        />\n    );\n}\n"],"mappings":";;;;;;;;;AAgBA,SAAO,YAAA,IAAA;CAAA,MAAA,IAAAG,EAAA,EAAA;CAAqB,MAAA,EAAA,OAAA,aAAA;CACxB,MAAA,OAAa,eAAe;CAC5B,MAAA,EAAA,OAAA,UAAA,UAAmC,SAAS,OAAO,QAAQ;CAAE,IAAA;CAAA,IAAA,EAAA,OAAA,MAAA;EAIzC,KAAA,KAAI,cAAe,SAAQ,MAAO;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,MAAA;EAClC,KAAA,KAAI,cAAe,SAAQ,iBAAkB;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,OAAA,IAAA,2BAAA,GAAA;EACnD,KAAA,oBAAC,MAAD,EAAYH,MAAA,OAAM,CAAA;EAAI,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,OAAA;EAGnB,MAAA,UAAA;GACP,IAAI,MAAK,QAAS,SACd,MAAM;EACT;EACJ,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,SAAA,EAAA,OAAA,YAAA,EAAA,OAAA,MAAA,EAAA,QAAA,MAAA,EAAA,QAAA,IAAA;EAXL,KAAA,oBAAC,WAAD;GACS,MAAA;GACO,cAAA;GACC,aAAA;GACL,QAAA;GACDC,OAAA;GACGC,UAAA;GACC,WAAA;GAKA,WAAAE,uBAAM;EAAO,CAAA;EAC1B,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAAA,OAbF;AAaE"}

package/dist/toolbar/SortSelect.d.ts

@@ -0,0 +1,9 @@
+import type { ListColumn } from '../types';
+export interface SortSelectProps {
+    columns: readonly ListColumn[];
+    sort: readonly string[];
+    onChange: (sort: string[]) => void;
+}
+/** The sort of a list without column headers (cards), by sortable column and direction. */
+export declare function SortSelect({ columns, sort, onChange }: SortSelectProps): import("react").JSX.Element;
+//# sourceMappingURL=SortSelect.d.ts.map

package/dist/toolbar/SortSelect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SortSelect.d.ts","sourceRoot":"","sources":["../../src/toolbar/SortSelect.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAG3C,MAAM,WAAW,eAAe;IAC5B,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;IAC/B,IAAI,EAAE,SAAS,MAAM,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACtC;AAID,2FAA2F;AAC3F,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,eAAe,+BA8BtE"}

package/dist/toolbar/SortSelect.js

@@ -0,0 +1,90 @@
+import { messages } from "../messages.js";
+import Toolbar_module_default from "./Toolbar.module.js";
+import { c } from "react/compiler-runtime";
+import { Select, usePanneauIntl } from "@panneau/ui";
+import { jsx } from "react/jsx-runtime";
+//#region src/toolbar/SortSelect.tsx
+var DEFAULT = "";
+/** The sort of a list without column headers (cards), by sortable column and direction. */
+function SortSelect(t0) {
+	const $ = c(18);
+	const { columns, sort, onChange } = t0;
+	const intl = usePanneauIntl();
+	let t1;
+	if ($[0] !== columns || $[1] !== intl) {
+		const sortable = columns.filter(_temp);
+		const label = _temp2;
+		let t2;
+		if ($[3] !== intl) {
+			t2 = intl.formatMessage(messages.defaultSort);
+			$[3] = intl;
+			$[4] = t2;
+		} else t2 = $[4];
+		let t3;
+		if ($[5] !== t2) {
+			t3 = {
+				value: DEFAULT,
+				label: t2
+			};
+			$[5] = t2;
+			$[6] = t3;
+		} else t3 = $[6];
+		let t4;
+		if ($[7] !== intl) {
+			t4 = (column_1) => [{
+				value: column_1.id,
+				label: intl.formatMessage(messages.sortAscending, { column: label(column_1) })
+			}, {
+				value: `-${column_1.id}`,
+				label: intl.formatMessage(messages.sortDescending, { column: label(column_1) })
+			}];
+			$[7] = intl;
+			$[8] = t4;
+		} else t4 = $[8];
+		t1 = [t3, ...sortable.flatMap(t4)];
+		$[0] = columns;
+		$[1] = intl;
+		$[2] = t1;
+	} else t1 = $[2];
+	const options = t1;
+	const current = sort[0] ?? DEFAULT;
+	let t2;
+	if ($[9] !== intl) {
+		t2 = intl.formatMessage(messages.sortBy);
+		$[9] = intl;
+		$[10] = t2;
+	} else t2 = $[10];
+	const t3 = options.some((option) => option.value === current) ? current : DEFAULT;
+	let t4;
+	if ($[11] !== onChange) {
+		t4 = (value) => onChange(value === null || value === DEFAULT ? [] : [String(value)]);
+		$[11] = onChange;
+		$[12] = t4;
+	} else t4 = $[12];
+	let t5;
+	if ($[13] !== options || $[14] !== t2 || $[15] !== t3 || $[16] !== t4) {
+		t5 = /* @__PURE__ */ jsx(Select, {
+			label: t2,
+			options,
+			value: t3,
+			onChange: t4,
+			className: Toolbar_module_default.sort
+		});
+		$[13] = options;
+		$[14] = t2;
+		$[15] = t3;
+		$[16] = t4;
+		$[17] = t5;
+	} else t5 = $[17];
+	return t5;
+}
+function _temp2(column_0) {
+	return typeof column_0.label === "string" ? column_0.label : column_0.id;
+}
+function _temp(column) {
+	return column.sortable === true;
+}
+//#endregion
+export { SortSelect };
+
+//# sourceMappingURL=SortSelect.js.map

package/dist/toolbar/SortSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SortSelect.js","names":["column","options","_c","styles"],"sources":["../../src/toolbar/SortSelect.tsx"],"sourcesContent":["import { Select, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport type { ListColumn } from '../types';\nimport styles from './Toolbar.module.css';\n\nexport interface SortSelectProps {\n    columns: readonly ListColumn[];\n    sort: readonly string[];\n    onChange: (sort: string[]) => void;\n}\n\nconst DEFAULT = '';\n\n/** The sort of a list without column headers (cards), by sortable column and direction. */\nexport function SortSelect({ columns, sort, onChange }: SortSelectProps) {\n    const intl = usePanneauIntl();\n    const sortable = columns.filter((column) => column.sortable === true);\n    const label = (column: ListColumn) =>\n        typeof column.label === 'string' ? column.label : column.id;\n    const options = [\n        { value: DEFAULT, label: intl.formatMessage(messages.defaultSort) },\n        ...sortable.flatMap((column) => [\n            {\n                value: column.id,\n                label: intl.formatMessage(messages.sortAscending, { column: label(column) }),\n            },\n            {\n                value: `-${column.id}`,\n                label: intl.formatMessage(messages.sortDescending, { column: label(column) }),\n            },\n        ]),\n    ];\n    const current = sort[0] ?? DEFAULT;\n    return (\n        <Select\n            label={intl.formatMessage(messages.sortBy)}\n            options={options}\n            value={options.some((option) => option.value === current) ? current : DEFAULT}\n            onChange={(value) =>\n                onChange(value === null || value === DEFAULT ? [] : [String(value)])\n            }\n            className={styles.sort}\n        />\n    );\n}\n"],"mappings":";;;;;;AAYA,IAAM,UAAU;;AAGhB,SAAO,WAAA,IAAA;CAAA,MAAA,IAAAE,EAAA,EAAA;CAAoB,MAAA,EAAA,SAAA,MAAA,aAAA;CACvB,MAAA,OAAa,eAAe;CAAE,IAAA;CAAA,IAAA,EAAA,OAAA,WAAA,EAAA,OAAA,MAAA;EAC9B,MAAA,WAAiB,QAAO,OAAQ,KAAoC;EACpE,MAAA,QAAc;EACkD,IAAA;EAAA,IAAA,EAAA,OAAA,MAAA;GAEnC,KAAA,KAAI,cAAe,SAAQ,WAAY;GAAC,EAAA,KAAA;GAAA,EAAA,KAAA;EAAA,OAAA,KAAA,EAAA;EAAA,IAAA;EAAA,IAAA,EAAA,OAAA,IAAA;GAAjE,KAAA;IAAA,OAAS;IAAO,OAAS;GAAyC;GAAC,EAAA,KAAA;GAAA,EAAA,KAAA;EAAA,OAAA,KAAA,EAAA;EAAA,IAAA;EAAA,IAAA,EAAA,OAAA,MAAA;GAC/C,MAAA,aAAY,CAC5B;IAAA,OACWF,SAAM;IAAG,OACT,KAAI,cAAe,SAAQ,eAAgB,EAAA,QAAU,MAAMA,QAAM,EAAE,CAAC;GAC/E,GACA;IAAA,OACW,IAAIA,SAAM;IAAK,OACf,KAAI,cAAe,SAAQ,gBAAiB,EAAA,QAAU,MAAMA,QAAM,EAAE,CAAC;GAChF,CAAC;GACJ,EAAA,KAAA;GAAA,EAAA,KAAA;EAAA,OAAA,KAAA,EAAA;EAXW,KAAA,CACZ,IAAmE,GAChE,SAAQ,QAAS,EASnB,CAAC;EACL,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAZD,MAAA,UAAgB;CAahB,MAAA,UAAgB,KAAI,MAAJ;CAAmB,IAAA;CAAA,IAAA,EAAA,OAAA,MAAA;EAGpB,KAAA,KAAI,cAAe,SAAQ,MAAO;EAAC,EAAA,KAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAEnC,MAAA,KAAA,QAAO,MAAM,WAAY,OAAM,UAAW,OAA2B,IAArE,UAAA;CAAsE,IAAA;CAAA,IAAA,EAAA,QAAA,UAAA;EACnE,MAAA,UACN,SAAS,UAAU,QAAQ,UAAU,UAA5B,CAAA,IAAA,CAA4C,OAAO,KAAK,CAAC,CAAC;EAAC,EAAA,MAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,QAAA,WAAA,EAAA,QAAA,MAAA,EAAA,QAAA,MAAA,EAAA,QAAA,IAAA;EAL5E,KAAA,oBAAC,QAAD;GACW,OAAA;GACE;GACF,OAAA;GACG,UAAA;GAGC,WAAAG,uBAAM;EAAK,CAAA;EACxB,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAAA,OARF;AAQE;AA5BH,SAAA,OAAA,UAAA;CAAA,OAIC,OAAOH,SAAM,UAAW,WAAWA,SAAM,QAASA,SAAM;AAAG;AAJ5D,SAAA,MAAA,QAAA;CAAA,OAEyC,OAAM,aAAc;AAAI"}

package/dist/toolbar/Toolbar.css

@@ -0,0 +1,72 @@
+.panneau-search-xZg66e {
+    width: 16rem;
+    max-width: 100%;
+}
+
+.panneau-pagination-dNpeRL {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--panneau-space-3);
+    font-size: var(--panneau-font-size-sm);
+    color: var(--panneau-color-text-muted);
+}
+
+.panneau-pages-e6sKuy {
+    display: flex;
+    align-items: center;
+    gap: var(--panneau-space-2);
+}
+
+.panneau-perPage-U3R-no {
+    width: 6rem;
+}
+
+.panneau-layouts-VUhEzd {
+    display: inline-flex;
+    padding: 2px;
+    background-color: var(--panneau-color-surface-sunken);
+    border: var(--panneau-border-width) solid var(--panneau-color-border);
+    border-radius: var(--panneau-radius-md);
+}
+
+.panneau-layoutButton-B28Z38 {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: calc(var(--panneau-control-height) - 6px);
+    height: calc(var(--panneau-control-height) - 6px);
+    color: var(--panneau-color-text-muted);
+    background: none;
+    border: 0;
+    border-radius: var(--panneau-radius-sm);
+    cursor: pointer;
+}
+
+.panneau-layoutButton-B28Z38[data-hovered] {
+    color: var(--panneau-color-text);
+}
+
+.panneau-layoutButton-B28Z38[data-selected] {
+    color: var(--panneau-color-text);
+    background-color: var(--panneau-color-surface);
+    box-shadow: var(--panneau-shadow-sm);
+}
+
+.panneau-layoutButton-B28Z38[data-focus-visible] {
+    outline: var(--panneau-focus-width) solid var(--panneau-color-focus);
+    outline-offset: 1px;
+}
+
+.panneau-sort-5bHxuN {
+    width: 14rem;
+    max-width: 100%;
+}
+
+@container panneau-list (max-width: 40rem) {
+    .panneau-search-xZg66e,
+    .panneau-sort-5bHxuN {
+        width: 100%;
+    }
+}

package/dist/toolbar/Toolbar.module.js

@@ -0,0 +1,22 @@
+import "./Toolbar.css";
+//#region src/toolbar/Toolbar.module.css
+var search = "panneau-search-xZg66e";
+var pagination = "panneau-pagination-dNpeRL";
+var pages = "panneau-pages-e6sKuy";
+var perPage = "panneau-perPage-U3R-no";
+var layouts = "panneau-layouts-VUhEzd";
+var layoutButton = "panneau-layoutButton-B28Z38";
+var sort = "panneau-sort-5bHxuN";
+var Toolbar_module_default = {
+	search,
+	pagination,
+	pages,
+	perPage,
+	layouts,
+	layoutButton,
+	sort
+};
+//#endregion
+export { Toolbar_module_default as default, layoutButton, layouts, pages, pagination, perPage, search, sort };
+
+//# sourceMappingURL=Toolbar.module.js.map

package/dist/toolbar/Toolbar.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar.module.js","names":[],"sources":["../../src/toolbar/Toolbar.module.css"],"sourcesContent":[".search {\n    width: 16rem;\n    max-width: 100%;\n}\n\n.pagination {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--panneau-space-3);\n    font-size: var(--panneau-font-size-sm);\n    color: var(--panneau-color-text-muted);\n}\n\n.pages {\n    display: flex;\n    align-items: center;\n    gap: var(--panneau-space-2);\n}\n\n.perPage {\n    width: 6rem;\n}\n\n.layouts {\n    display: inline-flex;\n    padding: 2px;\n    background-color: var(--panneau-color-surface-sunken);\n    border: var(--panneau-border-width) solid var(--panneau-color-border);\n    border-radius: var(--panneau-radius-md);\n}\n\n.layoutButton {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: calc(var(--panneau-control-height) - 6px);\n    height: calc(var(--panneau-control-height) - 6px);\n    color: var(--panneau-color-text-muted);\n    background: none;\n    border: 0;\n    border-radius: var(--panneau-radius-sm);\n    cursor: pointer;\n}\n\n.layoutButton[data-hovered] {\n    color: var(--panneau-color-text);\n}\n\n.layoutButton[data-selected] {\n    color: var(--panneau-color-text);\n    background-color: var(--panneau-color-surface);\n    box-shadow: var(--panneau-shadow-sm);\n}\n\n.layoutButton[data-focus-visible] {\n    outline: var(--panneau-focus-width) solid var(--panneau-color-focus);\n    outline-offset: 1px;\n}\n\n.sort {\n    width: 14rem;\n    max-width: 100%;\n}\n\n@container panneau-list (max-width: 40rem) {\n    .search,\n    .sort {\n        width: 100%;\n    }\n}\n"],"mappings":""}

package/dist/types.d.ts

@@ -0,0 +1,106 @@
+import type { ComponentType, ReactNode } from 'react';
+import type { Abilities, Action, ActionScope, Field, Filter, FilterValue, Option, Selection } from '@panneau/protocol';
+/**
+ * An item of a list: an id, and the values of its fields. Items of the protocol (`Item`) are list
+ * items; so are a product's own records, without `version` or `abilities`.
+ */
+export interface ListItem {
+    id: string;
+    /** What the user can do with the item. Without abilities, every action is shown. */
+    abilities?: Abilities;
+    [key: string]: unknown;
+}
+/**
+ * A column. A resolved column of `@panneau/core` (`ResolvedColumn`) is a column, and so is a
+ * column written by hand: `{ id: 'title', label: 'Title' }`.
+ */
+export interface ListColumn {
+    /** The column id. Without `render`, the value is `item[id]`. Also the key to sort by. */
+    id: string;
+    label?: ReactNode;
+    /** The field shown, for the display (options of a select, locales of a localized value). */
+    field?: Field | null;
+    /** How the value is displayed: a display of the registry (`date`, `select`). */
+    display?: string | null;
+    sortable?: boolean;
+    width?: number | string;
+    align?: 'start' | 'center' | 'end';
+    /** Renders the cell, instead of a display. */
+    render?: (item: ListItem) => ReactNode;
+}
+/** Props of a display: shows the value of a column for an item. */
+export interface DisplayProps {
+    value: unknown;
+    item: ListItem;
+    column: ListColumn;
+    /** The column's field, or `null`. */
+    field: Field | null;
+}
+/** A registry entry: renders a value with a display (`date`, `select`, a plugin's own). */
+export type DisplayEntry = ComponentType<DisplayProps>;
+/** What a selection action or a toolbar action applies to. */
+export interface ListActionEvent {
+    action: Action;
+    /** `item` for a row action, `selection` or `resource` for a toolbar action. */
+    scope: ActionScope;
+    /** The item of a row action. */
+    item?: ListItem;
+    /** The selection to send with a `selection` action, as the protocol's action request has it. */
+    selection?: Selection;
+    /** How many items the action applies to: 1 for an item, the selected count for a selection. */
+    count: number;
+    /** Selected items of the current page that don't allow the action: the backend skips them. */
+    skipped: readonly ListItem[];
+}
+/**
+ * Runs an action. Lists ask for confirmation first when the action has `confirm`. A returned
+ * promise shows the action as pending until it settles; after a selection action succeeds, the
+ * selection is cleared, unless the handler gives `false` (the action didn't run, as when the user
+ * cancels its parameters). `useActionRunner()` of `@panneau/actions` is such a handler.
+ */
+export type ListActionHandler = (event: ListActionEvent) => unknown;
+/** Props of a filter control. */
+export interface FilterControlProps {
+    filter: Filter;
+    /** The filter's label: its `label`, or its id. */
+    label: string;
+    /** Options, from the filter or from the field it filters. */
+    options: readonly Option[];
+    /** The current value: strings, as the URL keeps them, or what the control set. */
+    value: unknown;
+    /** Sets the value, or removes the filter with `undefined`. */
+    onChange: (value: FilterValue | undefined) => void;
+    /** Remembers the label of a value, for the chip of the active filter (relations). */
+    onLabel: (value: string, label: string) => void;
+    /** The label remembered for a value, if any. */
+    getValueLabel: (value: string) => string | null;
+}
+/** A filter control, by filter type (`select`, `date`). */
+export type FilterEntry = ComponentType<FilterControlProps>;
+/** Props of a list layout: renders the items of the current page. */
+export interface ListLayoutProps {
+    items: readonly ListItem[];
+    columns: readonly ListColumn[];
+    /** Renders the value of a column for an item, with its display. */
+    renderValue: (item: ListItem, column: ListColumn) => ReactNode;
+    /** The label of an item: its title, for checkboxes and actions. */
+    getItemLabel: (item: ListItem) => string;
+    /** A link to the item, when the list has one. */
+    getItemHref?: ((item: ListItem) => string | null) | undefined;
+    /** Whether items have checkboxes. */
+    selectable: boolean;
+    isSelected: (item: ListItem) => boolean;
+    onToggle: (item: ListItem) => void;
+    /** The row actions of an item, or `null` without any. */
+    renderActions: (item: ListItem) => ReactNode;
+    /** The current sort, as `sort` query values (`['-published_at']`). */
+    sort: readonly string[];
+    onSort: (column: ListColumn) => void;
+    /** Accessible name of the list. */
+    label: string;
+    /** The checkbox that selects the page, for layouts that show it in a header. */
+    pageSelection: ReactNode;
+}
+/** A list layout, by id (`table`, `cards`). */
+export type ListLayoutEntry = ComponentType<ListLayoutProps>;
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/dist/useDraft.d.ts

@@ -0,0 +1,11 @@
+/**
+ * A text that is typed locally and committed after a pause: the list query changes once the user
+ * stops typing, not on every key. A change of `value` from outside (a chip removed, the query
+ * reset) replaces the draft.
+ */
+export declare function useDraft(value: string, commit: (value: string) => void, delay?: number): {
+    draft: string;
+    setDraft: (draft: string) => void;
+    flush: () => void;
+};
+//# sourceMappingURL=useDraft.d.ts.map

package/dist/useDraft.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDraft.d.ts","sourceRoot":"","sources":["../src/useDraft.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,wBAAgB,QAAQ,CACpB,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,EAC/B,KAAK,SAAM,GACZ;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAAC,KAAK,EAAE,MAAM,IAAI,CAAA;CAAE,CAwBzE"}

package/dist/useDraft.js

@@ -0,0 +1,77 @@
+import { c } from "react/compiler-runtime";
+import { useEffect, useEffectEvent, useState } from "react";
+//#region src/useDraft.ts
+/**
+* A text that is typed locally and committed after a pause: the list query changes once the user
+* stops typing, not on every key. A change of `value` from outside (a chip removed, the query
+* reset) replaces the draft.
+*/
+function useDraft(value, commit, t0) {
+	const $ = c(18);
+	const delay = t0 === void 0 ? 300 : t0;
+	const [draft, setDraft] = useState(value);
+	const [synced, setSynced] = useState(value);
+	if (value !== synced) {
+		setSynced(value);
+		setDraft(value);
+	}
+	let t1;
+	if ($[0] !== commit) {
+		t1 = (next) => commit(next);
+		$[0] = commit;
+		$[1] = t1;
+	} else t1 = $[1];
+	const onCommit = useEffectEvent(t1);
+	let t2;
+	if ($[2] !== delay || $[3] !== draft || $[4] !== onCommit || $[5] !== synced) {
+		t2 = () => {
+			if (draft === synced) return;
+			const timer = setTimeout(() => onCommit(draft), delay);
+			return () => clearTimeout(timer);
+		};
+		$[2] = delay;
+		$[3] = draft;
+		$[4] = onCommit;
+		$[5] = synced;
+		$[6] = t2;
+	} else t2 = $[6];
+	let t3;
+	if ($[7] !== delay || $[8] !== draft || $[9] !== synced) {
+		t3 = [
+			draft,
+			synced,
+			delay
+		];
+		$[7] = delay;
+		$[8] = draft;
+		$[9] = synced;
+		$[10] = t3;
+	} else t3 = $[10];
+	useEffect(t2, t3);
+	let t4;
+	if ($[11] !== commit || $[12] !== draft || $[13] !== synced) {
+		t4 = () => {
+			if (draft !== synced) commit(draft);
+		};
+		$[11] = commit;
+		$[12] = draft;
+		$[13] = synced;
+		$[14] = t4;
+	} else t4 = $[14];
+	let t5;
+	if ($[15] !== draft || $[16] !== t4) {
+		t5 = {
+			draft,
+			setDraft,
+			flush: t4
+		};
+		$[15] = draft;
+		$[16] = t4;
+		$[17] = t5;
+	} else t5 = $[17];
+	return t5;
+}
+//#endregion
+export { useDraft };
+
+//# sourceMappingURL=useDraft.js.map

package/dist/useDraft.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDraft.js","names":["_c"],"sources":["../src/useDraft.ts"],"sourcesContent":["import { useEffect, useEffectEvent, useState } from 'react';\n\n/**\n * A text that is typed locally and committed after a pause: the list query changes once the user\n * stops typing, not on every key. A change of `value` from outside (a chip removed, the query\n * reset) replaces the draft.\n */\nexport function useDraft(\n    value: string,\n    commit: (value: string) => void,\n    delay = 300,\n): { draft: string; setDraft: (draft: string) => void; flush: () => void } {\n    const [draft, setDraft] = useState(value);\n    const [synced, setSynced] = useState(value);\n    if (value !== synced) {\n        setSynced(value);\n        setDraft(value);\n    }\n    const onCommit = useEffectEvent((next: string) => commit(next));\n    useEffect(() => {\n        if (draft === synced) {\n            return undefined;\n        }\n        const timer = setTimeout(() => onCommit(draft), delay);\n        return () => clearTimeout(timer);\n    }, [draft, synced, delay]);\n    return {\n        draft,\n        setDraft,\n        flush: () => {\n            if (draft !== synced) {\n                commit(draft);\n            }\n        },\n    };\n}\n"],"mappings":";;;;;;;;AAOA,SAAO,SAAA,OAAA,QAAA,IAAA;CAAA,MAAA,IAAAA,EAAA,EAAA;CAGH,MAAA,QAAA,OAAA,KAAA,IAAA,MAAA;CAEA,MAAA,CAAA,OAAA,YAA0B,SAAS,KAAK;CACxC,MAAA,CAAA,QAAA,aAA4B,SAAS,KAAK;CAC1C,IAAI,UAAU,QAAM;EAChB,UAAU,KAAK;EACf,SAAS,KAAK;CAAC;CAClB,IAAA;CAAA,IAAA,EAAA,OAAA,QAAA;EAC+B,MAAA,SAAkB,OAAO,IAAI;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAA9D,MAAA,WAAiB,eAAe,EAA8B;CAAE,IAAA;CAAA,IAAA,EAAA,OAAA,SAAA,EAAA,OAAA,SAAA,EAAA,OAAA,YAAA,EAAA,OAAA,QAAA;EACtD,WAAA;GACN,IAAI,UAAU,QAAM;GAGpB,MAAA,QAAc,iBAAiB,SAAS,KAAK,GAAG,KAAK;GAAE,aAC1C,aAAa,KAAK;EAAC;EACnC,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,SAAA,EAAA,OAAA,SAAA,EAAA,OAAA,QAAA;EAAE,KAAA;GAAC;GAAO;GAAQ;EAAK;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CANzB,UAAU,IAMP,EAAsB;CAAC,IAAA;CAAA,IAAA,EAAA,QAAA,UAAA,EAAA,QAAA,SAAA,EAAA,QAAA,QAAA;EAIf,WAAA;GACH,IAAI,UAAU,QACV,OAAO,KAAK;EACf;EACJ,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,QAAA,SAAA,EAAA,QAAA,IAAA;EAPE,KAAA;GAAA;GAAA;GAAA,OAGI;EAKX;EAAC,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAAA,OARM;AAQN"}

package/dist/useListState.d.ts

@@ -0,0 +1,4 @@
+import type { List, ListState } from '@panneau/core';
+/** The state of a list created elsewhere (`createList()`, `useList()`), kept up to date. */
+export declare function useListState(list: List): ListState;
+//# sourceMappingURL=useListState.d.ts.map

package/dist/useListState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useListState.d.ts","sourceRoot":"","sources":["../src/useListState.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAErD,4FAA4F;AAC5F,wBAAgB,YAAY,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,CAElD"}

package/dist/useListState.js

@@ -0,0 +1,10 @@
+import { useSyncExternalStore } from "react";
+//#region src/useListState.ts
+/** The state of a list created elsewhere (`createList()`, `useList()`), kept up to date. */
+function useListState(list) {
+	return useSyncExternalStore(list.subscribe, list.getState, list.getState);
+}
+//#endregion
+export { useListState };
+
+//# sourceMappingURL=useListState.js.map

package/dist/useListState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useListState.js","names":[],"sources":["../src/useListState.ts"],"sourcesContent":["import { useSyncExternalStore } from 'react';\n\nimport type { List, ListState } from '@panneau/core';\n\n/** The state of a list created elsewhere (`createList()`, `useList()`), kept up to date. */\nexport function useListState(list: List): ListState {\n    return useSyncExternalStore(list.subscribe, list.getState, list.getState);\n}\n"],"mappings":";;;AAKA,SAAO,aAAA,MAAA;CAAA,OACI,qBAAqB,KAAI,WAAY,KAAI,UAAW,KAAI,QAAS;AAAC"}

package/dist/values.d.ts

@@ -0,0 +1,21 @@
+import type { Field, Option } from '@panneau/protocol';
+import type { ListColumn, ListItem } from './types';
+/**
+ * The value of a localized field in a locale: the locale (`fr-CA`), its language (`fr`), then the
+ * first filled locale. Other values are returned as they are.
+ */
+export declare function getLocalizedValue(value: unknown, locale: string): unknown;
+/** Whether a field's values are keyed by locale. */
+export declare function isLocalized(field: Field | null | undefined): boolean;
+/** The value of a column for an item: `item[id]`, in the locale for a localized field. */
+export declare function getColumnValue(item: ListItem, column: ListColumn, locale: string): unknown;
+/**
+ * A value as plain text: strings and numbers as they are, references by their label, localized
+ * values in the locale, lists joined with commas. For labels of items and for search.
+ */
+export declare function toText(value: unknown, locale: string): string;
+/** The options of a field, or none. */
+export declare function getFieldOptions(field: Field | null | undefined): readonly Option[];
+/** The label of an option value, matched as a string (values from the URL are strings). */
+export declare function getOptionLabel(options: readonly Option[], value: unknown): string | null;
+//# sourceMappingURL=values.d.ts.map

package/dist/values.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"values.d.ts","sourceRoot":"","sources":["../src/values.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAEvD,OAAO,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAMpD;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,CAczE;AAED,oDAAoD;AACpD,wBAAgB,WAAW,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,GAAG,SAAS,GAAG,OAAO,CAEpE;AAED,0FAA0F;AAC1F,wBAAgB,cAAc,CAAC,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,CAG1F;AAED;;;GAGG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,CAuB7D;AAED,uCAAuC;AACvC,wBAAgB,eAAe,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,GAAG,SAAS,GAAG,SAAS,MAAM,EAAE,CAElF;AAED,2FAA2F;AAC3F,wBAAgB,cAAc,CAAC,OAAO,EAAE,SAAS,MAAM,EAAE,EAAE,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI,CAGxF"}

package/dist/values.js

@@ -0,0 +1,52 @@
+//#region src/values.ts
+function isRecord(value) {
+	return value !== null && typeof value === "object" && !Array.isArray(value);
+}
+/**
+* The value of a localized field in a locale: the locale (`fr-CA`), its language (`fr`), then the
+* first filled locale. Other values are returned as they are.
+*/
+function getLocalizedValue(value, locale) {
+	if (!isRecord(value)) return value;
+	const language = locale.split("-")[0] ?? locale;
+	const filled = (candidate) => candidate !== void 0 && candidate !== null && candidate !== "";
+	if (filled(value[locale])) return value[locale];
+	if (filled(value[language])) return value[language];
+	return Object.values(value).find(filled) ?? null;
+}
+/** Whether a field's values are keyed by locale. */
+function isLocalized(field) {
+	return field?.localized === true;
+}
+/** The value of a column for an item: `item[id]`, in the locale for a localized field. */
+function getColumnValue(item, column, locale) {
+	const value = item[column.field?.name ?? column.id];
+	return isLocalized(column.field) ? getLocalizedValue(value, locale) : value;
+}
+/**
+* A value as plain text: strings and numbers as they are, references by their label, localized
+* values in the locale, lists joined with commas. For labels of items and for search.
+*/
+function toText(value, locale) {
+	if (value === null || value === void 0) return "";
+	if (typeof value === "string") return value;
+	if (typeof value === "number" || typeof value === "boolean") return String(value);
+	if (Array.isArray(value)) return value.map((entry) => toText(entry, locale)).filter((text) => text !== "").join(", ");
+	if (isRecord(value)) {
+		if (typeof value.label === "string") return value.label;
+		return toText(getLocalizedValue(value, locale), locale);
+	}
+	return "";
+}
+/** The options of a field, or none. */
+function getFieldOptions(field) {
+	return field?.options ?? [];
+}
+/** The label of an option value, matched as a string (values from the URL are strings). */
+function getOptionLabel(options, value) {
+	return options.find((candidate) => String(candidate.value) === String(value))?.label ?? null;
+}
+//#endregion
+export { getColumnValue, getFieldOptions, getLocalizedValue, getOptionLabel, isLocalized, toText };
+
+//# sourceMappingURL=values.js.map

package/dist/values.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"values.js","names":[],"sources":["../src/values.ts"],"sourcesContent":["import type { Field, Option } from '@panneau/protocol';\n\nimport type { ListColumn, ListItem } from './types';\n\nfunction isRecord(value: unknown): value is Record<string, unknown> {\n    return value !== null && typeof value === 'object' && !Array.isArray(value);\n}\n\n/**\n * The value of a localized field in a locale: the locale (`fr-CA`), its language (`fr`), then the\n * first filled locale. Other values are returned as they are.\n */\nexport function getLocalizedValue(value: unknown, locale: string): unknown {\n    if (!isRecord(value)) {\n        return value;\n    }\n    const language = locale.split('-')[0] ?? locale;\n    const filled = (candidate: unknown) =>\n        candidate !== undefined && candidate !== null && candidate !== '';\n    if (filled(value[locale])) {\n        return value[locale];\n    }\n    if (filled(value[language])) {\n        return value[language];\n    }\n    return Object.values(value).find(filled) ?? null;\n}\n\n/** Whether a field's values are keyed by locale. */\nexport function isLocalized(field: Field | null | undefined): boolean {\n    return field?.localized === true;\n}\n\n/** The value of a column for an item: `item[id]`, in the locale for a localized field. */\nexport function getColumnValue(item: ListItem, column: ListColumn, locale: string): unknown {\n    const value = item[column.field?.name ?? column.id];\n    return isLocalized(column.field) ? getLocalizedValue(value, locale) : value;\n}\n\n/**\n * A value as plain text: strings and numbers as they are, references by their label, localized\n * values in the locale, lists joined with commas. For labels of items and for search.\n */\nexport function toText(value: unknown, locale: string): string {\n    if (value === null || value === undefined) {\n        return '';\n    }\n    if (typeof value === 'string') {\n        return value;\n    }\n    if (typeof value === 'number' || typeof value === 'boolean') {\n        return String(value);\n    }\n    if (Array.isArray(value)) {\n        return value\n            .map((entry) => toText(entry, locale))\n            .filter((text) => text !== '')\n            .join(', ');\n    }\n    if (isRecord(value)) {\n        if (typeof value.label === 'string') {\n            return value.label;\n        }\n        return toText(getLocalizedValue(value, locale), locale);\n    }\n    return '';\n}\n\n/** The options of a field, or none. */\nexport function getFieldOptions(field: Field | null | undefined): readonly Option[] {\n    return field?.options ?? [];\n}\n\n/** The label of an option value, matched as a string (values from the URL are strings). */\nexport function getOptionLabel(options: readonly Option[], value: unknown): string | null {\n    const option = options.find((candidate) => String(candidate.value) === String(value));\n    return option?.label ?? null;\n}\n"],"mappings":";AAIA,SAAS,SAAS,OAAkD;CAChE,OAAO,UAAU,QAAQ,OAAO,UAAU,YAAY,CAAC,MAAM,QAAQ,KAAK;AAC9E;;;;;AAMA,SAAgB,kBAAkB,OAAgB,QAAyB;CACvE,IAAI,CAAC,SAAS,KAAK,GACf,OAAO;CAEX,MAAM,WAAW,OAAO,MAAM,GAAG,CAAC,CAAC,MAAM;CACzC,MAAM,UAAU,cACZ,cAAc,KAAA,KAAa,cAAc,QAAQ,cAAc;CACnE,IAAI,OAAO,MAAM,OAAO,GACpB,OAAO,MAAM;CAEjB,IAAI,OAAO,MAAM,SAAS,GACtB,OAAO,MAAM;CAEjB,OAAO,OAAO,OAAO,KAAK,CAAC,CAAC,KAAK,MAAM,KAAK;AAChD;;AAGA,SAAgB,YAAY,OAA0C;CAClE,OAAO,OAAO,cAAc;AAChC;;AAGA,SAAgB,eAAe,MAAgB,QAAoB,QAAyB;CACxF,MAAM,QAAQ,KAAK,OAAO,OAAO,QAAQ,OAAO;CAChD,OAAO,YAAY,OAAO,KAAK,IAAI,kBAAkB,OAAO,MAAM,IAAI;AAC1E;;;;;AAMA,SAAgB,OAAO,OAAgB,QAAwB;CAC3D,IAAI,UAAU,QAAQ,UAAU,KAAA,GAC5B,OAAO;CAEX,IAAI,OAAO,UAAU,UACjB,OAAO;CAEX,IAAI,OAAO,UAAU,YAAY,OAAO,UAAU,WAC9C,OAAO,OAAO,KAAK;CAEvB,IAAI,MAAM,QAAQ,KAAK,GACnB,OAAO,MACF,KAAK,UAAU,OAAO,OAAO,MAAM,CAAC,CAAC,CACrC,QAAQ,SAAS,SAAS,EAAE,CAAC,CAC7B,KAAK,IAAI;CAElB,IAAI,SAAS,KAAK,GAAG;EACjB,IAAI,OAAO,MAAM,UAAU,UACvB,OAAO,MAAM;EAEjB,OAAO,OAAO,kBAAkB,OAAO,MAAM,GAAG,MAAM;CAC1D;CACA,OAAO;AACX;;AAGA,SAAgB,gBAAgB,OAAoD;CAChF,OAAO,OAAO,WAAW,CAAA;AAC7B;;AAGA,SAAgB,eAAe,SAA4B,OAA+B;CAEtF,OADe,QAAQ,MAAM,cAAc,OAAO,UAAU,KAAK,MAAM,OAAO,KAAK,CAC5E,CAAA,EAAQ,SAAS;AAC5B"}