@umriss-ui/dashboard 0.42.0 → 0.43.0

package/CHANGELOG.md

@@ -13,6 +13,18 @@ one section before an upgrade reads that one.
 
 The dashboard joins the other five packages' one number at its first version: they are released together, and a package without a change of its own still gets a heading for it.
 
+## 0.43.0 – What fills a widget (Oct. 2026)
+
+### Added
+
+- **`Dashboard` takes a `ref`**, typed at its root `role="group"` (ADR-0068); at runtime it reached that element before.
+- **The README says what fills a widget and who hears of a failure:** a chart and a schedule fill the body, a table stays within it with its toolbar and pager in view, a wrapper passes the height on with `height: 100%`; a widget whose content throws reaches React's `onCaughtError`, keeps its frame, and tries again when its size or options change.
+
+### Changed
+
+- **The peer range on core moves to `^0.43.0`.**
+  - Migration: install the 0.43 version of `@umriss-ui/core` beside it.
+
 ## 0.42.0 – A widget scrolls what exceeds its size (Oct. 2026)
 
 ### Added

package/README.md

@@ -60,6 +60,8 @@ const { Dashboard, WidgetType } = useDashboard({
 </Dashboard>;
 ```
 
+`Dashboard` is an element: `ref`, `className`, `style` and the rest reach its root `role="group"`.
+
 - **A sequence, never coordinates (ADR-0064).** One stored arrangement is right
   at every width. A widget that does not fit its row starts the next, and the
   room it leaves stays free. Below the width at which a column would be too
@@ -69,6 +71,12 @@ const { Dashboard, WidgetType } = useDashboard({
   worded in English and German by the library; a type offers some of them. The
   height follows the size, never the content: what the content needs beyond
   the size scrolls inside the widget, and the keyboard reaches it.
+- **A view fills its widget's body.** A chart and a schedule fill the body and
+  need no height of their own; a table stays within it, its toolbar and pager
+  in view, and its rows scroll. A wrapper of the application's own between the
+  body and the view passes the height on with `height: 100%`. A view whose floor
+  is taller than a size (a chart's 300 px, a schedule's 400 px) takes a lower one
+  through `style`'s `minHeight`, as the dispatcher's trends do.
 - **Editing is a mode and a draft.** "Edit" opens it; every change is a step
   that can be undone and redone; "Done" reports the whole arrangement once
   through `onViewChange`, "Cancel" puts it back, "Reset" steps to the default.
@@ -80,6 +88,13 @@ const { Dashboard, WidgetType } = useDashboard({
 - **A kept arrangement is read leniently.** A widget of a type that is gone
   falls out, a size a type no longer offers falls back to its starting size.
   A widget whose content throws keeps its frame and says so in a sentence.
+- **A failed widget is reported and may be retried.** React's `onCaughtError`,
+  given to `createRoot` or to the application's root, receives the error of a
+  widget whose content throws; the other widgets render. A retry is an error
+  boundary of the application's own inside the content: it catches first, so the
+  dashboard's boundary never sees the error, and it can reset the application's
+  data layer. Without one, a widget gets another try by itself when its size or
+  its options change.
 - **The application's, not the library's:** where an arrangement is stored,
   which default a role gets, several dashboards, sharing, and what stands in a
   widget.

package/dist/dashboard.js

@@ -346,7 +346,7 @@ function Mt({ view: s, editor: e, className: i, children: d, catalogue: v, ...y
         ] }, t.name);
       }) }) })
     ] }),
-    D?.form && ne && /* @__PURE__ */ a(Ae, { open: !0, anchorRef: g, align: "end", onOpenChange: () => w(null), role: "dialog", ariaLabel: n.dashboardOptions, children: /* @__PURE__ */ a("div", { className: z.options, children: D.form({
+    D?.form && ne && /* @__PURE__ */ a(Ae, { open: !0, anchorRef: g, align: "end", onOpenChange: () => w(null), role: "dialog", "aria-label": n.dashboardOptions, children: /* @__PURE__ */ a("div", { className: z.options, children: D.form({
       options: ne.options,
       change: (t) => {
         e.step(Ue(ne.id, t)), $(n.dashboardOptionsChanged(Q(D, t)));

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 import { HTMLAttributes } from 'react';
 import { ReactNode } from 'react';
+import { RefProp } from '@umriss-ui/core';
 
 /** What `useDashboard` takes. */
 export declare interface DashboardOptions {
@@ -48,7 +49,7 @@ export declare interface DashboardParts {
 }
 
 /** The props of `Dashboard`. */
-export declare interface DashboardProps extends HTMLAttributes<HTMLDivElement> {
+export declare interface DashboardProps extends HTMLAttributes<HTMLDivElement>, RefProp<HTMLDivElement> {
     /** The `WidgetType`s of this dashboard. */
     children?: ReactNode;
     /** The `name`s of the widget types the catalogue lists.

package/docs/llms-full.md

@@ -1,4 +1,4 @@
-# @umriss-ui/dashboard 0.42.0
+# @umriss-ui/dashboard 0.43.0
 
 > React dashboard for data-dense applications - widgets a reader arranges, packed in order on twelve columns.
 
@@ -76,7 +76,7 @@ function TrendChart({ data, previous, labels = ["this week", "last week"] }: { d
         </Text>
       )}
       <div style={{ flex: "1 1 0", minHeight: 0 }}>
-        <Chart ariaLabel={previous ? `${labels[0]} and ${labels[1]}` : labels[0]} padding={4} style={{ minHeight: 0, height: "100%" }}>
+        <Chart aria-label={previous ? `${labels[0]} and ${labels[1]}` : labels[0]} padding={4} style={{ minHeight: 0, height: "100%" }}>
           <XAxis value="i" domain="data" grid={false} tickFormat={() => ""} />
           <YAxis grid tickFormat={() => ""} />
           {previous && <Line value="before" name={labels[1]} color="var(--u-color-text-muted)" strokeWidth={1.25} dash={[3, 3]} markers="never" />}
@@ -468,7 +468,7 @@ function TrendChart({ data, previous, labels = ["this week", "last week"] }: { d
         </Text>
       )}
       <div style={{ flex: "1 1 0", minHeight: 0 }}>
-        <Chart ariaLabel={previous ? `${labels[0]} and ${labels[1]}` : labels[0]} padding={4} style={{ minHeight: 0, height: "100%" }}>
+        <Chart aria-label={previous ? `${labels[0]} and ${labels[1]}` : labels[0]} padding={4} style={{ minHeight: 0, height: "100%" }}>
           <XAxis value="i" domain="data" grid={false} tickFormat={() => ""} />
           <YAxis grid tickFormat={() => ""} />
           {previous && <Line value="before" name={labels[1]} color="var(--u-color-text-muted)" strokeWidth={1.25} dash={[3, 3]} markers="never" />}
@@ -800,6 +800,7 @@ Every move, size, removal, addition, undo, redo, reset, "Done" and "Cancel" is a
 |---|---|---|---|
 | `children` | `ReactNode` | — | The `WidgetType`s of this dashboard.<br>Shown in: [The start screen of a dispatcher](#dashboard), [Your own component as a widget](#dashboard), [Headings that divide the dashboard](#dashboard) and 1 more |
 | `catalogue` | `ReadonlyArray<string>` | every declared type | The `name`s of the widget types the catalogue lists.<br>Shown in: [The start screen of a dispatcher](#dashboard) |
+| `ref` | `Ref<HTMLDivElement> \| undefined` | — | Receives the component's root element. From `RefProp`. |
 
 Also takes every attribute of `<div>`.
 
@@ -870,7 +871,7 @@ Declares no props of its own.
 - Never: stacks of widgets that share one place, coordinates and free placement, a layout per breakpoint, dense packing ([ADR-0064](https://github.com/romanhaendler/umriss-ui/blob/main/docs/adr/0064-a-dashboard-a-user-arranges-is-a-sequence-on-fixed-columns.md)).
 - Where an arrangement is stored, which default a role gets, several dashboards and what stands in a widget are the application's.
 
-What umriss deliberately does not build, and why: [ADR-0032](https://github.com/romanhaendler/umriss-ui/blob/dashboard-v0.42.0/docs/adr/0032-what-umriss-is-not.md).
+What umriss deliberately does not build, and why: [ADR-0032](https://github.com/romanhaendler/umriss-ui/blob/dashboard-v0.43.0/docs/adr/0032-what-umriss-is-not.md).
 
 ## API index
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umriss-ui/dashboard",
-  "version": "0.42.0",
+  "version": "0.43.0",
   "description": "React dashboard for data-dense applications - widgets a reader arranges, packed in order on twelve columns.",
   "license": "MIT",
   "author": "Roman Händler",
@@ -54,7 +54,7 @@
     }
   },
   "peerDependencies": {
-    "@umriss-ui/core": "^0.42.0",
+    "@umriss-ui/core": "^0.43.0",
     "react": ">=19",
     "react-dom": ">=19"
   },
@@ -70,8 +70,8 @@
     "typescript": "^5.6.3",
     "vite": "^6.0.0",
     "vite-plugin-dts": "^4.3.0",
-    "@umriss-ui/demo": "0.0.0",
-    "@umriss-ui/core": "0.42.0"
+    "@umriss-ui/core": "0.43.0",
+    "@umriss-ui/demo": "0.0.0"
   },
   "scripts": {
     "props": "node --disable-warning=ExperimentalWarning --experimental-strip-types demo/props.ts",