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

package/dist/actions/ConfirmDialog.d.ts

@@ -1,5 +1,9 @@
 import type { ListActionEvent, ListActionPreview } from '../types.js';
-/** 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.
+ */
 export declare function needsConfirmation(event: ListActionEvent): boolean;
 /** The dry run of a query selection: in progress, or done with the backend's count. */
 export type ConfirmPreview = {

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

@@ -1 +1 @@
-{"version":3,"file":"ConfirmDialog.d.ts","sourceRoot":"","sources":["../../src/actions/ConfirmDialog.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAoBnE,mGAAmG;AACnG,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,eAAe,GAAG,OAAO,CAGjE;AAED,uFAAuF;AACvF,MAAM,MAAM,cAAc,GAAG;IAAE,MAAM,EAAE,SAAS,CAAA;CAAE,GAAG,CAAC;IAAE,MAAM,EAAE,MAAM,CAAA;CAAE,GAAG,iBAAiB,CAAC,CAAC;AAE9F,MAAM,WAAW,kBAAkB;IAC/B,kEAAkE;IAClE,KAAK,EAAE,eAAe,GAAG,IAAI,CAAC;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IAChC,SAAS,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC5C,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,OAAc,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,kBAAkB,sCA+D/F"}
+{"version":3,"file":"ConfirmDialog.d.ts","sourceRoot":"","sources":["../../src/actions/ConfirmDialog.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAoBnE;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,eAAe,GAAG,OAAO,CAEjE;AAED,uFAAuF;AACvF,MAAM,MAAM,cAAc,GAAG;IAAE,MAAM,EAAE,SAAS,CAAA;CAAE,GAAG,CAAC;IAAE,MAAM,EAAE,MAAM,CAAA;CAAE,GAAG,iBAAiB,CAAC,CAAC;AAE9F,MAAM,WAAW,kBAAkB;IAC/B,kEAAkE;IAClE,KAAK,EAAE,eAAe,GAAG,IAAI,CAAC;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IAChC,SAAS,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC5C,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,OAAc,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,kBAAkB,sCA+D/F"}

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/displays/Displays.css

@@ -67,6 +67,12 @@
     gap: var(--panneau-space-2);
 }
 
+.panneau-displays-files {
+    display: inline-flex;
+    flex-direction: column;
+    gap: var(--panneau-space-1);
+}
+
 .panneau-displays-thumbnail {
     flex: none;
     width: 2.5rem;

package/dist/displays/Displays.module.js

@@ -10,6 +10,7 @@ var color = "panneau-displays-color";
 var paletteColor = "panneau-displays-palette-color";
 var swatch = "panneau-displays-swatch";
 var media = "panneau-displays-media";
+var files = "panneau-displays-files";
 var thumbnail = "panneau-displays-thumbnail";
 var code = "panneau-displays-code";
 var tags = "panneau-displays-tags";
@@ -30,6 +31,7 @@ var Displays_module_default = {
 	paletteColor,
 	swatch,
 	media,
+	files,
 	thumbnail,
 	code,
 	tags,
@@ -39,6 +41,6 @@ var Displays_module_default = {
 	regionFlag
 };
 //#endregion
-export { badges, boolean, code, color, countries, Displays_module_default as default, empty, flag, flagged, link, media, number, paletteColor, regionFlag, swatch, tags, text, thumbnail };
+export { badges, boolean, code, color, countries, Displays_module_default as default, empty, files, flag, flagged, link, media, number, paletteColor, regionFlag, swatch, tags, text, thumbnail };
 
 //# sourceMappingURL=Displays.module.js.map

package/dist/displays/Displays.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"Displays.module.js","names":[],"sources":["../../src/displays/Displays.module.css"],"sourcesContent":[".empty {\n    color: var(--panneau-color-text-muted);\n}\n\n.text {\n    display: -webkit-box;\n    overflow: hidden;\n    -webkit-line-clamp: 2;\n    line-clamp: 2;\n    -webkit-box-orient: vertical;\n    overflow-wrap: anywhere;\n}\n\n.badges {\n    display: inline-flex;\n    flex-wrap: wrap;\n    gap: var(--panneau-space-1);\n}\n\n.boolean {\n    display: inline-flex;\n    align-items: center;\n}\n\n.true {\n    color: var(--panneau-color-success);\n}\n\n.false {\n    color: var(--panneau-color-text-muted);\n}\n\n.number {\n    font-variant-numeric: var(--panneau-font-numeric);\n}\n\n.link {\n    color: var(--panneau-color-link);\n    overflow-wrap: anywhere;\n}\n\n.color {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--panneau-space-2);\n    font-family: var(--panneau-font-family-mono);\n    font-size: var(--panneau-font-size-sm);\n}\n\n.paletteColor {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--panneau-space-2);\n}\n\n.swatch {\n    flex: none;\n    width: 1rem;\n    height: 1rem;\n    border: var(--panneau-border-width) solid var(--panneau-color-border-control);\n    border-radius: var(--panneau-radius-sm);\n}\n\n.media {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--panneau-space-2);\n}\n\n.thumbnail {\n    flex: none;\n    width: 2.5rem;\n    height: 2.5rem;\n    object-fit: cover;\n    background-color: var(--panneau-color-surface-sunken);\n    border-radius: var(--panneau-radius-sm);\n}\n\n.code {\n    font-family: var(--panneau-font-family-mono);\n    font-size: var(--panneau-font-size-sm);\n    white-space: nowrap;\n}\n\n.tags {\n    display: inline-flex;\n    flex-wrap: wrap;\n    gap: var(--panneau-space-1);\n}\n\n/* Several countries. */\n.countries {\n    display: inline-flex;\n    flex-wrap: wrap;\n    gap: var(--panneau-space-1) var(--panneau-space-3);\n}\n\n/* A value after a flag: a country, a region, a phone number. */\n.flagged {\n    display: inline-flex;\n    align-items: baseline;\n    gap: var(--panneau-space-2);\n    min-width: 0;\n}\n\n.flag {\n    flex: 0 0 auto;\n}\n\n/* The flag of a region is an image: centered on the text, where an emoji sits on its baseline. */\n.regionFlag {\n    align-self: center;\n}\n"],"mappings":""}
+{"version":3,"file":"Displays.module.js","names":[],"sources":["../../src/displays/Displays.module.css"],"sourcesContent":[".empty {\n    color: var(--panneau-color-text-muted);\n}\n\n.text {\n    display: -webkit-box;\n    overflow: hidden;\n    -webkit-line-clamp: 2;\n    line-clamp: 2;\n    -webkit-box-orient: vertical;\n    overflow-wrap: anywhere;\n}\n\n.badges {\n    display: inline-flex;\n    flex-wrap: wrap;\n    gap: var(--panneau-space-1);\n}\n\n.boolean {\n    display: inline-flex;\n    align-items: center;\n}\n\n.true {\n    color: var(--panneau-color-success);\n}\n\n.false {\n    color: var(--panneau-color-text-muted);\n}\n\n.number {\n    font-variant-numeric: var(--panneau-font-numeric);\n}\n\n.link {\n    color: var(--panneau-color-link);\n    overflow-wrap: anywhere;\n}\n\n.color {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--panneau-space-2);\n    font-family: var(--panneau-font-family-mono);\n    font-size: var(--panneau-font-size-sm);\n}\n\n.paletteColor {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--panneau-space-2);\n}\n\n.swatch {\n    flex: none;\n    width: 1rem;\n    height: 1rem;\n    border: var(--panneau-border-width) solid var(--panneau-color-border-control);\n    border-radius: var(--panneau-radius-sm);\n}\n\n.media {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--panneau-space-2);\n}\n\n.files {\n    display: inline-flex;\n    flex-direction: column;\n    gap: var(--panneau-space-1);\n}\n\n.thumbnail {\n    flex: none;\n    width: 2.5rem;\n    height: 2.5rem;\n    object-fit: cover;\n    background-color: var(--panneau-color-surface-sunken);\n    border-radius: var(--panneau-radius-sm);\n}\n\n.code {\n    font-family: var(--panneau-font-family-mono);\n    font-size: var(--panneau-font-size-sm);\n    white-space: nowrap;\n}\n\n.tags {\n    display: inline-flex;\n    flex-wrap: wrap;\n    gap: var(--panneau-space-1);\n}\n\n/* Several countries. */\n.countries {\n    display: inline-flex;\n    flex-wrap: wrap;\n    gap: var(--panneau-space-1) var(--panneau-space-3);\n}\n\n/* A value after a flag: a country, a region, a phone number. */\n.flagged {\n    display: inline-flex;\n    align-items: baseline;\n    gap: var(--panneau-space-2);\n    min-width: 0;\n}\n\n.flag {\n    flex: 0 0 auto;\n}\n\n/* The flag of a region is an image: centered on the text, where an emoji sits on its baseline. */\n.regionFlag {\n    align-self: center;\n}\n"],"mappings":""}

package/dist/displays/displays.d.ts

@@ -73,8 +73,16 @@ export declare function LinkDisplay({ value }: DisplayProps): import("react").JS
  * swatch and its label.
  */
 export declare function ColorDisplay({ value, field }: DisplayProps): import("react").JSX.Element;
-/** A thumbnail and the name of a media item (or of the first one). */
+/**
+ * A thumbnail and the name of a media (or of the first one), for `media` and `image` values:
+ * a media reference (`{ id, label, media }`), or a media with its URLs.
+ */
 export declare function MediaDisplay({ value }: DisplayProps): import("react").JSX.Element;
+/**
+ * Stored files (`file` values): the thumbnail of an image, or an icon, and the name of each file,
+ * linked to its URL.
+ */
+export declare function FileDisplay({ value }: DisplayProps): import("react").JSX.Element;
 /**
  * The built-in displays, by name. A column's display is its `display`, its field's `display`, or
  * its field's type: field types are display names. Values without a known display are shown as

package/dist/displays/displays.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"displays.d.ts","sourceRoot":"","sources":["../../src/displays/displays.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI3D,kGAAkG;AAClG,wBAAgB,UAAU,gCAMzB;AAWD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,YAAY,+BAkBzD;AAED,0BAA0B;AAC1B,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAetD;AAED,6CAA6C;AAC7C,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAQpD;AAED,4CAA4C;AAC5C,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAcrD;AAkBD,2CAA2C;AAC3C,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAOlD;AAED,sEAAsE;AACtE,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAWtD;AAED;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,YAAY,+BAqB9D;AAED,8FAA8F;AAC9F,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAOnD;AAED,4DAA4D;AAC5D,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAQlD;AAED,qDAAqD;AACrD,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,YAAY,+BAkB3D;AAED,mCAAmC;AACnC,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAUtD;AAED,iCAAiC;AACjC,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BASjD;AAED,mCAAmC;AACnC,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BASnD;AAED;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,YAAY,+BAmCxD;AAwBD,4FAA4F;AAC5F,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAiBrD;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,YAAY,+BAsBjE;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,YAAY,+BAa7D;AAED,mCAAmC;AACnC,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAUlD;AAED,yDAAyD;AACzD,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,YAAY,+BAezD;AAED,gEAAgE;AAChE,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAuBnD;AAED,gDAAgD;AAChD,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAsBtD;AAED,0FAA0F;AAC1F,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAsBrD;AAID;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAiClD;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,YAAY,+BA0B1D;AAED,sEAAsE;AACtE,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,EAAE,YAAY,+BAmBnD;AAED;;;;GAIG;AACH,eAAO,MAAM,eAAe,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CA6BlE,CAAC"}
+{"version":3,"file":"displays.d.ts","sourceRoot":"","sources":["../../src/displays/displays.tsx"],"names":[],"mappings":"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"}

package/dist/displays/displays.js

@@ -1,10 +1,11 @@
 import { messages } from "../messages.js";
-import { findOption, getFieldOptions, toText } from "../values.js";
+import { findOption, getFieldOptions, isRecord, toText } from "../values.js";
+import { getImageUrl } from "../images.js";
 import Displays_module_default from "./Displays.module.js";
 import { c } from "react/compiler-runtime";
 import { fieldsMessages } from "@panneau/intl";
 import { Badge, Icon, usePanneauIntl } from "@panneau/ui";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Check, File, FileText, Globe, Hash, Mail, Minus, Phone } from "lucide-react";
 import { toReferences } from "@panneau/fields";
 import { formatAddress, isAddress } from "@panneau/fields/address";
@@ -1438,12 +1439,27 @@ function ColorDisplay(t0) {
 	} else t3 = $[17];
 	return t3;
 }
-/** A thumbnail and the name of a media item (or of the first one). */
+/** The text of a media, a reference or a file: its label, name or file name. */
+function mediaLabel(value) {
+	for (const key of [
+		"label",
+		"name",
+		"filename"
+	]) {
+		const text = value[key];
+		if (typeof text === "string" && text !== "") return text;
+	}
+	return "";
+}
+/**
+* A thumbnail and the name of a media (or of the first one), for `media` and `image` values:
+* a media reference (`{ id, label, media }`), or a media with its URLs.
+*/
 function MediaDisplay(t0) {
-	const $ = c(8);
+	const $ = c(12);
 	const { value } = t0;
 	const media = Array.isArray(value) ? value[0] : value;
-	if (media === null || typeof media !== "object") {
+	if (!isRecord(media)) {
 		let t1;
 		if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
 			t1 = /* @__PURE__ */ jsx(EmptyValue, {});
@@ -1451,46 +1467,133 @@ function MediaDisplay(t0) {
 		} else t1 = $[0];
 		return t1;
 	}
-	const { thumbnailUrl, url, name, filename } = media;
-	const source = typeof thumbnailUrl === "string" ? thumbnailUrl : typeof url === "string" ? url : null;
-	const label = typeof name === "string" ? name : typeof filename === "string" ? filename : "";
 	let t1;
-	if ($[1] !== source) {
-		t1 = source !== null ? /* @__PURE__ */ jsx("img", {
-			className: Displays_module_default.thumbnail,
-			src: source,
-			alt: ""
-		}) : null;
-		$[1] = source;
+	if ($[1] !== media) {
+		t1 = getImageUrl(media);
+		$[1] = media;
 		$[2] = t1;
 	} else t1 = $[2];
+	const source = t1;
 	let t2;
-	if ($[3] !== label) {
-		t2 = label !== "" ? /* @__PURE__ */ jsx("span", {
+	if ($[3] !== media) {
+		t2 = mediaLabel(media);
+		$[3] = media;
+		$[4] = t2;
+	} else t2 = $[4];
+	const label = t2;
+	let t3;
+	if ($[5] !== source) {
+		t3 = source !== null ? /* @__PURE__ */ jsx("img", {
+			className: Displays_module_default.thumbnail,
+			src: source,
+			alt: "",
+			loading: "lazy"
+		}) : null;
+		$[5] = source;
+		$[6] = t3;
+	} else t3 = $[6];
+	let t4;
+	if ($[7] !== label) {
+		t4 = label !== "" ? /* @__PURE__ */ jsx("span", {
 			className: Displays_module_default.text,
 			"data-clamp": "",
 			children: label
 		}) : null;
-		$[3] = label;
-		$[4] = t2;
-	} else t2 = $[4];
+		$[7] = label;
+		$[8] = t4;
+	} else t4 = $[8];
+	let t5;
+	if ($[9] !== t3 || $[10] !== t4) {
+		t5 = /* @__PURE__ */ jsxs("span", {
+			className: Displays_module_default.media,
+			children: [t3, t4]
+		});
+		$[9] = t3;
+		$[10] = t4;
+		$[11] = t5;
+	} else t5 = $[11];
+	return t5;
+}
+/**
+* Stored files (`file` values): the thumbnail of an image, or an icon, and the name of each file,
+* linked to its URL.
+*/
+function FileDisplay(t0) {
+	const $ = c(8);
+	const { value } = t0;
+	let t1;
+	let t2;
 	let t3;
+	if ($[0] !== value) {
+		t3 = Symbol.for("react.early_return_sentinel");
+		bb0: {
+			const files = (Array.isArray(value) ? value : [value]).filter(isRecord);
+			if (files.length === 0) {
+				let t4;
+				if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+					t4 = /* @__PURE__ */ jsx(EmptyValue, {});
+					$[4] = t4;
+				} else t4 = $[4];
+				t3 = t4;
+				break bb0;
+			}
+			t1 = Displays_module_default.files;
+			t2 = files.map(_temp5);
+		}
+		$[0] = value;
+		$[1] = t1;
+		$[2] = t2;
+		$[3] = t3;
+	} else {
+		t1 = $[1];
+		t2 = $[2];
+		t3 = $[3];
+	}
+	if (t3 !== Symbol.for("react.early_return_sentinel")) return t3;
+	let t4;
 	if ($[5] !== t1 || $[6] !== t2) {
-		t3 = /* @__PURE__ */ jsxs("span", {
-			className: Displays_module_default.media,
-			children: [t1, t2]
+		t4 = /* @__PURE__ */ jsx("span", {
+			className: t1,
+			children: t2
 		});
 		$[5] = t1;
 		$[6] = t2;
-		$[7] = t3;
-	} else t3 = $[7];
-	return t3;
+		$[7] = t4;
+	} else t4 = $[7];
+	return t4;
 }
 /**
 * The built-in displays, by name. A column's display is its `display`, its field's `display`, or
 * its field's type: field types are display names. Values without a known display are shown as
 * text.
 */
+function _temp5(file, index) {
+	const image = getImageUrl(file);
+	const name = mediaLabel(file);
+	const content = /* @__PURE__ */ jsxs(Fragment, { children: [image !== null ? /* @__PURE__ */ jsx("img", {
+		className: Displays_module_default.thumbnail,
+		src: image,
+		alt: "",
+		loading: "lazy"
+	}) : /* @__PURE__ */ jsx(Icon, {
+		icon: File,
+		size: "sm"
+	}), /* @__PURE__ */ jsx("span", {
+		className: Displays_module_default.text,
+		"data-clamp": "",
+		children: name !== "" ? name : typeof file.url === "string" ? file.url : ""
+	})] });
+	return typeof file.url === "string" && file.url !== "" ? /* @__PURE__ */ jsx("a", {
+		className: `${Displays_module_default.link} ${Displays_module_default.media}`,
+		href: file.url,
+		target: "_blank",
+		rel: "noreferrer",
+		children: content
+	}, index) : /* @__PURE__ */ jsx("span", {
+		className: Displays_module_default.media,
+		children: content
+	}, index);
+}
 var builtInDisplays = {
 	text: TextDisplay,
 	textarea: TextDisplay,
@@ -1507,6 +1610,8 @@ var builtInDisplays = {
 	email: EmailDisplay,
 	color: ColorDisplay,
 	media: MediaDisplay,
+	image: MediaDisplay,
+	file: FileDisplay,
 	tel: TelDisplay,
 	range: NumberDisplay,
 	duration: DurationDisplay,
@@ -1522,6 +1627,6 @@ var builtInDisplays = {
 	money: MoneyDisplay
 };
 //#endregion
-export { AddressDisplay, BooleanDisplay, ColorDisplay, CountryDisplay, DateDisplay, DateRangeDisplay, DateTimeDisplay, DurationDisplay, EmailDisplay, EmbedDisplay, EmptyValue, JsonDisplay, LinkDisplay, LocationDisplay, MediaDisplay, MoneyDisplay, NumberDisplay, RegionDisplay, RelationDisplay, RichTextDisplay, SelectDisplay, TagsDisplay, TelDisplay, TextDisplay, TimeDisplay, UrlDisplay, builtInDisplays };
+export { AddressDisplay, BooleanDisplay, ColorDisplay, CountryDisplay, DateDisplay, DateRangeDisplay, DateTimeDisplay, DurationDisplay, EmailDisplay, EmbedDisplay, EmptyValue, FileDisplay, JsonDisplay, LinkDisplay, LocationDisplay, MediaDisplay, MoneyDisplay, NumberDisplay, RegionDisplay, RelationDisplay, RichTextDisplay, SelectDisplay, TagsDisplay, TelDisplay, TextDisplay, TimeDisplay, UrlDisplay, builtInDisplays };
 
 //# sourceMappingURL=displays.js.map