@sesamehr/react-design-system 3.4.0 → 3.5.0

package/dist/Display/VideoAttachment/VideoAttachment.d.ts

@@ -0,0 +1,78 @@
+import { ReactNode } from 'react';
+import { AttachmentImage, AttachmentSurface } from '../../internal/AttachmentMedia/index.ts';
+/**
+ * A video attached to a chat message: its poster frame, a play affordance and
+ * however long it runs.
+ * Mirrors `@sesame/orxata-core` VideoAttachment.
+ *
+ * No primitive underneath. shadcn has no video card and Radix has no primitive
+ * in this shape — there is no open state, no roving focus and no value to
+ * coordinate, only a single activation. What is left is one `<button>`, which
+ * is what Radix's `Primitive` would have rendered anyway, and
+ * `OxImageAttachment` reached the same place one cell at a time.
+ *
+ * The picture, its three states and the `Surface` tint are `AttachmentMedia`'s,
+ * shared with the other four attachments. This file adds the two things that
+ * are only a video's: the circle and the pill over it.
+ *
+ * ### The whole thumbnail is the button
+ *
+ * The behaviour board puts the full-screen player behind a click on the
+ * thumbnail, not on the circle, and nothing inside is interactive, so there is
+ * no control to nest — the opposite of `OxFileCard`, whose root refuses to be
+ * one for exactly that reason. The circle is therefore decoration and
+ * `aria-hidden`; the button is named by the poster's `alt` and the duration,
+ * both of which sit inside it. That is the accessibility board's "the duration
+ * is announced beside the button, not as loose text".
+ *
+ * The board also asks the button to be labelled "Play video, duration m:ss".
+ * This package ships no strings and has no catalogue to add one to, so the
+ * wording is the application's; `alt` plus the duration is the honest name a
+ * design system can assemble.
+ *
+ * ### `onPlay`, and why it displaces the DOM's own
+ *
+ * The Vue original emits `play`, so the port names the handler `onPlay` —
+ * which on a `<button>` collides with React's media event of the same name.
+ * The media one is omitted rather than renamed: a `<button>` never fires it, so
+ * nothing real is lost, and keeping the Vue name is what lets a consumer move
+ * between the two packages without relearning the API. A caller's own
+ * `onClick` still arrives and runs first.
+ *
+ * ### Why the duration is a node and not a string
+ *
+ * `OxLinkPreview` and `OxLocationAttachment` carry a title and a description,
+ * names the composition rule does not allow as props at all, so every sibling
+ * takes its text as a node and none of them takes it a second way. The pill's
+ * shape, position and colour stay the component's; only the string is the
+ * application's, and it has no opinion on whether that reads `0:42`,
+ * `1:03:20` or `12 min`.
+ *
+ * ### It has no size
+ *
+ * The width is the bubble's and the poster keeps its 3:2 shape at whatever
+ * width that turns out to be, which is `AttachmentMedia`'s aspect ratio rather
+ * than the 240×160 the board prints.
+ */
+export interface VideoAttachmentProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onPlay'> {
+    /**
+     * The poster frame, if there is one. Without it the box keeps its tint and
+     * shows a glyph, which is also what a poster that fails to load falls back
+     * to.
+     */
+    image?: AttachmentImage;
+    /**
+     * Which side of the bubble this sits in: `brand` inside the reader's own
+     * message, `default` inside anyone else's.
+     */
+    surface?: AttachmentSurface;
+    /**
+     * How long the video runs, drawn as the pill over the poster. Ports the Vue
+     * `#duration` slot; omitted, there is no pill at all.
+     */
+    duration?: ReactNode;
+    /** The thumbnail was activated. Open the player; nothing plays in place. */
+    onPlay?: () => void;
+    dataTestid: string;
+}
+export declare const VideoAttachment: import('react').ForwardRefExoticComponent<VideoAttachmentProps & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/Display/VideoAttachment/index.d.ts

@@ -0,0 +1 @@
+export { VideoAttachment, type VideoAttachmentProps, } from './VideoAttachment.tsx';

package/dist/Display/VoiceMessage/VoiceMessage.d.ts

@@ -0,0 +1,103 @@
+import { ReactNode } from 'react';
+import { AttachmentSurface } from '../../internal/AttachmentMedia/index.ts';
+/**
+ * A voice note in a chat message: a play button, the recording's waveform and
+ * how long it runs.
+ * Mirrors `@sesame/orxata-core` VoiceMessage.
+ *
+ * No primitive underneath, and this one is a decision rather than an absence.
+ * shadcn has no audio player; Radix has `Slider`, which is the right behaviour
+ * but the wrong DOM — Radix puts `role="slider"` on a *thumb*, and the board
+ * draws no thumb at all. Introducing one would invent a control the design does
+ * not have and a focus state nobody drew, so the gesture and the ARIA are
+ * implemented here against Radix's own conventions: one `role="slider"`
+ * element, `aria-valuemin`/`max`/`now`, arrows and Home/End, pointer capture on
+ * drag. The bars inside it are presentational children of a slider, which is
+ * what keeps a 32-bar waveform from announcing itself 32 times.
+ *
+ * ### It does not decode audio, and it does not own an `<audio>` element
+ *
+ * `peaks` arrives as data. Real peaks are computed server-side at upload, which
+ * is what WhatsApp, Telegram and Slack do and why their waveforms are visible
+ * before playback starts — decoding in the browser means downloading and
+ * decoding the whole file before anything can be drawn. Whether the numbers are
+ * real or decorative is the application's business, exactly as `OxFileCard`
+ * does not upload files.
+ *
+ * `toWaveformPeaks` converts the shapes a backend is likely to emit into the
+ * contract. It is a separate exported function the application calls at its own
+ * boundary rather than a guess made inside this component: sniffing the shape
+ * here would type `peaks` as `unknown` and make every new upstream format a
+ * change to a component.
+ *
+ * ### Controlled, with no fallback
+ *
+ * `playing` and `progress` are plain props with plain handlers, the same shape
+ * as `OxSwitch` and for the same reason: there is one player per conversation
+ * and one `<audio>` element behind it, both of which live in the application.
+ * An uncontrolled path here would let the component seed itself from the first
+ * value and carry on playing a position the real audio had left behind — so
+ * there deliberately is not one, and the Vue original has no `defineModel`
+ * either.
+ *
+ * So nothing moves unless the parent moves it. A `useState` in the caller,
+ * wired to `onPlayingChange` and `onProgressChange`, is the ordinary way.
+ *
+ * ### How many bars, and why the component decides
+ *
+ * The length of `peaks` is unconstrained because the number of bars is a visual
+ * decision and a backend cannot make it. `audiowaveform` emits whatever its
+ * samples-per-pixel gives it; how many 3px bars fit is a function of the
+ * bubble's width. The track is measured and the peaks are bucketed down to fit
+ * — see `useVoiceWaveform` for the maximum-per-bucket argument. Fewer peaks
+ * than bars draws short and left-aligned, which is what the board shows.
+ *
+ * ### Two nodes, because the package ships no strings
+ *
+ * `label` is the accessible name of the pair of controls — visually hidden, and
+ * the one thing a design system cannot supply, since it has no catalogue to add
+ * "Voice message" to. The button then carries state through `aria-pressed`
+ * rather than a name that changes, which is the only version of play/pause that
+ * needs no second string.
+ *
+ * `duration` is the visible one, and a node for the same reason
+ * `OxVideoAttachment`'s is: the pill's shape is the component's and the string
+ * is the application's, which has no opinion on `0:18` against `18 s`. With no
+ * `label` the duration names the controls instead, so the component is never
+ * nameless.
+ */
+export interface VoiceMessageProps extends React.ComponentPropsWithoutRef<'div'> {
+    /**
+     * The waveform, as magnitudes normalised to 0–1 — one per sample, any
+     * length. Run a backend's own shape through `toWaveformPeaks` first.
+     */
+    peaks: number[];
+    /**
+     * Whether the note is playing. Controlled: the glyph follows this and
+     * nothing else.
+     */
+    playing?: boolean;
+    /** How far through the note the playhead is, 0–1. Controlled. */
+    progress?: number;
+    /**
+     * Which side of the bubble this sits in: `brand` inside the reader's own
+     * message, `default` inside anyone else's.
+     */
+    surface?: AttachmentSurface;
+    /**
+     * The accessible name of both controls, read and not seen. Ports the Vue
+     * `#label` slot; without it the duration names them instead.
+     */
+    label?: ReactNode;
+    /** How long the note runs, drawn beside the waveform. Ports `#duration`. */
+    duration?: ReactNode;
+    /** The button was pressed. Start or stop the audio. */
+    onPlayingChange?: (playing: boolean) => void;
+    /**
+     * The listener scrubbed the waveform. Move the playhead to this 0–1
+     * position.
+     */
+    onProgressChange?: (progress: number) => void;
+    dataTestid: string;
+}
+export declare const VoiceMessage: import('react').ForwardRefExoticComponent<VoiceMessageProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/Display/VoiceMessage/index.d.ts

@@ -0,0 +1,2 @@
+export { VoiceMessage, type VoiceMessageProps } from './VoiceMessage.tsx';
+export { type AudiowaveformJson, type WaveformSource, toWaveformPeaks, } from './toWaveformPeaks.ts';

package/dist/Display/VoiceMessage/toWaveformPeaks.d.ts

@@ -0,0 +1,58 @@
+/**
+ * BBC `audiowaveform`'s JSON, as `audiowaveform -i in.mp3 -o out.json` writes
+ * it.
+ *
+ * Field names are the tool's own and are therefore `snake_case`, which is why
+ * this interface is the one place in the package that spells props that way:
+ * renaming them would mean the application had to translate before it could
+ * call the translator.
+ *
+ * `version` is 1 or 2 and `channels` exists only in 2. Everything else is
+ * present in both.
+ *
+ * @see https://github.com/bbc/audiowaveform/blob/master/doc/DataFormat.md
+ */
+export interface AudiowaveformJson {
+    version?: number;
+    /** Version 2 only. Absent means one channel. */
+    channels?: number;
+    sample_rate?: number;
+    samples_per_pixel?: number;
+    /** 8 or 16. Decides the scale `data` is written at. */
+    bits: number;
+    /** Minimum/maximum pairs per channel, which is `data.length / (2 * channels)`. */
+    length?: number;
+    /** Minimum and maximum pairs, interleaved, and across channels too. */
+    data: readonly number[];
+}
+/** Anything `toWaveformPeaks` knows how to read. */
+export type WaveformSource = AudiowaveformJson | readonly number[];
+/**
+ * Turns what a backend has into what `OxVoiceMessage` draws: magnitudes
+ * normalised to 0…1, one per sample.
+ *
+ * **A function the application calls at its own boundary, not something the
+ * component does.** Sniffing the shape inside the component would mean typing
+ * its `peaks` prop as `unknown` and losing the only check there is that the
+ * numbers are numbers; it would also mean every new upstream format was a
+ * change to a component rather than a case in a function. Here, a new format is
+ * one more branch and `OxVoiceMessage` never moves.
+ *
+ * It reads three things:
+ *
+ *  - **BBC `audiowaveform` JSON**, the tool that precomputes this server-side.
+ *    Minimum/maximum pairs, interleaved across channels, at 8 or 16 bits.
+ *  - **A flat array in an arbitrary range** — `−1…1`, `0…255`, or anything
+ *    else: it is normalised by its own loudest value.
+ *  - **A flat array already inside 0…1**, which comes back unchanged.
+ *
+ * Anything else **throws**, naming what arrived. A waveform is decoration that
+ * nobody checks against the audio, so a silently wrong one would survive every
+ * review; an exception at the boundary is the only place the mistake is still
+ * cheap.
+ *
+ * ```ts
+ * const peaks = toWaveformPeaks(await (await fetch(waveformUrl)).json());
+ * ```
+ */
+export declare const toWaveformPeaks: (source: WaveformSource) => number[];

package/dist/Display/VoiceMessage/useVoiceWaveform.d.ts

@@ -0,0 +1,90 @@
+/**
+ * The bar and the gap the board draws, in pixels, and the only numbers in this
+ * file that also live in the stylesheet.
+ *
+ * They have to: how many bars fit is arithmetic, and CSS cannot bucket an
+ * array. `VoiceMessage.test.tsx` asserts the stylesheet still says `w-0.75` and
+ * `gap-0.5`, so changing one half fails there rather than quietly drawing a
+ * waveform at the wrong pitch.
+ */
+export declare const VOICE_WAVEFORM_BAR_PX = 3;
+export declare const VOICE_WAVEFORM_GAP_PX = 2;
+/**
+ * How many bars to draw before the track has ever been measured — on the
+ * server, and on the first frame in a browser.
+ *
+ * It is the count that fits the board's own track: 240px wide, less the 36px
+ * button, the two 10px gaps and the duration, leaves 162px, and 162px holds 32
+ * bars at a 5px pitch. So an unmeasured waveform is drawn at the width the
+ * design was drawn at, which is the closest thing to a right answer available
+ * before layout.
+ */
+export declare const VOICE_WAVEFORM_FALLBACK_BARS = 32;
+/** One bar: how tall it is, and whether the playhead has passed it. */
+export interface VoiceWaveformBar {
+    key: number;
+    peak: number;
+    played: boolean;
+}
+/**
+ * `peaks` reduced to exactly `count` values, or left as it is when there are
+ * fewer peaks than bars.
+ *
+ * **Maximum per bucket, not RMS.** Two reasons, and the first is the contract:
+ * what arrives is already magnitudes, so the sign is gone and a root mean
+ * square over them is no longer the signal's energy — it is just a smoother
+ * average wearing the name of a measurement. The second is what a waveform is
+ * for: it is read to find the loud bit, and a maximum is the only reduction
+ * that keeps a transient visible once 400 samples have to fit in 32 bars. RMS
+ * would flatten a clap between two silences into an unremarkable bar.
+ *
+ * Buckets are cut by proportion rather than by a fixed size, so a length that
+ * does not divide evenly spreads the remainder across the track instead of
+ * dropping the tail.
+ */
+export declare const bucketPeaks: (peaks: readonly number[], count: number) => number[];
+export interface UseVoiceWaveformOptions {
+    /**
+     * The waveform. A plain value where the Vue original takes a getter: a
+     * composable is set up once and has to defer reading its props, while a hook
+     * re-runs on every render and so is handed the current value directly.
+     */
+    peaks: readonly number[];
+    progress: number;
+    /** Called with a 0…1 position whenever the listener scrubs. */
+    seek: (fraction: number) => void;
+}
+/**
+ * The waveform's two jobs, which share one element and so share one hook:
+ * deciding how many bars to draw, and turning a gesture on them into a
+ * position. Port of `core/src/Display/VoiceMessage/useVoiceWaveform.ts`.
+ *
+ * **How many bars is a question only the element can answer.** The backend
+ * sends however many peaks it computed — `audiowaveform` at a given
+ * samples-per-pixel will happily produce hundreds — and how many bars fit is a
+ * function of the bubble's width, which nothing knows until layout has run. So
+ * the track is measured and the peaks are bucketed down to what fits, at the
+ * board's fixed 3px/2px pitch; drawing all of them instead would either overflow
+ * or squeeze the bars to hairlines, and clipping them would hide the end of the
+ * recording.
+ *
+ * Fewer peaks than bars is left alone rather than stretched: the board's own
+ * waveform is left-aligned in a track wider than its bars, so a short recording
+ * drawing short is what the design already shows.
+ *
+ * The handlers are rebuilt on every render rather than memoised. They close
+ * over `progress` and `seek`, both of which change as the note plays, so a
+ * `useCallback` keyed on them would rebuild anyway — and one keyed on less than
+ * them would scrub against a position the audio had already left behind.
+ * `dragging` is the one thing that must survive a render, which is why it is a
+ * ref: holding it in state would restart the gesture mid-drag.
+ */
+export declare const useVoiceWaveform: (options: UseVoiceWaveformOptions) => {
+    track: import('react').RefObject<HTMLDivElement | null>;
+    bars: VoiceWaveformBar[];
+    percent: number;
+    onPointerDown: (event: React.PointerEvent<HTMLDivElement>) => void;
+    onPointerMove: (event: React.PointerEvent<HTMLDivElement>) => void;
+    onPointerUp: (event: React.PointerEvent<HTMLDivElement>) => void;
+    onKeyDown: (event: React.KeyboardEvent<HTMLDivElement>) => void;
+};

package/dist/Feedback/Dialog/Dialog.d.ts

@@ -5,7 +5,19 @@ export interface DialogProps {
     onOpenChange?: (open: boolean) => void;
     modal?: boolean;
 }
-/** Dialog root — built on `@radix-ui/react-dialog`. */
+/**
+ * Dialog root — built on `@radix-ui/react-dialog`.
+ *
+ * `open` is destructured with **no default**, and that is deliberate. Radix
+ * decides whether the caller owns the state by testing `open === undefined`,
+ * so a default of `false` here would read as "the caller controls this and says
+ * closed" and `defaultOpen` would be ignored — the panel would render nothing
+ * on mount while still opening from its trigger. `OxDialog` on the Vue side has
+ * the same hazard through a different door, since Vue casts an absent `Boolean`
+ * prop to `false` unless the prop declares a default; `Dialog.vue` carries the
+ * matching note. Nothing casts anything here, so leaving `open` alone is the
+ * whole fix.
+ */
 export declare const Dialog: {
     ({ children, defaultOpen, open, onOpenChange, modal, }: DialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;

package/dist/Feedback/Dialog/DialogOverlay.d.ts

@@ -1,4 +1,15 @@
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 export type DialogOverlayProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;
-/** DialogOverlay — the dimmed backdrop behind dialog content. */
+/**
+ * DialogOverlay — the glass behind dialog content.
+ *
+ * Radix's primitive owns the portal, the presence and the pointer handling; the
+ * look comes from `ox-overlay`, shared with whatever surface lands next — see
+ * `../overlay.css`.
+ *
+ * `data-slot="dialog-overlay"` is unchanged and remains the hook to target. The
+ * class was `styles.oxDialogOverlay` while the declarations lived in this
+ * component's module, which means it only ever reached the DOM hashed; the
+ * shared name is the first stable one, and it is the same string `core` applies.
+ */
 export declare const DialogOverlay: import('react').ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;

package/dist/Feedback/Drawer/Drawer.d.ts

@@ -0,0 +1,68 @@
+export interface DrawerProps {
+    children?: React.ReactNode;
+    /** The controlled open state. Pair it with `onOpenChange`. */
+    open?: boolean;
+    defaultOpen?: boolean;
+    /**
+     * Whether the drawer blocks the page behind it. `true` draws the glass and
+     * locks body scroll; `false` leaves the list operable while the panel is open,
+     * which the board draws as `Show overlay: No`.
+     */
+    modal?: boolean;
+    /**
+     * Which edge the panel is anchored to.
+     *
+     * Two values, not four. The board draws the right edge only — the component
+     * set has a single `Size` axis and its description says "panel lateral
+     * derecho" — and a top or bottom panel is a Sheet, which is mobile and is not
+     * this component.
+     */
+    side?: 'left' | 'right';
+    onOpenChange?: (open: boolean) => void;
+}
+/**
+ * Drawer root — mirrors `@sesame/orxata-core` Drawer, built on
+ * `@radix-ui/react-dialog`.
+ *
+ * **A sibling of `OxDialog`, not a shape of it.** Both stand on the dialog
+ * primitive, which is where the focus trap, the body scroll lock, the Escape
+ * handling, the portal, `role="dialog"` and the `aria-labelledby` /
+ * `aria-describedby` wiring come from — hand-rolling any of that is how a
+ * surface ships unusable by keyboard. What makes a drawer its own component is
+ * everything above the primitive: it is anchored to an edge rather than centred,
+ * it is full height, it slides instead of scaling, it can be non-modal so the
+ * list behind stays operable, and it grows. None of that is a content shape.
+ *
+ * Note that modality arrives as `aria-hidden` on everything else rather than as
+ * `aria-modal` on the panel — Radix's choice, reka's too, and the current APG
+ * advice, since `aria-modal` leaves the rest of the page reachable by a screen
+ * reader's own navigation in several implementations. `Drawer.test.tsx` asserts
+ * the former, so nobody goes looking for the latter and concludes it is missing.
+ *
+ * **Why this root holds the open state rather than leaving it to the
+ * primitive.** `DrawerContent` has to know whether the panel is open: it drives
+ * the slide from `OxTransitionSlideX` rather than from the primitive's own
+ * presence, so it is what decides when the panel mounts. On the Vue side it asks
+ * reka, through `injectDialogRootContext()`. Radix exports no such hook, so the
+ * state lives here and `Dialog.Root` is always controlled from it. Everything
+ * else about the primitive is untouched.
+ *
+ * That is also why `defaultOpen` is not forwarded. Radix decides who owns the
+ * state by testing `open === undefined`, and this always passes it a boolean —
+ * so handing it `defaultOpen` as well would be giving it an initial value it is
+ * no longer in a position to use. It seeds the state below instead, which is the
+ * same thing one layer out. `core`'s `Drawer.vue` carries the matching note from
+ * the other direction: there, `open: undefined` in `withDefaults` is
+ * load-bearing, because Vue would otherwise cast an absent `Boolean` prop to
+ * `false` and reka would read that as "the caller says closed".
+ *
+ * `open` without `onOpenChange` pins the panel, exactly as it does on a bare
+ * `Dialog.Root` or a reka `DialogRoot`: a caller that takes the value over is
+ * expected to listen. This is not one of the `defineModel` ports that gate on
+ * the handler — `Drawer.vue` is a plain prop plus an emit, which is
+ * controlled-only, and so is this.
+ */
+export declare const Drawer: {
+    ({ children, open, defaultOpen, modal, side, onOpenChange, }: DrawerProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/Feedback/Drawer/DrawerBody.d.ts

@@ -0,0 +1,18 @@
+export interface DrawerBodyProps extends React.HTMLAttributes<HTMLDivElement> {
+    dataTestid: string;
+}
+/**
+ * DrawerBody — mirrors `@sesame/orxata-core` DrawerBody. The scrolling region of
+ * the panel, the board's `Content`, "con Slot y scroll interno".
+ *
+ * The header and the footer stay put; this is the only part that moves once the
+ * content is taller than the panel. It carries no styling of its own: the
+ * declarations that make it the flexible, scrolling item live on `DrawerContent`
+ * next to the `top`/`bottom` pair they depend on, since a body is only a scroll
+ * region because the panel is pinned to both edges and splitting that pair
+ * across two files is how one of them gets changed alone.
+ *
+ * `data-slot` rather than position, so it can sit anywhere among the panel's
+ * children.
+ */
+export declare const DrawerBody: import('react').ForwardRefExoticComponent<DrawerBodyProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/Feedback/Drawer/DrawerContent.d.ts

@@ -0,0 +1,36 @@
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+export interface DrawerContentProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> {
+    showCloseButton?: boolean;
+}
+/**
+ * DrawerContent — mirrors `@sesame/orxata-core` DrawerContent. The panel itself:
+ * the portal, the glass, the slide and the dialog content in one place.
+ *
+ * **Why `OxTransitionSlideX` and not `OxTransitionReveal`.** The panel's whole
+ * movement is along the axis it is anchored to, and `SlideX` is the only one of
+ * the two that moves on X at all: `Reveal` rises 26px on Y, which would read as
+ * a card appearing rather than a panel entering. `SlideX` also takes
+ * `direction` / `leaveDirection` in the same `'left' | 'right'` vocabulary as
+ * our own `side`, so the two cannot drift.
+ *
+ * **One prop of `core`'s is missing, and it could not be kept.** `DrawerContent`
+ * on the Vue side takes `trapFocus` and hands it through, because reka's
+ * `DialogContent` spreads its `$attrs` into `DialogContentModal`, which declares
+ * `trapFocus` as a real prop — so the pass-through works even though reka omits
+ * it from `DialogContentProps`. Radix closes both doors: `DialogContentTypeProps`
+ * omits `trapFocus`, and `DialogContentModal` sets `trapFocus={context.open}`
+ * *after* spreading the caller's props, so anything passed is overwritten.
+ * Focus trapping here follows `modal` and nothing else. Do not add the prop
+ * back as a no-op to make the two prop lists match — a dead prop is worse than
+ * an absent one, and props are the part of the API the parity rules
+ * deliberately do not compare.
+ *
+ * **No portal-target prop.** `OxToaster` has a `to` because a toast viewport is
+ * genuinely a region of the application and tests want it somewhere else. A
+ * drawer is the opposite case: it is anchored to the viewport, and a portal
+ * anywhere but the document root puts it back inside the `overflow` and
+ * `transform` ancestors the portal exists to escape — so a `container` here
+ * would be an escape hatch whose main use is to break the component. Radix's
+ * `Dialog.Portal` is one import away for anybody who really needs it.
+ */
+export declare const DrawerContent: import('react').ForwardRefExoticComponent<DrawerContentProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/Feedback/Drawer/DrawerDescription.d.ts

@@ -0,0 +1,10 @@
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+export type DrawerDescriptionProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;
+/**
+ * DrawerDescription — mirrors `@sesame/orxata-core` DrawerDescription.
+ *
+ * The board's `Subtitle`, bound to `Text/sm` (14/20) and
+ * `Semantic-Colors/muted-foreground`. The primitive registers the id
+ * `aria-describedby` points at.
+ */
+export declare const DrawerDescription: import('react').ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & import('react').RefAttributes<HTMLParagraphElement>, "ref"> & import('react').RefAttributes<HTMLParagraphElement>>;

package/dist/Feedback/Drawer/DrawerExpand.d.ts

@@ -0,0 +1,23 @@
+export type DrawerExpandProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+/**
+ * DrawerExpand — mirrors `@sesame/orxata-core` DrawerExpand.
+ *
+ * The header's grow/shrink toggle. The board draws it on every variant —
+ * `icon-maximize-diagonal` while the panel is at its resting width,
+ * `icon-minimize-diagonal` once it has grown (nodes I1463:199;1483:88 on
+ * `Size=md` and on `Size=xl`).
+ *
+ * A component rather than a prop on `DrawerContent`, because it is a control the
+ * consumer places: a drawer whose detail does not benefit from the extra width
+ * simply does not include it, and no `showExpandButton` has to exist.
+ *
+ * `aria-pressed` and not a second button: it is one control with two states,
+ * which is what a toggle button is. The accessible name changes with it, so a
+ * screen reader hears what pressing it will do rather than what it did.
+ *
+ * Positioned against the panel like the close glyph beside it, and for the same
+ * reason — see `DrawerContent`'s `.oxDrawerClose`. It therefore renders
+ * correctly wherever it sits among the panel's children; next to the title is
+ * where it reads.
+ */
+export declare const DrawerExpand: import('react').ForwardRefExoticComponent<DrawerExpandProps & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/Feedback/Drawer/DrawerTitle.d.ts

@@ -0,0 +1,13 @@
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+export type DrawerTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;
+/**
+ * DrawerTitle — mirrors `@sesame/orxata-core` DrawerTitle.
+ *
+ * The panel's heading, and what `aria-labelledby` points at — the board's
+ * accessibility note asks for exactly that pairing, and the primitive is what
+ * registers the id, so this is not interchangeable with an `<h2>`.
+ *
+ * `text-xl` and not `OxDialogTitle`'s `text-lg`: the board's `Title` is bound to
+ * `Text/xl` (20/28) where the Modal's is `lg`.
+ */
+export declare const DrawerTitle: import('react').ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & import('react').RefAttributes<HTMLHeadingElement>, "ref"> & import('react').RefAttributes<HTMLHeadingElement>>;

package/dist/Feedback/Drawer/index.d.ts

@@ -0,0 +1,7 @@
+export { Drawer, type DrawerProps } from './Drawer.tsx';
+export { DrawerContent, type DrawerContentProps } from './DrawerContent.tsx';
+export { DrawerBody, type DrawerBodyProps } from './DrawerBody.tsx';
+export { DrawerTitle, type DrawerTitleProps } from './DrawerTitle.tsx';
+export { DrawerDescription, type DrawerDescriptionProps, } from './DrawerDescription.tsx';
+export { DrawerExpand, type DrawerExpandProps } from './DrawerExpand.tsx';
+export { Trigger as DrawerTrigger, Close as DrawerClose, } from '@radix-ui/react-dialog';

package/dist/Feedback/Drawer/useDrawer.d.ts

@@ -0,0 +1,30 @@
+/**
+ * What the drawer's parts need from its root, and nothing else.
+ *
+ * **`open` is here, where `core`'s `DrawerContext` deliberately leaves it out.**
+ * That is not drift; it is the one thing the two primitives genuinely do
+ * differently. reka publishes its dialog root's state as
+ * `injectDialogRootContext()`, so `DrawerContent.vue` reads `open` from the
+ * primitive and a second copy in that context would be a second thing able to
+ * disagree with it. Radix publishes no equivalent — its `useDialogContext` is
+ * module-private and nothing exported reaches it — so the root here owns the
+ * state, hands it to `Dialog.Root` as a controlled value and publishes it
+ * through this context. Still one source of truth, just a different one.
+ */
+export interface DrawerContextValue {
+    /** Whether the panel is open. The root owns this — see above. */
+    open: boolean;
+    /** Which edge the panel is anchored to. */
+    side: 'left' | 'right';
+    /** Whether the panel has grown to its inset limit. */
+    expanded: boolean;
+    toggleExpanded: () => void;
+}
+export declare const DrawerProvider: import('react').Provider<DrawerContextValue | null>;
+/**
+ * Throws rather than returning a default: a part that cannot find its root is a
+ * composition mistake, and a silent fallback would let `OxDrawerExpand` render a
+ * button that moves nothing. The message is `core`'s word for word, so the two
+ * packages fail identically.
+ */
+export declare const useDrawer: () => DrawerContextValue;

package/dist/Feedback/Progress/index.d.ts

@@ -14,6 +14,6 @@ export type { ProgressProps } from './Progress.tsx';
  * The variant is the caller's to say.
  */
 export declare const progressVariants: (props?: ({
-    variant?: "success" | "error" | "warning" | "brand" | null | undefined;
+    variant?: "success" | "brand" | "error" | "warning" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type ProgressVariants = VariantProps<typeof progressVariants>;