@soroush.tech/styled-system 5.1.6

package/dist/css-rLZ9Oeye.mjs

@@ -0,0 +1,214 @@
+//#region src/css/css.ts
+const get = (obj, key, def, p, undef) => {
+	const path = typeof key === "string" ? key.split(".") : [key];
+	let value = obj;
+	for (p = 0; p < path.length; p++) value = value ? value[path[p]] : undef;
+	return value === undef ? def : value;
+};
+const defaultBreakpoints = [
+	40,
+	52,
+	64
+].map((n) => n + "em");
+const defaultTheme = {
+	space: [
+		0,
+		4,
+		8,
+		16,
+		32,
+		64,
+		128,
+		256,
+		512
+	],
+	fontSizes: [
+		12,
+		14,
+		16,
+		20,
+		24,
+		32,
+		48,
+		64,
+		72
+	]
+};
+const aliases = {
+	bg: "backgroundColor",
+	m: "margin",
+	mt: "marginTop",
+	mr: "marginRight",
+	mb: "marginBottom",
+	ml: "marginLeft",
+	mx: "marginX",
+	my: "marginY",
+	p: "padding",
+	pt: "paddingTop",
+	pr: "paddingRight",
+	pb: "paddingBottom",
+	pl: "paddingLeft",
+	px: "paddingX",
+	py: "paddingY"
+};
+const multiples = {
+	marginX: ["marginLeft", "marginRight"],
+	marginY: ["marginTop", "marginBottom"],
+	paddingX: ["paddingLeft", "paddingRight"],
+	paddingY: ["paddingTop", "paddingBottom"],
+	size: ["width", "height"]
+};
+const scales = {
+	color: "colors",
+	backgroundColor: "colors",
+	borderColor: "colors",
+	margin: "space",
+	marginTop: "space",
+	marginRight: "space",
+	marginBottom: "space",
+	marginLeft: "space",
+	marginX: "space",
+	marginY: "space",
+	padding: "space",
+	paddingTop: "space",
+	paddingRight: "space",
+	paddingBottom: "space",
+	paddingLeft: "space",
+	paddingX: "space",
+	paddingY: "space",
+	top: "space",
+	right: "space",
+	bottom: "space",
+	left: "space",
+	gridGap: "space",
+	gridColumnGap: "space",
+	gridRowGap: "space",
+	gap: "space",
+	columnGap: "space",
+	rowGap: "space",
+	fontFamily: "fonts",
+	fontSize: "fontSizes",
+	fontWeight: "fontWeights",
+	lineHeight: "lineHeights",
+	letterSpacing: "letterSpacings",
+	border: "borders",
+	borderTop: "borders",
+	borderRight: "borders",
+	borderBottom: "borders",
+	borderLeft: "borders",
+	borderWidth: "borderWidths",
+	borderStyle: "borderStyles",
+	borderRadius: "radii",
+	borderTopRightRadius: "radii",
+	borderTopLeftRadius: "radii",
+	borderBottomRightRadius: "radii",
+	borderBottomLeftRadius: "radii",
+	borderTopWidth: "borderWidths",
+	borderTopColor: "colors",
+	borderTopStyle: "borderStyles",
+	borderBottomWidth: "borderWidths",
+	borderBottomColor: "colors",
+	borderBottomStyle: "borderStyles",
+	borderLeftWidth: "borderWidths",
+	borderLeftColor: "colors",
+	borderLeftStyle: "borderStyles",
+	borderRightWidth: "borderWidths",
+	borderRightColor: "colors",
+	borderRightStyle: "borderStyles",
+	outlineColor: "colors",
+	boxShadow: "shadows",
+	textShadow: "shadows",
+	zIndex: "zIndices",
+	width: "sizes",
+	minWidth: "sizes",
+	maxWidth: "sizes",
+	height: "sizes",
+	minHeight: "sizes",
+	maxHeight: "sizes",
+	flexBasis: "sizes",
+	size: "sizes",
+	fill: "colors",
+	stroke: "colors"
+};
+const positiveOrNegative = (scale, value) => {
+	if (typeof value !== "number" || value >= 0) return get(scale, value, value);
+	const absolute = Math.abs(value);
+	const n = get(scale, absolute, absolute);
+	if (typeof n === "string") return "-" + n;
+	return n * -1;
+};
+const transforms = [
+	"margin",
+	"marginTop",
+	"marginRight",
+	"marginBottom",
+	"marginLeft",
+	"marginX",
+	"marginY",
+	"top",
+	"bottom",
+	"left",
+	"right"
+].reduce((acc, curr) => ({
+	...acc,
+	[curr]: positiveOrNegative
+}), {});
+const responsive = (styles) => (theme) => {
+	const next = {};
+	const mediaQueries = [null, ...get(theme, "breakpoints", defaultBreakpoints).map((n) => `@media screen and (min-width: ${n})`)];
+	for (const key in styles) {
+		const value = typeof styles[key] === "function" ? styles[key](theme) : styles[key];
+		if (value == null) continue;
+		if (!Array.isArray(value)) {
+			next[key] = value;
+			continue;
+		}
+		const slice = value.slice(0, mediaQueries.length);
+		for (let i = 0; i < slice.length; i++) {
+			const media = mediaQueries[i];
+			if (!media) {
+				next[key] = slice[i];
+				continue;
+			}
+			const block = next[media] || {};
+			next[media] = block;
+			if (slice[i] == null) continue;
+			block[key] = slice[i];
+		}
+	}
+	return next;
+};
+const css = (args) => (props = {}) => {
+	const theme = {
+		...defaultTheme,
+		...props.theme || props
+	};
+	let result = {};
+	const styles = responsive(typeof args === "function" ? args(theme) : args)(theme);
+	for (const key in styles) {
+		const x = styles[key];
+		const val = typeof x === "function" ? x(theme) : x;
+		if (key === "variant") {
+			const variant = css(get(theme, val))(theme);
+			result = {
+				...result,
+				...variant
+			};
+			continue;
+		}
+		if (val && typeof val === "object") {
+			result[key] = css(val)(theme);
+			continue;
+		}
+		const prop = get(aliases, key, key);
+		const scale = get(theme, get(scales, prop), get(theme, prop, {}));
+		const value = get(transforms, prop, get)(scale, val, val);
+		if (multiples[prop]) {
+			const dirs = multiples[prop];
+			for (let i = 0; i < dirs.length; i++) result[dirs[i]] = value;
+		} else result[prop] = value;
+	}
+	return result;
+};
+//#endregion
+export { get as n, responsive as r, css as t };

package/dist/css.cjs

@@ -0,0 +1,9 @@
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
+const require_css = require("./css-nzeM_Xnf.cjs");
+exports.css = require_css.css;
+exports.default = require_css.css;
+exports.get = require_css.get;
+exports.responsive = require_css.responsive;

package/dist/css.d.cts

@@ -0,0 +1,12 @@
+//#region src/css/css.d.ts
+type CssObject = Record<string, unknown>;
+interface CssTheme {
+  breakpoints?: (string | number)[];
+  [key: string]: unknown;
+}
+type CssArg = CssObject | ((theme: CssTheme) => CssObject);
+declare const get: (obj: unknown, key?: string | number, def?: unknown, p?: number, undef?: unknown) => unknown;
+declare const responsive: (styles: CssObject) => (theme: CssTheme) => CssObject;
+declare const css: (args: CssArg) => (props?: Record<string, unknown>) => CssObject;
+//#endregion
+export { CssObject, CssTheme, css, css as default, get, responsive };

package/dist/css.d.mts

@@ -0,0 +1,12 @@
+//#region src/css/css.d.ts
+type CssObject = Record<string, unknown>;
+interface CssTheme {
+  breakpoints?: (string | number)[];
+  [key: string]: unknown;
+}
+type CssArg = CssObject | ((theme: CssTheme) => CssObject);
+declare const get: (obj: unknown, key?: string | number, def?: unknown, p?: number, undef?: unknown) => unknown;
+declare const responsive: (styles: CssObject) => (theme: CssTheme) => CssObject;
+declare const css: (args: CssArg) => (props?: Record<string, unknown>) => CssObject;
+//#endregion
+export { CssObject, CssTheme, css, css as default, get, responsive };

package/dist/css.mjs

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

package/dist/flexbox-CFkO6PrP.cjs

@@ -0,0 +1,22 @@
+const flexbox = require("./core.cjs").system({
+	alignItems: true,
+	alignContent: true,
+	justifyItems: true,
+	justifyContent: true,
+	flexWrap: true,
+	flexDirection: true,
+	flex: true,
+	flexGrow: true,
+	flexShrink: true,
+	flexBasis: true,
+	justifySelf: true,
+	alignSelf: true,
+	order: true
+});
+//#endregion
+Object.defineProperty(exports, "flexbox", {
+	enumerable: true,
+	get: function() {
+		return flexbox;
+	}
+});

package/dist/flexbox-XQnlnfa4.mjs

@@ -0,0 +1,18 @@
+import { system } from "./core.mjs";
+const flexbox = system({
+	alignItems: true,
+	alignContent: true,
+	justifyItems: true,
+	justifyContent: true,
+	flexWrap: true,
+	flexDirection: true,
+	flex: true,
+	flexGrow: true,
+	flexShrink: true,
+	flexBasis: true,
+	justifySelf: true,
+	alignSelf: true,
+	order: true
+});
+//#endregion
+export { flexbox as t };

package/dist/flexbox.cjs

@@ -0,0 +1,7 @@
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
+const require_flexbox = require("./flexbox-CFkO6PrP.cjs");
+exports.default = require_flexbox.flexbox;
+exports.flexbox = require_flexbox.flexbox;

package/dist/flexbox.d.cts

@@ -0,0 +1,2 @@
+import { t as flexbox } from "./index-BS9GuhQN.cjs";
+export { flexbox as default, flexbox };

package/dist/flexbox.d.mts

@@ -0,0 +1,2 @@
+import { t as flexbox } from "./index-CX2jWEGJ.mjs";
+export { flexbox as default, flexbox };

package/dist/flexbox.mjs

@@ -0,0 +1,2 @@
+import { t as flexbox } from "./flexbox-XQnlnfa4.mjs";
+export { flexbox as default, flexbox };

package/dist/grid-Bpk-QjhF.mjs

@@ -0,0 +1,41 @@
+import { system } from "./core.mjs";
+//#region src/grid/grid.ts
+const spaceScale = [
+	0,
+	4,
+	8,
+	16,
+	32,
+	64,
+	128,
+	256,
+	512
+];
+const grid = system({
+	gridGap: {
+		property: "gridGap",
+		scale: "space",
+		defaultScale: spaceScale
+	},
+	gridColumnGap: {
+		property: "gridColumnGap",
+		scale: "space",
+		defaultScale: spaceScale
+	},
+	gridRowGap: {
+		property: "gridRowGap",
+		scale: "space",
+		defaultScale: spaceScale
+	},
+	gridColumn: true,
+	gridRow: true,
+	gridAutoFlow: true,
+	gridAutoColumns: true,
+	gridAutoRows: true,
+	gridTemplateColumns: true,
+	gridTemplateRows: true,
+	gridTemplateAreas: true,
+	gridArea: true
+});
+//#endregion
+export { grid as t };

package/dist/grid-CpvRIng4.cjs

@@ -0,0 +1,47 @@
+const require_core = require("./core.cjs");
+//#region src/grid/grid.ts
+const spaceScale = [
+	0,
+	4,
+	8,
+	16,
+	32,
+	64,
+	128,
+	256,
+	512
+];
+const config = {
+	gridGap: {
+		property: "gridGap",
+		scale: "space",
+		defaultScale: spaceScale
+	},
+	gridColumnGap: {
+		property: "gridColumnGap",
+		scale: "space",
+		defaultScale: spaceScale
+	},
+	gridRowGap: {
+		property: "gridRowGap",
+		scale: "space",
+		defaultScale: spaceScale
+	},
+	gridColumn: true,
+	gridRow: true,
+	gridAutoFlow: true,
+	gridAutoColumns: true,
+	gridAutoRows: true,
+	gridTemplateColumns: true,
+	gridTemplateRows: true,
+	gridTemplateAreas: true,
+	gridArea: true
+};
+const grid = require_core.system(config);
+//#endregion
+Object.defineProperty(exports, "grid", {
+	enumerable: true,
+	get: function() {
+		return grid;
+	}
+});

package/dist/grid.cjs

@@ -0,0 +1,7 @@
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
+const require_grid = require("./grid-CpvRIng4.cjs");
+exports.default = require_grid.grid;
+exports.grid = require_grid.grid;

package/dist/grid.d.cts

@@ -0,0 +1,2 @@
+import { t as grid } from "./index-Ce09s0FQ.cjs";
+export { grid as default, grid };

package/dist/grid.d.mts

@@ -0,0 +1,2 @@
+import { t as grid } from "./index-J3PebPto.mjs";
+export { grid as default, grid };

package/dist/grid.mjs

@@ -0,0 +1,2 @@
+import { t as grid } from "./grid-Bpk-QjhF.mjs";
+export { grid as default, grid };

package/dist/index-50KH4Mo7.d.cts

@@ -0,0 +1,8 @@
+import { r as Parser } from "./index-D8EyRZ5p.cjs";
+
+//#region src/space/space.d.ts
+declare const margin: Parser;
+declare const padding: Parser;
+declare const space: Parser;
+//#endregion
+export { padding as n, space as r, margin as t };

package/dist/index-8PSQ0vkP.d.cts

@@ -0,0 +1,15 @@
+import { r as Parser } from "./index-D8EyRZ5p.cjs";
+
+//#region src/variant/variant.d.ts
+interface VariantOptions {
+  scale?: string;
+  prop?: string;
+  variants?: Record<string, unknown>;
+  key?: string;
+}
+declare const variant: (options?: VariantOptions) => Parser;
+declare const buttonStyle: Parser;
+declare const textStyle: Parser;
+declare const colorStyle: Parser;
+//#endregion
+export { variant as a, textStyle as i, buttonStyle as n, colorStyle as r, VariantOptions as t };

package/dist/index-9ZhIewzy.d.mts

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

package/dist/index-BBTVE4EM.d.mts

@@ -0,0 +1,15 @@
+import { r as Parser } from "./index-D8EyRZ5p.mjs";
+
+//#region src/variant/variant.d.ts
+interface VariantOptions {
+  scale?: string;
+  prop?: string;
+  variants?: Record<string, unknown>;
+  key?: string;
+}
+declare const variant: (options?: VariantOptions) => Parser;
+declare const buttonStyle: Parser;
+declare const textStyle: Parser;
+declare const colorStyle: Parser;
+//#endregion
+export { variant as a, textStyle as i, buttonStyle as n, colorStyle as r, VariantOptions as t };

package/dist/index-BS9GuhQN.d.cts

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

package/dist/index-BoMacn6F.d.cts

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

package/dist/index-Bx7IxKu-.d.mts

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

package/dist/index-C13YRARN.d.mts

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

package/dist/index-C3_fScux.d.mts

@@ -0,0 +1,8 @@
+import { r as Parser } from "./index-D8EyRZ5p.mjs";
+
+//#region src/space/space.d.ts
+declare const margin: Parser;
+declare const padding: Parser;
+declare const space: Parser;
+//#endregion
+export { padding as n, space as r, margin as t };

package/dist/index-CX2jWEGJ.d.mts

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

package/dist/index-CarHCWLQ.d.cts

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

package/dist/index-Ce09s0FQ.d.cts

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

package/dist/index-CrUx2vIP.d.mts

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

package/dist/index-CsS_gcI9.d.mts

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

package/dist/index-D3t1Lyte.d.mts

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

package/dist/index-D8EyRZ5p.d.cts

@@ -0,0 +1,62 @@
+import * as CSS from "csstype";
+
+//#region src/core/core.d.ts
+type StyleObject = Record<string, unknown>;
+type CSSLength = string | number;
+/**
+ * A CSS-in-JS style object: typed CSS properties plus nested selectors, at-rules
+ * (media queries), and pseudo-classes. Structurally compatible with the `CSSObject`
+ * of Emotion and styled-components, so a {@link Parser} can be dropped straight into
+ * either engine's `styled()` as an interpolation.
+ */
+interface CSSObject extends CSS.Properties<CSSLength>, CSS.PropertiesHyphen<CSSLength> {
+  [selectorOrAtRule: string]: CSSObject | string | number | undefined;
+}
+interface Theme {
+  breakpoints?: readonly (string | number)[] | Record<string, string | number>;
+  disableStyledSystemCache?: boolean;
+  [key: string]: unknown;
+}
+interface Props {
+  theme?: Theme;
+  [key: string]: unknown;
+}
+type Transform = (value: unknown, scale?: unknown, props?: Props) => unknown;
+interface StyleFn {
+  (value: unknown, scale?: unknown, props?: Props): StyleObject | undefined;
+  scale?: string;
+  defaults?: unknown;
+}
+interface ConfigStyle {
+  property?: string;
+  properties?: string[];
+  scale?: string;
+  transform?: Transform;
+  defaultScale?: unknown;
+}
+type SystemConfig = Record<string, boolean | StyleFn | ConfigStyle>;
+type ParserConfig = Record<string, StyleFn>;
+interface ParserCache {
+  breakpoints?: readonly (string | number)[] | Record<string, string | number>;
+  media?: (string | null)[];
+}
+interface Parser {
+  (...args: any[]): any;
+  config: ParserConfig;
+  propNames: string[];
+  cache: ParserCache;
+}
+declare const merge: (a: StyleObject, b: StyleObject) => StyleObject;
+declare const get: (obj: any, key?: string | number, def?: any, p?: number, undef?: any) => any;
+declare const createParser: (config: ParserConfig) => Parser;
+declare const createStyleFunction: ({
+  properties,
+  property,
+  scale,
+  transform,
+  defaultScale
+}: ConfigStyle) => StyleFn;
+declare const system: (args?: SystemConfig) => Parser;
+declare const compose: (...parsers: (Parser | undefined)[]) => Parser;
+//#endregion
+export { Props as a, SystemConfig as c, compose as d, createParser as f, system as g, merge as h, ParserConfig as i, Theme as l, get as m, ConfigStyle as n, StyleFn as o, createStyleFunction as p, Parser as r, StyleObject as s, CSSObject as t, Transform as u };