@soroush.tech/design-system 2.0.0-rc.4 → 2.0.0-rc.5

package/dist/theme.d.mts

@@ -1,3 +1,3 @@
-import { $ as TabScrollButtonOwnerState, $t as typography, A as FabOwnerState, At as TransferListOwnerState, B as MenuOwnerState, Bt as fontSizes, C as CollapseOwnerState, Ct as ThemeText, D as ContextMenuOwnerState, Dt as ThemeTypographyVariants, E as ComponentVariant, Et as ThemeTransitions, F as LayoutPanel, Ft as between, G as PressableOwnerState, Gt as letterSpacings, H as OpenScale, Ht as fonts, I as LayoutPanels, It as borderWidths, J as ScrollAreaOwnerState, Jt as only, K as RangeInputOwnerState, Kt as lineHeights, L as LayoutSpace, Lt as breakpoints, M as LayoutContent, Mt as TypographyVariantStyle, N as LayoutEntry, Nt as avatar, O as DefaultBreakpoints, Ot as ThemeZOrder, P as LayoutLength, Pt as baseTheme, Q as TabPanelOwnerState, Qt as transitions, R as MenuItemOwnerState, Rt as containerQueries, S as ChipOwnerState, St as ThemeSwitch, T as ComponentStyle, Tt as ThemeTransitionEasing, U as PaletteColor, Ut as icon, V as NumberInputOwnerState, Vt as fontWeights, W as PaletteEntry, Wt as layout, X as SnackbarOwnerState, Xt as sizes, Y as SizeEntry, Yt as radii, Z as TabOwnerState, Zt as space, _ as ButtonVariants, _t as ThemeRadii, an as BreakpointHelpers, at as ThemeBorder, b as CardSlotIconProps, bt as ThemeSkeleton, c as AccordionOwnerState, ct as ThemeComponents, d as AutocompleteOwnerState, dt as ThemeFonts, en as up, et as TabsOwnerState, f as BadgeOwnerState, ft as ThemeIconSizes, g as ButtonOwnerState, gt as ThemePalette, h as BreakpointOverrides, ht as ThemeLineHeights, in as createTheme, it as ThemeBackground, j as LayoutBars, jt as TypographyVariant, k as FabMenuOwnerState, kt as TooltipOwnerState, l as AccordionSummaryOwnerState, lt as ThemeDefaults, m as BreakpointKey, mt as ThemeLetterSpacings, nn as DeepPartial, nt as Theme, on as withBreakpointHelpers, ot as ThemeBorderWidths, p as BreadcrumbsOwnerState, pt as ThemeLayout, q as RatingOwnerState, qt as not, rn as ThemeOverride, rt as ThemeAvatarSizes, s as AccordionGroupOwnerState, st as ThemeBreakpoints, tn as zOrder, tt as TabsVariants, u as AlertOwnerState, ut as ThemeFontWeights, v as CSSObject, vt as ThemeShadow, w as ComponentConfig, wt as ThemeTransitionDuration, x as CardSlotTypographyProps, xt as ThemeSpace, y as CardOwnerState, yt as ThemeSizes, z as MenuListOwnerState, zt as down } from "./index-CRQ7XLri.mjs";
-import { a as LayoutProvider, i as themeDefault, n as useDefaultProps, o as LayoutProviderProps, r as useTheme, s as ThemeProvider, t as withTheme } from "./index-vBCN6iAz.mjs";
+import { $ as TabScrollButtonOwnerState, $t as typography, A as FabOwnerState, At as TransferListOwnerState, B as MenuOwnerState, Bt as fontSizes, C as CollapseOwnerState, Ct as ThemeText, D as ContextMenuOwnerState, Dt as ThemeTypographyVariants, E as ComponentVariant, Et as ThemeTransitions, F as LayoutPanel, Ft as between, G as PressableOwnerState, Gt as letterSpacings, H as OpenScale, Ht as fonts, I as LayoutPanels, It as borderWidths, J as ScrollAreaOwnerState, Jt as only, K as RangeInputOwnerState, Kt as lineHeights, L as LayoutSpace, Lt as breakpoints, M as LayoutContent, Mt as TypographyVariantStyle, N as LayoutEntry, Nt as avatar, O as DefaultBreakpoints, Ot as ThemeZOrder, P as LayoutLength, Pt as baseTheme, Q as TabPanelOwnerState, Qt as transitions, R as MenuItemOwnerState, Rt as containerQueries, S as ChipOwnerState, St as ThemeSwitch, T as ComponentStyle, Tt as ThemeTransitionEasing, U as PaletteColor, Ut as icon, V as NumberInputOwnerState, Vt as fontWeights, W as PaletteEntry, Wt as layout, X as SnackbarOwnerState, Xt as sizes, Y as SizeEntry, Yt as radii, Z as TabOwnerState, Zt as space, _ as ButtonVariants, _t as ThemeRadii, an as BreakpointHelpers, at as ThemeBorder, b as CardSlotIconProps, bt as ThemeSkeleton, c as AccordionOwnerState, ct as ThemeComponents, d as AutocompleteOwnerState, dt as ThemeFonts, en as up, et as TabsOwnerState, f as BadgeOwnerState, ft as ThemeIconSizes, g as ButtonOwnerState, gt as ThemePalette, h as BreakpointOverrides, ht as ThemeLineHeights, in as createTheme, it as ThemeBackground, j as LayoutBars, jt as TypographyVariant, k as FabMenuOwnerState, kt as TooltipOwnerState, l as AccordionSummaryOwnerState, lt as ThemeDefaults, m as BreakpointKey, mt as ThemeLetterSpacings, nn as DeepPartial, nt as Theme, on as withBreakpointHelpers, ot as ThemeBorderWidths, p as BreadcrumbsOwnerState, pt as ThemeLayout, q as RatingOwnerState, qt as not, rn as ThemeOverride, rt as ThemeAvatarSizes, s as AccordionGroupOwnerState, st as ThemeBreakpoints, tn as zOrder, tt as TabsVariants, u as AlertOwnerState, ut as ThemeFontWeights, v as CSSObject, vt as ThemeShadow, w as ComponentConfig, wt as ThemeTransitionDuration, x as CardSlotTypographyProps, xt as ThemeSpace, y as CardOwnerState, yt as ThemeSizes, z as MenuListOwnerState, zt as down } from "./index-CR8qkP8U.mjs";
+import { a as LayoutProvider, i as themeDefault, n as useDefaultProps, o as LayoutProviderProps, r as useTheme, s as ThemeProvider, t as withTheme } from "./index-CF_pl72E.mjs";
 export { AccordionGroupOwnerState, AccordionOwnerState, AccordionSummaryOwnerState, AlertOwnerState, AutocompleteOwnerState, BadgeOwnerState, BreadcrumbsOwnerState, BreakpointHelpers, BreakpointKey, BreakpointOverrides, ButtonOwnerState, ButtonVariants, CSSObject, CardOwnerState, CardSlotIconProps, CardSlotTypographyProps, ChipOwnerState, CollapseOwnerState, ComponentConfig, ComponentStyle, ComponentVariant, ContextMenuOwnerState, type DeepPartial, DefaultBreakpoints, FabMenuOwnerState, FabOwnerState, LayoutBars, LayoutContent, LayoutEntry, LayoutLength, LayoutPanel, LayoutPanels, LayoutProvider, LayoutProviderProps, LayoutSpace, MenuItemOwnerState, MenuListOwnerState, MenuOwnerState, NumberInputOwnerState, OpenScale, PaletteColor, PaletteEntry, PressableOwnerState, RangeInputOwnerState, RatingOwnerState, ScrollAreaOwnerState, SizeEntry, SnackbarOwnerState, TabOwnerState, TabPanelOwnerState, TabScrollButtonOwnerState, TabsOwnerState, TabsVariants, Theme, ThemeAvatarSizes, ThemeBackground, ThemeBorder, ThemeBorderWidths, ThemeBreakpoints, ThemeComponents, ThemeDefaults, ThemeFontWeights, ThemeFonts, ThemeIconSizes, ThemeLayout, ThemeLetterSpacings, ThemeLineHeights, type ThemeOverride, ThemePalette, ThemeProvider, ThemeRadii, ThemeShadow, ThemeSizes, ThemeSkeleton, ThemeSpace, ThemeSwitch, ThemeText, ThemeTransitionDuration, ThemeTransitionEasing, ThemeTransitions, ThemeTypographyVariants, ThemeZOrder, TooltipOwnerState, TransferListOwnerState, TypographyVariant, TypographyVariantStyle, avatar, baseTheme, between, borderWidths, breakpoints, containerQueries, createTheme, down, fontSizes, fontWeights, fonts, icon, layout, letterSpacings, lineHeights, not, only, radii, sizes, space, themeDefault, transitions, typography, up, useDefaultProps, useTheme, withBreakpointHelpers, withTheme, zOrder };

package/dist/theme.mjs

@@ -1,4 +1,4 @@
-import { C as zOrder, S as up, _ as radii, a as breakpoints, b as transitions, c as fontSizes, d as icon, f as layout, g as only, h as not, i as borderWidths, l as fontWeights, m as lineHeights, n as baseTheme, o as containerQueries, p as letterSpacings, r as between, s as down, t as avatar, u as fonts, v as sizes, w as withBreakpointHelpers, x as typography, y as space } from "./themes-BwEsdVox.mjs";
-import { a as ThemeProvider, i as LayoutProvider, n as useDefaultProps, o as createTheme, r as useTheme, t as withTheme } from "./theme-oBfFhJm9.mjs";
-import { t as themeDefault } from "./themeDefault-Z3KmyIbm.mjs";
+import { C as zOrder, S as up, _ as radii, a as breakpoints, b as transitions, c as fontSizes, d as icon, f as layout, g as only, h as not, i as borderWidths, l as fontWeights, m as lineHeights, n as baseTheme, o as containerQueries, p as letterSpacings, r as between, s as down, t as avatar, u as fonts, v as sizes, w as withBreakpointHelpers, x as typography, y as space } from "./themes-D-knykK0.mjs";
+import { a as ThemeProvider, i as LayoutProvider, n as useDefaultProps, o as createTheme, r as useTheme, t as withTheme } from "./theme-DyyZQFzQ.mjs";
+import { t as themeDefault } from "./themeDefault-BeZJzqJj.mjs";
 export { LayoutProvider, ThemeProvider, avatar, baseTheme, between, borderWidths, breakpoints, containerQueries, createTheme, down, fontSizes, fontWeights, fonts, icon, layout, letterSpacings, lineHeights, not, only, radii, sizes, space, themeDefault, transitions, typography, up, useDefaultProps, useTheme, withBreakpointHelpers, withTheme, zOrder };

package/dist/{themeDefault-Z3KmyIbm.mjs → themeDefault-BeZJzqJj.mjs}

@@ -1,4 +1,4 @@
-//#region src/theme/utils/themeDefault.ts
+// src/theme/utils/themeDefault.ts
 /**
 * Resolves a component's default token/variant key: the theme's optional
 * `defaults` override wins, otherwise the component's literal `fallback`.
@@ -7,5 +7,4 @@
 * yet overridable per theme or via `ThemeProvider`'s `defaults` prop.
 */
 const themeDefault = (theme, key, fallback) => theme.defaults?.[key] ?? fallback;
-//#endregion
 export { themeDefault as t };

package/dist/{themeDefault-Cebi08Cv.cjs → themeDefault-DbPHBbNO.cjs}

@@ -1,4 +1,4 @@
-//#region src/theme/utils/themeDefault.ts
+// src/theme/utils/themeDefault.ts
 /**
 * Resolves a component's default token/variant key: the theme's optional
 * `defaults` override wins, otherwise the component's literal `fallback`.
@@ -7,7 +7,6 @@
 * yet overridable per theme or via `ThemeProvider`'s `defaults` prop.
 */
 const themeDefault = (theme, key, fallback) => theme.defaults?.[key] ?? fallback;
-//#endregion
 Object.defineProperty(exports, "themeDefault", {
 	enumerable: true,
 	get: function() {

package/dist/{themes--4eci3M1.cjs → themes-C2oyu8gK.cjs}

@@ -1,9 +1,8 @@
 const require_utils = require("./utils.cjs");
 let _soroush_tech_styled_system = require("@soroush.tech/styled-system");
-//#region src/theme/utils/spacing.ts
+// src/theme/utils/spacing.ts
 const spacing = (units) => units === 0 ? "0px" : `${Math.max(1, Math.round(8 * units))}px`;
-//#endregion
-//#region src/theme/breakpoints.ts
+// src/theme/breakpoints.ts
 /**
 * The scale with its helpers attached as non-enumerable methods: the engine, the theme's JSON
 * and a spread see only the sizes, while `theme.breakpoints.up('md')` works. `createTheme`
@@ -22,8 +21,7 @@ const withBreakpointHelpers = (scale) => {
 	});
 	return sizes;
 };
-//#endregion
-//#region src/theme/themes.ts
+// src/theme/themes.ts
 const shadow = {
 	color: "#000000",
 	opacity: .4
@@ -400,7 +398,6 @@ const baseTheme = {
 * breakpoints has the same helpers on `theme.breakpoints`.
 */
 const { up, down, only, between, not, containerQueries } = breakpoints;
-//#endregion
 Object.defineProperty(exports, "avatar", {
 	enumerable: true,
 	get: function() {

package/dist/{themes-BwEsdVox.mjs → themes-D-knykK0.mjs}

@@ -1,9 +1,8 @@
 import { alpha, generateBoxShadow } from "./utils.mjs";
 import { createContainerQueries, createMediaHelpers } from "@soroush.tech/styled-system";
-//#region src/theme/utils/spacing.ts
+// src/theme/utils/spacing.ts
 const spacing = (units) => units === 0 ? "0px" : `${Math.max(1, Math.round(8 * units))}px`;
-//#endregion
-//#region src/theme/breakpoints.ts
+// src/theme/breakpoints.ts
 /**
 * The scale with its helpers attached as non-enumerable methods: the engine, the theme's JSON
 * and a spread see only the sizes, while `theme.breakpoints.up('md')` works. `createTheme`
@@ -22,8 +21,7 @@ const withBreakpointHelpers = (scale) => {
 	});
 	return sizes;
 };
-//#endregion
-//#region src/theme/themes.ts
+// src/theme/themes.ts
 const shadow$1 = {
 	color: "#000000",
 	opacity: .4
@@ -400,5 +398,4 @@ const baseTheme = {
 * breakpoints has the same helpers on `theme.breakpoints`.
 */
 const { up, down, only, between, not, containerQueries } = breakpoints;
-//#endregion
 export { zOrder as C, up as S, radii as _, breakpoints as a, transitions as b, fontSizes as c, icon as d, layout$1 as f, only as g, not as h, borderWidths as i, fontWeights as l, lineHeights as m, baseTheme as n, containerQueries as o, letterSpacings as p, between as r, down as s, avatar as t, fonts as u, sizes as v, withBreakpointHelpers as w, typography$1 as x, space$1 as y };

package/dist/tonalRadius-CU9GHoHx.cjs

@@ -0,0 +1,9 @@
+// src/Tabs/utils/tonalRadius.ts
+/** The tonal look's radius: a pill, for the container and the selected tab. */
+const TONAL_RADIUS = "999px";
+Object.defineProperty(exports, "TONAL_RADIUS", {
+	enumerable: true,
+	get: function() {
+		return TONAL_RADIUS;
+	}
+});

package/dist/tonalRadius-CvXRueqT.mjs

@@ -0,0 +1,4 @@
+// src/Tabs/utils/tonalRadius.ts
+/** The tonal look's radius: a pill, for the container and the selected tab. */
+const TONAL_RADIUS = "999px";
+export { TONAL_RADIUS as t };

package/dist/{useAnchoredPlacement-Pe7sY41E.mjs → useAnchoredPlacement-COrXZxhm.mjs}

@@ -1,7 +1,7 @@
-import { t as computePopoverPosition } from "./computePopoverPosition-BIprs_xo.mjs";
-import { t as isRtl } from "./isRtl-BJDtm86G.mjs";
+import { t as computePopoverPosition } from "./computePopoverPosition-qii46Z6p.mjs";
+import { t as isRtl } from "./isRtl-DN-EdUlg.mjs";
 import { useCallback, useEffect, useLayoutEffect } from "react";
-//#region src/utils/useAnchoredPlacement.ts
+// src/utils/useAnchoredPlacement.ts
 const OPPOSITE = {
 	top: "bottom",
 	bottom: "top",
@@ -102,5 +102,4 @@ function useAnchoredPlacement({ isOpen, anchorRef, surfaceRef, getOrigins, margi
 		};
 	}, [isOpen, place]);
 }
-//#endregion
 export { useAnchoredPlacement as t };

package/dist/{useAnchoredPlacement-B1FyGoZV.cjs → useAnchoredPlacement-ee6KzG3t.cjs}

@@ -1,7 +1,7 @@
-const require_computePopoverPosition = require("./computePopoverPosition-DiyEOHnU.cjs");
-const require_isRtl = require("./isRtl-DTkYHRPo.cjs");
+const require_computePopoverPosition = require("./computePopoverPosition-C2W1FcYE.cjs");
+const require_isRtl = require("./isRtl-Dl6QQWib.cjs");
 let react = require("react");
-//#region src/utils/useAnchoredPlacement.ts
+// src/utils/useAnchoredPlacement.ts
 const OPPOSITE = {
 	top: "bottom",
 	bottom: "top",
@@ -102,7 +102,6 @@ function useAnchoredPlacement({ isOpen, anchorRef, surfaceRef, getOrigins, margi
 		};
 	}, [isOpen, place]);
 }
-//#endregion
 Object.defineProperty(exports, "useAnchoredPlacement", {
 	enumerable: true,
 	get: function() {

package/dist/{useControlled-CBRLsO-H.mjs → useControlled-B4uQ9Bj6.mjs}

@@ -1,5 +1,5 @@
 import { useState } from "react";
-//#region src/utils/useControlled.ts
+// src/utils/useControlled.ts
 /**
 * A value a control owns until its owner takes it over: the controlled value when there is one,
 * otherwise its own state. The setter keeps that state moving either way, so a control that
@@ -9,5 +9,4 @@ function useControlled({ controlled, default: defaultValue }) {
 	const [state, setState] = useState(defaultValue);
 	return [controlled !== void 0 ? controlled : state, setState];
 }
-//#endregion
 export { useControlled as t };

package/dist/{useControlled-C666KpQ0.cjs → useControlled-CzCxM4J3.cjs}

@@ -1,5 +1,5 @@
 let react = require("react");
-//#region src/utils/useControlled.ts
+// src/utils/useControlled.ts
 /**
 * A value a control owns until its owner takes it over: the controlled value when there is one,
 * otherwise its own state. The setter keeps that state moving either way, so a control that
@@ -9,7 +9,6 @@ function useControlled({ controlled, default: defaultValue }) {
 	const [state, setState] = (0, react.useState)(defaultValue);
 	return [controlled !== void 0 ? controlled : state, setState];
 }
-//#endregion
 Object.defineProperty(exports, "useControlled", {
 	enumerable: true,
 	get: function() {

package/dist/{useMergedRefs-2zTDXgPO.cjs → useMergedRefs-BtctsnmX.cjs}

@@ -1,5 +1,5 @@
 let react = require("react");
-//#region src/Modal/hooks/useMergedRefs.ts
+// src/Modal/hooks/useMergedRefs.ts
 function assignRef(ref, value) {
 	if (typeof ref === "function") ref(value);
 	else if (ref) ref.current = value;
@@ -18,7 +18,6 @@ function useMergedRefs(refA, refB) {
 		};
 	}, [refA, refB]);
 }
-//#endregion
 Object.defineProperty(exports, "useMergedRefs", {
 	enumerable: true,
 	get: function() {

package/dist/{useMergedRefs-BfBckwRY.mjs → useMergedRefs-CdfwtmUd.mjs}

@@ -1,5 +1,5 @@
 import { useMemo } from "react";
-//#region src/Modal/hooks/useMergedRefs.ts
+// src/Modal/hooks/useMergedRefs.ts
 function assignRef(ref, value) {
 	if (typeof ref === "function") ref(value);
 	else if (ref) ref.current = value;
@@ -18,5 +18,4 @@ function useMergedRefs(refA, refB) {
 		};
 	}, [refA, refB]);
 }
-//#endregion
 export { useMergedRefs as t };

package/dist/{useTablePagination-_-bzuXJO.d.mts → useTablePagination-BlD8mK8k.d.mts}

@@ -1,5 +1,4 @@
-import { n as TableSortLabelDirection } from "./index-D05fSuF1.mjs";
-//#region src/Table/hooks/useTableSort.d.ts
+import { n as TableSortLabelDirection } from "./index-76zijQoi.mjs";
 /** One column's sort state - spreads directly onto `TableSortLabel`. */
 interface TableSortEntry {
   isActive: boolean;
@@ -21,8 +20,6 @@ type TableSortMap<K extends string = string> = Record<K, TableSortEntry>;
  * ```
  */
 declare function useTableSort<K extends string>(keys: readonly K[], onChange?: (key: K, direction: TableSortLabelDirection) => void): TableSortMap<K>;
-//#endregion
-//#region src/Table/hooks/useTablePagination.d.ts
 interface UseTablePaginationOptions {
   /** Initial zero-based page. Default: `0`. */
   defaultPage?: number;
@@ -47,5 +44,4 @@ interface TablePaginationState {
  * ```
  */
 declare function useTablePagination({ defaultPage, defaultRowsPerPage }?: UseTablePaginationOptions): TablePaginationState;
-//#endregion
 export { TableSortMap as a, TableSortEntry as i, UseTablePaginationOptions as n, useTableSort as o, useTablePagination as r, TablePaginationState as t };

package/dist/{useTablePagination-CFb_FYA9.d.cts → useTablePagination-CGjb_jPX.d.cts}

@@ -1,5 +1,4 @@
-import { n as TableSortLabelDirection } from "./index-CR0akDlJ.cjs";
-//#region src/Table/hooks/useTableSort.d.ts
+import { n as TableSortLabelDirection } from "./index-RaDENVX_.cjs";
 /** One column's sort state - spreads directly onto `TableSortLabel`. */
 interface TableSortEntry {
   isActive: boolean;
@@ -21,8 +20,6 @@ type TableSortMap<K extends string = string> = Record<K, TableSortEntry>;
  * ```
  */
 declare function useTableSort<K extends string>(keys: readonly K[], onChange?: (key: K, direction: TableSortLabelDirection) => void): TableSortMap<K>;
-//#endregion
-//#region src/Table/hooks/useTablePagination.d.ts
 interface UseTablePaginationOptions {
   /** Initial zero-based page. Default: `0`. */
   defaultPage?: number;
@@ -47,5 +44,4 @@ interface TablePaginationState {
  * ```
  */
 declare function useTablePagination({ defaultPage, defaultRowsPerPage }?: UseTablePaginationOptions): TablePaginationState;
-//#endregion
 export { TableSortMap as a, TableSortEntry as i, UseTablePaginationOptions as n, useTableSort as o, useTablePagination as r, TablePaginationState as t };

package/dist/{useTransition-C1F7MuHO.d.mts → useTransition-3EoagwIe.d.mts}

@@ -1,6 +1,5 @@
-import { nt as Theme } from "./index-CRQ7XLri.mjs";
+import { nt as Theme } from "./index-CR8qkP8U.mjs";
 import { ReactElement } from "react";
-//#region src/utils/useTransition.d.ts
 /** How long a transition takes in milliseconds - one for both ways, or one for each. */
 type TransitionTimeout = number | {
   enter: number;
@@ -38,5 +37,4 @@ interface TransitionProps extends TransitionCallbacks {
   /** Which of `theme.transitions.easing` it moves by. Default: `'standard'`. */
   easing?: keyof Theme['transitions']['easing'];
 }
-//#endregion
 export { TransitionProps as n, TransitionTimeout as r, TransitionCallbacks as t };

package/dist/{useTransition-DAQd1PX3.cjs → useTransition-B0V2fAq5.cjs}

@@ -1,5 +1,5 @@
 let react = require("react");
-//#region src/utils/useTransition.ts
+// src/utils/useTransition.ts
 const getInitialStatus = ({ isShown, shouldAppear, shouldMountOnEnter, shouldUnmountOnExit }) => {
 	if (isShown) return shouldAppear ? "exited" : "entered";
 	return shouldMountOnEnter || shouldUnmountOnExit ? "unmounted" : "exited";
@@ -74,7 +74,6 @@ function useTransition(params) {
 		duration: isReduced ? 0 : getDuration(params.timeout, isShown)
 	};
 }
-//#endregion
 Object.defineProperty(exports, "useTransition", {
 	enumerable: true,
 	get: function() {

package/dist/{useTransition-l9dv83-Y.d.cts → useTransition-C89K0mS7.d.cts}

@@ -1,6 +1,5 @@
-import { nt as Theme } from "./index-XN4-ZqTB.cjs";
+import { nt as Theme } from "./index-Lsm4v8fB.cjs";
 import { ReactElement } from "react";
-//#region src/utils/useTransition.d.ts
 /** How long a transition takes in milliseconds - one for both ways, or one for each. */
 type TransitionTimeout = number | {
   enter: number;
@@ -38,5 +37,4 @@ interface TransitionProps extends TransitionCallbacks {
   /** Which of `theme.transitions.easing` it moves by. Default: `'standard'`. */
   easing?: keyof Theme['transitions']['easing'];
 }
-//#endregion
 export { TransitionProps as n, TransitionTimeout as r, TransitionCallbacks as t };

package/dist/{useTransition-DP1k0irI.mjs → useTransition-CWxiEqtC.mjs}

@@ -1,5 +1,5 @@
 import { useEffect, useRef, useState, useSyncExternalStore } from "react";
-//#region src/utils/useTransition.ts
+// src/utils/useTransition.ts
 const getInitialStatus = ({ isShown, shouldAppear, shouldMountOnEnter, shouldUnmountOnExit }) => {
 	if (isShown) return shouldAppear ? "exited" : "entered";
 	return shouldMountOnEnter || shouldUnmountOnExit ? "unmounted" : "exited";
@@ -74,5 +74,4 @@ function useTransition(params) {
 		duration: isReduced ? 0 : getDuration(params.timeout, isShown)
 	};
 }
-//#endregion
 export { useTransition as t };

package/dist/{useTransitionChild-Dvg9hO-F.mjs → useTransitionChild-CFhlMm65.mjs}

@@ -1,8 +1,8 @@
-import { r as useTheme } from "./theme-oBfFhJm9.mjs";
-import { t as useTransition } from "./useTransition-DP1k0irI.mjs";
-import { t as useMergedRefs } from "./useMergedRefs-BfBckwRY.mjs";
+import { r as useTheme } from "./theme-DyyZQFzQ.mjs";
+import { t as useTransition } from "./useTransition-CWxiEqtC.mjs";
+import { t as useMergedRefs } from "./useMergedRefs-CdfwtmUd.mjs";
 import { cloneElement, useRef } from "react";
-//#region src/utils/useTransitionChild.ts
+// src/utils/useTransitionChild.ts
 const chain = (own, given) => (node) => {
 	own?.(node);
 	given?.(node);
@@ -45,5 +45,4 @@ function useTransitionChild(props, getStyle, own = {}) {
 		}
 	});
 }
-//#endregion
 export { useTransitionChild as t };

package/dist/{useTransitionChild-CikpU0Yh.cjs → useTransitionChild-COlRozbU.cjs}

@@ -1,8 +1,8 @@
-const require_theme = require("./theme-DzfwuzMZ.cjs");
-const require_useTransition = require("./useTransition-DAQd1PX3.cjs");
-const require_useMergedRefs = require("./useMergedRefs-2zTDXgPO.cjs");
+const require_theme = require("./theme-XJvMdOnY.cjs");
+const require_useTransition = require("./useTransition-B0V2fAq5.cjs");
+const require_useMergedRefs = require("./useMergedRefs-BtctsnmX.cjs");
 let react = require("react");
-//#region src/utils/useTransitionChild.ts
+// src/utils/useTransitionChild.ts
 const chain = (own, given) => (node) => {
 	own?.(node);
 	given?.(node);
@@ -45,7 +45,6 @@ function useTransitionChild(props, getStyle, own = {}) {
 		}
 	});
 }
-//#endregion
 Object.defineProperty(exports, "useTransitionChild", {
 	enumerable: true,
 	get: function() {

package/dist/utils.cjs

@@ -1,24 +1,21 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-//#region src/utils/generateBoxShadow.ts
+// src/utils/generateBoxShadow.ts
 const generateBoxShadow = (elevation, shadowColor) => {
 	return `0 ${elevation}px ${elevation * 2}px ${shadowColor}`;
 };
-//#endregion
-//#region src/utils/clamp.ts
+// src/utils/clamp.ts
 /** Clamps `value` to the inclusive range `[min, max]`. */
 function clamp(value, min, max) {
 	return Math.min(Math.max(value, min), max);
 }
-//#endregion
-//#region src/utils/luminance.ts
+// src/utils/luminance.ts
 function luminance(hex) {
 	const r = Number.parseInt(hex.slice(1, 3), 16);
 	const g = Number.parseInt(hex.slice(3, 5), 16);
 	const b = Number.parseInt(hex.slice(5, 7), 16);
 	return (.299 * r + .587 * g + .114 * b) / 255;
 }
-//#endregion
-//#region src/utils/alpha.ts
+// src/utils/alpha.ts
 /**
 * Appends an alpha channel to a 6-digit hex color, producing an 8-digit `#RRGGBBAA` hex.
 * @param color - 6-digit hex string, e.g. `'#4ade80'`
@@ -29,7 +26,6 @@ function luminance(hex) {
 const alpha = (color, opacity) => {
 	return `${color}${Math.round(clamp(opacity, 0, 1) * 255).toString(16).padStart(2, "0").toUpperCase()}`;
 };
-//#endregion
 exports.alpha = alpha;
 exports.clamp = clamp;
 exports.generateBoxShadow = generateBoxShadow;

package/dist/utils.d.cts

@@ -1,14 +1,7 @@
-//#region src/utils/generateBoxShadow.d.ts
 declare const generateBoxShadow: (elevation: number, shadowColor: string) => string;
-//#endregion
-//#region src/utils/clamp.d.ts
 /** Clamps `value` to the inclusive range `[min, max]`. */
 declare function clamp(value: number, min: number, max: number): number;
-//#endregion
-//#region src/utils/luminance.d.ts
 declare function luminance(hex: string): number;
-//#endregion
-//#region src/utils/alpha.d.ts
 /**
  * Appends an alpha channel to a 6-digit hex color, producing an 8-digit `#RRGGBBAA` hex.
  * @param color - 6-digit hex string, e.g. `'#4ade80'`
@@ -17,5 +10,4 @@ declare function luminance(hex: string): number;
  * @example alpha('#4ade80', 0.1) // '#4ade801A'
  */
 declare const alpha: (color: string, opacity: number) => string;
-//#endregion
 export { alpha, clamp, generateBoxShadow, luminance };

package/dist/utils.d.mts

@@ -1,14 +1,7 @@
-//#region src/utils/generateBoxShadow.d.ts
 declare const generateBoxShadow: (elevation: number, shadowColor: string) => string;
-//#endregion
-//#region src/utils/clamp.d.ts
 /** Clamps `value` to the inclusive range `[min, max]`. */
 declare function clamp(value: number, min: number, max: number): number;
-//#endregion
-//#region src/utils/luminance.d.ts
 declare function luminance(hex: string): number;
-//#endregion
-//#region src/utils/alpha.d.ts
 /**
  * Appends an alpha channel to a 6-digit hex color, producing an 8-digit `#RRGGBBAA` hex.
  * @param color - 6-digit hex string, e.g. `'#4ade80'`
@@ -17,5 +10,4 @@ declare function luminance(hex: string): number;
  * @example alpha('#4ade80', 0.1) // '#4ade801A'
  */
 declare const alpha: (color: string, opacity: number) => string;
-//#endregion
 export { alpha, clamp, generateBoxShadow, luminance };

package/dist/utils.mjs

@@ -1,23 +1,20 @@
-//#region src/utils/generateBoxShadow.ts
+// src/utils/generateBoxShadow.ts
 const generateBoxShadow = (elevation, shadowColor) => {
 	return `0 ${elevation}px ${elevation * 2}px ${shadowColor}`;
 };
-//#endregion
-//#region src/utils/clamp.ts
+// src/utils/clamp.ts
 /** Clamps `value` to the inclusive range `[min, max]`. */
 function clamp(value, min, max) {
 	return Math.min(Math.max(value, min), max);
 }
-//#endregion
-//#region src/utils/luminance.ts
+// src/utils/luminance.ts
 function luminance(hex) {
 	const r = Number.parseInt(hex.slice(1, 3), 16);
 	const g = Number.parseInt(hex.slice(3, 5), 16);
 	const b = Number.parseInt(hex.slice(5, 7), 16);
 	return (.299 * r + .587 * g + .114 * b) / 255;
 }
-//#endregion
-//#region src/utils/alpha.ts
+// src/utils/alpha.ts
 /**
 * Appends an alpha channel to a 6-digit hex color, producing an 8-digit `#RRGGBBAA` hex.
 * @param color - 6-digit hex string, e.g. `'#4ade80'`
@@ -28,5 +25,4 @@ function luminance(hex) {
 const alpha = (color, opacity) => {
 	return `${color}${Math.round(clamp(opacity, 0, 1) * 255).toString(16).padStart(2, "0").toUpperCase()}`;
 };
-//#endregion
 export { alpha, clamp, generateBoxShadow, luminance };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soroush.tech/design-system",
-  "version": "2.0.0-rc.4",
+  "version": "2.0.0-rc.5",
   "description": "Emotion + @soroush.tech/styled-system React component library - token-driven light/dark themes, layout primitives, forms, and overlays.",
   "keywords": [
     "design-system",
@@ -13,7 +13,7 @@
   ],
   "author": "Masoud Soroush <masoud@soroush.tech>",
   "license": "MIT",
-  "homepage": "https://soroush.tech/design-system",
+  "homepage": "https://docs.soroush.tech/design-system/",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/soroush-tech/design-system.git",
@@ -328,6 +328,16 @@
         "default": "./dist/Image.cjs"
       }
     },
+    "./NavTree": {
+      "import": {
+        "types": "./dist/NavTree.d.mts",
+        "default": "./dist/NavTree.mjs"
+      },
+      "require": {
+        "types": "./dist/NavTree.d.cts",
+        "default": "./dist/NavTree.cjs"
+      }
+    },
     "./RangeInput": {
       "import": {
         "types": "./dist/RangeInput.d.mts",
@@ -717,7 +727,7 @@
     "@emotion/cache": "^11.14.0",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.1",
-    "@soroush.tech/styled-system": "^6.0.0-rc.4"
+    "@soroush.tech/styled-system": "^6.0.0-rc.5"
   },
   "peerDependencies": {
     "react": "^19.0.0",
@@ -725,27 +735,27 @@
   },
   "devDependencies": {
     "@emotion/css": "^11.13.5",
-    "@storybook/addon-a11y": "^10.5.8",
-    "@storybook/addon-docs": "^10.5.8",
-    "@storybook/addon-vitest": "^10.5.8",
-    "@storybook/react-vite": "^10.5.8",
+    "@storybook/addon-a11y": "^10.6.3",
+    "@storybook/addon-docs": "^10.6.3",
+    "@storybook/addon-vitest": "^10.6.3",
+    "@storybook/react-vite": "^10.6.3",
     "@testing-library/jest-dom": "^7.0.1",
-    "@testing-library/react": "^16.3.2",
-    "@types/node": "^26.2.0",
-    "@types/react": "^19.2.18",
-    "@types/react-dom": "^19.2.4",
-    "@vitest/browser-playwright": "^4.1.10",
-    "@vitest/coverage-v8": "^4.1.10",
+    "@testing-library/react": "^16.3.3",
+    "@types/node": "^26.6.5",
+    "@types/react": "^19.3.0",
+    "@types/react-dom": "^19.3.0",
+    "@vitest/browser-playwright": "^5.0.5",
+    "@vitest/coverage-v8": "^5.0.5",
     "jsdom": "^29.1.1",
-    "oxlint": "^1.78.0",
-    "playwright": "^1.62.1",
-    "react": "^19.2.8",
-    "react-dom": "^19.2.8",
-    "storybook": "^10.5.8",
+    "oxlint": "^1.89.0",
+    "playwright": "^1.64.1",
+    "react": "^19.3.1",
+    "react-dom": "^19.3.1",
+    "storybook": "^10.6.3",
     "tsdown": "^0.22.14",
     "typescript": "~7.0.2",
-    "vitest": "^4.1.10",
-    "zod": "^4.4.3",
+    "vitest": "^5.0.5",
+    "zod": "^4.6.7",
     "@soroush.tech/docs-content": "0.1.0",
     "@soroush.tech/eslint-config": "0.0.0"
   },

package/dist/index-fPRELf0V.d.mts

@@ -1 +0,0 @@
-import "./index-CRQ7XLri.mjs";

package/dist/index-x3WC9ViD.d.cts

@@ -1 +0,0 @@
-import "./index-XN4-ZqTB.cjs";