@sincpro/web-ui 1.6.0 → 1.7.0

package/dist/components/listing/SortMenu.js

@@ -1,105 +1,65 @@
 "use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useUiCopy } from "../../foundations/copy.js";
-import { Menu } from "../../primitives/menu/Menu.js";
-import { ArrowDownUp, ArrowDownWideNarrow, ArrowUpNarrowWide } from "lucide-react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { fillCopy, useUiCopy } from "../../foundations/copy.js";
+import { Menu, menuTriggerClasses } from "../../primitives/menu/Menu.js";
+import { Popover } from "../../primitives/overlay/Popover.js";
+import { compareBy, flipSort, moveSort, } from "../../primitives/table/sorting.js";
+import { ArrowDownUp, ArrowDownWideNarrow, ArrowUpNarrowWide, ChevronDown, GripVertical, Plus, X, } from "lucide-react";
+import { Button as AriaButton, Dialog, DialogTrigger, GridList, GridListItem, useDragAndDrop, } from "react-aria-components";
 /**
- * Las filas, ordenadas acá.
+ * Las filas, ordenadas acá, por cada criterio en su orden.
  *
- * Sólo cuando el campo activo declara `value`; si no, se devuelven tal cual —
- * ordenar una página de un conjunto que se pagina afuera produce un orden que es
- * mentira, porque ordena las doce que llegaron y no las ciento ochenta y siete.
+ * Sólo por los campos que declaran `value`; los demás se saltean —ordenar una
+ * página de un conjunto que se pagina afuera produce un orden que es mentira,
+ * porque ordena las doce que llegaron y no las ciento ochenta y siete. Sin
+ * ningún criterio legible, se devuelven tal cual.
  *
- * Los faltantes van SIEMPRE al final, suba o baje el orden. Es lo que hace
- * cualquier planilla, y la razón es que un vacío no es «el más chico»: es la
- * ausencia de respuesta, y ponerlo primero al invertir el orden llena la primera
- * pantalla con las filas que menos dicen.
+ * Los faltantes van SIEMPRE al final, suba o baje el orden (ver `compareBy`).
  */
 export function sortItems(items, fields, sort) {
-    if (sort === null || sort === undefined)
+    if (sort === undefined || sort.length === 0)
         return items;
-    const field = fields.find((one) => one.field === sort.key);
-    if (field?.value === undefined)
+    const read = (key) => fields.find((one) => one.field === key)?.value;
+    if (!sort.some((one) => read(one.key) !== undefined))
         return items;
-    const read = field.value;
-    const sign = sort.direction === "asc" ? 1 : -1;
-    return [...items].sort((a, b) => {
-        const left = read(a);
-        const right = read(b);
-        const leftMissing = left === null || left === undefined || left === "";
-        const rightMissing = right === null || right === undefined || right === "";
-        if (leftMissing && rightMissing)
-            return 0;
-        if (leftMissing)
-            return 1;
-        if (rightMissing)
-            return -1;
-        if (typeof left === "number" && typeof right === "number")
-            return (left - right) * sign;
-        return String(left).localeCompare(String(right)) * sign;
-    });
+    return [...items].sort(compareBy(sort, read));
 }
 export function SortMenu({ fields, sort, onSortChange, surface }) {
     const copy = useUiCopy();
+    const fieldOf = (key) => fields.find((one) => one.field === key);
+    const labelOf = (key) => fieldOf(key)?.label ?? key;
+    const { dragAndDropHooks } = useDragAndDrop({
+        getItems: (keys) => [...keys].map((key) => ({ "text/plain": labelOf(String(key)) })),
+        onReorder: (event) => onSortChange(moveSort(sort, new Set([...event.keys].map(String)), String(event.target.key), event.target.dropPosition === "before" ? "before" : "after")),
+    });
     if (fields.length === 0)
         return null;
-    const current = fields.find((one) => one.field === sort?.key);
-    const groups = [
-        {
-            label: copy.sorting.by,
-            options: fields.map((one) => ({
-                id: one.field,
-                label: one.label,
-                checked: one.field === sort?.key,
-            })),
-        },
-        /* La dirección sólo cuando hay algo ordenado: «descendente» sin campo no
-           ordena nada, y una opción que no hace nada es una opción que se prueba. */
-        ...(current === undefined
-            ? []
-            : [
-                {
-                    options: [
-                        {
-                            id: "__asc__",
-                            label: current.ascLabel ?? copy.sorting.asc,
-                            icon: ArrowUpNarrowWide,
-                            checked: sort?.direction === "asc",
-                        },
-                        {
-                            id: "__desc__",
-                            label: current.descLabel ?? copy.sorting.desc,
-                            icon: ArrowDownWideNarrow,
-                            checked: sort?.direction === "desc",
-                        },
-                    ],
-                },
-                { options: [{ id: "__none__", label: copy.sorting.clear }] },
-            ]),
-    ];
-    return (_jsx(Menu, { label: current === undefined ? copy.sorting.label : current.label, icon: sort === null || sort === undefined
-            ? ArrowDownUp
-            : sort.direction === "asc"
-                ? ArrowUpNarrowWide
-                : ArrowDownWideNarrow, groups: groups, active: sort !== null && sort !== undefined, size: "sm", width: "sm", closeOnSelect: false, ...(surface === undefined ? {} : { surface }), onSelect: (id) => {
-            if (id === "__none__")
-                return onSortChange(null);
-            if (id === "__asc__") {
-                return onSortChange(sort === null ? null : { ...sort, direction: "asc" });
-            }
-            if (id === "__desc__") {
-                return onSortChange(sort === null ? null : { ...sort, direction: "desc" });
-            }
-            /* Volver a elegir el campo que ya está puesto DA VUELTA la dirección, que
-               es lo que hace el clic en un encabezado. Sin eso, invertir el orden son
-               dos gestos en un menú y uno en la tabla — la misma capacidad costando
-               distinto según la presentación. */
-            if (sort?.key === id) {
-                return onSortChange({
-                    key: id,
-                    direction: sort.direction === "asc" ? "desc" : "asc",
-                });
-            }
-            onSortChange({ key: id, direction: "asc" });
-        } }));
+    const first = sort[0];
+    const label = first === undefined
+        ? copy.sorting.label
+        : sort.length === 1
+            ? labelOf(first.key)
+            : fillCopy(copy.sorting.more, { label: labelOf(first.key), count: sort.length - 1 });
+    const TriggerIcon = first === undefined
+        ? ArrowDownUp
+        : first.direction === "asc"
+            ? ArrowUpNarrowWide
+            : ArrowDownWideNarrow;
+    const left = fields.filter((one) => !sort.some((s) => s.key === one.field));
+    return (_jsxs(DialogTrigger, { children: [_jsxs(AriaButton, { className: ({ isPressed, isFocusVisible }) => menuTriggerClasses({
+                    ...(surface === undefined ? {} : { surface }),
+                    active: sort.length > 0,
+                    open: isPressed,
+                    focusVisible: isFocusVisible,
+                }), children: [_jsx(TriggerIcon, { className: "size-(--size-icon-sm)", strokeWidth: 2, "aria-hidden": true }), label, _jsx(ChevronDown, { className: "size-(--size-icon-sm)", strokeWidth: 2, "aria-hidden": true })] }), _jsx(Popover, { placement: "bottom start", className: "w-80", children: _jsxs(Dialog, { "aria-label": copy.sorting.label, className: "flex flex-col gap-1 p-2 outline-0", children: [sort.length === 0 ? (_jsx("p", { className: "px-1 py-1 text-meta text-muted", children: copy.sorting.none })) : (_jsx(GridList, { "aria-label": copy.sorting.label, items: sort.map((one, index) => ({ ...one, id: one.key, index })), dragAndDropHooks: dragAndDropHooks, className: "flex flex-col outline-0", children: (item) => {
+                                const field = fieldOf(item.key);
+                                const name = labelOf(item.key);
+                                const direction = item.direction === "asc"
+                                    ? (field?.ascLabel ?? copy.sorting.asc)
+                                    : (field?.descLabel ?? copy.sorting.desc);
+                                const DirectionIcon = item.direction === "asc" ? ArrowUpNarrowWide : ArrowDownWideNarrow;
+                                return (_jsxs(GridListItem, { id: item.id, textValue: `${item.index + 1}. ${name}, ${direction}`, className: "flex min-w-0 items-center gap-1.5 rounded-control px-1 py-1 outline-0 transition-colors duration-(--duration-instant) data-dragging:opacity-50 data-drop-target:bg-primary/8 data-focus-visible:outline-2 data-focus-visible:-outline-offset-2 data-focus-visible:outline-primary data-hovered:bg-ink/4", children: [_jsx(AriaButton, { slot: "drag", "aria-label": fillCopy(copy.sorting.move, { field: name }), className: "inline-flex shrink-0 cursor-grab items-center rounded-mark p-0.5 text-muted outline-0 hover:text-ink data-focus-visible:outline-2 data-focus-visible:outline-primary", children: _jsx(GripVertical, { className: "size-(--size-icon-sm)", strokeWidth: 2 }) }), _jsx("span", { className: "w-16 shrink-0 text-micro text-muted", children: item.index === 0 ? copy.sorting.by : copy.sorting.then }), _jsx("span", { className: "min-w-0 flex-1 truncate text-meta text-ink", children: name }), _jsxs(AriaButton, { "aria-label": `${fillCopy(copy.sorting.flip, { field: name })}: ${direction}`, onPress: () => onSortChange(flipSort(sort, item.index)), className: "inline-flex shrink-0 items-center gap-1 rounded-mark px-1 py-0.5 text-micro text-primary outline-0 hover:bg-primary/8 data-focus-visible:outline-2 data-focus-visible:outline-primary", children: [_jsx(DirectionIcon, { className: "size-(--size-icon-sm)", strokeWidth: 2, "aria-hidden": true }), direction] }), _jsx(AriaButton, { "aria-label": fillCopy(copy.sorting.remove, { field: name }), onPress: () => onSortChange(sort.filter((_, i) => i !== item.index)), className: "inline-flex shrink-0 items-center rounded-mark p-0.5 text-muted outline-0 hover:bg-ink/6 hover:text-ink data-focus-visible:outline-2 data-focus-visible:outline-primary", children: _jsx(X, { className: "size-(--size-icon-sm)", strokeWidth: 2, "aria-hidden": true }) })] }));
+                            } })), _jsxs("div", { className: "flex items-center justify-between gap-2 border-t border-line pt-2", children: [left.length === 0 ? (_jsx("span", {})) : (_jsx(Menu, { label: copy.sorting.add, icon: Plus, variant: "text", chevron: false, width: "sm", groups: [
+                                        { options: left.map((one) => ({ id: one.field, label: one.label })) },
+                                    ], onSelect: (id) => onSortChange([...sort, { key: id, direction: "asc" }]) })), sort.length === 0 ? null : (_jsx(AriaButton, { onPress: () => onSortChange([]), className: "rounded-mark px-1.5 py-0.5 text-micro text-muted outline-0 hover:bg-ink/6 hover:text-ink data-focus-visible:outline-2 data-focus-visible:outline-primary", children: copy.sorting.clear }))] })] }) })] }));
 }

package/dist/components/listing/index.d.ts

@@ -2,7 +2,8 @@ export { type ColumnControl, type ColumnSpec, defaultVisibleIds, reconcileVisibl
 export { ColumnsMenu, specsFromColumns, } from "./ColumnsMenu.js";
 export { Listing } from "./Listing.js";
 export { type ListIdentity, ListingBar } from "./ListingBar.js";
-export { type ClaimedField, claimedFields, columnsFromModel, readModelValue, } from "./modelColumns.js";
+export { type ModelCellKind } from "./modelCells.js";
+export { type ClaimedField, claimedFields, columnsFromModel, modelCellKind, readModelValue, } from "./modelColumns.js";
 export { type CursorSource, DEFAULT_PAGE_SIZE, PAGE_SIZES, type Pages, type PaginationBridge, type ServerPage, useCursorPagination, usePagination, } from "./pages.js";
 export { Pagination } from "./Pagination.js";
 export { RecordLink } from "./RecordLink.js";

package/dist/components/listing/index.js

@@ -4,7 +4,8 @@ export { defaultVisibleIds, reconcileVisible, toggleColumn, useColumnControl, vi
 export { ColumnsMenu, specsFromColumns, } from "./ColumnsMenu.js";
 export { Listing } from "./Listing.js";
 export { ListingBar } from "./ListingBar.js";
-export { claimedFields, columnsFromModel, readModelValue, } from "./modelColumns.js";
+export {} from "./modelCells.js";
+export { claimedFields, columnsFromModel, modelCellKind, readModelValue, } from "./modelColumns.js";
 export { DEFAULT_PAGE_SIZE, PAGE_SIZES, useCursorPagination, usePagination, } from "./pages.js";
 export { Pagination } from "./Pagination.js";
 export { RecordLink } from "./RecordLink.js";

package/dist/components/listing/modelCells.d.ts

@@ -0,0 +1,7 @@
+/** How a model field is drawn. `text` is today's behaviour, for any type not known here. */
+export type ModelCellKind = "text" | "number" | "email" | "url" | "phone" | "duration" | "boolean" | "date" | "datetime";
+/** One cell of a model column. `value` is what `readModelValue` read — never `null` here. */
+export declare function ModelCell({ kind, value, }: {
+    kind: ModelCellKind;
+    value: string | number | boolean;
+}): import("react").JSX.Element;

package/dist/components/listing/modelCells.js

@@ -0,0 +1,56 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useUiCopy } from "../../foundations/copy.js";
+import { emailHref, telHref, urlHref, urlLabel, } from "../../primitives/field/contact.js";
+import { formatDuration } from "../../primitives/field/duration.js";
+import { DateValue } from "../../primitives/value/DateValue.js";
+import { Numeric } from "../../primitives/value/Value.js";
+import { Check } from "lucide-react";
+const LINK = "block truncate rounded-mark text-primary underline-offset-2 hover:underline focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-primary";
+function Plain({ text }) {
+    return (_jsx("span", { className: "block truncate text-muted", title: text, children: text }));
+}
+/** A link in a cell, or the plain text when the value does not make one. */
+function Link({ text, href, label, external = false, }) {
+    const copy = useUiCopy();
+    if (href === null)
+        return _jsx(Plain, { text: text });
+    return (_jsxs("a", { href: href, title: text, className: LINK, 
+        /* The row opens its record on a click; writing to its email must not ALSO open it. */
+        onClick: (event) => event.stopPropagation(), ...(external ? { target: "_blank", rel: "noopener noreferrer" } : {}), children: [label ?? text, external ? _jsxs("span", { className: "sr-only", children: [" (", copy.field.newTab, ")"] }) : null] }));
+}
+/** A yes/no in words: a check alone is not read by everyone the same way, and «no» needs
+ *  no icon — an empty mark next to every false row would only add noise to the column. */
+function YesNo({ value }) {
+    const copy = useUiCopy();
+    if (!value)
+        return _jsx("span", { className: "text-muted", children: copy.table.no });
+    return (_jsxs("span", { className: "inline-flex items-center gap-1 text-ink", children: [_jsx(Check, { "aria-hidden": true, className: "size-(--size-icon-sm) text-good", strokeWidth: 2.5 }), copy.table.yes] }));
+}
+/** One cell of a model column. `value` is what `readModelValue` read — never `null` here. */
+export function ModelCell({ kind, value, }) {
+    const text = String(value);
+    switch (kind) {
+        case "number":
+            /* A figure in the locale's digits and right aligned, so a column of amounts lines up
+               — never «1234.5» as text. */
+            return typeof value === "number" ? (_jsx(Numeric, { value: value, format: "decimal" })) : (_jsx(Plain, { text: text }));
+        case "email":
+            return _jsx(Link, { text: text, href: emailHref(text) });
+        case "phone":
+            return _jsx(Link, { text: text, href: telHref(text) });
+        case "url":
+            return _jsx(Link, { text: text, href: urlHref(text), label: urlLabel(text), external: true });
+        case "duration":
+            return typeof value === "number" ? (
+            /* Right aligned like `Numeric`: a column of hours lines up by the colon. */
+            _jsx("span", { className: "block text-right text-body tabular-nums whitespace-nowrap text-ink", children: formatDuration(value) })) : (_jsx(Plain, { text: text }));
+        case "boolean":
+            return typeof value === "boolean" ? _jsx(YesNo, { value: value }) : _jsx(Plain, { text: text });
+        case "date":
+        case "datetime":
+            return typeof value === "boolean" ? (_jsx(Plain, { text: text })) : (_jsx(DateValue, { when: value, format: kind === "date" ? "date" : "relative" }));
+        default:
+            return _jsx(Plain, { text: text });
+    }
+}

package/dist/components/listing/modelColumns.d.ts

@@ -1,3 +1,4 @@
+import { type ModelCellKind } from "./modelCells.js";
 import { type ModelDefinition } from "../search/model.js";
 import type { DataColumn } from "../../primitives/table/DataTable.js";
 /** Qué campo del modelo muestra una columna declarada a mano.
@@ -28,6 +29,14 @@ export declare function claimedFields(columns: readonly ClaimedField[]): Set<str
  *  Las fechas se dejan como vienen —ISO— porque en ISO el orden alfabético ES
  *  el cronológico, y así la columna ordena bien sin parsear nada. */
 export declare function readModelValue(raw: unknown): string | number | boolean | null;
+/** How a field of the model is drawn, by its `type` and in any case — «Email» and `email` are
+ *  the same field. A type not known here stays `text`, exactly as before.
+ *
+ *      in    "monetary"      out  "number"
+ *      in    "float_time"    out  "duration"   «8:30», not «8.5»
+ *      in    "jsonb"         out  "text"
+ */
+export declare function modelCellKind(type: string): ModelCellKind;
 /**
  * Las columnas declaradas, más una por cada campo del modelo que ninguna
  * contestaba.

package/dist/components/listing/modelColumns.js

@@ -1,5 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { fieldLabel } from "../search/model.js";
+import { ModelCell } from "./modelCells.js";
+import { fieldLabel, isNumericType, } from "../search/model.js";
+import { formatDuration } from "../../primitives/field/duration.js";
 /** Los campos que las columnas declaradas ya contestan.
  *
  *      in            [{id:"rows", field:"row_count"}, {id:"name"}]
@@ -38,14 +40,45 @@ export function readModelValue(raw) {
         return raw === "" ? null : raw;
     return JSON.stringify(raw);
 }
+/** The names an engine publishes for each kind it knows how to draw — Odoo's (`char` with a
+ *  widget aside, `float_time`, `boolean`, `date`, `datetime`) and the plain ones a schema
+ *  uses (`email`, `url`, `phone`, `duration`, `bool`, `timestamp`). */
+const KIND_OF_TYPE = {
+    email: "email",
+    mail: "email",
+    url: "url",
+    uri: "url",
+    website: "url",
+    phone: "phone",
+    tel: "phone",
+    float_time: "duration",
+    duration: "duration",
+    boolean: "boolean",
+    bool: "boolean",
+    date: "date",
+    datetime: "datetime",
+    timestamp: "datetime",
+};
+/** How a field of the model is drawn, by its `type` and in any case — «Email» and `email` are
+ *  the same field. A type not known here stays `text`, exactly as before.
+ *
+ *      in    "monetary"      out  "number"
+ *      in    "float_time"    out  "duration"   «8:30», not «8.5»
+ *      in    "jsonb"         out  "text"
+ */
+export function modelCellKind(type) {
+    if (isNumericType(type))
+        return "number";
+    return KIND_OF_TYPE[type.toLowerCase()] ?? "text";
+}
 /** Cuánto ancho merece un campo, por su tipo. Una huella son 64 caracteres y
  *  una cuenta son seis: darles el mismo ancho arruina las dos. */
-function widthFor(type) {
-    if (type === "integer" || type === "number")
+function widthFor(kind) {
+    if (kind === "number" || kind === "duration")
         return 120;
-    if (type === "datetime" || type === "date")
+    if (kind === "datetime" || kind === "date")
         return 190;
-    if (type === "boolean")
+    if (kind === "boolean")
         return 90;
     return 260;
 }
@@ -76,27 +109,39 @@ export function columnsFromModel(declared, model, locale = "default") {
     for (const [field, definition] of Object.entries(model.fields)) {
         if (claimed.has(field))
             continue;
-        const numeric = definition.type === "integer" || definition.type === "number";
+        const kind = modelCellKind(definition.type);
+        /* A duration is a number of hours: it sorts, sums and aligns as one. */
+        const numeric = kind === "number" || kind === "duration";
+        const read = (row) => readModelValue(row[field]);
         extra.push({
             id: field,
             field,
             header: fieldLabel(model, field, locale),
-            value: (row) => readModelValue(row[field]),
-            /* El valor entero en el `title`: una huella de 64 caracteres no entra en
-               ninguna celda, y cortada no sirve para nada — salvo para pasar el mouse
-               por encima y leerla. */
+            value: read,
+            /* Drawn by what the model says the field IS (`modelCells.tsx`); a plain text keeps
+               its whole value in the `title` — a 64 character fingerprint fits no cell. */
             cell: (row) => {
-                const value = readModelValue(row[field]);
+                const value = read(row);
                 if (value === null)
                     return _jsx("span", { className: "text-subtle", children: "\u2014" });
-                const text = String(value);
-                return (_jsx("span", { className: "block truncate text-muted", title: text, children: text }));
+                return _jsx(ModelCell, { kind: kind, value: value });
             },
+            /* Where a node cannot be drawn — the sheet, the footer's total — a duration still
+               reads «42:30» and never «42.5». */
+            ...(kind === "duration"
+                ? {
+                    format: formatDuration,
+                    text: (row) => {
+                        const value = read(row);
+                        return typeof value === "number" ? formatDuration(value) : String(value ?? "");
+                    },
+                }
+                : {}),
             ...(numeric ? { numeric: true } : {}),
             sortable: definition.sortable,
             optional: true,
             defaultHidden: true,
-            width: widthFor(definition.type),
+            width: widthFor(kind),
         });
     }
     return [...declared, ...extra];

package/dist/components/search/index.d.ts

@@ -5,6 +5,6 @@ export { formatJson, JsonEditor } from "./JsonEditor.js";
 export { SearchBar, type SearchBarProps, type SearchFacet, } from "./SearchBar.js";
 export { at, criteriaId, type CriteriaJoin, type CriteriaPath, filterCriteria, filtersOf, type GroupCriteria, groupCriteria, groupsOf, hasNamed, levelsOf, nextJoin, removeAt, replaceAt, type SearchCriteria, toggleNamed, whereOf, withLevels, } from "./criteria.js";
 export { CriteriaChips, type CriteriaChipsProps, } from "./CriteriaChips.js";
-export { type FieldDefinition, fieldLabel, filterableNames, isFilterable, type ModelDefinition, type ModelTranslations, } from "./model.js";
+export { type FieldDefinition, fieldLabel, filterableNames, isFilterable, isNumericType, type ModelDefinition, type ModelTranslations, } from "./model.js";
 export { answers, defaultOp, describeCondition, globToLike, opLabel, type QueryDraft, type QueryField, queryFields, type QueryKind, type QuerySuggestion, readTyped, suggest, type TypedValue, valueFor, type ValueShape, withoutValue, } from "./query.js";
 export { type DatePeriod, datePeriodGroup, datePeriodOptions, type DateRange, periodId, readPeriodId, recentMonths, recentYears, resolvePeriods, } from "./datePeriods.js";

package/dist/components/search/index.js

@@ -12,7 +12,7 @@ export { CriteriaChips, } from "./CriteriaChips.js";
 /* EL VOCABULARIO DEL MODELO — lo que el servidor publica sobre sus campos. Lo
    hablan el constructor de filtros, el de criterias y la barra de búsqueda, así
    que vive aparte de los tres. */
-export { fieldLabel, filterableNames, isFilterable, } from "./model.js";
+export { fieldLabel, filterableNames, isFilterable, isNumericType, } from "./model.js";
 /* LA GRAMÁTICA DE LA BARRA: qué se puede preguntar sobre un modelo, y con qué.
    Tres pasos —campo, operador, valor— que se pueden escribir en uno. */
 export { answers, defaultOp, describeCondition, globToLike, opLabel, queryFields, readTyped, suggest, valueFor, withoutValue, } from "./query.js";

package/dist/components/search/model.d.ts

@@ -23,6 +23,7 @@ export interface FieldDefinition {
     /** Los valores que un campo de enum puede tomar — de ahí sale un `<select>`. */
     choices?: readonly unknown[];
 }
+export declare function isNumericType(type: string): boolean;
 /** Si este campo se puede usar en un `where`, un `order` o un `grouping.by` directamente.
  *  `ops.length === 0` alcanza como señal: la publican tanto `embedded` como los tres
  *  relacionales, así que no hace falta mirar `kind` aparte. */

package/dist/components/search/model.js

@@ -13,6 +13,13 @@
  *  para saber cómo se llama un operador. Un vocabulario compartido no puede
  *  colgar de uno de los que lo hablan.
  * ==================================================================== */
+/** The types an engine publishes for an AMOUNT — integer, float, decimal, money. A search
+ *  compares them as numbers and a listing aligns and formats them as numbers: «monetary»
+ *  read as text made «total <= 1000» impossible and drew «1234.5» flush left. */
+const NUMERIC_TYPES = new Set(["integer", "number", "float", "decimal", "monetary", "money"]);
+export function isNumericType(type) {
+    return NUMERIC_TYPES.has(type.toLowerCase());
+}
 /** Si este campo se puede usar en un `where`, un `order` o un `grouping.by` directamente.
  *  `ops.length === 0` alcanza como señal: la publican tanto `embedded` como los tres
  *  relacionales, así que no hace falta mirar `kind` aparte. */

package/dist/components/search/query.js

@@ -1,4 +1,4 @@
-import { fieldLabel, isFilterable, } from "./model.js";
+import { fieldLabel, isFilterable, isNumericType, } from "./model.js";
 import { currentCopy, fillCopy } from "../../foundations/copy.js";
 /**
  * Las palabras que, después del numeral, abren un GRUPO en vez de nombrar un
@@ -97,7 +97,6 @@ export function readTyped(text) {
 export function globToLike(value) {
     return value.replace(/\*/g, "%");
 }
-const NUMERIC = new Set(["integer", "number", "float", "decimal", "monetary", "money"]);
 /** Qué clase de valor es un campo, leída del tipo que publica el modelo. */
 function kindOf(definition) {
     if (definition.kind === "relation")
@@ -107,7 +106,7 @@ function kindOf(definition) {
     const type = definition.type.toLowerCase();
     /* An amount is a number: «decimal» and «monetary» read as text made «total <= 1000»
        impossible to ask of an invoice. */
-    if (NUMERIC.has(type))
+    if (isNumericType(type))
         return "number";
     if (type === "date" || type === "datetime")
         return "date";

package/dist/foundations/copy.d.ts

@@ -122,6 +122,22 @@ export type UiCopy = {
         none: string;
         /** Next to the label of a field whose value changed and is not saved yet. */
         changed: string;
+        /** The eye button of a password: show it… */
+        showSecret: string;
+        /** …and hide it again. */
+        hideSecret: string;
+        /** Under a password while Caps Lock is on: the most common reason a right password fails. */
+        capsLock: string;
+        /** What a stored password says in read mode, for a screen reader: there is one, not which. */
+        secretSet: string;
+        /** Said after a link that leaves for another tab — a website, WhatsApp. */
+        newTab: string;
+        /** The unit after a duration: «8:30 h». */
+        hours: string;
+        /** The name of the unit (or currency) chooser inside a number field. */
+        unit: string;
+        /** The row of colours a colour field offers. */
+        palette: string;
     };
     /** The choice controls: combo boxes, selects, suggestion lists. */
     choice: {
@@ -343,6 +359,32 @@ export type UiCopy = {
         /** A field with nothing in it: said, not a silent success. */
         empty: string;
     };
+    /** The rich-text editor: its toolbar, its link form, its list of people to mention. */
+    richText: {
+        toolbar: string;
+        bold: string;
+        italic: string;
+        underline: string;
+        strike: string;
+        heading: string;
+        subheading: string;
+        bulletList: string;
+        orderedList: string;
+        quote: string;
+        link: string;
+        linkUrl: string;
+        applyLink: string;
+        removeLink: string;
+        /** Said when the address is not a website, an email or a phone: what to write instead. */
+        badLink: string;
+        table: string;
+        undo: string;
+        redo: string;
+        clear: string;
+        /** The list that opens on «@»: people to mention. */
+        mentions: string;
+        noMatches: string;
+    };
     /** Ordenar, cuando la presentación no tiene encabezados donde hacer clic. */
     sorting: {
         label: string;
@@ -350,6 +392,24 @@ export type UiCopy = {
         asc: string;
         desc: string;
         clear: string;
+        /** On a sortable header: how to add it as a tie-breaker instead of replacing the order. */
+        addHint: string;
+        /** What a tie-breaker header says of itself: «sort 2, descending». */
+        place: string;
+        /** Adds one more criterion at the end of the order. */
+        add: string;
+        /** Where the criteria are listed when there are none: the rows go as they came. */
+        none: string;
+        /** The direction button of a criterion, named by its field. */
+        flip: string;
+        /** Takes one criterion out, named by its field. */
+        remove: string;
+        /** The handle a criterion is dragged by, named by its field. */
+        move: string;
+        /** The trigger with more than one criterion: «Fecha +2». */
+        more: string;
+        /** The second and later criteria: they only decide between rows the first leaves equal. */
+        then: string;
     };
     /** Los recortes de fecha RELATIVOS. Las unidades van en singular y plural
      *  porque «1 mes» y «3 meses» no se resuelven con una `s` en todos los
@@ -470,6 +530,26 @@ export type UiCopy = {
         finish: string;
         busy: string;
     };
+    /** A multi-step operation done in one sitting (`StepFlow`): where you are, what is left,
+     *  and its own buttons. */
+    stepFlow: {
+        /** The accessible name of the strip of steps. */
+        steps: string;
+        /** Over the step's title: «Step 2 of 3». */
+        position: string;
+        /** Read by the live region on every move: `{position}` is the line above, `{title}`
+         *  the step's. */
+        announce: string;
+        /** The state of a step on the strip, said to a screen reader — never only a colour. */
+        done: string;
+        pending: string;
+        cancel: string;
+        back: string;
+        next: string;
+        finish: string;
+        /** Read by the live region while the operation runs. */
+        working: string;
+    };
     report: {
         open: string;
         close: string;
@@ -701,6 +781,28 @@ export type UiCopy = {
         /** The accessible name of an editable cell. `{column}` is the column's header. */
         editCell: string;
     };
+    /** The files of a record (`Attachments`): listing, adding, removing and their states. */
+    attachments: {
+        /** The accessible name of the list. */
+        label: string;
+        /** An empty list in read mode. */
+        empty: string;
+        /** The drop zone's sentence when there is no file yet… */
+        emptyAdd: string;
+        /** …and when there already are some. */
+        add: string;
+        download: string;
+        remove: string;
+        /** The notice after removing. `{name}` is the file. */
+        removed: string;
+        undo: string;
+        /** The name of an upload's progress bar. `{name}` is the file. */
+        uploading: string;
+        cancelUpload: string;
+        /** A failed upload, when the server did not say why. */
+        failed: string;
+        retry: string;
+    };
     /** The theme switch: the three choices an app offers for the palette. */
     theme: {
         /** The name of the control — what a screen reader says for the group. */
@@ -763,6 +865,35 @@ export type UiCopy = {
         /** A value that was empty before the change. */
         empty: string;
     };
+    /** The media controls: an image chosen and cropped (`ImageInput`), a signature drawn or
+     *  typed (`SignatureInput`). */
+    media: {
+        /** What the empty image zone says. */
+        dropImage: string;
+        chooseImage: string;
+        changeImage: string;
+        removeImage: string;
+        /** A file that is not an image: what to choose instead. */
+        notImage: string;
+        /** The name of the crop area, and how it is moved from the keyboard. */
+        crop: string;
+        cropHelp: string;
+        zoomIn: string;
+        zoomOut: string;
+        applyCrop: string;
+        cancel: string;
+        /** The name of the drawing pad, and what to do there. */
+        signaturePad: string;
+        signatureHelp: string;
+        clear: string;
+        /** The way in for whoever cannot draw: type the name, and it is written as the signature. */
+        typeName: string;
+        drawInstead: string;
+        /** The label of the box the name is typed in. */
+        typedName: string;
+        /** The image of a signature, when the form does not say whose it is. */
+        signature: string;
+    };
 };
 export declare const ENGLISH_COPY: UiCopy;
 /** What changes of web-ui's words, at any depth: `{ search: { joins: { any: "o" } } }`. */