@stll/workspace-ui 0.2.1 → 0.3.0

package/dist/conditions/builder.d.ts

@@ -42,6 +42,12 @@ type ConditionCapabilities = {
   fields: FieldOption[];
   /** Allow nested groups (the "+ Add group" affordance + bordered subgroups). */
   allowNesting?: boolean;
+  /**
+   * How many children the caller's backend accepts in one group. The add
+   * affordances are disabled at the cap, so a tree cannot be edited into a
+   * shape the server would reject. Omitted means no cap.
+   */
+  maxChildren?: number | undefined;
   /** Offer a "ƒ Calculated value…" item that switches a leaf's left operand to
    *  a formula edited via `FormulaCell`. */
   allowFormula?: boolean;

package/dist/conditions/builder.js

@@ -41,8 +41,10 @@ const ConditionBuilder = ({ value, onChange, capabilities, labels, locale }) =>
 const ConditionBuilderTree = ({ value, onChange, capabilities }) => {
 	const labels = useLabels();
 	const group = asGroup(value);
-	const { fields, allowNesting = false } = capabilities;
+	const { fields, allowNesting = false, maxChildren } = capabilities;
 	const firstField = fields.at(0);
+	const atChildCap = maxChildren !== void 0 && group.children.length >= maxChildren;
+	const canAdd = firstField !== void 0 && !atChildCap;
 	return /* @__PURE__ */ jsxs("div", {
 		className: "flex flex-col gap-2",
 		children: [/* @__PURE__ */ jsx("div", {
@@ -77,9 +79,9 @@ const ConditionBuilderTree = ({ value, onChange, capabilities }) => {
 			className: "ms-[5.375rem] flex flex-wrap gap-1",
 			children: [/* @__PURE__ */ jsxs(Button, {
 				className: "w-fit justify-start",
-				disabled: !firstField,
+				disabled: !canAdd,
 				onClick: () => {
-					if (firstField) onChange(appendChild(group, leafFromField(firstField)));
+					if (firstField && !atChildCap) onChange(appendChild(group, leafFromField(firstField)));
 				},
 				size: "xs",
 				type: "button",
@@ -87,9 +89,9 @@ const ConditionBuilderTree = ({ value, onChange, capabilities }) => {
 				children: [/* @__PURE__ */ jsx(PlusIcon, {}), labels.addCondition]
 			}), allowNesting && /* @__PURE__ */ jsxs(Button, {
 				className: "w-fit justify-start",
-				disabled: !firstField,
+				disabled: !canAdd,
 				onClick: () => {
-					if (firstField) onChange(appendChild(group, {
+					if (firstField && !atChildCap) onChange(appendChild(group, {
 						type: "group",
 						combinator: "and",
 						children: [leafFromField(firstField)]

package/dist/sorts.d.ts

@@ -22,6 +22,12 @@ type SortChipsProps = {
   properties: readonly SortableProperty[];
   onUpdate: (sorts: SortDescriptor[]) => void;
   labels: SortChipsLabels;
+  /**
+   * How many sorts the caller's backend accepts. The add-sort trigger is
+   * disabled at the cap, so a view cannot be edited into a layout the server
+   * would reject. Omitted means no cap.
+   */
+  maxSorts?: number | undefined;
 };
 /**
  * The view's sorts as chips, plus the menu that adds one.
@@ -30,7 +36,7 @@ type SortChipsProps = {
  * the caller's answer, so this reads nothing but the three fields a chip
  * draws.
  */
-declare const SortChips: ({ sorts, properties, onUpdate, labels }: SortChipsProps) => import("react").JSX.Element;
+declare const SortChips: ({ sorts, properties, onUpdate, labels, maxSorts }: SortChipsProps) => import("react").JSX.Element;
 /**
  * What ascending means depends on what is being sorted: A→Z for words, 1→9 for
  * numbers, an arrow for dates. A type with no idiom falls back to the arrow

package/dist/sorts.js

@@ -11,7 +11,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 * the caller's answer, so this reads nothing but the three fields a chip
 * draws.
 */
-const SortChips = ({ sorts, properties, onUpdate, labels }) => /* @__PURE__ */ jsxs(Fragment, { children: [sorts.map((sort) => {
+const SortChips = ({ sorts, properties, onUpdate, labels, maxSorts }) => /* @__PURE__ */ jsxs(Fragment, { children: [sorts.map((sort) => {
 	const property = properties.find((candidate) => candidate.id === sort.propertyId);
 	if (!property) return null;
 	return /* @__PURE__ */ jsx(SortChip, {
@@ -30,6 +30,7 @@ const SortChips = ({ sorts, properties, onUpdate, labels }) => /* @__PURE__ */ j
 		propertyType: property.type
 	}, sort.propertyId);
 }), /* @__PURE__ */ jsx(AddSortButton, {
+	disabled: maxSorts !== void 0 && sorts.length >= maxSorts,
 	labels,
 	onAdd: (sort) => onUpdate([...sorts, sort]),
 	properties,
@@ -80,8 +81,9 @@ const SortChip = ({ propertyName, propertyType, desc, onToggle, onRemove, labels
 		})]
 	});
 };
-const AddSortButton = ({ properties, sortedPropertyIds, onAdd, labels }) => /* @__PURE__ */ jsxs(Menu, { children: [/* @__PURE__ */ jsx(MenuTrigger, {
+const AddSortButton = ({ properties, sortedPropertyIds, onAdd, labels, disabled }) => /* @__PURE__ */ jsxs(Menu, { children: [/* @__PURE__ */ jsx(MenuTrigger, {
 	"aria-label": labels.add,
+	disabled,
 	render: /* @__PURE__ */ jsx(Button, {
 		size: "icon-xs",
 		variant: "ghost"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stll/workspace-ui",
-  "version": "0.2.1",
+  "version": "0.3.0",
   "description": "Reusable workspace presentation components and view helpers for Stella.",
   "keywords": [
     "calculations",
@@ -103,7 +103,7 @@
     "@stll/calculations": "^0.1.0",
     "@stll/conditions": "^0.2.0",
     "@stll/money": "^0.1.0",
-    "@stll/ui": "^0.5.0",
+    "@stll/ui": "^0.5.1",
     "better-result": "3.0.0",
     "lucide-react": "1.30.0",
     "use-intl": "4.13.5"