@akhil-saxena/design-system 1.4.2 → 1.6.0

package/README.md

@@ -1,8 +1,8 @@
 # @akhil-saxena/design-system
 
-Accessible React primitives with semantic tokens. Full dark mode, cream + ink + amber design language.
+Accessible React primitives with semantic tokens. Full dark mode, neutral paper + ink + amber editorial design language.
 
-**v1.4.2 — 77 components across 9 categories.**
+**v1.6.0 — 79 components across 9 categories.**
 
 [![npm](https://img.shields.io/npm/v/@akhil-saxena/design-system)](https://www.npmjs.com/package/@akhil-saxena/design-system)
 
@@ -110,8 +110,8 @@ From `@akhil-saxena/design-system/hooks`:
 
 CSS custom properties in `tokens.css`:
 
-- **Color** - cream/ink/amber ramps + AAA-tuned blue/purple/green/red status colors
-- **Typography** - Inter (body), Archivo (display), JetBrains Mono (code/data)
+- **Color** - neutral surface/ink ramps + amber accent + AAA-tuned blue/purple/green/red status colors
+- **Typography** - Inter (body), Archivo (display), Newsreader (editorial serif), JetBrains Mono (code/data)
 - **Spacing** - 4px base, 12-step scale (4..64px)
 - **Radius** - sm / md / lg / xl / pill
 - **Shadow** - 1 / 2 / 3

package/dist/hooks/index.d.ts

@@ -42,6 +42,24 @@ interface ShortcutOptions {
  */
 declare function useKeyboardShortcut(combo: string | string[], handler: (e: KeyboardEvent) => void, options?: ShortcutOptions): void;
 
+interface LongPressHandlers {
+    onPointerDown: (e: React.PointerEvent) => void;
+    onPointerUp: (e: React.PointerEvent) => void;
+    onPointerCancel: (e: React.PointerEvent) => void;
+    onPointerLeave: (e: React.PointerEvent) => void;
+}
+/**
+ * Fires `onLongPress` when a pointer is held for `ms` (default 600ms). Mouse
+ * users release well under the threshold, so it stays inert on desktop — pair
+ * it with a hover-reveal affordance there and a long-press → ActionSheet on
+ * touch. Spread the returned handlers onto the target element.
+ *
+ * @example
+ * const lp = useLongPress(() => setSheetOpen(true));
+ * return <div {...lp}>…</div>;
+ */
+declare function useLongPress(onLongPress: () => void, ms?: number): LongPressHandlers;
+
 /**
  * Returns the `matches` boolean for an arbitrary CSS media query, reactive
  * to viewport changes (resize, rotation, prefers-* toggles at runtime).
@@ -142,4 +160,4 @@ declare function useResizableColumns(initialWidths: Record<string, number>, opti
     startResize: (col: string, e: react__default.PointerEvent) => void;
 };
 
-export { type SelectionMode, type SortState, useClickOutside, useComposedRefs, useFocusTrap, useKeyboardShortcut, useMatchMedia, useReducedMotion, useResizableColumns, useSortableTable, useTableSelection };
+export { type LongPressHandlers, type SelectionMode, type SortState, useClickOutside, useComposedRefs, useFocusTrap, useKeyboardShortcut, useLongPress, useMatchMedia, useReducedMotion, useResizableColumns, useSortableTable, useTableSelection };

package/dist/hooks/index.js

@@ -1,5 +1,5 @@
 export { useClickOutside, useComposedRefs, useFocusTrap, useMatchMedia, useReducedMotion, useResizableColumns, useSortableTable, useTableSelection } from '../chunk-34YNJKI2.js';
-import { useEffect } from 'react';
+import { useEffect, useRef } from 'react';
 
 var isMac = typeof navigator !== "undefined" && /Mac|iPhone|iPad/.test(navigator.platform);
 function parseCombo(combo) {
@@ -48,7 +48,28 @@ function useKeyboardShortcut(combo, handler, options = {}) {
     };
   }, [combo, handler, enabled, preventDefault, target]);
 }
+function useLongPress(onLongPress, ms = 600) {
+  const timer = useRef(null);
+  const start = () => {
+    if (timer.current) clearTimeout(timer.current);
+    timer.current = setTimeout(() => {
+      onLongPress();
+    }, ms);
+  };
+  const cancel = () => {
+    if (timer.current) {
+      clearTimeout(timer.current);
+      timer.current = null;
+    }
+  };
+  return {
+    onPointerDown: start,
+    onPointerUp: cancel,
+    onPointerCancel: cancel,
+    onPointerLeave: cancel
+  };
+}
 
-export { useKeyboardShortcut };
+export { useKeyboardShortcut, useLongPress };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/useKeyboardShortcut.ts"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["import { useEffect } from \"react\";\n\ninterface ShortcutOptions {\n\tenabled?: boolean;\n\tpreventDefault?: boolean;\n\ttarget?: HTMLElement | Window;\n}\n\nconst isMac = typeof navigator !== \"undefined\" && /Mac|iPhone|iPad/.test(navigator.platform);\n\ninterface ParsedCombo {\n\tkey: string;\n\tmod: boolean;\n\tctrl: boolean;\n\tshift: boolean;\n\talt: boolean;\n}\n\nfunction parseCombo(combo: string): ParsedCombo {\n\tconst parts = combo\n\t\t.toLowerCase()\n\t\t.split(\"+\")\n\t\t.map((p) => p.trim());\n\tconst out: ParsedCombo = {\n\t\tkey: \"\",\n\t\tmod: false,\n\t\tctrl: false,\n\t\tshift: false,\n\t\talt: false,\n\t};\n\tfor (const p of parts) {\n\t\tif (p === \"mod\") out.mod = true;\n\t\telse if (p === \"ctrl\") out.ctrl = true;\n\t\telse if (p === \"shift\") out.shift = true;\n\t\telse if (p === \"alt\" || p === \"opt\") out.alt = true;\n\t\telse out.key = p;\n\t}\n\treturn out;\n}\n\nfunction matches(e: KeyboardEvent, combo: ParsedCombo): boolean {\n\tif (e.key.toLowerCase() !== combo.key.toLowerCase()) return false;\n\tconst modPressed = isMac ? e.metaKey : e.ctrlKey;\n\tif (combo.mod && !modPressed) return false;\n\tif (combo.ctrl && !e.ctrlKey) return false;\n\tif (combo.shift !== e.shiftKey) return false;\n\tif (combo.alt !== e.altKey) return false;\n\treturn true;\n}\n\n/**\n * Bind a keyboard shortcut. Use \"mod+k\" for Cmd-on-Mac, Ctrl-on-Win/Linux.\n * Used by CommandPalette (Phase 17 - ⌘K), Modal Esc-to-close (Phase 14).\n */\nexport function useKeyboardShortcut(\n\tcombo: string | string[],\n\thandler: (e: KeyboardEvent) => void,\n\toptions: ShortcutOptions = {},\n): void {\n\tconst { enabled = true, preventDefault = false, target } = options;\n\tuseEffect(() => {\n\t\tif (!enabled) return;\n\t\tconst combos = (Array.isArray(combo) ? combo : [combo]).map(parseCombo);\n\t\tconst t: EventTarget = target ?? (typeof window !== \"undefined\" ? window : ({} as EventTarget));\n\t\tfunction listener(ev: Event) {\n\t\t\tconst e = ev as KeyboardEvent;\n\t\t\tif (combos.some((c) => matches(e, c))) {\n\t\t\t\tif (preventDefault) e.preventDefault();\n\t\t\t\thandler(e);\n\t\t\t}\n\t\t}\n\t\tt.addEventListener(\"keydown\", listener);\n\t\treturn () => {\n\t\t\tt.removeEventListener(\"keydown\", listener);\n\t\t};\n\t}, [combo, handler, enabled, preventDefault, target]);\n}\n"]}
+{"version":3,"sources":["../../src/hooks/useKeyboardShortcut.ts","../../src/hooks/useLongPress.ts"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["import { useEffect } from \"react\";\n\ninterface ShortcutOptions {\n\tenabled?: boolean;\n\tpreventDefault?: boolean;\n\ttarget?: HTMLElement | Window;\n}\n\nconst isMac = typeof navigator !== \"undefined\" && /Mac|iPhone|iPad/.test(navigator.platform);\n\ninterface ParsedCombo {\n\tkey: string;\n\tmod: boolean;\n\tctrl: boolean;\n\tshift: boolean;\n\talt: boolean;\n}\n\nfunction parseCombo(combo: string): ParsedCombo {\n\tconst parts = combo\n\t\t.toLowerCase()\n\t\t.split(\"+\")\n\t\t.map((p) => p.trim());\n\tconst out: ParsedCombo = {\n\t\tkey: \"\",\n\t\tmod: false,\n\t\tctrl: false,\n\t\tshift: false,\n\t\talt: false,\n\t};\n\tfor (const p of parts) {\n\t\tif (p === \"mod\") out.mod = true;\n\t\telse if (p === \"ctrl\") out.ctrl = true;\n\t\telse if (p === \"shift\") out.shift = true;\n\t\telse if (p === \"alt\" || p === \"opt\") out.alt = true;\n\t\telse out.key = p;\n\t}\n\treturn out;\n}\n\nfunction matches(e: KeyboardEvent, combo: ParsedCombo): boolean {\n\tif (e.key.toLowerCase() !== combo.key.toLowerCase()) return false;\n\tconst modPressed = isMac ? e.metaKey : e.ctrlKey;\n\tif (combo.mod && !modPressed) return false;\n\tif (combo.ctrl && !e.ctrlKey) return false;\n\tif (combo.shift !== e.shiftKey) return false;\n\tif (combo.alt !== e.altKey) return false;\n\treturn true;\n}\n\n/**\n * Bind a keyboard shortcut. Use \"mod+k\" for Cmd-on-Mac, Ctrl-on-Win/Linux.\n * Used by CommandPalette (Phase 17 - ⌘K), Modal Esc-to-close (Phase 14).\n */\nexport function useKeyboardShortcut(\n\tcombo: string | string[],\n\thandler: (e: KeyboardEvent) => void,\n\toptions: ShortcutOptions = {},\n): void {\n\tconst { enabled = true, preventDefault = false, target } = options;\n\tuseEffect(() => {\n\t\tif (!enabled) return;\n\t\tconst combos = (Array.isArray(combo) ? combo : [combo]).map(parseCombo);\n\t\tconst t: EventTarget = target ?? (typeof window !== \"undefined\" ? window : ({} as EventTarget));\n\t\tfunction listener(ev: Event) {\n\t\t\tconst e = ev as KeyboardEvent;\n\t\t\tif (combos.some((c) => matches(e, c))) {\n\t\t\t\tif (preventDefault) e.preventDefault();\n\t\t\t\thandler(e);\n\t\t\t}\n\t\t}\n\t\tt.addEventListener(\"keydown\", listener);\n\t\treturn () => {\n\t\t\tt.removeEventListener(\"keydown\", listener);\n\t\t};\n\t}, [combo, handler, enabled, preventDefault, target]);\n}\n","import { useRef } from \"react\";\n\nexport interface LongPressHandlers {\n\tonPointerDown: (e: React.PointerEvent) => void;\n\tonPointerUp: (e: React.PointerEvent) => void;\n\tonPointerCancel: (e: React.PointerEvent) => void;\n\tonPointerLeave: (e: React.PointerEvent) => void;\n}\n\n/**\n * Fires `onLongPress` when a pointer is held for `ms` (default 600ms). Mouse\n * users release well under the threshold, so it stays inert on desktop — pair\n * it with a hover-reveal affordance there and a long-press → ActionSheet on\n * touch. Spread the returned handlers onto the target element.\n *\n * @example\n * const lp = useLongPress(() => setSheetOpen(true));\n * return <div {...lp}>…</div>;\n */\nexport function useLongPress(onLongPress: () => void, ms = 600): LongPressHandlers {\n\tconst timer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n\tconst start = () => {\n\t\tif (timer.current) clearTimeout(timer.current);\n\t\ttimer.current = setTimeout(() => {\n\t\t\tonLongPress();\n\t\t}, ms);\n\t};\n\tconst cancel = () => {\n\t\tif (timer.current) {\n\t\t\tclearTimeout(timer.current);\n\t\t\ttimer.current = null;\n\t\t}\n\t};\n\n\treturn {\n\t\tonPointerDown: start,\n\t\tonPointerUp: cancel,\n\t\tonPointerCancel: cancel,\n\t\tonPointerLeave: cancel,\n\t};\n}\n"]}

package/dist/index.d.ts

@@ -129,6 +129,27 @@ interface InlineEditFieldProps {
 }
 declare function InlineEditField({ value, onSave, multiline, placeholder, disabled, maxLength, ariaLabel, font, className, style, }: InlineEditFieldProps): react_jsx_runtime.JSX.Element;
 
+interface InlineAddRowProps {
+    /** Placeholder shown in both the dashed trigger and the active input. */
+    placeholder?: string;
+    /** Called with the trimmed value when the user commits (Enter). */
+    onSave: (value: string) => void;
+    /** Keyboard hint rendered at the right edge of the active input. */
+    kbdHint?: string;
+    className?: string;
+    style?: CSSProperties;
+}
+/**
+ * InlineAddRow — a dashed "+ add" affordance that expands into an inline text
+ * input on click. Enter commits (`onSave` with the trimmed value); Esc or blur
+ * discards. Use for "add a question / note / person / row" patterns where a full
+ * form is overkill.
+ *
+ * @example
+ * <InlineAddRow placeholder="Add a question…" onSave={(t) => addQuestion(t)} />
+ */
+declare const InlineAddRow: react.ForwardRefExoticComponent<InlineAddRowProps & react.RefAttributes<HTMLDivElement>>;
+
 type EyebrowSize = "xs" | "sm" | "md";
 type EyebrowTone = "ink-3" | "ink-4" | "amber";
 interface EyebrowProps extends HTMLAttributes<HTMLSpanElement> {
@@ -410,6 +431,18 @@ interface AvatarProps extends HTMLAttributes<HTMLDivElement> {
     name?: string;
     /** Override the auto-derived initials (1–2 uppercase letters). */
     initials?: string;
+    /**
+     * Derive the background color from this string instead of `name` — e.g. a
+     * stable id — so the color stays fixed even if the display name changes.
+     * Initials are still derived from `name`/`initials`.
+     */
+    seed?: string;
+    /**
+     * Override the built-in solid-color palette used for the name→color hash.
+     * Pass a custom set (e.g. WCAG-tuned colors) to control which colors the
+     * deterministic hash can land on. Ignored when `gradient` is set.
+     */
+    palette?: string[];
     /**
      * URL of an image to display. When provided, the image fills the circle and
      * initials/background are not rendered.
@@ -1122,6 +1155,13 @@ interface BottomSheetProps {
      * Defaults to detecting `html.dark` (Canvas dark mode toggle).
      */
     dark?: boolean;
+    /**
+     * Track the mobile soft keyboard via `window.visualViewport` and lift the
+     * footer above it (padding-bottom = visible-viewport delta). Defaults to
+     * true. Set false to opt out; it is a no-op anyway on platforms without a
+     * `visualViewport` (e.g. desktop) or when there is no footer.
+     */
+    trackKeyboard?: boolean;
     className?: string;
     style?: CSSProperties;
 }
@@ -1155,7 +1195,38 @@ interface BottomSheetProps {
  * feeding it into useFocusTrap's `active` arg ensures the trap re-runs
  * once the portal commits the panel into the DOM.
  */
-declare function BottomSheet({ open, onClose, title, footer, children, height, closeOnBackdropClick, dark, className, style, }: BottomSheetProps): react_jsx_runtime.JSX.Element | null;
+declare function BottomSheet({ open, onClose, title, footer, children, height, closeOnBackdropClick, dark, trackKeyboard, className, style, }: BottomSheetProps): react_jsx_runtime.JSX.Element | null;
+
+interface ActionSheetItem {
+    label: string;
+    /** `"destructive"` renders the label in `--red`. */
+    variant?: "default" | "destructive";
+    onSelect: () => void;
+}
+interface ActionSheetProps {
+    open: boolean;
+    onClose: () => void;
+    items: ActionSheetItem[];
+    /** Dismiss-without-picking label. Default "Close". Backdrop tap + Esc also dismiss. */
+    cancelLabel?: string;
+}
+/**
+ * ActionSheet — an iOS-style bottom-anchored action list: a rounded block of
+ * tappable items plus a separate Cancel block. Backdrop tap, the Cancel button,
+ * and Esc all dismiss; body scroll locks while open. Pair with `useLongPress`
+ * for the touch "long-press → actions" pattern.
+ *
+ * @example
+ * <ActionSheet
+ *   open={open}
+ *   onClose={() => setOpen(false)}
+ *   items={[
+ *     { label: "Edit", onSelect: edit },
+ *     { label: "Delete", variant: "destructive", onSelect: remove },
+ *   ]}
+ * />
+ */
+declare function ActionSheet({ open, onClose, items, cancelLabel }: ActionSheetProps): react.ReactPortal | null;
 
 interface LightboxItem {
     src: string;
@@ -1527,6 +1598,12 @@ interface SnackbarOptions {
      * Pass an explicit boolean to override.
      */
     dismissible?: boolean;
+    /** Render a thin countdown progress bar along the bottom edge that depletes
+     * (width 100% → 0%) linearly over `duration` ms — a visual undo timer
+     * (matches the SoftConfirmToast pattern). Only renders when `true` AND
+     * `duration` is finite. Respects `prefers-reduced-motion: reduce` (the bar
+     * is shown static, no animation). Default `false`. */
+    progress?: boolean;
 }
 interface SnackbarApi {
     /** Show a snackbar. Replaces any active snackbar (single-at-a-time). */
@@ -2002,10 +2079,28 @@ interface ColorInputProps {
  */
 declare function ColorInput({ value, onChange, defaultValue, label, className, style, }: ColorInputProps): react_jsx_runtime.JSX.Element;
 
+/**
+ * Optional per-option active colors. When set, the option uses these
+ * foreground/background colors *while active* instead of the default amber
+ * pill. Prefer DS CSS-var tokens (e.g. `var(--green)`). Inactive options are
+ * unaffected and render with default styling.
+ */
+interface SegmentedTone {
+    /** Text color of the option while active. */
+    fg: string;
+    /** Background of the option while active. */
+    activeBg: string;
+}
 interface SegmentedOption<T extends string = string> {
     value: T;
     label: string;
     disabled?: boolean;
+    /**
+     * Optional per-option active tone. When provided, the *active* segment
+     * renders with `tone.fg` / `tone.activeBg` instead of the default amber.
+     * Omit for the standard styling (fully backward compatible).
+     */
+    tone?: SegmentedTone;
 }
 interface SegmentedControlProps<T extends string = string> {
     options: SegmentedOption<T>[];
@@ -2513,6 +2608,17 @@ interface RichTextProps {
     ariaLabel?: string;
     /** Inline styles applied to the outer root wrapper. */
     style?: CSSProperties;
+    /** Borderless/inline mode: strips the editor chrome (border, background, padding,
+     * min-height) so the editor sits inline inside a card or click-to-edit surface.
+     * Purely additive - default keeps the bordered "card" appearance.
+     * @default false
+     */
+    inline?: boolean;
+    /** Show a keyboard-shortcut hint strip (⌘B ⌘I ⌘U ⌘⇧H ⌘K ⌘↵ Esc) that is revealed
+     * while the editor has focus. Suppressed in `readOnly` mode.
+     * @default false
+     */
+    hints?: boolean;
 }
 declare const RichText: react.ForwardRefExoticComponent<RichTextProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -2825,4 +2931,4 @@ declare function SortableItem({ id, children, reducedMotion }: SortableItemProps
 declare function SortableDndContext({ children, onMove, renderOverlay }: SortableDndContextProps): react_jsx_runtime.JSX.Element;
 declare function Sortable({ items, onReorder, renderItem, id, className, style }: SortableProps): react_jsx_runtime.JSX.Element;
 
-export { Accordion, type AccordionItemProps, type AccordionProps, AlertBanner, type AlertBannerProps, type AlertBannerTone, AppBar, type AppBarProps, type AppBarVariant, AppShell, type AppShellProps, Autocomplete, type AutocompleteProps, Avatar, type AvatarPresence, type AvatarPresencePosition, type AvatarProps, type AvatarSize, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, type BadgeTone, BottomSheet, type BottomSheetHeight, type BottomSheetProps, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Calendar, type CalendarEvent, type CalendarProps, Card, type CardProps, type CardVariant, Carousel, type CarouselProps, type CarouselSlide, Checkbox, type CheckboxProps, Chip, type ChipProps, type ChipTone, Coachmark, type CoachmarkProps, ColorInput, type ColorInputProps, ColorPicker, type ColorPickerProps, CommandPalette, type CommandPaletteItem, type CommandPaletteProps, ConfirmDialog, type ConfirmDialogProps, type ConfirmDialogTone, ContextMenu, type ContextMenuItem, type ContextMenuProps, CopyToClipboard, type CopyToClipboardProps, DSPortal, type DSPortalProps, DataGrid, type DataGridColumn, type DataGridProps, type DataGridRow, DatePicker, type DatePickerProps, type DateRange, DateRangePicker, type DateRangePickerProps, Divider, type DividerProps, DotGrid, type DotGridProps, EmptyState, type EmptyStateProps, Eyebrow, type EyebrowProps, type EyebrowSize, FieldError, type FieldErrorProps, FileInput, type FileInputProps, Footer, type FooterColumn, type FooterProps, type FooterVariant, FormErrorSummary, type FormErrorSummaryProps, Heading, type HeadingLevel, type HeadingProps, HoverCard, type HoverCardPlacement, type HoverCardProps, InfiniteList, type InfiniteListProps, InlineConfirm, type InlineConfirmProps, type InlineConfirmTriggerProps, InlineEdit, InlineEditField, type InlineEditFieldProps, type InlineEditProps, Kbd, type KbdProps, type KbdSize, Lightbox, type LightboxItem, type LightboxProps, Link, type LinkProps, type LinkVariant, MiniBar, type MiniBarProps, MiniDonut, type MiniDonutProps, Modal, type ModalProps, type ModalRole, MultiSelect, type MultiSelectOption, type MultiSelectProps, NumberStepper, type NumberStepperProps, OAuthButton, type OAuthButtonProps, type OAuthProvider, Pagination, type PaginationProps, PasswordStrength, type PasswordStrengthProps, Popover, type PopoverPlacement, type PopoverProps, type PopoverVariant, ProgressBar, type ProgressBarProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, RangeSlider, type RangeSliderProps, RelativeTime, type RelativeTimeProps, RichText, type RichTextProps, RollingNumber, type RollingNumberProps, SearchAndFilters, type SearchAndFiltersProps, type SearchFilter, type SearchSuggestion, SegmentedControl, type SegmentedControlProps, type SegmentedOption, Select, type SelectOption, type SelectProps, Sheet, type SheetProps, type SheetSide, Skeleton, type SkeletonProps, type SkeletonShape, type SnackbarAction, type SnackbarOptions, SnackbarProvider, type SnackbarProviderProps, type SnackbarTone, Sortable, SortableDndContext, type SortableDndContextProps, SortableItem, type SortableItemData, type SortableItemProps, type SortableProps, Sparkline, type SparklineProps, SplitButton, type SplitButtonAction, type SplitButtonProps, SplitHero, type SplitHeroProps, StarRating, type StarRatingProps, type StarRatingSize, StatCard, type StatCardChangeDir, type StatCardProps, StatusPill, type StatusPillProps, type StatusPillStage, StickyNote, type StickyNoteProps, type StickyNoteRotation, type TabItem, Table, type TableHeaderCellProps, type TableRootProps, Tabs, type TabsProps, Text, type TextElement, TextInput, type TextInputProps, type TextProps, type TextVariant, Textarea, type TextareaProps, Timeline, type TimelineEvent, type TimelineProps, type ToastOptions, ToastProvider, type ToastProviderProps, type ToastTone, Toggle, type ToggleProps, Tooltip, type TooltipPlacement, type TooltipProps, TypeToConfirm, type TypeToConfirmProps, Wizard, type WizardProps, type WizardStep, deriveGradient, deriveInitials, useSnackbar, useToast };
+export { Accordion, type AccordionItemProps, type AccordionProps, ActionSheet, type ActionSheetItem, type ActionSheetProps, AlertBanner, type AlertBannerProps, type AlertBannerTone, AppBar, type AppBarProps, type AppBarVariant, AppShell, type AppShellProps, Autocomplete, type AutocompleteProps, Avatar, type AvatarPresence, type AvatarPresencePosition, type AvatarProps, type AvatarSize, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, type BadgeTone, BottomSheet, type BottomSheetHeight, type BottomSheetProps, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Calendar, type CalendarEvent, type CalendarProps, Card, type CardProps, type CardVariant, Carousel, type CarouselProps, type CarouselSlide, Checkbox, type CheckboxProps, Chip, type ChipProps, type ChipTone, Coachmark, type CoachmarkProps, ColorInput, type ColorInputProps, ColorPicker, type ColorPickerProps, CommandPalette, type CommandPaletteItem, type CommandPaletteProps, ConfirmDialog, type ConfirmDialogProps, type ConfirmDialogTone, ContextMenu, type ContextMenuItem, type ContextMenuProps, CopyToClipboard, type CopyToClipboardProps, DSPortal, type DSPortalProps, DataGrid, type DataGridColumn, type DataGridProps, type DataGridRow, DatePicker, type DatePickerProps, type DateRange, DateRangePicker, type DateRangePickerProps, Divider, type DividerProps, DotGrid, type DotGridProps, EmptyState, type EmptyStateProps, Eyebrow, type EyebrowProps, type EyebrowSize, FieldError, type FieldErrorProps, FileInput, type FileInputProps, Footer, type FooterColumn, type FooterProps, type FooterVariant, FormErrorSummary, type FormErrorSummaryProps, Heading, type HeadingLevel, type HeadingProps, HoverCard, type HoverCardPlacement, type HoverCardProps, InfiniteList, type InfiniteListProps, InlineAddRow, type InlineAddRowProps, InlineConfirm, type InlineConfirmProps, type InlineConfirmTriggerProps, InlineEdit, InlineEditField, type InlineEditFieldProps, type InlineEditProps, Kbd, type KbdProps, type KbdSize, Lightbox, type LightboxItem, type LightboxProps, Link, type LinkProps, type LinkVariant, MiniBar, type MiniBarProps, MiniDonut, type MiniDonutProps, Modal, type ModalProps, type ModalRole, MultiSelect, type MultiSelectOption, type MultiSelectProps, NumberStepper, type NumberStepperProps, OAuthButton, type OAuthButtonProps, type OAuthProvider, Pagination, type PaginationProps, PasswordStrength, type PasswordStrengthProps, Popover, type PopoverPlacement, type PopoverProps, type PopoverVariant, ProgressBar, type ProgressBarProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, RangeSlider, type RangeSliderProps, RelativeTime, type RelativeTimeProps, RichText, type RichTextProps, RollingNumber, type RollingNumberProps, SearchAndFilters, type SearchAndFiltersProps, type SearchFilter, type SearchSuggestion, SegmentedControl, type SegmentedControlProps, type SegmentedOption, Select, type SelectOption, type SelectProps, Sheet, type SheetProps, type SheetSide, Skeleton, type SkeletonProps, type SkeletonShape, type SnackbarAction, type SnackbarOptions, SnackbarProvider, type SnackbarProviderProps, type SnackbarTone, Sortable, SortableDndContext, type SortableDndContextProps, SortableItem, type SortableItemData, type SortableItemProps, type SortableProps, Sparkline, type SparklineProps, SplitButton, type SplitButtonAction, type SplitButtonProps, SplitHero, type SplitHeroProps, StarRating, type StarRatingProps, type StarRatingSize, StatCard, type StatCardChangeDir, type StatCardProps, StatusPill, type StatusPillProps, type StatusPillStage, StickyNote, type StickyNoteProps, type StickyNoteRotation, type TabItem, Table, type TableHeaderCellProps, type TableRootProps, Tabs, type TabsProps, Text, type TextElement, TextInput, type TextInputProps, type TextProps, type TextVariant, Textarea, type TextareaProps, Timeline, type TimelineEvent, type TimelineProps, type ToastOptions, ToastProvider, type ToastProviderProps, type ToastTone, Toggle, type ToggleProps, Tooltip, type TooltipPlacement, type TooltipProps, TypeToConfirm, type TypeToConfirmProps, Wizard, type WizardProps, type WizardStep, deriveGradient, deriveInitials, useSnackbar, useToast };