@animus-ui/core 0.0.1-4da3a7b2.0

package/dist/index.d.ts

@@ -0,0 +1,1597 @@
+export * from './types/props';
+export * from './types/theme';
+export * from './types/utils';
+export * from './scales/createScale';
+export * from './configBuilder';
+export * from './createAnimus';
+export * from './transforms';
+export declare const coreConfig: import("./configBuilder").AnimusConfig<{
+    readonly p: {
+        readonly property: "padding";
+        readonly scale: "spacing";
+    };
+    readonly px: {
+        readonly property: "padding";
+        readonly properties: readonly ["paddingLeft", "paddingRight"];
+        readonly scale: "spacing";
+    };
+    readonly py: {
+        readonly property: "padding";
+        readonly properties: readonly ["paddingTop", "paddingBottom"];
+        readonly scale: "spacing";
+    };
+    readonly pt: {
+        readonly property: "paddingTop";
+        readonly scale: "spacing";
+    };
+    readonly pb: {
+        readonly property: "paddingBottom";
+        readonly scale: "spacing";
+    };
+    readonly pr: {
+        readonly property: "paddingRight";
+        readonly scale: "spacing";
+    };
+    readonly pl: {
+        readonly property: "paddingLeft";
+        readonly scale: "spacing";
+    };
+    readonly m: {
+        readonly property: "margin";
+        readonly scale: "spacing";
+    };
+    readonly mx: {
+        readonly property: "margin";
+        readonly properties: readonly ["marginLeft", "marginRight"];
+        readonly scale: "spacing";
+    };
+    readonly my: {
+        readonly property: "margin";
+        readonly properties: readonly ["marginTop", "marginBottom"];
+        readonly scale: "spacing";
+    };
+    readonly mt: {
+        readonly property: "marginTop";
+        readonly scale: "spacing";
+    };
+    readonly mb: {
+        readonly property: "marginBottom";
+        readonly scale: "spacing";
+    };
+    readonly mr: {
+        readonly property: "marginRight";
+        readonly scale: "spacing";
+    };
+    readonly ml: {
+        readonly property: "marginLeft";
+        readonly scale: "spacing";
+    };
+} & {
+    readonly background: {
+        readonly property: "background";
+    };
+    readonly backgroundImage: {
+        readonly property: "backgroundImage";
+    };
+    readonly backgroundSize: {
+        readonly property: "backgroundSize";
+    };
+    readonly backgroundRepeat: {
+        readonly property: "backgroundRepeat";
+    };
+    readonly backgroundPosition: {
+        readonly property: "backgroundPosition";
+    };
+} & {
+    readonly flexBasis: {
+        readonly property: "flexBasis";
+    };
+    readonly flexShrink: {
+        readonly property: "flexShrink";
+    };
+    readonly flexGrow: {
+        readonly property: "flexGrow";
+    };
+    readonly order: {
+        readonly property: "order";
+    };
+    readonly gridColumn: {
+        readonly property: "gridColumn";
+    };
+    readonly gridRow: {
+        readonly property: "gridRow";
+    };
+    readonly gridColumnStart: {
+        readonly property: "gridColumnStart";
+    };
+    readonly gridRowStart: {
+        readonly property: "gridRowStart";
+    };
+    readonly gridColumnEnd: {
+        readonly property: "gridColumnEnd";
+    };
+    readonly gridRowEnd: {
+        readonly property: "gridRowEnd";
+    };
+    readonly justifySelf: {
+        readonly property: "justifySelf";
+    };
+    readonly alignSelf: {
+        readonly property: "alignSelf";
+    };
+    readonly gridArea: {
+        readonly property: "gridArea";
+    };
+    readonly area: {
+        readonly property: "gridArea";
+    };
+    readonly display: {
+        readonly property: "display";
+    };
+    readonly overflow: {
+        readonly property: "overflow";
+    };
+    readonly overflowX: {
+        readonly property: "overflowX";
+    };
+    readonly overflowY: {
+        readonly property: "overflowY";
+    };
+    readonly size: {
+        readonly property: "width";
+        readonly properties: readonly ["width", "height"];
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly width: {
+        readonly property: "width";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly minWidth: {
+        readonly property: "minWidth";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly maxWidth: {
+        readonly property: "maxWidth";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly height: {
+        readonly property: "height";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly minHeight: {
+        readonly property: "minHeight";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly maxHeight: {
+        readonly property: "maxHeight";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly verticalAlign: {
+        readonly property: "verticalAlign";
+    };
+} & {
+    readonly color: {
+        readonly property: "color";
+        readonly scale: "colors";
+    };
+    readonly textColor: {
+        readonly property: "color";
+        readonly scale: "colors";
+    };
+    readonly bg: {
+        readonly property: "backgroundColor";
+        readonly scale: "colors";
+    };
+    readonly borderColor: {
+        readonly property: "borderColor";
+        readonly scale: "colors";
+    };
+    readonly borderColorX: {
+        readonly property: "borderColor";
+        readonly properties: readonly ["borderLeftColor", "borderRightColor"];
+        readonly scale: "colors";
+    };
+    readonly borderColorY: {
+        readonly property: "borderColor";
+        readonly properties: readonly ["borderTopColor", "borderBottomColor"];
+        readonly scale: "colors";
+    };
+    readonly borderColorLeft: {
+        readonly property: "borderLeftColor";
+        readonly scale: "colors";
+    };
+    readonly borderColorRight: {
+        readonly property: "borderRightColor";
+        readonly scale: "colors";
+    };
+    readonly borderColorTop: {
+        readonly property: "borderTopColor";
+        readonly scale: "colors";
+    };
+    readonly borderColorBottom: {
+        readonly property: "borderBottomColor";
+        readonly scale: "colors";
+    };
+} & {
+    readonly fontFamily: {
+        readonly property: "fontFamily";
+        readonly scale: "fontFamily";
+    };
+    readonly fontWeight: {
+        readonly property: "fontWeight";
+        readonly scale: {
+            readonly 400: 400;
+            readonly 600: 600;
+            readonly 700: 700;
+        };
+    };
+    readonly lineHeight: {
+        readonly property: "lineHeight";
+        readonly scale: "lineHeight";
+        readonly lineHeight: readonly [1, 1.5];
+    };
+    readonly fontSize: {
+        readonly property: "fontSize";
+        readonly scale: {
+            readonly 64: 64;
+            readonly 44: 44;
+            readonly 34: 34;
+            readonly 26: 26;
+            readonly 22: 22;
+            readonly 20: 20;
+            readonly 18: 18;
+            readonly 16: 16;
+            readonly 14: 14;
+        };
+    };
+    readonly letterSpacing: {
+        readonly property: "letterSpacing";
+    };
+    readonly textAlign: {
+        readonly property: "textAlign";
+    };
+    readonly fontStyle: {
+        readonly property: "fontStyle";
+    };
+    readonly textDecoration: {
+        readonly property: "textDecoration";
+    };
+    readonly textTransform: {
+        readonly property: "textTransform";
+    };
+    readonly whiteSpace: {
+        readonly property: "whiteSpace";
+    };
+} & {
+    readonly boxShadow: {
+        readonly property: "boxShadow";
+    };
+    readonly textShadow: {
+        readonly property: "textShadow";
+    };
+} & {
+    readonly border: {
+        readonly property: "border";
+        readonly scale: "borders";
+    };
+    readonly borderX: {
+        readonly property: "border";
+        readonly properties: readonly ["borderLeft", "borderRight"];
+        readonly scale: "borders";
+    };
+    readonly borderY: {
+        readonly property: "border";
+        readonly properties: readonly ["borderTop", "borderBottom"];
+        readonly scale: "borders";
+    };
+    readonly borderTop: {
+        readonly property: "borderTop";
+        readonly scale: "borders";
+    };
+    readonly borderRight: {
+        readonly property: "borderRight";
+        readonly scale: "borders";
+    };
+    readonly borderBottom: {
+        readonly property: "borderBottom";
+        readonly scale: "borders";
+    };
+    readonly borderLeft: {
+        readonly property: "borderLeft";
+        readonly scale: "borders";
+    };
+    readonly borderWidth: {
+        readonly property: "borderWidth";
+    };
+    readonly borderWidthX: {
+        readonly property: "borderWidth";
+        readonly properties: readonly ["borderLeftWidth", "borderRightWidth"];
+    };
+    readonly borderWidthY: {
+        readonly property: "borderWidth";
+        readonly properties: readonly ["borderTopWidth", "borderBottomWidth"];
+    };
+    readonly borderWidthLeft: {
+        readonly property: "borderLeftWidth";
+    };
+    readonly borderWidthRight: {
+        readonly property: "borderRightWidth";
+    };
+    readonly borderWidthTop: {
+        readonly property: "borderTopWidth";
+    };
+    readonly borderWidthBottom: {
+        readonly property: "borderBottomWidth";
+    };
+    readonly borderRadius: {
+        readonly property: "borderRadius";
+        readonly scale: "radii";
+    };
+    readonly borderRadiusLeft: {
+        readonly property: "borderRadius";
+        readonly properties: readonly ["borderTopLeftRadius", "borderBottomLeftRadius"];
+        readonly scale: "radii";
+    };
+    readonly borderRadiusTop: {
+        readonly property: "borderRadius";
+        readonly properties: readonly ["borderTopLeftRadius", "borderTopRightRadius"];
+        readonly scale: "radii";
+    };
+    readonly borderRadiusBottom: {
+        readonly property: "borderRadius";
+        readonly properties: readonly ["borderBottomLeftRadius", "borderBottomRightRadius"];
+        readonly scale: "radii";
+    };
+    readonly borderRadiusRight: {
+        readonly property: "borderRadius";
+        readonly properties: readonly ["borderTopRightRadius", "borderBottomRightRadius"];
+        readonly scale: "radii";
+    };
+    readonly borderRadiusTopLeft: {
+        readonly property: "borderTopLeftRadius";
+        readonly scale: "radii";
+    };
+    readonly borderRadiusTopRight: {
+        readonly property: "borderTopRightRadius";
+        readonly scale: "radii";
+    };
+    readonly borderRadiusBottomRight: {
+        readonly property: "borderBottomRightRadius";
+        readonly scale: "radii";
+    };
+    readonly borderRadiusBottomLeft: {
+        readonly property: "borderBottomLeftRadius";
+        readonly scale: "radii";
+    };
+    readonly borderStyle: {
+        readonly property: "borderStyle";
+    };
+    readonly borderStyleX: {
+        readonly property: "borderStyle";
+        readonly properties: readonly ["borderLeftStyle", "borderRightStyle"];
+    };
+    readonly borderStyleY: {
+        readonly property: "borderStyle";
+        readonly properties: readonly ["borderTopStyle", "borderBottomStyle"];
+    };
+    readonly borderStyleLeft: {
+        readonly property: "borderLeftStyle";
+    };
+    readonly borderStyleRight: {
+        readonly property: "borderRightStyle";
+    };
+    readonly borderStyleTop: {
+        readonly property: "borderTopStyle";
+    };
+    readonly borderStyleBottom: {
+        readonly property: "borderBottomStyle";
+    };
+} & {
+    readonly position: {
+        readonly property: "position";
+    };
+    readonly inset: {
+        readonly property: "inset";
+        readonly properties: readonly ["top", "right", "bottom", "left"];
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly top: {
+        readonly property: "top";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly right: {
+        readonly property: "right";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly bottom: {
+        readonly property: "bottom";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly left: {
+        readonly property: "left";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly zIndex: {
+        readonly property: "zIndex";
+    };
+    readonly opacity: {
+        readonly property: "opacity";
+    };
+} & {
+    readonly flexBasis: {
+        readonly property: "flexBasis";
+    };
+    readonly flexShrink: {
+        readonly property: "flexShrink";
+    };
+    readonly flexGrow: {
+        readonly property: "flexGrow";
+    };
+    readonly order: {
+        readonly property: "order";
+    };
+    readonly justifySelf: {
+        readonly property: "justifySelf";
+    };
+    readonly alignSelf: {
+        readonly property: "alignSelf";
+    };
+    readonly gridArea: {
+        readonly property: "gridArea";
+    };
+    readonly area: {
+        readonly property: "gridArea";
+    };
+    readonly justifyContent: {
+        readonly property: "justifyContent";
+    };
+    readonly justifyItems: {
+        readonly property: "justifyItems";
+    };
+    readonly alignItems: {
+        readonly property: "alignItems";
+    };
+    readonly alignContent: {
+        readonly property: "alignContent";
+    };
+    readonly flexDirection: {
+        readonly property: "flexDirection";
+    };
+    readonly flexWrap: {
+        readonly property: "flexWrap";
+    };
+    readonly flex: {
+        readonly property: "flex";
+    };
+} & {
+    readonly gridColumn: {
+        readonly property: "gridColumn";
+    };
+    readonly gridRow: {
+        readonly property: "gridRow";
+    };
+    readonly gridColumnStart: {
+        readonly property: "gridColumnStart";
+    };
+    readonly gridRowStart: {
+        readonly property: "gridRowStart";
+    };
+    readonly gridColumnEnd: {
+        readonly property: "gridColumnEnd";
+    };
+    readonly gridRowEnd: {
+        readonly property: "gridRowEnd";
+    };
+    readonly justifySelf: {
+        readonly property: "justifySelf";
+    };
+    readonly alignSelf: {
+        readonly property: "alignSelf";
+    };
+    readonly gridArea: {
+        readonly property: "gridArea";
+    };
+    readonly area: {
+        readonly property: "gridArea";
+    };
+    readonly justifyContent: {
+        readonly property: "justifyContent";
+    };
+    readonly justifyItems: {
+        readonly property: "justifyItems";
+    };
+    readonly alignItems: {
+        readonly property: "alignItems";
+    };
+    readonly alignContent: {
+        readonly property: "alignContent";
+    };
+    readonly gridAutoColumns: {
+        readonly property: "gridAutoColumns";
+    };
+    readonly gridAutoRows: {
+        readonly property: "gridAutoRows";
+    };
+    readonly gridTemplateColumns: {
+        readonly property: "gridTemplateColumns";
+    };
+    readonly gridTemplateRows: {
+        readonly property: "gridTemplateRows";
+    };
+    readonly gridTemplateAreas: {
+        readonly property: "gridTemplateAreas";
+    };
+    readonly gridAutoFlow: {
+        readonly property: "gridAutoFlow";
+    };
+    readonly gap: {
+        readonly property: "gap";
+        readonly scale: "spacing";
+    };
+    readonly rowGap: {
+        readonly property: "rowGap";
+        readonly scale: "spacing";
+    };
+    readonly columnGap: {
+        readonly property: "columnGap";
+        readonly scale: "spacing";
+    };
+    readonly flow: {
+        readonly property: "gridAutoFlow";
+        readonly scale: {
+            readonly row: "row";
+            readonly column: "column";
+            readonly dense: "dense";
+            readonly 'column-dense': "column dense";
+            readonly 'row-dense': "row dense";
+        };
+    };
+    readonly cols: {
+        readonly property: "gridTemplateColumns";
+        readonly transform: (val: string | number) => string;
+        readonly scale: readonly (string | number)[] & {
+            length: 0;
+        };
+    };
+    readonly rows: {
+        readonly property: "gridTemplateRows";
+        readonly transform: (val: string | number) => string;
+        readonly scale: readonly (string | number)[] & {
+            length: 0;
+        };
+    };
+    readonly autoRows: {
+        readonly property: "gridAutoRows";
+        readonly transform: (item: string) => string;
+    };
+    readonly autoCols: {
+        readonly property: "gridAutoColumns";
+        readonly transform: (item: string) => string;
+    };
+    readonly alignAll: {
+        readonly property: "justifyContent";
+        readonly properties: readonly ["justifyContent", "alignItems"];
+    };
+} & {
+    readonly mode: {
+        readonly property: "none";
+        readonly scale: "mode";
+    };
+    readonly vars: {
+        readonly property: "variables";
+    };
+}, Record<"space", ("p" | "px" | "py" | "pt" | "pb" | "pr" | "pl" | "m" | "mx" | "my" | "mt" | "mb" | "mr" | "ml")[]> & Record<"background", ("backgroundImage" | "backgroundRepeat" | "backgroundSize" | "background" | "backgroundPosition")[]> & Record<"layout", ("alignSelf" | "display" | "flexBasis" | "flexGrow" | "flexShrink" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "height" | "justifySelf" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "overflowX" | "overflowY" | "verticalAlign" | "width" | "gridArea" | "gridColumn" | "gridRow" | "overflow" | "area" | "size")[]> & Record<"color", ("color" | "borderColor" | "textColor" | "bg" | "borderColorX" | "borderColorY" | "borderColorLeft" | "borderColorRight" | "borderColorTop" | "borderColorBottom")[]> & Record<"typography", ("fontSize" | "letterSpacing" | "fontFamily" | "fontWeight" | "lineHeight" | "fontStyle" | "textAlign" | "textTransform" | "whiteSpace" | "textDecoration")[]> & Record<"shadows", ("boxShadow" | "textShadow")[]> & Record<"borders", ("border" | "borderBottom" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "borderX" | "borderY" | "borderWidthX" | "borderWidthY" | "borderWidthLeft" | "borderWidthRight" | "borderWidthTop" | "borderWidthBottom" | "borderRadiusLeft" | "borderRadiusTop" | "borderRadiusBottom" | "borderRadiusRight" | "borderRadiusTopLeft" | "borderRadiusTopRight" | "borderRadiusBottomRight" | "borderRadiusBottomLeft" | "borderStyleX" | "borderStyleY" | "borderStyleLeft" | "borderStyleRight" | "borderStyleTop" | "borderStyleBottom")[]> & Record<"positioning", ("bottom" | "inset" | "left" | "opacity" | "position" | "right" | "top" | "zIndex")[]> & Record<"flex", ("alignContent" | "alignItems" | "alignSelf" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "justifyContent" | "justifyItems" | "justifySelf" | "order" | "flex" | "gridArea" | "area")[]> & Record<"grid", ("alignContent" | "alignItems" | "alignSelf" | "columnGap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "rowGap" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "area" | "flow" | "cols" | "rows" | "autoRows" | "autoCols" | "alignAll")[]> & Record<"mode", ("mode" | "vars")[]>>;
+export declare const animus: import("./animusBuilder").Animus<{
+    props: {
+        readonly p: {
+            readonly property: "padding";
+            readonly scale: "spacing";
+        };
+        readonly px: {
+            readonly property: "padding";
+            readonly properties: readonly ["paddingLeft", "paddingRight"];
+            readonly scale: "spacing";
+        };
+        readonly py: {
+            readonly property: "padding";
+            readonly properties: readonly ["paddingTop", "paddingBottom"];
+            readonly scale: "spacing";
+        };
+        readonly pt: {
+            readonly property: "paddingTop";
+            readonly scale: "spacing";
+        };
+        readonly pb: {
+            readonly property: "paddingBottom";
+            readonly scale: "spacing";
+        };
+        readonly pr: {
+            readonly property: "paddingRight";
+            readonly scale: "spacing";
+        };
+        readonly pl: {
+            readonly property: "paddingLeft";
+            readonly scale: "spacing";
+        };
+        readonly m: {
+            readonly property: "margin";
+            readonly scale: "spacing";
+        };
+        readonly mx: {
+            readonly property: "margin";
+            readonly properties: readonly ["marginLeft", "marginRight"];
+            readonly scale: "spacing";
+        };
+        readonly my: {
+            readonly property: "margin";
+            readonly properties: readonly ["marginTop", "marginBottom"];
+            readonly scale: "spacing";
+        };
+        readonly mt: {
+            readonly property: "marginTop";
+            readonly scale: "spacing";
+        };
+        readonly mb: {
+            readonly property: "marginBottom";
+            readonly scale: "spacing";
+        };
+        readonly mr: {
+            readonly property: "marginRight";
+            readonly scale: "spacing";
+        };
+        readonly ml: {
+            readonly property: "marginLeft";
+            readonly scale: "spacing";
+        };
+        readonly background: {
+            readonly property: "background";
+        };
+        readonly backgroundImage: {
+            readonly property: "backgroundImage";
+        };
+        readonly backgroundSize: {
+            readonly property: "backgroundSize";
+        };
+        readonly backgroundRepeat: {
+            readonly property: "backgroundRepeat";
+        };
+        readonly backgroundPosition: {
+            readonly property: "backgroundPosition";
+        };
+        readonly flexBasis: {
+            readonly property: "flexBasis";
+        };
+        readonly flexShrink: {
+            readonly property: "flexShrink";
+        };
+        readonly flexGrow: {
+            readonly property: "flexGrow";
+        };
+        readonly order: {
+            readonly property: "order";
+        };
+        readonly gridColumn: {
+            readonly property: "gridColumn";
+        };
+        readonly gridRow: {
+            readonly property: "gridRow";
+        };
+        readonly gridColumnStart: {
+            readonly property: "gridColumnStart";
+        };
+        readonly gridRowStart: {
+            readonly property: "gridRowStart";
+        };
+        readonly gridColumnEnd: {
+            readonly property: "gridColumnEnd";
+        };
+        readonly gridRowEnd: {
+            readonly property: "gridRowEnd";
+        };
+        readonly justifySelf: {
+            readonly property: "justifySelf";
+        };
+        readonly alignSelf: {
+            readonly property: "alignSelf";
+        };
+        readonly gridArea: {
+            readonly property: "gridArea";
+        };
+        readonly area: {
+            readonly property: "gridArea";
+        };
+        readonly display: {
+            readonly property: "display";
+        };
+        readonly overflow: {
+            readonly property: "overflow";
+        };
+        readonly overflowX: {
+            readonly property: "overflowX";
+        };
+        readonly overflowY: {
+            readonly property: "overflowY";
+        };
+        readonly size: {
+            readonly property: "width";
+            readonly properties: readonly ["width", "height"];
+            readonly transform: (value: string | number) => string | 0;
+        };
+        readonly width: {
+            readonly property: "width";
+            readonly transform: (value: string | number) => string | 0;
+        };
+        readonly minWidth: {
+            readonly property: "minWidth";
+            readonly transform: (value: string | number) => string | 0;
+        };
+        readonly maxWidth: {
+            readonly property: "maxWidth";
+            readonly transform: (value: string | number) => string | 0;
+        };
+        readonly height: {
+            readonly property: "height";
+            readonly transform: (value: string | number) => string | 0;
+        };
+        readonly minHeight: {
+            readonly property: "minHeight";
+            readonly transform: (value: string | number) => string | 0;
+        };
+        readonly maxHeight: {
+            readonly property: "maxHeight";
+            readonly transform: (value: string | number) => string | 0;
+        };
+        readonly verticalAlign: {
+            readonly property: "verticalAlign";
+        };
+        readonly color: {
+            readonly property: "color";
+            readonly scale: "colors";
+        };
+        readonly textColor: {
+            readonly property: "color";
+            readonly scale: "colors";
+        };
+        readonly bg: {
+            readonly property: "backgroundColor";
+            readonly scale: "colors";
+        };
+        readonly borderColor: {
+            readonly property: "borderColor";
+            readonly scale: "colors";
+        };
+        readonly borderColorX: {
+            readonly property: "borderColor";
+            readonly properties: readonly ["borderLeftColor", "borderRightColor"];
+            readonly scale: "colors";
+        };
+        readonly borderColorY: {
+            readonly property: "borderColor";
+            readonly properties: readonly ["borderTopColor", "borderBottomColor"];
+            readonly scale: "colors";
+        };
+        readonly borderColorLeft: {
+            readonly property: "borderLeftColor";
+            readonly scale: "colors";
+        };
+        readonly borderColorRight: {
+            readonly property: "borderRightColor";
+            readonly scale: "colors";
+        };
+        readonly borderColorTop: {
+            readonly property: "borderTopColor";
+            readonly scale: "colors";
+        };
+        readonly borderColorBottom: {
+            readonly property: "borderBottomColor";
+            readonly scale: "colors";
+        };
+        readonly fontFamily: {
+            readonly property: "fontFamily";
+            readonly scale: "fontFamily";
+        };
+        readonly fontWeight: {
+            readonly property: "fontWeight";
+            readonly scale: {
+                readonly 400: 400;
+                readonly 600: 600;
+                readonly 700: 700;
+            };
+        };
+        readonly lineHeight: {
+            readonly property: "lineHeight";
+            readonly scale: "lineHeight";
+            readonly lineHeight: readonly [1, 1.5];
+        };
+        readonly fontSize: {
+            readonly property: "fontSize";
+            readonly scale: {
+                readonly 64: 64;
+                readonly 44: 44;
+                readonly 34: 34;
+                readonly 26: 26;
+                readonly 22: 22;
+                readonly 20: 20;
+                readonly 18: 18;
+                readonly 16: 16;
+                readonly 14: 14;
+            };
+        };
+        readonly letterSpacing: {
+            readonly property: "letterSpacing";
+        };
+        readonly textAlign: {
+            readonly property: "textAlign";
+        };
+        readonly fontStyle: {
+            readonly property: "fontStyle";
+        };
+        readonly textDecoration: {
+            readonly property: "textDecoration";
+        };
+        readonly textTransform: {
+            readonly property: "textTransform";
+        };
+        readonly whiteSpace: {
+            readonly property: "whiteSpace";
+        };
+        readonly boxShadow: {
+            readonly property: "boxShadow";
+        };
+        readonly textShadow: {
+            readonly property: "textShadow";
+        };
+        readonly border: {
+            readonly property: "border";
+            readonly scale: "borders";
+        };
+        readonly borderX: {
+            readonly property: "border";
+            readonly properties: readonly ["borderLeft", "borderRight"];
+            readonly scale: "borders";
+        };
+        readonly borderY: {
+            readonly property: "border";
+            readonly properties: readonly ["borderTop", "borderBottom"];
+            readonly scale: "borders";
+        };
+        readonly borderTop: {
+            readonly property: "borderTop";
+            readonly scale: "borders";
+        };
+        readonly borderRight: {
+            readonly property: "borderRight";
+            readonly scale: "borders";
+        };
+        readonly borderBottom: {
+            readonly property: "borderBottom";
+            readonly scale: "borders";
+        };
+        readonly borderLeft: {
+            readonly property: "borderLeft";
+            readonly scale: "borders";
+        };
+        readonly borderWidth: {
+            readonly property: "borderWidth";
+        };
+        readonly borderWidthX: {
+            readonly property: "borderWidth";
+            readonly properties: readonly ["borderLeftWidth", "borderRightWidth"];
+        };
+        readonly borderWidthY: {
+            readonly property: "borderWidth";
+            readonly properties: readonly ["borderTopWidth", "borderBottomWidth"];
+        };
+        readonly borderWidthLeft: {
+            readonly property: "borderLeftWidth";
+        };
+        readonly borderWidthRight: {
+            readonly property: "borderRightWidth";
+        };
+        readonly borderWidthTop: {
+            readonly property: "borderTopWidth";
+        };
+        readonly borderWidthBottom: {
+            readonly property: "borderBottomWidth";
+        };
+        readonly borderRadius: {
+            readonly property: "borderRadius";
+            readonly scale: "radii";
+        };
+        readonly borderRadiusLeft: {
+            readonly property: "borderRadius";
+            readonly properties: readonly ["borderTopLeftRadius", "borderBottomLeftRadius"];
+            readonly scale: "radii";
+        };
+        readonly borderRadiusTop: {
+            readonly property: "borderRadius";
+            readonly properties: readonly ["borderTopLeftRadius", "borderTopRightRadius"];
+            readonly scale: "radii";
+        };
+        readonly borderRadiusBottom: {
+            readonly property: "borderRadius";
+            readonly properties: readonly ["borderBottomLeftRadius", "borderBottomRightRadius"];
+            readonly scale: "radii";
+        };
+        readonly borderRadiusRight: {
+            readonly property: "borderRadius";
+            readonly properties: readonly ["borderTopRightRadius", "borderBottomRightRadius"];
+            readonly scale: "radii";
+        };
+        readonly borderRadiusTopLeft: {
+            readonly property: "borderTopLeftRadius";
+            readonly scale: "radii";
+        };
+        readonly borderRadiusTopRight: {
+            readonly property: "borderTopRightRadius";
+            readonly scale: "radii";
+        };
+        readonly borderRadiusBottomRight: {
+            readonly property: "borderBottomRightRadius";
+            readonly scale: "radii";
+        };
+        readonly borderRadiusBottomLeft: {
+            readonly property: "borderBottomLeftRadius";
+            readonly scale: "radii";
+        };
+        readonly borderStyle: {
+            readonly property: "borderStyle";
+        };
+        readonly borderStyleX: {
+            readonly property: "borderStyle";
+            readonly properties: readonly ["borderLeftStyle", "borderRightStyle"];
+        };
+        readonly borderStyleY: {
+            readonly property: "borderStyle";
+            readonly properties: readonly ["borderTopStyle", "borderBottomStyle"];
+        };
+        readonly borderStyleLeft: {
+            readonly property: "borderLeftStyle";
+        };
+        readonly borderStyleRight: {
+            readonly property: "borderRightStyle";
+        };
+        readonly borderStyleTop: {
+            readonly property: "borderTopStyle";
+        };
+        readonly borderStyleBottom: {
+            readonly property: "borderBottomStyle";
+        };
+        readonly position: {
+            readonly property: "position";
+        };
+        readonly inset: {
+            readonly property: "inset";
+            readonly properties: readonly ["top", "right", "bottom", "left"];
+            readonly transform: (value: string | number) => string | 0;
+        };
+        readonly top: {
+            readonly property: "top";
+            readonly transform: (value: string | number) => string | 0;
+        };
+        readonly right: {
+            readonly property: "right";
+            readonly transform: (value: string | number) => string | 0;
+        };
+        readonly bottom: {
+            readonly property: "bottom";
+            readonly transform: (value: string | number) => string | 0;
+        };
+        readonly left: {
+            readonly property: "left";
+            readonly transform: (value: string | number) => string | 0;
+        };
+        readonly zIndex: {
+            readonly property: "zIndex";
+        };
+        readonly opacity: {
+            readonly property: "opacity";
+        };
+        readonly justifyContent: {
+            readonly property: "justifyContent";
+        };
+        readonly justifyItems: {
+            readonly property: "justifyItems";
+        };
+        readonly alignItems: {
+            readonly property: "alignItems";
+        };
+        readonly alignContent: {
+            readonly property: "alignContent";
+        };
+        readonly flexDirection: {
+            readonly property: "flexDirection";
+        };
+        readonly flexWrap: {
+            readonly property: "flexWrap";
+        };
+        readonly flex: {
+            readonly property: "flex";
+        };
+        readonly gridAutoColumns: {
+            readonly property: "gridAutoColumns";
+        };
+        readonly gridAutoRows: {
+            readonly property: "gridAutoRows";
+        };
+        readonly gridTemplateColumns: {
+            readonly property: "gridTemplateColumns";
+        };
+        readonly gridTemplateRows: {
+            readonly property: "gridTemplateRows";
+        };
+        readonly gridTemplateAreas: {
+            readonly property: "gridTemplateAreas";
+        };
+        readonly gridAutoFlow: {
+            readonly property: "gridAutoFlow";
+        };
+        readonly gap: {
+            readonly property: "gap";
+            readonly scale: "spacing";
+        };
+        readonly rowGap: {
+            readonly property: "rowGap";
+            readonly scale: "spacing";
+        };
+        readonly columnGap: {
+            readonly property: "columnGap";
+            readonly scale: "spacing";
+        };
+        readonly flow: {
+            readonly property: "gridAutoFlow";
+            readonly scale: {
+                readonly row: "row";
+                readonly column: "column";
+                readonly dense: "dense";
+                readonly 'column-dense': "column dense";
+                readonly 'row-dense': "row dense";
+            };
+        };
+        readonly cols: {
+            readonly property: "gridTemplateColumns";
+            readonly transform: (val: string | number) => string;
+            readonly scale: readonly (string | number)[] & {
+                length: 0;
+            };
+        };
+        readonly rows: {
+            readonly property: "gridTemplateRows";
+            readonly transform: (val: string | number) => string;
+            readonly scale: readonly (string | number)[] & {
+                length: 0;
+            };
+        };
+        readonly autoRows: {
+            readonly property: "gridAutoRows";
+            readonly transform: (item: string) => string;
+        };
+        readonly autoCols: {
+            readonly property: "gridAutoColumns";
+            readonly transform: (item: string) => string;
+        };
+        readonly alignAll: {
+            readonly property: "justifyContent";
+            readonly properties: readonly ["justifyContent", "alignItems"];
+        };
+        readonly mode: {
+            readonly property: "none";
+            readonly scale: "mode";
+        };
+        readonly vars: {
+            readonly property: "variables";
+        };
+    };
+    groups: {
+        space: ("p" | "px" | "py" | "pt" | "pb" | "pr" | "pl" | "m" | "mx" | "my" | "mt" | "mb" | "mr" | "ml")[];
+        background: ("backgroundImage" | "backgroundRepeat" | "backgroundSize" | "background" | "backgroundPosition")[];
+        layout: ("alignSelf" | "display" | "flexBasis" | "flexGrow" | "flexShrink" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "height" | "justifySelf" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "overflowX" | "overflowY" | "verticalAlign" | "width" | "gridArea" | "gridColumn" | "gridRow" | "overflow" | "area" | "size")[];
+        color: ("color" | "borderColor" | "textColor" | "bg" | "borderColorX" | "borderColorY" | "borderColorLeft" | "borderColorRight" | "borderColorTop" | "borderColorBottom")[];
+        typography: ("fontSize" | "letterSpacing" | "fontFamily" | "fontWeight" | "lineHeight" | "fontStyle" | "textAlign" | "textTransform" | "whiteSpace" | "textDecoration")[];
+        shadows: ("boxShadow" | "textShadow")[];
+        borders: ("border" | "borderBottom" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "borderX" | "borderY" | "borderWidthX" | "borderWidthY" | "borderWidthLeft" | "borderWidthRight" | "borderWidthTop" | "borderWidthBottom" | "borderRadiusLeft" | "borderRadiusTop" | "borderRadiusBottom" | "borderRadiusRight" | "borderRadiusTopLeft" | "borderRadiusTopRight" | "borderRadiusBottomRight" | "borderRadiusBottomLeft" | "borderStyleX" | "borderStyleY" | "borderStyleLeft" | "borderStyleRight" | "borderStyleTop" | "borderStyleBottom")[];
+        positioning: ("bottom" | "inset" | "left" | "opacity" | "position" | "right" | "top" | "zIndex")[];
+        flex: ("alignContent" | "alignItems" | "alignSelf" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "justifyContent" | "justifyItems" | "justifySelf" | "order" | "flex" | "gridArea" | "area")[];
+        grid: ("alignContent" | "alignItems" | "alignSelf" | "columnGap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "rowGap" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "area" | "flow" | "cols" | "rows" | "autoRows" | "autoCols" | "alignAll")[];
+        mode: ("mode" | "vars")[];
+    };
+}, import("./types/config").Parser<import("./types/config").TransformerMap<{
+    readonly p: {
+        readonly property: "padding";
+        readonly scale: "spacing";
+    };
+    readonly px: {
+        readonly property: "padding";
+        readonly properties: readonly ["paddingLeft", "paddingRight"];
+        readonly scale: "spacing";
+    };
+    readonly py: {
+        readonly property: "padding";
+        readonly properties: readonly ["paddingTop", "paddingBottom"];
+        readonly scale: "spacing";
+    };
+    readonly pt: {
+        readonly property: "paddingTop";
+        readonly scale: "spacing";
+    };
+    readonly pb: {
+        readonly property: "paddingBottom";
+        readonly scale: "spacing";
+    };
+    readonly pr: {
+        readonly property: "paddingRight";
+        readonly scale: "spacing";
+    };
+    readonly pl: {
+        readonly property: "paddingLeft";
+        readonly scale: "spacing";
+    };
+    readonly m: {
+        readonly property: "margin";
+        readonly scale: "spacing";
+    };
+    readonly mx: {
+        readonly property: "margin";
+        readonly properties: readonly ["marginLeft", "marginRight"];
+        readonly scale: "spacing";
+    };
+    readonly my: {
+        readonly property: "margin";
+        readonly properties: readonly ["marginTop", "marginBottom"];
+        readonly scale: "spacing";
+    };
+    readonly mt: {
+        readonly property: "marginTop";
+        readonly scale: "spacing";
+    };
+    readonly mb: {
+        readonly property: "marginBottom";
+        readonly scale: "spacing";
+    };
+    readonly mr: {
+        readonly property: "marginRight";
+        readonly scale: "spacing";
+    };
+    readonly ml: {
+        readonly property: "marginLeft";
+        readonly scale: "spacing";
+    };
+    readonly background: {
+        readonly property: "background";
+    };
+    readonly backgroundImage: {
+        readonly property: "backgroundImage";
+    };
+    readonly backgroundSize: {
+        readonly property: "backgroundSize";
+    };
+    readonly backgroundRepeat: {
+        readonly property: "backgroundRepeat";
+    };
+    readonly backgroundPosition: {
+        readonly property: "backgroundPosition";
+    };
+    readonly flexBasis: {
+        readonly property: "flexBasis";
+    };
+    readonly flexShrink: {
+        readonly property: "flexShrink";
+    };
+    readonly flexGrow: {
+        readonly property: "flexGrow";
+    };
+    readonly order: {
+        readonly property: "order";
+    };
+    readonly gridColumn: {
+        readonly property: "gridColumn";
+    };
+    readonly gridRow: {
+        readonly property: "gridRow";
+    };
+    readonly gridColumnStart: {
+        readonly property: "gridColumnStart";
+    };
+    readonly gridRowStart: {
+        readonly property: "gridRowStart";
+    };
+    readonly gridColumnEnd: {
+        readonly property: "gridColumnEnd";
+    };
+    readonly gridRowEnd: {
+        readonly property: "gridRowEnd";
+    };
+    readonly justifySelf: {
+        readonly property: "justifySelf";
+    };
+    readonly alignSelf: {
+        readonly property: "alignSelf";
+    };
+    readonly gridArea: {
+        readonly property: "gridArea";
+    };
+    readonly area: {
+        readonly property: "gridArea";
+    };
+    readonly display: {
+        readonly property: "display";
+    };
+    readonly overflow: {
+        readonly property: "overflow";
+    };
+    readonly overflowX: {
+        readonly property: "overflowX";
+    };
+    readonly overflowY: {
+        readonly property: "overflowY";
+    };
+    readonly size: {
+        readonly property: "width";
+        readonly properties: readonly ["width", "height"];
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly width: {
+        readonly property: "width";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly minWidth: {
+        readonly property: "minWidth";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly maxWidth: {
+        readonly property: "maxWidth";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly height: {
+        readonly property: "height";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly minHeight: {
+        readonly property: "minHeight";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly maxHeight: {
+        readonly property: "maxHeight";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly verticalAlign: {
+        readonly property: "verticalAlign";
+    };
+    readonly color: {
+        readonly property: "color";
+        readonly scale: "colors";
+    };
+    readonly textColor: {
+        readonly property: "color";
+        readonly scale: "colors";
+    };
+    readonly bg: {
+        readonly property: "backgroundColor";
+        readonly scale: "colors";
+    };
+    readonly borderColor: {
+        readonly property: "borderColor";
+        readonly scale: "colors";
+    };
+    readonly borderColorX: {
+        readonly property: "borderColor";
+        readonly properties: readonly ["borderLeftColor", "borderRightColor"];
+        readonly scale: "colors";
+    };
+    readonly borderColorY: {
+        readonly property: "borderColor";
+        readonly properties: readonly ["borderTopColor", "borderBottomColor"];
+        readonly scale: "colors";
+    };
+    readonly borderColorLeft: {
+        readonly property: "borderLeftColor";
+        readonly scale: "colors";
+    };
+    readonly borderColorRight: {
+        readonly property: "borderRightColor";
+        readonly scale: "colors";
+    };
+    readonly borderColorTop: {
+        readonly property: "borderTopColor";
+        readonly scale: "colors";
+    };
+    readonly borderColorBottom: {
+        readonly property: "borderBottomColor";
+        readonly scale: "colors";
+    };
+    readonly fontFamily: {
+        readonly property: "fontFamily";
+        readonly scale: "fontFamily";
+    };
+    readonly fontWeight: {
+        readonly property: "fontWeight";
+        readonly scale: {
+            readonly 400: 400;
+            readonly 600: 600;
+            readonly 700: 700;
+        };
+    };
+    readonly lineHeight: {
+        readonly property: "lineHeight";
+        readonly scale: "lineHeight";
+        readonly lineHeight: readonly [1, 1.5];
+    };
+    readonly fontSize: {
+        readonly property: "fontSize";
+        readonly scale: {
+            readonly 64: 64;
+            readonly 44: 44;
+            readonly 34: 34;
+            readonly 26: 26;
+            readonly 22: 22;
+            readonly 20: 20;
+            readonly 18: 18;
+            readonly 16: 16;
+            readonly 14: 14;
+        };
+    };
+    readonly letterSpacing: {
+        readonly property: "letterSpacing";
+    };
+    readonly textAlign: {
+        readonly property: "textAlign";
+    };
+    readonly fontStyle: {
+        readonly property: "fontStyle";
+    };
+    readonly textDecoration: {
+        readonly property: "textDecoration";
+    };
+    readonly textTransform: {
+        readonly property: "textTransform";
+    };
+    readonly whiteSpace: {
+        readonly property: "whiteSpace";
+    };
+    readonly boxShadow: {
+        readonly property: "boxShadow";
+    };
+    readonly textShadow: {
+        readonly property: "textShadow";
+    };
+    readonly border: {
+        readonly property: "border";
+        readonly scale: "borders";
+    };
+    readonly borderX: {
+        readonly property: "border";
+        readonly properties: readonly ["borderLeft", "borderRight"];
+        readonly scale: "borders";
+    };
+    readonly borderY: {
+        readonly property: "border";
+        readonly properties: readonly ["borderTop", "borderBottom"];
+        readonly scale: "borders";
+    };
+    readonly borderTop: {
+        readonly property: "borderTop";
+        readonly scale: "borders";
+    };
+    readonly borderRight: {
+        readonly property: "borderRight";
+        readonly scale: "borders";
+    };
+    readonly borderBottom: {
+        readonly property: "borderBottom";
+        readonly scale: "borders";
+    };
+    readonly borderLeft: {
+        readonly property: "borderLeft";
+        readonly scale: "borders";
+    };
+    readonly borderWidth: {
+        readonly property: "borderWidth";
+    };
+    readonly borderWidthX: {
+        readonly property: "borderWidth";
+        readonly properties: readonly ["borderLeftWidth", "borderRightWidth"];
+    };
+    readonly borderWidthY: {
+        readonly property: "borderWidth";
+        readonly properties: readonly ["borderTopWidth", "borderBottomWidth"];
+    };
+    readonly borderWidthLeft: {
+        readonly property: "borderLeftWidth";
+    };
+    readonly borderWidthRight: {
+        readonly property: "borderRightWidth";
+    };
+    readonly borderWidthTop: {
+        readonly property: "borderTopWidth";
+    };
+    readonly borderWidthBottom: {
+        readonly property: "borderBottomWidth";
+    };
+    readonly borderRadius: {
+        readonly property: "borderRadius";
+        readonly scale: "radii";
+    };
+    readonly borderRadiusLeft: {
+        readonly property: "borderRadius";
+        readonly properties: readonly ["borderTopLeftRadius", "borderBottomLeftRadius"];
+        readonly scale: "radii";
+    };
+    readonly borderRadiusTop: {
+        readonly property: "borderRadius";
+        readonly properties: readonly ["borderTopLeftRadius", "borderTopRightRadius"];
+        readonly scale: "radii";
+    };
+    readonly borderRadiusBottom: {
+        readonly property: "borderRadius";
+        readonly properties: readonly ["borderBottomLeftRadius", "borderBottomRightRadius"];
+        readonly scale: "radii";
+    };
+    readonly borderRadiusRight: {
+        readonly property: "borderRadius";
+        readonly properties: readonly ["borderTopRightRadius", "borderBottomRightRadius"];
+        readonly scale: "radii";
+    };
+    readonly borderRadiusTopLeft: {
+        readonly property: "borderTopLeftRadius";
+        readonly scale: "radii";
+    };
+    readonly borderRadiusTopRight: {
+        readonly property: "borderTopRightRadius";
+        readonly scale: "radii";
+    };
+    readonly borderRadiusBottomRight: {
+        readonly property: "borderBottomRightRadius";
+        readonly scale: "radii";
+    };
+    readonly borderRadiusBottomLeft: {
+        readonly property: "borderBottomLeftRadius";
+        readonly scale: "radii";
+    };
+    readonly borderStyle: {
+        readonly property: "borderStyle";
+    };
+    readonly borderStyleX: {
+        readonly property: "borderStyle";
+        readonly properties: readonly ["borderLeftStyle", "borderRightStyle"];
+    };
+    readonly borderStyleY: {
+        readonly property: "borderStyle";
+        readonly properties: readonly ["borderTopStyle", "borderBottomStyle"];
+    };
+    readonly borderStyleLeft: {
+        readonly property: "borderLeftStyle";
+    };
+    readonly borderStyleRight: {
+        readonly property: "borderRightStyle";
+    };
+    readonly borderStyleTop: {
+        readonly property: "borderTopStyle";
+    };
+    readonly borderStyleBottom: {
+        readonly property: "borderBottomStyle";
+    };
+    readonly position: {
+        readonly property: "position";
+    };
+    readonly inset: {
+        readonly property: "inset";
+        readonly properties: readonly ["top", "right", "bottom", "left"];
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly top: {
+        readonly property: "top";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly right: {
+        readonly property: "right";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly bottom: {
+        readonly property: "bottom";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly left: {
+        readonly property: "left";
+        readonly transform: (value: string | number) => string | 0;
+    };
+    readonly zIndex: {
+        readonly property: "zIndex";
+    };
+    readonly opacity: {
+        readonly property: "opacity";
+    };
+    readonly justifyContent: {
+        readonly property: "justifyContent";
+    };
+    readonly justifyItems: {
+        readonly property: "justifyItems";
+    };
+    readonly alignItems: {
+        readonly property: "alignItems";
+    };
+    readonly alignContent: {
+        readonly property: "alignContent";
+    };
+    readonly flexDirection: {
+        readonly property: "flexDirection";
+    };
+    readonly flexWrap: {
+        readonly property: "flexWrap";
+    };
+    readonly flex: {
+        readonly property: "flex";
+    };
+    readonly gridAutoColumns: {
+        readonly property: "gridAutoColumns";
+    };
+    readonly gridAutoRows: {
+        readonly property: "gridAutoRows";
+    };
+    readonly gridTemplateColumns: {
+        readonly property: "gridTemplateColumns";
+    };
+    readonly gridTemplateRows: {
+        readonly property: "gridTemplateRows";
+    };
+    readonly gridTemplateAreas: {
+        readonly property: "gridTemplateAreas";
+    };
+    readonly gridAutoFlow: {
+        readonly property: "gridAutoFlow";
+    };
+    readonly gap: {
+        readonly property: "gap";
+        readonly scale: "spacing";
+    };
+    readonly rowGap: {
+        readonly property: "rowGap";
+        readonly scale: "spacing";
+    };
+    readonly columnGap: {
+        readonly property: "columnGap";
+        readonly scale: "spacing";
+    };
+    readonly flow: {
+        readonly property: "gridAutoFlow";
+        readonly scale: {
+            readonly row: "row";
+            readonly column: "column";
+            readonly dense: "dense";
+            readonly 'column-dense': "column dense";
+            readonly 'row-dense': "row dense";
+        };
+    };
+    readonly cols: {
+        readonly property: "gridTemplateColumns";
+        readonly transform: (val: string | number) => string;
+        readonly scale: readonly (string | number)[] & {
+            length: 0;
+        };
+    };
+    readonly rows: {
+        readonly property: "gridTemplateRows";
+        readonly transform: (val: string | number) => string;
+        readonly scale: readonly (string | number)[] & {
+            length: 0;
+        };
+    };
+    readonly autoRows: {
+        readonly property: "gridAutoRows";
+        readonly transform: (item: string) => string;
+    };
+    readonly autoCols: {
+        readonly property: "gridAutoColumns";
+        readonly transform: (item: string) => string;
+    };
+    readonly alignAll: {
+        readonly property: "justifyContent";
+        readonly properties: readonly ["justifyContent", "alignItems"];
+    };
+    readonly mode: {
+        readonly property: "none";
+        readonly scale: "mode";
+    };
+    readonly vars: {
+        readonly property: "variables";
+    };
+}>>>;