@soroush.tech/design-system 0.1.0 → 1.0.0

package/dist/TextInput.mjs

@@ -1,2 +1,227 @@
-import { t as TextInput } from "./TextInput-D_lHYJlL.mjs";
+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 { useFormControl } from "./FormControl.mjs";
+import { t as inputVariantStyles } from "./inputVariantStyles-CcqpGfuP.mjs";
+import { forwardRef, useCallback, useLayoutEffect, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/TextInput/TextAreaAutoResize.tsx
+const adjust = (el, minRows, maxRows) => {
+	const style = getComputedStyle(el);
+	const lineHeight = Number.parseFloat(style.lineHeight) || Number.parseFloat(style.fontSize) * 1.2;
+	const paddingY = Number.parseFloat(style.paddingTop) + Number.parseFloat(style.paddingBottom);
+	el.style.height = "auto";
+	const scrollHeight = el.scrollHeight;
+	const min = minRows == null ? 0 : Number(minRows) * lineHeight + paddingY;
+	const max = maxRows == null ? Infinity : Number(maxRows) * lineHeight + paddingY;
+	el.style.height = `${Math.min(max, Math.max(min, scrollHeight))}px`;
+	el.style.overflow = scrollHeight > max ? "auto" : "hidden";
+};
+const TextAreaAutoResize = forwardRef(function TextAreaAutoResize({ value, onChange, minRows, maxRows, ...rest }, forwardedRef) {
+	const innerRef = useRef(null);
+	const setRef = useCallback((el) => {
+		innerRef.current = el;
+		if (typeof forwardedRef === "function") forwardedRef(el);
+		else if (forwardedRef) forwardedRef.current = el;
+	}, [forwardedRef]);
+	useLayoutEffect(() => {
+		adjust(innerRef.current, minRows, maxRows);
+	}, [
+		value,
+		minRows,
+		maxRows
+	]);
+	return /* @__PURE__ */ jsx("textarea", {
+		ref: setRef,
+		value,
+		onChange: useCallback((e) => {
+			adjust(e.currentTarget, minRows, maxRows);
+			onChange?.(e);
+		}, [
+			onChange,
+			minRows,
+			maxRows
+		]),
+		...rest
+	});
+});
+//#endregion
+//#region src/TextInput/TextInput.tsx
+const shouldForwardProp = createShouldForwardProp([
+	...props,
+	"as",
+	"color",
+	"textColor",
+	"variant",
+	"error",
+	"disabled",
+	"fullWidth"
+]);
+const baseStyle = {
+	display: "inline-flex",
+	alignItems: "center",
+	transition: "border-color 0.15s ease"
+};
+const backgroundStyle = ({ theme, textColor = themeDefault(theme, "accentTextColor", "primary") }) => {
+	return {
+		backgroundColor: (0, src_exports.get)(theme, `background.${themeDefault(theme, "inputBg", "terminal")}`),
+		color: (0, src_exports.get)(theme, `text.${textColor}`),
+		fontFamily: (0, src_exports.get)(theme, "fonts.body"),
+		fontSize: (0, src_exports.get)(theme, "fontSizes.1"),
+		lineHeight: (0, src_exports.get)(theme, "lineHeights.base")
+	};
+};
+const colorBorder = ({ theme, color = themeDefault(theme, "color", "primary"), error }) => {
+	return { borderColor: error ? (0, src_exports.get)(theme, "palette.error.main") : (0, src_exports.get)(theme, `palette.${color}.light`) };
+};
+const focusVisibleRing = ({ theme }) => {
+	return { "&:has(:focus-visible)": {
+		outline: `2px solid ${(0, src_exports.get)(theme, `palette.${themeDefault(theme, "color", "primary")}.main`)}`,
+		outlineOffset: "2px"
+	} };
+};
+const focusWithinColor = ({ theme, color = themeDefault(theme, "color", "primary"), error }) => ({ "&:focus-within": { borderColor: error ? (0, src_exports.get)(theme, "palette.error.main") : (0, src_exports.get)(theme, `palette.${color}.main`) } });
+const borderRadiusStyle = ({ variant: v = "default", borderRadius, theme }) => {
+	if (v === "underline" || v === "text" || !borderRadius) return {};
+	return { borderRadius: (0, src_exports.get)(theme, `radii.${borderRadius}`) };
+};
+const layoutStyles = ({ fullWidth, disabled }) => ({
+	...fullWidth ? {
+		display: "flex",
+		width: "100%"
+	} : {},
+	...disabled ? {
+		opacity: .5,
+		cursor: "not-allowed",
+		pointerEvents: "none"
+	} : {}
+});
+const nativeBaseStyles = {
+	flex: 1,
+	minWidth: 0,
+	width: "100%",
+	border: "none",
+	outline: "none",
+	background: "transparent",
+	color: "inherit",
+	fontFamily: "inherit",
+	lineHeight: "inherit",
+	"&::placeholder": {
+		color: "inherit",
+		opacity: .5
+	},
+	"&:disabled": { cursor: "not-allowed" }
+};
+const textAreaBaseStyles = {
+	resize: "none",
+	overflow: "auto"
+};
+function InputBase({ inputSize, inputComponent, ...props }) {
+	return /* @__PURE__ */ jsx(inputComponent ?? "input", {
+		...props,
+		size: inputSize
+	});
+}
+const widthStyles = (0, src_exports.system)({
+	width: true,
+	minWidth: true,
+	maxWidth: true
+});
+const sizeVariants = ({ theme, size }) => {
+	const s = theme.sizes[size];
+	return {
+		paddingTop: theme.space[s.paddingTop],
+		paddingBottom: theme.space[s.paddingBottom],
+		paddingLeft: theme.space[s.paddingLeft],
+		paddingRight: theme.space[s.paddingRight],
+		fontSize: theme.fontSizes[s.fontSize]
+	};
+};
+const TextInputRoot = styled("div", {
+	name: "TextInput",
+	label: "TextInput",
+	shouldForwardProp,
+	systemProps: [src_exports.space, widthStyles]
+})(baseStyle, inputVariantStyles, borderRadiusStyle, colorBorder, focusWithinColor, focusVisibleRing, backgroundStyle, layoutStyles);
+const StyledInput = styled(InputBase, {
+	name: "TextInput",
+	slot: "input",
+	label: "TextInputInput"
+})(nativeBaseStyles, sizeVariants);
+const shouldForwardInputProps = (prop) => prop !== "size";
+const StyledTextarea = styled("textarea", {
+	name: "TextInput",
+	slot: "input",
+	label: "TextInputTextarea",
+	shouldForwardProp: shouldForwardInputProps
+})(nativeBaseStyles, textAreaBaseStyles, sizeVariants);
+const StyledAutoResizeTextarea = styled(TextAreaAutoResize, {
+	name: "TextInput",
+	slot: "input",
+	label: "TextInputTextarea",
+	shouldForwardProp: shouldForwardInputProps
+})(nativeBaseStyles, textAreaBaseStyles, sizeVariants);
+function TextInput({ autoComplete, autoFocus, borderRadius, classes, components, color: colorProp, textColor: textColorProp, disabled: disabledProp, error: errorProp, fullWidth: fullWidthProp, id: idProp, inputComponent, inputProps, inputSize, maxRows, minRows, multiline = false, name, onChange, placeholder, readOnly, required: requiredProp, resize = false, rows, size: sizeProp, type = "text", value, variant: variantProp, className, "data-testid": dataTestid, ...spaceProps }) {
+	const fc = useFormControl({
+		id: idProp,
+		error: errorProp,
+		disabled: disabledProp,
+		required: requiredProp,
+		size: sizeProp,
+		fullWidth: fullWidthProp,
+		color: colorProp,
+		textColor: textColorProp
+	});
+	const { id, error, disabled, required, size, fullWidth } = fc;
+	const theme = useTheme();
+	const color = fc.color ?? themeDefault(theme, "color", "primary");
+	const textColor = fc.textColor ?? themeDefault(theme, "accentTextColor", "primary");
+	const variant = variantProp ?? themeDefault(theme, "inputVariant", "default");
+	const isAutoResize = resize;
+	const isMultiline = multiline || rows !== void 0 && Number(rows) > 1;
+	const isTextarea = (isAutoResize || isMultiline) && (!type || type === "text");
+	const rootClassName = [className, classes?.root].filter(Boolean).join(" ") || void 0;
+	const resolvedInputComponent = inputComponent ?? components?.Input;
+	const inputElProps = {
+		...inputProps,
+		id,
+		name,
+		disabled,
+		required,
+		autoComplete,
+		autoFocus,
+		placeholder,
+		readOnly,
+		onChange,
+		value,
+		className: classes?.input,
+		type: isTextarea ? void 0 : type,
+		rows: isMultiline && rows !== void 0 ? Number(rows) : void 0,
+		size,
+		"aria-describedby": inputProps?.["aria-describedby"] ?? fc["aria-describedby"]
+	};
+	return /* @__PURE__ */ jsx(TextInputRoot, {
+		as: components?.Root,
+		color,
+		textColor,
+		variant,
+		error,
+		disabled,
+		fullWidth,
+		borderRadius,
+		className: rootClassName,
+		"data-testid": dataTestid,
+		...spaceProps,
+		children: isTextarea && isAutoResize ? /* @__PURE__ */ jsx(StyledAutoResizeTextarea, {
+			...inputElProps,
+			minRows: minRows ?? rows,
+			maxRows
+		}) : isTextarea ? /* @__PURE__ */ jsx(StyledTextarea, { ...inputElProps }) : /* @__PURE__ */ jsx(StyledInput, {
+			inputComponent: resolvedInputComponent,
+			inputSize,
+			...inputElProps
+		})
+	});
+}
+//#endregion
 export { TextInput };

package/dist/ToggleButton/ToggleButton.cjs

@@ -1,13 +1,13 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_src = require("../src-BiocWFSR.cjs");
-const require_themeDefault = require("../themeDefault-B-QjpGEO.cjs");
+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");
 const require_ButtonGroupContext = require("../ButtonGroupContext-NtkVeDVE.cjs");
 const require_Button = require("../Button.cjs");
 const require_ToggleButtonGroupContext = require("../ToggleButtonGroupContext-Ewc5Ixas.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
-let _emotion_react = require("@emotion/react");
 //#region src/ToggleButton/ToggleButton/ToggleButton.tsx
 const stateStyles = ({ theme, color = require_themeDefault.themeDefault(theme, "neutralColor", "default"), isSelected }) => {
 	const c = theme.palette[color];
@@ -35,7 +35,7 @@ const isValueSelected = (value, groupValue) => {
 function ToggleButton({ value, isSelected, color, onChange, onClick, type = "button", ...rest }) {
 	const group = (0, react.useContext)(require_ToggleButtonGroupContext.ToggleButtonGroupContext);
 	const buttonGroup = (0, react.useContext)(require_ButtonGroupContext.ButtonGroupContext);
-	const theme = (0, _emotion_react.useTheme)();
+	const theme = require_theme.useTheme();
 	const selected = isSelected ?? isValueSelected(value, group.value);
 	const resolvedColor = color ?? buttonGroup.color ?? require_themeDefault.themeDefault(theme, "neutralColor", "default");
 	const handleClick = (event) => {

package/dist/ToggleButton/ToggleButton.d.cts

@@ -1,4 +1,4 @@
-import { i as ButtonProps } from "../index-DASvoACZ.cjs";
+import { i as ButtonProps } from "../index-BnCp6k4s.cjs";
 import { r as ToggleButtonValue } from "../ToggleButtonGroupContext-CqD-Afho.cjs";
 //#region src/ToggleButton/ToggleButton/ToggleButton.d.ts
 interface ToggleButtonProps extends Omit<ButtonProps, 'variant' | 'href' | 'target' | 'rel' | 'value' | 'onChange'> {

package/dist/ToggleButton/ToggleButton.d.mts

@@ -1,4 +1,4 @@
-import { i as ButtonProps } from "../index-C0xMvDjL.mjs";
+import { i as ButtonProps } from "../index-CLCtvcKA.mjs";
 import { r as ToggleButtonValue } from "../ToggleButtonGroupContext-CqD-Afho.mjs";
 //#region src/ToggleButton/ToggleButton/ToggleButton.d.ts
 interface ToggleButtonProps extends Omit<ButtonProps, 'variant' | 'href' | 'target' | 'rel' | 'value' | 'onChange'> {

package/dist/ToggleButton/ToggleButton.mjs

@@ -1,6 +1,7 @@
-import { d as styled, l as src_exports, u as useTheme } from "../src-DcNT2aIK.mjs";
-import { t as themeDefault } from "../themeDefault-CjXaY3ok.mjs";
+import { a as src_exports, o as styled } from "../src-BJy4dM4f.mjs";
+import { t as themeDefault } from "../themeDefault-Z3KmyIbm.mjs";
 import { alpha } from "../utils.mjs";
+import { r as useTheme } from "../theme-V6lYzd3j.mjs";
 import { t as ButtonGroupContext } from "../ButtonGroupContext-DS-kl9lG.mjs";
 import { Button } from "../Button.mjs";
 import { t as ToggleButtonGroupContext } from "../ToggleButtonGroupContext-DxIyy8ze.mjs";

package/dist/ToggleButton/ToggleButtonGroup.cjs

@@ -1,11 +1,11 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_src = require("../src-BiocWFSR.cjs");
-const require_themeDefault = require("../themeDefault-B-QjpGEO.cjs");
+const require_src = require("../src-C8PIppTy.cjs");
+const require_themeDefault = require("../themeDefault-Cebi08Cv.cjs");
+const require_theme = require("../theme-Du6xgPsg.cjs");
 const require_ButtonGroup = require("../ButtonGroup.cjs");
 const require_ToggleButtonGroupContext = require("../ToggleButtonGroupContext-Ewc5Ixas.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
-let _emotion_react = require("@emotion/react");
 //#region src/ToggleButton/ToggleButtonGroup/ToggleButtonGroup.tsx
 const selectedEdgeStyles = ({ theme, orientation = "horizontal", color = require_themeDefault.themeDefault(theme, "neutralColor", "default") }) => {
 	return { "& > [aria-pressed=\"true\"]:not(:first-of-type)": { [orientation === "vertical" ? "borderTopColor" : "borderLeftColor"]: theme.palette[color].main } };
@@ -21,7 +21,7 @@ const ToggleButtonGroupRoot = require_src.styled(require_ButtonGroup.ButtonGroup
 * through `ButtonGroup` as usual.
 */
 function ToggleButtonGroup({ value = null, onChange, isExclusive = false, color: colorProp, children, ...rest }) {
-	const theme = (0, _emotion_react.useTheme)();
+	const theme = require_theme.useTheme();
 	const color = colorProp ?? require_themeDefault.themeDefault(theme, "neutralColor", "default");
 	const context = (0, react.useMemo)(() => {
 		const handleToggle = (buttonValue) => {

package/dist/ToggleButton/ToggleButtonGroup.d.cts

@@ -1,4 +1,4 @@
-import { a as ButtonGroupProps } from "../index-CyZYXDn0.cjs";
+import { a as ButtonGroupProps } from "../index-C1vVYigQ.cjs";
 import { r as ToggleButtonValue } from "../ToggleButtonGroupContext-CqD-Afho.cjs";
 //#region src/ToggleButton/ToggleButtonGroup/ToggleButtonGroup.d.ts
 interface ToggleButtonGroupProps extends Omit<ButtonGroupProps, 'variant' | 'onChange'> {

package/dist/ToggleButton/ToggleButtonGroup.d.mts

@@ -1,4 +1,4 @@
-import { a as ButtonGroupProps } from "../index-BqVgv2B_.mjs";
+import { a as ButtonGroupProps } from "../index-DwjxjLcD.mjs";
 import { r as ToggleButtonValue } from "../ToggleButtonGroupContext-CqD-Afho.mjs";
 //#region src/ToggleButton/ToggleButtonGroup/ToggleButtonGroup.d.ts
 interface ToggleButtonGroupProps extends Omit<ButtonGroupProps, 'variant' | 'onChange'> {

package/dist/ToggleButton/ToggleButtonGroup.mjs

@@ -1,5 +1,6 @@
-import { d as styled, u as useTheme } from "../src-DcNT2aIK.mjs";
-import { t as themeDefault } from "../themeDefault-CjXaY3ok.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 { ButtonGroup } from "../ButtonGroup.mjs";
 import { t as ToggleButtonGroupContext } from "../ToggleButtonGroupContext-DxIyy8ze.mjs";
 import { useMemo } from "react";

package/dist/ToggleButton.d.cts

@@ -1,4 +1,4 @@
 import { n as ToggleButtonGroupContextValue, r as ToggleButtonValue, t as ToggleButtonGroupContext } from "./ToggleButtonGroupContext-CqD-Afho.cjs";
-import { ToggleButtonGroup, ToggleButtonGroupProps } from "./ToggleButton/ToggleButtonGroup.cjs";
 import { ToggleButton, ToggleButtonProps } from "./ToggleButton/ToggleButton.cjs";
+import { ToggleButtonGroup, ToggleButtonGroupProps } from "./ToggleButton/ToggleButtonGroup.cjs";
 export { ToggleButton, ToggleButtonGroup, ToggleButtonGroupContext, ToggleButtonGroupContextValue, ToggleButtonGroupProps, ToggleButtonProps, ToggleButtonValue };

package/dist/ToggleButton.d.mts

@@ -1,4 +1,4 @@
 import { n as ToggleButtonGroupContextValue, r as ToggleButtonValue, t as ToggleButtonGroupContext } from "./ToggleButtonGroupContext-CqD-Afho.mjs";
-import { ToggleButtonGroup, ToggleButtonGroupProps } from "./ToggleButton/ToggleButtonGroup.mjs";
 import { ToggleButton, ToggleButtonProps } from "./ToggleButton/ToggleButton.mjs";
+import { ToggleButtonGroup, ToggleButtonGroupProps } from "./ToggleButton/ToggleButtonGroup.mjs";
 export { ToggleButton, ToggleButtonGroup, ToggleButtonGroupContext, ToggleButtonGroupContextValue, ToggleButtonGroupProps, ToggleButtonProps, ToggleButtonValue };

package/dist/Typography.cjs

@@ -1,9 +1,9 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_src = require("./src-BiocWFSR.cjs");
+const require_src = require("./src-C8PIppTy.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");
-let _emotion_react = require("@emotion/react");
 //#region src/Typography/Typography.tsx
 const shouldForwardProp = (0, _soroush_tech_styled_system_should_forward_prop.createShouldForwardProp)([
 	..._soroush_tech_styled_system_should_forward_prop.props,
@@ -52,7 +52,7 @@ const TypographyBase = require_src.styled("p", {
 	whiteSpace: "nowrap"
 } : {});
 function Typography({ variant = "body1", as, ...rest }) {
-	const theme = (0, _emotion_react.useTheme)();
+	const theme = require_theme.useTheme();
 	const element = as ?? theme.typography[variant].element;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TypographyBase, {
 		as: element,

package/dist/Typography.d.cts

@@ -1,3 +1,3 @@
-import { F as TypographyVariant } from "./themes-D81JYbqm.cjs";
-import { a as TypographyProps, i as TypographyAlign, n as TextColorToken, r as Typography, t as BackgroundToken } from "./index-CDVnvjIE.cjs";
+import { I as TypographyVariant } from "./themes-BTGww2YK.cjs";
+import { a as TypographyProps, i as TypographyAlign, n as TextColorToken, r as Typography, t as BackgroundToken } from "./index-BLnOsdgc.cjs";
 export { BackgroundToken, TextColorToken, Typography, TypographyAlign, TypographyProps, type TypographyVariant };

package/dist/Typography.d.mts

@@ -1,3 +1,3 @@
-import { F as TypographyVariant } from "./themes-D1SAp3SL.mjs";
-import { a as TypographyProps, i as TypographyAlign, n as TextColorToken, r as Typography, t as BackgroundToken } from "./index-DE5PtzPn.mjs";
+import { I as TypographyVariant } from "./themes-BTGww2YK.mjs";
+import { a as TypographyProps, i as TypographyAlign, n as TextColorToken, r as Typography, t as BackgroundToken } from "./index-BF2KXGBM.mjs";
 export { BackgroundToken, TextColorToken, Typography, TypographyAlign, TypographyProps, type TypographyVariant };

package/dist/Typography.mjs

@@ -1,4 +1,5 @@
-import { a as createShouldForwardProp, c as props, d as styled, l as src_exports, u as useTheme } from "./src-DcNT2aIK.mjs";
+import { a as src_exports, i as props, o as styled, t as createShouldForwardProp } from "./src-BJy4dM4f.mjs";
+import { r as useTheme } from "./theme-V6lYzd3j.mjs";
 import "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/Typography/Typography.tsx

package/dist/View.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_src = require("./src-BiocWFSR.cjs");
+const require_src = require("./src-C8PIppTy.cjs");
 require("react");
 let _soroush_tech_styled_system_should_forward_prop = require("@soroush.tech/styled-system/should-forward-prop");
 //#region src/View/View.tsx

package/dist/View.d.cts

@@ -1,2 +1,2 @@
-import { a as ViewBorderWidthToken, i as ViewBorderRadiusToken, n as ViewBackgroundToken, o as ViewColorToken, r as ViewBorderColorToken, s as ViewProps, t as View } from "./index-FwTocqhP.cjs";
+import { a as ViewBorderWidthToken, i as ViewBorderRadiusToken, n as ViewBackgroundToken, o as ViewColorToken, r as ViewBorderColorToken, s as ViewProps, t as View } from "./index-B8FOqBiS.cjs";
 export { View, ViewBackgroundToken, ViewBorderColorToken, ViewBorderRadiusToken, ViewBorderWidthToken, ViewColorToken, ViewProps };

package/dist/View.d.mts

@@ -1,2 +1,2 @@
-import { a as ViewBorderWidthToken, i as ViewBorderRadiusToken, n as ViewBackgroundToken, o as ViewColorToken, r as ViewBorderColorToken, s as ViewProps, t as View } from "./index-pX7tBQdJ.mjs";
+import { a as ViewBorderWidthToken, i as ViewBorderRadiusToken, n as ViewBackgroundToken, o as ViewColorToken, r as ViewBorderColorToken, s as ViewProps, t as View } from "./index-CYNgNatZ.mjs";
 export { View, ViewBackgroundToken, ViewBorderColorToken, ViewBorderRadiusToken, ViewBorderWidthToken, ViewColorToken, ViewProps };

package/dist/View.mjs

@@ -1,4 +1,4 @@
-import { a as createShouldForwardProp, c as props, d as styled, l as src_exports } from "./src-DcNT2aIK.mjs";
+import { a as src_exports, i as props, o as styled, t as createShouldForwardProp } from "./src-BJy4dM4f.mjs";
 import "react";
 //#region src/View/View.tsx
 const shouldForwardProp = createShouldForwardProp([

package/dist/emotion-BAyqVw0c.mjs

@@ -0,0 +1,6 @@
+import { CacheProvider, Global, ThemeContext as EmotionThemeContext, ThemeProvider as EmotionThemeProvider, useTheme as useEmotionTheme } from "@emotion/react";
+//#region src/theme/emotion.ts
+/** `Global`, retyped against this package's own `Theme` (see `styled.ts`'s `StyledTags`). */
+const Global$1 = Global;
+//#endregion
+export { useEmotionTheme as a, Global$1 as i, EmotionThemeContext as n, EmotionThemeProvider as r, CacheProvider as t };

package/dist/emotion-DviPkkGL.cjs

@@ -0,0 +1,10 @@
+//#region src/theme/emotion.ts
+/** `Global`, retyped against this package's own `Theme` (see `styled.ts`'s `StyledTags`). */
+const Global = require("@emotion/react").Global;
+//#endregion
+Object.defineProperty(exports, "Global", {
+	enumerable: true,
+	get: function() {
+		return Global;
+	}
+});

package/dist/engine.cjs

@@ -0,0 +1,80 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_rolldown_runtime = require("./rolldown-runtime-DDXJien1.cjs");
+const require_emotion = require("./emotion-DviPkkGL.cjs");
+let _emotion_react = require("@emotion/react");
+let _emotion_cache = require("@emotion/cache");
+_emotion_cache = require_rolldown_runtime.__toESM(_emotion_cache, 1);
+//#region src/engine/styleCache.ts
+var styleCache_default = (0, _emotion_cache.default)({ key: "soroush" });
+//#endregion
+//#region src/engine/globalStyles.ts
+/**
+* The base reset this package owns — box-sizing, margin/table resets, and
+* theme-driven body colors. Font-family, webfont loading, and anything else
+* app-specific are app policy — compose this into your own `Global` styles array.
+*/
+const globalStyles = (theme) => _emotion_react.css`
+  *,
+  *::before,
+  *::after {
+    box-sizing: border-box;
+  }
+
+  html,
+  body {
+    margin: 0;
+    padding: 0;
+  }
+
+  html {
+    line-height: 1.15;
+    -webkit-text-size-adjust: 100%;
+    tab-size: 4;
+    color-scheme: ${theme.colorScheme};
+    font-synthesis: none;
+    text-rendering: optimizeLegibility;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+  }
+
+  body {
+    background: ${theme.background.primary};
+    color: ${theme.text.initial};
+  }
+
+  p,
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    margin: 0;
+    font-weight: inherit;
+    margin-block-end: 0.5em;
+  }
+
+  textarea {
+    overflow: auto;
+  }
+
+  table {
+    border-collapse: collapse;
+    border-spacing: 0;
+  }
+
+  td,
+  th {
+    padding: 0;
+  }
+`;
+//#endregion
+Object.defineProperty(exports, "CacheProvider", {
+	enumerable: true,
+	get: function() {
+		return _emotion_react.CacheProvider;
+	}
+});
+exports.Global = require_emotion.Global;
+exports.globalStyles = globalStyles;
+exports.styleCache = styleCache_default;

package/dist/engine.d.cts

@@ -0,0 +1,21 @@
+import { m as Theme } from "./themes-BTGww2YK.cjs";
+import { CacheProvider, Interpolation } from "@emotion/react";
+import { ComponentType, RefAttributes } from "react";
+//#region src/theme/emotion.d.ts
+/** `Global`, retyped against this package's own `Theme` (see `styled.ts`'s `StyledTags`). */
+declare const Global: ComponentType<{
+  styles: Interpolation<Theme>;
+} & RefAttributes<unknown>>;
+//#endregion
+//#region src/engine/styleCache.d.ts
+declare const _default: import("@emotion/cache").EmotionCache;
+//#endregion
+//#region src/engine/globalStyles.d.ts
+/**
+ * The base reset this package owns — box-sizing, margin/table resets, and
+ * theme-driven body colors. Font-family, webfont loading, and anything else
+ * app-specific are app policy — compose this into your own `Global` styles array.
+ */
+declare const globalStyles: (theme: Theme) => import("@emotion/react").SerializedStyles;
+//#endregion
+export { CacheProvider, Global, globalStyles, _default as styleCache };

package/dist/engine.d.mts

@@ -0,0 +1,21 @@
+import { m as Theme } from "./themes-BTGww2YK.mjs";
+import { CacheProvider, Interpolation } from "@emotion/react";
+import { ComponentType, RefAttributes } from "react";
+//#region src/theme/emotion.d.ts
+/** `Global`, retyped against this package's own `Theme` (see `styled.ts`'s `StyledTags`). */
+declare const Global: ComponentType<{
+  styles: Interpolation<Theme>;
+} & RefAttributes<unknown>>;
+//#endregion
+//#region src/engine/styleCache.d.ts
+declare const _default: import("@emotion/cache").EmotionCache;
+//#endregion
+//#region src/engine/globalStyles.d.ts
+/**
+ * The base reset this package owns — box-sizing, margin/table resets, and
+ * theme-driven body colors. Font-family, webfont loading, and anything else
+ * app-specific are app policy — compose this into your own `Global` styles array.
+ */
+declare const globalStyles: (theme: Theme) => import("@emotion/react").SerializedStyles;
+//#endregion
+export { CacheProvider, Global, globalStyles, _default as styleCache };

package/dist/engine.mjs

@@ -0,0 +1,69 @@
+import { i as Global, t as CacheProvider } from "./emotion-BAyqVw0c.mjs";
+import { css } from "@emotion/react";
+import createCache from "@emotion/cache";
+//#region src/engine/styleCache.ts
+var styleCache_default = createCache({ key: "soroush" });
+//#endregion
+//#region src/engine/globalStyles.ts
+/**
+* The base reset this package owns — box-sizing, margin/table resets, and
+* theme-driven body colors. Font-family, webfont loading, and anything else
+* app-specific are app policy — compose this into your own `Global` styles array.
+*/
+const globalStyles = (theme) => css`
+  *,
+  *::before,
+  *::after {
+    box-sizing: border-box;
+  }
+
+  html,
+  body {
+    margin: 0;
+    padding: 0;
+  }
+
+  html {
+    line-height: 1.15;
+    -webkit-text-size-adjust: 100%;
+    tab-size: 4;
+    color-scheme: ${theme.colorScheme};
+    font-synthesis: none;
+    text-rendering: optimizeLegibility;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+  }
+
+  body {
+    background: ${theme.background.primary};
+    color: ${theme.text.initial};
+  }
+
+  p,
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    margin: 0;
+    font-weight: inherit;
+    margin-block-end: 0.5em;
+  }
+
+  textarea {
+    overflow: auto;
+  }
+
+  table {
+    border-collapse: collapse;
+    border-spacing: 0;
+  }
+
+  td,
+  th {
+    padding: 0;
+  }
+`;
+//#endregion
+export { CacheProvider, Global, globalStyles, styleCache_default as styleCache };