@soroush.tech/styled-system 5.8.2 → 5.9.0-alpha.0

package/README.md

@@ -7,7 +7,7 @@
 [![types included](https://img.shields.io/npm/types/@soroush.tech/styled-system.svg?cacheSeconds=86400)](https://www.npmjs.com/package/@soroush.tech/styled-system)
 [![license](https://img.shields.io/npm/l/@soroush.tech/styled-system.svg?cacheSeconds=86400)](./LICENSE)
 
-A maintained, first-class-TypeScript rewrite of [styled-system](https://github.com/jxnblk/styled-system) v5 — responsive, theme-aware style props for CSS-in-JS.
+A maintained, first-class-TypeScript rewrite of [styled-system](https://github.com/jxnblk/styled-system) v5 - responsive, theme-aware style props for CSS-in-JS.
 
 It is a **drop-in replacement** for the `styled-system` runtime: the root export surface matches upstream verbatim, and the package ships its own types (replacing `@types/styled-system`).
 
@@ -19,7 +19,7 @@ It is a **drop-in replacement** for the `styled-system` runtime: the root export
 - Typographic scale, and a spacing scale for `margin`, `padding` and `gap`
 - Works with any color palette
 - Works with most CSS-in-JS libraries, including [Emotion](https://emotion.sh) and [styled-components](https://styled-components.com)
-- First-class TypeScript types — theme-scale-aware props, replacing `@types/styled-system`
+- First-class TypeScript types - theme-scale-aware props, replacing `@types/styled-system`
 
 ## Install
 
@@ -39,9 +39,9 @@ yarn add @soroush.tech/styled-system
 ```
 
 `@emotion/is-prop-valid` (`^1.4.0`, peer) and `prop-types` (`^15.8.1`, optional peer) are
-each used by a single [subpath](#subpath-imports) — `should-forward-prop` and `prop-types`
+each used by a single [subpath](#subpath-imports) - `should-forward-prop` and `prop-types`
 respectively. Install one only if you import that subpath. You bring your own CSS-in-JS
-library (Emotion, styled-components, …); the core carries neither at runtime.
+library (Emotion, styled-components, ...); the core carries neither at runtime.
 
 ## Usage
 
@@ -119,7 +119,7 @@ import shouldForwardProp, {
 
 ## Drop-in via alias
 
-Existing `styled-system` users can swap with a package-manager alias — no code changes:
+Existing `styled-system` users can swap with a package-manager alias - no code changes:
 
 ```jsonc
 "dependencies": {
@@ -127,7 +127,7 @@ Existing `styled-system` users can swap with a package-manager alias — no code
 }
 ```
 
-The satellite `@styled-system/*` packages don't need separate aliases — import them as
+The satellite `@styled-system/*` packages don't need separate aliases - import them as
 subpaths off the aliased `styled-system` name, and they resolve through this package's
 `exports`:
 
@@ -164,4 +164,4 @@ Per-version notes for every published release live in
 
 ## License
 
-MIT — a rewrite of styled-system (© 2017–2021 Brent Jackson), see [`LICENSE`](https://github.com/soroush-tech/core/tree/main/packages/styled-system/LICENSE).
+MIT - a rewrite of styled-system (© 2017-2021 Brent Jackson), see [`LICENSE`](https://github.com/soroush-tech/core/tree/main/packages/styled-system/LICENSE).

package/dist/background.d.cts

@@ -1,3 +1,3 @@
-import { t as background } from "./index-ogIIkqhV.cjs";
-import { c as BackgroundProps, l as BackgroundRepeatProps, o as BackgroundImageProps, s as BackgroundPositionProps, u as BackgroundSizeProps } from "./types-BEHYHdIq.cjs";
+import { t as background } from "./index-Q8q5VND1.cjs";
+import { c as BackgroundProps, l as BackgroundRepeatProps, o as BackgroundImageProps, s as BackgroundPositionProps, u as BackgroundSizeProps } from "./types-B0SNbm6V.cjs";
 export { type BackgroundImageProps, type BackgroundPositionProps, type BackgroundProps, type BackgroundRepeatProps, type BackgroundSizeProps, background, background as default };

package/dist/background.d.mts

@@ -1,3 +1,3 @@
-import { t as background } from "./index-Dj0F79Bp.mjs";
-import { c as BackgroundProps, l as BackgroundRepeatProps, o as BackgroundImageProps, s as BackgroundPositionProps, u as BackgroundSizeProps } from "./types-BEHYHdIq.mjs";
+import { t as background } from "./index-C-B6-_Ku.mjs";
+import { c as BackgroundProps, l as BackgroundRepeatProps, o as BackgroundImageProps, s as BackgroundPositionProps, u as BackgroundSizeProps } from "./types-B0SNbm6V.mjs";
 export { type BackgroundImageProps, type BackgroundPositionProps, type BackgroundProps, type BackgroundRepeatProps, type BackgroundSizeProps, background, background as default };

package/dist/border.d.cts

@@ -1,3 +1,3 @@
-import { _ as BorderStyleProps, d as BorderBottomProps, f as BorderColorProps, g as BorderRightProps, h as BorderRadiusProps, m as BorderProps, p as BorderLeftProps, v as BorderTopProps, y as BorderWidthProps } from "./types-BEHYHdIq.cjs";
-import { t as border } from "./index-DFHqxqDI.cjs";
+import { _ as BorderStyleProps, d as BorderBottomProps, f as BorderColorProps, g as BorderRightProps, h as BorderRadiusProps, m as BorderProps, p as BorderLeftProps, v as BorderTopProps, y as BorderWidthProps } from "./types-B0SNbm6V.cjs";
+import { t as border } from "./index-C9CxJ5Zn.cjs";
 export { type BorderBottomProps, type BorderColorProps, type BorderLeftProps, type BorderProps, type BorderRadiusProps, type BorderRightProps, type BorderStyleProps, type BorderTopProps, type BorderWidthProps, border, border as default };

package/dist/border.d.mts

@@ -1,3 +1,3 @@
-import { _ as BorderStyleProps, d as BorderBottomProps, f as BorderColorProps, g as BorderRightProps, h as BorderRadiusProps, m as BorderProps, p as BorderLeftProps, v as BorderTopProps, y as BorderWidthProps } from "./types-BEHYHdIq.mjs";
-import { t as border } from "./index-P5vy3lm4.mjs";
+import { _ as BorderStyleProps, d as BorderBottomProps, f as BorderColorProps, g as BorderRightProps, h as BorderRadiusProps, m as BorderProps, p as BorderLeftProps, v as BorderTopProps, y as BorderWidthProps } from "./types-B0SNbm6V.mjs";
+import { t as border } from "./index-D9dwDAhC.mjs";
 export { type BorderBottomProps, type BorderColorProps, type BorderLeftProps, type BorderProps, type BorderRadiusProps, type BorderRightProps, type BorderStyleProps, type BorderTopProps, type BorderWidthProps, border, border as default };

package/dist/color.d.cts

@@ -1,3 +1,3 @@
-import { C as ColorProps, Ot as TextColorProps, a as BackgroundColorProps, ft as OpacityProps } from "./types-BEHYHdIq.cjs";
-import { t as color } from "./index-KOeCRVqs.cjs";
+import { C as ColorProps, Ot as TextColorProps, a as BackgroundColorProps, ft as OpacityProps } from "./types-B0SNbm6V.cjs";
+import { t as color } from "./index-Cd_CcxMh.cjs";
 export { type BackgroundColorProps, type ColorProps, type OpacityProps, type TextColorProps, color, color as default };

package/dist/color.d.mts

@@ -1,3 +1,3 @@
-import { C as ColorProps, Ot as TextColorProps, a as BackgroundColorProps, ft as OpacityProps } from "./types-BEHYHdIq.mjs";
-import { t as color } from "./index-BxEj-sWN.mjs";
+import { C as ColorProps, Ot as TextColorProps, a as BackgroundColorProps, ft as OpacityProps } from "./types-B0SNbm6V.mjs";
+import { t as color } from "./index-CJT-n3Vq.mjs";
 export { type BackgroundColorProps, type ColorProps, type OpacityProps, type TextColorProps, color, color as default };

package/dist/core.cjs

@@ -1,4 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_media = require("./media-BoIPXBPV.cjs");
 //#region src/core/core.ts
 const merge = (a, b) => {
 	const result = {
@@ -11,14 +12,10 @@ const merge = (a, b) => {
 	}
 	return result;
 };
-const sort = (obj) => {
+const sort = (obj, media) => {
 	const next = {};
-	Object.keys(obj).sort((a, b) => a.localeCompare(b, void 0, {
-		numeric: true,
-		sensitivity: "base"
-	})).forEach((key) => {
-		next[key] = obj[key];
-	});
+	for (const key in obj) if (!media.includes(key)) next[key] = obj[key];
+	for (const key of media) if (key && key in obj) next[key] = obj[key];
 	return next;
 };
 const defaults = { breakpoints: [
@@ -26,7 +23,6 @@ const defaults = { breakpoints: [
 	52,
 	64
 ].map((n) => n + "em") };
-const createMediaQuery = (n) => `@media screen and (min-width: ${n})`;
 const getValue = (n, scale) => get(scale, n, n);
 const get = (obj, key, def, p = 0, undef) => {
 	const path = typeof key === "string" ? key.split(".") : [key];
@@ -50,11 +46,11 @@ const parseResponsiveStyle = (mediaQueries, sx, scale, raw, props) => {
 const parseResponsiveObject = (breakpoints, sx, scale, raw, props) => {
 	const styles = {};
 	for (const key in raw) {
-		const breakpoint = breakpoints[key];
+		const breakpoint = Object.hasOwn(breakpoints, key) ? breakpoints[key] : void 0;
 		const value = raw[key];
 		const style = sx(value, scale, props);
-		if (breakpoint) {
-			const media = createMediaQuery(breakpoint);
+		if (breakpoint !== void 0) {
+			const media = require_media.createMediaQuery(breakpoint);
 			Object.assign(styles, { [media]: {
 				...styles[media],
 				...style
@@ -64,7 +60,7 @@ const parseResponsiveObject = (breakpoints, sx, scale, raw, props) => {
 	return styles;
 };
 const createParser = (config) => {
-	const cache = {};
+	const cache = { media: [] };
 	const parse = ((props) => {
 		let styles = {};
 		let shouldSort = false;
@@ -75,21 +71,24 @@ const createParser = (config) => {
 			const raw = props[key];
 			const scale = get(props.theme, sx.scale, sx.defaults);
 			if (typeof raw === "object") {
-				cache.breakpoints = !isCacheDisabled && cache.breakpoints || get(props.theme, "breakpoints", defaults.breakpoints);
+				const breakpoints = get(props.theme, "breakpoints", defaults.breakpoints);
+				if (isCacheDisabled || cache.breakpoints !== breakpoints) {
+					cache.breakpoints = breakpoints;
+					cache.media = [null, ...Object.values(breakpoints).map(require_media.createMediaQuery)];
+				}
 				if (Array.isArray(raw)) {
-					cache.media = !isCacheDisabled && cache.media || [null, ...cache.breakpoints.map(createMediaQuery)];
 					styles = merge(styles, parseResponsiveStyle(cache.media, sx, scale, raw, props));
 					continue;
 				}
 				if (raw !== null) {
-					styles = merge(styles, parseResponsiveObject(cache.breakpoints, sx, scale, raw, props));
+					styles = merge(styles, parseResponsiveObject(breakpoints, sx, scale, raw, props));
 					shouldSort = true;
 				}
 				continue;
 			}
 			Object.assign(styles, sx(raw, scale, props));
 		}
-		if (shouldSort) styles = sort(styles);
+		if (shouldSort) styles = sort(styles, cache.media);
 		return styles;
 	});
 	parse.config = config;
@@ -144,7 +143,9 @@ const compose = (...parsers) => {
 	return createParser(config);
 };
 //#endregion
+exports.breakpointQueries = require_media.breakpointQueries;
 exports.compose = compose;
+exports.createMediaQuery = require_media.createMediaQuery;
 exports.createParser = createParser;
 exports.createStyleFunction = createStyleFunction;
 exports.get = get;

package/dist/core.d.cts

@@ -1,2 +1,3 @@
-import { _ as merge, a as Parser, c as StyleFn, d as Theme, f as Transform, g as get, h as createStyleFunction, i as ConfigStyle, l as StyleObject, m as createParser, n as Config, o as ParserConfig, p as compose, r as ConfigFunction, s as Props, t as CSSObject, u as SystemConfig, v as styleFn, y as system } from "./index-C0SM54dQ.cjs";
-export { CSSObject, Config, ConfigFunction, ConfigStyle, Parser, ParserConfig, Props, StyleFn, StyleObject, SystemConfig, Theme, Transform, compose, createParser, createStyleFunction, get, merge, styleFn, system };
+import { n as breakpointQueries, r as createMediaQuery, t as Breakpoints } from "./media-np0uvO4C.cjs";
+import { _ as merge, a as Parser, c as StyleFn, d as Theme, f as Transform, g as get, h as createStyleFunction, i as ConfigStyle, l as StyleObject, m as createParser, n as Config, o as ParserConfig, p as compose, r as ConfigFunction, s as Props, t as CSSObject, u as SystemConfig, v as styleFn, y as system } from "./index-BYkO78Xl.cjs";
+export { Breakpoints, CSSObject, Config, ConfigFunction, ConfigStyle, Parser, ParserConfig, Props, StyleFn, StyleObject, SystemConfig, Theme, Transform, breakpointQueries, compose, createMediaQuery, createParser, createStyleFunction, get, merge, styleFn, system };

package/dist/core.d.mts

@@ -1,2 +1,3 @@
-import { _ as merge, a as Parser, c as StyleFn, d as Theme, f as Transform, g as get, h as createStyleFunction, i as ConfigStyle, l as StyleObject, m as createParser, n as Config, o as ParserConfig, p as compose, r as ConfigFunction, s as Props, t as CSSObject, u as SystemConfig, v as styleFn, y as system } from "./index-C0SM54dQ.mjs";
-export { CSSObject, Config, ConfigFunction, ConfigStyle, Parser, ParserConfig, Props, StyleFn, StyleObject, SystemConfig, Theme, Transform, compose, createParser, createStyleFunction, get, merge, styleFn, system };
+import { n as breakpointQueries, r as createMediaQuery, t as Breakpoints } from "./media-np0uvO4C.mjs";
+import { _ as merge, a as Parser, c as StyleFn, d as Theme, f as Transform, g as get, h as createStyleFunction, i as ConfigStyle, l as StyleObject, m as createParser, n as Config, o as ParserConfig, p as compose, r as ConfigFunction, s as Props, t as CSSObject, u as SystemConfig, v as styleFn, y as system } from "./index-BXP1-da3.mjs";
+export { Breakpoints, CSSObject, Config, ConfigFunction, ConfigStyle, Parser, ParserConfig, Props, StyleFn, StyleObject, SystemConfig, Theme, Transform, breakpointQueries, compose, createMediaQuery, createParser, createStyleFunction, get, merge, styleFn, system };

package/dist/core.mjs

@@ -1,3 +1,4 @@
+import { n as createMediaQuery, t as breakpointQueries } from "./media-B8UpEDpY.mjs";
 //#region src/core/core.ts
 const merge = (a, b) => {
 	const result = {
@@ -10,14 +11,10 @@ const merge = (a, b) => {
 	}
 	return result;
 };
-const sort = (obj) => {
+const sort = (obj, media) => {
 	const next = {};
-	Object.keys(obj).sort((a, b) => a.localeCompare(b, void 0, {
-		numeric: true,
-		sensitivity: "base"
-	})).forEach((key) => {
-		next[key] = obj[key];
-	});
+	for (const key in obj) if (!media.includes(key)) next[key] = obj[key];
+	for (const key of media) if (key && key in obj) next[key] = obj[key];
 	return next;
 };
 const defaults = { breakpoints: [
@@ -25,7 +22,6 @@ const defaults = { breakpoints: [
 	52,
 	64
 ].map((n) => n + "em") };
-const createMediaQuery = (n) => `@media screen and (min-width: ${n})`;
 const getValue = (n, scale) => get(scale, n, n);
 const get = (obj, key, def, p = 0, undef) => {
 	const path = typeof key === "string" ? key.split(".") : [key];
@@ -49,10 +45,10 @@ const parseResponsiveStyle = (mediaQueries, sx, scale, raw, props) => {
 const parseResponsiveObject = (breakpoints, sx, scale, raw, props) => {
 	const styles = {};
 	for (const key in raw) {
-		const breakpoint = breakpoints[key];
+		const breakpoint = Object.hasOwn(breakpoints, key) ? breakpoints[key] : void 0;
 		const value = raw[key];
 		const style = sx(value, scale, props);
-		if (breakpoint) {
+		if (breakpoint !== void 0) {
 			const media = createMediaQuery(breakpoint);
 			Object.assign(styles, { [media]: {
 				...styles[media],
@@ -63,7 +59,7 @@ const parseResponsiveObject = (breakpoints, sx, scale, raw, props) => {
 	return styles;
 };
 const createParser = (config) => {
-	const cache = {};
+	const cache = { media: [] };
 	const parse = ((props) => {
 		let styles = {};
 		let shouldSort = false;
@@ -74,21 +70,24 @@ const createParser = (config) => {
 			const raw = props[key];
 			const scale = get(props.theme, sx.scale, sx.defaults);
 			if (typeof raw === "object") {
-				cache.breakpoints = !isCacheDisabled && cache.breakpoints || get(props.theme, "breakpoints", defaults.breakpoints);
+				const breakpoints = get(props.theme, "breakpoints", defaults.breakpoints);
+				if (isCacheDisabled || cache.breakpoints !== breakpoints) {
+					cache.breakpoints = breakpoints;
+					cache.media = [null, ...Object.values(breakpoints).map(createMediaQuery)];
+				}
 				if (Array.isArray(raw)) {
-					cache.media = !isCacheDisabled && cache.media || [null, ...cache.breakpoints.map(createMediaQuery)];
 					styles = merge(styles, parseResponsiveStyle(cache.media, sx, scale, raw, props));
 					continue;
 				}
 				if (raw !== null) {
-					styles = merge(styles, parseResponsiveObject(cache.breakpoints, sx, scale, raw, props));
+					styles = merge(styles, parseResponsiveObject(breakpoints, sx, scale, raw, props));
 					shouldSort = true;
 				}
 				continue;
 			}
 			Object.assign(styles, sx(raw, scale, props));
 		}
-		if (shouldSort) styles = sort(styles);
+		if (shouldSort) styles = sort(styles, cache.media);
 		return styles;
 	});
 	parse.config = config;
@@ -143,4 +142,4 @@ const compose = (...parsers) => {
 	return createParser(config);
 };
 //#endregion
-export { compose, createParser, createStyleFunction, get, merge, system };
+export { breakpointQueries, compose, createMediaQuery, createParser, createStyleFunction, get, merge, system };

package/dist/{css-CeNnKyGm.cjs → css-BnnO16Cw.cjs}

@@ -1,3 +1,4 @@
+const require_media = require("./media-BoIPXBPV.cjs");
 //#region src/css/css.ts
 const get = (obj, key, def, p = 0, undef) => {
 	const path = typeof key === "string" ? key.split(".") : [key];
@@ -156,7 +157,8 @@ const transforms = [
 }), {});
 const responsive = (styles) => (theme) => {
 	const next = {};
-	const mediaQueries = [null, ...get(theme, "breakpoints", defaultBreakpoints).map((n) => `@media screen and (min-width: ${n})`)];
+	const breakpoints = get(theme, "breakpoints", defaultBreakpoints);
+	const mediaQueries = [null, ...Object.values(breakpoints).map(require_media.createMediaQuery)];
 	for (const key in styles) {
 		const value = typeof styles[key] === "function" ? styles[key](theme) : styles[key];
 		if (value == null) continue;

package/dist/{css-BTuRmXCo.mjs → css-CunBKyMl.mjs}

@@ -1,3 +1,4 @@
+import { n as createMediaQuery } from "./media-B8UpEDpY.mjs";
 //#region src/css/css.ts
 const get = (obj, key, def, p = 0, undef) => {
 	const path = typeof key === "string" ? key.split(".") : [key];
@@ -156,7 +157,8 @@ const transforms = [
 }), {});
 const responsive = (styles) => (theme) => {
 	const next = {};
-	const mediaQueries = [null, ...get(theme, "breakpoints", defaultBreakpoints).map((n) => `@media screen and (min-width: ${n})`)];
+	const breakpoints = get(theme, "breakpoints", defaultBreakpoints);
+	const mediaQueries = [null, ...Object.values(breakpoints).map(createMediaQuery)];
 	for (const key in styles) {
 		const value = typeof styles[key] === "function" ? styles[key](theme) : styles[key];
 		if (value == null) continue;

package/dist/css.cjs

@@ -2,7 +2,7 @@ Object.defineProperties(exports, {
 	__esModule: { value: true },
 	[Symbol.toStringTag]: { value: "Module" }
 });
-const require_css = require("./css-CeNnKyGm.cjs");
+const require_css = require("./css-BnnO16Cw.cjs");
 exports.css = require_css.css;
 exports.default = require_css.css;
 exports.get = require_css.get;

package/dist/css.d.cts

@@ -1,7 +1,8 @@
+import { t as Breakpoints } from "./media-np0uvO4C.cjs";
 //#region src/css/css.d.ts
 type CSSObject = Record<string, unknown>;
 interface CssTheme {
-  breakpoints?: (string | number)[];
+  breakpoints?: Breakpoints;
   [key: string]: unknown;
 }
 type CssArg = CSSObject | ((theme: CssTheme) => CSSObject);

package/dist/css.d.mts

@@ -1,7 +1,8 @@
+import { t as Breakpoints } from "./media-np0uvO4C.mjs";
 //#region src/css/css.d.ts
 type CSSObject = Record<string, unknown>;
 interface CssTheme {
-  breakpoints?: (string | number)[];
+  breakpoints?: Breakpoints;
   [key: string]: unknown;
 }
 type CssArg = CSSObject | ((theme: CssTheme) => CSSObject);

package/dist/css.mjs

@@ -1,2 +1,2 @@
-import { n as get, r as responsive, t as css } from "./css-BTuRmXCo.mjs";
+import { n as get, r as responsive, t as css } from "./css-CunBKyMl.mjs";
 export { css, css as default, get, responsive };

package/dist/flexbox.d.cts

@@ -1,3 +1,3 @@
-import { $ as JustifyContentProps, A as FlexProps, D as FlexBasisProps, M as FlexWrapProps, N as FlexboxProps, O as FlexDirectionProps, et as JustifyItemsProps, j as FlexShrinkProps, k as FlexGrowProps, n as AlignItemsProps, pt as OrderProps, r as AlignSelfProps, t as AlignContentProps, tt as JustifySelfProps } from "./types-BEHYHdIq.cjs";
-import { t as flexbox } from "./index-C0U26AuK.cjs";
+import { $ as JustifyContentProps, A as FlexProps, D as FlexBasisProps, M as FlexWrapProps, N as FlexboxProps, O as FlexDirectionProps, et as JustifyItemsProps, j as FlexShrinkProps, k as FlexGrowProps, n as AlignItemsProps, pt as OrderProps, r as AlignSelfProps, t as AlignContentProps, tt as JustifySelfProps } from "./types-B0SNbm6V.cjs";
+import { t as flexbox } from "./index-CIccdXWj.cjs";
 export { type AlignContentProps, type AlignItemsProps, type AlignSelfProps, type FlexBasisProps, type FlexDirectionProps, type FlexGrowProps, type FlexProps, type FlexShrinkProps, type FlexWrapProps, type FlexboxProps, type JustifyContentProps, type JustifyItemsProps, type JustifySelfProps, type OrderProps, flexbox as default, flexbox };

package/dist/flexbox.d.mts

@@ -1,3 +1,3 @@
-import { $ as JustifyContentProps, A as FlexProps, D as FlexBasisProps, M as FlexWrapProps, N as FlexboxProps, O as FlexDirectionProps, et as JustifyItemsProps, j as FlexShrinkProps, k as FlexGrowProps, n as AlignItemsProps, pt as OrderProps, r as AlignSelfProps, t as AlignContentProps, tt as JustifySelfProps } from "./types-BEHYHdIq.mjs";
-import { t as flexbox } from "./index-CLPj_nlH.mjs";
+import { $ as JustifyContentProps, A as FlexProps, D as FlexBasisProps, M as FlexWrapProps, N as FlexboxProps, O as FlexDirectionProps, et as JustifyItemsProps, j as FlexShrinkProps, k as FlexGrowProps, n as AlignItemsProps, pt as OrderProps, r as AlignSelfProps, t as AlignContentProps, tt as JustifySelfProps } from "./types-B0SNbm6V.mjs";
+import { t as flexbox } from "./index-DcRfFIAZ.mjs";
 export { type AlignContentProps, type AlignItemsProps, type AlignSelfProps, type FlexBasisProps, type FlexDirectionProps, type FlexGrowProps, type FlexProps, type FlexShrinkProps, type FlexWrapProps, type FlexboxProps, type JustifyContentProps, type JustifyItemsProps, type JustifySelfProps, type OrderProps, flexbox as default, flexbox };

package/dist/grid.d.cts

@@ -1,3 +1,3 @@
-import { B as GridAutoColumnsProps, G as GridGapProps, H as GridAutoRowsProps, J as GridRowProps, K as GridProps, U as GridColumnGapProps, V as GridAutoFlowProps, W as GridColumnProps, X as GridTemplateColumnsProps, Y as GridTemplateAreasProps, Z as GridTemplateRowsProps, q as GridRowGapProps, z as GridAreaProps } from "./types-BEHYHdIq.cjs";
-import { t as grid } from "./index-CSiiNuwr.cjs";
+import { B as GridAutoColumnsProps, G as GridGapProps, H as GridAutoRowsProps, J as GridRowProps, K as GridProps, U as GridColumnGapProps, V as GridAutoFlowProps, W as GridColumnProps, X as GridTemplateColumnsProps, Y as GridTemplateAreasProps, Z as GridTemplateRowsProps, q as GridRowGapProps, z as GridAreaProps } from "./types-B0SNbm6V.cjs";
+import { t as grid } from "./index-0k2kzlK5.cjs";
 export { type GridAreaProps, type GridAutoColumnsProps, type GridAutoFlowProps, type GridAutoRowsProps, type GridColumnGapProps, type GridColumnProps, type GridGapProps, type GridProps, type GridRowGapProps, type GridRowProps, type GridTemplateAreasProps, type GridTemplateColumnsProps, type GridTemplateRowsProps, grid as default, grid };

package/dist/grid.d.mts

@@ -1,3 +1,3 @@
-import { B as GridAutoColumnsProps, G as GridGapProps, H as GridAutoRowsProps, J as GridRowProps, K as GridProps, U as GridColumnGapProps, V as GridAutoFlowProps, W as GridColumnProps, X as GridTemplateColumnsProps, Y as GridTemplateAreasProps, Z as GridTemplateRowsProps, q as GridRowGapProps, z as GridAreaProps } from "./types-BEHYHdIq.mjs";
-import { t as grid } from "./index-CA8D2_fO.mjs";
+import { B as GridAutoColumnsProps, G as GridGapProps, H as GridAutoRowsProps, J as GridRowProps, K as GridProps, U as GridColumnGapProps, V as GridAutoFlowProps, W as GridColumnProps, X as GridTemplateColumnsProps, Y as GridTemplateAreasProps, Z as GridTemplateRowsProps, q as GridRowGapProps, z as GridAreaProps } from "./types-B0SNbm6V.mjs";
+import { t as grid } from "./index-DQhcFrR9.mjs";
 export { type GridAreaProps, type GridAutoColumnsProps, type GridAutoFlowProps, type GridAutoRowsProps, type GridColumnGapProps, type GridColumnProps, type GridGapProps, type GridProps, type GridRowGapProps, type GridRowProps, type GridTemplateAreasProps, type GridTemplateColumnsProps, type GridTemplateRowsProps, grid as default, grid };

package/dist/index-0k2kzlK5.d.cts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BYkO78Xl.cjs";
+import "./types-B0SNbm6V.cjs";
+//#region src/grid/grid.d.ts
+declare const grid: Parser;
+//#endregion
+export { grid as t };

package/dist/{index-lMfmNFGL.d.mts → index-BKofCDzL.d.mts}

@@ -1,5 +1,5 @@
-import { a as Parser } from "./index-C0SM54dQ.mjs";
-import "./types-BEHYHdIq.mjs";
+import { a as Parser } from "./index-BXP1-da3.mjs";
+import "./types-B0SNbm6V.mjs";
 //#region src/variant/variant.d.ts
 interface VariantOptions {
   scale?: string;

package/dist/index-BReBwT6c.d.mts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BXP1-da3.mjs";
+import "./types-B0SNbm6V.mjs";
+//#region src/typography/typography.d.ts
+declare const typography: Parser;
+//#endregion
+export { typography as t };

package/dist/{index-C0SM54dQ.d.cts → index-BXP1-da3.d.mts}

@@ -1,3 +1,4 @@
+import { t as Breakpoints } from "./media-np0uvO4C.mjs";
 import * as CSS from "csstype";
 //#region src/core/core.d.ts
 type StyleObject = Record<string, any>;
@@ -12,7 +13,7 @@ interface CSSObject extends CSS.Properties<CSSLength>, CSS.PropertiesHyphen<CSSL
   [selectorOrAtRule: string]: CSSObject | string | number | undefined;
 }
 interface Theme {
-  breakpoints?: readonly (string | number)[] | Record<string, string | number>;
+  breakpoints?: Breakpoints;
   disableStyledSystemCache?: boolean;
   [key: string]: any;
 }
@@ -39,8 +40,8 @@ type styleFn = Parser;
 type Config = SystemConfig;
 type ConfigFunction = StyleFn;
 interface ParserCache {
-  breakpoints?: readonly (string | number)[] | Record<string, string | number>;
-  media?: (string | null)[];
+  breakpoints?: Breakpoints;
+  media: (string | null)[];
 }
 interface Parser {
   (...args: any[]): any;

package/dist/{index-C0SM54dQ.d.mts → index-BYkO78Xl.d.cts}

@@ -1,3 +1,4 @@
+import { t as Breakpoints } from "./media-np0uvO4C.cjs";
 import * as CSS from "csstype";
 //#region src/core/core.d.ts
 type StyleObject = Record<string, any>;
@@ -12,7 +13,7 @@ interface CSSObject extends CSS.Properties<CSSLength>, CSS.PropertiesHyphen<CSSL
   [selectorOrAtRule: string]: CSSObject | string | number | undefined;
 }
 interface Theme {
-  breakpoints?: readonly (string | number)[] | Record<string, string | number>;
+  breakpoints?: Breakpoints;
   disableStyledSystemCache?: boolean;
   [key: string]: any;
 }
@@ -39,8 +40,8 @@ type styleFn = Parser;
 type Config = SystemConfig;
 type ConfigFunction = StyleFn;
 interface ParserCache {
-  breakpoints?: readonly (string | number)[] | Record<string, string | number>;
-  media?: (string | null)[];
+  breakpoints?: Breakpoints;
+  media: (string | null)[];
 }
 interface Parser {
   (...args: any[]): any;

package/dist/index-BhbWZw53.d.mts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BXP1-da3.mjs";
+import "./types-B0SNbm6V.mjs";
+//#region src/position/position.d.ts
+declare const position: Parser;
+//#endregion
+export { position as t };

package/dist/{index-BIbimgdO.d.mts → index-Bq7teef_.d.cts}

@@ -1,5 +1,5 @@
-import { a as Parser } from "./index-C0SM54dQ.mjs";
-import "./types-BEHYHdIq.mjs";
+import { a as Parser } from "./index-BYkO78Xl.cjs";
+import "./types-B0SNbm6V.cjs";
 //#region src/space/space.d.ts
 declare const margin: Parser;
 declare const padding: Parser;

package/dist/index-C-B6-_Ku.d.mts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BXP1-da3.mjs";
+import "./types-B0SNbm6V.mjs";
+//#region src/background/background.d.ts
+declare const background: Parser;
+//#endregion
+export { background as t };

package/dist/index-C9CxJ5Zn.d.cts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BYkO78Xl.cjs";
+import "./types-B0SNbm6V.cjs";
+//#region src/border/border.d.ts
+declare const border: Parser;
+//#endregion
+export { border as t };

package/dist/index-CIccdXWj.d.cts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BYkO78Xl.cjs";
+import "./types-B0SNbm6V.cjs";
+//#region src/flexbox/flexbox.d.ts
+declare const flexbox: Parser;
+//#endregion
+export { flexbox as t };

package/dist/index-CJT-n3Vq.d.mts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BXP1-da3.mjs";
+import "./types-B0SNbm6V.mjs";
+//#region src/color/color.d.ts
+declare const color: Parser;
+//#endregion
+export { color as t };

package/dist/index-CcorN1bQ.d.mts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BXP1-da3.mjs";
+import "./types-B0SNbm6V.mjs";
+//#region src/shadow/shadow.d.ts
+declare const shadow: Parser;
+//#endregion
+export { shadow as t };

package/dist/index-Cd_CcxMh.d.cts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BYkO78Xl.cjs";
+import "./types-B0SNbm6V.cjs";
+//#region src/color/color.d.ts
+declare const color: Parser;
+//#endregion
+export { color as t };

package/dist/index-Co0JY1hd.d.cts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BYkO78Xl.cjs";
+import "./types-B0SNbm6V.cjs";
+//#region src/shadow/shadow.d.ts
+declare const shadow: Parser;
+//#endregion
+export { shadow as t };

package/dist/index-D9dwDAhC.d.mts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BXP1-da3.mjs";
+import "./types-B0SNbm6V.mjs";
+//#region src/border/border.d.ts
+declare const border: Parser;
+//#endregion
+export { border as t };

package/dist/index-DP40bJIa.d.cts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BYkO78Xl.cjs";
+import "./types-B0SNbm6V.cjs";
+//#region src/layout/layout.d.ts
+declare const layout: Parser;
+//#endregion
+export { layout as t };

package/dist/index-DQhcFrR9.d.mts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BXP1-da3.mjs";
+import "./types-B0SNbm6V.mjs";
+//#region src/grid/grid.d.ts
+declare const grid: Parser;
+//#endregion
+export { grid as t };

package/dist/index-DcRfFIAZ.d.mts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BXP1-da3.mjs";
+import "./types-B0SNbm6V.mjs";
+//#region src/flexbox/flexbox.d.ts
+declare const flexbox: Parser;
+//#endregion
+export { flexbox as t };

package/dist/index-Dsc6RgbZ.d.cts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BYkO78Xl.cjs";
+import "./types-B0SNbm6V.cjs";
+//#region src/position/position.d.ts
+declare const position: Parser;
+//#endregion
+export { position as t };

package/dist/{index-BB5onzAO.d.cts → index-DzcXmzdT.d.cts}

@@ -1,5 +1,5 @@
-import { a as Parser } from "./index-C0SM54dQ.cjs";
-import "./types-BEHYHdIq.cjs";
+import { a as Parser } from "./index-BYkO78Xl.cjs";
+import "./types-B0SNbm6V.cjs";
 //#region src/variant/variant.d.ts
 interface VariantOptions {
   scale?: string;

package/dist/index-Q8q5VND1.d.cts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BYkO78Xl.cjs";
+import "./types-B0SNbm6V.cjs";
+//#region src/background/background.d.ts
+declare const background: Parser;
+//#endregion
+export { background as t };

package/dist/index-UGE-V15i.d.cts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BYkO78Xl.cjs";
+import "./types-B0SNbm6V.cjs";
+//#region src/typography/typography.d.ts
+declare const typography: Parser;
+//#endregion
+export { typography as t };

package/dist/index-sk97pkUE.d.mts

@@ -0,0 +1,6 @@
+import { a as Parser } from "./index-BXP1-da3.mjs";
+import "./types-B0SNbm6V.mjs";
+//#region src/layout/layout.d.ts
+declare const layout: Parser;
+//#endregion
+export { layout as t };