@selectwin/kit 0.1.211 → 0.1.213

package/dist/SelectFlowCanvas.d.ts

@@ -74,8 +74,16 @@ export interface SelectFlowNodeProps {
     invalid?: boolean;
     onClick?: () => void;
     ariaLabel?: string;
+    /**
+     * Remover o bloco: com ele, o nó ganha uma lixeira no canto de cima, à direita. Ela aparece com o mouse em cima, com
+     * o foco dentro (Tab do nó para ela) ou com o nó selecionado; no toque, só com o nó selecionado. Escondida, não
+     * recebe clique nem foco: um toque no canto do nó não apaga o que não se via. Confirmar ou desfazer é de quem chama.
+     */
+    onRemove?: () => void;
+    /** Nome acessível e dica da lixeira, com o que sai (ex.: "Remover o envio por SMS"). Padrão: "Remover". */
+    removeLabel?: string;
 }
-export declare function SelectFlowNode({ x, y, width, height, shape, tone, icon, order, eyebrow, title, subtitle, tags, titleTone, selected, active, muted, invalid, onClick, ariaLabel, }: SelectFlowNodeProps): import("react").JSX.Element;
+export declare function SelectFlowNode({ x, y, width, height, shape, tone, icon, order, eyebrow, title, subtitle, tags, titleTone, selected, active, muted, invalid, onClick, ariaLabel, onRemove, removeLabel, }: SelectFlowNodeProps): import("react").JSX.Element;
 export interface SelectFlowLayoutProps {
     title: ReactNode;
     subtitle?: ReactNode;

package/dist/SelectFlowCanvas.js

@@ -1,34 +1,34 @@
 /* empty css           */
-import { ArrowLeftIcon as e, CloseIcon as t, MinusCircleIcon as n, PlusIcon as r } from "./icons.js";
-import { SelectAlert as i } from "./SelectAlert.js";
-import { SelectIconButton as a } from "./SelectIconButton.js";
-import { useId as o, useState as s } from "react";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { ArrowLeftIcon as e, CloseIcon as t, MinusCircleIcon as n, PlusIcon as r, TrashIcon as i } from "./icons.js";
+import { SelectAlert as a } from "./SelectAlert.js";
+import { SelectIconButton as o } from "./SelectIconButton.js";
+import { useId as s, useState as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/SelectFlowCanvas.tsx
-var u = (e) => Math.round(e * 100) / 100;
-function d({ width: e, height: t, edges: i, labels: d = [], pluses: f = [], children: p, zoom: m, defaultZoom: h = 1, onZoomChange: g, minZoom: _ = .5, maxZoom: v = 1.3, onBackgroundClick: y, ariaLabel: b }) {
-	let x = o().replace(/:/g, ""), [S, C] = s(h), w = m ?? S, T = (e) => {
-		let t = u(Math.min(v, Math.max(_, e)));
+var d = (e) => Math.round(e * 100) / 100;
+function f({ width: e, height: t, edges: i, labels: a = [], pluses: f = [], children: p, zoom: m, defaultZoom: h = 1, onZoomChange: g, minZoom: _ = .5, maxZoom: v = 1.3, onBackgroundClick: y, ariaLabel: b }) {
+	let x = s().replace(/:/g, ""), [S, C] = c(h), w = m ?? S, T = (e) => {
+		let t = d(Math.min(v, Math.max(_, e)));
 		m === void 0 && C(t), g == null || g(t);
 	}, E = `select-flow-arrow-${x}`, D = `select-flow-arrow-on-${x}`;
-	return /* @__PURE__ */ l("div", {
+	return /* @__PURE__ */ u("div", {
 		className: "select-flow",
 		role: "region",
 		"aria-label": b,
-		children: [/* @__PURE__ */ c("div", {
+		children: [/* @__PURE__ */ l("div", {
 			className: "select-flow__scroll",
 			onClick: (e) => {
 				e.target.dataset.flowBackground === "true" && (y == null || y());
 			},
 			"data-flow-background": "true",
-			children: /* @__PURE__ */ c("div", {
+			children: /* @__PURE__ */ l("div", {
 				className: "select-flow__sizer",
 				style: {
 					width: e * w,
 					height: t * w
 				},
 				"data-flow-background": "true",
-				children: /* @__PURE__ */ l("div", {
+				children: /* @__PURE__ */ u("div", {
 					className: "select-flow__stage",
 					style: {
 						width: e,
@@ -37,12 +37,12 @@ function d({ width: e, height: t, edges: i, labels: d = [], pluses: f = [], chil
 					},
 					"data-flow-background": "true",
 					children: [
-						/* @__PURE__ */ l("svg", {
+						/* @__PURE__ */ u("svg", {
 							className: "select-flow__edges",
 							width: e,
 							height: t,
 							"aria-hidden": "true",
-							children: [/* @__PURE__ */ l("defs", { children: [/* @__PURE__ */ c("marker", {
+							children: [/* @__PURE__ */ u("defs", { children: [/* @__PURE__ */ l("marker", {
 								id: E,
 								viewBox: "0 0 10 10",
 								refX: "8",
@@ -50,11 +50,11 @@ function d({ width: e, height: t, edges: i, labels: d = [], pluses: f = [], chil
 								markerWidth: "7",
 								markerHeight: "7",
 								orient: "auto-start-reverse",
-								children: /* @__PURE__ */ c("path", {
+								children: /* @__PURE__ */ l("path", {
 									className: "select-flow__arrow",
 									d: "M 0 0 L 10 5 L 0 10 z"
 								})
-							}), /* @__PURE__ */ c("marker", {
+							}), /* @__PURE__ */ l("marker", {
 								id: D,
 								viewBox: "0 0 10 10",
 								refX: "8",
@@ -62,17 +62,17 @@ function d({ width: e, height: t, edges: i, labels: d = [], pluses: f = [], chil
 								markerWidth: "7",
 								markerHeight: "7",
 								orient: "auto-start-reverse",
-								children: /* @__PURE__ */ c("path", {
+								children: /* @__PURE__ */ l("path", {
 									className: "select-flow__arrow select-flow__arrow--on",
 									d: "M 0 0 L 10 5 L 0 10 z"
 								})
-							})] }), i.map((e) => /* @__PURE__ */ c("path", {
+							})] }), i.map((e) => /* @__PURE__ */ l("path", {
 								d: e.d,
 								className: `select-flow__edge${e.state === "on" ? " select-flow__edge--on" : e.state === "muted" ? " select-flow__edge--muted" : ""}`,
 								markerEnd: `url(#${e.state === "on" ? D : E})`
 							}, e.id))]
 						}),
-						d.map((e) => /* @__PURE__ */ c("span", {
+						a.map((e) => /* @__PURE__ */ l("span", {
 							className: `select-flow__label${e.tone === "yes" ? " select-flow__label--yes" : ""}${e.active ? " select-flow__label--on" : ""}`,
 							style: {
 								left: e.x,
@@ -81,7 +81,7 @@ function d({ width: e, height: t, edges: i, labels: d = [], pluses: f = [], chil
 							children: e.text
 						}, e.id)),
 						p,
-						f.map((e) => /* @__PURE__ */ c("button", {
+						f.map((e) => /* @__PURE__ */ l("button", {
 							type: "button",
 							className: "select-flow__plus",
 							style: {
@@ -91,30 +91,30 @@ function d({ width: e, height: t, edges: i, labels: d = [], pluses: f = [], chil
 							title: e.label,
 							"aria-label": e.label,
 							onClick: e.onClick,
-							children: /* @__PURE__ */ c(r, {})
+							children: /* @__PURE__ */ l(r, {})
 						}, e.id))
 					]
 				})
 			})
-		}), /* @__PURE__ */ l("div", {
+		}), /* @__PURE__ */ u("div", {
 			className: "select-flow__zoom",
 			children: [
-				/* @__PURE__ */ c(a, {
-					icon: /* @__PURE__ */ c(n, {}),
+				/* @__PURE__ */ l(o, {
+					icon: /* @__PURE__ */ l(n, {}),
 					label: "Diminuir o zoom",
 					size: "sm",
 					disabled: w <= _,
 					onClick: () => T(w - .1)
 				}),
-				/* @__PURE__ */ l("button", {
+				/* @__PURE__ */ u("button", {
 					type: "button",
 					className: "select-flow__zoomvalue",
 					onClick: () => T(1),
 					title: "Voltar a 100%",
 					children: [Math.round(w * 100), "%"]
 				}),
-				/* @__PURE__ */ c(a, {
-					icon: /* @__PURE__ */ c(r, {}),
+				/* @__PURE__ */ l(o, {
+					icon: /* @__PURE__ */ l(r, {}),
 					label: "Aumentar o zoom",
 					size: "sm",
 					disabled: w >= v,
@@ -124,149 +124,192 @@ function d({ width: e, height: t, edges: i, labels: d = [], pluses: f = [], chil
 		})]
 	});
 }
-function f({ x: e, y: t, width: n, height: r, shape: i = "card", tone: a = "neutral", icon: o, order: s, eyebrow: u, title: d, subtitle: f, tags: p, titleTone: m = "default", selected: h = !1, active: g = !1, muted: _ = !1, invalid: v = !1, onClick: y, ariaLabel: b }) {
-	let x = `${h ? " is-selected" : v ? " is-invalid" : g ? " is-on" : ""}${_ ? " is-muted" : ""}`, S = {
+function p({ x: e, y: t, width: n, height: r, shape: a = "card", tone: o = "neutral", icon: s, order: c, eyebrow: d, title: f, subtitle: p, tags: h, titleTone: g = "default", selected: _ = !1, active: v = !1, muted: y = !1, invalid: b = !1, onClick: x, ariaLabel: S, onRemove: C, removeLabel: w = "Remover" }) {
+	let T = m({
+		shape: a,
+		tone: o,
+		icon: s,
+		order: c,
+		eyebrow: d,
+		title: f,
+		subtitle: p,
+		tags: h,
+		titleTone: g,
+		selected: _,
+		active: v,
+		muted: y,
+		invalid: b,
+		onClick: x,
+		ariaLabel: S
+	}, C ? {
+		left: 0,
+		top: 0,
+		width: n,
+		height: r
+	} : {
 		left: e,
 		top: t,
 		width: n,
 		height: r
-	}, C = d != null && /* @__PURE__ */ c("span", {
-		className: `select-flownode__title${m === "warning" ? " select-flownode__title--warning" : ""}`,
-		children: d
 	});
-	return i === "decision" ? /* @__PURE__ */ c("button", {
+	return C ? /* @__PURE__ */ u("div", {
+		className: `select-flownode-slot select-flownode-slot--${a}${_ ? " is-selected" : ""}`,
+		style: {
+			left: e,
+			top: t,
+			width: n,
+			height: r
+		},
+		children: [T, /* @__PURE__ */ l("button", {
+			type: "button",
+			className: "select-flownode__remove",
+			"aria-label": w,
+			title: w,
+			onClick: (e) => {
+				e.stopPropagation(), C();
+			},
+			children: /* @__PURE__ */ l(i, {})
+		})]
+	}) : T;
+}
+function m({ shape: e = "card", tone: t = "neutral", icon: n, order: r, eyebrow: i, title: a, subtitle: o, tags: s, titleTone: c = "default", selected: d = !1, active: f = !1, muted: p = !1, invalid: m = !1, onClick: h, ariaLabel: g }, _) {
+	let v = `${d ? " is-selected" : m ? " is-invalid" : f ? " is-on" : ""}${p ? " is-muted" : ""}`, y = a != null && /* @__PURE__ */ l("span", {
+		className: `select-flownode__title${c === "warning" ? " select-flownode__title--warning" : ""}`,
+		children: a
+	});
+	return e === "decision" ? /* @__PURE__ */ l("button", {
 		type: "button",
-		className: `select-flownode select-flownode--decision${x}`,
-		style: S,
-		onClick: y,
-		"aria-label": b,
-		children: /* @__PURE__ */ l("span", {
+		className: `select-flownode select-flownode--decision${v}`,
+		style: _,
+		onClick: h,
+		"aria-label": g,
+		children: /* @__PURE__ */ u("span", {
 			className: "select-flownode__inner",
-			children: [s != null && /* @__PURE__ */ c("span", {
+			children: [r != null && /* @__PURE__ */ l("span", {
 				className: "select-flownode__order",
-				children: s
-			}), /* @__PURE__ */ l("span", {
+				children: r
+			}), /* @__PURE__ */ u("span", {
 				className: "select-flownode__text",
 				children: [
-					u != null && /* @__PURE__ */ c("span", {
+					i != null && /* @__PURE__ */ l("span", {
 						className: "select-flownode__eyebrow",
-						children: u
+						children: i
 					}),
-					C,
-					f != null && /* @__PURE__ */ c("span", {
+					y,
+					o != null && /* @__PURE__ */ l("span", {
 						className: "select-flownode__sub",
-						children: f
+						children: o
 					}),
-					p != null && /* @__PURE__ */ c("span", {
+					s != null && /* @__PURE__ */ l("span", {
 						className: "select-flownode__tags",
-						children: p
+						children: s
 					})
 				]
 			})]
 		})
-	}) : i === "pill" ? /* @__PURE__ */ l("button", {
+	}) : e === "pill" ? /* @__PURE__ */ u("button", {
 		type: "button",
-		className: `select-flownode select-flownode--pill${x}`,
-		style: S,
-		onClick: y,
-		"aria-label": b,
-		children: [o, d]
-	}) : /* @__PURE__ */ l("button", {
+		className: `select-flownode select-flownode--pill${v}`,
+		style: _,
+		onClick: h,
+		"aria-label": g,
+		children: [n, a]
+	}) : /* @__PURE__ */ u("button", {
 		type: "button",
-		className: `select-flownode select-flownode--${i === "terminal" ? "terminal" : "card"}${x}`,
-		style: S,
-		onClick: y,
-		"aria-label": b,
-		children: [i === "card" && o != null && /* @__PURE__ */ c("span", {
-			className: `select-flownode__chip select-flownode__chip--${a}`,
-			children: o
-		}), /* @__PURE__ */ l("span", {
+		className: `select-flownode select-flownode--${e === "terminal" ? "terminal" : "card"}${v}`,
+		style: _,
+		onClick: h,
+		"aria-label": g,
+		children: [e === "card" && n != null && /* @__PURE__ */ l("span", {
+			className: `select-flownode__chip select-flownode__chip--${t}`,
+			children: n
+		}), /* @__PURE__ */ u("span", {
 			className: "select-flownode__text",
 			children: [
-				u != null && /* @__PURE__ */ c("span", {
+				i != null && /* @__PURE__ */ l("span", {
 					className: "select-flownode__eyebrow",
-					children: u
+					children: i
 				}),
-				C,
-				f != null && /* @__PURE__ */ c("span", {
+				y,
+				o != null && /* @__PURE__ */ l("span", {
 					className: "select-flownode__sub",
-					children: f
+					children: o
 				}),
-				p != null && /* @__PURE__ */ c("span", {
+				s != null && /* @__PURE__ */ l("span", {
 					className: "select-flownode__tags",
-					children: p
+					children: s
 				})
 			]
 		})]
 	});
 }
-function p({ title: n, subtitle: r, onBack: o, backLabel: s = "Voltar", toolbar: u, actions: d, error: f, canvas: p, inspectorHead: m, inspector: h, inspectorLabel: g = "Painel", inspectorOpen: _, onInspectorClose: v }) {
+function h({ title: n, subtitle: r, onBack: i, backLabel: s = "Voltar", toolbar: c, actions: d, error: f, canvas: p, inspectorHead: m, inspector: h, inspectorLabel: g = "Painel", inspectorOpen: _, onInspectorClose: v }) {
 	let y = _ !== void 0;
-	return /* @__PURE__ */ l("div", {
+	return /* @__PURE__ */ u("div", {
 		className: `select-flowpage${y ? " select-flowpage--sheet" : ""}${y && _ ? " is-inspecting" : ""}`,
 		children: [
-			/* @__PURE__ */ l("header", {
+			/* @__PURE__ */ u("header", {
 				className: "select-flowpage__bar",
 				children: [
-					o && /* @__PURE__ */ c(a, {
-						icon: /* @__PURE__ */ c(e, {}),
+					i && /* @__PURE__ */ l(o, {
+						icon: /* @__PURE__ */ l(e, {}),
 						label: s,
 						variant: "outline",
-						onClick: o
+						onClick: i
 					}),
-					/* @__PURE__ */ l("div", {
+					/* @__PURE__ */ u("div", {
 						className: "select-flowpage__ident",
-						children: [/* @__PURE__ */ c("span", {
+						children: [/* @__PURE__ */ l("span", {
 							className: "select-flowpage__title",
 							children: n
-						}), r != null && /* @__PURE__ */ c("span", {
+						}), r != null && /* @__PURE__ */ l("span", {
 							className: "select-flowpage__sub",
 							children: r
 						})]
 					}),
-					u != null && /* @__PURE__ */ c("div", {
+					c != null && /* @__PURE__ */ l("div", {
 						className: "select-flowpage__tools",
-						children: u
+						children: c
 					}),
-					d != null && /* @__PURE__ */ c("div", {
+					d != null && /* @__PURE__ */ l("div", {
 						className: "select-flowpage__actions",
 						children: d
 					})
 				]
 			}),
-			f != null && f !== "" && /* @__PURE__ */ c("div", {
+			f != null && f !== "" && /* @__PURE__ */ l("div", {
 				className: "select-flowpage__error",
-				children: /* @__PURE__ */ c(i, {
+				children: /* @__PURE__ */ l(a, {
 					tone: "critical",
 					children: f
 				})
 			}),
-			/* @__PURE__ */ l("div", {
+			/* @__PURE__ */ u("div", {
 				className: "select-flowpage__body",
-				children: [/* @__PURE__ */ c("div", {
+				children: [/* @__PURE__ */ l("div", {
 					className: "select-flowpage__canvas",
 					children: p
-				}), /* @__PURE__ */ l("aside", {
+				}), /* @__PURE__ */ u("aside", {
 					className: "select-flowpage__inspector",
 					"aria-label": g,
 					children: [
-						y && v && /* @__PURE__ */ l("button", {
+						y && v && /* @__PURE__ */ u("button", {
 							type: "button",
 							className: "select-flowpage__sheetclose",
 							onClick: v,
-							children: [/* @__PURE__ */ c("span", {
+							children: [/* @__PURE__ */ l("span", {
 								className: "select-flowpage__sheetgrip",
 								"aria-hidden": "true"
-							}), /* @__PURE__ */ l("span", {
+							}), /* @__PURE__ */ u("span", {
 								className: "select-flowpage__sheetlabel",
-								children: [/* @__PURE__ */ c(t, {}), "Fechar"]
+								children: [/* @__PURE__ */ l(t, {}), "Fechar"]
 							})]
 						}),
-						m != null && /* @__PURE__ */ c("div", {
+						m != null && /* @__PURE__ */ l("div", {
 							className: "select-flowpage__inspectorhead",
 							children: m
 						}),
-						/* @__PURE__ */ c("div", {
+						/* @__PURE__ */ l("div", {
 							className: "select-flowpage__inspectorbody",
 							children: h
 						})
@@ -277,6 +320,6 @@ function p({ title: n, subtitle: r, onBack: o, backLabel: s = "Voltar", toolbar:
 	});
 }
 //#endregion
-export { d as SelectFlowCanvas, p as SelectFlowLayout, f as SelectFlowNode };
+export { f as SelectFlowCanvas, h as SelectFlowLayout, p as SelectFlowNode };
 
 //# sourceMappingURL=SelectFlowCanvas.js.map

package/dist/SelectSection.d.ts

@@ -31,6 +31,11 @@ type SelectSectionOwnProps = {
      * dentro de uma superfície sólida (`SelectRegions`, o drawer do Workbench); numa página, a seção segue two-tone.
      */
     flush?: boolean;
+    /**
+     * 0.1.213: a seção é a moldura de uma lista (a `SelectTable` de dentro): o corpo sem a caixa branca nem o respiro, e
+     * a tabela com o cabeçalho na moldura e as linhas na caixa branca dela. Sem tabela no corpo, a caixa branca volta.
+     */
+    list?: boolean;
     children: ReactNode;
 };
 export type SelectSectionProps = SelectSectionOwnProps & Omit<ComponentPropsWithoutRef<'div'>, keyof SelectSectionOwnProps>;

package/dist/SelectSection.js

@@ -6,20 +6,20 @@ import { inertProps as i } from "./internal/inert.js";
 import { forwardRef as a, useId as o, useState as s } from "react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/SelectSection.tsx
-var u = a(function({ title: a, help: u, description: d, action: f, collapsible: p = !1, defaultOpen: m = !0, open: h, onOpenChange: g, footer: _, flush: v = !1, children: y, className: b, ...x }, S) {
-	let [C, w] = s(m), T = h ?? C, E = o(), D = () => {
-		h === void 0 && w(!T), g == null || g(!T);
-	}, O = (r() ? " select-section--nested" : "") + (v ? " select-section--flush" : "");
+var u = a(function({ title: a, help: u, description: d, action: f, collapsible: p = !1, defaultOpen: m = !0, open: h, onOpenChange: g, footer: _, flush: v = !1, list: y = !1, children: b, className: x, ...S }, C) {
+	let [w, T] = s(m), E = h ?? w, D = o(), O = () => {
+		h === void 0 && T(!E), g == null || g(!E);
+	}, k = (r() ? " select-section--nested" : "") + (v ? " select-section--flush" : "") + (y ? " select-section--list" : ""), A = y ? "list" : "body";
 	return p ? /* @__PURE__ */ l("div", {
-		ref: S,
-		...x,
-		className: `select-section select-section--collapsible${O}${T ? " is-open" : ""}${b ? " " + b : ""}`,
+		ref: C,
+		...S,
+		className: `select-section select-section--collapsible${k}${E ? " is-open" : ""}${x ? " " + x : ""}`,
 		children: [/* @__PURE__ */ l("button", {
 			type: "button",
 			className: "select-section__head select-section__head--toggle",
-			"aria-expanded": T,
-			"aria-controls": E,
-			onClick: D,
+			"aria-expanded": E,
+			"aria-controls": D,
+			onClick: O,
 			children: [/* @__PURE__ */ l("span", {
 				className: "select-section__heading",
 				children: [a && /* @__PURE__ */ c("span", {
@@ -35,15 +35,18 @@ var u = a(function({ title: a, help: u, description: d, action: f, collapsible:
 				children: /* @__PURE__ */ c(e, {})
 			})]
 		}), /* @__PURE__ */ c("div", {
-			id: E,
+			id: D,
 			className: "select-section__collapse",
-			"data-open": T,
-			...i(!T),
+			"data-open": E,
+			...i(!E),
 			children: /* @__PURE__ */ l("div", {
 				className: "select-section__collapsewrap",
 				children: [/* @__PURE__ */ c("div", {
 					className: "select-section__body",
-					children: /* @__PURE__ */ c(n, { children: y })
+					children: /* @__PURE__ */ c(n, {
+						kind: A,
+						children: b
+					})
 				}), _ != null && _ !== "" && /* @__PURE__ */ c("div", {
 					className: "select-section__foot",
 					children: _
@@ -51,9 +54,9 @@ var u = a(function({ title: a, help: u, description: d, action: f, collapsible:
 			})
 		})]
 	}) : /* @__PURE__ */ l("div", {
-		ref: S,
-		...x,
-		className: `select-section${O}${b ? " " + b : ""}`,
+		ref: C,
+		...S,
+		className: `select-section${k}${x ? " " + x : ""}`,
 		children: [
 			(a || d || f) && /* @__PURE__ */ l("div", {
 				className: "select-section__head",
@@ -73,7 +76,10 @@ var u = a(function({ title: a, help: u, description: d, action: f, collapsible:
 			}),
 			/* @__PURE__ */ c("div", {
 				className: "select-section__body",
-				children: /* @__PURE__ */ c(n, { children: y })
+				children: /* @__PURE__ */ c(n, {
+					kind: A,
+					children: b
+				})
 			}),
 			_ != null && _ !== "" && /* @__PURE__ */ c("div", {
 				className: "select-section__foot",

package/dist/SelectTable.d.ts

@@ -73,6 +73,25 @@ type SelectTableOwnProps = {
      * separados por linhas de 1px.
      */
     flush?: boolean;
+    /**
+     * 0.1.213: o nome da tabela para o leitor de tela (a grade é `role="table"`). Sem ele, o nome é o `title` quando o
+     * `title` é texto.
+     */
+    label?: string;
+    /**
+     * 0.1.213: a largura mínima das colunas juntas (um comprimento CSS, `'48rem'`): abaixo dela a tabela rola de lado em
+     * vez de apertar as colunas. Sem ela, o mínimo é a soma dos pisos das colunas.
+     */
+    minWidth?: string;
+    /**
+     * 0.1.213: como as colunas flexíveis (as sem `width`) dividem a largura.
+     *  · `even` (o padrão): cada uma leva a mesma fatia (vezes o `grow`);
+     *  · `content`: cada uma leva a fatia do que ela tem — a tabela mede a largura natural de cada coluna (o cabeçalho e
+     *    as células) e divide a largura na mesma proporção, como a tabela do HTML. O nome longo ganha espaço e o "OK" não
+     *    o desperdiça. Nenhuma coluna fica mais estreita que o que ela tem (até 20rem, `--select-table-col-cap`): sem
+     *    espaço, a tabela rola de lado. O cabeçalho continua alinhado com as linhas (a mesma grade).
+     */
+    sizing?: 'even' | 'content';
 };
 export type SelectTableProps = SelectTableOwnProps & Omit<ComponentPropsWithoutRef<'div'>, keyof SelectTableOwnProps>;
 export declare const SelectTable: import('react').ForwardRefExoticComponent<SelectTableOwnProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof SelectTableOwnProps> & import('react').RefAttributes<HTMLDivElement>>;
@@ -93,14 +112,26 @@ export declare const SelectUserCell: import('react').ForwardRefExoticComponent<S
  * vêm logo abaixo com `nested` — recuadas e num fundo afundado, na MESMA grade de colunas.
  * Continua uma tabela só: nada de tabela dentro de linha (card dentro de card).
  */
-export declare function SelectTableRow({ children, onClick, expanded, nested, }: {
+type SelectTableRowOwnProps = {
     children: ReactNode;
     onClick?: () => void;
     /** Linha-mãe de um grupo: aberta/fechada (vira `aria-expanded`). */
     expanded?: boolean;
     /** Linha-filha de um grupo aberto. */
     nested?: boolean;
-}): import("react").JSX.Element;
+    /**
+     * 0.1.213: a linha do que está aberto agora (o plano que a página mostra ao lado, a mensagem da gaveta): o fundo
+     * afundado e `aria-current`.
+     */
+    current?: boolean;
+    /**
+     * 0.1.213: a linha que abre um grupo de linhas ("Do workspace · as regras dele"): o título numa célula que ocupa a
+     * linha toda (`<SelectTableCell span="all">`), no fundo afundado.
+     */
+    section?: boolean;
+};
+export type SelectTableRowProps = SelectTableRowOwnProps & Omit<ComponentPropsWithoutRef<'div'>, keyof SelectTableRowOwnProps | 'role'>;
+export declare function SelectTableRow({ children, onClick, expanded, nested, current, section, className, ...rest }: SelectTableRowProps): import("react").JSX.Element;
 type SelectTableCellOwnProps = {
     children: ReactNode;
     align?: 'start' | 'end' | 'center';
@@ -110,6 +141,12 @@ type SelectTableCellOwnProps = {
     /** Chevron de grupo antes do conteúdo (primeira célula da linha-mãe). `'none'` reserva o
      *  espaço sem desenhar, para alinhar uma linha sem filhas com as vizinhas que têm. */
     disclosure?: 'open' | 'closed' | 'none';
+    /** 0.1.213: o cabeçalho da linha (`role="rowheader"`): o leitor de tela diz o nome da linha em cada célula dela. */
+    header?: boolean;
+    /** 0.1.213: quantas colunas a célula ocupa (`'all'`: a linha toda — o título do grupo, o detalhe aberto). */
+    span?: number | 'all';
+    /** 0.1.213: o texto quebra linha em vez de cortar (a descrição, o valor longo que não pode sumir). */
+    wrap?: boolean;
 };
 export type SelectTableCellProps = SelectTableCellOwnProps & Omit<ComponentPropsWithoutRef<'div'>, keyof SelectTableCellOwnProps>;
 export declare const SelectTableCell: import('react').ForwardRefExoticComponent<SelectTableCellOwnProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof SelectTableCellOwnProps> & import('react').RefAttributes<HTMLDivElement>>;