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

package/dist/Table/hooks.d.cts

@@ -1,4 +1,4 @@
-import { a as TableSortMap, i as TableSortEntry, n as UseTablePaginationOptions, o as useTableSort, r as useTablePagination, t as TablePaginationState } from "../useTablePagination-C-u3ru4N.cjs";
+import { a as TableSortMap, i as TableSortEntry, n as UseTablePaginationOptions, o as useTableSort, r as useTablePagination, t as TablePaginationState } from "../useTablePagination-CFb_FYA9.cjs";
 //#region src/Table/hooks/useTableSelection.d.ts
 /** Header select-all state - spreads directly onto `Checkbox`. */
 interface TableSelectionAllProps {

package/dist/Table/hooks.d.mts

@@ -1,4 +1,4 @@
-import { a as TableSortMap, i as TableSortEntry, n as UseTablePaginationOptions, o as useTableSort, r as useTablePagination, t as TablePaginationState } from "../useTablePagination-D-39ZmQh.mjs";
+import { a as TableSortMap, i as TableSortEntry, n as UseTablePaginationOptions, o as useTableSort, r as useTablePagination, t as TablePaginationState } from "../useTablePagination-_-bzuXJO.mjs";
 //#region src/Table/hooks/useTableSelection.d.ts
 /** Header select-all state - spreads directly onto `Checkbox`. */
 interface TableSelectionAllProps {

package/dist/Table.d.cts

@@ -1,14 +1,14 @@
-import { n as TableContext, r as TableContextValue, t as TableCellPadding } from "./TableContext-Duj1nVG7.cjs";
+import { n as TableContext, r as TableContextValue, t as TableCellPadding } from "./TableContext-Be8tluYZ.cjs";
 import { Table, TableAlign, TableBackgroundToken, TableBorderColorToken, TableProps, TableSize } from "./Table/Table.cjs";
 import { TableBody, TableBodyBackgroundToken, TableBodyBorderColorToken, TableBodyColorToken, TableBodyProps } from "./Table/TableBody.cjs";
-import { a as TableCellColorToken, c as TableCellVariant, i as TableCellBorderColorToken, l as TableSection, n as TableCellAlign, o as TableCellProps, r as TableCellBackgroundToken, s as TableCellSortDirection, t as TableCell, u as TableSectionContext } from "./index-BelFIizY.cjs";
+import { a as TableCellColorToken, c as TableCellVariant, i as TableCellBorderColorToken, l as TableSection, n as TableCellAlign, o as TableCellProps, r as TableCellBackgroundToken, s as TableCellSortDirection, t as TableCell, u as TableSectionContext } from "./index-iTquH69S.cjs";
 import { TableContainer, TableContainerProps } from "./Table/TableContainer.cjs";
-import { n as TableSortLabelDirection, r as TableSortLabelProps, t as TableSortLabel } from "./index-DYF8sRE-.cjs";
-import { a as TableSortMap, i as TableSortEntry, n as UseTablePaginationOptions, o as useTableSort, r as useTablePagination, t as TablePaginationState } from "./useTablePagination-C-u3ru4N.cjs";
+import { n as TableSortLabelDirection, r as TableSortLabelProps, t as TableSortLabel } from "./index-CR0akDlJ.cjs";
+import { a as TableSortMap, i as TableSortEntry, n as UseTablePaginationOptions, o as useTableSort, r as useTablePagination, t as TablePaginationState } from "./useTablePagination-CFb_FYA9.cjs";
 import { TableControl, TableControlProps } from "./Table/TableControl.cjs";
 import { TableFooter, TableFooterBackgroundToken, TableFooterBorderColorToken, TableFooterColorToken, TableFooterProps } from "./Table/TableFooter.cjs";
 import { TableHead, TableHeadBackgroundToken, TableHeadBorderColorToken, TableHeadColorToken, TableHeadProps } from "./Table/TableHead.cjs";
-import { n as TablePaginationActions, r as TablePaginationActionsProps, t as TablePaginationActionType } from "./index-DtYjdBvO.cjs";
+import { n as TablePaginationActions, r as TablePaginationActionsProps, t as TablePaginationActionType } from "./index-BgLqA52S.cjs";
 import { TablePagination, TablePaginationDisplayedRowsInfo, TablePaginationProps } from "./Table/TablePagination.cjs";
 import { TableRow, TableRowBackgroundToken, TableRowBorderColorToken, TableRowColor, TableRowProps } from "./Table/TableRow.cjs";
 import { TableSelection, TableSelectionAllProps, TableSelectionRowProps, useTableSelection } from "./Table/hooks.cjs";

package/dist/Table.d.mts

@@ -1,14 +1,14 @@
-import { n as TableContext, r as TableContextValue, t as TableCellPadding } from "./TableContext-DhuRf6Wy.mjs";
+import { n as TableContext, r as TableContextValue, t as TableCellPadding } from "./TableContext-DUPqls5k.mjs";
 import { Table, TableAlign, TableBackgroundToken, TableBorderColorToken, TableProps, TableSize } from "./Table/Table.mjs";
 import { TableBody, TableBodyBackgroundToken, TableBodyBorderColorToken, TableBodyColorToken, TableBodyProps } from "./Table/TableBody.mjs";
-import { a as TableCellColorToken, c as TableCellVariant, i as TableCellBorderColorToken, l as TableSection, n as TableCellAlign, o as TableCellProps, r as TableCellBackgroundToken, s as TableCellSortDirection, t as TableCell, u as TableSectionContext } from "./index-ByYxVl9O.mjs";
+import { a as TableCellColorToken, c as TableCellVariant, i as TableCellBorderColorToken, l as TableSection, n as TableCellAlign, o as TableCellProps, r as TableCellBackgroundToken, s as TableCellSortDirection, t as TableCell, u as TableSectionContext } from "./index-BThHG5QU.mjs";
 import { TableContainer, TableContainerProps } from "./Table/TableContainer.mjs";
-import { n as TableSortLabelDirection, r as TableSortLabelProps, t as TableSortLabel } from "./index-pTNq3iQn.mjs";
-import { a as TableSortMap, i as TableSortEntry, n as UseTablePaginationOptions, o as useTableSort, r as useTablePagination, t as TablePaginationState } from "./useTablePagination-D-39ZmQh.mjs";
+import { n as TableSortLabelDirection, r as TableSortLabelProps, t as TableSortLabel } from "./index-D05fSuF1.mjs";
+import { a as TableSortMap, i as TableSortEntry, n as UseTablePaginationOptions, o as useTableSort, r as useTablePagination, t as TablePaginationState } from "./useTablePagination-_-bzuXJO.mjs";
 import { TableControl, TableControlProps } from "./Table/TableControl.mjs";
 import { TableFooter, TableFooterBackgroundToken, TableFooterBorderColorToken, TableFooterColorToken, TableFooterProps } from "./Table/TableFooter.mjs";
 import { TableHead, TableHeadBackgroundToken, TableHeadBorderColorToken, TableHeadColorToken, TableHeadProps } from "./Table/TableHead.mjs";
-import { n as TablePaginationActions, r as TablePaginationActionsProps, t as TablePaginationActionType } from "./index-CbFaWtjK.mjs";
+import { n as TablePaginationActions, r as TablePaginationActionsProps, t as TablePaginationActionType } from "./index-2x01drCL.mjs";
 import { TablePagination, TablePaginationDisplayedRowsInfo, TablePaginationProps } from "./Table/TablePagination.mjs";
 import { TableRow, TableRowBackgroundToken, TableRowBorderColorToken, TableRowColor, TableRowProps } from "./Table/TableRow.mjs";
 import { TableSelection, TableSelectionAllProps, TableSelectionRowProps, useTableSelection } from "./Table/hooks.mjs";

package/dist/{TableContext-DhuRf6Wy.d.mts → TableContext-Be8tluYZ.d.cts}

@@ -1,4 +1,4 @@
-import { W as Theme } from "./index-CJhK7JND.mjs";
+import { nt as Theme } from "./index-XN4-ZqTB.cjs";
 //#region src/Table/TableContext.d.ts
 /** Cell padding modes broadcast from `Table` to descendant cells. */
 type TableCellPadding = 'normal' | 'none';

package/dist/{TableContext-Duj1nVG7.d.cts → TableContext-DUPqls5k.d.mts}

@@ -1,4 +1,4 @@
-import { W as Theme } from "./index-DJ0f69wh.cjs";
+import { nt as Theme } from "./index-CRQ7XLri.mjs";
 //#region src/Table/TableContext.d.ts
 /** Cell padding modes broadcast from `Table` to descendant cells. */
 type TableCellPadding = 'normal' | 'none';

package/dist/Tabs/Tab.cjs

@@ -1,7 +1,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_src = require("../src-DU81aGy9.cjs");
-const require_theme = require("../theme-BxXuXRgQ.cjs");
-const require_Icon = require("../Icon-D-EWsBVg.cjs");
+const require_theme = require("../theme-DzfwuzMZ.cjs");
+const require_Icon = require("../Icon-BE7bRsqR.cjs");
 const require_dividerLine = require("../dividerLine-BNljcGlv.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -23,7 +23,8 @@ const shouldForwardProp = (0, require("@soroush.tech/styled-system/should-forwar
 	"borderRadius",
 	"lineColor",
 	"rowPaddingTop",
-	"rowPaddingBottom"
+	"rowPaddingBottom",
+	"isAnnounced"
 ]);
 const getEnclosedEdgeStyle = (theme, main, lineMain, isSelected, isVertical, hasDivider, radius) => {
 	const thin = theme.borderWidths.thin;
@@ -85,7 +86,10 @@ const TabRoot = require_src.styled("div", {
 		...variant === "enclosed" && getEnclosedEdgeStyle(theme, main, (0, require_src.src_exports.get)(theme, `palette.${lineColor}.main`), isSelected, isVertical, hasDivider, String(radius)),
 		transition: "background-color 0.12s ease",
 		...isDisabled ? {} : { "&:hover": { backgroundColor: isBoxed ? raised : `${main}14` } },
-		"&:hover [data-tab-close]": { visibility: "visible" }
+		"&:hover [data-tab-close]": {
+			visibility: "visible",
+			opacity: 1
+		}
 	};
 });
 const TabLabel = require_src.styled("button", {
@@ -147,7 +151,7 @@ const TabClose = require_src.styled("button", {
 	slot: "close",
 	label: "TabClose",
 	shouldForwardProp
-})(({ theme, color, isSelected }) => {
+})(({ theme, color, isSelected, isAnnounced }) => {
 	const main = (0, require_src.src_exports.get)(theme, `palette.${color}.main`);
 	return {
 		appearance: "none",
@@ -164,7 +168,10 @@ const TabClose = require_src.styled("button", {
 		backgroundColor: "transparent",
 		color: "inherit",
 		cursor: "pointer",
-		visibility: isSelected ? "visible" : "hidden",
+		...isAnnounced ? {
+			opacity: isSelected ? 1 : 0,
+			"&:focus-visible": { opacity: 1 }
+		} : { visibility: isSelected ? "visible" : "hidden" },
 		"&:hover": { backgroundColor: `${main}1F` }
 	};
 });
@@ -286,7 +293,9 @@ function Tab({ value: valueProp, label, icon, iconPosition = "top", isWrapped: i
 			secondaryAction != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SecondaryActionSlot, { children: secondaryAction }),
 			isClosable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TabClose, {
 				type: "button",
-				"aria-hidden": true,
+				isAnnounced: tabs.shouldAnnounceClose,
+				"aria-hidden": tabs.shouldAnnounceClose ? void 0 : true,
+				"aria-label": tabs.shouldAnnounceClose ? closeLabel : void 0,
 				title: closeLabel,
 				tabIndex: -1,
 				"data-tab-close": true,

package/dist/Tabs/Tab.d.cts

@@ -1,5 +1,5 @@
-import { W as Theme } from "../index-DJ0f69wh.cjs";
-import { t as TabValue } from "../TabsContext-B_XHbjcS.cjs";
+import { nt as Theme } from "../index-XN4-ZqTB.cjs";
+import { t as TabValue } from "../TabsContext-BYeGjSZK.cjs";
 import { ElementType, MouseEvent, ReactNode } from "react";
 //#region src/Tabs/Tab/Tab.d.ts
 /** Where `icon` sits around a tab's label. */

package/dist/Tabs/Tab.d.mts

@@ -1,5 +1,5 @@
-import { W as Theme } from "../index-CJhK7JND.mjs";
-import { t as TabValue } from "../TabsContext-Dn2kqUwr.mjs";
+import { nt as Theme } from "../index-CRQ7XLri.mjs";
+import { t as TabValue } from "../TabsContext-D4YumTfD.mjs";
 import { ElementType, MouseEvent, ReactNode } from "react";
 //#region src/Tabs/Tab/Tab.d.ts
 /** Where `icon` sits around a tab's label. */

package/dist/Tabs/Tab.mjs

@@ -1,6 +1,6 @@
 import { a as src_exports, o as styled, t as createShouldForwardProp } from "../src-DLGYOJMh.mjs";
-import { n as useDefaultProps } from "../theme-Z9_QludW.mjs";
-import { t as Icon } from "../Icon-BihOAP4u.mjs";
+import { n as useDefaultProps } from "../theme-oBfFhJm9.mjs";
+import { t as Icon } from "../Icon-0hPpk-WZ.mjs";
 import { i as TabIndexContext, n as getDividerShadow, o as useTabsContext } from "../dividerLine-FahY-M6_.mjs";
 import { useContext } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -22,7 +22,8 @@ const shouldForwardProp = createShouldForwardProp([
 	"borderRadius",
 	"lineColor",
 	"rowPaddingTop",
-	"rowPaddingBottom"
+	"rowPaddingBottom",
+	"isAnnounced"
 ]);
 const getEnclosedEdgeStyle = (theme, main, lineMain, isSelected, isVertical, hasDivider, radius) => {
 	const thin = theme.borderWidths.thin;
@@ -84,7 +85,10 @@ const TabRoot = styled("div", {
 		...variant === "enclosed" && getEnclosedEdgeStyle(theme, main, (0, src_exports.get)(theme, `palette.${lineColor}.main`), isSelected, isVertical, hasDivider, String(radius)),
 		transition: "background-color 0.12s ease",
 		...isDisabled ? {} : { "&:hover": { backgroundColor: isBoxed ? raised : `${main}14` } },
-		"&:hover [data-tab-close]": { visibility: "visible" }
+		"&:hover [data-tab-close]": {
+			visibility: "visible",
+			opacity: 1
+		}
 	};
 });
 const TabLabel = styled("button", {
@@ -146,7 +150,7 @@ const TabClose = styled("button", {
 	slot: "close",
 	label: "TabClose",
 	shouldForwardProp
-})(({ theme, color, isSelected }) => {
+})(({ theme, color, isSelected, isAnnounced }) => {
 	const main = (0, src_exports.get)(theme, `palette.${color}.main`);
 	return {
 		appearance: "none",
@@ -163,7 +167,10 @@ const TabClose = styled("button", {
 		backgroundColor: "transparent",
 		color: "inherit",
 		cursor: "pointer",
-		visibility: isSelected ? "visible" : "hidden",
+		...isAnnounced ? {
+			opacity: isSelected ? 1 : 0,
+			"&:focus-visible": { opacity: 1 }
+		} : { visibility: isSelected ? "visible" : "hidden" },
 		"&:hover": { backgroundColor: `${main}1F` }
 	};
 });
@@ -285,7 +292,9 @@ function Tab({ value: valueProp, label, icon, iconPosition = "top", isWrapped: i
 			secondaryAction != null && /* @__PURE__ */ jsx(SecondaryActionSlot, { children: secondaryAction }),
 			isClosable && /* @__PURE__ */ jsx(TabClose, {
 				type: "button",
-				"aria-hidden": true,
+				isAnnounced: tabs.shouldAnnounceClose,
+				"aria-hidden": tabs.shouldAnnounceClose ? void 0 : true,
+				"aria-label": tabs.shouldAnnounceClose ? closeLabel : void 0,
 				title: closeLabel,
 				tabIndex: -1,
 				"data-tab-close": true,

package/dist/Tabs/TabContext.d.cts

@@ -1,4 +1,4 @@
-import { t as TabValue } from "../TabsContext-B_XHbjcS.cjs";
+import { t as TabValue } from "../TabsContext-BYeGjSZK.cjs";
 import { ReactNode } from "react";
 //#region src/Tabs/TabContext/TabContext.d.ts
 interface TabContextProps {

package/dist/Tabs/TabContext.d.mts

@@ -1,4 +1,4 @@
-import { t as TabValue } from "../TabsContext-Dn2kqUwr.mjs";
+import { t as TabValue } from "../TabsContext-D4YumTfD.mjs";
 import { ReactNode } from "react";
 //#region src/Tabs/TabContext/TabContext.d.ts
 interface TabContextProps {

package/dist/Tabs/TabList.cjs

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_TabsValueContext = require("../TabsValueContext-D40zGCpE.cjs");
-const require_Tabs = require("../Tabs-D4tWCq78.cjs");
+const require_Tabs = require("../Tabs-Croeq9s2.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/Tabs/TabList/TabList.tsx

package/dist/Tabs/TabList.d.cts

@@ -1,4 +1,4 @@
-import { a as TabsProps } from "../index-WHFhjfgy.cjs";
+import { a as TabsProps } from "../index-Ebjbrbsk.cjs";
 //#region src/Tabs/TabList/TabList.d.ts
 type TabListProps = Omit<TabsProps, 'value' | 'defaultValue'>;
 /**

package/dist/Tabs/TabList.d.mts

@@ -1,4 +1,4 @@
-import { a as TabsProps } from "../index-bpnLB_4K.mjs";
+import { a as TabsProps } from "../index-D_-DAAE7.mjs";
 //#region src/Tabs/TabList/TabList.d.ts
 type TabListProps = Omit<TabsProps, 'value' | 'defaultValue'>;
 /**

package/dist/Tabs/TabList.mjs

@@ -1,5 +1,5 @@
 import { n as useTabsValue } from "../TabsValueContext-DvL3inf7.mjs";
-import { n as TabListContext, t as Tabs } from "../Tabs-BTNOJx5v.mjs";
+import { n as TabListContext, t as Tabs } from "../Tabs-DMMP5aDj.mjs";
 import { useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/Tabs/TabList/TabList.tsx

package/dist/Tabs/TabPanel.cjs

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_src = require("../src-DU81aGy9.cjs");
-const require_theme = require("../theme-BxXuXRgQ.cjs");
+const require_theme = require("../theme-DzfwuzMZ.cjs");
 const require_TabsValueContext = require("../TabsValueContext-D40zGCpE.cjs");
 const require_surfaceSystem = require("../surfaceSystem-BGQBoXv_.cjs");
 let react_jsx_runtime = require("react/jsx-runtime");

package/dist/Tabs/TabPanel.d.cts

@@ -1,5 +1,5 @@
-import { W as Theme } from "../index-DJ0f69wh.cjs";
-import { t as TabValue } from "../TabsContext-B_XHbjcS.cjs";
+import { nt as Theme } from "../index-XN4-ZqTB.cjs";
+import { t as TabValue } from "../TabsContext-BYeGjSZK.cjs";
 import { ReactNode } from "react";
 import { SpaceProps } from "@soroush.tech/styled-system";
 //#region src/Tabs/TabPanel/TabPanel.d.ts

package/dist/Tabs/TabPanel.d.mts

@@ -1,5 +1,5 @@
-import { W as Theme } from "../index-CJhK7JND.mjs";
-import { t as TabValue } from "../TabsContext-Dn2kqUwr.mjs";
+import { nt as Theme } from "../index-CRQ7XLri.mjs";
+import { t as TabValue } from "../TabsContext-D4YumTfD.mjs";
 import { SpaceProps } from "@soroush.tech/styled-system";
 import { ReactNode } from "react";
 //#region src/Tabs/TabPanel/TabPanel.d.ts

package/dist/Tabs/TabPanel.mjs

@@ -1,5 +1,5 @@
 import { a as src_exports, i as props, o as styled, t as createShouldForwardProp } from "../src-DLGYOJMh.mjs";
-import { n as useDefaultProps } from "../theme-Z9_QludW.mjs";
+import { n as useDefaultProps } from "../theme-oBfFhJm9.mjs";
 import { n as useTabsValue } from "../TabsValueContext-DvL3inf7.mjs";
 import { n as getPanelId, r as getTabId, t as surfaceSystem } from "../surfaceSystem-D8TbmKy3.mjs";
 import { jsx } from "react/jsx-runtime";

package/dist/Tabs/TabScrollButton.cjs

@@ -1,7 +1,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_src = require("../src-DU81aGy9.cjs");
-const require_theme = require("../theme-BxXuXRgQ.cjs");
-const require_Icon = require("../Icon-D-EWsBVg.cjs");
+const require_theme = require("../theme-DzfwuzMZ.cjs");
+const require_Icon = require("../Icon-BE7bRsqR.cjs");
 const require_dividerLine = require("../dividerLine-BNljcGlv.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");

package/dist/Tabs/TabScrollButton.d.cts

@@ -1,2 +1,2 @@
-import { n as TabScrollButtonProps, r as TabScrollDirection, t as TabScrollButton } from "../index-KnXhlKMr.cjs";
+import { n as TabScrollButtonProps, r as TabScrollDirection, t as TabScrollButton } from "../index-BitQk7Hx.cjs";
 export { TabScrollButton, TabScrollButtonProps, TabScrollDirection };

package/dist/Tabs/TabScrollButton.d.mts

@@ -1,2 +1,2 @@
-import { n as TabScrollButtonProps, r as TabScrollDirection, t as TabScrollButton } from "../index-CE5JG1us.mjs";
+import { n as TabScrollButtonProps, r as TabScrollDirection, t as TabScrollButton } from "../index-CyLhEXYB.mjs";
 export { TabScrollButton, TabScrollButtonProps, TabScrollDirection };

package/dist/Tabs/TabScrollButton.mjs

@@ -1,6 +1,6 @@
 import { a as src_exports, o as styled, t as createShouldForwardProp } from "../src-DLGYOJMh.mjs";
-import { n as useDefaultProps, r as useTheme } from "../theme-Z9_QludW.mjs";
-import { t as Icon } from "../Icon-BihOAP4u.mjs";
+import { n as useDefaultProps, r as useTheme } from "../theme-oBfFhJm9.mjs";
+import { t as Icon } from "../Icon-0hPpk-WZ.mjs";
 import { a as TabsContext, r as getEnclosedPieceStyle } from "../dividerLine-FahY-M6_.mjs";
 import { useContext } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/Tabs/Tabs.cjs

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_Tabs = require("../Tabs-D4tWCq78.cjs");
+const require_Tabs = require("../Tabs-Croeq9s2.cjs");
 exports.Tabs = require_Tabs.Tabs;

package/dist/Tabs/Tabs.d.cts

@@ -1,3 +1,3 @@
-import { t as TabValue } from "../TabsContext-B_XHbjcS.cjs";
-import { a as TabsProps, i as TabsOverflowBehavior, n as TabsActions, o as TabsScrollButtons, r as TabsOrientation, s as TabsVariant, t as Tabs } from "../index-WHFhjfgy.cjs";
+import { t as TabValue } from "../TabsContext-BYeGjSZK.cjs";
+import { a as TabsProps, i as TabsOverflowBehavior, n as TabsActions, o as TabsScrollButtons, r as TabsOrientation, s as TabsVariant, t as Tabs } from "../index-Ebjbrbsk.cjs";
 export { type TabValue, Tabs, TabsActions, TabsOrientation, TabsOverflowBehavior, TabsProps, TabsScrollButtons, TabsVariant };

package/dist/Tabs/Tabs.d.mts

@@ -1,3 +1,3 @@
-import { t as TabValue } from "../TabsContext-Dn2kqUwr.mjs";
-import { a as TabsProps, i as TabsOverflowBehavior, n as TabsActions, o as TabsScrollButtons, r as TabsOrientation, s as TabsVariant, t as Tabs } from "../index-bpnLB_4K.mjs";
+import { t as TabValue } from "../TabsContext-D4YumTfD.mjs";
+import { a as TabsProps, i as TabsOverflowBehavior, n as TabsActions, o as TabsScrollButtons, r as TabsOrientation, s as TabsVariant, t as Tabs } from "../index-D_-DAAE7.mjs";
 export { type TabValue, Tabs, TabsActions, TabsOrientation, TabsOverflowBehavior, TabsProps, TabsScrollButtons, TabsVariant };

package/dist/Tabs/Tabs.mjs

@@ -1,2 +1,2 @@
-import { t as Tabs } from "../Tabs-BTNOJx5v.mjs";
+import { t as Tabs } from "../Tabs-DMMP5aDj.mjs";
 export { Tabs };

package/dist/{Tabs-D4tWCq78.cjs → Tabs-Croeq9s2.cjs}

@@ -1,11 +1,11 @@
 const require_src = require("./src-DU81aGy9.cjs");
-const require_View = require("./View.cjs");
+const require_theme = require("./theme-DzfwuzMZ.cjs");
 const require_themeDefault = require("./themeDefault-Cebi08Cv.cjs");
-const require_theme = require("./theme-BxXuXRgQ.cjs");
-const require_Icon = require("./Icon-D-EWsBVg.cjs");
+const require_Icon = require("./Icon-BE7bRsqR.cjs");
+const require_View = require("./View.cjs");
 const require_isRtl = require("./isRtl-DTkYHRPo.cjs");
-const require_MenuItem = require("./MenuItem-BTP7Ijwi.cjs");
-const require_Menu = require("./Menu-Cgg-sX4W.cjs");
+const require_MenuItem = require("./MenuItem-EJ4u73f0.cjs");
+const require_Menu = require("./Menu-DXLjR9ga.cjs");
 const require_dividerLine = require("./dividerLine-BNljcGlv.cjs");
 const require_Tabs_TabScrollButton = require("./Tabs/TabScrollButton.cjs");
 const require_surfaceSystem = require("./surfaceSystem-BGQBoXv_.cjs");
@@ -373,7 +373,7 @@ const STEP_BY_KEY = {
 * navigation, its current tab marked `aria-current="page"`. Content of the row's own sits
 * before and after the tabs.
 */
-function Tabs({ children, value: valueProp, defaultValue, onChange, onTabClose, as = "div", orientation = "horizontal", variant: variantProp, color: colorProp, textColor, size: sizeProp, fullWidth = false, isCentered = false, shouldSelectOnFocus = false, overflowBehavior = "none", overflowLabel, scrollButtons = "auto", shouldShowScrollButtonsOnMobile = false, hasVisibleScrollbar = false, hasDivider: hasDividerProp, bg, selectedBg: selectedBgProp, slots, startContent, endContent, action, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, id, className, "data-testid": dataTestid, ...spaceProps }) {
+function Tabs({ children, value: valueProp, defaultValue, onChange, onTabClose, shouldAnnounceClose = false, as = "div", orientation = "horizontal", variant: variantProp, color: colorProp, textColor, size: sizeProp, fullWidth = false, isCentered = false, shouldSelectOnFocus = false, overflowBehavior = "none", overflowLabel, scrollButtons = "auto", shouldShowScrollButtonsOnMobile = false, hasVisibleScrollbar = false, hasDivider: hasDividerProp, bg, selectedBg: selectedBgProp, slots, startContent, endContent, action, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, id, className, "data-testid": dataTestid, ...spaceProps }) {
 	const theme = require_theme.useTheme();
 	const dp = require_theme.useDefaultProps("Tabs");
 	const variant = variantProp ?? dp.variant ?? "underline";
@@ -418,6 +418,7 @@ function Tabs({ children, value: valueProp, defaultValue, onChange, onTabClose,
 		focusableValue,
 		select,
 		onTabClose,
+		shouldAnnounceClose,
 		getTabId: (value) => require_surfaceSystem.getTabId(baseId, value),
 		getPanelId: (value) => tabList ? require_surfaceSystem.getPanelId(baseId, value) : void 0,
 		isNavigation,
@@ -440,6 +441,7 @@ function Tabs({ children, value: valueProp, defaultValue, onChange, onTabClose,
 		focusableValue,
 		select,
 		onTabClose,
+		shouldAnnounceClose,
 		baseId,
 		tabList,
 		isNavigation,
@@ -606,10 +608,12 @@ function Tabs({ children, value: valueProp, defaultValue, onChange, onTabClose,
 						children: hiddenTabs.map((tab) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MenuItem.MenuItem, {
 							value: tab.value,
 							disabled: tab.disabled,
+							shouldAnnounceSecondaryAction: shouldAnnounceClose,
 							secondaryAction: tab.closeLabel === void 0 ? void 0 : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(OverflowClose, {
 								type: "button",
 								color: selectedColor,
-								"aria-hidden": true,
+								"aria-hidden": shouldAnnounceClose ? void 0 : true,
+								"aria-label": shouldAnnounceClose ? tab.closeLabel : void 0,
 								title: tab.closeLabel,
 								tabIndex: -1,
 								onClick: () => onTabClose?.(tab.value),

package/dist/{Tabs-BTNOJx5v.mjs → Tabs-DMMP5aDj.mjs}

@@ -1,11 +1,11 @@
 import { a as src_exports, i as props, o as styled, t as createShouldForwardProp } from "./src-DLGYOJMh.mjs";
-import { View } from "./View.mjs";
+import { n as useDefaultProps, r as useTheme } from "./theme-oBfFhJm9.mjs";
 import { t as themeDefault } from "./themeDefault-Z3KmyIbm.mjs";
-import { n as useDefaultProps, r as useTheme } from "./theme-Z9_QludW.mjs";
-import { t as Icon } from "./Icon-BihOAP4u.mjs";
+import { t as Icon } from "./Icon-0hPpk-WZ.mjs";
+import { View } from "./View.mjs";
 import { t as isRtl } from "./isRtl-BJDtm86G.mjs";
-import { t as MenuItem } from "./MenuItem-DUn4IZKK.mjs";
-import { t as Menu } from "./Menu-CrzHc_cn.mjs";
+import { t as MenuItem } from "./MenuItem-C21eR7d6.mjs";
+import { t as Menu } from "./Menu-CnG4ikZd.mjs";
 import { a as TabsContext, i as TabIndexContext, n as getDividerShadow, r as getEnclosedPieceStyle, t as getDividerColor } from "./dividerLine-FahY-M6_.mjs";
 import { TabScrollButton } from "./Tabs/TabScrollButton.mjs";
 import { n as getPanelId, r as getTabId, t as surfaceSystem } from "./surfaceSystem-D8TbmKy3.mjs";
@@ -372,7 +372,7 @@ const STEP_BY_KEY = {
 * navigation, its current tab marked `aria-current="page"`. Content of the row's own sits
 * before and after the tabs.
 */
-function Tabs({ children, value: valueProp, defaultValue, onChange, onTabClose, as = "div", orientation = "horizontal", variant: variantProp, color: colorProp, textColor, size: sizeProp, fullWidth = false, isCentered = false, shouldSelectOnFocus = false, overflowBehavior = "none", overflowLabel, scrollButtons = "auto", shouldShowScrollButtonsOnMobile = false, hasVisibleScrollbar = false, hasDivider: hasDividerProp, bg, selectedBg: selectedBgProp, slots, startContent, endContent, action, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, id, className, "data-testid": dataTestid, ...spaceProps }) {
+function Tabs({ children, value: valueProp, defaultValue, onChange, onTabClose, shouldAnnounceClose = false, as = "div", orientation = "horizontal", variant: variantProp, color: colorProp, textColor, size: sizeProp, fullWidth = false, isCentered = false, shouldSelectOnFocus = false, overflowBehavior = "none", overflowLabel, scrollButtons = "auto", shouldShowScrollButtonsOnMobile = false, hasVisibleScrollbar = false, hasDivider: hasDividerProp, bg, selectedBg: selectedBgProp, slots, startContent, endContent, action, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, id, className, "data-testid": dataTestid, ...spaceProps }) {
 	const theme = useTheme();
 	const dp = useDefaultProps("Tabs");
 	const variant = variantProp ?? dp.variant ?? "underline";
@@ -417,6 +417,7 @@ function Tabs({ children, value: valueProp, defaultValue, onChange, onTabClose,
 		focusableValue,
 		select,
 		onTabClose,
+		shouldAnnounceClose,
 		getTabId: (value) => getTabId(baseId, value),
 		getPanelId: (value) => tabList ? getPanelId(baseId, value) : void 0,
 		isNavigation,
@@ -439,6 +440,7 @@ function Tabs({ children, value: valueProp, defaultValue, onChange, onTabClose,
 		focusableValue,
 		select,
 		onTabClose,
+		shouldAnnounceClose,
 		baseId,
 		tabList,
 		isNavigation,
@@ -605,10 +607,12 @@ function Tabs({ children, value: valueProp, defaultValue, onChange, onTabClose,
 						children: hiddenTabs.map((tab) => /* @__PURE__ */ jsx(MenuItem, {
 							value: tab.value,
 							disabled: tab.disabled,
+							shouldAnnounceSecondaryAction: shouldAnnounceClose,
 							secondaryAction: tab.closeLabel === void 0 ? void 0 : /* @__PURE__ */ jsx(OverflowClose, {
 								type: "button",
 								color: selectedColor,
-								"aria-hidden": true,
+								"aria-hidden": shouldAnnounceClose ? void 0 : true,
+								"aria-label": shouldAnnounceClose ? tab.closeLabel : void 0,
 								title: tab.closeLabel,
 								tabIndex: -1,
 								onClick: () => onTabClose?.(tab.value),

package/dist/Tabs.cjs

@@ -2,7 +2,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_Tabs_Tab = require("./Tabs/Tab.cjs");
 const require_Tabs_TabContext = require("./Tabs/TabContext.cjs");
 const require_Tabs_TabScrollButton = require("./Tabs/TabScrollButton.cjs");
-const require_Tabs = require("./Tabs-D4tWCq78.cjs");
+const require_Tabs = require("./Tabs-Croeq9s2.cjs");
 const require_Tabs_TabList = require("./Tabs/TabList.cjs");
 const require_Tabs_TabPanel = require("./Tabs/TabPanel.cjs");
 exports.Tab = require_Tabs_Tab.Tab;

package/dist/Tabs.d.cts

@@ -1,8 +1,8 @@
-import { t as TabValue } from "./TabsContext-B_XHbjcS.cjs";
+import { t as TabValue } from "./TabsContext-BYeGjSZK.cjs";
 import { Tab, TabIconPosition, TabProps } from "./Tabs/Tab.cjs";
 import { TabContext, TabContextProps } from "./Tabs/TabContext.cjs";
-import { n as TabScrollButtonProps, r as TabScrollDirection, t as TabScrollButton } from "./index-KnXhlKMr.cjs";
-import { a as TabsProps, i as TabsOverflowBehavior, n as TabsActions, o as TabsScrollButtons, r as TabsOrientation, s as TabsVariant, t as Tabs } from "./index-WHFhjfgy.cjs";
+import { n as TabScrollButtonProps, r as TabScrollDirection, t as TabScrollButton } from "./index-BitQk7Hx.cjs";
+import { a as TabsProps, i as TabsOverflowBehavior, n as TabsActions, o as TabsScrollButtons, r as TabsOrientation, s as TabsVariant, t as Tabs } from "./index-Ebjbrbsk.cjs";
 import { TabList, TabListProps } from "./Tabs/TabList.cjs";
 import { TabPanel, TabPanelProps } from "./Tabs/TabPanel.cjs";
 export { Tab, TabContext, TabContextProps, TabIconPosition, TabList, TabListProps, TabPanel, TabPanelProps, TabProps, TabScrollButton, TabScrollButtonProps, TabScrollDirection, type TabValue, Tabs, TabsActions, TabsOrientation, TabsOverflowBehavior, TabsProps, TabsScrollButtons, TabsVariant };

package/dist/Tabs.d.mts

@@ -1,8 +1,8 @@
-import { t as TabValue } from "./TabsContext-Dn2kqUwr.mjs";
+import { t as TabValue } from "./TabsContext-D4YumTfD.mjs";
 import { Tab, TabIconPosition, TabProps } from "./Tabs/Tab.mjs";
 import { TabContext, TabContextProps } from "./Tabs/TabContext.mjs";
-import { n as TabScrollButtonProps, r as TabScrollDirection, t as TabScrollButton } from "./index-CE5JG1us.mjs";
-import { a as TabsProps, i as TabsOverflowBehavior, n as TabsActions, o as TabsScrollButtons, r as TabsOrientation, s as TabsVariant, t as Tabs } from "./index-bpnLB_4K.mjs";
+import { n as TabScrollButtonProps, r as TabScrollDirection, t as TabScrollButton } from "./index-CyLhEXYB.mjs";
+import { a as TabsProps, i as TabsOverflowBehavior, n as TabsActions, o as TabsScrollButtons, r as TabsOrientation, s as TabsVariant, t as Tabs } from "./index-D_-DAAE7.mjs";
 import { TabList, TabListProps } from "./Tabs/TabList.mjs";
 import { TabPanel, TabPanelProps } from "./Tabs/TabPanel.mjs";
 export { Tab, TabContext, TabContextProps, TabIconPosition, TabList, TabListProps, TabPanel, TabPanelProps, TabProps, TabScrollButton, TabScrollButtonProps, TabScrollDirection, type TabValue, Tabs, TabsActions, TabsOrientation, TabsOverflowBehavior, TabsProps, TabsScrollButtons, TabsVariant };

package/dist/Tabs.mjs

@@ -1,7 +1,7 @@
 import { Tab } from "./Tabs/Tab.mjs";
 import { TabContext } from "./Tabs/TabContext.mjs";
 import { TabScrollButton } from "./Tabs/TabScrollButton.mjs";
-import { t as Tabs } from "./Tabs-BTNOJx5v.mjs";
+import { t as Tabs } from "./Tabs-DMMP5aDj.mjs";
 import { TabList } from "./Tabs/TabList.mjs";
 import { TabPanel } from "./Tabs/TabPanel.mjs";
 export { Tab, TabContext, TabList, TabPanel, TabScrollButton, Tabs };

package/dist/{TabsContext-B_XHbjcS.d.cts → TabsContext-BYeGjSZK.d.cts}

@@ -1,4 +1,4 @@
-import "./index-DchHf5cF.cjs";
+import "./index-BhnLFsBv.cjs";
 //#region src/Tabs/TabsContext.d.ts
 /** A tab's value: what it is chosen as. A `Tab` without one takes its position. */
 type TabValue = string | number;

package/dist/{TabsContext-Dn2kqUwr.d.mts → TabsContext-D4YumTfD.d.mts}

@@ -1,4 +1,4 @@
-import "./index-h4dYtVrp.mjs";
+import "./index-vBCN6iAz.mjs";
 //#region src/Tabs/TabsContext.d.ts
 /** A tab's value: what it is chosen as. A `Tab` without one takes its position. */
 type TabValue = string | number;

package/dist/TextInput.cjs

@@ -1,9 +1,9 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_src = require("./src-DU81aGy9.cjs");
+const require_theme = require("./theme-DzfwuzMZ.cjs");
 const require_themeDefault = require("./themeDefault-Cebi08Cv.cjs");
-const require_theme = require("./theme-BxXuXRgQ.cjs");
+const require_inputVariantStyles = require("./inputVariantStyles-BUK_62Ra.cjs");
 const require_FormControl = require("./FormControl.cjs");
-const require_inputVariantStyles = require("./inputVariantStyles-BBkkYQtE.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 let _soroush_tech_styled_system_should_forward_prop = require("@soroush.tech/styled-system/should-forward-prop");
@@ -77,18 +77,14 @@ const backgroundStyle = ({ theme, textColor, color = require_themeDefault.themeD
 const colorBorder = ({ theme, color = require_themeDefault.themeDefault(theme, "color", "primary"), error }) => {
 	return { borderColor: error ? (0, require_src.src_exports.get)(theme, "palette.error.main") : (0, require_src.src_exports.get)(theme, `palette.${color}.light`) };
 };
-const focusVisibleRing = ({ theme }) => {
-	return { "&:has(:focus-visible)": {
-		outline: `2px solid ${(0, require_src.src_exports.get)(theme, `palette.${require_themeDefault.themeDefault(theme, "color", "primary")}.main`)}`,
-		outlineOffset: "2px"
-	} };
-};
+const focusVisibleRing = ({ theme, color = require_themeDefault.themeDefault(theme, "color", "primary"), error }) => ({ "&:has(:focus-visible)": require_inputVariantStyles.getFocusRing(theme, color, error) });
 const focusWithinColor = ({ theme, color = require_themeDefault.themeDefault(theme, "color", "primary"), error }) => ({ "&:focus-within": { borderColor: error ? (0, require_src.src_exports.get)(theme, "palette.error.main") : (0, require_src.src_exports.get)(theme, `palette.${color}.main`) } });
 const borderRadiusStyle = ({ variant: v = "default", borderRadius, theme }) => {
 	if (v === "underline" || v === "text" || !borderRadius) return {};
 	return { borderRadius: (0, require_src.src_exports.get)(theme, `radii.${borderRadius}`) };
 };
-const layoutStyles = ({ fullWidth, disabled }) => ({
+const layoutStyles = ({ theme, fullWidth, disabled }) => ({
+	minWidth: require_inputVariantStyles.getInputMinWidth(theme),
 	...fullWidth ? {
 		display: "flex",
 		width: "100%"
@@ -205,14 +201,18 @@ function TextInput({ autoComplete, autoFocus, borderRadius, classes, components,
 	};
 	let inputElement = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledInput, {
 		inputComponent: resolvedInputComponent,
-		inputSize,
+		inputSize: inputSize ?? (resolvedInputComponent ? void 0 : 1),
 		...inputElProps
 	});
 	if (isTextarea) inputElement = isAutoResize ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledAutoResizeTextarea, {
 		...inputElProps,
+		cols: 1,
 		minRows: minRows ?? rows,
 		maxRows
-	}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledTextarea, { ...inputElProps });
+	}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledTextarea, {
+		...inputElProps,
+		cols: 1
+	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TextInputRoot, {
 		as: components?.Root,
 		color,

package/dist/TextInput.d.cts

@@ -1,4 +1,4 @@
-import { W as Theme } from "./index-DJ0f69wh.cjs";
+import { nt as Theme } from "./index-XN4-ZqTB.cjs";
 import { ChangeEventHandler, ElementType, InputHTMLAttributes, TextareaHTMLAttributes } from "react";
 import { LayoutProps, SpaceProps } from "@soroush.tech/styled-system";
 //#region src/TextInput/TextInput.d.ts

package/dist/TextInput.d.mts

@@ -1,4 +1,4 @@
-import { W as Theme } from "./index-CJhK7JND.mjs";
+import { nt as Theme } from "./index-CRQ7XLri.mjs";
 import { LayoutProps, SpaceProps } from "@soroush.tech/styled-system";
 import { ChangeEventHandler, ElementType, InputHTMLAttributes, TextareaHTMLAttributes } from "react";
 //#region src/TextInput/TextInput.d.ts