@stackone/malachite 2.5.1 → 2.6.0

package/COMPONENTS.md

@@ -22,7 +22,8 @@ The catalog of components exported from `@stackone/malachite`. **Reach for one o
 - **`Divider`** — Separator; supports a dashed line style. Horizontal by default and spanning its container; `orientation="vertical"` draws a rule between inline controls (e.g. groups in a toolbar) and holds its width in a tight flex row. `length` sizes it along its own axis on a fixed scale, and it never shrinks below 1px. _Key props:_ `orientation="horizontal" | "vertical"`, `length` (`small` | `medium` | `large`), `lineStyle="solid" | "dashed"`, `DividerVariant`, `SpacingSize`, `PaddingSize`.
 - **`OverflowRow`** — Horizontal row that collapses items that do not fit into an overflow affordance.
 - **`ActionBar`** — A row of actions that collapses into a single `ActionMenu` once its container drops below `collapseBelow`. Measures the nearest genuinely-wider ancestor rather than itself, since the row shrinks to its own content. `dividerBefore` renders a vertical rule in the row and a divider in the collapsed menu, so both forms group the actions the same way. _Key props:_ `buttons` (`label`, `onClick`, `icon`, `variant`, `size`, `radius`, `tooltip`, `disabled`, `dividerBefore`), `collapseBelow`, `menuLabel`, `className`.
-- **`SidePanel`** — Right-hand slide-in overlay panel (drawer) with header slots (back/icon/title/subtitle/extra), scrollable body and optional footer. Locks background scroll, traps focus, dismisses on ESC (topmost layer), overlay click or close.
+- **`Modal`** — Centred dialog over a scrim, with header slots (icon/title/subtitle/extra), a scrolling body and a pinned footer. Locks background scroll and dismisses on ESC, the close button, or a scrim click unless `closeOnOverlayClick` is off; `busy` suppresses the two pointer routes while a request is in flight and sets `aria-busy`, so a stray click cannot tear the dialog down mid-write — but never ESC, which is the only guaranteed keyboard exit from a focus trap and so always reaches `onClose`. ESC, the Tab focus trap and `aria-modal` all apply to the topmost overlay only, so these may be stacked — a dialog opened from a panel keeps Tab to itself and the panel stops claiming to be modal. Set `role="alertdialog"` for a consequential choice, which asks assistive tech to announce the body and not just the name, and point `aria-describedby` at whichever element carries it. Width comes from the `size` union (`small` 420px | `medium` 560px | `large` 760px) rather than a raw pixel prop. Like `SidePanel` it sits in a z-index band from 1000 — one step per stacked overlay, so what paints on top is what holds the keyboard — and stays out of the browser top layer, so a host app’s own dialogs can still cover it. For a confirmation use `ConfirmationDialog`, which is a preset over this. _Key props:_ `open`, `onClose`, `title`, `subtitle`, `icon`, `headerExtra`, `headerDivider`, `footer`, `size`, `showCloseButton`, `closeOnOverlayClick`, `bodyPadding`, `busy`, `role` (`dialog` | `alertdialog`), `aria-label`, `aria-labelledby`, `aria-describedby`.
+- **`SidePanel`** — Right-hand slide-in overlay panel (drawer) with header slots (back/icon/title/subtitle/extra), scrollable body and optional footer. Locks background scroll and dismisses on ESC, an overlay click or close. ESC and the Tab focus trap apply to the topmost overlay only, so a `Modal` may be stacked over it.
 - **`SidePanelNavFooter`** — Keyboard-hint footer for SidePanel: up/down keycaps to step between records and an esc-to-close hint, with an optional right-aligned actions slot.
 
 ## Lists, rows & navigation
@@ -82,6 +83,7 @@ The catalog of components exported from `@stackone/malachite`. **Reach for one o
 - **`Tooltip`** — Hover/focus tooltip; also works on disabled controls (see CLAUDE.md). It describes its trigger once shown, so `describesTrigger={false}` where the same sentence is already on screen and referenced — otherwise a screen reader reads it twice. _Key props:_ `text`, `placement`, `delay`, `maxWidth`, `shouldShow`, `triggerAs`, `describesTrigger`, `isShrinkable`, `fill`, `wrapChildren`.
 - **`TruncatedTooltip`** — Shows a tooltip only when its text is truncated.
 - **`Confetti`** — Celebratory confetti burst for success moments. _Key props:_ `pieces`.
+- **`ConfirmationDialog`** — Asks the customer to confirm one consequential action — a preset over `Modal`, not a second dialog implementation. `variant` picks a whole coherent set at once (badge tint, badge icon, confirm-button variant and default callout type), so `destructive` cannot end up with a non-destructive confirm button; `destructive` also renders as `role="alertdialog"`, and `description` is wired to the dialog through `aria-describedby`, so the consequence is announced and not just the title. `confirmPhrase` gates the confirm action on typing that exact phrase, for a consequence severe enough that one click should not be able to cause it — the typed value is trimmed, since copying a name picks up a trailing space, but stays case-sensitive, and the field clears each time the dialog opens, being a per-decision gate rather than a value. Neither a destructive dialog nor one carrying a `confirmPhrase` dismisses on a scrim click, and `loading` suppresses the pointer routes — the scrim and the close button — as well as disabling the buttons. It never suppresses ESC: that is the only guaranteed keyboard exit from a focus trap, so it always reaches `onClose` and whether to abort is left to the caller. ESC reaches it whenever it is the topmost overlay, so it can be opened over a panel. `callout` renders an `Alert` and `children` is where the entity being acted on goes. `onConfirm` does not close the dialog, so the caller can hold it open on `loading` while the request is in flight. _Key props:_ `open`, `onClose`, `onConfirm`, `title`, `description`, `variant` (`default` | `warning` | `destructive`), `callout`, `confirmPhrase`, `confirmPhraseLabel`, `confirmLabel`, `cancelLabel`, `loading`, `footerTip`, `size`, `aria-label`, `aria-labelledby`.
 
 ## Typography
 

package/dist/{CodeBlockHighlighter-DQqj7zzs.js → CodeBlockHighlighter-DhoYJjgP.js}

@@ -1,5 +1,5 @@
 import { jsx as Oe } from "react/jsx-runtime";
-import { _ as un, a as sn, C as re, b as fn } from "./index-COY1hH1S.js";
+import { _ as un, a as sn, C as re, b as fn } from "./index-UEPNiCCW.js";
 import H from "react";
 function dn(e, n) {
   if (e == null) return {};
@@ -2781,4 +2781,4 @@ const ht = {
 export {
   bt as default
 };
-//# sourceMappingURL=CodeBlockHighlighter-DQqj7zzs.js.map
+//# sourceMappingURL=CodeBlockHighlighter-DhoYJjgP.js.map