aeon-ui-engine 1.8.0 → 1.9.0

package/packages/panda/styled-system/patterns/box.d.ts

@@ -1,20 +1,17 @@
-/* eslint-disable */
-import type { SystemStyleObject, ConditionalValue } from '../types/index';
-import type { Properties } from '../types/csstype';
-import type { SystemProperties } from '../types/style-props';
-import type { DistributiveOmit } from '../types/system-types';
-import type { Tokens } from '../tokens/index';
+import type { SystemStyleObject } from '../types/system';
 
-export interface BoxProperties {
-   
-}
+export interface BoxProperties {}
+
+type BoxRestStyles = Omit<SystemStyleObject, keyof BoxProperties>
 
-interface BoxStyles extends BoxProperties, DistributiveOmit<SystemStyleObject, keyof BoxProperties > {}
+interface BoxStyles extends BoxProperties, BoxRestStyles {}
 
 interface BoxPatternFn {
   (styles?: BoxStyles): string
   raw: (styles?: BoxStyles) => SystemStyleObject
+  propKeys: Array<keyof BoxProperties>
 }
 
+export declare function boxRaw(styles?: BoxStyles): SystemStyleObject;
 
-export declare const box: BoxPatternFn;
+export declare const box: BoxPatternFn;

package/packages/panda/styled-system/patterns/box.js

@@ -0,0 +1,16 @@
+import { getPatternStyles, patternFns } from './runtime';
+import { memo } from '../helpers';
+import { css } from '../css/index';
+
+const boxConfig = { transform(props) {
+  return props;
+} }
+
+export function boxRaw(styles) {
+  const s = getPatternStyles(boxConfig, styles || {})
+  return boxConfig.transform(s, patternFns)
+}
+
+export const box = /* @__PURE__ */ Object.assign(/* @__PURE__ */ memo(function box(styles = {}) {
+  return css(boxRaw(styles))
+}), { raw: boxRaw, propKeys: [] })

package/packages/panda/styled-system/patterns/center.d.ts

@@ -1,20 +1,19 @@
-/* eslint-disable */
-import type { SystemStyleObject, ConditionalValue } from '../types/index';
-import type { Properties } from '../types/csstype';
-import type { SystemProperties } from '../types/style-props';
-import type { DistributiveOmit } from '../types/system-types';
-import type { Tokens } from '../tokens/index';
+import type { ConditionalValue, SystemStyleObject } from '../types/system';
 
 export interface CenterProperties {
-   inline?: ConditionalValue<boolean>
+  inline?: ConditionalValue<boolean>
 }
 
-interface CenterStyles extends CenterProperties, DistributiveOmit<SystemStyleObject, keyof CenterProperties > {}
+type CenterRestStyles = Omit<SystemStyleObject, keyof CenterProperties>
+
+interface CenterStyles extends CenterProperties, CenterRestStyles {}
 
 interface CenterPatternFn {
   (styles?: CenterStyles): string
   raw: (styles?: CenterStyles) => SystemStyleObject
+  propKeys: Array<keyof CenterProperties>
 }
 
+export declare function centerRaw(styles?: CenterStyles): SystemStyleObject;
 
-export declare const center: CenterPatternFn;
+export declare const center: CenterPatternFn;

package/packages/panda/styled-system/patterns/center.js

@@ -0,0 +1,22 @@
+import { getPatternStyles, patternFns } from './runtime';
+import { memo } from '../helpers';
+import { css } from '../css/index';
+
+const centerConfig = { transform(props) {
+  const { inline, ...rest } = props;
+  return {
+    display: inline ? "inline-flex" : "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    ...rest
+  };
+} }
+
+export function centerRaw(styles) {
+  const s = getPatternStyles(centerConfig, styles || {})
+  return centerConfig.transform(s, patternFns)
+}
+
+export const center = /* @__PURE__ */ Object.assign(/* @__PURE__ */ memo(function center(styles = {}) {
+  return css(centerRaw(styles))
+}), { raw: centerRaw, propKeys: ["inline"] })

package/packages/panda/styled-system/patterns/circle.d.ts

@@ -1,20 +1,19 @@
-/* eslint-disable */
-import type { SystemStyleObject, ConditionalValue } from '../types/index';
-import type { Properties } from '../types/csstype';
-import type { SystemProperties } from '../types/style-props';
-import type { DistributiveOmit } from '../types/system-types';
-import type { Tokens } from '../tokens/index';
+import type { SystemProperties, SystemStyleObject } from '../types/system';
 
 export interface CircleProperties {
-   size?: SystemProperties["width"]
+  size?: SystemProperties["width"]
 }
 
-interface CircleStyles extends CircleProperties, DistributiveOmit<SystemStyleObject, keyof CircleProperties > {}
+type CircleRestStyles = Omit<SystemStyleObject, keyof CircleProperties>
+
+interface CircleStyles extends CircleProperties, CircleRestStyles {}
 
 interface CirclePatternFn {
   (styles?: CircleStyles): string
   raw: (styles?: CircleStyles) => SystemStyleObject
+  propKeys: Array<keyof CircleProperties>
 }
 
+export declare function circleRaw(styles?: CircleStyles): SystemStyleObject;
 
-export declare const circle: CirclePatternFn;
+export declare const circle: CirclePatternFn;

package/packages/panda/styled-system/patterns/circle.js

@@ -0,0 +1,26 @@
+import { getPatternStyles, patternFns } from './runtime';
+import { memo } from '../helpers';
+import { css } from '../css/index';
+
+const circleConfig = { transform(props) {
+  const { size, ...rest } = props;
+  return {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    flex: "0 0 auto",
+    width: size,
+    height: size,
+    borderRadius: "9999px",
+    ...rest
+  };
+} }
+
+export function circleRaw(styles) {
+  const s = getPatternStyles(circleConfig, styles || {})
+  return circleConfig.transform(s, patternFns)
+}
+
+export const circle = /* @__PURE__ */ Object.assign(/* @__PURE__ */ memo(function circle(styles = {}) {
+  return css(circleRaw(styles))
+}), { raw: circleRaw, propKeys: ["size"] })

package/packages/panda/styled-system/patterns/container.d.ts

@@ -1,20 +1,17 @@
-/* eslint-disable */
-import type { SystemStyleObject, ConditionalValue } from '../types/index';
-import type { Properties } from '../types/csstype';
-import type { SystemProperties } from '../types/style-props';
-import type { DistributiveOmit } from '../types/system-types';
-import type { Tokens } from '../tokens/index';
+import type { SystemStyleObject } from '../types/system';
 
-export interface ContainerProperties {
-   
-}
+export interface ContainerProperties {}
+
+type ContainerRestStyles = Omit<SystemStyleObject, keyof ContainerProperties>
 
-interface ContainerStyles extends ContainerProperties, DistributiveOmit<SystemStyleObject, keyof ContainerProperties > {}
+interface ContainerStyles extends ContainerProperties, ContainerRestStyles {}
 
 interface ContainerPatternFn {
   (styles?: ContainerStyles): string
   raw: (styles?: ContainerStyles) => SystemStyleObject
+  propKeys: Array<keyof ContainerProperties>
 }
 
+export declare function containerRaw(styles?: ContainerStyles): SystemStyleObject;
 
-export declare const container: ContainerPatternFn;
+export declare const container: ContainerPatternFn;

package/packages/panda/styled-system/patterns/container.js

@@ -0,0 +1,26 @@
+import { getPatternStyles, patternFns } from './runtime';
+import { memo } from '../helpers';
+import { css } from '../css/index';
+
+const containerConfig = { transform(props) {
+  return {
+    position: "relative",
+    maxWidth: "8xl",
+    mx: "auto",
+    px: {
+      base: "4",
+      md: "6",
+      lg: "8"
+    },
+    ...props
+  };
+} }
+
+export function containerRaw(styles) {
+  const s = getPatternStyles(containerConfig, styles || {})
+  return containerConfig.transform(s, patternFns)
+}
+
+export const container = /* @__PURE__ */ Object.assign(/* @__PURE__ */ memo(function container(styles = {}) {
+  return css(containerRaw(styles))
+}), { raw: containerRaw, propKeys: [] })

package/packages/panda/styled-system/patterns/cq.d.ts

@@ -1,21 +1,21 @@
-/* eslint-disable */
-import type { SystemStyleObject, ConditionalValue } from '../types/index';
-import type { Properties } from '../types/csstype';
-import type { SystemProperties } from '../types/style-props';
-import type { DistributiveOmit } from '../types/system-types';
-import type { Tokens } from '../tokens/index';
+import type { TokenValue } from '../types/tokens';
+import type { ConditionalValue, SystemProperties, SystemStyleObject } from '../types/system';
 
 export interface CqProperties {
-   name?: ConditionalValue<Tokens["containerNames"] | Properties["containerName"]>
-	type?: SystemProperties["containerType"]
+  name?: ConditionalValue<TokenValue<"containerNames"> | SystemProperties["containerName"]>
+  type?: SystemProperties["containerType"]
 }
 
-interface CqStyles extends CqProperties, DistributiveOmit<SystemStyleObject, keyof CqProperties > {}
+type CqRestStyles = Omit<SystemStyleObject, keyof CqProperties>
+
+interface CqStyles extends CqProperties, CqRestStyles {}
 
 interface CqPatternFn {
   (styles?: CqStyles): string
   raw: (styles?: CqStyles) => SystemStyleObject
+  propKeys: Array<keyof CqProperties>
 }
 
+export declare function cqRaw(styles?: CqStyles): SystemStyleObject;
 
-export declare const cq: CqPatternFn;
+export declare const cq: CqPatternFn;

package/packages/panda/styled-system/patterns/cq.js

@@ -0,0 +1,24 @@
+import { getPatternStyles, patternFns } from './runtime';
+import { memo } from '../helpers';
+import { css } from '../css/index';
+
+const cqConfig = {
+  transform(props) {
+    const { name, type, ...rest } = props;
+    return {
+      containerType: type,
+      containerName: name,
+      ...rest
+    };
+  },
+  defaultValues: { type: "inline-size" }
+}
+
+export function cqRaw(styles) {
+  const s = getPatternStyles(cqConfig, styles || {})
+  return cqConfig.transform(s, patternFns)
+}
+
+export const cq = /* @__PURE__ */ Object.assign(/* @__PURE__ */ memo(function cq(styles = {}) {
+  return css(cqRaw(styles))
+}), { raw: cqRaw, propKeys: ["name","type"] })

package/packages/panda/styled-system/patterns/divider.d.ts

@@ -1,22 +1,22 @@
-/* eslint-disable */
-import type { SystemStyleObject, ConditionalValue } from '../types/index';
-import type { Properties } from '../types/csstype';
-import type { SystemProperties } from '../types/style-props';
-import type { DistributiveOmit } from '../types/system-types';
-import type { Tokens } from '../tokens/index';
+import type { TokenValue } from '../types/tokens';
+import type { ConditionalValue, SystemProperties, SystemStyleObject } from '../types/system';
 
 export interface DividerProperties {
-   orientation?: ConditionalValue<"horizontal" | "vertical">
-	thickness?: ConditionalValue<Tokens["sizes"] | Properties["borderWidth"]>
-	color?: ConditionalValue<Tokens["colors"] | Properties["borderColor"]>
+  color?: ConditionalValue<TokenValue<"colors"> | SystemProperties["borderColor"]>
+  orientation?: ConditionalValue<"horizontal" | "vertical">
+  thickness?: ConditionalValue<TokenValue<"sizes"> | SystemProperties["borderWidth"]>
 }
 
-interface DividerStyles extends DividerProperties, DistributiveOmit<SystemStyleObject, keyof DividerProperties > {}
+type DividerRestStyles = Omit<SystemStyleObject, keyof DividerProperties>
+
+interface DividerStyles extends DividerProperties, DividerRestStyles {}
 
 interface DividerPatternFn {
   (styles?: DividerStyles): string
   raw: (styles?: DividerStyles) => SystemStyleObject
+  propKeys: Array<keyof DividerProperties>
 }
 
+export declare function dividerRaw(styles?: DividerStyles): SystemStyleObject;
 
-export declare const divider: DividerPatternFn;
+export declare const divider: DividerPatternFn;

package/packages/panda/styled-system/patterns/divider.js

@@ -0,0 +1,31 @@
+import { getPatternStyles, patternFns } from './runtime';
+import { memo } from '../helpers';
+import { css } from '../css/index';
+
+const dividerConfig = {
+  transform(props, { map }) {
+    const { orientation, thickness, color: color2, ...rest } = props;
+    return {
+      "--thickness": thickness,
+      width: map(orientation, (v) => v === "vertical" ? void 0 : "100%"),
+      height: map(orientation, (v) => v === "horizontal" ? void 0 : "100%"),
+      borderBlockEndWidth: map(orientation, (v) => v === "horizontal" ? "var(--thickness)" : void 0),
+      borderInlineEndWidth: map(orientation, (v) => v === "vertical" ? "var(--thickness)" : void 0),
+      borderColor: color2,
+      ...rest
+    };
+  },
+  defaultValues: {
+    orientation: "horizontal",
+    thickness: "1px"
+  }
+}
+
+export function dividerRaw(styles) {
+  const s = getPatternStyles(dividerConfig, styles || {})
+  return dividerConfig.transform(s, patternFns)
+}
+
+export const divider = /* @__PURE__ */ Object.assign(/* @__PURE__ */ memo(function divider(styles = {}) {
+  return css(dividerRaw(styles))
+}), { raw: dividerRaw, propKeys: ["color","orientation","thickness"] })

package/packages/panda/styled-system/patterns/flex.d.ts

@@ -1,26 +1,25 @@
-/* eslint-disable */
-import type { SystemStyleObject, ConditionalValue } from '../types/index';
-import type { Properties } from '../types/csstype';
-import type { SystemProperties } from '../types/style-props';
-import type { DistributiveOmit } from '../types/system-types';
-import type { Tokens } from '../tokens/index';
+import type { SystemProperties, SystemStyleObject } from '../types/system';
 
 export interface FlexProperties {
-   align?: SystemProperties["alignItems"]
-	justify?: SystemProperties["justifyContent"]
-	direction?: SystemProperties["flexDirection"]
-	wrap?: SystemProperties["flexWrap"]
-	basis?: SystemProperties["flexBasis"]
-	grow?: SystemProperties["flexGrow"]
-	shrink?: SystemProperties["flexShrink"]
+  align?: SystemProperties["alignItems"]
+  basis?: SystemProperties["flexBasis"]
+  direction?: SystemProperties["flexDirection"]
+  grow?: SystemProperties["flexGrow"]
+  justify?: SystemProperties["justifyContent"]
+  shrink?: SystemProperties["flexShrink"]
+  wrap?: SystemProperties["flexWrap"]
 }
 
-interface FlexStyles extends FlexProperties, DistributiveOmit<SystemStyleObject, keyof FlexProperties > {}
+type FlexRestStyles = Omit<SystemStyleObject, keyof FlexProperties>
+
+interface FlexStyles extends FlexProperties, FlexRestStyles {}
 
 interface FlexPatternFn {
   (styles?: FlexStyles): string
   raw: (styles?: FlexStyles) => SystemStyleObject
+  propKeys: Array<keyof FlexProperties>
 }
 
+export declare function flexRaw(styles?: FlexStyles): SystemStyleObject;
 
-export declare const flex: FlexPatternFn;
+export declare const flex: FlexPatternFn;

package/packages/panda/styled-system/patterns/flex.js

@@ -0,0 +1,27 @@
+import { getPatternStyles, patternFns } from './runtime';
+import { memo } from '../helpers';
+import { css } from '../css/index';
+
+const flexConfig = { transform(props) {
+  const { direction, align, justify, wrap: wrap2, basis, grow, shrink, ...rest } = props;
+  return {
+    display: "flex",
+    flexDirection: direction,
+    alignItems: align,
+    justifyContent: justify,
+    flexWrap: wrap2,
+    flexBasis: basis,
+    flexGrow: grow,
+    flexShrink: shrink,
+    ...rest
+  };
+} }
+
+export function flexRaw(styles) {
+  const s = getPatternStyles(flexConfig, styles || {})
+  return flexConfig.transform(s, patternFns)
+}
+
+export const flex = /* @__PURE__ */ Object.assign(/* @__PURE__ */ memo(function flex(styles = {}) {
+  return css(flexRaw(styles))
+}), { raw: flexRaw, propKeys: ["align","basis","direction","grow","justify","shrink","wrap"] })

package/packages/panda/styled-system/patterns/float.d.ts

@@ -1,23 +1,23 @@
-/* eslint-disable */
-import type { SystemStyleObject, ConditionalValue } from '../types/index';
-import type { Properties } from '../types/csstype';
-import type { SystemProperties } from '../types/style-props';
-import type { DistributiveOmit } from '../types/system-types';
-import type { Tokens } from '../tokens/index';
+import type { TokenValue } from '../types/tokens';
+import type { ConditionalValue, SystemProperties, SystemStyleObject } from '../types/system';
 
 export interface FloatProperties {
-   offsetX?: ConditionalValue<Tokens["spacing"] | Properties["left"]>
-	offsetY?: ConditionalValue<Tokens["spacing"] | Properties["top"]>
-	offset?: ConditionalValue<Tokens["spacing"] | Properties["top"]>
-	placement?: ConditionalValue<"bottom-end" | "bottom-start" | "top-end" | "top-start" | "bottom-center" | "top-center" | "middle-center" | "middle-end" | "middle-start">
+  offset?: ConditionalValue<TokenValue<"spacing"> | SystemProperties["top"]>
+  offsetX?: ConditionalValue<TokenValue<"spacing"> | SystemProperties["left"]>
+  offsetY?: ConditionalValue<TokenValue<"spacing"> | SystemProperties["top"]>
+  placement?: ConditionalValue<"bottom-end" | "bottom-start" | "top-end" | "top-start" | "bottom-center" | "top-center" | "middle-center" | "middle-end" | "middle-start">
 }
 
-interface FloatStyles extends FloatProperties, DistributiveOmit<SystemStyleObject, keyof FloatProperties > {}
+type FloatRestStyles = Omit<SystemStyleObject, keyof FloatProperties>
+
+interface FloatStyles extends FloatProperties, FloatRestStyles {}
 
 interface FloatPatternFn {
   (styles?: FloatStyles): string
   raw: (styles?: FloatStyles) => SystemStyleObject
+  propKeys: Array<keyof FloatProperties>
 }
 
+export declare function floatRaw(styles?: FloatStyles): SystemStyleObject;
 
-export declare const float: FloatPatternFn;
+export declare const float: FloatPatternFn;

package/packages/panda/styled-system/patterns/float.js

@@ -0,0 +1,84 @@
+import { getPatternStyles, patternFns } from './runtime';
+import { memo } from '../helpers';
+import { css } from '../css/index';
+
+const floatConfig = {
+  transform(props, { map }) {
+    const { offset, offsetX, offsetY, placement, ...rest } = props;
+    return {
+      display: "inline-flex",
+      justifyContent: "center",
+      alignItems: "center",
+      position: "absolute",
+      insetBlockStart: map(placement, (v) => {
+        const [side] = v.split("-");
+        const map2 = {
+          top: offsetY,
+          middle: "50%",
+          bottom: "auto"
+        };
+        return map2[side];
+      }),
+      insetBlockEnd: map(placement, (v) => {
+        const [side] = v.split("-");
+        const map2 = {
+          top: "auto",
+          middle: "50%",
+          bottom: offsetY
+        };
+        return map2[side];
+      }),
+      insetInlineStart: map(placement, (v) => {
+        const [, align] = v.split("-");
+        const map2 = {
+          start: offsetX,
+          center: "50%",
+          end: "auto"
+        };
+        return map2[align];
+      }),
+      insetInlineEnd: map(placement, (v) => {
+        const [, align] = v.split("-");
+        const map2 = {
+          start: "auto",
+          center: "50%",
+          end: offsetX
+        };
+        return map2[align];
+      }),
+      translate: map(placement, (v) => {
+        const [side, align] = v.split("-");
+        const mapX = {
+          start: "-50%",
+          center: "-50%",
+          end: "50%"
+        };
+        const mapY = {
+          top: "-50%",
+          middle: "-50%",
+          bottom: "50%"
+        };
+        return `${mapX[align]} ${mapY[side]}`;
+      }),
+      ...rest
+    };
+  },
+  defaultValues(props) {
+    const offset = props.offset || "0";
+    return {
+      offset,
+      offsetX: offset,
+      offsetY: offset,
+      placement: "top-end"
+    };
+  }
+}
+
+export function floatRaw(styles) {
+  const s = getPatternStyles(floatConfig, styles || {})
+  return floatConfig.transform(s, patternFns)
+}
+
+export const float = /* @__PURE__ */ Object.assign(/* @__PURE__ */ memo(function float(styles = {}) {
+  return css(floatRaw(styles))
+}), { raw: floatRaw, propKeys: ["offset","offsetX","offsetY","placement"] })

package/packages/panda/styled-system/patterns/grid-item.d.ts

@@ -1,25 +1,24 @@
-/* eslint-disable */
-import type { SystemStyleObject, ConditionalValue } from '../types/index';
-import type { Properties } from '../types/csstype';
-import type { SystemProperties } from '../types/style-props';
-import type { DistributiveOmit } from '../types/system-types';
-import type { Tokens } from '../tokens/index';
+import type { ConditionalValue, SystemStyleObject } from '../types/system';
 
 export interface GridItemProperties {
-   colSpan?: ConditionalValue<number>
-	rowSpan?: ConditionalValue<number>
-	colStart?: ConditionalValue<number>
-	rowStart?: ConditionalValue<number>
-	colEnd?: ConditionalValue<number>
-	rowEnd?: ConditionalValue<number>
+  colEnd?: ConditionalValue<number>
+  colSpan?: ConditionalValue<number>
+  colStart?: ConditionalValue<number>
+  rowEnd?: ConditionalValue<number>
+  rowSpan?: ConditionalValue<number>
+  rowStart?: ConditionalValue<number>
 }
 
-interface GridItemStyles extends GridItemProperties, DistributiveOmit<SystemStyleObject, keyof GridItemProperties > {}
+type GridItemRestStyles = Omit<SystemStyleObject, keyof GridItemProperties>
+
+interface GridItemStyles extends GridItemProperties, GridItemRestStyles {}
 
 interface GridItemPatternFn {
   (styles?: GridItemStyles): string
   raw: (styles?: GridItemStyles) => SystemStyleObject
+  propKeys: Array<keyof GridItemProperties>
 }
 
+export declare function gridItemRaw(styles?: GridItemStyles): SystemStyleObject;
 
-export declare const gridItem: GridItemPatternFn;
+export declare const gridItem: GridItemPatternFn;

package/packages/panda/styled-system/patterns/grid-item.js

@@ -0,0 +1,26 @@
+import { getPatternStyles, patternFns } from './runtime';
+import { memo } from '../helpers';
+import { css } from '../css/index';
+
+const gridItemConfig = { transform(props, { map }) {
+  const { colSpan, rowSpan, colStart, rowStart, colEnd, rowEnd, ...rest } = props;
+  const spanFn = (v) => v === "auto" ? v : `span ${v}`;
+  return {
+    gridColumn: colSpan != null ? map(colSpan, spanFn) : void 0,
+    gridRow: rowSpan != null ? map(rowSpan, spanFn) : void 0,
+    gridColumnStart: colStart,
+    gridColumnEnd: colEnd,
+    gridRowStart: rowStart,
+    gridRowEnd: rowEnd,
+    ...rest
+  };
+} }
+
+export function gridItemRaw(styles) {
+  const s = getPatternStyles(gridItemConfig, styles || {})
+  return gridItemConfig.transform(s, patternFns)
+}
+
+export const gridItem = /* @__PURE__ */ Object.assign(/* @__PURE__ */ memo(function gridItem(styles = {}) {
+  return css(gridItemRaw(styles))
+}), { raw: gridItemRaw, propKeys: ["colEnd","colSpan","colStart","rowEnd","rowSpan","rowStart"] })

package/packages/panda/styled-system/patterns/grid.d.ts

@@ -1,24 +1,24 @@
-/* eslint-disable */
-import type { SystemStyleObject, ConditionalValue } from '../types/index';
-import type { Properties } from '../types/csstype';
-import type { SystemProperties } from '../types/style-props';
-import type { DistributiveOmit } from '../types/system-types';
-import type { Tokens } from '../tokens/index';
+import type { TokenValue } from '../types/tokens';
+import type { ConditionalValue, SystemProperties, SystemStyleObject } from '../types/system';
 
 export interface GridProperties {
-   gap?: SystemProperties["gap"]
-	columnGap?: SystemProperties["gap"]
-	rowGap?: SystemProperties["gap"]
-	columns?: ConditionalValue<number>
-	minChildWidth?: ConditionalValue<Tokens["sizes"] | Properties["width"]>
+  columnGap?: SystemProperties["gap"]
+  columns?: ConditionalValue<number>
+  gap?: SystemProperties["gap"]
+  minChildWidth?: ConditionalValue<TokenValue<"sizes"> | SystemProperties["width"]>
+  rowGap?: SystemProperties["gap"]
 }
 
-interface GridStyles extends GridProperties, DistributiveOmit<SystemStyleObject, keyof GridProperties > {}
+type GridRestStyles = Omit<SystemStyleObject, keyof GridProperties>
+
+interface GridStyles extends GridProperties, GridRestStyles {}
 
 interface GridPatternFn {
   (styles?: GridStyles): string
   raw: (styles?: GridStyles) => SystemStyleObject
+  propKeys: Array<keyof GridProperties>
 }
 
+export declare function gridRaw(styles?: GridStyles): SystemStyleObject;
 
-export declare const grid: GridPatternFn;
+export declare const grid: GridPatternFn;