@ai-matrx/design-system 0.10.0 → 0.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,73 @@
1
1
  # Changelog
2
2
 
3
+ ## 0.11.0 — 2026-09-07
4
+
5
+ **THE CONFIRM SURFACE MOVES IN.** `ConfirmDialog` and `ConfirmDialogHost` — the
6
+ platform's `window.confirm` replacement — now live here. They came from
7
+ `@ai-matrx/kit`, which is releasing 0.9.0 to delete its copy. Census row 19i,
8
+ decided on the row-20a Tooltip precedent: **one surface, one owner.**
9
+
10
+ **Why it had to move.** kit's confirm shipped a second, inlined AlertDialog with
11
+ its own hand-copied button class strings, a hardcoded `bg-black/80` scrim, and
12
+ the exact `data-[state=open]:animate-in … zoom-in-95 … slide-in-from-top-[48%]`
13
+ host-plugin utilities 0.10.0's motion sweep just finished removing from this
14
+ package. kit ships NO stylesheet, so that dialog was unanimated and off-theme in
15
+ three of the four consumers — on the one surface in the product that stands
16
+ between a user and a destroyed thing. kit could not import 0.10.0's fix, because
17
+ **this package depends on kit**; importing back is a cycle. And giving kit its own
18
+ sheet would have invented a second required-CSS contract no consumer performs —
19
+ the C26 silent host contract, one layer down. The only correct move was this one.
20
+
21
+ **What it inherits by being here** — none of it hand-copied, all of it already
22
+ proven by this package's own guards:
23
+
24
+ - `matrx-motion-overlay` / `matrx-motion-dialog` / `matrx-spin`, whose rules ship
25
+ in `styles.css` and are asserted present in the packed tarball;
26
+ - `--matrx-overlay-scrim`, a token that answers to the host's theme, instead of
27
+ `bg-black/80`;
28
+ - `AlertDialog` ruling 3 — clamped to `max-h-[85dvh]`, scrolling inside itself,
29
+ sticky footer. **This is what makes the platform's consequence-first copy law
30
+ survivable.** A confirmation that names everything it is about to destroy can be
31
+ long, and in kit's unclamped copy a long one pushed Cancel and Continue below
32
+ the fold of a short viewport. An AlertDialog does not dismiss on a backdrop
33
+ click, so that was a dead end on a destructive action. Fixed by the move, with
34
+ a guard;
35
+ - `buttonVariants` as the ONE source of button appearance — the destructive
36
+ confirm button is now literally the package's destructive button, including the
37
+ 44px coarse-pointer target, not a second hand-written copy of its classes;
38
+ - `PortalContainerProvider`, so a confirm opened inside a popped-out window panel
39
+ renders in THAT window's document without the host passing anything.
40
+
41
+ **Behavior is the kit port, verbatim.** Every prop, default and interaction is
42
+ unchanged; only the chrome underneath is the package's. The suite came across
43
+ whole and grew a third target: `src/confirm-dialog.test.tsx` proves the
44
+ imperative contract across the package boundary, proves the chrome is the
45
+ package's (a guard that fails the moment `bg-black` or `animate-in` comes back),
46
+ and proves the consequence-first copy contract — the consequence renders in full,
47
+ is the dialog's `aria-describedby` description, is never clamped or truncated,
48
+ and never puts the actions out of reach however long it is.
49
+
50
+ ### Added
51
+
52
+ - `ConfirmDialog`, `ConfirmDialogProps` — the declarative dialog (use it inline
53
+ when in-dialog `busy` state during async work is meaningful).
54
+ - `ConfirmDialogHost` — mount ONCE near the root of every provider tree.
55
+
56
+ ### Not added, on purpose
57
+
58
+ - `confirm()` is **not** re-exported from here. The imperative opener stays in
59
+ `@ai-matrx/kit/confirm-opener`, where it is pure TS with no React and no radix,
60
+ so hundreds of static call sites cost nothing. The host and the opener find each
61
+ other through the opener's `Symbol.for("ai-matrx.kit.confirm-opener-state")`
62
+ globalThis slot — across packages and across module graphs.
63
+
64
+ ### Consumer action (C28)
65
+
66
+ Mount `<ConfirmDialogHost />` from **here** and keep calling `confirm()` from
67
+ `@ai-matrx/kit/confirm-opener`. The full repointing diff — host, dialog, and the
68
+ imperative import — is in `@ai-matrx/kit` CHANGELOG § 0.9.0 § Consumer action.
69
+ Take both releases together: design-system >= 0.11.0 with kit >= 0.9.0.
70
+
3
71
  ## 0.10.0 — 2026-09-07
4
72
 
5
73
  **THE MOTION SWEEP. Ten more primitives were animating with a host plugin this
@@ -378,9 +446,19 @@ Install `@ai-matrx/design-system@0.7.0` (and `@ai-matrx/tap-target@0.2.0`), then
378
446
  `alert-dialog.tsx`, `alert.tsx`, `slider.tsx`, `resizable.tsx`,
379
447
  `matrx/resizable.tsx`, `radio-group.tsx`, `hover-card.tsx`,
380
448
  `toggle-group.tsx`, `toggle.tsx`, `radix-dialog-modal-context.tsx`.
381
- - No other consumer repo carries a fork of these — verified by census on
449
+ - ~~No other consumer repo carries a fork of these — verified by census on
382
450
  2026-09-07 across matrx-extend, matrx-games, aidream `apps/dashboard` and
383
- `apps/workflow-studio`.
451
+ `apps/workflow-studio`.~~ 🚨 **WRONG, corrected 2026-09-07.** That census
452
+ swept FOUR repos and there are FIVE: **matrx-local** (`desktop/`, the
453
+ Tauri app) carried its own `tooltip.tsx`, `slider.tsx`, `popover.tsx` and
454
+ `select.tsx` the whole time — plus ten more from the 0.5.0 list below,
455
+ whose Consumer action omitted it for the same reason. The sentence was
456
+ repeated verbatim into census row 19, and every later wave that read it
457
+ kept skipping the repo. matrx-local was adopted on 0.10.0 the same day
458
+ this was found: all seventeen forks swapped, fourteen files deleted, 131
459
+ files repointed, 56 twin-register rows added. **The lesson is the
460
+ sentence, not the repo — a "no other consumer" claim must name the repos
461
+ it swept, and the list must be checked against the actual consumer set.**
384
462
  3. **`matrx/resizable.tsx` callers keep their `size` prop** — it is the same
385
463
  eight-step scale, now on the one component. Callers of the plain
386
464
  `resizable.tsx` get the identical 2px default (`size="sm"`).
@@ -567,6 +645,11 @@ copy of something this version now ships:
567
645
  Bind `Card size="lg"` to keep this app's density (Table defaults to md as of 0.5.1).
568
646
  - **aidream/apps/workflow-studio** — `src/components/ui/{dialog,dropdown-menu,scroll-area,switch,tabs,textarea}.tsx`.
569
647
  Its ScrollArea viewport hack becomes `viewportClassName="[&>div]:!block [&>div]:min-w-0"`.
648
+ - **matrx-local** — `desktop/src/components/ui/{avatar,card,checkbox,dialog,progress,scroll-area,switch,tabs,textarea}.tsx`.
649
+ **Added 2026-09-07**: this repo was missing from the list above (see the
650
+ correction under 0.7.0 Consumer action 2). Adopted on 0.10.0 — `card` and
651
+ `dialog` keep one-prop binding shims for this app's `lg` density and its
652
+ glass surface; everything else re-points straight at the package.
570
653
 
571
654
  Hosts that do not already import the stylesheets must, or the new structural
572
655
  rules do nothing:
package/README.md CHANGED
@@ -5,9 +5,28 @@ The small, semantic UI foundation shared by AI Matrx React applications — prim
5
5
  **Controls:** Button, Badge, Label, Separator, the Input family, the Textarea family, Checkbox, Switch, RadioGroup, Slider, Toggle + ToggleGroup, Avatar, Progress.
6
6
  **Surfaces:** Card, Table, Tabs, Accordion, Collapsible, ScrollArea, Popover, Tooltip, HoverCard, Sheet, Dialog, AlertDialog, Drawer, BottomSheet + TabbedBottomSheet, Alert, Resizable, Skeleton.
7
7
  **Menus:** DropdownMenu, ContextMenu, Command / CommandDialog, Select, CreatablePicker.
8
- **Composed:** EditableLabel, SegmentedControl, ScoreRing, OverflowToolbar.
8
+ **Composed:** EditableLabel, SegmentedControl, ScoreRing, OverflowToolbar, ConfirmDialog + ConfirmDialogHost.
9
9
  **Hooks + utilities:** `useScrollFade`, `useIsMobile`, `usePortalContainer`, `useDialogContainer`, `useDrawerDirection`, `cn`.
10
10
 
11
+ **The confirm dialog lives here; the imperative `confirm()` lives in `@ai-matrx/kit`.** Since 0.11.0 / kit 0.9.0 the surface is one implementation, in the package that owns AlertDialog, the motion layer and the overlay scrim token. Mount the host once near your provider root and call `confirm()` from anywhere — they share one registry through a `globalThis` slot:
12
+
13
+ ```tsx
14
+ // app root, once
15
+ import { ConfirmDialogHost } from "@ai-matrx/design-system";
16
+ <ConfirmDialogHost />
17
+
18
+ // anywhere — a thunk, a util, a click handler
19
+ import { confirm } from "@ai-matrx/kit/confirm-opener";
20
+ if (!(await confirm({
21
+ title: "Re-run research",
22
+ description: "This discards the 14 pages you already have (~$50 and 10 minutes) and starts over.",
23
+ variant: "destructive",
24
+ confirmLabel: "Discard and re-run",
25
+ }))) return;
26
+ ```
27
+
28
+ Use the declarative `<ConfirmDialog open … busy />` inline instead when the dialog must stay open with a spinner while async work finishes. Name the consequence: a confirmation that says only "Are you sure?" does not satisfy the platform's destructive-and-expensive-actions law.
29
+
11
30
  **The Tooltip lives here, and only here.** `@ai-matrx/tap-target` used to ship its own copy; since design-system 0.7.0 / tap-target 0.2.0 it consumes this one and re-exports nothing.
12
31
 
13
32
  Where hosts had forked a primitive over DENSITY, density is a prop, not a fork: `Card size="sm|md|lg"`, `Table size="sm|md"`, `Accordion size="sm|md"`, `Switch`/`Avatar`/`Checkbox`/`Slider`/`RadioGroup`/`Toggle` `size`, `ResizableHandle size="xs".."4xl"`. It is declared once on the root and every item reads it from context, so a card cannot mix paddings and a radio group cannot mix control sizes.