@gradeui/ui 1.1.0 → 1.2.0

package/dist/index.d.ts

@@ -10,6 +10,7 @@ import { DayPicker, DayButton, DateRange } from 'react-day-picker';
 import { UseEmblaCarouselType } from 'embla-carousel-react';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import { Language } from 'prism-react-renderer';
+import { LexicalEditor } from 'lexical';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import * as LabelPrimitive from '@radix-ui/react-label';
@@ -173,14 +174,14 @@ declare const MediaSurfaceContract: _gradeui_contracts.ComponentContract<{
             description: z.ZodOptional<z.ZodString>;
         }, "strip", z.ZodTypeAny, {
             kind: "book";
-            description?: string | undefined;
             title?: string | undefined;
+            description?: string | undefined;
             author?: string | undefined;
             isbn?: string | undefined;
         }, {
             kind: "book";
-            description?: string | undefined;
             title?: string | undefined;
+            description?: string | undefined;
             author?: string | undefined;
             isbn?: string | undefined;
         }>, z.ZodObject<{
@@ -466,9 +467,37 @@ interface AppShellFooterProps extends React$1.HTMLAttributes<HTMLElement>, Varia
 }
 declare const AppShellFooter: React$1.ForwardRefExoticComponent<AppShellFooterProps & React$1.RefAttributes<HTMLElement>>;
 
-declare const Avatar: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & React$1.RefAttributes<HTMLSpanElement>, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
+/**
+ * Avatar — circular user/entity glyph. Wraps Radix's avatar primitive
+ * with two ergonomic additions over the base shadcn shape:
+ *
+ *   size — t-shirt scale (xs / sm / md / lg / xl) so consumers pick a
+ *          token instead of writing `h-7 w-7` every time. Defaults
+ *          to md (40px) to preserve previous behaviour.
+ *
+ *   tone — on AvatarFallback only. Picks a tinted bg/text colour
+ *          pair (violet / amber / emerald / sky / rose / plum / lime /
+ *          primary / muted). Default `muted` matches the previous
+ *          `bg-muted` behaviour. Reach for explicit tones when each
+ *          author needs a stable colour mapping (chat avatars, comment
+ *          threads, member lists).
+ *
+ * Both additions are backwards compatible — code that passed className
+ * directly still works and overrides the variant defaults.
+ */
+declare const avatarSizes: (props?: ({
+    size?: "sm" | "md" | "lg" | "xs" | "xl" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface AvatarProps extends React$1.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>, VariantProps<typeof avatarSizes> {
+}
+declare const Avatar: React$1.ForwardRefExoticComponent<AvatarProps & React$1.RefAttributes<HTMLSpanElement>>;
 declare const AvatarImage: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React$1.RefAttributes<HTMLImageElement>, "ref"> & React$1.RefAttributes<HTMLImageElement>>;
-declare const AvatarFallback: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & React$1.RefAttributes<HTMLSpanElement>, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
+declare const avatarFallbackTones: (props?: ({
+    tone?: "muted" | "primary" | "violet" | "amber" | "emerald" | "sky" | "rose" | "plum" | "lime" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface AvatarFallbackProps extends React$1.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>, VariantProps<typeof avatarFallbackTones> {
+}
+declare const AvatarFallback: React$1.ForwardRefExoticComponent<AvatarFallbackProps & React$1.RefAttributes<HTMLSpanElement>>;
 
 declare const badgeVariants: (props?: ({
     variant?: "default" | "info" | "success" | "warning" | "destructive" | "outline" | "secondary" | "highlight" | "success-soft" | "warning-soft" | "destructive-soft" | "info-soft" | "highlight-soft" | "success-outline" | "warning-outline" | "destructive-outline" | "info-outline" | null | undefined;
@@ -538,7 +567,7 @@ type Surface = "solid" | "translucent" | "glass" | "glass-strong";
  */
 declare const bannerVariants: (props?: ({
     variant?: "default" | "info" | "success" | "warning" | "destructive" | "announcement" | null | undefined;
-    align?: "start" | "center" | "between" | null | undefined;
+    align?: "center" | "start" | "between" | null | undefined;
     sticky?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface BannerProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "title">, VariantProps<typeof bannerVariants> {
@@ -594,7 +623,7 @@ declare const Banner: React$1.ForwardRefExoticComponent<BannerProps & React$1.Re
  * consistent across primitives.
  */
 declare const buttonVariants: (props?: ({
-    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | "raised" | null | undefined;
+    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | "raised" | null | undefined;
     size?: "default" | "icon" | "sm" | "md" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
@@ -797,6 +826,7 @@ type CodeLanguage = Language;
 type CodeReveal = "none" | "lines" | "typewriter" | "diff";
 type CodeTrigger = "mount" | "inView" | "manual";
 type CodeSpeed = "slow" | "normal" | "fast";
+type CodeSize = "xs" | "sm" | "md";
 /**
  * Step shape for scripted terminal / CLI sessions. Lives on `<Code>`
  * itself rather than a sibling `CodeSequence` so the theme bridge,
@@ -921,6 +951,17 @@ interface CodeProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "childr
      * Overflowing content scrolls. Pair with `wrap` to break long lines
      * instead of horizontal scroll.
      */
+    /**
+     * Type-scale preset. `xs` (12px) for dense changelog cards and inline
+     * code in tables; `sm` (14px, default) for marketing heroes and most
+     * docs blocks; `md` (16px) for "this is the focal point" displays
+     * like AI-output demos and large screen-capture replacements.
+     *
+     * Composes with `maxLines` correctly because the container height
+     * uses `1lh` which inherits whatever line-height the size class
+     * produces — switching size resizes the container automatically.
+     */
+    size?: CodeSize;
     height?: number | string | "auto";
     /**
      * Cap the visible line count — the container is fixed at exactly
@@ -935,6 +976,645 @@ interface CodeProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "childr
 }
 declare const Code: React$1.ForwardRefExoticComponent<CodeProps & React$1.RefAttributes<HTMLDivElement>>;
 
+/**
+ * Message — the canonical "avatar + author + timestamp + body" row.
+ *
+ * THE primitive for any chat message, comment, post-reply, activity-log
+ * entry, or notification row that follows the people-and-text shape.
+ * Surfaced after three scaffolds (chat, comments, hero preview) all
+ * re-rolled the same flex layout inline — that was the signal.
+ *
+ * Slot-based composition for the avatar so consumers pass whatever
+ * Avatar variant fits their surface (sized, toned, image, fallback).
+ * Message doesn't pick an Avatar shape for you — it just hosts.
+ *
+ *   <Message
+ *     author="alice"
+ *     timestamp="11:24"
+ *     avatar={
+ *       <Avatar size="sm">
+ *         <AvatarFallback tone="violet">A</AvatarFallback>
+ *       </Avatar>
+ *     }
+ *   >
+ *     Post copy is in the doc.
+ *   </Message>
+ *
+ * For "your messages right-aligned" chat surfaces (iMessage / WhatsApp
+ * / your own DM threads), pass `align="end"` and the row + content
+ * mirror.
+ *
+ * Anti-patterns to avoid (caught from real scaffold use):
+ *
+ *   - Don't roll a custom "AuthorDot" inline — Avatar with
+ *     <AvatarFallback tone="..."> covers the colored-initials case
+ *     cleanly and stays themable.
+ *   - Don't use Message for non-people activity (system events,
+ *     log lines). Reach for Callout or a plain Row.
+ */
+interface MessageProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "title"> {
+    /** Display name of the message author. */
+    author: string;
+    /**
+     * Timestamp string ("11:24", "2 hours ago") OR any node for custom
+     * formatting (tooltip-wrapped time, link to permalink, etc).
+     */
+    timestamp?: React$1.ReactNode;
+    /**
+     * Avatar slot. Pass any `<Avatar>` composition. When omitted, the
+     * row renders without an avatar column — handy for grouped messages
+     * from the same author where only the first row shows the avatar.
+     */
+    avatar?: React$1.ReactNode;
+    /**
+     * Small chip(s) next to the author name. Use for "OP", "Bot",
+     * "Admin", or any role/state badge that belongs in the header
+     * rhythm rather than the body.
+     */
+    badge?: React$1.ReactNode;
+    /**
+     * Editing state — renders an "(edited)" hint next to the timestamp.
+     * Pass a string to customise the label (e.g. "(edited 2 minutes ago)").
+     */
+    edited?: boolean | string;
+    /**
+     * Pinned state — renders a small pin glyph at the top of the row.
+     * Surfaces "this is a sticky / pinned message" in Slack-style feeds.
+     */
+    pinned?: boolean;
+    /**
+     * End-of-header slot. Common use: a hover-revealed Row of small
+     * icon buttons (reply / react / pin / more). Pushed to the right
+     * with `ml-auto`.
+     */
+    actions?: React$1.ReactNode;
+    /**
+     * Reactions slot — renders below the body. Typically a Row of
+     * reaction chips (emoji + count). Hidden when no node is passed.
+     */
+    reactions?: React$1.ReactNode;
+    /**
+     * Thread / reply count — renders a "N replies" link affordance
+     * below the body. Click handler is the consumer's responsibility.
+     * Wire `onThreadClick` if you want the built-in button to fire.
+     */
+    threadCount?: number;
+    /** Fires when the built-in "N replies" affordance is clicked. */
+    onThreadClick?: () => void;
+    /**
+     * Visual alignment. `start` (default) puts the avatar on the left
+     * — the standard chat / comment shape. `end` mirrors the row so the
+     * avatar sits on the right and the content right-aligns — use for
+     * "your messages" in DM threads.
+     */
+    align?: "start" | "end";
+    /**
+     * Body content (the message text). Accepts any node so consumers
+     * can embed rich content — Markdown-rendered prose, images,
+     * embedded cards, etc. Plain text is the common case.
+     */
+    children: React$1.ReactNode;
+}
+declare const Message: React$1.ForwardRefExoticComponent<MessageProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Shared types + presets for scripted component demos.
+ *
+ * Lives at the bottom of the demo primitive stack so the hook, the
+ * cursor, and any component that opts in (`<Code>`, `<Composer>`,
+ * `<DemoStage>`) all read from one definition of "what slow / normal /
+ * fast feels like" and one definition of "when do we start playing".
+ *
+ * If you ever want to retune the cadence of every demo on the marketing
+ * site at once, this is the file to edit.
+ */
+/**
+ * Animation feel. Maps onto a triple of timing values so authors can
+ * pick a vibe (slow / normal / fast) instead of hand-tuning ms.
+ * Components that need finer control can still override the resolved
+ * values per-instance.
+ */
+type DemoSpeed = "slow" | "normal" | "fast";
+/**
+ * What kicks the demo off:
+ *   - `mount`   plays immediately on first paint
+ *   - `inView`  waits for the container to cross the viewport threshold
+ *   - `manual`  driven by the `play` prop or imperative ref
+ */
+type DemoTrigger = "mount" | "inView" | "manual";
+/**
+ * Speed presets shared across every scripted-demo surface. Three
+ * unambiguously distinct feels: `slow` is "I am being shown", `normal`
+ * is "I am being told", `fast` is "I am being briefed".
+ *
+ *   - `tokenStagger`  per-character cadence for typing-style steps
+ *   - `lineStagger`   per-line cadence for reveal-style demos
+ *   - `preDelay`      pause after the trigger fires before the first tick
+ *   - `fadeMs`        default enter-transition duration for revealed parts
+ */
+declare const DEMO_SPEED_PRESETS: Record<DemoSpeed, {
+    tokenStagger: number;
+    lineStagger: number;
+    preDelay: number;
+    fadeMs: number;
+}>;
+
+/**
+ * Cancellable sleep + type helpers for scripted demos.
+ *
+ * The runner threads an `AbortSignal` through every step so a `stop()`
+ * call (or an unmount) can short-circuit long waits and typing loops
+ * cleanly. Consumers write `await sleep(ms, signal)` inside their
+ * interpret callback and the cancellation is automatic.
+ *
+ * Note: this throws DOMException("Aborted", "AbortError") on cancel.
+ * The runner's outer try/catch swallows that specific error and exits;
+ * any other rejection bubbles up so authoring bugs aren't silenced.
+ */
+/**
+ * Promisified setTimeout that resolves after `ms` milliseconds, or
+ * rejects with an AbortError if the signal fires first. Resolves
+ * immediately if `ms <= 0`.
+ */
+declare function sleep(ms: number, signal?: AbortSignal): Promise<void>;
+/**
+ * Type `text` one character at a time, calling `onTick(partial)` for
+ * each prefix. Stagger between ticks defaults to 22ms (the `normal`
+ * speed preset's `tokenStagger`).
+ *
+ * `onTick` receives the cumulative typed text (not the new char), so
+ * consumers can do `setBuffer(prefix + partial)` without tracking state
+ * themselves. The final call fires with the complete text — there's no
+ * separate "done" callback.
+ */
+declare function typeText(text: string, onTick: (partial: string) => void, stagger?: number, signal?: AbortSignal): Promise<void>;
+
+/**
+ * useScriptedDemo — the shared step-machine hook behind every
+ * scripted-demo surface in gradeui (`<Code>`, `<Composer>`,
+ * `<DemoStage>`, anything else that wants the same play / stop / speed
+ * semantics).
+ *
+ * Generic over the Step type. Each consumer defines its own verbs
+ * (Code has `output`, Composer has `mention`, DemoStage has `reveal`)
+ * and passes an `interpret(step, ctx)` callback that executes one
+ * step. The hook owns: sequencing, cancellation, trigger detection
+ * (mount / inView / manual), loop, pre-delay, completion signal, and
+ * the imperative play() / stop() API.
+ *
+ * Authoring guide for `interpret`:
+ *   - `await sleep(ms, ctx.signal)` for any pause so stop() can short
+ *     a long wait cleanly.
+ *   - `await typeText(text, onTick, stagger, ctx.signal)` for typing
+ *     loops, again so stop() interrupts mid-character.
+ *   - Read `ctx.speed` to grab the resolved DEMO_SPEED_PRESETS entry
+ *     when a step doesn't pin its own cadence.
+ *   - Throw nothing on cancel — the helpers do it for you. Anything
+ *     else thrown is treated as a real bug and bubbles to the console.
+ */
+interface ScriptedDemoContext {
+    /** Resolved speed preset for the current run. */
+    speed: (typeof DEMO_SPEED_PRESETS)[DemoSpeed];
+    /** AbortSignal that fires on stop() / unmount / steps change. */
+    signal: AbortSignal;
+    /** Live cancellation check for code paths that can't take a signal. */
+    cancelled: () => boolean;
+}
+interface UseScriptedDemoOptions<TStep> {
+    /** The steps to run. Undefined or empty means "no script". */
+    steps?: TStep[];
+    /**
+     * Per-step interpreter. Receives one step + a context with timing
+     * helpers, runs whatever the step means, and returns when done.
+     * Synchronous or async — the runner awaits either.
+     */
+    interpret: (step: TStep, ctx: ScriptedDemoContext) => Promise<void> | void;
+    /** Animation feel. Defaults to `normal`. */
+    speed?: DemoSpeed;
+    /** What kicks the script off. Defaults to `mount`. */
+    trigger?: DemoTrigger;
+    /** For `trigger="manual"` — flip true to play. */
+    play?: boolean;
+    /** Loop the sequence forever after completion. Pause length controlled by `loopDelay`. */
+    loop?: boolean;
+    /**
+     * Milliseconds to pause between loop cycles. Only applies when
+     * `loop` is true. Defaults to 2000. Marketing surfaces that want
+     * the demo to breathe between repeats bump this to 4000-6000; tight
+     * inline demos drop it to 800.
+     */
+    loopDelay?: number;
+    /** Container ref for inView detection. Required when `trigger="inView"`. */
+    containerRef?: React$1.RefObject<HTMLElement | null>;
+    /**
+     * Fires when one loop iteration completes (or the whole run, when
+     * `loop` is false). Consumers can use this to reset their buffer or
+     * fire a parent callback.
+     */
+    onComplete?: () => void;
+    /**
+     * Fires before each loop iteration starts (after the 2s pause).
+     * Use to reset per-iteration state in the consumer.
+     */
+    onLoopReset?: () => void;
+}
+interface ScriptedDemoState {
+    /** True while the runner is actively walking steps. */
+    isPlaying: boolean;
+    /** True after the last step has run (and stays true until reset). */
+    isComplete: boolean;
+    /** 0-indexed pointer to the currently executing step, or -1 idle. */
+    currentIndex: number;
+    /** Imperative trigger. Mostly for `trigger="manual"` ref handles. */
+    play: () => void;
+    /** Cancel the in-flight script. Idempotent. */
+    stop: () => void;
+    /**
+     * One-shot replay. Cancels any in-flight run, then re-plays from
+     * step 0. Pass a delay in ms to schedule the replay (useful for
+     * "play, finish, breathe, play once more" cadences without the
+     * commitment of `loop`).
+     */
+    restart: (delayMs?: number) => void;
+}
+declare function useScriptedDemo<TStep>(opts: UseScriptedDemoOptions<TStep>): ScriptedDemoState;
+
+/**
+ * BlinkingCursor — the shared caret used by every scripted-demo
+ * surface in gradeui. Styled via CSS variables so each host (Code's
+ * terminal, Composer's inline caret, future surfaces) can tweak
+ * dimensions and colour without forking the component.
+ *
+ * Tokens read from the cascade:
+ *   --gds-demo-cursor-color   defaults to currentColor
+ *   --gds-demo-cursor-width   defaults to 0.55ch (a hair narrower than
+ *                             a monospace char so it reads as a caret
+ *                             rather than a block)
+ *   --gds-demo-cursor-height  defaults to 1.1em
+ *
+ * The animation lives in `styles/globals.css` as `.gds-demo-cursor`
+ * (alongside the other demo primitives). Keeping it in CSS rather
+ * than motion / framer keeps the cursor available in environments
+ * that disable JS animation but still render the page.
+ */
+interface BlinkingCursorProps extends Omit<React$1.HTMLAttributes<HTMLSpanElement>, "children"> {
+    /**
+     * Visual variant. `inline` (default) is for caret-in-text demos
+     * (Code, Composer). `block` is for terminal-style square cursors
+     * that fill a character cell.
+     */
+    variant?: "inline" | "block";
+}
+declare const BlinkingCursor: React$1.ForwardRefExoticComponent<BlinkingCursorProps & React$1.RefAttributes<HTMLSpanElement>>;
+
+/**
+ * DemoStage + Reveal — staged appearance for whole-interface demos.
+ *
+ * Drop `<Reveal id="hero">…</Reveal>` around any subtree that should
+ * appear on cue. Wrap a region in `<DemoStage steps={…}>` and the
+ * script drives which targets become visible, in what order, with
+ * what cadence. Same speed / trigger / loop / play semantics as
+ * `<Code>` and `<Composer>`.
+ *
+ * Why a context-based pattern instead of one-component-per-region:
+ *   - Authoring stays declarative — the script reads as a storyboard,
+ *     not as a stack of imperative ref calls.
+ *   - Reveals can live deep in a subtree without prop-drilling.
+ *   - The same `<Reveal>` works whether or not a parent stage exists
+ *     (it just renders visible if there's no context, so the same
+ *     markup ships to production without the demo wrapper).
+ *
+ * Reduced motion: if the user has `prefers-reduced-motion`, every
+ * Reveal renders immediately at its destination state — the stage's
+ * script still walks, but the visual transitions are no-ops.
+ */
+type RevealStep = {
+    type: "reveal";
+    target: string;
+} | {
+    type: "reveal-all";
+} | {
+    type: "hide";
+    target: string;
+} | {
+    type: "wait";
+    ms: number;
+} | {
+    type: "reset";
+};
+type RevealAnimation = "fade" | "fade-up" | "fade-down" | "fade-left" | "fade-right" | "scale" | "none";
+interface DemoStageProps {
+    /** Steps that drive which Reveals are visible at what time. */
+    steps?: RevealStep[];
+    /** Speed preset. Same vocabulary as Code / Composer. */
+    speed?: DemoSpeed;
+    /** When the stage starts running. Defaults to `mount`. */
+    trigger?: DemoTrigger;
+    /** For trigger="manual" — flip true to play. */
+    play?: boolean;
+    /** Loop the script forever. */
+    loop?: boolean;
+    /** Default enter animation for child Reveals that don't override. */
+    defaultAnimation?: RevealAnimation;
+    /**
+     * Render content visible by default (every target shown) when the
+     * stage has no steps. Useful for sharing the same JSX between live
+     * production use and demo playback.
+     */
+    visibleWhenIdle?: boolean;
+    className?: string;
+    children: React$1.ReactNode;
+}
+declare function DemoStage({ steps, speed, trigger, play, loop, defaultAnimation, visibleWhenIdle, className, children, }: DemoStageProps): React$1.JSX.Element;
+interface RevealProps {
+    /** Stage target id. The matching `{ type: "reveal", target: id }` step shows this. */
+    id: string;
+    /** Enter animation. Falls back to the parent stage's `defaultAnimation`. */
+    animation?: RevealAnimation;
+    /** Override transition duration (ms). Defaults to the stage speed's fadeMs. */
+    durationMs?: number;
+    /**
+     * When true and there's no parent DemoStage, render hidden anyway.
+     * Default false — naked usage renders visible so production markup
+     * matches demo markup.
+     */
+    hideOutsideStage?: boolean;
+    /**
+     * Fires when this Reveal transitions from hidden to visible. Use to
+     * kick off a nested scripted demo (Composer.restart(), Code.play(),
+     * etc) at the moment the user actually sees the surface. Without
+     * this hook, nested demos with `trigger="mount"` would run while
+     * still hidden and the user would miss the animation entirely.
+     */
+    onReveal?: () => void;
+    /**
+     * Fires when this Reveal transitions from visible to hidden (e.g.
+     * because the stage script ran a `hide` step or looped via `reset`).
+     * Use to pause/reset nested state.
+     */
+    onHide?: () => void;
+    className?: string;
+    children: React$1.ReactNode;
+}
+declare function Reveal({ id, animation, durationMs, hideOutsideStage, onReveal, onHide, className, children, }: RevealProps): React$1.JSX.Element;
+
+/**
+ * Composer — the generic text composition surface for the design system.
+ *
+ * The answer wherever a user is composing a message: AI chat input,
+ * comment thread reply, post-body editor, future copilot panels.
+ * Replaces the textarea-with-buttons pattern that hosts kept rolling
+ * by hand.
+ *
+ * Built on Lexical (Meta's React-first editor framework) so it can do:
+ *   - rich text formatting (B / I / U / S / code, headings, blockquote,
+ *     pullquote, lists)
+ *   - mentions and slash commands via lexical-beautiful-mentions, with
+ *     a typeahead popover and theme-able tokens
+ *   - image attachments (paperclip + clipboard paste) when opted in
+ *   - scripted demo playback for marketing surfaces (types text, opens
+ *     mention popovers, applies formatting, all via the same step
+ *     vocabulary as <Code>)
+ *
+ * Slot-based composition for the action row: hosts that need custom
+ * affordances (template picker, voice button, attach-document) pass
+ * `leftActions` / `rightActions`. Default Send / Stop / paperclip
+ * render only when the host hasn't replaced the slot.
+ *
+ * Hosts that want the canned "chat composer with paperclip + send"
+ * preset should reach for `<AIChatComposer>` instead, which configures
+ * this Composer with the right slots wired up.
+ *
+ * Scripted demos: same `speed` / `trigger` / `play` / `loop` vocabulary
+ * as `<Code>`, sharing the underlying `useScriptedDemo` hook from
+ * `lib/demo/`. The Composer adds its own verbs (`mention`, `format`,
+ * `select`, `submit`) on top of the universal `type` / `wait` / `clear`.
+ */
+type ComposerFormat = "bold" | "italic" | "underline" | "strikethrough" | "code" | "h1" | "h2" | "h3" | "blockquote" | "pullquote" | "ul" | "ol";
+interface ComposerMentionItem {
+    id: string;
+    /** Display value (without the trigger char). */
+    value: string;
+    /** Optional secondary label shown in the suggester. */
+    label?: string;
+    /** Avatar URL or initials for the suggester row. */
+    avatar?: string;
+    /** Arbitrary payload the host can attach to the mention. */
+    data?: Record<string, unknown>;
+}
+interface ComposerTriggerConfig {
+    /** The trigger character, eg. "@" or "/". */
+    char: string;
+    /**
+     * Items to populate the suggester. Either a static array or a
+     * resolver function (sync or async) that receives the typed query.
+     * The plugin filters automatically when items is an array.
+     */
+    items: ComposerMentionItem[] | ((query: string) => ComposerMentionItem[] | Promise<ComposerMentionItem[]>);
+    /**
+     * Whether to strip the trigger char on insert. Defaults: keep for
+     * "@" (mentions read as "@alice"), strip for "/" (commands read as
+     * "Insert image" not "/insert-image").
+     */
+    stripTrigger?: boolean;
+}
+interface ComposerAttachmentConfig {
+    /** Master enable. Set true on the prop to use defaults, or pass a config object. */
+    enabled?: boolean;
+    /** HTML accept attribute on the file input. Default "image/*". */
+    accept?: string;
+    /** Max number of attachments. Default 10. */
+    maxItems?: number;
+    /** Allow multiple selection in the file picker. Default true. */
+    multiple?: boolean;
+}
+interface ComposerAttachment {
+    id: string;
+    file: File;
+    /** Object URL owned by the composer. Hosts must NOT revoke it. */
+    previewUrl: string;
+    name: string;
+}
+interface ComposerContent {
+    /** Plain text representation of the editor contents (whitespace preserved). */
+    text: string;
+    /** Lexical editor state serialised to JSON (for round-trip persistence). */
+    json: string;
+    /** Resolved mention tokens in document order. */
+    mentions: Array<{
+        trigger: string;
+        value: string;
+        data?: Record<string, unknown>;
+    }>;
+}
+interface ComposerHandle {
+    /** Run a demo script imperatively (vs. via `steps` + `trigger="manual"`). */
+    play: (steps: ComposerStep[]) => void;
+    /** Cancel an in-flight demo. Idempotent. */
+    stop: () => void;
+    /**
+     * One-shot replay of the configured `steps`. Cancels any in-flight
+     * run, clears the editor, replays from step 0. Pass a delay (ms) to
+     * schedule the replay (useful for chaining demos). Requires `steps`
+     * to be configured.
+     */
+    restart: (delayMs?: number) => void;
+    /** Move focus into the editor. */
+    focus: () => void;
+    /** Wipe the editor. */
+    clear: () => void;
+    /** Insert plain text at the current selection. */
+    insert: (text: string) => void;
+    /** Snapshot the current content + mentions. */
+    getContent: () => ComposerContent;
+    /** Direct access to the underlying Lexical editor (escape hatch). */
+    getEditor: () => LexicalEditor | null;
+}
+/**
+ * Demo step vocabulary for Composer scripts. Shares `type` / `wait` /
+ * `clear` with the universal `lib/demo` verbs; adds composer-specific
+ * `mention`, `format`, `select`, `newline`, `submit` on top.
+ */
+type ComposerStep = {
+    type: "type";
+    text: string;
+    speed?: DemoSpeed;
+} | {
+    type: "wait";
+    ms: number;
+} | {
+    type: "clear";
+} | {
+    type: "newline";
+} | {
+    type: "submit";
+} | {
+    type: "mention";
+    /** Trigger char (must match a registered ComposerTriggerConfig.char). */
+    trigger: string;
+    /** Value to insert (without the trigger). Looks up the matching item by `value`. */
+    value: string;
+    /** Optional pre-typed query — the demo types this after the trigger char before "selecting" the value, to show the typeahead in action. */
+    query?: string;
+} | {
+    type: "format";
+    format: ComposerFormat;
+} | {
+    type: "select";
+    /** Substring to find and select. First match wins. */
+    text: string;
+};
+interface ComposerProps {
+    /** Placeholder copy shown when empty. */
+    placeholder?: string;
+    /** Initial plain text content. For richer initial state, use `initialJson`. */
+    initialText?: string;
+    /** Initial Lexical state JSON (from a previous `onSubmit` round-trip). */
+    initialJson?: string;
+    /**
+     * Available formats. Pass false to disable rich text entirely
+     * (plain text mode, half the bundle weight, no toolbar). Default
+     * enables a sensible set for most chat / comment surfaces.
+     */
+    formats?: ComposerFormat[] | false;
+    /**
+     * Render the formatting toolbar. Default false because most uses
+     * are short-form. Set true (or "top") to show the toolbar above the
+     * editor. "floating" is planned; not yet implemented.
+     */
+    toolbar?: boolean | "top";
+    /**
+     * Mention / slash command configs. Each entry registers one trigger
+     * char and its items. Pass `[{ char: "@", items: people }, { char: "/", items: commands }]`
+     * for the common chat-app setup.
+     */
+    triggers?: ComposerTriggerConfig[];
+    /**
+     * Image attachments (paperclip + clipboard paste). Pass true for
+     * defaults, an object to customise, or omit/false to skip the
+     * attachment plumbing entirely.
+     */
+    attachments?: boolean | ComposerAttachmentConfig;
+    /** Fires when the user submits (Enter, click Send, or scripted `submit` step). */
+    onSubmit?: (content: ComposerContent, attachments?: ComposerAttachment[]) => void;
+    /**
+     * Fires on every editor change with the current plain text. Use for
+     * length validation, controlled-value bridges (eg. AIChatComposer
+     * forwarding to a host's `value`/`onChange` pair), or live preview
+     * surfaces. Cheap, called frequently; debounce if you need the
+     * Lexical state JSON (use `getContent()` via ref instead).
+     */
+    onChange?: (text: string) => void;
+    /**
+     * Loading state — disables the editor + paperclip and swaps the
+     * default Send button for Stop. Has no effect when `rightActions`
+     * overrides the default Send.
+     */
+    isLoading?: boolean;
+    /** Stop handler — required for Stop to be active when loading. */
+    onStop?: () => void;
+    /** Hard character cap. */
+    maxLength?: number;
+    /** Auto-focus the editor on mount. Default false. */
+    autoFocus?: boolean;
+    /** Whether Enter submits. Default true (Shift-Enter still inserts a newline). */
+    submitOnEnter?: boolean;
+    /**
+     * Custom content for the left action slot. Replaces the default
+     * paperclip button when `attachments` is enabled.
+     */
+    leftActions?: React$1.ReactNode;
+    /**
+     * Custom content for the right action slot. Replaces the default
+     * Send / Stop button. Use the `useComposer()` hook inside to access
+     * imperative methods.
+     */
+    rightActions?: React$1.ReactNode;
+    /** Hide the default Send button without replacing it. */
+    hideSend?: boolean;
+    /** Scripted demo steps. */
+    steps?: ComposerStep[];
+    /** What kicks the script off. Defaults to "mount". */
+    trigger?: DemoTrigger;
+    /** For trigger="manual" — flip true to play. */
+    play?: boolean;
+    /** Animation feel. */
+    speed?: DemoSpeed;
+    /** Loop the script forever. */
+    loop?: boolean;
+    /**
+     * Pause between loop iterations (ms). Defaults to 2000. Marketing
+     * heroes that want the demo to breathe between repeats bump this
+     * higher; tight inline demos drop it.
+     */
+    loopDelay?: number;
+    /**
+     * Fires once per loop cycle, AFTER the loopDelay pause and BEFORE
+     * the script replays. Use to reset parent state that the script
+     * mutated via onSubmit (e.g., wipe a messages list back to its
+     * seed before the demo types into it again). The editor is cleared
+     * automatically — you only need this hook if state outside the
+     * Composer needs to reset too.
+     */
+    onLoopReset?: () => void;
+    /**
+     * Bare mode — strip the card chrome (border / bg / rounding). Use
+     * when embedding inside an existing card or column layout.
+     */
+    bare?: boolean;
+    /**
+     * Read-only mode — disables editing AND focusability. Programmatic
+     * updates (including scripted demo playback) still work. Use for
+     * marketing surfaces that render a Composer purely for show, so the
+     * scripted typing doesn't steal focus from other inputs on the page.
+     * Hides the default Send / paperclip action row.
+     */
+    readOnly?: boolean;
+    className?: string;
+}
+declare const Composer: React$1.ForwardRefExoticComponent<ComposerProps & React$1.RefAttributes<ComposerHandle>>;
+declare const ComposerReply: React$1.ForwardRefExoticComponent<ComposerProps & React$1.RefAttributes<ComposerHandle>>;
+
 /**
  * DatePicker + DateRangePicker
  *
@@ -1232,7 +1912,7 @@ declare const RadioGroupItem: React$1.ForwardRefExoticComponent<Omit<RadioGroupP
  *   </ResizablePanelGroup>
  */
 declare const ResizablePanelGroup: ({ className, ...props }: React$1.ComponentProps<typeof ResizablePrimitive.PanelGroup>) => React$1.JSX.Element;
-declare const ResizablePanel: React$1.ForwardRefExoticComponent<Omit<React$1.HTMLAttributes<HTMLDivElement | HTMLElement | HTMLObjectElement | HTMLSelectElement | HTMLTextAreaElement | HTMLMapElement | HTMLTitleElement | HTMLButtonElement | HTMLLinkElement | HTMLLabelElement | HTMLStyleElement | HTMLSourceElement | HTMLHtmlElement | HTMLTableColElement | HTMLVideoElement | HTMLAudioElement | HTMLEmbedElement | HTMLProgressElement | HTMLHRElement | HTMLTableElement | HTMLAnchorElement | HTMLFormElement | HTMLHeadingElement | HTMLImageElement | HTMLInputElement | HTMLLIElement | HTMLOListElement | HTMLParagraphElement | HTMLSpanElement | HTMLUListElement | HTMLAreaElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLCanvasElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDListElement | HTMLFieldSetElement | HTMLHeadElement | HTMLIFrameElement | HTMLLegendElement | HTMLMetaElement | HTMLMeterElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLPreElement | HTMLSlotElement | HTMLScriptElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLTableCaptionElement | HTMLMenuElement | HTMLPictureElement>, "id" | "onResize"> & {
+declare const ResizablePanel: React$1.ForwardRefExoticComponent<Omit<React$1.HTMLAttributes<HTMLHeadElement | HTMLElement | HTMLLinkElement | HTMLDivElement | HTMLObjectElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLButtonElement | HTMLCanvasElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadingElement | HTMLHRElement | HTMLHtmlElement | HTMLIFrameElement | HTMLImageElement | HTMLInputElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLMapElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLPreElement | HTMLProgressElement | HTMLScriptElement | HTMLSelectElement | HTMLSlotElement | HTMLSourceElement | HTMLSpanElement | HTMLStyleElement | HTMLTableElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTemplateElement | HTMLTextAreaElement | HTMLTimeElement | HTMLTitleElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLTableCaptionElement | HTMLMenuElement | HTMLPictureElement>, "id" | "onResize"> & {
     className?: string | undefined;
     collapsedSize?: number | undefined;
     collapsible?: boolean | undefined;
@@ -1272,8 +1952,8 @@ declare const ResizableHandle: ({ withHandle, className, ...props }: React$1.Com
  */
 declare const rowVariants: (props?: ({
     gap?: "none" | "sm" | "md" | "lg" | "xs" | "xl" | "2xl" | null | undefined;
-    align?: "start" | "center" | "end" | "stretch" | "baseline" | null | undefined;
-    justify?: "start" | "center" | "between" | "end" | "around" | "evenly" | null | undefined;
+    align?: "center" | "start" | "end" | "stretch" | "baseline" | null | undefined;
+    justify?: "center" | "start" | "between" | "end" | "around" | "evenly" | null | undefined;
     wrap?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface RowProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof rowVariants> {
@@ -1308,7 +1988,7 @@ declare const Row: React$1.ForwardRefExoticComponent<RowProps & React$1.RefAttri
 declare const gridVariants: (props?: ({
     cols?: "1" | "2" | "3" | "4" | "5" | "6" | "12" | null | undefined;
     gap?: "none" | "sm" | "md" | "lg" | "xs" | "xl" | "2xl" | null | undefined;
-    align?: "start" | "center" | "end" | "stretch" | null | undefined;
+    align?: "center" | "start" | "end" | "stretch" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface GridProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof gridVariants> {
     /** When true, render as the single child element via Radix Slot — lets
@@ -1340,10 +2020,10 @@ declare const Grid: React$1.ForwardRefExoticComponent<GridProps & React$1.RefAtt
  * case. Flex is the escape hatch, not the default.
  */
 declare const flexVariants: (props?: ({
-    direction?: "row" | "col" | "row-reverse" | "col-reverse" | null | undefined;
+    direction?: "col" | "row" | "row-reverse" | "col-reverse" | null | undefined;
     gap?: "none" | "sm" | "md" | "lg" | "xs" | "xl" | "2xl" | null | undefined;
-    align?: "start" | "center" | "end" | "stretch" | "baseline" | null | undefined;
-    justify?: "start" | "center" | "between" | "end" | "around" | "evenly" | null | undefined;
+    align?: "center" | "start" | "end" | "stretch" | "baseline" | null | undefined;
+    justify?: "center" | "start" | "between" | "end" | "around" | "evenly" | null | undefined;
     wrap?: "wrap" | "nowrap" | "wrap-reverse" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface FlexProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof flexVariants> {
@@ -1389,7 +2069,7 @@ declare const SheetClose: React$1.ForwardRefExoticComponent<DialogPrimitive.Dial
 declare const SheetPortal: React$1.FC<DialogPrimitive.DialogPortalProps>;
 declare const SheetOverlay: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
 declare const sheetVariants: (props?: ({
-    side?: "top" | "right" | "bottom" | "left" | null | undefined;
+    side?: "bottom" | "top" | "right" | "left" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface SheetContentProps extends React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, VariantProps<typeof sheetVariants> {
     /**
@@ -1528,8 +2208,8 @@ declare const Sortable: SortableRootComponent;
  */
 declare const stackVariants: (props?: ({
     gap?: "none" | "sm" | "md" | "lg" | "xs" | "xl" | "2xl" | null | undefined;
-    align?: "start" | "center" | "end" | "stretch" | null | undefined;
-    justify?: "start" | "center" | "between" | "end" | "around" | "evenly" | null | undefined;
+    align?: "center" | "start" | "end" | "stretch" | null | undefined;
+    justify?: "center" | "start" | "between" | "end" | "around" | "evenly" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface StackProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof stackVariants> {
     /** When true, render as the single child element via Radix Slot — lets
@@ -1749,7 +2429,7 @@ declare const ToggleGroupItem: React$1.ForwardRefExoticComponent<Omit<ToggleGrou
  * persistent footer toolbars on mobile-style layouts.
  */
 declare const toolbarVariants: (props?: ({
-    position?: "top" | "bottom" | "inline" | null | undefined;
+    position?: "bottom" | "top" | "inline" | null | undefined;
     variant?: "default" | "transparent" | "subtle" | null | undefined;
     size?: "sm" | "md" | "lg" | null | undefined;
     sticky?: boolean | null | undefined;
@@ -3076,4 +3756,4 @@ declare function GradeModeSwitcher({ className, variant }: GradeModeSwitcherProp
  */
 declare function ThemeToggle(): React$1.JSX.Element;
 
-export { ALL_MODES, Accordion, AccordionContent, AccordionItem, AccordionTrigger, AppShell, AppShellAside, type AppShellAsideProps, AppShellFooter, type AppShellFooterProps, AppShellHeader, type AppShellHeaderProps, AppShellMain, type AppShellMainProps, AppShellNav, type AppShellNavProps, type AppShellProps, Avatar, AvatarFallback, AvatarImage, BUILT_IN_INPUTS, Badge, Banner, type BannerProps, type BaseMediaProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, type BreadcrumbMenuItem, BreadcrumbMenuTrigger, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonShape, COMPONENT_CONTRACTS, Calendar, CalendarDayButton, Callout, CalloutDescription, CalloutTitle, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardStyle, CardTitle, Carousel, CarouselArrows, type CarouselArrowsProps, type AutoplayConfig as CarouselAutoplayConfig, CarouselDots, type CarouselDotsProps, type CarouselNavButtonProps, CarouselNext, CarouselPrev, type CarouselProps, CarouselSlide, type CarouselSlideProps, CarouselVideoSlide, type CarouselVideoSlideProps, type ChartPalette, Checkbox, Code, type CodeDiff, type CodeLanguage, type CodeProps, type CodeReveal, type CodeTrigger, type ColorIntensity, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FRAGMENT_HEADER, Flex, type FlexProps, type FontKey, GRADE_PRE_HYDRATION_SCRIPT, type GeneratedTheme, GradeModeSwitcher, GradeThemeProvider, type GradeThemeProviderProps, GradeThemeSwitcher, Grid, type GridProps, Input, type InputStyle, Label, LenisProvider, Map, MapHandle, MapMarker, MapMarkerProps, MapProps, type MediaAspect, type MediaRadius, MediaSurface, MediaSurfaceContract, type MediaSurfaceProps, type ModeName, MultiSelect, type MultiSelectOption, type MultiSelectProps, type OKLCHTriplet, type Palette, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, type PostPreset, Progress, RadioGroup, RadioGroupItem, type RadiusStyle, type Ramp, ResizableHandle, ResizablePanel, ResizablePanelGroup, RivePlayer, type RivePlayerProps, Row, type RowProps, type SceneContext, type SceneFactory, type SceneHandle, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, ShaderCompileError, type ShaderPreset, ShaderPresetPicker, type ShaderPresetPickerProps, ShaderPresetPreview, type ShaderPresetPreviewProps, type ShadowIntensity, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, type SidebarContentProps, SidebarFooter, type SidebarFooterProps, SidebarHeader, type SidebarHeaderProps, SidebarItem, type SidebarItemProps, type SidebarProps, SidebarSection, type SidebarSectionProps, SidebarTreeItem, type SidebarTreeItemProps, Skeleton, Slider, Sortable, SortableGroup, type SortableGroupProps, SortableHandle, type SortableHandleProps, SortableItem, type SortableItemProps, type SortableProps, type SpacingDensity, Stack, type StackProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type ThemeInput, ThemeToggle, ThreeScene, type ThreeSceneProps, Toggle, ToggleGroup, ToggleGroupItem, Toolbar, type ToolbarProps, ToolbarSlot, type ToolbarSlotProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type TypeScalePreset, VideoPlayer, type VideoPlayerProps, asideVariants as appShellAsideVariants, footerVariants as appShellFooterVariants, headerVariants as appShellHeaderVariants, mainVariants as appShellMainVariants, navVariants as appShellNavVariants, applyThemeToRoot, badgeVariants, bannerVariants, buildFragmentShaderScene, builtInThemes, buttonVariants, calloutVariants, calmInput, cn, defaultPostPreset, defaultThemeId, deleteUserTheme, duplicateTheme, energyInput, flexVariants, generateTheme, getComponentContract, getTheme, gridVariants, listContractedComponents, listThemes, listUserThemes, loadUserThemeInput, postPresets, rowVariants, saveUserTheme, sceneRegistry, shaderPresetById, shaderPresets, shellVariants, stackVariants, themeToCSSVars, toggleVariants, useCarouselApi, useGradeTheme, useMaybeGradeTheme, usePrefersReducedMotion };
+export { ALL_MODES, Accordion, AccordionContent, AccordionItem, AccordionTrigger, AppShell, AppShellAside, type AppShellAsideProps, AppShellFooter, type AppShellFooterProps, AppShellHeader, type AppShellHeaderProps, AppShellMain, type AppShellMainProps, AppShellNav, type AppShellNavProps, type AppShellProps, Avatar, AvatarFallback, AvatarImage, BUILT_IN_INPUTS, Badge, Banner, type BannerProps, type BaseMediaProps, BlinkingCursor, type BlinkingCursorProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, type BreadcrumbMenuItem, BreadcrumbMenuTrigger, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonShape, COMPONENT_CONTRACTS, Calendar, CalendarDayButton, Callout, CalloutDescription, CalloutTitle, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardStyle, CardTitle, Carousel, CarouselArrows, type CarouselArrowsProps, type AutoplayConfig as CarouselAutoplayConfig, CarouselDots, type CarouselDotsProps, type CarouselNavButtonProps, CarouselNext, CarouselPrev, type CarouselProps, CarouselSlide, type CarouselSlideProps, CarouselVideoSlide, type CarouselVideoSlideProps, type ChartPalette, Checkbox, Code, type CodeDiff, type CodeLanguage, type CodeProps, type CodeReveal, type CodeTrigger, type ColorIntensity, Composer, type ComposerAttachment, type ComposerAttachmentConfig, type ComposerContent, type ComposerFormat, type ComposerHandle, type ComposerMentionItem, type ComposerProps, ComposerReply, type ComposerStep, type ComposerTriggerConfig, DEMO_SPEED_PRESETS, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, type DemoSpeed, DemoStage, type DemoStageProps, type DemoTrigger, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FRAGMENT_HEADER, Flex, type FlexProps, type FontKey, GRADE_PRE_HYDRATION_SCRIPT, type GeneratedTheme, GradeModeSwitcher, GradeThemeProvider, type GradeThemeProviderProps, GradeThemeSwitcher, Grid, type GridProps, Input, type InputStyle, Label, LenisProvider, Map, MapHandle, MapMarker, MapMarkerProps, MapProps, type MediaAspect, type MediaRadius, MediaSurface, MediaSurfaceContract, type MediaSurfaceProps, Message, type MessageProps, type ModeName, MultiSelect, type MultiSelectOption, type MultiSelectProps, type OKLCHTriplet, type Palette, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, type PostPreset, Progress, RadioGroup, RadioGroupItem, type RadiusStyle, type Ramp, ResizableHandle, ResizablePanel, ResizablePanelGroup, Reveal, type RevealAnimation, type RevealProps, type RevealStep, RivePlayer, type RivePlayerProps, Row, type RowProps, type SceneContext, type SceneFactory, type SceneHandle, type ScriptedDemoContext, type ScriptedDemoState, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, ShaderCompileError, type ShaderPreset, ShaderPresetPicker, type ShaderPresetPickerProps, ShaderPresetPreview, type ShaderPresetPreviewProps, type ShadowIntensity, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, type SidebarContentProps, SidebarFooter, type SidebarFooterProps, SidebarHeader, type SidebarHeaderProps, SidebarItem, type SidebarItemProps, type SidebarProps, SidebarSection, type SidebarSectionProps, SidebarTreeItem, type SidebarTreeItemProps, Skeleton, Slider, Sortable, SortableGroup, type SortableGroupProps, SortableHandle, type SortableHandleProps, SortableItem, type SortableItemProps, type SortableProps, type SpacingDensity, Stack, type StackProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type ThemeInput, ThemeToggle, ThreeScene, type ThreeSceneProps, Toggle, ToggleGroup, ToggleGroupItem, Toolbar, type ToolbarProps, ToolbarSlot, type ToolbarSlotProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type TypeScalePreset, type UseScriptedDemoOptions, VideoPlayer, type VideoPlayerProps, asideVariants as appShellAsideVariants, footerVariants as appShellFooterVariants, headerVariants as appShellHeaderVariants, mainVariants as appShellMainVariants, navVariants as appShellNavVariants, applyThemeToRoot, badgeVariants, bannerVariants, buildFragmentShaderScene, builtInThemes, buttonVariants, calloutVariants, calmInput, cn, defaultPostPreset, defaultThemeId, deleteUserTheme, sleep as demoSleep, typeText as demoTypeText, duplicateTheme, energyInput, flexVariants, generateTheme, getComponentContract, getTheme, gridVariants, listContractedComponents, listThemes, listUserThemes, loadUserThemeInput, postPresets, rowVariants, saveUserTheme, sceneRegistry, shaderPresetById, shaderPresets, shellVariants, stackVariants, themeToCSSVars, toggleVariants, useCarouselApi, useGradeTheme, useMaybeGradeTheme, usePrefersReducedMotion, useScriptedDemo };