@ai-matrx/design-system 0.60.0 → 0.60.6

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.
@@ -0,0 +1,875 @@
1
+ import * as SwitchPrimitives from '@radix-ui/react-switch';
2
+ import * as React from 'react';
3
+ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
4
+ import * as TooltipPrimitive from '@radix-ui/react-tooltip';
5
+ import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
6
+ import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
7
+ import * as DialogPrimitive from '@radix-ui/react-dialog';
8
+ import * as PopoverPrimitive from '@radix-ui/react-popover';
9
+ import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
10
+
11
+ /**
12
+ * Switch — Radix switch, one implementation, two sizes.
13
+ *
14
+ * The four forks were the same control with two different tracks: a 16px track
15
+ * with a visible border and an overhanging thumb (matrx-frontend) and a 20px
16
+ * track with a transparent border and an inset thumb (matrx-extend, dashboard,
17
+ * workflow-studio). Both stay reachable through `size`, so no host has to keep
18
+ * a copy to keep its look:
19
+ *
20
+ * sm → h-4 track, bordered, thumb sits proud of the rail
21
+ * md → h-5 track, transparent border, thumb sits inside (the default)
22
+ *
23
+ * The unchecked track reads `bg-input`, the token that exists for exactly this
24
+ * — workflow-studio's fork used `bg-muted`, which is the surface token and
25
+ * makes an off switch disappear into a muted panel.
26
+ */
27
+
28
+ type SwitchSize = "sm" | "md";
29
+ interface SwitchProps extends React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root> {
30
+ /** Track size. Default `md`. */
31
+ size?: SwitchSize;
32
+ }
33
+ declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>>;
34
+
35
+ /**
36
+ * Checkbox — Radix checkbox, and the indeterminate ruling that came with it.
37
+ *
38
+ * RADIX RENDERS THE INDICATOR FOR BOTH `checked` AND `"indeterminate"`. The
39
+ * stock shadcn body puts a full check inside it either way, so a half-selected
40
+ * "select all" tells the user every row is selected — a screen stating
41
+ * something false. The two states get different glyphs here, always.
42
+ *
43
+ * `size` carries the two boxes the hosts had forked into: matrx-frontend's
44
+ * dense 14px control and the stock 16px one.
45
+ */
46
+
47
+ type CheckboxSize = "sm" | "md";
48
+ interface CheckboxProps extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> {
49
+ /** Box size. Default `md` (the stock 16px control); `sm` is the dense 14px one. */
50
+ size?: CheckboxSize;
51
+ }
52
+ declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLButtonElement>>;
53
+
54
+ /**
55
+ * Tooltip — the ONE tooltip in the fleet.
56
+ *
57
+ * THE COLLAPSE (0.6.0). Two implementations existed: matrx-frontend's
58
+ * `components/ui/tooltip.tsx` (182 import sites) and `@ai-matrx/tap-target`'s
59
+ * `src/tooltip.tsx` — the latter an explicit inlined PORT of the former,
60
+ * carrying a header that said so. tap-target shipped it only because its ~60
61
+ * tap buttons need a tooltip and no shared package owned one; four repos then
62
+ * adopted `TooltipProvider` from tap-target. That made tap-target — a
63
+ * button-geometry package — the accidental owner of a design-system primitive,
64
+ * with a second copy living in the biggest host.
65
+ *
66
+ * A tooltip is a design-system surface, so it lives here. tap-target now takes
67
+ * `@ai-matrx/design-system` as an ordinary sibling dependency and imports this
68
+ * file; its own copy is deleted, and its re-export removed. The DAG already
69
+ * ordered design-system before tap-target, so no cycle is introduced.
70
+ *
71
+ * BEHAVIOUR is matrx-frontend's, verbatim, including the ruling both copies
72
+ * carried in prose:
73
+ *
74
+ * 1. THE ROOT RENDERS UNCONDITIONALLY — no hydration mount gate. The gate the
75
+ * host wrapper once carried ("Radix generates dynamic aria-controls ids that
76
+ * differ between SSR and client") was false: Radix ids come from React's
77
+ * SSR-stable `useId`. It was actively harmful — a Trigger wraps
78
+ * ALWAYS-VISIBLE content, so `return null` deleted that subtree from SSR and
79
+ * the first client paint.
80
+ *
81
+ * 2. THE SURFACE IS TOKEN-DRIVEN, NOT BRANDED. Popover tokens, not
82
+ * `bg-primary`: rich tooltip content using `text-muted-foreground` was
83
+ * illegible on a brand-coloured background in one theme or the other.
84
+ * Since 2026-09-28 the `.matrx-tooltip` class re-scopes those tokens to a dark,
85
+ * high-contrast chip in both themes (styles.css, THE TOOLTIP SURFACE): the
86
+ * neutral white surface it wore before was indistinguishable from the
87
+ * browser's own `title` box.
88
+ *
89
+ * 3. EVERY `title` IS THIS TOOLTIP. The provider installs the title takeover
90
+ * (`title-tooltips.ts`), so a hand-written `title=` anywhere in the
91
+ * document shows this surface, never the browser's.
92
+ *
93
+ * SEAM INVERSION. The host resolved nested portal targets through
94
+ * `useNestedPortalContainer` (an app hook wired to its dialog + window-panel
95
+ * systems); tap-target's port dropped that seam entirely and always portalled
96
+ * to `document.body` — which is why a tooltip inside a popped-out panel landed
97
+ * in the wrong window. Here it is the package's `PortalContainerProvider`
98
+ * seam: an explicit `container` prop wins, then the injected container, then
99
+ * `document.body`. Both prior behaviours are reachable; neither is forked.
100
+ */
101
+
102
+ interface TooltipProviderProps extends React.ComponentProps<typeof TooltipPrimitive.Provider> {
103
+ /**
104
+ * THE TITLE TAKEOVER (2026-09-28) — while any provider is mounted, every native
105
+ * `title` attribute in the document shows as this tooltip instead of the
106
+ * browser's (see `title-tooltips.ts`). On by default, because a rule every
107
+ * author must remember is a rule that is broken; pass `false` only for a
108
+ * surface that must keep the browser's own box. One provider opting out does
109
+ * not turn it off while another one is mounted.
110
+ */
111
+ titleTooltips?: boolean;
112
+ }
113
+ /**
114
+ * Mount once near the app root. Every tooltip in the tree shares its
115
+ * `delayDuration` / `skipDelayDuration` timing, and the root provider takes
116
+ * over native `title` attributes (see `titleTooltips`).
117
+ */
118
+ declare function TooltipProvider({ titleTooltips, ...props }: TooltipProviderProps): React.JSX.Element;
119
+ declare const Tooltip: React.FC<TooltipPrimitive.TooltipProps>;
120
+ /**
121
+ * Stamps `data-matrx-tooltip-trigger` so the title takeover never draws a
122
+ * second tooltip over a control that already has this one — it still lifts a
123
+ * `title` on the same control, so the browser's box never doubles it either.
124
+ */
125
+ declare const TooltipTrigger: React.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
126
+ interface TooltipContentProps extends React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> {
127
+ /**
128
+ * Explicit portal target; wins over the injected `PortalContainerProvider`
129
+ * value. Pass `null` to force `document.body`.
130
+ */
131
+ container?: HTMLElement | null;
132
+ /**
133
+ * Package-owned open/close motion. Default `true`. Pass `false` for a
134
+ * surface that must appear instantly. It is NOT the reduced-motion switch;
135
+ * `styles.css` already honours `prefers-reduced-motion`.
136
+ */
137
+ animated?: boolean;
138
+ }
139
+ declare const TooltipContent: React.ForwardRefExoticComponent<TooltipContentProps & React.RefAttributes<HTMLDivElement>>;
140
+
141
+ /**
142
+ * DropdownMenu — Radix dropdown with two behaviours the stock body lacks.
143
+ *
144
+ * 1. THE ROOT RENDERS UNCONDITIONALLY — no hydration mount gate. A wrapper in
145
+ * matrx-frontend once deferred rendering until after hydration on a false
146
+ * premise (Radix ids come from React's SSR-stable `useId`), which deleted
147
+ * the always-visible trigger — buttons, `…` menus — from SSR and the first
148
+ * client paint.
149
+ *
150
+ * 2. A LONG MENU SCROLLS INSTEAD OF GROWING OFF-SCREEN. Content and SubContent
151
+ * cap at `--radix-dropdown-menu-content-available-height` — the space Radix
152
+ * actually measured between the trigger and the viewport edge — and scroll
153
+ * past it. Without the cap a menu longer than the viewport puts its last
154
+ * items where no pointer can reach them, and on a short window that can be
155
+ * the only exit from the surface.
156
+ *
157
+ * Portalling goes through the package's `usePortalContainer` seam, so a menu
158
+ * opened inside a Dialog mounts INSIDE the dialog (staying in the scroll
159
+ * shard, where its wheel events work) instead of at `document.body`. An
160
+ * explicit `container` prop still wins.
161
+ *
162
+ * Icons are the package's inlined SVGs (C19) — no icon-library dependency.
163
+ */
164
+
165
+ declare const DropdownMenu: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
166
+ declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
167
+ declare const DropdownMenuGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
168
+ declare const DropdownMenuPortal: React.FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
169
+ declare const DropdownMenuSub: React.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
170
+ declare const DropdownMenuRadioGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
171
+ declare const DropdownMenuSubTrigger: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
172
+ inset?: boolean;
173
+ } & React.RefAttributes<HTMLDivElement>>;
174
+ /**
175
+ * A SUBMENU OPENS BESIDE ITS PARENT, NEVER ON TOP OF IT (merged-grid review 2, C1: "nested
176
+ * submenus overlap the parent menu"). The submenu was drawn INSIDE the parent's surface, and that
177
+ * surface's entry animation leaves a `transform` on it — which makes the parent the containing
178
+ * block of the submenu's `position: fixed`. Radix measured the submenu's place in viewport
179
+ * coordinates and the browser applied them from the parent's corner, so it landed over the parent
180
+ * (and was clipped by the parent's scroll box). Portalled like every other surface, through the
181
+ * same container seam, it sits beside its trigger as Radix placed it.
182
+ */
183
+ declare const DropdownMenuSubContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
184
+ container?: HTMLElement | null;
185
+ } & React.RefAttributes<HTMLDivElement>>;
186
+ interface DropdownMenuContentProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> {
187
+ /** Explicit portal target; wins over the injected container. */
188
+ container?: HTMLElement | null;
189
+ }
190
+ declare const DropdownMenuContent: React.ForwardRefExoticComponent<DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>>;
191
+ declare const DropdownMenuItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
192
+ inset?: boolean;
193
+ } & React.RefAttributes<HTMLDivElement>>;
194
+ declare const DropdownMenuCheckboxItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
195
+ declare const DropdownMenuRadioItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuRadioItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
196
+ declare const DropdownMenuLabel: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
197
+ inset?: boolean;
198
+ } & React.RefAttributes<HTMLDivElement>>;
199
+ declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
200
+ declare const DropdownMenuShortcut: {
201
+ ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): React.JSX.Element;
202
+ displayName: string;
203
+ };
204
+
205
+ /**
206
+ * ContextMenu — the right-click menu primitive.
207
+ *
208
+ * THE ROOT RENDERS UNCONDITIONALLY — no hydration mount gate. The gate a
209
+ * matrx-frontend wrapper once carried ("Radix generates dynamic aria-controls
210
+ * ids that differ between SSR and client") was false twice over: a CLOSED
211
+ * `ContextMenuTrigger` renders only `data-state` / `data-disabled` and emits
212
+ * no id at all, so there was never a mismatch to defend against. And the gate
213
+ * was actively harmful: the Trigger wraps ALWAYS-VISIBLE content, so `return
214
+ * null` deleted the wrapped subtree from the server render and the first
215
+ * client render — around a list row, that means the list paints EMPTY and
216
+ * fills in after hydration. Gating the Root would additionally orphan any
217
+ * Trigger rendered beneath it.
218
+ *
219
+ * That history is exactly why this belongs in the package: the same repo had
220
+ * already accumulated two copies of this wrapper, one gated and one not, with
221
+ * the CORRECT one sitting unused beside the defective one.
222
+ *
223
+ * This is the PRIMITIVE only. A host's actual right-click menu SYSTEM — the
224
+ * sections, the copy/export/convert actions, the surface registry — composes
225
+ * these parts and stays host-owned; nothing here knows what an action is.
226
+ *
227
+ * Portalling goes through the package's `usePortalContainer` seam so a menu
228
+ * raised inside a Dialog mounts inside it; an explicit `container` wins.
229
+ */
230
+
231
+ declare const ContextMenu: React.FC<ContextMenuPrimitive.ContextMenuProps>;
232
+ declare const ContextMenuTrigger: React.ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuTriggerProps & React.RefAttributes<HTMLSpanElement>>;
233
+ declare const ContextMenuGroup: React.ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
234
+ declare const ContextMenuPortal: React.FC<ContextMenuPrimitive.ContextMenuPortalProps>;
235
+ declare const ContextMenuSub: React.FC<ContextMenuPrimitive.ContextMenuSubProps>;
236
+ declare const ContextMenuRadioGroup: React.ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
237
+ declare const ContextMenuSubTrigger: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
238
+ inset?: boolean;
239
+ } & React.RefAttributes<HTMLDivElement>>;
240
+ /** Portalled like its parent, so it opens BESIDE it — see `DropdownMenuSubContent` for why. */
241
+ declare const ContextMenuSubContent: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
242
+ container?: HTMLElement | null;
243
+ } & React.RefAttributes<HTMLDivElement>>;
244
+ interface ContextMenuContentProps extends React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Content> {
245
+ /** Explicit portal target; wins over the injected container. */
246
+ container?: HTMLElement | null;
247
+ }
248
+ declare const ContextMenuContent: React.ForwardRefExoticComponent<ContextMenuContentProps & React.RefAttributes<HTMLDivElement>>;
249
+ declare const ContextMenuItem: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
250
+ inset?: boolean;
251
+ } & React.RefAttributes<HTMLDivElement>>;
252
+ declare const ContextMenuCheckboxItem: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
253
+ declare const ContextMenuRadioItem: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuRadioItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
254
+ declare const ContextMenuLabel: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
255
+ inset?: boolean;
256
+ } & React.RefAttributes<HTMLDivElement>>;
257
+ declare const ContextMenuSeparator: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
258
+ declare const ContextMenuShortcut: {
259
+ ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): React.JSX.Element;
260
+ displayName: string;
261
+ };
262
+
263
+ /**
264
+ * Dialog — the modal surface, carrying every ruling the host forks paid for.
265
+ *
266
+ * Four hosts shipped four dialogs. Three were the stock shadcn body: a
267
+ * fixed-size centered card with `overflow: visible`. matrx-frontend's had been
268
+ * hardened, incident by incident, and those hardenings are the reason this
269
+ * component belongs in the package rather than being copied a fifth time:
270
+ *
271
+ * 1. THE ROOT RENDERS UNCONDITIONALLY — no hydration mount gate. The gate a
272
+ * wrapper once carried ("Radix ids differ between SSR and client") was
273
+ * false — Radix ids come from React's SSR-stable `useId` — and it deleted
274
+ * the always-visible Trigger from SSR and the first client paint.
275
+ *
276
+ * 2. THE DIALOG IS CLAMPED TO THE VIEWPORT AND SCROLLS INSIDE ITSELF. Proven
277
+ * live: an admin "Create Category" dialog rendered 851px tall in a 657px
278
+ * viewport with `overflow-y: visible`, so its Create button sat below the
279
+ * fold, unreachable. The only way out was a backdrop click — which
280
+ * dismisses WITHOUT writing, and is indistinguishable from a silent save
281
+ * failure. `max-h-[85dvh] overflow-y-auto` is the cap.
282
+ *
283
+ * 3. THE PRIMARY ACTION IS ALWAYS PRESSABLE — AND NEVER ON TOP OF THE BODY.
284
+ * `DialogFooter` is sticky and bleeds to the card's edges using
285
+ * `--dialog-pad`. Until 0.11.3 that bleed was a NEGATIVE BLOCK MARGIN,
286
+ * which sticky clamps: the footer was dragged up over the row above it by
287
+ * `--dialog-pad` minus the card gap. The card now RESERVES the footer's
288
+ * block size instead (`.matrx-dialog-card` in `styles.css` hands its bottom
289
+ * padding to the footer), so scrolled content never shows through beneath
290
+ * the actions AND the footer never covers the row above it. Outside a
291
+ * DialogContent both variables are unset, the padding falls back to `0px`,
292
+ * and the footer is the plain row it always was.
293
+ *
294
+ * 4. ON MOBILE THE SAME DIALOG IS A BOTTOM SHEET — full width, bottom
295
+ * anchored, height-capped, internally scrollable, safe-area padded. Opt out
296
+ * with `mobileSheet={false}` only for the rare surface that must stay
297
+ * centered (a tiny spinner). The sheet geometry is re-asserted AFTER the
298
+ * caller's className so a desktop `max-w-2xl` cannot un-fullscreen it.
299
+ *
300
+ * 5. AN UNTITLED DIALOG IS STILL ACCESSIBLE. Radix warns (correctly) that
301
+ * every dialog needs a title; rather than let hosts ship the warning, a
302
+ * visually-hidden title is injected when the tree has none, and
303
+ * `aria-describedby` is dropped when there is no description rather than
304
+ * pointing at nothing.
305
+ *
306
+ * 6. ON DESKTOP A DIALOG IS A WINDOW, NOT A WALL (0.38.0, Arman 2026-09-23:
307
+ * "none of the built-in page ai integrations are accessible because the
308
+ * page is totally blocked"). Unless the caller passes `modal`, a desktop
309
+ * dialog does not block the page: no overlay, the page, the Agents menu,
310
+ * the assist dock and right-click AI stay usable beside it. It behaves like
311
+ * a window: a click outside never closes it (`dismissOnOutsideClick` opts a
312
+ * quick picker back in), Escape closes it only while focus is inside it
313
+ * (Escape in the page belongs to the page), and its `DialogHeader` drags
314
+ * it, clamped on screen, double-click to recenter. On a phone it stays the
315
+ * blocking bottom sheet — nothing useful sits behind a sheet. Confirmations
316
+ * are `AlertDialog`, a different component, and stay blocking. This is a
317
+ * LIGHT window: the host's heavy window manager (tray, persistence) is a
318
+ * separate system and must not be pulled into every dialog.
319
+ *
320
+ * SEAM INVERSIONS. The host original resolved its portal target through
321
+ * app-shaped hooks (a popped-out window-panel body). Here that is the
322
+ * package's `PortalContainerProvider` seam, with an explicit `container` prop
323
+ * keeping top priority. And DialogContent PROVIDES that seam to its own
324
+ * children, so a Popover or menu opened inside a dialog portals INTO the
325
+ * dialog — staying inside the scroll shard, where its wheel events work.
326
+ * `useDialogContainer` exposes the same element for host code that needs it.
327
+ */
328
+
329
+ declare const Dialog: {
330
+ ({ children, ...props }: React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>): React.JSX.Element;
331
+ displayName: string;
332
+ };
333
+ declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
334
+ declare const DialogClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
335
+ /**
336
+ * Portal-seam-aware DialogPortal. An explicit `container` always wins; with
337
+ * none, the injected `PortalContainerProvider` value decides; with neither,
338
+ * Radix's `document.body`.
339
+ */
340
+ declare const DialogPortal: {
341
+ ({ container, ...props }: Omit<React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>, "container"> & {
342
+ /** `undefined` → use the injected container; `null` → force document.body. */
343
+ container?: HTMLElement | null | undefined;
344
+ }): React.JSX.Element;
345
+ displayName: string;
346
+ };
347
+ /** The DialogContent element, for host code that portals into the dialog. */
348
+ declare const useDialogContainer: () => HTMLElement | null;
349
+ declare const DialogOverlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
350
+ /**
351
+ * Unstyled, non-portalling Content for custom dialog layouts. Preserves Radix
352
+ * focus/background behavior and derives `aria-modal` from the Root.
353
+ */
354
+ declare const DialogContentPrimitive: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
355
+ interface DialogContentProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> {
356
+ /**
357
+ * Windowed (non-blocking) dialogs never close from a click outside them —
358
+ * the person is reaching for the page or an AI control beside the window.
359
+ * Pass `true` for a quick picker that should close when the person clicks
360
+ * away. Ignored on a blocking dialog, which keeps Radix's behaviour.
361
+ */
362
+ dismissOnOutsideClick?: boolean;
363
+ /** Render as a bottom sheet below the mobile breakpoint. Default `true`. */
364
+ mobileSheet?: boolean;
365
+ /** Render the built-in close control. Default `true`. */
366
+ showCloseButton?: boolean;
367
+ /** Explicit portal target; wins over the injected container. */
368
+ container?: HTMLElement | null;
369
+ /**
370
+ * Package-owned open/close motion. Default `true`. Pass `false` for a
371
+ * surface that must appear instantly. It is NOT the reduced-motion switch;
372
+ * `styles.css` already honours `prefers-reduced-motion`.
373
+ */
374
+ animated?: boolean;
375
+ }
376
+ declare const DialogContent: React.ForwardRefExoticComponent<DialogContentProps & React.RefAttributes<HTMLDivElement>>;
377
+ declare const DialogHeader: {
378
+ ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
379
+ displayName: string;
380
+ };
381
+ declare const DialogFooter: {
382
+ ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
383
+ displayName: string;
384
+ };
385
+ declare const DialogTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
386
+ declare const DialogDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
387
+
388
+ /**
389
+ * ConfirmDialog — the `window.confirm` replacement, declarative half.
390
+ *
391
+ * WHY IT LIVES HERE AND NOT IN `@ai-matrx/kit` (census row 19i, decided by the
392
+ * package-graph ruling of 2026-09-07, on the row-20a Tooltip precedent).
393
+ *
394
+ * kit shipped this dialog with its own inlined AlertDialog, its own inlined
395
+ * button class strings, a hardcoded 80%-opaque black scrim, and
396
+ * `data-[state=open]:animate-in … zoom-in-95 … slide-in-from-top-[48%]` —
397
+ * host-plugin utilities `tailwindcss-animate`/`tw-animate-css` supply and a
398
+ * package cannot ship. kit ships NO stylesheet at all, so in three of the four
399
+ * consumers the most consequential surface in the app (the one standing
400
+ * between a user and a destroyed thing) appeared with no animation, no error,
401
+ * and a scrim that ignored the theme. kit could not import the fix:
402
+ * `@ai-matrx/design-system` depends on `@ai-matrx/kit`, so importing back is a
403
+ * cycle; giving kit its own sheet would invent a second required-CSS contract
404
+ * no consumer performs (the C26 silent host contract, one layer down).
405
+ *
406
+ * The resolution is the one row 20a already proved: the surface moves to the
407
+ * package that owns the surface. This file is built on THIS package's
408
+ * `AlertDialog` — so it inherits, for free and forever:
409
+ *
410
+ * - the package motion layer (`matrx-motion-overlay` / `matrx-motion-dialog`),
411
+ * whose rules ship in `styles.css` and are proven present in the tarball;
412
+ * - `--matrx-overlay-scrim`, a token that answers to the host's theme,
413
+ * instead of an opaque black literal;
414
+ * - AlertDialog ruling 3 — clamped to `max-h-[85dvh]`, scrolling inside
415
+ * itself, with a sticky footer. **This is what makes the consequence-first
416
+ * copy law survivable**: a confirmation that names everything it is about
417
+ * to destroy can be long, and in kit's copy a long one pushed Cancel and
418
+ * Continue below the fold of a short viewport with no backdrop dismissal —
419
+ * a dead end on a destructive action;
420
+ * - `buttonVariants` as the ONE source of button appearance, including the
421
+ * 44px coarse-pointer target;
422
+ * - `PortalContainerProvider`, so a dialog opened inside a popped-out window
423
+ * panel renders in THAT window's document.
424
+ *
425
+ * kit keeps `./confirm-opener` — the pure, React-free imperative `confirm()`
426
+ * and its `globalThis`-slotted host registry — and re-exports nothing of this.
427
+ * Consumers mount `<ConfirmDialogHost />` from here and call `confirm()` from
428
+ * there. See `confirm-host.tsx` for the join.
429
+ *
430
+ * BEHAVIOR IS THE KIT PORT, VERBATIM. Every prop, default and interaction is
431
+ * unchanged; only the chrome underneath it is the package's.
432
+ *
433
+ * Pattern: hold the pending target in state, render `<ConfirmDialog />` once at
434
+ * the bottom of the component, and open it by setting the target. When busy
435
+ * state is meaningful (a network delete that should hold the dialog open with a
436
+ * spinner), use THIS component inline; the imperative `confirm()` closes
437
+ * immediately on click.
438
+ */
439
+
440
+ interface ConfirmDialogProps {
441
+ open: boolean;
442
+ onOpenChange: (open: boolean) => void;
443
+ title: React.ReactNode;
444
+ /**
445
+ * THE CONSEQUENCE. Per the platform's destructive-and-expensive-actions law,
446
+ * a confirmation must name what is lost, what is duplicated, and/or what it
447
+ * costs — "Are you sure?" is not a confirmation. This renders as the dialog's
448
+ * accessible description, so a screen-reader user is told the consequence
449
+ * too, and it is never clamped or truncated.
450
+ */
451
+ description?: React.ReactNode | undefined;
452
+ /**
453
+ * Rich body rendered between the header and the footer. Use it for
454
+ * supplementary or interactive content that is not part of the dialog's
455
+ * accessible consequence description.
456
+ */
457
+ content?: React.ReactNode | undefined;
458
+ /** Extra classes for the dialog content (e.g. a wider max-w for diffs). */
459
+ contentClassName?: string | undefined;
460
+ confirmLabel?: string | undefined;
461
+ /**
462
+ * `null` hides the cancel button entirely — for acknowledge-only dialogs
463
+ * where there is nothing to cancel. Anything else labels it.
464
+ */
465
+ cancelLabel?: string | null | undefined;
466
+ variant?: "default" | "destructive" | undefined;
467
+ busy?: boolean | undefined;
468
+ /**
469
+ * Blocks confirming without pretending work is in flight. For a dialog whose
470
+ * `content` asks the user something the action cannot proceed without — the
471
+ * choice is missing, not loading — `busy` would show a misleading spinner.
472
+ */
473
+ confirmDisabled?: boolean | undefined;
474
+ /**
475
+ * The question is not answerable yet — Confirm is ABSENT, not disabled (a
476
+ * control is absent or honest, never dead). The body carries its own loading
477
+ * state; Cancel stays. Set by `ConfirmDialogHost` while `ConfirmOptions.ready`
478
+ * is pending (0.54.0).
479
+ */
480
+ confirmHeld?: boolean | undefined;
481
+ /**
482
+ * Explicit portal target. Default (undefined): the container injected by
483
+ * `PortalContainerProvider`, else `document.body`. Hosts with retargeting
484
+ * needs (a popped-out browser window whose dialog must render in THAT
485
+ * window's document) may still pass the element directly.
486
+ */
487
+ portalContainer?: HTMLElement | null | undefined;
488
+ onConfirm: () => void | Promise<void>;
489
+ }
490
+ /**
491
+ * Drop-in replacement for `window.confirm`. Use this anywhere you would
492
+ * otherwise reach for a browser-level confirm dialog.
493
+ */
494
+ declare function ConfirmDialog({ open, onOpenChange, title, description, content, contentClassName, confirmLabel, cancelLabel, variant, busy, confirmDisabled, confirmHeld, portalContainer, onConfirm, }: ConfirmDialogProps): React.JSX.Element;
495
+
496
+ declare function ConfirmDialogHost(): React.JSX.Element;
497
+
498
+ /**
499
+ * Popover — ported verbatim from matrx-frontend `components/ui/popover.tsx`.
500
+ *
501
+ * Seam inversion: the host's `useNestedPortalContainer` (dialog/popout aware)
502
+ * becomes the injected `PortalContainerProvider` seam (`portal-container.tsx`);
503
+ * the explicit `container` prop keeps top priority, exactly as before.
504
+ *
505
+ * THE ROOT RENDERS UNCONDITIONALLY — no mount gate. This wrapper used to defer
506
+ * rendering until after hydration ("Radix generates dynamic aria-controls ids
507
+ * that differ between SSR and client"), and that justification was false:
508
+ * Radix ids come from React's SSR-stable `useId` (verified against
509
+ * @radix-ui/react-popover 1.1.17 / react-id 1.1.2). The gate was actively
510
+ * harmful — the Trigger wraps ALWAYS-VISIBLE content, so `return null`
511
+ * deleted it from SSR and the first client paint.
512
+ */
513
+
514
+ declare const Popover: React.FC<PopoverPrimitive.PopoverProps>;
515
+ declare const PopoverTrigger: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & React.RefAttributes<HTMLButtonElement>>;
516
+ declare const PopoverAnchor: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverAnchorProps & React.RefAttributes<HTMLDivElement>>;
517
+ interface PopoverContentProps extends React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content> {
518
+ /** Explicit portal target; wins over the injected container. */
519
+ container?: HTMLElement | null;
520
+ /**
521
+ * Package-owned open/close motion. Default `true`. Pass `false` for a
522
+ * surface that must appear instantly — a picker re-anchoring while the user
523
+ * types, a measurement pass. It is NOT the reduced-motion switch;
524
+ * `styles.css` already honours `prefers-reduced-motion`.
525
+ */
526
+ animated?: boolean;
527
+ /**
528
+ * HOW WIDE THE POPOVER IS ALLOWED TO BE, and it is the SYSTEM that decides — never a
529
+ * surface pasting its own `w-64` over the default (lane FIX-14, 2026-09-22).
530
+ *
531
+ * `"fixed"` (default) is the historical `w-72`: right for a menu of short, known
532
+ * labels, where a ragged edge would look broken.
533
+ *
534
+ * `"content"` is for a popover whose whole job is to SHOW SOMETHING THE SYSTEM DID
535
+ * NOT CHOOSE — a person's name, a record's title, a row the user is about to
536
+ * create. The relation picker offered
537
+ *
538
+ * Create “Marisol Okonkwo — 418 Calle Pu
539
+ *
540
+ * inside a 16rem box, cut mid-word, on the one control that exists to show the name
541
+ * being created. A fixed width cannot be right for content of unknown length, so
542
+ * this one grows to its content between an honest floor and an honest ceiling:
543
+ *
544
+ * · at least the trigger's own width, and at least 20rem — the width Airtable's and
545
+ * Notion's link-record pickers settle on, and wide enough that an ordinary
546
+ * "name — street, town" fits on one line;
547
+ * · at most 28rem, and never wider than the viewport less a 1rem gutter each side,
548
+ * so it still fits a 375px phone with nothing running off the screen. The floor is
549
+ * clamped by the same gutter, so on a very narrow screen the ceiling still wins.
550
+ *
551
+ * Beyond that ceiling the CONTENT truncates with an ellipsis and carries a `title`.
552
+ * Growing, then ellipsis — never a mid-word cut.
553
+ *
554
+ * BOTH modes keep the phone gutter (2026-09-26): the box is never wider than the
555
+ * viewport less 1rem each side, and Radix keeps it `collisionPadding` (16px) off every
556
+ * screen edge. Measured at 375px before this: `w-72`/`w-80` callers landed flush on
557
+ * the right edge (55→375) because collision padding was 0.
558
+ */
559
+ sizing?: "fixed" | "content";
560
+ }
561
+ declare const PopoverContent: React.ForwardRefExoticComponent<PopoverContentProps & React.RefAttributes<HTMLDivElement>>;
562
+
563
+ /**
564
+ * Collapsible — Radix's, with the one thing Radix does not ship: the open/close
565
+ * transition.
566
+ *
567
+ * THE ROOT RENDERS UNCONDITIONALLY — no mount gate. The matrx-frontend
568
+ * original carried the note that earned this line: a wrapper used to defer
569
+ * rendering until after hydration on the theory that "Radix generates dynamic
570
+ * aria-controls ids that differ between SSR and client". That was false —
571
+ * Radix ids come from React's SSR-stable `useId` — and the gate was actively
572
+ * harmful, because a Collapsible's Trigger wraps ALWAYS-VISIBLE content, so
573
+ * `return null` deleted it from SSR and from the first client paint.
574
+ *
575
+ * THE TRANSITION IS PACKAGE-OWNED (census row 19f, the tail of 19c). Until
576
+ * 0.9.0 this file was a bare re-export and the package shipped NO transition,
577
+ * so every consumer invented its own — and two of them invented it wrong.
578
+ * `matrx-collapsible.tsx` and `enhanced-collapsible.tsx` put
579
+ * `animate-accordion-down`/`-up` on a COLLAPSIBLE panel: those keyframes
580
+ * interpolate to `--radix-ACCORDION-content-height`, a variable Radix never
581
+ * publishes on a collapsible, so they had never animated once — silently, with
582
+ * no error, for as long as they existed. Six other matrx-frontend components
583
+ * used host-only `animate-slide-down`/`-up` keyframes that WERE keyed
584
+ * correctly — and worked in exactly one app in the fleet, because the
585
+ * keyframes lived in that app's `globals.css`. Both shapes are the same C26
586
+ * failure: a component whose motion depends on a contract the host has to
587
+ * happen to hold. `.matrx-collapsible-content` in `styles.css` ends it — keyed
588
+ * off Radix's runtime `--radix-collapsible-content-height`, honouring
589
+ * `prefers-reduced-motion`, shipped in the tarball.
590
+ *
591
+ * Nothing else here is restyled: the trigger and the panel's own padding are
592
+ * the host's to dress, and every fork agreed on that. Unlike `AccordionContent`
593
+ * this component does NOT wrap children in a padding div — collapsibles in the
594
+ * fleet pad their own bodies, and inserting a box would move every one of them.
595
+ */
596
+
597
+ declare const Collapsible: React.ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleProps & React.RefAttributes<HTMLDivElement>>;
598
+ declare const CollapsibleTrigger: React.ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleTriggerProps & React.RefAttributes<HTMLButtonElement>>;
599
+ interface CollapsibleContentProps extends React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.CollapsibleContent> {
600
+ /**
601
+ * Animate the height on open/close. Default `true`.
602
+ *
603
+ * Pass `false` for the rare panel that must not clip or must not move: the
604
+ * animated panel carries `overflow-hidden` (a height transition without it
605
+ * spills the body over whatever is below), so a panel with a child that
606
+ * deliberately overflows its bounds — a non-portalled popover, a sticky
607
+ * column header — opts out here rather than fighting the class. Opting out
608
+ * gives you bare Radix: instant open, no clipping, no keyframes.
609
+ *
610
+ * `prefers-reduced-motion` is NOT this prop's job; the stylesheet already
611
+ * drops the animation for those users while keeping the clipping.
612
+ */
613
+ animated?: boolean;
614
+ }
615
+ declare const CollapsibleContent: React.ForwardRefExoticComponent<CollapsibleContentProps & React.RefAttributes<HTMLDivElement>>;
616
+
617
+ /**
618
+ * Skeleton — the "content is coming" placeholder.
619
+ *
620
+ * Ported from matrx-frontend `components/ui/skeleton.tsx`; no seams, pure
621
+ * markup over semantic tokens. ONE change from the original (0.10.0): the
622
+ * breathing loop is `.matrx-pulse`, a package-owned keyframe, not Tailwind's
623
+ * `animate-pulse`. A Skeleton that does not pulse is indistinguishable from an
624
+ * empty grey box — it stops saying "loading" and starts saying "nothing here"
625
+ * — so the motion is part of the component's meaning and ships with it (see
626
+ * `styles.css` § THE MOTION LAYER).
627
+ */
628
+
629
+ interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
630
+ /**
631
+ * Package-owned pulse. Default `true`. Pass `false` for a static
632
+ * placeholder — a print/PDF render, or a screenshot fixture where the
633
+ * animation makes the output non-deterministic. `prefers-reduced-motion`
634
+ * already SLOWS the pulse rather than stopping it (a still skeleton would
635
+ * lose the information), so this is not the accessibility switch.
636
+ */
637
+ animated?: boolean;
638
+ }
639
+ declare function Skeleton({ className, animated, ...props }: SkeletonProps): React.JSX.Element;
640
+
641
+ /**
642
+ * A 6 px status mark. Tones read semantic tokens (`--info` blue, `--warning` orange,
643
+ * `--destructive` red, `--success` green), so a host re-tints them with its own values.
644
+ * `ring` is the hollow variant for icon corners, where a filled dot reads as "unread".
645
+ */
646
+ type StatusTone = "info" | "warning" | "danger" | "success" | "neutral";
647
+ interface StatusDotProps extends React.HTMLAttributes<HTMLSpanElement> {
648
+ tone: StatusTone;
649
+ variant?: "solid" | "ring";
650
+ /** Accessible name; without it the dot is decorative. */
651
+ label?: string;
652
+ }
653
+ declare function StatusDot({ tone, variant, label, className, ...props }: StatusDotProps): React.JSX.Element;
654
+
655
+ /**
656
+ * The app rail: a narrow, never-changing strip of area icons on the far left, with the
657
+ * person at the bottom (Codex, VS Code, Slack, Teams). It answers "where am I"; the panel
658
+ * beside it answers "what can I do here". Width is the `--app-rail-width` knob (48 px).
659
+ */
660
+ declare function AppRail({ className, style, ...props }: React.HTMLAttributes<HTMLElement>): React.JSX.Element;
661
+ declare function AppRailGroup({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
662
+ /** Pushes everything after it to the bottom of the rail. */
663
+ declare function AppRailSpacer(): React.JSX.Element;
664
+ interface AppRailItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
665
+ icon: React.ReactNode;
666
+ label: string;
667
+ /** Shown in the tooltip after the label, e.g. "⌘1". */
668
+ shortcut?: string;
669
+ active?: boolean;
670
+ /** A hollow corner mark when the area needs attention; healthy areas carry none. */
671
+ attention?: StatusTone;
672
+ attentionLabel?: string;
673
+ }
674
+ declare const AppRailItem: React.ForwardRefExoticComponent<AppRailItemProps & React.RefAttributes<HTMLButtonElement>>;
675
+ interface AppRailAvatarProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
676
+ /** Up to two letters. Ignored when `children` is given. */
677
+ initials?: string;
678
+ label: string;
679
+ /** A glyph instead of initials (e.g. a neutral person while signed out). */
680
+ children?: React.ReactNode;
681
+ }
682
+ /** The person, at the bottom of the rail (Codex's initials circle). */
683
+ declare const AppRailAvatar: React.ForwardRefExoticComponent<AppRailAvatarProps & React.RefAttributes<HTMLButtonElement>>;
684
+
685
+ /**
686
+ * The canvas: a right-hand workspace of panels (terminal, files, browser, info) beside the
687
+ * main content, as in Claude desktop and Codex. Panels stack in columns, resize by dragging
688
+ * the gaps between them, and any one can expand to fill the whole canvas region.
689
+ *
690
+ * The layout is presentational: the host owns which panels are open, which is expanded and
691
+ * what each renders. The panel CHROME (CanvasPanel, CanvasPanelEmpty, BrowserTabs, BrowserBar)
692
+ * lives in @ai-matrx/canvas/react — the one canvas chrome; this package cannot depend on it
693
+ * (canvas → tap-target → design-system would be a cycle).
694
+ */
695
+ interface CanvasPanelDef {
696
+ id: string;
697
+ node: React.ReactNode;
698
+ /** Pixels (number) or percent of the column (string). */
699
+ minSize?: number | string;
700
+ defaultSize?: number | string;
701
+ }
702
+ interface CanvasColumnDef {
703
+ id: string;
704
+ panels: CanvasPanelDef[];
705
+ minSize?: number | string;
706
+ defaultSize?: number | string;
707
+ }
708
+ interface CanvasLayoutProps {
709
+ columns: CanvasColumnDef[];
710
+ /** When set, only this panel renders, filling the layout. */
711
+ expandedId?: string | null;
712
+ className?: string;
713
+ }
714
+ declare function CanvasLayout({ columns, expandedId, className }: CanvasLayoutProps): React.JSX.Element;
715
+
716
+ /**
717
+ * A small segmented group of icon buttons for switching the app's mode (Claude desktop's
718
+ * chat | code pair in the title bar). A radio group: arrow keys move, one is always checked.
719
+ */
720
+ interface ModeSwitchOption<T extends string> {
721
+ value: T;
722
+ label: string;
723
+ icon: React.ReactNode;
724
+ shortcut?: string;
725
+ }
726
+ interface ModeSwitchProps<T extends string> {
727
+ value: T;
728
+ onValueChange: (value: T) => void;
729
+ options: ReadonlyArray<ModeSwitchOption<T>>;
730
+ label?: string;
731
+ className?: string;
732
+ }
733
+ declare function ModeSwitch<T extends string>({ value, onValueChange, options, label, className }: ModeSwitchProps<T>): React.JSX.Element;
734
+
735
+ /**
736
+ * OrganizationPicker — THE ONE "which organization am I acting in" control,
737
+ * identical on every Matrx surface (the main app's user menu and header nudge,
738
+ * Workflow Studio's sidebar, the admin dashboard's settings).
739
+ *
740
+ * Ported from matrx-frontend `features/organizations/components/
741
+ * OrganizationPickerPanel.tsx` + `UserMenuOrgSection.tsx` + `DefaultOrgSwitch.tsx`
742
+ * (2026-09-08), which until then were the ONLY surfaces with the full picker;
743
+ * Studio and the dashboard each had a bare `<Select>` with different copy,
744
+ * different placement and no default control. Three UIs for one fact.
745
+ *
746
+ * THE ACTIVE ROW IS THE ANSWER (owner, 2026-10-01). The active organization is
747
+ * the highlighted row — tinted, bold, ringed and checked — and nothing else:
748
+ * the "Working in …" sentence above the list is gone ("It should be
749
+ * highlighted and clear"), and so is the "Keep it at the top" switch.
750
+ *
751
+ * FAVORITES (owner, 2026-10-01: "add a star you can click to favorite any of
752
+ * them"). Every row carries its own star; a person favorites as many as they
753
+ * like, and favorites are drawn first. The star never selects the row — it is
754
+ * a sibling button, not part of the row — and it picks no organization for
755
+ * anyone: which organization you are working in is this device's own
756
+ * remembered choice (the host's resolver), never a star.
757
+ *
758
+ * 🚨 A HUNDRED ROWS IS NOT A LIST (VERIFIER-8 MEDIUM-3, 2026-09-21).
759
+ * The first screen of the data product offered the admin account's 116
760
+ * organizations nine at a time, with no search, most of them lane fixtures.
761
+ * Three things answer that, and all three are here rather than in one host:
762
+ * • SEARCH over name and abbreviation, once the list passes eight rows.
763
+ * • TEST ORGANIZATIONS HIDDEN by default behind the platform's one
764
+ * archive-style disclosure (`ArchivedDisclosure`), with their count always
765
+ * on screen. Hidden, never dropped.
766
+ * • THE PERSON'S OWN organizations drawn first, under the starred one.
767
+ * The host classifies (`isTestFixture`, `isOwn`); this component decides
768
+ * nothing about a name it is given.
769
+ *
770
+ * Seam inversions from the origin: lucide `Check`/`Star` become package
771
+ * SVGs (C19); the host `Switch` becomes this package's; `cn` is local.
772
+ */
773
+
774
+ interface OrganizationPickerOrganization {
775
+ id: string;
776
+ name: string;
777
+ /** Database-validated 2–3 uppercase letters. Optional — not every report carries it. */
778
+ abbreviation?: string | null;
779
+ /**
780
+ * THE ADDRESS, for when the NAME is not enough — its slug, or whatever else the
781
+ * host has that tells two of them apart.
782
+ *
783
+ * 🚨 WHY (crew D2, 2026-09-21). Two organizations called "Kessler Lab for Applied
784
+ * Microbial Ecology" and two called "Wraithmoor Regional Museum of Art & Craft" sat
785
+ * in one list, identical down to the abbreviation tile, and a person had no way of
786
+ * knowing which one they were about to work in. The list drew the name and nothing
787
+ * else, so there was nothing for it to draw.
788
+ *
789
+ * It is shown ONLY on the rows whose name another row in the list also carries —
790
+ * the way Slack shows a workspace's URL and Google shows the account's email, and
791
+ * only where it settles the question. A list of distinct names stays exactly as it
792
+ * was, because a second line under every row is noise a person learns to skip.
793
+ */
794
+ distinguisher?: string | null;
795
+ /**
796
+ * This organization is a TEST FIXTURE — a lane's scratch organization, not a
797
+ * business anybody works in. Classified in `iam.organizations.settings`
798
+ * (`test_fixture`), never guessed from its name.
799
+ *
800
+ * 🚨 WHY (VERIFIER-8 MEDIUM-3, 2026-09-21). The admin account belongs to 116
801
+ * organizations and 59 of them are fixtures. The first screen of the data
802
+ * product offered all of them, nine at a time, with no search — so the two
803
+ * or three a person actually works in were buried under lane debris. The
804
+ * archived-items law already answers this shape everywhere else in the
805
+ * platform: hide by default, ONE disclosure to reveal, and the count of what
806
+ * is hidden is always on screen. It is hidden, never dropped: a fixture the
807
+ * person genuinely wants is one click away.
808
+ */
809
+ isTestFixture?: boolean;
810
+ /**
811
+ * The signed-in person created this organization. Drawn before the rest,
812
+ * under the starred one — the same reason Slack puts your own workspace
813
+ * first: in a list of a hundred, yours must not be something you search for.
814
+ */
815
+ isOwn?: boolean;
816
+ /**
817
+ * A short trailing label for the row — what a click does or the row's state
818
+ * ("Open", "Finish setup", "Turn on HR"). Muted text, right-aligned; the row
819
+ * stays one button. Omitted, the row is exactly as before.
820
+ */
821
+ detail?: string | null;
822
+ /**
823
+ * Fold this row behind the host's second disclosure (`foldedLabel`) — for rows
824
+ * the person rarely came for (organizations without HR). Hidden, counted,
825
+ * one click away; a search that matches only folded rows opens the fold.
826
+ */
827
+ folded?: boolean;
828
+ }
829
+ interface OrganizationPickerProps {
830
+ organizations: readonly OrganizationPickerOrganization[];
831
+ /** The organization the person is acting in right now; null = nothing chosen. */
832
+ activeOrganizationId: string | null;
833
+ /** The person's favorite organizations, drawn first and starred. */
834
+ favoriteOrganizationIds?: readonly string[];
835
+ loading?: boolean;
836
+ /** Memberships could not be read. The panel says so instead of showing an empty list. */
837
+ loadFailed?: boolean;
838
+ /** Choose the active organization. Hosts persist + refetch here. */
839
+ onSelect: (organization: OrganizationPickerOrganization) => void;
840
+ /**
841
+ * Favorite (true) or unfavorite (false) one organization. Omit to draw no
842
+ * star buttons — a host with no write path must not show a control that
843
+ * does nothing (a favorite is still marked, read-only).
844
+ */
845
+ onToggleFavorite?: ((organizationId: string, favorite: boolean) => void) | undefined;
846
+ /** Hide the "Organization" eyebrow when the host already labels the section. */
847
+ hideHeading?: boolean;
848
+ /** Extra classes on each row button (e.g. a host menu's item class). */
849
+ itemClassName?: string;
850
+ /** The noun on the disclosure that holds `folded` rows. Default "More". */
851
+ foldedLabel?: string;
852
+ className?: string;
853
+ }
854
+ declare function organizationColor(seed: string): {
855
+ background: string;
856
+ color: string;
857
+ };
858
+ /**
859
+ * THE organization mark — its own logo when it has one, otherwise its 2–3
860
+ * letter abbreviation on its colour tile (the first letter of the name when the
861
+ * report has no abbreviation, so a tile is never empty). Three letters get a
862
+ * smaller face than two so they fit the tile. Every Matrx surface draws this.
863
+ */
864
+ declare function OrganizationMark({ id, name, abbreviation, logoUrl, size, className, }: {
865
+ /** Seeds the colour; the name is used when absent. */
866
+ id?: string | null | undefined;
867
+ name: string;
868
+ abbreviation?: string | null | undefined;
869
+ logoUrl?: string | null | undefined;
870
+ size?: number;
871
+ className?: string | undefined;
872
+ }): React.JSX.Element;
873
+ declare function OrganizationPicker({ organizations, activeOrganizationId, favoriteOrganizationIds, loading, loadFailed, onSelect, onToggleFavorite, hideHeading, itemClassName, foldedLabel, className, }: OrganizationPickerProps): React.JSX.Element;
874
+
875
+ export { PopoverContent as $, AppRail as A, DialogFooter as B, type CanvasColumnDef as C, Dialog as D, DialogHeader as E, DialogTitle as F, DialogTrigger as G, DropdownMenu as H, DropdownMenuCheckboxItem as I, DropdownMenuContent as J, DropdownMenuGroup as K, DropdownMenuItem as L, DropdownMenuLabel as M, DropdownMenuRadioGroup as N, DropdownMenuRadioItem as O, DropdownMenuSeparator as P, DropdownMenuShortcut as Q, DropdownMenuSub as R, DropdownMenuSubContent as S, DropdownMenuSubTrigger as T, DropdownMenuTrigger as U, ModeSwitch as V, type ModeSwitchOption as W, type ModeSwitchProps as X, OrganizationMark as Y, Popover as Z, PopoverAnchor as _, AppRailAvatar as a, PopoverTrigger as a0, Skeleton as a1, StatusDot as a2, type StatusDotProps as a3, type StatusTone as a4, Switch as a5, type SwitchProps as a6, Tooltip as a7, TooltipContent as a8, type TooltipContentProps as a9, type SwitchSize as aA, type TooltipProviderProps as aB, useDialogContainer as aC, TooltipProvider as aa, TooltipTrigger as ab, organizationColor as ac, type CheckboxSize as ad, type CollapsibleContentProps as ae, ContextMenuCheckboxItem as af, type ContextMenuContentProps as ag, ContextMenuGroup as ah, ContextMenuLabel as ai, ContextMenuPortal as aj, ContextMenuRadioGroup as ak, ContextMenuRadioItem as al, ContextMenuSub as am, ContextMenuSubContent as an, ContextMenuSubTrigger as ao, DialogContentPrimitive as ap, type DialogContentProps as aq, DialogOverlay as ar, DialogPortal as as, type DropdownMenuContentProps as at, DropdownMenuPortal as au, OrganizationPicker as av, type OrganizationPickerOrganization as aw, type OrganizationPickerProps as ax, type PopoverContentProps as ay, type SkeletonProps as az, type AppRailAvatarProps as b, AppRailGroup as c, AppRailItem as d, type AppRailItemProps as e, AppRailSpacer as f, CanvasLayout as g, type CanvasLayoutProps as h, type CanvasPanelDef as i, Checkbox as j, type CheckboxProps as k, Collapsible as l, CollapsibleContent as m, CollapsibleTrigger as n, ConfirmDialog as o, ConfirmDialogHost as p, type ConfirmDialogProps as q, ContextMenu as r, ContextMenuContent as s, ContextMenuItem as t, ContextMenuSeparator as u, ContextMenuShortcut as v, ContextMenuTrigger as w, DialogClose as x, DialogContent as y, DialogDescription as z };