@nxgt/material 3.101.0 → 3.104.0

package/dist/keypad.js

@@ -0,0 +1,551 @@
+import { t as e } from "./utils-BLfntITJ.js";
+import { t } from "./use-material-translation-xNzbSVgS.js";
+import { t as n } from "./live-status-BGPaN8r8.js";
+import { n as r, t as i } from "./use-calculator-keyboard-DysnFK8m.js";
+import { i as a, o, r as s, t as c } from "./key-layout-D2goCDkD.js";
+import { useCallback as l, useMemo as u, useRef as d, useState as f } from "react";
+import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
+import { currencyFractionDigits as g } from "@nxgt/material-core/currency-digits";
+import { EMPTY_SESSION as _, ZERO as v, announcement as y, compare as b, formatDecimal as x, formatExpression as S, localeSeparators as ee, parseDecimal as C, press as w, roundTo as T, toCanonical as E } from "@nxgt/material-core/calculator";
+import { billShortcuts as D, decimalToMinor as O, enterMinor as k, minorToDecimal as A, settle as te } from "@nxgt/material-core/calculator/pos";
+//#region lib/components/ui/widgets/keypad/keypad-entry.ts
+var j = {
+	add: "+",
+	subtract: "-",
+	multiply: "*",
+	divide: "/"
+}, M = [
+	"add",
+	"subtract",
+	"multiply",
+	"divide"
+];
+function N(e) {
+	return e === !0 ? M : e ? M.filter((t) => e.includes(t)) : [];
+}
+function P(e) {
+	return e.entry === "minor" || e.variant === "cash" ? [] : N(e.operations);
+}
+var F = (e) => j[e];
+function I(e) {
+	let t = C(e);
+	return t ? {
+		..._,
+		expression: E(t)
+	} : _;
+}
+function L(e) {
+	let t = C(e.justEvaluated && e.result ? e.result : e.expression);
+	return t ? E(t) : "";
+}
+var R = (e) => !e.justEvaluated && e.expression !== "" && C(e.expression) == null, ne = (e) => /\.(\d*)$/.exec(e)?.[1]?.length ?? 0;
+function z(e, t) {
+	if (t === void 0 || e.justEvaluated) return !1;
+	let n = C(e.expression);
+	return n != null && b(n, C(String(t)) ?? v) > 0;
+}
+var re = (e, t) => O(C(L(e)) ?? v, t);
+function ie(e, t, n, r) {
+	if (!/^(?:\d|00|backspace|C|CE)$/.test(t)) return e;
+	let i = t === "C" || t === "CE" ? "clear" : t, a = k(re(e, r), i), o = {
+		..._,
+		expression: a === 0n ? "" : E(A(a, r))
+	};
+	return z(o, n.max) ? e : o;
+}
+function ae(e, t, n) {
+	if (n.entry === "minor") return ie(e, t, n, n.digits ?? 2);
+	if (t === "." && n.digits === 0) return e;
+	let r = Object.keys(j).find((e) => j[e] === t);
+	if (r && !n.operations.includes(r) || !r && !/^(?:\d|00|\.|=|backspace|C|CE)$/.test(t)) return e;
+	let i = r && e.justEvaluated && e.result ? {
+		...I(e.result),
+		ans: e.ans,
+		memory: e.memory
+	} : e, a = w(i, t);
+	if (a === i || n.digits !== void 0 && ne(a.expression) > n.digits || z(a, n.max)) return e;
+	let o = a.justEvaluated ? C(a.result) : void 0;
+	if (o && n.digits !== void 0) {
+		let e = E(T(o, n.digits, "half-up"));
+		return {
+			...a,
+			result: e,
+			ans: e
+		};
+	}
+	return a;
+}
+function B(e, t, n) {
+	let r = C(e);
+	if (!r) return "";
+	let i = t === void 0 ? void 0 : C(String(t)), a = n === void 0 ? void 0 : C(String(n));
+	return i && b(r, i) < 0 && (r = i), a && b(r, a) > 0 && (r = a), E(r);
+}
+function V(e, t) {
+	if (R(e)) return;
+	let n = L(e);
+	return n === t ? void 0 : n;
+}
+//#endregion
+//#region lib/components/ui/widgets/keypad/keypad-binding.ts
+var H = 2;
+function U(e) {
+	return e.currency ? g(e.currency, e.fractionDigits) : e.fractionDigits ?? (e.minorUnits ? H : void 0);
+}
+function W(e, t) {
+	if (e == null || !Number.isFinite(e)) return "";
+	if (t.minorUnits) return E(A(BigInt(Math.trunc(e)), t.digits ?? H));
+	let n = C(String(e));
+	return n ? E(n) : "";
+}
+function G(e, t) {
+	let n = C(e);
+	return n ? t.minorUnits ? Number(O(n, t.digits ?? H)) : Number(E(t.digits === void 0 ? n : T(n, t.digits, "half-up"))) : null;
+}
+var K = (e, t, n) => e === void 0 || !t.minorUnits ? e : Number(W(e, {
+	minorUnits: !0,
+	digits: n
+}));
+function q(e) {
+	let t = U(e);
+	return {
+		value: W(e.value, {
+			minorUnits: e.minorUnits,
+			digits: t
+		}),
+		onValueChange: (n) => e.onChange?.(G(n, {
+			minorUnits: e.minorUnits,
+			digits: t
+		})),
+		fractionDigits: t,
+		min: K(e.min, e, t),
+		max: K(e.max, e, t)
+	};
+}
+function oe(e) {
+	let t = e.binding;
+	if (!t) return e;
+	let { onValueChange: n } = e;
+	return {
+		...e,
+		value: e.value ?? t.value,
+		fractionDigits: e.fractionDigits ?? t.fractionDigits,
+		min: e.min ?? t.min,
+		max: e.max ?? t.max,
+		display: e.display ?? P(e).length > 0,
+		onValueChange: (e) => {
+			t.onValueChange(e), n?.(e);
+		}
+	};
+}
+//#endregion
+//#region lib/components/ui/widgets/keypad/keypad-display.tsx
+function J(e, t, n) {
+	let r = C(e);
+	return r ? x(r, {
+		locale: n,
+		fractionDigits: t ?? 2
+	}) : e;
+}
+function se(e, t, n, r, i) {
+	if (t === "minor") return C(e || "0") ? J(e || "0", n, r) : "";
+	let a = S(e, { locale: r });
+	return i ? X(a || "0", i, r) : a;
+}
+function Y(e, t, n, r) {
+	let i = J(e, t, n);
+	return r ? X(i, r, n) : i;
+}
+function X(e, t, n) {
+	let r = [];
+	try {
+		r = new Intl.NumberFormat(n, {
+			style: "currency",
+			currency: t
+		}).formatToParts(-1234.5);
+	} catch {}
+	let i = r.findIndex((e) => e.type === "currency"), a = i >= 0 && i < r.findIndex((e) => e.type === "integer"), o = r[i]?.value ?? t, s = r[a ? i + 1 : i - 1], c = i < 0 ? "\xA0" : s?.type === "literal" ? s.value : "", l = r.findIndex((e) => e.type === "minusSign");
+	return a && /^[-\u2212]/u.test(e) && (l < 0 || l < i) ? `${e[0]}${o}${c}${e.slice(1)}` : a ? `${o}${c}${e}` : `${e}${c}${o}`;
+}
+function ce({ keypad: e, locale: t, currency: n }) {
+	let r = se(e.session.justEvaluated && e.value ? e.value : e.session.expression, e.entry, e.digits, t, n);
+	return /* @__PURE__ */ m("output", {
+		"data-slot": "keypad-display",
+		"data-kind": e.session.error ? "error" : void 0,
+		"aria-live": "off",
+		dir: "ltr",
+		className: "nxgt-keypad-display bg-muted",
+		children: r || "\xA0"
+	});
+}
+//#endregion
+//#region lib/components/ui/widgets/keypad/keypad-cash.tsx
+function le({ total: e, settlement: n, digits: r, locale: i, currency: a }) {
+	let { t: o } = t(), s = (e) => Y(e, r, i, a);
+	return /* @__PURE__ */ h("dl", {
+		"data-slot": "keypad-cash-summary",
+		className: "nxgt-keypad-cash",
+		children: [/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("dt", { children: o("material.keypad.total", "Total") }), /* @__PURE__ */ m("dd", {
+			"data-slot": "keypad-total",
+			children: s(e)
+		})] }), n ? /* @__PURE__ */ h("div", {
+			"data-status": n.status,
+			children: [/* @__PURE__ */ m("dt", { children: n.status === "paid" ? o("material.keypad.change-label", "Change") : o("material.keypad.due-label", "Still due") }), /* @__PURE__ */ m("dd", {
+				"data-slot": "keypad-settlement",
+				children: s(n.status === "paid" ? n.change : n.due)
+			})]
+		}) : null]
+	});
+}
+function ue({ amounts: e, onPick: n, disabled: r, digits: i, locale: a, currency: o }) {
+	let { t: s } = t();
+	return e.length === 0 ? null : /* @__PURE__ */ m("div", {
+		role: "group",
+		"aria-label": s("material.keypad.shortcuts", "Quick amounts"),
+		"data-slot": "keypad-shortcuts",
+		className: "nxgt-keypad-shortcuts",
+		children: e.map((e) => {
+			let t = Y(e, i, a, o);
+			return /* @__PURE__ */ m("button", {
+				type: "button",
+				"aria-disabled": r ? !0 : void 0,
+				"aria-label": s("material.keypad.amount", "Amount {amount}", { amount: t }),
+				onClick: () => !r && n(e),
+				children: /* @__PURE__ */ m("span", {
+					"aria-hidden": "true",
+					children: t
+				})
+			}, e);
+		})
+	});
+}
+function de({ cash: e, total: t, onPick: n, disabled: r, digits: i, locale: a, currency: o }) {
+	let s = {
+		digits: i,
+		locale: a,
+		currency: o
+	};
+	return /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(le, {
+		...s,
+		total: t,
+		settlement: e.settlement
+	}), /* @__PURE__ */ m(ue, {
+		...s,
+		amounts: e.shortcuts,
+		onPick: n,
+		disabled: r
+	})] });
+}
+//#endregion
+//#region lib/components/ui/widgets/keypad/keypad-layout.ts
+var fe = {
+	add: [
+		"+",
+		"+",
+		"Plus"
+	],
+	subtract: [
+		"-",
+		"−",
+		"Minus"
+	],
+	multiply: [
+		"*",
+		"×",
+		"Times"
+	],
+	divide: [
+		"/",
+		"÷",
+		"Divided by"
+	]
+};
+function pe(e) {
+	let t = e.pending ? s("commit", "=", "=", "equals", "equals", "Equals") : {
+		id: "commit",
+		key: "=",
+		glyph: e.commitLabel ?? "✓",
+		role: "equals",
+		name: e.cash ? {
+			key: "material.keypad.tender",
+			fallback: "Tender"
+		} : {
+			key: "material.keypad.commit",
+			fallback: "Enter"
+		},
+		label: e.commitLabel
+	}, n = e.operations.map((e) => {
+		let [t, n, r] = fe[e];
+		return s(e, t, n, "operator", e, r);
+	}), r = [];
+	if (n.length > 0) {
+		let e = 12 / n.length;
+		r.push(n.map((t) => ({
+			...t,
+			span: e
+		})));
+	}
+	return r.push(o([
+		c(7),
+		c(8),
+		c(9),
+		s("clear", "C", "C", "utility", "clear", "Clear all")
+	]), o([
+		c(4),
+		c(5),
+		c(6),
+		s("backspace", "backspace", "⌫", "utility", "backspace", "Delete last character")
+	]), o([
+		c(1),
+		c(2),
+		c(3),
+		s("double-zero", "00", "00", "digit", "double-zero", "00, double zero")
+	]), e.decimal ? [
+		{
+			...c(0),
+			span: 6
+		},
+		{
+			...s("decimal", ".", ".", "digit", "decimal", "Decimal separator"),
+			span: 3
+		},
+		{
+			...t,
+			span: 3
+		}
+	] : [{
+		...c(0),
+		span: 9
+	}, {
+		...t,
+		span: 3
+	}]), {
+		columns: 12,
+		rows: r
+	};
+}
+//#endregion
+//#region lib/components/ui/widgets/keypad/cash-model.ts
+function Z(e, t) {
+	if (e === void 0) return;
+	let n = C(String(e));
+	if (n) return E(t === void 0 ? n : T(n, t, "half-up"));
+}
+function Q(e, t) {
+	if (!(e === void 0 || t === "")) try {
+		let n = te(e, t);
+		return n.status === "paid" ? {
+			status: "paid",
+			change: E(n.change)
+		} : {
+			status: "short",
+			due: E(n.due)
+		};
+	} catch {
+		return;
+	}
+}
+function $(e, t, n, r, i = 4) {
+	if (e === void 0 || C(String(e)) == null) return [];
+	try {
+		let a = n === void 0 ? void 0 : C(String(n)), o = D(e, t ?? [], { limit: i - 1 }).map((e) => r === void 0 ? e : T(e, r, "half-up")).filter((e) => !a || b(e, a) <= 0).map(E);
+		return [...new Set(o)];
+	} catch {
+		return [];
+	}
+}
+//#endregion
+//#region lib/components/ui/widgets/keypad/use-keypad-value.ts
+function me(e, t) {
+	let [n, r] = f(() => I(e.value ?? e.defaultValue ?? "")), i = d("");
+	if (R(n) || (i.current = L(n)), e.value !== void 0) {
+		let t = L(I(e.value));
+		t !== i.current && (i.current = t, r(I(e.value)));
+	}
+	return {
+		session: n,
+		setInner: r,
+		report: l((e) => {
+			let n = V(e, i.current);
+			n !== void 0 && (i.current = n, t.current?.(n));
+		}, [t])
+	};
+}
+//#endregion
+//#region lib/components/ui/widgets/keypad/use-keypad.ts
+function he(e) {
+	let t = e.entry ?? "decimal", n = e.currency ? g(e.currency, e.fractionDigits) : e.fractionDigits, r = P(e), i = d(e.onValueChange);
+	i.current = e.onValueChange;
+	let { session: a, setInner: o, report: s } = me(e, i), c = {
+		entry: t,
+		digits: n,
+		operations: r,
+		max: e.max
+	}, u = d({
+		session: a,
+		o: e,
+		config: c
+	});
+	u.current = {
+		session: a,
+		o: e,
+		config: c
+	};
+	let f = l((e) => {
+		let { session: t, o: n, config: r } = u.current;
+		if (n.disabled) return;
+		let i = ae(t, e, r);
+		i !== t && (o(i), s(i));
+	}, [s, o]), p = l(() => {
+		let { session: e, o: t, config: n } = u.current;
+		if (t.disabled) return;
+		if (R(e)) return f("=");
+		let r = L(e);
+		if (r === "") return;
+		let i = B(r, t.min, t.max);
+		if (i !== r) {
+			let e = I(i);
+			o(e), s(e);
+		}
+		if (t.variant === "cash") {
+			let e = Q(Z(t.total, n.digits), i);
+			e && t.onTender?.(i, e);
+			return;
+		}
+		t.onCommit?.(i, e.expression);
+	}, [
+		f,
+		s,
+		o
+	]), m = l((e) => {
+		let { o: t } = u.current;
+		if (t.disabled) return;
+		let n = I(B(e, void 0, t.max));
+		o(n), s(n);
+	}, [s, o]);
+	return {
+		session: a,
+		value: L(a),
+		pending: R(a),
+		digits: n,
+		entry: t,
+		operations: r,
+		press: f,
+		commit: p,
+		set: m
+	};
+}
+//#endregion
+//#region lib/components/ui/widgets/keypad/use-keypad-cash.ts
+function ge(e, n) {
+	let { t: r } = t(), i = e.variant === "cash", a = i ? Z(e.total, n.digits) : void 0, o = i ? Q(a, n.value) : void 0, s = u(() => i ? $(a, e.denominations, e.max, n.digits) : [], [
+		i,
+		a,
+		e.denominations,
+		e.max,
+		n.digits
+	]), c;
+	if (o) {
+		let t = (t) => Y(t, n.digits, e.locale, e.currency);
+		c = o.status === "paid" ? r("material.keypad.change", "Change {amount}", { amount: t(o.change) }) : r("material.keypad.due", "Still due {amount}", { amount: t(o.due) });
+	}
+	return {
+		cash: i,
+		total: a,
+		settlement: o,
+		shortcuts: s,
+		said: c
+	};
+}
+//#endregion
+//#region lib/components/ui/widgets/keypad/use-keypad-keyboard.ts
+function _e(e, t, n) {
+	return i({
+		locale: t,
+		global: n,
+		accepts: (t) => /^(?:\d|00|\.|=|backspace|C|CE)$/.test(t) || e.operations.some((e) => F(e) === t),
+		onKey: (t) => t === "=" ? e.commit() : e.press(t),
+		onCopy: () => {}
+	});
+}
+//#endregion
+//#region lib/components/ui/widgets/keypad/keypad.tsx
+function ve(i) {
+	let o = oe(i), { locale: s, currency: c, commitLabel: l, disabled: d, keyboard: f = "focus", size: p = "comfortable", display: g = !0, label: _, className: v } = o, { t: b } = t(), x = he(o), S = ge(o, x), C = u(() => pe({
+		operations: x.operations,
+		decimal: x.entry === "decimal" && x.digits !== 0,
+		commitLabel: l,
+		pending: x.pending,
+		cash: S.cash
+	}), [
+		x.operations,
+		x.entry,
+		x.digits,
+		l,
+		x.pending,
+		S.cash
+	]), w = _e(x, s, f === "global"), T = y(x.session, s);
+	return /* @__PURE__ */ m("div", {
+		"data-slot": "keypad",
+		"data-size": p,
+		"data-disabled": d ? "" : void 0,
+		className: e("nxgt-calc nxgt-keypad", v),
+		onKeyDown: f === "focus" ? w : void 0,
+		children: /* @__PURE__ */ h("div", {
+			className: "nxgt-calc-body nxgt-keypad-body",
+			children: [
+				g ? /* @__PURE__ */ m(ce, {
+					keypad: x,
+					locale: s,
+					currency: c
+				}) : null,
+				S.cash ? /* @__PURE__ */ m(de, {
+					cash: S,
+					total: S.total ?? "0",
+					onPick: x.set,
+					disabled: d,
+					digits: x.digits,
+					locale: s,
+					currency: c
+				}) : null,
+				/* @__PURE__ */ m(r, {
+					layout: C,
+					label: _ ?? b("material.calculator.keypad", "Keypad"),
+					decimal: ee(s).decimal,
+					unavailable: () => d === !0,
+					onPress: (e) => {
+						if (e.id === "commit") x.commit();
+						else for (let t of a(e)) x.press(t);
+					},
+					slot: "keypad-keys",
+					keySlot: "keypad-key",
+					className: "nxgt-calc-keys nxgt-keypad-keys"
+				}),
+				/* @__PURE__ */ m(n, {
+					slot: "keypad-status",
+					children: S.said ?? (T ? b(T.key, T.fallback, T.values) : null)
+				})
+			]
+		})
+	});
+}
+//#endregion
+//#region lib/components/ui/widgets/keypad/use-keypad-number.ts
+function ye(e) {
+	return q(e);
+}
+//#endregion
+//#region lib/components/ui/widgets/keypad/use-keypad-quantity.ts
+function be(e) {
+	let { value: t, onChange: n } = e;
+	return q({
+		...e,
+		value: t?.value,
+		onChange: (e) => n?.({
+			value: e,
+			unit: t?.unit ?? ""
+		})
+	});
+}
+//#endregion
+export { ve as Keypad, ye as useKeypadNumber, be as useKeypadQuantity };

package/dist/label-DR-zZyGQ.js

@@ -0,0 +1,47 @@
+import { t as e } from "./utils-BLfntITJ.js";
+import { i as t } from "./dist-DWZXlCZR.js";
+import * as n from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region ../../node_modules/@radix-ui/react-label/dist/index.mjs
+var a = Object.defineProperty, o = /* @__PURE__ */ n.forwardRef(/* @__PURE__ */ ((e, t) => a(e, "name", {
+	value: t,
+	configurable: !0
+}))(function(e, n) {
+	return /* @__PURE__ */ r(t.label, {
+		...e,
+		ref: n,
+		onMouseDown: (t) => {
+			t.target.closest("button, input, select, textarea") || (e.onMouseDown?.(t), !t.defaultPrevented && t.detail > 1 && t.preventDefault());
+		}
+	});
+}, "Label"));
+//#endregion
+//#region lib/components/ui/primitives/label/label.tsx
+function s() {
+	return /* @__PURE__ */ r("svg", {
+		"data-slot": "label-required-mark",
+		"aria-hidden": "true",
+		focusable: "false",
+		viewBox: "0 0 10 10",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "1.75",
+		strokeLinecap: "round",
+		children: /* @__PURE__ */ r("path", { d: "M5 1v8M1.5 3l7 4M8.5 3l-7 4" })
+	});
+}
+function c({ className: t, withAsterisk: n, ...a }) {
+	return /* @__PURE__ */ r(o, {
+		"data-slot": "label",
+		className: e("flex items-center ps-0.5 gap-2 text-sm leading-5 -my-[3px] empty:my-0 font-semibold select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50", t),
+		...a,
+		children: n ? /* @__PURE__ */ i("span", {
+			"data-slot": "label-text",
+			"data-required": "",
+			className: "inline-flex",
+			children: [a.children, /* @__PURE__ */ r(s, {})]
+		}) : a.children
+	});
+}
+//#endregion
+export { c as t };

package/dist/lib/components/ui/actions/index.d.ts

@@ -10,6 +10,7 @@ export * from './language-switcher/index.js';
 export * from './link/index.js';
 export * from './load-more-button/index.js';
 export * from './load-more-footer/index.js';
+export * from './product-tile/index.js';
 export * from './responsive-button/index.js';
 export * from './scroll-to-latest-button/index.js';
 export * from './scroll-to-top/index.js';

package/dist/lib/components/ui/actions/product-tile/index.d.ts

@@ -0,0 +1 @@
+export * from './product-tile.js';

package/dist/lib/components/ui/actions/product-tile/product-tile-link.d.ts

@@ -0,0 +1,16 @@
+import { MouseEvent } from 'react';
+/**
+ * The props `ProductTile` puts on its child with `asChild`. A disabled tile
+ * leaves the Tab order and cancels the click (so Enter on a link does not
+ * follow it) and never calls the caller's `onClick`, as a disabled button.
+ */
+export declare function productTileLinkProps(disabled: boolean | undefined, selected: boolean, onClick: ((e: MouseEvent<HTMLButtonElement>) => void) | undefined): {
+    tabIndex: number;
+    onClick: (e: MouseEvent<HTMLElement>) => void;
+    'aria-disabled': true | undefined;
+    'aria-current': "true" | undefined;
+} | {
+    onClick: ((e: MouseEvent<HTMLButtonElement>) => void) | undefined;
+    'aria-disabled': true | undefined;
+    'aria-current': "true" | undefined;
+};

package/dist/lib/components/ui/actions/product-tile/product-tile.d.ts

@@ -0,0 +1,41 @@
+import { ShapeName } from '@nxgt/material-core/shapes';
+import { ComponentProps, ReactNode } from 'react';
+import { IconName } from '../../primitives/icon/icon.js';
+import { Tone } from '../../tones.js';
+export type ProductTileProps = Omit<ComponentProps<'button'>, 'title'> & {
+    /** The item's name: the first line, up to two lines long. */
+    title: ReactNode;
+    /** The price, large and tabular. A `ReactNode`: format it with the app's locale. */
+    price?: ReactNode;
+    /** The stock state on its own line under the price (a `Badge`, a text). */
+    status?: ReactNode;
+    /**
+     * The item's photo (a URL, a square one fits best): shown in a square box
+     * on a soft surface, lazy loaded, with an empty `alt` since the title
+     * names the tile. If it fails to load, the toned `icon` shape takes its
+     * place.
+     */
+    image?: string;
+    /** How the photo fills its box: `contain` (default, a transparent PNG or a white-background packshot) or `cover` (a full-bleed photo). */
+    imageFit?: 'contain' | 'cover';
+    /** Without an `image` (or when it fails), a toned shape with this icon. */
+    icon?: IconName;
+    /** Any other media in place of the box (a `Shape` of your own); replaces `image` and `icon`. */
+    media?: ReactNode;
+    /** The tone of the shape behind `icon`, `primary` by default. */
+    tone?: Tone;
+    /** The expressive shape behind the icon, `squircle` by default. */
+    shape?: ShapeName;
+    /** The item is in the basket or chosen: `aria-pressed`, a tint and a bar at the start. */
+    selected?: boolean;
+    /** Render the tile inside the one child element (a router `Link`, an `<a>`) instead of a `button`: pass it as `children`, empty. */
+    asChild?: boolean;
+};
+/**
+ * A large, even tap tile for a point-of-sale or kiosk catalogue: a picture or
+ * a toned shape with an icon, the item's name, a prominent price and a stock
+ * state on its own line. The tile is one button whose name is its text (title,
+ * price, status); at least 44 px high, and as tall as
+ * its row in a `ResponsiveGrid`. `disabled` dims it and stops taps (with `asChild`, the child gets `aria-disabled`, `tabIndex={-1}` and a click handler that cancels navigation, and no pointer events).
+ */
+export declare function ProductTile({ title, price, status, image, imageFit, icon, media, tone, shape, selected, asChild, disabled, className, children, onClick, ...props }: ProductTileProps): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-table/data-table-density.d.ts

@@ -1,6 +1,6 @@
 /** The `<table>`'s classes: the gap between rows (4px, 8px from `md`) that
  * `compact` shrinks to 2px. */
-export declare const TABLE_DENSITY_CLASS = "border-separate border-spacing-y-1 md:border-spacing-y-2 data-[density=compact]:border-spacing-y-0.5 md:data-[density=compact]:border-spacing-y-0.5";
+export declare const TABLE_DENSITY_CLASS = "border-separate border-spacing-y-(--row-gap) [--row-gap:calc(var(--spacing)*1)] md:[--row-gap:calc(var(--spacing)*2)] data-[density=compact]:[--row-gap:calc(var(--spacing)*0.5)] md:data-[density=compact]:[--row-gap:calc(var(--spacing)*0.5)]";
 /** A body cell: 8px of padding, 4px above and below when compact (the sides
  * stay 8px, aligned with the header, and a checkbox cell keeps its `pr-0`). */
 export declare const CELL_DENSITY_CLASS = "[table[data-density=compact]>tbody>tr>&]:py-1";

package/dist/lib/components/ui/collections/data-table/partials/data-table-scroll-region.d.ts

@@ -9,9 +9,12 @@ import { ReactNode } from 'react';
  * not a size container, which would collapse it inside a content-sized parent
  * (`w-fit`, `inline-flex`, an `auto` grid track, a popover).
  */
-export declare function DataTableScrollRegion({ label, maxHeight, virtual, children, }: {
+export declare function DataTableScrollRegion({ label, maxHeight, maxHeightClassName, virtual, children, }: {
     label: string;
     maxHeight?: number | string;
+    /** A class that caps the height; no inline style, and `maxHeight` is
+     * ignored. */
+    maxHeightClassName?: string;
     /** Virtual rows: no scroll anchoring, which would move the scroll when
      * the spacers above the rows change height. */
     virtual?: boolean;