@soroush.tech/design-system 2.0.0-rc.1 → 2.0.0-rc.3

package/dist/{index-BhibLnZ0.d.cts → index-CG_1uPrD.d.mts}

@@ -1,7 +1,6 @@
-import { T as Theme, i as ButtonVariants, x as PaletteColor } from "./themes-Kbk9h5cN.cjs";
-import "./index-DBUwu65Z.cjs";
-import { ButtonHTMLAttributes, ReactNode } from "react";
+import { P as PaletteColor, W as Theme, d as ButtonVariants } from "./index-CJhK7JND.mjs";
 import { BorderProps, LayoutProps, SpaceProps, TypographyProps } from "@soroush.tech/styled-system";
+import { ButtonHTMLAttributes, ReactNode } from "react";
 //#region src/Button/Button.d.ts
 /** Augmentable via the `ButtonVariants` interface - style new values through `theme.components.Button.variants`. */
 type ButtonVariant = keyof ButtonVariants;

package/dist/{themes-RX2UX5gD.d.mts → index-CJhK7JND.d.mts}

@@ -1,6 +1,71 @@
-import { CSSObject } from "@emotion/react";
-import { ContainerQueries, QueryHelpers } from "@soroush.tech/styled-system";
-import { ElementType } from "react";
+import { CreateStyledComponent, FilteringStyledOptions, Interpolation, StyledOptions } from "@emotion/styled";
+import { CSSObject, PropsOf, css as css$1, keyframes } from "@emotion/react";
+import { BorderProps, ContainerQueries, FlexboxProps, LayoutFrameProps, LayoutProps, PositionProps, QueryHelpers, SpaceProps, SpanProps, TypographyProps } from "@soroush.tech/styled-system";
+import { createShouldForwardProp, props } from "@soroush.tech/styled-system/should-forward-prop";
+import { CSSProperties, ComponentClass, ComponentProps, ComponentType, ElementType, HTMLAttributes, JSX, ReactNode, Ref } from "react";
+//#region src/View/View.d.ts
+/** Valid values for the color prop - derived from theme.text keys. */
+type ViewColorToken = keyof Theme['text'];
+/** Valid values for the bg prop - derived from theme.background keys. */
+type ViewBackgroundToken = keyof Theme['background'];
+/** Valid values for the borderColor prop - derived from theme.border keys. */
+type ViewBorderColorToken = keyof Theme['border'];
+/** Valid values for the borderWidth prop - derived from theme.borderWidths keys. */
+type ViewBorderWidthToken = keyof Theme['borderWidths'];
+/** Valid theme tokens for border-radius. Raw CSS pixel values (e.g. '6px', '9999px') are also accepted. */
+type ViewBorderRadiusToken = keyof Theme['radii'] | `${number}px`;
+interface ViewProps extends Omit<HTMLAttributes<HTMLElement>, 'color'>, SpaceProps<Theme>, LayoutProps<Theme>, TypographyProps<Theme>, Omit<BorderProps<Theme>, 'borderColor' | 'borderWidth' | 'borderRadius'>, PositionProps<Theme>, SpanProps<Theme>, LayoutFrameProps<Theme> {
+  bg?: ViewBackgroundToken;
+  /** Resolves against theme.border - light · primary · dark */
+  borderColor?: ViewBorderColorToken;
+  /** Resolves against theme.borderWidths - none · thin · base · thick */
+  borderWidth?: ViewBorderWidthToken;
+  /** Theme tokens: sq · sm · md · lg. Also accepts raw CSS pixel values e.g. '6px', '9999px'. */
+  borderRadius?: ViewBorderRadiusToken;
+  opacity?: number;
+  cursor?: CSSProperties['cursor'];
+  /** CSS order for flex/grid item placement. Accepts responsive arrays. */
+  order?: FlexboxProps<Theme>['order'];
+}
+declare const View: import("@emotion/styled").StyledComponent<{
+  theme?: Theme;
+  as?: React.ElementType;
+} & ViewProps, import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+//#endregion
+//#region src/Flex/Flex.d.ts
+/** Valid values for the gap prop - derived from theme.space keys. */
+type GapToken = keyof Theme['space'];
+/**
+ * `layout` puts the flex container on the page frame, as on any View: the theme's margin and
+ * max width per breakpoint. The flexbox stays as set - a column by default, a row with
+ * `flexDirection="row"`. Columns are Grid's: content on the page columns uses `<Grid layout>`.
+ */
+interface FlexProps extends ViewProps, FlexboxProps<Theme> {}
+declare const Flex: import("@emotion/styled").StyledComponent<{
+  theme?: Theme;
+  as?: React.ElementType;
+} & ViewProps & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+  theme?: Theme;
+} & FlexProps, {}, {}>;
+//#endregion
+//#region src/Paper/Paper.d.ts
+type PaperElevation = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24;
+interface PaperProps extends FlexProps {
+  /** Shadow depth - 0 (flat) to 24 (highest). Resolves to theme.shadows[n]. Default: 1. */
+  elevation?: PaperElevation;
+  /** CSS transition for surface animations (e.g. hover elevation change). */
+  transition?: CSSProperties['transition'];
+  /** Resolves against theme.border - light · primary · dark */
+  borderColor?: keyof Theme['border'];
+  /** Resolves against theme.borderWidths - none · thin · base · thick */
+  borderWidth?: keyof Theme['borderWidths'];
+  /** CSS border-style value (e.g. 'solid', 'dashed'). */
+  borderStyle?: CSSProperties['borderStyle'];
+  /** Renders the surface as a different element (e.g. 'section'). */
+  as?: ElementType;
+}
+declare function Paper({ elevation, p, bg, borderRadius, ...rest }: Readonly<PaperProps>): import("react").JSX.Element;
+//#endregion
 //#region src/theme/breakpoints.d.ts
 /**
  * The query helpers a theme's breakpoint scale carries: `up` / `down` / `only` / `between` /
@@ -402,6 +467,59 @@ interface ButtonVariants {
   outlined: true;
   text: true;
 }
+/** The defaults a theme may set for every `InputRange`. */
+interface InputRangeOwnerState {
+  size?: keyof ThemeSizes;
+  color?: keyof ThemePalette;
+  orientation?: 'horizontal' | 'vertical';
+  track?: 'normal' | false | 'inverted';
+  step?: number | null;
+  shiftStep?: number;
+  valueLabel?: 'auto' | 'on' | 'off';
+  shouldSwapThumbs?: boolean;
+}
+/** The defaults a theme may set for every `NumberField` - its button labels give it a language. */
+interface NumberFieldOwnerState {
+  variant?: 'default' | 'outlined' | 'text' | 'underline';
+  size?: keyof ThemeSizes;
+  color?: keyof ThemePalette;
+  spinButtons?: 'stacked' | 'sides' | 'none';
+  step?: number;
+  smallStep?: number;
+  largeStep?: number;
+  shouldSnapOnStep?: boolean;
+  shouldScrubOnWheel?: boolean;
+  incrementLabel?: string;
+  decrementLabel?: string;
+}
+/** The defaults a theme may set for every `Rating`. */
+interface RatingOwnerState {
+  max?: number;
+  precision?: number;
+  highlightSelectedOnly?: boolean;
+  size?: keyof ThemeSizes;
+  color?: keyof ThemePalette;
+}
+/** The defaults a theme may set for every `TransferList` - its button labels give it a language. */
+interface TransferListOwnerState {
+  size?: keyof ThemeSizes;
+  color?: keyof ThemePalette;
+  shouldShowMoveAll?: boolean;
+  hasSelectAll?: boolean;
+  moveAllRightLabel?: string;
+  moveRightLabel?: string;
+  moveLeftLabel?: string;
+  moveAllLeftLabel?: string;
+}
+/** The defaults a theme may set for every `Breadcrumbs` - its `expandLabel` gives a trail its language. */
+interface BreadcrumbsOwnerState {
+  separator?: ReactNode;
+  maxItems?: number;
+  itemsBeforeCollapse?: number;
+  itemsAfterCollapse?: number;
+  expandLabel?: string;
+  color?: keyof ThemeText;
+}
 /** The resolved props Button's styled roots receive - what `ownerState` exposes. */
 interface ButtonOwnerState {
   variant?: keyof ButtonVariants;
@@ -411,6 +529,69 @@ interface ButtonOwnerState {
   fullWidth?: boolean;
   disabled?: boolean;
 }
+/** Tabs' look values - augment to register new ones (then style them via `variants`). */
+interface TabsVariants {
+  underline: true;
+  boxed: true;
+  enclosed: true;
+}
+/** The resolved props Tabs' styled elements receive - what `ownerState` exposes. */
+interface TabsOwnerState {
+  variant?: keyof TabsVariants;
+  color?: keyof ThemePalette;
+  size?: keyof ThemeSizes;
+  orientation?: 'horizontal' | 'vertical';
+  fullWidth?: boolean;
+  hasDivider?: boolean;
+  selectedBg?: keyof ThemeBackground;
+}
+/** The defaults a theme may set for every `Menu`. */
+interface MenuOwnerState {
+  align?: 'start' | 'end';
+  marginThreshold?: keyof ThemeSpace;
+  elevation?: PaperElevation;
+  layer?: keyof ThemeZOrder;
+  color?: keyof ThemePalette;
+  textColor?: keyof ThemeText;
+  size?: keyof ThemeSizes;
+  dense?: boolean;
+}
+/** The defaults a theme may set for every `ContextMenu` - a `Menu`'s, placed at the pointer. */
+type ContextMenuOwnerState = Omit<MenuOwnerState, 'align'>;
+/** The defaults a theme may set for every `MenuList` - and so for its rows. */
+interface MenuListOwnerState {
+  color?: keyof ThemePalette;
+  textColor?: keyof ThemeText;
+  size?: keyof ThemeSizes;
+  dense?: boolean;
+  shouldWrap?: boolean;
+}
+/** The defaults a theme may set for every `MenuItem` - a list's own values win. */
+interface MenuItemOwnerState {
+  color?: keyof ThemePalette;
+  textColor?: keyof ThemeText;
+  size?: keyof ThemeSizes;
+  dense?: boolean;
+}
+/** The defaults a theme may set for every `Tab`. */
+interface TabOwnerState {
+  isWrapped?: boolean;
+  bg?: keyof ThemeBackground;
+  borderRadius?: keyof ThemeRadii;
+  color?: keyof ThemePalette;
+  textColor?: keyof ThemeText;
+  size?: keyof ThemeSizes;
+  selectedBg?: keyof ThemeBackground;
+}
+/** The defaults a theme may set for every `TabScrollButton`. */
+interface TabScrollButtonOwnerState {
+  color?: keyof ThemePalette;
+  textColor?: keyof ThemeText;
+}
+/** The defaults a theme may set for every `TabPanel`. */
+interface TabPanelOwnerState {
+  shouldKeepMounted?: boolean;
+}
 /** Token-typed Typography props a theme may set for Card's title/caption slots. */
 interface CardSlotTypographyProps {
   variant?: keyof ThemeTypographyVariants;
@@ -454,11 +635,13 @@ interface ThemeComponents {
   AppBar?: ComponentConfig;
   Avatar?: ComponentConfig<Record<string, unknown>, 'root' | 'img'>;
   Backdrop?: ComponentConfig;
+  Breadcrumbs?: ComponentConfig<BreadcrumbsOwnerState, 'root' | 'list' | 'item' | 'separator' | 'collapsed' | 'collapsedIcon'>;
   Button?: ComponentConfig<ButtonOwnerState, 'root' | 'label' | 'icon' | 'loader'>;
   ButtonGroup?: ComponentConfig;
   Card?: ComponentConfig<CardOwnerState, 'root' | 'title' | 'caption' | 'icon'>;
   Checkbox?: ComponentConfig<Record<string, unknown>, 'root' | 'input' | 'icon'>;
   CircularProgress?: ComponentConfig<Record<string, unknown>, 'root' | 'track' | 'circle'>;
+  ContextMenu?: ComponentConfig<ContextMenuOwnerState, 'root' | 'paper'>;
   Drawer?: ComponentConfig;
   Flex?: ComponentConfig;
   FocusTrap?: ComponentConfig;
@@ -471,7 +654,10 @@ interface ThemeComponents {
   Image?: ComponentConfig;
   LinearProgress?: ComponentConfig<Record<string, unknown>, 'root' | 'track' | 'dash' | 'bar' | 'traveler' | 'segment' | 'secondaryBar'>;
   Link?: ComponentConfig;
-  MenuItem?: ComponentConfig<Record<string, unknown>, 'root' | 'check'>;
+  Menu?: ComponentConfig<MenuOwnerState, 'root' | 'paper'>;
+  MenuDivider?: ComponentConfig;
+  MenuItem?: ComponentConfig<MenuItemOwnerState, 'root' | 'check' | 'startIcon' | 'label' | 'shortcut' | 'submenuIcon' | 'entry' | 'secondaryAction'>;
+  MenuList?: ComponentConfig<MenuListOwnerState>;
   Modal?: ComponentConfig;
   NativeSelect?: ComponentConfig<Record<string, unknown>, 'root' | 'select' | 'icon'>;
   Pagination?: ComponentConfig<Record<string, unknown>, 'root' | 'list'>;
@@ -481,11 +667,16 @@ interface ThemeComponents {
   Pressable?: ComponentConfig<PressableOwnerState>;
   Quote?: ComponentConfig;
   Radio?: ComponentConfig<Record<string, unknown>, 'root' | 'input' | 'icon'>;
+  InputRange?: ComponentConfig<InputRangeOwnerState, 'root' | 'rail' | 'track' | 'thumb' | 'mark' | 'markLabel' | 'valueLabel' | 'input'>;
+  TransferList?: ComponentConfig<TransferListOwnerState, 'root' | 'list' | 'header' | 'title' | 'count' | 'items' | 'item' | 'controls' | 'icon'>;
+  NumberField?: ComponentConfig<NumberFieldOwnerState, 'root' | 'input' | 'spinButtons' | 'increment' | 'decrement'>;
+  Rating?: ComponentConfig<RatingOwnerState, 'root' | 'item' | 'icon' | 'decimal' | 'input' | 'text' | 'emptyLabel'>;
   Select?: ComponentConfig<Record<string, unknown>, 'root' | 'value' | 'valueArea' | 'valueGhost' | 'listbox'>;
   Sidebar?: ComponentConfig<Record<string, unknown>, 'root' | 'rail' | 'panel'>;
   SidebarItem?: ComponentConfig;
   Skeleton?: ComponentConfig<Record<string, unknown>, 'root' | 'content'>;
   Switch?: ComponentConfig<Record<string, unknown>, 'root' | 'input' | 'track' | 'thumb'>;
+  Tab?: ComponentConfig<TabOwnerState, 'root' | 'label' | 'icon' | 'secondaryAction' | 'close'>;
   Table?: ComponentConfig;
   TableBody?: ComponentConfig;
   TableCell?: ComponentConfig;
@@ -496,6 +687,9 @@ interface ThemeComponents {
   TablePaginationActions?: ComponentConfig;
   TableRow?: ComponentConfig;
   TableSortLabel?: ComponentConfig<Record<string, unknown>, 'root' | 'icon'>;
+  TabPanel?: ComponentConfig<TabPanelOwnerState>;
+  TabScrollButton?: ComponentConfig<TabScrollButtonOwnerState>;
+  Tabs?: ComponentConfig<TabsOwnerState, 'root' | 'list' | 'indicator' | 'startContent' | 'endContent' | 'scrollButton' | 'overflowButton' | 'overflowClose'>;
   TextInput?: ComponentConfig<Record<string, unknown>, 'root' | 'input'>;
   ToggleButton?: ComponentConfig;
   ToggleButtonGroup?: ComponentConfig;
@@ -601,10 +795,10 @@ declare const avatar: {
 };
 declare const icon: ThemeIconSizes;
 declare const sizes: ThemeSizes;
-declare const space: ThemeSpace;
+declare const space$1: ThemeSpace;
 declare const breakpoints: ThemeBreakpoints & BreakpointHelpers;
-declare const layout: ThemeLayout;
-declare const typography: ThemeTypographyVariants;
+declare const layout$1: ThemeLayout;
+declare const typography$1: ThemeTypographyVariants;
 /**
  * The package's complete default theme (dark-schemed). Raw hex only - palettes
  * belong to the consumer, who builds brand themes with `createTheme(baseTheme, ...)`.
@@ -616,4 +810,67 @@ declare const baseTheme: Theme;
  */
 declare const up: (from: import("@soroush.tech/styled-system").BreakpointInput) => string, down: (to: import("@soroush.tech/styled-system").BreakpointInput) => string, only: (key: string) => string, between: (from: import("@soroush.tech/styled-system").BreakpointInput, to: import("@soroush.tech/styled-system").BreakpointInput) => string, not: (key: string) => string, containerQueries: import("@soroush.tech/styled-system").ContainerQueries;
 //#endregion
-export { between as $, ThemeBreakpoints as A, ThemeRadii as B, PressableOwnerState as C, withBreakpointHelpers as Ct, ThemeBackground as D, ThemeAvatarSizes as E, ThemeIconSizes as F, ThemeSwitch as G, ThemeSizes as H, ThemeLayout as I, ThemeZOrder as J, ThemeText as K, ThemeLetterSpacings as L, ThemeDefaults as M, ThemeFontWeights as N, ThemeBorder as O, ThemeFonts as P, baseTheme as Q, ThemeLineHeights as R, PaletteEntry as S, BreakpointHelpers as St, Theme as T, ThemeSkeleton as U, ThemeShadow as V, ThemeSpace as W, TypographyVariantStyle as X, TypographyVariant as Y, avatar as Z, LayoutPanel as _, up as _t, CSSObject$1 as a, fontWeights as at, OpenScale as b, ThemeOverride as bt, CardSlotTypographyProps as c, layout as ct, ComponentVariant as d, not as dt, borderWidths as et, DefaultBreakpoints as f, only as ft, LayoutLength as g, typography as gt, LayoutEntry as h, space as ht, ButtonVariants as i, fontSizes as it, ThemeComponents as j, ThemeBorderWidths as k, ComponentConfig as l, letterSpacings as lt, LayoutContent as m, sizes as mt, BreakpointOverrides as n, containerQueries as nt, CardOwnerState as o, fonts as ot, LayoutBars as p, radii as pt, ThemeTypographyVariants as q, ButtonOwnerState as r, down as rt, CardSlotIconProps as s, icon as st, BreakpointKey as t, breakpoints as tt, ComponentStyle as u, lineHeights as ut, LayoutPanels as v, zOrder as vt, SizeEntry as w, PaletteColor as x, createTheme as xt, LayoutSpace as y, DeepPartial as yt, ThemePalette as z };
+//#region src/style/styled.d.ts
+/**
+ * Design-system additions to Emotion's styled options. A styled root that passes
+ * `name` becomes theme-customizable: `theme.components[name]` may contribute
+ * `styleOverrides` (per `slot`) and `variants`, appended after the component's
+ * own styles so the theme wins the cascade. Roots without `name` are plain
+ * Emotion - zero behavior change, zero cost.
+ */
+interface ThemeCustomizationOptions {
+  /** `theme.components` key enabling styleOverrides/variants for this root. */
+  name?: string;
+  /** The `styleOverrides` slot this root maps to. Default: `'root'`. */
+  slot?: string;
+  /**
+   * Styled-system prop parsers (`space`, `layout`, ...) appended AFTER the theme
+   * override resolver, so per-instance props (`m`, `p`, `width`, ...) always beat
+   * theme `styleOverrides`.
+   */
+  systemProps?: ReadonlyArray<Interpolation<never>>;
+  /**
+   * Custom mapping from render props to applied override styles - replaces the
+   * default `styleOverrides[slot]` lookup (for prop-keyed override keys).
+   */
+  overridesResolver?: (props: Record<string, unknown>, styleOverrides: Record<string, unknown>) => unknown;
+}
+/**
+ * The `styled.div`, `styled.span`, ... tag shorthands - mirrors Emotion's own
+ * `StyledTags`, retyped against this package's `Theme` instead of Emotion's
+ * (otherwise-empty) one, so `${({ theme }) => theme.space[2]}` template
+ * interpolations resolve to the real theme shape.
+ */
+type StyledTags = { [Tag in keyof JSX.IntrinsicElements]: CreateStyledComponent<{
+  theme?: Theme;
+  as?: React.ElementType;
+}, JSX.IntrinsicElements[Tag]>; };
+/** Overloads mirroring Emotion's, with the theme-customization options added. */
+interface CreateThemedStyled extends StyledTags {
+  <C extends ComponentClass<ComponentProps<C>>, ForwardedProps extends keyof ComponentProps<C> & string = keyof ComponentProps<C> & string>(component: C, options: FilteringStyledOptions<ComponentProps<C>, ForwardedProps> & ThemeCustomizationOptions): CreateStyledComponent<Pick<PropsOf<C>, ForwardedProps> & {
+    theme?: Theme;
+  }, {}, {
+    ref?: Ref<InstanceType<C>>;
+  }>;
+  <C extends ComponentType<ComponentProps<C>>, ForwardedProps extends keyof ComponentProps<C> & string = keyof ComponentProps<C> & string>(component: C, options: FilteringStyledOptions<ComponentProps<C>, ForwardedProps> & ThemeCustomizationOptions): CreateStyledComponent<Pick<PropsOf<C>, ForwardedProps> & {
+    theme?: Theme;
+  }>;
+  <C extends ComponentType<ComponentProps<C>>>(component: C, options?: StyledOptions<ComponentProps<C>> & ThemeCustomizationOptions): CreateStyledComponent<PropsOf<C> & {
+    theme?: Theme;
+  }>;
+  <Tag extends keyof JSX.IntrinsicElements, ForwardedProps extends keyof JSX.IntrinsicElements[Tag] & string = keyof JSX.IntrinsicElements[Tag] & string>(tag: Tag, options: FilteringStyledOptions<JSX.IntrinsicElements[Tag], ForwardedProps> & ThemeCustomizationOptions): CreateStyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+  }, Pick<JSX.IntrinsicElements[Tag], ForwardedProps>>;
+  <Tag extends keyof JSX.IntrinsicElements>(tag: Tag, options?: StyledOptions<JSX.IntrinsicElements[Tag]> & ThemeCustomizationOptions): CreateStyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+  }, JSX.IntrinsicElements[Tag]>;
+}
+/**
+ * The design system's `styled` - Emotion's styled plus theme-level component
+ * customization (`theme.components[name].styleOverrides` / `.variants`).
+ */
+declare const styled: CreateThemedStyled;
+//#endregion
+export { ThemeFonts as $, ViewBorderRadiusToken as $t, MenuListOwnerState as A, lineHeights as At, TabPanelOwnerState as B, ThemeOverride as Bt, LayoutContent as C, down as Ct, LayoutPanels as D, icon as Dt, LayoutPanel as E, fonts as Et, PaletteEntry as F, space$1 as Ft, ThemeAvatarSizes as G, PaperElevation as Gt, TabsOwnerState as H, BreakpointHelpers as Ht, PressableOwnerState as I, typography$1 as It, ThemeBorderWidths as J, FlexProps as Jt, ThemeBackground as K, PaperProps as Kt, RatingOwnerState as L, up as Lt, NumberFieldOwnerState as M, only as Mt, OpenScale as N, radii as Nt, LayoutSpace as O, layout$1 as Ot, PaletteColor as P, sizes as Pt, ThemeFontWeights as Q, ViewBorderColorToken as Qt, SizeEntry as R, zOrder as Rt, LayoutBars as S, containerQueries as St, LayoutLength as T, fontWeights as Tt, TabsVariants as U, withBreakpointHelpers as Ut, TabScrollButtonOwnerState as V, createTheme as Vt, Theme as W, Paper as Wt, ThemeComponents as X, View as Xt, ThemeBreakpoints as Y, GapToken as Yt, ThemeDefaults as Z, ViewBackgroundToken as Zt, ComponentStyle as _, avatar as _t, ThemeCustomizationOptions as a, ThemeRadii as at, DefaultBreakpoints as b, borderWidths as bt, BreakpointKey as c, ThemeSkeleton as ct, ButtonVariants as d, ThemeText as dt, ViewBorderWidthToken as en, ThemeIconSizes as et, CSSObject$1 as f, ThemeTypographyVariants as ft, ComponentConfig as g, TypographyVariantStyle as gt, CardSlotTypographyProps as h, TypographyVariant as ht, props as i, ThemePalette as it, MenuOwnerState as j, not as jt, MenuItemOwnerState as k, letterSpacings as kt, BreakpointOverrides as l, ThemeSpace as lt, CardSlotIconProps as m, TransferListOwnerState as mt, css$1 as n, ViewProps as nn, ThemeLetterSpacings as nt, styled as o, ThemeShadow as ot, CardOwnerState as p, ThemeZOrder as pt, ThemeBorder as q, Flex as qt, keyframes as r, ThemeLineHeights as rt, BreadcrumbsOwnerState as s, ThemeSizes as st, createShouldForwardProp as t, ViewColorToken as tn, ThemeLayout as tt, ButtonOwnerState as u, ThemeSwitch as ut, ComponentVariant as v, baseTheme as vt, LayoutEntry as w, fontSizes as wt, InputRangeOwnerState as x, breakpoints as xt, ContextMenuOwnerState as y, between as yt, TabOwnerState as z, DeepPartial as zt };

package/dist/{index-BB-dLv5V.d.mts → index-CQfJZADG.d.cts}

@@ -1,8 +1,7 @@
-import { T as Theme } from "./themes-RX2UX5gD.mjs";
-import "./index-C1WqEDtQ.mjs";
-import { n as ButtonColor, o as ButtonSize, s as ButtonVariant } from "./index-DXvQ-JVZ.mjs";
-import { SpaceProps } from "@soroush.tech/styled-system";
+import { W as Theme } from "./index-DJ0f69wh.cjs";
+import { n as ButtonColor, o as ButtonSize, s as ButtonVariant } from "./index-DAwcmIjN.cjs";
 import { ElementType, HTMLAttributes } from "react";
+import { SpaceProps } from "@soroush.tech/styled-system";
 //#region src/ButtonGroup/ButtonGroup.d.ts
 type ButtonGroupOrientation = 'horizontal' | 'vertical';
 type ButtonGroupRadius = keyof Theme['radii'];

package/dist/{index-CxUsrlg1.d.cts → index-CUz2h5xY.d.mts}

@@ -1,7 +1,6 @@
-import { T as Theme, x as PaletteColor } from "./themes-Kbk9h5cN.cjs";
-import "./index-DBUwu65Z.cjs";
-import { ButtonHTMLAttributes, ElementType } from "react";
+import { P as PaletteColor, W as Theme } from "./index-CJhK7JND.mjs";
 import { BorderProps, LayoutProps, SpaceProps, TypographyProps } from "@soroush.tech/styled-system";
+import { ButtonHTMLAttributes, ElementType } from "react";
 //#region src/Pressable/Pressable.d.ts
 /**
  * Press feedback: `none` leaves the wrapped content untouched, `opacity` dims it

package/dist/{index-Bid71KeF.d.cts → index-CbFaWtjK.d.mts}

@@ -1,5 +1,5 @@
-import { a as PaginationItemSize } from "./index-DdqdSOct.cjs";
-import "./index-Celm-8iN.cjs";
+import { a as PaginationItemSize } from "./index-BGbTuHP9.mjs";
+import "./index-BQWjh4rK.mjs";
 import { HTMLAttributes } from "react";
 //#region src/Table/TablePaginationActions/TablePaginationActions.d.ts
 type TablePaginationActionType = 'first' | 'previous' | 'next' | 'last';

package/dist/{index-DdqdSOct.d.cts → index-ChXeKJCk.d.cts}

@@ -1,5 +1,4 @@
-import { T as Theme, x as PaletteColor } from "./themes-Kbk9h5cN.cjs";
-import "./index-DBUwu65Z.cjs";
+import { P as PaletteColor, W as Theme } from "./index-DJ0f69wh.cjs";
 import { ButtonHTMLAttributes, ElementType, ReactNode } from "react";
 import { SpaceProps } from "@soroush.tech/styled-system";
 //#region src/Pagination/hooks/usePagination.d.ts

package/dist/index-CknoXDLQ.d.cts

@@ -0,0 +1,35 @@
+import { t as MenuItemValue } from "./MenuListContext-DKUOhNyw.cjs";
+import { i as MenuItemRole } from "./index-B4TeaB7b.cjs";
+import { KeyboardEvent, MouseEvent, ReactNode } from "react";
+//#region src/Menu/MenuItems/MenuItems.d.ts
+/** A menu row as data - what a `MenuItem` takes, with its label as `label`. */
+interface MenuItemRowData {
+  value?: MenuItemValue;
+  label: ReactNode;
+  role?: MenuItemRole;
+  selected?: boolean;
+  disabled?: boolean;
+  startIcon?: ReactNode;
+  shortcut?: ReactNode;
+  note?: string;
+  onClick?: (event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>) => void;
+  /** The rows of this row's submenu; `null` or `[]` is an empty one. */
+  submenu?: MenuItemData[] | null;
+  emptyLabel?: ReactNode;
+}
+/** A divider between groups of rows. */
+interface MenuDividerData {
+  type: 'divider';
+}
+type MenuItemData = MenuItemRowData | MenuDividerData;
+interface MenuItemsProps {
+  items: readonly MenuItemData[];
+}
+/**
+ * @description Menu rows from data: each entry a `MenuItem` (its label as `label`, its
+ * submenu as more entries) or `{ type: 'divider' }`. It renders the same rows JSX children
+ * would, so the two behave alike - inside a `MenuList`, a `Menu` or a `ContextMenu`.
+ */
+declare function MenuItems({ items }: Readonly<MenuItemsProps>): import("react").JSX.Element[];
+//#endregion
+export { MenuItemsProps as a, MenuItems as i, MenuItemData as n, MenuItemRowData as r, MenuDividerData as t };

package/dist/{index-BSqet8aO.d.cts → index-ClZyaZrR.d.mts}

@@ -1,7 +1,6 @@
-import { T as Theme, Y as TypographyVariant } from "./themes-Kbk9h5cN.cjs";
-import "./index-DBUwu65Z.cjs";
-import { CSSProperties, ElementType, HTMLAttributes } from "react";
+import { W as Theme, ht as TypographyVariant } from "./index-CJhK7JND.mjs";
 import { BorderProps, FlexboxProps, LayoutProps, PositionProps, SpaceProps, TypographyProps } from "@soroush.tech/styled-system";
+import { CSSProperties, ElementType, HTMLAttributes } from "react";
 //#region src/Typography/Typography.d.ts
 type TypographyAlign = 'left' | 'right' | 'center' | 'justify' | 'inherit';
 /** Valid values for the color prop - derived from theme.text keys. */

package/dist/{index-DXvQ-JVZ.d.mts → index-DAwcmIjN.d.cts}

@@ -1,7 +1,6 @@
-import { T as Theme, i as ButtonVariants, x as PaletteColor } from "./themes-RX2UX5gD.mjs";
-import "./index-C1WqEDtQ.mjs";
-import { BorderProps, LayoutProps, SpaceProps, TypographyProps } from "@soroush.tech/styled-system";
+import { P as PaletteColor, W as Theme, d as ButtonVariants } from "./index-DJ0f69wh.cjs";
 import { ButtonHTMLAttributes, ReactNode } from "react";
+import { BorderProps, LayoutProps, SpaceProps, TypographyProps } from "@soroush.tech/styled-system";
 //#region src/Button/Button.d.ts
 /** Augmentable via the `ButtonVariants` interface - style new values through `theme.components.Button.variants`. */
 type ButtonVariant = keyof ButtonVariants;

package/dist/index-DGnXJwLj.d.mts

@@ -0,0 +1,72 @@
+import { Gt as PaperElevation, W as Theme } from "./index-CJhK7JND.mjs";
+import "./index-DaIIo5QU.mjs";
+import { t as MenuItemValue } from "./MenuListContext-x-7lH4CH.mjs";
+import { n as MenuItemData } from "./index-BkzZxHVj.mjs";
+import { KeyboardEvent, MouseEvent, ReactElement, ReactNode, Ref, SyntheticEvent } from "react";
+//#region src/Menu/utils/getMenuOrigins.d.ts
+/** Which edge of its trigger a menu lines up with: the start edge, or the end edge. */
+type MenuAlign = 'start' | 'end';
+//#endregion
+//#region src/Menu/Menu/Menu.d.ts
+/** Why a menu closed: Escape, a chosen row, its trigger pressed again, or focus leaving it. */
+type MenuCloseReason = 'escapeKey' | 'select' | 'triggerClick' | 'blur';
+/** A step a menu bar takes from this menu to the previous (`-1`) or next (`1`) one. */
+type MenuStep = -1 | 1;
+interface TriggerProps {
+  id?: string;
+  ref?: Ref<HTMLElement>;
+  onClick?: (event: MouseEvent<HTMLElement>) => void;
+  onKeyDown?: (event: KeyboardEvent<HTMLElement>) => void;
+}
+interface MenuProps {
+  /** The element that opens the menu - a `Button`, a `Pressable`... It is given `aria-haspopup`, `aria-expanded` and `aria-controls`, and must take a `ref` for focus to return to it. */
+  trigger: ReactElement<TriggerProps>;
+  /** `MenuItem` rows and `MenuDivider`s. */
+  children?: ReactNode;
+  /** The rows as data, in place of `children`. */
+  items?: readonly MenuItemData[];
+  /** Controlled open state. When set, the menu never opens or closes on its own - it asks through `onOpen` / `onClose`. */
+  isOpen?: boolean;
+  /** Uncontrolled initial open state. Default: `false`. */
+  defaultOpen?: boolean;
+  /** Fired when the menu asks to open. */
+  onOpen?: () => void;
+  /** Fired when the menu asks to close, with why. */
+  onClose?: (event: SyntheticEvent, reason: MenuCloseReason) => void;
+  /** Fired when Left or Right has nowhere further to go inside the menu - so an owner such as a menu bar can step to the next menu. Swapped in right-to-left pages. */
+  onStep?: (step: MenuStep) => void;
+  /** Fired with a row's `value` when a row that has one is chosen. */
+  onSelect?: (value: MenuItemValue) => void;
+  /** Which edge of the trigger the list lines up with. Mirrored in right-to-left pages. Default: `'start'`. */
+  align?: MenuAlign;
+  /** The least room between the list and the window's edge - a `theme.space` key. Default: `2`. */
+  marginThreshold?: keyof Theme['space'];
+  /** Shadow depth of the surface. Default: `8`. */
+  elevation?: PaperElevation;
+  /** Stacking layer from `theme.zOrder`. Default: `'modal'`. */
+  layer?: keyof Theme['zOrder'];
+  /** Shown as one disabled row when the menu has no rows. Without it, the list stays empty. */
+  emptyLabel?: ReactNode;
+  /** Accent color for every row - resolves to `theme.palette[color]`. */
+  color?: keyof Theme['palette'];
+  /** Base text color for every row - resolves against `theme.text`. */
+  textColor?: keyof Theme['text'];
+  /** Density token for every row - resolves against `theme.sizes`. */
+  size?: keyof Theme['sizes'];
+  /** Compact vertical padding for every row. */
+  dense?: boolean;
+  /** Names the list. Default: the trigger names it (`aria-labelledby`). */
+  'aria-label'?: string;
+  className?: string;
+  'data-testid'?: string;
+}
+/**
+ * @description A trigger and the `MenuList` it opens. Not modal: no focus trap, no scroll
+ * lock, nothing laid over the page, so the pointer passes over it freely. The list is
+ * placed `position: fixed` in the window next to the trigger, so a panel's overflow
+ * can't clip it, but stays inside the menu's own box in the DOM. Escape or a chosen row
+ * closes it and returns focus to the trigger; focus leaving it closes it where it went.
+ */
+declare function Menu({ trigger, children, items, isOpen: isOpenProp, defaultOpen, onOpen, onClose, onStep, onSelect, align: alignProp, marginThreshold: marginThresholdProp, elevation: elevationProp, layer: layerProp, emptyLabel, color: colorProp, textColor: textColorProp, size: sizeProp, dense: denseProp, 'aria-label': ariaLabel, className, 'data-testid': dataTestid }: Readonly<MenuProps>): import("react").JSX.Element;
+//#endregion
+export { MenuAlign as a, MenuStep as i, MenuCloseReason as n, MenuProps as r, Menu as t };