@soroush.tech/design-system 1.0.0 → 1.1.0

package/dist/Icon.cjs

@@ -1,4 +1,4 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_Icon = require("./Icon-zsHe7hWR.cjs");
+const require_Icon = require("./Icon-BOjk5r39.cjs");
 exports.Icon = require_Icon.Icon;
 exports.icons = require_Icon.icons;

package/dist/Icon.d.cts

@@ -1,2 +1,2 @@
-import { i as icons, n as IconProps, r as IconName, t as Icon } from "./index-DN7IvJeV.cjs";
+import { i as icons, n as IconProps, r as IconName, t as Icon } from "./index-CA_X-mXg.cjs";
 export { Icon, type IconName, IconProps, icons };

package/dist/Icon.d.mts

@@ -1,2 +1,2 @@
-import { i as icons, n as IconProps, r as IconName, t as Icon } from "./index-D0x1ZMVG.mjs";
+import { i as icons, n as IconProps, r as IconName, t as Icon } from "./index-BL3jwIQU.mjs";
 export { Icon, type IconName, IconProps, icons };

package/dist/Icon.mjs

@@ -1,2 +1,2 @@
-import { n as icons, t as Icon } from "./Icon-bv8Z38l-.mjs";
+import { n as icons, t as Icon } from "./Icon-CYjD0Bad.mjs";
 export { Icon, icons };

package/dist/Image.d.cts

@@ -1,5 +1,5 @@
-import { r as index_d_exports } from "./index-BVX_Jq2G.cjs";
-import { m as Theme } from "./themes-BTGww2YK.cjs";
+import { r as index_d_exports } from "./index-DLJ-li1B.cjs";
+import { h as Theme } from "./themes-CUV79qWU.cjs";
 import { CSSProperties, ImgHTMLAttributes } from "react";
 //#region src/Image/Image.d.ts
 interface ImageProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, 'height' | 'width' | 'color'>, index_d_exports.LayoutProps, index_d_exports.SpaceProps, index_d_exports.BackgroundProps, index_d_exports.PositionProps {

package/dist/Image.d.mts

@@ -1,5 +1,5 @@
-import { m as Theme } from "./themes-BTGww2YK.mjs";
-import { r as index_d_exports } from "./index-B66h9kbP.mjs";
+import { h as Theme } from "./themes-CUV79qWU.mjs";
+import { r as index_d_exports } from "./index-D8b5OCLe.mjs";
 import { CSSProperties, ImgHTMLAttributes } from "react";
 //#region src/Image/Image.d.ts
 interface ImageProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, 'height' | 'width' | 'color'>, index_d_exports.LayoutProps, index_d_exports.SpaceProps, index_d_exports.BackgroundProps, index_d_exports.PositionProps {

package/dist/LinearProgress.d.cts

@@ -1,6 +1,6 @@
-import { r as index_d_exports } from "./index-BVX_Jq2G.cjs";
-import { m as Theme } from "./themes-BTGww2YK.cjs";
-import { n as ButtonColor } from "./index-BnCp6k4s.cjs";
+import { r as index_d_exports } from "./index-DLJ-li1B.cjs";
+import { h as Theme } from "./themes-CUV79qWU.cjs";
+import { n as ButtonColor } from "./index-BJ8OC_Zh.cjs";
 import { HTMLAttributes } from "react";
 //#region src/LinearProgress/LinearProgress.d.ts
 type LinearProgressVariant = 'indeterminate' | 'determinate' | 'query';

package/dist/LinearProgress.d.mts

@@ -1,6 +1,6 @@
-import { m as Theme } from "./themes-BTGww2YK.mjs";
-import { r as index_d_exports } from "./index-B66h9kbP.mjs";
-import { n as ButtonColor } from "./index-CLCtvcKA.mjs";
+import { h as Theme } from "./themes-CUV79qWU.mjs";
+import { r as index_d_exports } from "./index-D8b5OCLe.mjs";
+import { n as ButtonColor } from "./index-D8U2tk1L.mjs";
 import { HTMLAttributes } from "react";
 //#region src/LinearProgress/LinearProgress.d.ts
 type LinearProgressVariant = 'indeterminate' | 'determinate' | 'query';

package/dist/Link.cjs

@@ -30,10 +30,6 @@ const underlineStyles = {
 		}
 	}
 };
-const linkGapSystem = (0, require_src.src_exports.system)({ gap: {
-	property: "gap",
-	scale: "space"
-} });
 const LinkBase = require_src.styled(require_Typography.Typography, {
 	name: "Link",
 	label: "Link",
@@ -45,7 +41,7 @@ const LinkBase = require_src.styled(require_Typography.Typography, {
 		outlineOffset: "4px",
 		borderRadius: theme.radii.sm
 	}
-}), linkGapSystem);
+}));
 function Link({ underline: underlineProp, color, variant = "inherit", target, rel, ...rest }) {
 	const theme = require_theme.useTheme();
 	const underline = underlineProp ?? require_themeDefault.themeDefault(theme, "linkUnderline", "always");

package/dist/Link.d.cts

@@ -1,10 +1,9 @@
-import { a as TypographyProps } from "./index-BLnOsdgc.cjs";
+import { a as TypographyProps } from "./index-CvaEVk-f.cjs";
 import { AnchorHTMLAttributes } from "react";
 //#region src/Link/Link.d.ts
 type LinkUnderline = 'always' | 'hover' | 'none';
 interface LinkProps extends Omit<TypographyProps, 'as'>, Omit<AnchorHTMLAttributes<HTMLAnchorElement>, keyof Omit<TypographyProps, 'as'>> {
   underline?: LinkUnderline;
-  gap?: number | string;
 }
 declare function Link({ underline: underlineProp, color, variant, target, rel, ...rest }: Readonly<LinkProps>): import("react").JSX.Element;
 //#endregion

package/dist/Link.d.mts

@@ -1,10 +1,9 @@
-import { a as TypographyProps } from "./index-BF2KXGBM.mjs";
+import { a as TypographyProps } from "./index-B2hrssyF.mjs";
 import { AnchorHTMLAttributes } from "react";
 //#region src/Link/Link.d.ts
 type LinkUnderline = 'always' | 'hover' | 'none';
 interface LinkProps extends Omit<TypographyProps, 'as'>, Omit<AnchorHTMLAttributes<HTMLAnchorElement>, keyof Omit<TypographyProps, 'as'>> {
   underline?: LinkUnderline;
-  gap?: number | string;
 }
 declare function Link({ underline: underlineProp, color, variant, target, rel, ...rest }: Readonly<LinkProps>): import("react").JSX.Element;
 //#endregion

package/dist/Link.mjs

@@ -1,4 +1,4 @@
-import { a as src_exports, o as styled } from "./src-BJy4dM4f.mjs";
+import { o as styled } from "./src-BJy4dM4f.mjs";
 import { t as themeDefault } from "./themeDefault-Z3KmyIbm.mjs";
 import { r as useTheme } from "./theme-V6lYzd3j.mjs";
 import { Typography } from "./Typography.mjs";
@@ -29,10 +29,6 @@ const underlineStyles = {
 		}
 	}
 };
-const linkGapSystem = (0, src_exports.system)({ gap: {
-	property: "gap",
-	scale: "space"
-} });
 const LinkBase = styled(Typography, {
 	name: "Link",
 	label: "Link",
@@ -44,7 +40,7 @@ const LinkBase = styled(Typography, {
 		outlineOffset: "4px",
 		borderRadius: theme.radii.sm
 	}
-}), linkGapSystem);
+}));
 function Link({ underline: underlineProp, color, variant = "inherit", target, rel, ...rest }) {
 	const theme = useTheme();
 	const underline = underlineProp ?? themeDefault(theme, "linkUnderline", "always");

package/dist/MenuItem.cjs

@@ -2,7 +2,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_src = require("./src-C8PIppTy.cjs");
 const require_themeDefault = require("./themeDefault-Cebi08Cv.cjs");
 const require_theme = require("./theme-Du6xgPsg.cjs");
-const require_Icon = require("./Icon-zsHe7hWR.cjs");
+const require_Icon = require("./Icon-BOjk5r39.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/MenuItem/MenuItem.tsx

package/dist/MenuItem.d.cts

@@ -1,5 +1,5 @@
-import "./index-BVX_Jq2G.cjs";
-import { m as Theme } from "./themes-BTGww2YK.cjs";
+import "./index-DLJ-li1B.cjs";
+import { h as Theme } from "./themes-CUV79qWU.cjs";
 import { ElementType, ReactNode } from "react";
 //#region src/MenuItem/MenuItem.d.ts
 type MenuItemColor = keyof Theme['palette'];

package/dist/MenuItem.d.mts

@@ -1,5 +1,5 @@
-import { m as Theme } from "./themes-BTGww2YK.mjs";
-import "./index-B66h9kbP.mjs";
+import { h as Theme } from "./themes-CUV79qWU.mjs";
+import "./index-D8b5OCLe.mjs";
 import { ElementType, ReactNode } from "react";
 //#region src/MenuItem/MenuItem.d.ts
 type MenuItemColor = keyof Theme['palette'];

package/dist/MenuItem.mjs

@@ -1,7 +1,7 @@
 import { a as src_exports, o as styled, t as createShouldForwardProp } from "./src-BJy4dM4f.mjs";
 import { t as themeDefault } from "./themeDefault-Z3KmyIbm.mjs";
 import { r as useTheme } from "./theme-V6lYzd3j.mjs";
-import { t as Icon } from "./Icon-bv8Z38l-.mjs";
+import { t as Icon } from "./Icon-CYjD0Bad.mjs";
 import { useEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/MenuItem/MenuItem.tsx

package/dist/Modal.d.cts

@@ -1,2 +1,2 @@
-import { a as Modal, c as ModalCloseReason, d as useModal, i as ariaHidden, l as UseModalParameters, n as ManagedModalProps, o as ModalProps, r as ModalManager, s as ModalScroll, t as ManagedModal, u as UseModalReturnValue } from "./index-DdFxl06Q.cjs";
+import { a as Modal, c as ModalCloseReason, d as useModal, i as ariaHidden, l as UseModalParameters, n as ManagedModalProps, o as ModalProps, r as ModalManager, s as ModalScroll, t as ManagedModal, u as UseModalReturnValue } from "./index-BfpjEqqt.cjs";
 export { ManagedModal, ManagedModalProps, Modal, ModalCloseReason, ModalManager, ModalProps, ModalScroll, UseModalParameters, UseModalReturnValue, ariaHidden, useModal };

package/dist/Modal.d.mts

@@ -1,2 +1,2 @@
-import { a as Modal, c as ModalCloseReason, d as useModal, i as ariaHidden, l as UseModalParameters, n as ManagedModalProps, o as ModalProps, r as ModalManager, s as ModalScroll, t as ManagedModal, u as UseModalReturnValue } from "./index-BpLv6Y8m.mjs";
+import { a as Modal, c as ModalCloseReason, d as useModal, i as ariaHidden, l as UseModalParameters, n as ManagedModalProps, o as ModalProps, r as ModalManager, s as ModalScroll, t as ManagedModal, u as UseModalReturnValue } from "./index-Ds__py2h.mjs";
 export { ManagedModal, ManagedModalProps, Modal, ModalCloseReason, ModalManager, ModalProps, ModalScroll, UseModalParameters, UseModalReturnValue, ariaHidden, useModal };

package/dist/NativeSelect.cjs

@@ -2,7 +2,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_src = require("./src-C8PIppTy.cjs");
 const require_themeDefault = require("./themeDefault-Cebi08Cv.cjs");
 const require_theme = require("./theme-Du6xgPsg.cjs");
-const require_Icon = require("./Icon-zsHe7hWR.cjs");
+const require_Icon = require("./Icon-BOjk5r39.cjs");
 const require_FormControl = require("./FormControl.cjs");
 const require_inputVariantStyles = require("./inputVariantStyles-BBkkYQtE.cjs");
 require("react");

package/dist/NativeSelect.d.cts

@@ -1,6 +1,6 @@
-import { r as index_d_exports } from "./index-BVX_Jq2G.cjs";
-import { m as Theme } from "./themes-BTGww2YK.cjs";
-import { n as IconProps, r as IconName } from "./index-DN7IvJeV.cjs";
+import { r as index_d_exports } from "./index-DLJ-li1B.cjs";
+import { h as Theme } from "./themes-CUV79qWU.cjs";
+import { n as IconProps, r as IconName } from "./index-CA_X-mXg.cjs";
 import { SelectHTMLAttributes } from "react";
 //#region src/NativeSelect/NativeSelect.d.ts
 type NativeSelectColor = keyof Theme['palette'];

package/dist/NativeSelect.d.mts

@@ -1,6 +1,6 @@
-import { m as Theme } from "./themes-BTGww2YK.mjs";
-import { r as index_d_exports } from "./index-B66h9kbP.mjs";
-import { n as IconProps, r as IconName } from "./index-D0x1ZMVG.mjs";
+import { h as Theme } from "./themes-CUV79qWU.mjs";
+import { r as index_d_exports } from "./index-D8b5OCLe.mjs";
+import { n as IconProps, r as IconName } from "./index-BL3jwIQU.mjs";
 import { SelectHTMLAttributes } from "react";
 //#region src/NativeSelect/NativeSelect.d.ts
 type NativeSelectColor = keyof Theme['palette'];

package/dist/NativeSelect.mjs

@@ -1,7 +1,7 @@
 import { a as src_exports, i as props, o as styled, t as createShouldForwardProp } from "./src-BJy4dM4f.mjs";
 import { t as themeDefault } from "./themeDefault-Z3KmyIbm.mjs";
 import { r as useTheme } from "./theme-V6lYzd3j.mjs";
-import { t as Icon } from "./Icon-bv8Z38l-.mjs";
+import { t as Icon } from "./Icon-CYjD0Bad.mjs";
 import { useFormControl } from "./FormControl.mjs";
 import { t as inputVariantStyles } from "./inputVariantStyles-CcqpGfuP.mjs";
 import "react";

package/dist/Pagination/PaginationItem.cjs

@@ -2,7 +2,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_src = require("../src-C8PIppTy.cjs");
 const require_themeDefault = require("../themeDefault-Cebi08Cv.cjs");
 const require_utils = require("../utils.cjs");
-const require_Icon = require("../Icon-zsHe7hWR.cjs");
+const require_Icon = require("../Icon-BOjk5r39.cjs");
 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");

package/dist/Pagination/PaginationItem.d.cts

@@ -1,2 +1,2 @@
-import { a as PaginationItemSize, i as PaginationItemShape, n as PaginationItemColor, o as PaginationItemVariant, r as PaginationItemProps, t as PaginationItem } from "../index-BGWm4HKR.cjs";
+import { a as PaginationItemSize, i as PaginationItemShape, n as PaginationItemColor, o as PaginationItemVariant, r as PaginationItemProps, t as PaginationItem } from "../index-yr4HkKOj.cjs";
 export { PaginationItem, PaginationItemColor, PaginationItemProps, PaginationItemShape, PaginationItemSize, PaginationItemVariant };

package/dist/Pagination/PaginationItem.d.mts

@@ -1,2 +1,2 @@
-import { a as PaginationItemSize, i as PaginationItemShape, n as PaginationItemColor, o as PaginationItemVariant, r as PaginationItemProps, t as PaginationItem } from "../index-ypEBcdCx.mjs";
+import { a as PaginationItemSize, i as PaginationItemShape, n as PaginationItemColor, o as PaginationItemVariant, r as PaginationItemProps, t as PaginationItem } from "../index-BwUnDd9W.mjs";
 export { PaginationItem, PaginationItemColor, PaginationItemProps, PaginationItemShape, PaginationItemSize, PaginationItemVariant };

package/dist/Pagination/PaginationItem.mjs

@@ -1,7 +1,7 @@
 import { a as src_exports, i as props, o as styled, t as createShouldForwardProp } from "../src-BJy4dM4f.mjs";
 import { t as themeDefault } from "../themeDefault-Z3KmyIbm.mjs";
 import { alpha } from "../utils.mjs";
-import { t as Icon } from "../Icon-bv8Z38l-.mjs";
+import { t as Icon } from "../Icon-CYjD0Bad.mjs";
 import "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/Pagination/PaginationItem/PaginationItem.tsx

package/dist/Pagination.d.cts

@@ -1,3 +1,3 @@
-import { a as PaginationItemSize, c as UsePaginationItem, i as PaginationItemShape, l as UsePaginationProps, n as PaginationItemColor, o as PaginationItemVariant, r as PaginationItemProps, s as PaginationItemType, t as PaginationItem, u as usePagination } from "./index-BGWm4HKR.cjs";
-import { a as PaginationSize, i as PaginationShape, n as PaginationColor, o as PaginationVariant, r as PaginationProps, t as Pagination } from "./index-C-UBdWKI.cjs";
+import { a as PaginationItemSize, c as UsePaginationItem, i as PaginationItemShape, l as UsePaginationProps, n as PaginationItemColor, o as PaginationItemVariant, r as PaginationItemProps, s as PaginationItemType, t as PaginationItem, u as usePagination } from "./index-yr4HkKOj.cjs";
+import { a as PaginationSize, i as PaginationShape, n as PaginationColor, o as PaginationVariant, r as PaginationProps, t as Pagination } from "./index-B3FrhO2r.cjs";
 export { Pagination, PaginationColor, PaginationItem, PaginationItemColor, PaginationItemProps, PaginationItemShape, PaginationItemSize, PaginationItemType, PaginationItemVariant, PaginationProps, PaginationShape, PaginationSize, PaginationVariant, UsePaginationItem, UsePaginationProps, usePagination };

package/dist/Pagination.d.mts

@@ -1,3 +1,3 @@
-import { a as PaginationItemSize, c as UsePaginationItem, i as PaginationItemShape, l as UsePaginationProps, n as PaginationItemColor, o as PaginationItemVariant, r as PaginationItemProps, s as PaginationItemType, t as PaginationItem, u as usePagination } from "./index-ypEBcdCx.mjs";
-import { a as PaginationSize, i as PaginationShape, n as PaginationColor, o as PaginationVariant, r as PaginationProps, t as Pagination } from "./index-DitJ7ss0.mjs";
+import { a as PaginationItemSize, c as UsePaginationItem, i as PaginationItemShape, l as UsePaginationProps, n as PaginationItemColor, o as PaginationItemVariant, r as PaginationItemProps, s as PaginationItemType, t as PaginationItem, u as usePagination } from "./index-BwUnDd9W.mjs";
+import { a as PaginationSize, i as PaginationShape, n as PaginationColor, o as PaginationVariant, r as PaginationProps, t as Pagination } from "./index-Ca0Pj5m2.mjs";
 export { Pagination, PaginationColor, PaginationItem, PaginationItemColor, PaginationItemProps, PaginationItemShape, PaginationItemSize, PaginationItemType, PaginationItemVariant, PaginationProps, PaginationShape, PaginationSize, PaginationVariant, UsePaginationItem, UsePaginationProps, usePagination };

package/dist/Paper.cjs

@@ -8,7 +8,6 @@ let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/Paper/Paper.tsx
 const shouldForwardProp = (0, require("@soroush.tech/styled-system/should-forward-prop").createShouldForwardProp)([
 	"elevation",
-	"aspectRatio",
 	"transition",
 	"borderColor",
 	"borderWidth",
@@ -19,7 +18,6 @@ const paperSystem = (0, require_src.src_exports.system)({
 		property: "boxShadow",
 		scale: "shadows"
 	},
-	aspectRatio: { property: "aspectRatio" },
 	transition: { property: "transition" },
 	borderColor: {
 		property: "borderColor",

package/dist/Paper.d.cts

@@ -1,2 +1,2 @@
-import { n as PaperElevation, r as PaperProps, t as Paper } from "./index-HnvGdPCp.cjs";
+import { n as PaperElevation, r as PaperProps, t as Paper } from "./index-CYTaYcm3.cjs";
 export { Paper, PaperElevation, PaperProps };

package/dist/Paper.d.mts

@@ -1,2 +1,2 @@
-import { n as PaperElevation, r as PaperProps, t as Paper } from "./index-DLiHZtDi.mjs";
+import { n as PaperElevation, r as PaperProps, t as Paper } from "./index-KZUd8B5E.mjs";
 export { Paper, PaperElevation, PaperProps };

package/dist/Paper.mjs

@@ -7,7 +7,6 @@ import { jsx } from "react/jsx-runtime";
 //#region src/Paper/Paper.tsx
 const shouldForwardProp = createShouldForwardProp([
 	"elevation",
-	"aspectRatio",
 	"transition",
 	"borderColor",
 	"borderWidth",
@@ -18,7 +17,6 @@ const paperSystem = (0, src_exports.system)({
 		property: "boxShadow",
 		scale: "shadows"
 	},
-	aspectRatio: { property: "aspectRatio" },
 	transition: { property: "transition" },
 	borderColor: {
 		property: "borderColor",

package/dist/Popover.d.cts

@@ -1,7 +1,7 @@
-import "./index-BVX_Jq2G.cjs";
-import { m as Theme } from "./themes-BTGww2YK.cjs";
-import { n as PaperElevation, r as PaperProps } from "./index-HnvGdPCp.cjs";
-import { c as ModalCloseReason } from "./index-DdFxl06Q.cjs";
+import "./index-DLJ-li1B.cjs";
+import { h as Theme } from "./themes-CUV79qWU.cjs";
+import { n as PaperElevation, r as PaperProps } from "./index-CYTaYcm3.cjs";
+import { c as ModalCloseReason } from "./index-BfpjEqqt.cjs";
 import { ReactNode, Ref } from "react";
 //#region src/Popover/utils/resolveAnchorEl.d.ts
 type PopoverAnchorEl = HTMLElement | (() => HTMLElement | null) | null;

package/dist/Popover.d.mts

@@ -1,7 +1,7 @@
-import { m as Theme } from "./themes-BTGww2YK.mjs";
-import "./index-B66h9kbP.mjs";
-import { n as PaperElevation, r as PaperProps } from "./index-DLiHZtDi.mjs";
-import { c as ModalCloseReason } from "./index-BpLv6Y8m.mjs";
+import { h as Theme } from "./themes-CUV79qWU.mjs";
+import "./index-D8b5OCLe.mjs";
+import { n as PaperElevation, r as PaperProps } from "./index-KZUd8B5E.mjs";
+import { c as ModalCloseReason } from "./index-Ds__py2h.mjs";
 import { ReactNode, Ref } from "react";
 //#region src/Popover/utils/resolveAnchorEl.d.ts
 type PopoverAnchorEl = HTMLElement | (() => HTMLElement | null) | null;

package/dist/Pressable.cjs

@@ -0,0 +1,123 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_src = require("./src-C8PIppTy.cjs");
+const require_themeDefault = require("./themeDefault-Cebi08Cv.cjs");
+const require_utils = require("./utils.cjs");
+const require_theme = require("./theme-Du6xgPsg.cjs");
+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");
+//#region src/Pressable/Pressable.tsx
+const shouldForwardProp = (0, _soroush_tech_styled_system_should_forward_prop.createShouldForwardProp)([
+	..._soroush_tech_styled_system_should_forward_prop.props,
+	"feedback",
+	"activeOpacity",
+	"isDisabled"
+]);
+const baseStyles = {
+	appearance: "none",
+	margin: 0,
+	padding: 0,
+	border: "none",
+	borderRadius: 0,
+	backgroundColor: "transparent",
+	color: "inherit",
+	font: "inherit",
+	textAlign: "inherit",
+	textDecoration: "none",
+	outline: "none",
+	cursor: "pointer",
+	display: "inline-flex",
+	userSelect: "none",
+	transition: "background-color 0.15s ease, opacity 0.15s ease",
+	"&:disabled, &[aria-disabled=\"true\"]": { cursor: "not-allowed" }
+};
+const feedbackStyles = ({ theme, feedback, color, activeOpacity, isDisabled }) => {
+	if (isDisabled || feedback === "none") return {};
+	if (feedback === "opacity") return { "&:active": { opacity: activeOpacity } };
+	return { "&:active": { backgroundColor: require_utils.alpha(theme.palette[color].main, .125) } };
+};
+const focusVisibleStyles = ({ theme }) => ({ "&:focus-visible": {
+	outline: `2px solid ${theme.palette[require_themeDefault.themeDefault(theme, "color", "primary")].main}`,
+	outlineOffset: "2px"
+} });
+const PressableRoot = require_src.styled("div", {
+	name: "Pressable",
+	label: "Pressable",
+	shouldForwardProp,
+	systemProps: [
+		require_src.src_exports.space,
+		require_src.src_exports.layout,
+		require_src.src_exports.typography,
+		require_src.src_exports.border
+	]
+})(baseStyles, feedbackStyles, focusVisibleStyles);
+/**
+* An unstyled clickable surface — button semantics (keyboard activation, focus
+* ring, disabled state) with none of a button's looks, so it can wrap arbitrary
+* content without changing its layout. Use it instead of an `onClick` on a
+* `div`, which no keyboard or screen-reader user can reach.
+*
+* It renders a `div` by default, because `<button>` may not legally contain a
+* link, another button, or block-level content — the shim gives that div a
+* `role`, a tab stop, and Enter/Space activation, so it is announced and
+* operated as a button either way. Pass `as="button"` for a native button, or
+* `href` for an anchor; both skip the shim and let the browser do the work.
+*
+* `feedback` picks what happens while it is held: nothing (default), the content
+* dims, or the surface tints.
+*/
+function Pressable({ as, feedback, color, activeOpacity, href, type = "button", disabled = false, onClick, onKeyDown, onKeyUp, ...rest }) {
+	const theme = require_theme.useTheme();
+	const dp = require_theme.useDefaultProps("Pressable");
+	const resolvedFeedback = feedback ?? dp.feedback ?? "none";
+	const resolvedColor = color ?? dp.color ?? require_themeDefault.themeDefault(theme, "color", "primary");
+	const resolvedActiveOpacity = activeOpacity ?? dp.activeOpacity ?? .7;
+	const element = as ?? (href == null ? "div" : "a");
+	const isButton = element === "button";
+	const needsShim = !isButton && element !== "a";
+	const activate = (event) => {
+		event.preventDefault();
+		event.currentTarget.click();
+	};
+	const handleClick = (event) => {
+		if (disabled) {
+			event.preventDefault();
+			return;
+		}
+		onClick?.(event);
+	};
+	const handleKeyDown = (event) => {
+		onKeyDown?.(event);
+		if (disabled) return;
+		if (event.key === "Enter") activate(event);
+		else if (event.key === " ") event.preventDefault();
+	};
+	const handleKeyUp = (event) => {
+		onKeyUp?.(event);
+		if (!disabled && event.key === " ") activate(event);
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PressableRoot, {
+		as: element,
+		href,
+		type: isButton ? type : void 0,
+		disabled: isButton ? disabled : void 0,
+		feedback: resolvedFeedback,
+		color: resolvedColor,
+		activeOpacity: resolvedActiveOpacity,
+		isDisabled: disabled,
+		onClick: handleClick,
+		...needsShim ? {
+			role: "button",
+			tabIndex: disabled ? -1 : 0,
+			"aria-disabled": disabled || void 0,
+			onKeyDown: handleKeyDown,
+			onKeyUp: handleKeyUp
+		} : {
+			onKeyDown,
+			onKeyUp
+		},
+		...rest
+	});
+}
+//#endregion
+exports.Pressable = Pressable;

package/dist/Pressable.d.cts

@@ -0,0 +1,2 @@
+import { i as PressableProps, n as PressableColor, r as PressableFeedback, t as Pressable } from "./index-dtLxevvf.cjs";
+export { Pressable, PressableColor, PressableFeedback, PressableProps };

package/dist/Pressable.d.mts

@@ -0,0 +1,2 @@
+import { i as PressableProps, n as PressableColor, r as PressableFeedback, t as Pressable } from "./index-CO3Qq0I0.mjs";
+export { Pressable, PressableColor, PressableFeedback, PressableProps };

package/dist/Pressable.mjs

@@ -0,0 +1,121 @@
+import { a as src_exports, i as props, o as styled, t as createShouldForwardProp } from "./src-BJy4dM4f.mjs";
+import { t as themeDefault } from "./themeDefault-Z3KmyIbm.mjs";
+import { alpha } from "./utils.mjs";
+import { n as useDefaultProps, r as useTheme } from "./theme-V6lYzd3j.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/Pressable/Pressable.tsx
+const shouldForwardProp = createShouldForwardProp([
+	...props,
+	"feedback",
+	"activeOpacity",
+	"isDisabled"
+]);
+const baseStyles = {
+	appearance: "none",
+	margin: 0,
+	padding: 0,
+	border: "none",
+	borderRadius: 0,
+	backgroundColor: "transparent",
+	color: "inherit",
+	font: "inherit",
+	textAlign: "inherit",
+	textDecoration: "none",
+	outline: "none",
+	cursor: "pointer",
+	display: "inline-flex",
+	userSelect: "none",
+	transition: "background-color 0.15s ease, opacity 0.15s ease",
+	"&:disabled, &[aria-disabled=\"true\"]": { cursor: "not-allowed" }
+};
+const feedbackStyles = ({ theme, feedback, color, activeOpacity, isDisabled }) => {
+	if (isDisabled || feedback === "none") return {};
+	if (feedback === "opacity") return { "&:active": { opacity: activeOpacity } };
+	return { "&:active": { backgroundColor: alpha(theme.palette[color].main, .125) } };
+};
+const focusVisibleStyles = ({ theme }) => ({ "&:focus-visible": {
+	outline: `2px solid ${theme.palette[themeDefault(theme, "color", "primary")].main}`,
+	outlineOffset: "2px"
+} });
+const PressableRoot = styled("div", {
+	name: "Pressable",
+	label: "Pressable",
+	shouldForwardProp,
+	systemProps: [
+		src_exports.space,
+		src_exports.layout,
+		src_exports.typography,
+		src_exports.border
+	]
+})(baseStyles, feedbackStyles, focusVisibleStyles);
+/**
+* An unstyled clickable surface — button semantics (keyboard activation, focus
+* ring, disabled state) with none of a button's looks, so it can wrap arbitrary
+* content without changing its layout. Use it instead of an `onClick` on a
+* `div`, which no keyboard or screen-reader user can reach.
+*
+* It renders a `div` by default, because `<button>` may not legally contain a
+* link, another button, or block-level content — the shim gives that div a
+* `role`, a tab stop, and Enter/Space activation, so it is announced and
+* operated as a button either way. Pass `as="button"` for a native button, or
+* `href` for an anchor; both skip the shim and let the browser do the work.
+*
+* `feedback` picks what happens while it is held: nothing (default), the content
+* dims, or the surface tints.
+*/
+function Pressable({ as, feedback, color, activeOpacity, href, type = "button", disabled = false, onClick, onKeyDown, onKeyUp, ...rest }) {
+	const theme = useTheme();
+	const dp = useDefaultProps("Pressable");
+	const resolvedFeedback = feedback ?? dp.feedback ?? "none";
+	const resolvedColor = color ?? dp.color ?? themeDefault(theme, "color", "primary");
+	const resolvedActiveOpacity = activeOpacity ?? dp.activeOpacity ?? .7;
+	const element = as ?? (href == null ? "div" : "a");
+	const isButton = element === "button";
+	const needsShim = !isButton && element !== "a";
+	const activate = (event) => {
+		event.preventDefault();
+		event.currentTarget.click();
+	};
+	const handleClick = (event) => {
+		if (disabled) {
+			event.preventDefault();
+			return;
+		}
+		onClick?.(event);
+	};
+	const handleKeyDown = (event) => {
+		onKeyDown?.(event);
+		if (disabled) return;
+		if (event.key === "Enter") activate(event);
+		else if (event.key === " ") event.preventDefault();
+	};
+	const handleKeyUp = (event) => {
+		onKeyUp?.(event);
+		if (!disabled && event.key === " ") activate(event);
+	};
+	return /* @__PURE__ */ jsx(PressableRoot, {
+		as: element,
+		href,
+		type: isButton ? type : void 0,
+		disabled: isButton ? disabled : void 0,
+		feedback: resolvedFeedback,
+		color: resolvedColor,
+		activeOpacity: resolvedActiveOpacity,
+		isDisabled: disabled,
+		onClick: handleClick,
+		...needsShim ? {
+			role: "button",
+			tabIndex: disabled ? -1 : 0,
+			"aria-disabled": disabled || void 0,
+			onKeyDown: handleKeyDown,
+			onKeyUp: handleKeyUp
+		} : {
+			onKeyDown,
+			onKeyUp
+		},
+		...rest
+	});
+}
+//#endregion
+export { Pressable };