aeon-ui-engine 1.5.1 → 1.9.0

package/packages/panda/styled-system/css/conditions.js

@@ -0,0 +1,32 @@
+import { withoutSpace } from '../helpers';
+
+const conditions = /* @__PURE__ */ new Set(/* @__PURE__ */ "2xl,2xlDown,2xlOnly,@/2xl,@/2xlDown,@/2xlOnly,@/2xlTo3xl,@/2xlTo4xl,@/2xlTo5xl,@/2xlTo6xl,@/2xlTo7xl,@/2xlTo8xl,@/2xs,@/2xsDown,@/2xsOnly,@/2xsTo2xl,@/2xsTo3xl,@/2xsTo4xl,@/2xsTo5xl,@/2xsTo6xl,@/2xsTo7xl,@/2xsTo8xl,@/2xsToLg,@/2xsToMd,@/2xsToSm,@/2xsToXl,@/2xsToXs,@/3xl,@/3xlDown,@/3xlOnly,@/3xlTo4xl,@/3xlTo5xl,@/3xlTo6xl,@/3xlTo7xl,@/3xlTo8xl,@/3xs,@/3xsDown,@/3xsOnly,@/3xsTo2xl,@/3xsTo2xs,@/3xsTo3xl,@/3xsTo4xl,@/3xsTo5xl,@/3xsTo6xl,@/3xsTo7xl,@/3xsTo8xl,@/3xsToLg,@/3xsToMd,@/3xsToSm,@/3xsToXl,@/3xsToXs,@/4xl,@/4xlDown,@/4xlOnly,@/4xlTo5xl,@/4xlTo6xl,@/4xlTo7xl,@/4xlTo8xl,@/5xl,@/5xlDown,@/5xlOnly,@/5xlTo6xl,@/5xlTo7xl,@/5xlTo8xl,@/6xl,@/6xlDown,@/6xlOnly,@/6xlTo7xl,@/6xlTo8xl,@/7xl,@/7xlDown,@/7xlOnly,@/7xlTo8xl,@/8xl,@/8xlDown,@/8xlOnly,@/lg,@/lgDown,@/lgOnly,@/lgTo2xl,@/lgTo3xl,@/lgTo4xl,@/lgTo5xl,@/lgTo6xl,@/lgTo7xl,@/lgTo8xl,@/lgToXl,@/md,@/mdDown,@/mdOnly,@/mdTo2xl,@/mdTo3xl,@/mdTo4xl,@/mdTo5xl,@/mdTo6xl,@/mdTo7xl,@/mdTo8xl,@/mdToLg,@/mdToXl,@/sm,@/smDown,@/smOnly,@/smTo2xl,@/smTo3xl,@/smTo4xl,@/smTo5xl,@/smTo6xl,@/smTo7xl,@/smTo8xl,@/smToLg,@/smToMd,@/smToXl,@/xl,@/xlDown,@/xlOnly,@/xlTo2xl,@/xlTo3xl,@/xlTo4xl,@/xlTo5xl,@/xlTo6xl,@/xlTo7xl,@/xlTo8xl,@/xs,@/xsDown,@/xsOnly,@/xsTo2xl,@/xsTo3xl,@/xsTo4xl,@/xsTo5xl,@/xsTo6xl,@/xsTo7xl,@/xsTo8xl,@/xsToLg,@/xsToMd,@/xsToSm,@/xsToXl,_active,_aeonActive,_aeonChecked,_aeonClosed,_aeonCollapsed,_aeonDocked,_aeonEmpty,_aeonExpanded,_aeonFailure,_aeonFloating,_aeonHidden,_aeonInactive,_aeonInvalid,_aeonOpen,_aeonOverlayOpen,_aeonPending,_aeonReady,_aeonSelected,_aeonSuccess,_after,_anyPointerCoarse,_anyPointerFine,_anyPointerNone,_atValue,_autofill,_backdrop,_before,_checked,_closed,_complete,_current,_currentPage,_currentStep,_dark,_default,_disabled,_dragging,_empty,_enabled,_even,_expanded,_file,_first,_firstLetter,_firstLine,_firstOfType,_focus,_focusVisible,_focusWithin,_fullscreen,_grabbed,_groupActive,_groupChecked,_groupDisabled,_groupExpanded,_groupFocus,_groupFocusVisible,_groupFocusWithin,_groupHover,_groupInvalid,_hidden,_highContrast,_highlighted,_horizontal,_hover,_icon,_inRange,_incomplete,_indeterminate,_inert,_invalid,_invertedColors,_landscape,_last,_lastOfType,_lessContrast,_light,_loading,_ltr,_marker,_moreContrast,_motionReduce,_motionSafe,_noscript,_now,_odd,_only,_onlyOfType,_open,_optional,_osDark,_osLight,_outOfRange,_overValue,_peerActive,_peerChecked,_peerDisabled,_peerExpanded,_peerFocus,_peerFocusVisible,_peerFocusWithin,_peerHover,_peerInvalid,_peerPlaceholderShown,_placeholder,_placeholderShown,_pointerCoarse,_pointerFine,_pointerNone,_portrait,_pressed,_print,_rangeEnd,_rangeStart,_readOnly,_readWrite,_required,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_selected,_selection,_starting,_target,_today,_topmost,_unavailable,_underValue,_userInvalid,_userValid,_valid,_vertical,_visited,base,lg,lgDown,lgOnly,lgTo2xl,lgToXl,md,mdDown,mdOnly,mdTo2xl,mdToLg,mdToXl,sm,smDown,smOnly,smTo2xl,smToLg,smToMd,smToXl,xl,xlDown,xlOnly,xlTo2xl".split(','))
+const conditionRe = /^@|&/
+const underscoreRe = /^_/
+const selectorRe = /&|@/
+
+export const breakpointKeys = ["base","sm","md","lg","xl","2xl"]
+
+export function isCondition(v) {
+  return conditions.has(v) || conditionRe.test(v)
+}
+
+export function finalizeConditions(paths) {
+  return paths.map((p) => {
+    if (conditions.has(p)) {
+      return p.replace(underscoreRe, '')
+    }
+    if (selectorRe.test(p)) {
+      return `[${withoutSpace(p.trim())}]`
+    }
+    return p
+  })
+}
+
+export function sortConditions(paths) {
+  return [...paths].sort((a, b) => {
+    const aa = isCondition(a)
+    const bb = isCondition(b)
+    return aa && !bb ? 1 : !aa && bb ? -1 : 0
+  })
+}

package/packages/panda/styled-system/css/css.d.ts

@@ -1,19 +1,19 @@
-/* eslint-disable */
-import type { SystemStyleObject } from '../types/index';
+import type { SystemStyleObject } from '../types/system';
 
 type Styles = SystemStyleObject | undefined | null | false
+type StyleList = Styles | StyleList[]
 
 interface CssRawFunction {
   (styles: Styles): SystemStyleObject
-  (styles: Styles[]): SystemStyleObject
-  (...styles: Array<Styles | Styles[]>): SystemStyleObject
+  (styles: StyleList[]): SystemStyleObject
+  (...styles: StyleList[]): SystemStyleObject
   (styles: Styles): SystemStyleObject
 }
 
 interface CssFunction {
   (styles: Styles): string
-  (styles: Styles[]): string
-  (...styles: Array<Styles | Styles[]>): string
+  (styles: StyleList[]): string
+  (...styles: StyleList[]): string
   (styles: Styles): string
 
   raw: CssRawFunction

package/packages/panda/styled-system/css/css.js

@@ -0,0 +1,63 @@
+import { createAssignCss, createMergeCss, createSerializeCss, createSerializeCssArgs, hypenateProperty, isObject, withoutSpace } from '../helpers';
+import { breakpointKeys, finalizeConditions, sortConditions } from './conditions';
+
+const utilities = "WebkitTextFillColor:wktf-c,accentColor:ac-c,alignContent:ac,alignItems:ai,alignSelf:as,animation:anim,animationComposition:anim-comp,animationDelay:anim-dly,animationDirection:anim-dir,animationDuration:anim-dur,animationFillMode:anim-fm,animationIterationCount:anim-ic,animationName:anim-n,animationPlayState:anim-ps,animationRange:anim-r,animationRangeEnd:anim-re,animationRangeStart:anim-rs,animationState:anim-s,animationTimeline:anim-tl,animationTimingFunction:anim-tmf,appearance:ap,aspectRatio:asp,backdropBlur:bkdp-blur,backdropBrightness:bkdp-brightness,backdropContrast:bkdp-contrast,backdropFilter:bkdp,backdropGrayscale:bkdp-grayscale,backdropHueRotate:bkdp-hue-rotate,backdropInvert:bkdp-invert,backdropOpacity:bkdp-opacity,backdropSaturate:bkdp-saturate,backdropSepia:bkdp-sepia,backfaceVisibility:bfv,background:bg/1,backgroundAttachment:bg-a/bgAttachment,backgroundBlendMode:bg-bm/bgBlendMode,backgroundClip:bg-cp/bgClip,backgroundColor:bg-c/bgColor,backgroundConic:bg-conic/bgConic,backgroundGradient:bg-grad/bgGradient,backgroundImage:bg-i/bgImage,backgroundLinear:bg-linear/bgLinear,backgroundOrigin:bg-o/bgOrigin,backgroundPosition:bg-p/bgPosition,backgroundPositionX:bg-p-x/bgPositionX,backgroundPositionY:bg-p-y/bgPositionY,backgroundRadial:bg-radial/bgRadial,backgroundRepeat:bg-r/bgRepeat,backgroundSize:bg-s/bgSize,blockSize:h-bs,border:bd,borderBlock:bd-y/borderY,borderBlockColor:bd-y-c/borderYColor,borderBlockEnd:bd-be,borderBlockEndColor:bd-be-c,borderBlockEndWidth:bd-be-w,borderBlockStart:bd-bs,borderBlockStartColor:bd-bs-c,borderBlockStartWidth:bd-bs-w,borderBlockWidth:bd-y-w/borderYWidth,borderBottom:bd-b,borderBottomColor:bd-b-c,borderBottomLeftRadius:bdr-bl/roundedBottomLeft,borderBottomRadius:bdr-b/roundedBottom,borderBottomRightRadius:bdr-br/roundedBottomRight,borderBottomWidth:bd-b-w,borderCollapse:bd-cl,borderColor:bd-c,borderEndEndRadius:bdr-ee/roundedEndEnd,borderEndRadius:bdr-e/roundedEnd,borderEndStartRadius:bdr-es/roundedEndStart,borderInline:bd-x/borderX,borderInlineColor:bd-x-c/borderXColor,borderInlineEnd:bd-e/borderEnd,borderInlineEndColor:bd-e-c/borderEndColor,borderInlineEndWidth:bd-e-w/borderEndWidth,borderInlineStart:bd-s/borderStart,borderInlineStartColor:bd-s-c/borderStartColor,borderInlineStartWidth:bd-s-w/borderStartWidth,borderInlineWidth:bd-x-w/borderXWidth,borderLeft:bd-l,borderLeftColor:bd-l-c,borderLeftRadius:bdr-l/roundedLeft,borderLeftWidth:bd-l-w,borderRadius:bdr/rounded,borderRight:bd-r,borderRightColor:bd-r-c,borderRightRadius:bdr-r/roundedRight,borderRightWidth:bd-r-w,borderSpacing:bd-sp,borderSpacingX:bd-sx,borderSpacingY:bd-sy,borderStartEndRadius:bdr-se/roundedStartEnd,borderStartRadius:bdr-s/roundedStart,borderStartStartRadius:bdr-ss/roundedStartStart,borderTop:bd-t,borderTopColor:bd-t-c,borderTopLeftRadius:bdr-tl/roundedTopLeft,borderTopRadius:bdr-t/roundedTop,borderTopRightRadius:bdr-tr/roundedTopRight,borderTopWidth:bd-t-w,borderWidth:bd-w,boxDecorationBreak:bx-db,boxShadow:bx-sh/shadow,boxShadowColor:bx-sh-c/shadowColor,boxSize:size,boxSizing:bx-s,caretColor:ca-c,clipPath:cp-path,color:c,columnGap:cg,container:cq,containerName:cq-n,containerType:cq-t,display:d,divideColor:dvd-c,divideStyle:dvd-s,divideX:dvd-x,divideY:dvd-y,flexBasis:flex-b,flexDirection:flex-d/flexDir,flexGrow:flex-g,flexShrink:flex-sh,focusRingColor:focus-ring-c,focusRingOffset:focus-ring-o,focusRingStyle:focus-ring-s,focusRingWidth:focus-ring-w,focusVisibleRing:focus-v-ring,fontFamily:ff,fontFeatureSettings:ff-s,fontKerning:fk,fontPalette:fp,fontSize:fs,fontSizeAdjust:fs-a,fontSmoothing:fsmt,fontVariant:fv,fontVariantAlternates:fv-alt,fontVariantCaps:fv-caps,fontVariantNumeric:fv-num,fontVariationSettings:fv-s,fontWeight:fw,gradientFrom:grad-from,gradientFromPosition:grad-from-pos,gradientTo:grad-to,gradientToPosition:grad-to-pos,gradientVia:grad-via,gradientViaPosition:grad-via-pos,gridAutoColumns:grid-ac,gridAutoFlow:grid-af,gridAutoRows:grid-ar,gridColumn:grid-c,gridColumnEnd:grid-ce,gridColumnGap:grid-cg,gridColumnStart:grid-cs,gridGap:grid-g,gridRow:grid-r,gridRowGap:grid-rg,gridTemplateColumns:grid-tc,gridTemplateRows:grid-tr,height:h/1,hideBelow:show,hideFrom:hide,hyphens:hy,inlineSize:w-is,insetBlock:inset-y/insetY,insetBlockEnd:inset-be,insetBlockStart:inset-bs,insetInline:inset-x/insetX,insetInlineEnd:inset-e/end/insetEnd,insetInlineStart:inset-s/insetStart/start,justifyContent:jc,letterSpacing:ls,lineClamp:lc,lineHeight:lh,listStyle:li-s,listStyleImage:li-img,listStylePosition:li-pos,listStyleType:li-t,margin:m/1,marginBlock:my/marginY/1,marginBlockEnd:mbe,marginBlockStart:mbs,marginBottom:mb/1,marginInline:mx/marginX/1,marginInlineEnd:me/marginEnd/1,marginInlineStart:ms/marginStart/1,marginLeft:ml/1,marginRight:mr/1,marginTop:mt/1,mask:msk,maskBottomFrom:msk-b-from,maskBottomFromColor:msk-b-from-c,maskBottomTo:msk-b-to,maskBottomToColor:msk-b-to-c,maskClip:msk-cp,maskComposite:msk-cmp,maskConic:msk-conic,maskConicFrom:msk-conic-from,maskConicFromColor:msk-conic-from-c,maskConicTo:msk-conic-to,maskConicToColor:msk-conic-to-c,maskImage:msk-i,maskLeftFrom:msk-l-from,maskLeftFromColor:msk-l-from-c,maskLeftTo:msk-l-to,maskLeftToColor:msk-l-to-c,maskLinear:msk-linear,maskLinearFrom:msk-linear-from,maskLinearFromColor:msk-linear-from-c,maskLinearTo:msk-linear-to,maskLinearToColor:msk-linear-to-c,maskMode:msk-md,maskOrigin:msk-o,maskPosition:msk-p,maskRadial:msk-radial,maskRadialAt:msk-radial-at,maskRadialFrom:msk-radial-from,maskRadialFromColor:msk-radial-from-c,maskRadialShape:msk-radial-shape,maskRadialSize:msk-radial-sz,maskRadialTo:msk-radial-to,maskRadialToColor:msk-radial-to-c,maskRepeat:msk-r,maskRightFrom:msk-r-from,maskRightFromColor:msk-r-from-c,maskRightTo:msk-r-to,maskRightToColor:msk-r-to-c,maskSize:msk-s,maskTopFrom:msk-t-from,maskTopFromColor:msk-t-from-c,maskTopTo:msk-t-to,maskTopToColor:msk-t-to-c,maskType:msk-t,maskXFrom:msk-x-from,maskXFromColor:msk-x-from-c,maskXTo:msk-x-to,maskXToColor:msk-x-to-c,maskYFrom:msk-y-from,maskYFromColor:msk-y-from-c,maskYTo:msk-y-to,maskYToColor:msk-y-to-c,maxBlockSize:max-b,maxHeight:max-h/maxH,maxInlineSize:max-w-is,maxWidth:max-w/maxW,minBlockSize:min-h-bs,minHeight:min-h/minH,minInlineSize:min-w-is,minWidth:min-w/minW,mixBlendMode:mix-bm,objectFit:obj-f,objectPosition:obj-p,opacity:op,outline:ring/1,outlineColor:ring-c/ringColor,outlineOffset:ring-o/ringOffset,outlineWidth:ring-w/ringWidth,overflow:ov,overflowAnchor:ov-a,overflowBlock:ov-b,overflowClipBox:ovcp-bx,overflowClipMargin:ovcp-m,overflowInline:ov-i,overflowWrap:ov-wrap,overflowX:ov-x,overflowY:ov-y,overscrollBehavior:ovs-b,overscrollBehaviorBlock:ovs-bb,overscrollBehaviorInline:ovs-bi,overscrollBehaviorX:ovs-bx,overscrollBehaviorY:ovs-by,padding:p/1,paddingBlock:py/paddingY/1,paddingBlockEnd:pbe,paddingBlockStart:pbs,paddingBottom:pb/1,paddingInline:px/paddingX/1,paddingInlineEnd:pe/paddingEnd/1,paddingInlineStart:ps/paddingStart/1,paddingLeft:pl/1,paddingRight:pr/1,paddingTop:pt/1,position:pos/1,rowGap:rg,scrollBehavior:scr-bhv,scrollMargin:scr-m,scrollMarginBlock:scr-my/scrollMarginY,scrollMarginBlockEnd:scr-mbe,scrollMarginBlockStart:scr-mbt,scrollMarginBottom:scr-mb,scrollMarginInline:scr-mx/scrollMarginX,scrollMarginInlineEnd:scr-me,scrollMarginInlineStart:scr-ms,scrollMarginLeft:scr-ml,scrollMarginRight:scr-mr,scrollMarginTop:scr-mt,scrollPadding:scr-p,scrollPaddingBlock:scr-py/scrollPaddingY,scrollPaddingBlockEnd:scr-pbe,scrollPaddingBlockStart:scr-pbs,scrollPaddingBottom:scr-pb,scrollPaddingInline:scr-px/scrollPaddingX,scrollPaddingInlineEnd:scr-pe,scrollPaddingInlineStart:scr-ps,scrollPaddingLeft:scr-pl,scrollPaddingRight:scr-pr,scrollPaddingTop:scr-pt,scrollSnapAlign:scr-sa,scrollSnapCoordinate:scrs-c,scrollSnapDestination:scrs-d,scrollSnapMargin:scrs-m,scrollSnapMarginBottom:scrs-mb,scrollSnapMarginLeft:scrs-ml,scrollSnapMarginRight:scrs-mr,scrollSnapMarginTop:scrs-mt,scrollSnapPointsX:scrs-px,scrollSnapPointsY:scrs-py,scrollSnapStop:scrs-s,scrollSnapStrictness:scrs-strt,scrollSnapType:scrs-t,scrollSnapTypeX:scrs-tx,scrollSnapTypeY:scrs-ty,scrollTimeline:scrtl,scrollTimelineAxis:scrtl-a,scrollTimelineName:scrtl-n,scrollbar:scr-bar,scrollbarColor:scr-bar-c,scrollbarGutter:scr-bar-g,scrollbarThumb:scr-bar-th,scrollbarTrack:scr-bar-tk,scrollbarWidth:scr-bar-w,spaceX:sx,spaceY:sy,srOnly:sr,stroke:stk,strokeDasharray:stk-dsh,strokeDashoffset:stk-do,strokeLinecap:stk-lc,strokeLinejoin:stk-lj,strokeMiterlimit:stk-ml,strokeOpacity:stk-op,strokeWidth:stk-w,tableLayout:tbl,textAlign:ta,textDecoration:td,textDecorationColor:td-c,textDecorationStyle:td-s,textDecorationThickness:td-t,textEmphasisColor:te-c,textGradient:txt-grad,textIndent:ti,textOverflow:tov,textShadow:tsh,textShadowColor:tsh-c/textShadowColor,textSizeAdjust:txt-adj,textStyle:textStyle,textTransform:tt,textUnderlineOffset:tu-o,textWrap:tw,touchAction:tch-a,transform:trf,transformBox:trf-b,transformOrigin:trf-o,transformStyle:trf-s,transition:trs,transitionDelay:trs-dly,transitionDuration:trs-dur,transitionProperty:trs-prop,transitionTimingFunction:trs-tmf,translateX:/x,translateY:/y,translateZ:/z,truncate:trunc,userSelect:us,verticalAlign:va,visibility:vis,width:w/1,wordBreak:wb,zIndex:z"
+
+function createCssContext() {
+  const classNameByProp = new Map()
+  const shorthands = new Map()
+  if (utilities) {
+    utilities.split(",").forEach((utility) => {
+      const [prop, meta] = utility.split(":")
+      const [className, ...shorthandList] = meta.split("/")
+      if (className) classNameByProp.set(prop, className)
+      shorthandList.forEach((shorthand) => {
+        const key = shorthand === "1" ? className : shorthand
+        shorthands.set(key, prop)
+      })
+    })
+  }
+
+  const resolveShorthand = (prop) => shorthands.get(prop) || prop
+
+  return {
+    hash: false,
+    conditions: {
+      shift: sortConditions,
+      finalize: finalizeConditions,
+      breakpoints: { keys: breakpointKeys },
+    },
+    utility: {
+      prefix: null,
+      hasShorthand: true,
+      toHash(path, hashFn) {
+        return hashFn(path.join(":"))
+      },
+      transform(prop, value) {
+        const key = resolveShorthand(prop)
+        const propKey = classNameByProp.get(key) || hypenateProperty(key)
+        return { className: `${propKey}_${withoutSpace(value)}` }
+      },
+      resolveShorthand,
+    },
+  }
+}
+
+const cssContext = /* @__PURE__ */ createCssContext()
+const serializeCss = /* @__PURE__ */ createSerializeCss(cssContext)
+export const mergeCss = /* @__PURE__ */ createMergeCss(cssContext)
+const serializeCssArgs = /* @__PURE__ */ createSerializeCssArgs(serializeCss, mergeCss)
+
+export const css = /* @__PURE__ */ Object.assign(
+  function css(...styles) {
+    if (styles.length === 1 && isObject(styles[0])) return serializeCss(styles[0])
+    return serializeCssArgs(...styles)
+  },
+  {
+    raw: function cssRaw(...styles) {
+      return mergeCss(...styles)
+    },
+  },
+)
+
+export const assignCss = /* @__PURE__ */ createAssignCss(cssContext)

package/packages/panda/styled-system/css/cva.d.ts

@@ -1,6 +1,5 @@
-/* eslint-disable */
 import type { RecipeCreatorFn } from '../types/recipe';
 
-export declare const cva: RecipeCreatorFn
+export declare const cva: RecipeCreatorFn;
 
-export type { RecipeVariant, RecipeVariantProps } from '../types/recipe';
+export { RecipeVariant, RecipeVariantProps } from '../types/recipe';

package/packages/panda/styled-system/css/cva.js

@@ -0,0 +1,51 @@
+import { getCompoundVariantCss, memo, mergeProps, splitProps, toVariantMap, uniq, withDefaults } from '../helpers';
+import { css, mergeCss } from './css';
+
+export const cva = (config) => {
+  const defaults = (c) => ({ base: {}, variants: {}, defaultVariants: {}, compoundVariants: [], ...c })
+  const { base, variants, defaultVariants, compoundVariants } = defaults(config)
+
+  const getVariantProps = (props) => withDefaults(defaultVariants, props)
+
+  const resolve = (props = {}) => {
+    const computed = getVariantProps(props)
+    const styles = [base]
+    for (const key in computed) {
+      const value = computed[key]
+      if (variants[key]?.[value]) styles.push(variants[key][value])
+    }
+    styles.push(getCompoundVariantCss(compoundVariants, computed))
+    return mergeCss(...styles)
+  }
+
+  const variantKeys = Object.keys(variants)
+  const variantMap = toVariantMap(variants)
+  const resolveMemo = memo(resolve)
+
+  const merge = (other) => {
+    const override = defaults(other.config)
+    const keys = uniq(other.variantKeys, variantKeys)
+    return cva({
+      base: mergeCss(base, override.base),
+      variants: Object.fromEntries(keys.map((key) => [key, mergeCss(variants[key], override.variants[key])])),
+      defaultVariants: mergeProps(defaultVariants, override.defaultVariants),
+      compoundVariants: [...compoundVariants, ...override.compoundVariants],
+    })
+  }
+
+  return Object.assign(memo(function cvaFn(props) {
+    return css(resolve(props))
+  }), {
+    __cva__: true,
+    variantMap,
+    variantKeys,
+    raw: resolve,
+    __memoizedRaw__: resolveMemo,
+    config,
+    merge,
+    splitVariantProps(props) {
+      return splitProps(props, variantKeys)
+    },
+    getVariantProps,
+  })
+}

package/packages/panda/styled-system/css/cx.d.ts

@@ -1,5 +1,6 @@
-/* eslint-disable */
-type Argument = string | boolean | null | undefined
+type Argument = string | boolean | null | undefined;
 
-/** Conditionally join classNames into a single string */
-export declare function cx(...args: Argument[]): string
+/**
+ * Conditionally join classNames into a single string
+ */
+export declare function cx(...args: Argument[]): string;

package/packages/panda/styled-system/css/{cx.mjs → cx.js}

@@ -1,4 +1,7 @@
-function cx() {
+/**
+ * Conditionally join classNames into a single string
+ */
+export function cx(...args) {
   let str = '',
     i = 0,
     arg
@@ -10,6 +13,4 @@ function cx() {
     }
   }
   return str
-}
-
-export { cx }
+}

package/packages/panda/styled-system/css/first-that-works.d.ts

@@ -0,0 +1,22 @@
+export type FirstThatWorksMember = string | number;
+
+export type FirstThatWorksMemberOf<T> = Extract<T, FirstThatWorksMember>;
+
+export type FirstThatWorksFn = <
+  T = FirstThatWorksMember,
+  A extends FirstThatWorksMemberOf<T> = FirstThatWorksMemberOf<T>,
+  B extends FirstThatWorksMemberOf<T> = FirstThatWorksMemberOf<T>,
+  C extends FirstThatWorksMemberOf<T> = never,
+  D extends FirstThatWorksMemberOf<T> = never,
+  E extends FirstThatWorksMemberOf<T> = never,
+  F extends FirstThatWorksMemberOf<T> = never,
+>(
+  first: A,
+  second: B,
+  third?: C,
+  fourth?: D,
+  fifth?: E,
+  sixth?: F,
+) => T extends FirstThatWorksMember ? A | B | C | D | E | F : FirstThatWorksMemberOf<T>;
+
+export declare const firstThatWorks: FirstThatWorksFn;

package/packages/panda/styled-system/css/first-that-works.js

@@ -0,0 +1 @@
+export const firstThatWorks = (...values) => `firstThatWorks(${values.join(', ')})`

package/packages/panda/styled-system/css/index.d.ts

@@ -1,5 +1,8 @@
-/* eslint-disable */
 export * from './css';
-export * from './cx';
 export * from './cva';
-export * from './sva';
+export * from './cx';
+export * from './sva';
+export * from './view-transition';
+export * from './position-try';
+export * from './keyframes';
+export * from './first-that-works';

package/packages/panda/styled-system/css/index.js

@@ -0,0 +1,8 @@
+export * from './css';
+export * from './cva';
+export * from './cx';
+export * from './sva';
+export * from './view-transition';
+export * from './position-try';
+export * from './keyframes';
+export * from './first-that-works';

package/packages/panda/styled-system/css/keyframes.d.ts

@@ -0,0 +1,5 @@
+import type { CssKeyframes } from '../types/system';
+
+export type KeyframesFn = (keyframe: CssKeyframes[string]) => string;
+
+export declare const keyframes: KeyframesFn;

package/packages/panda/styled-system/css/keyframes.js

@@ -0,0 +1,8 @@
+import { stableStringify, toHash } from '../helpers';
+
+export const keyframes = (keyframe) => {
+  const prefix = null
+  const wrap = (base) => (prefix ? prefix + '-' + base : base)
+  const block = keyframe && typeof keyframe === 'object' ? keyframe : {}
+  return wrap('kf_' + toHash(stableStringify(block)))
+}

package/packages/panda/styled-system/css/position-try.d.ts

@@ -0,0 +1,5 @@
+import type { SystemStyleObject } from '../types/system';
+
+export type PositionTryFn = (options: SystemStyleObject) => string;
+
+export declare const positionTry: PositionTryFn;

package/packages/panda/styled-system/css/position-try.js

@@ -0,0 +1,11 @@
+import { stableStringify, toHash } from '../helpers';
+
+export const positionTry = (options) => {
+  const prefix = null
+  const wrap = (base) => '--' + (prefix ? prefix + '-' + base : base)
+  if (typeof options === 'string') {
+    return wrap('pt_' + options)
+  }
+  const block = options && typeof options === 'object' ? options : {}
+  return wrap('pt_' + toHash(stableStringify(block)))
+}

package/packages/panda/styled-system/css/sva.d.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import type { SlotRecipeCreatorFn } from '../types/recipe';
 
-export declare const sva: SlotRecipeCreatorFn
+export declare const sva: SlotRecipeCreatorFn;

package/packages/panda/styled-system/css/sva.js

@@ -0,0 +1,49 @@
+import { getSlotRecipes, memo, splitProps, toVariantMap, withDefaults } from '../helpers';
+import { cva } from './cva';
+import { cx } from './cx';
+
+export const sva = (config) => {
+  const slotRecipes = getSlotRecipes(config)
+  const slots = []
+  for (const slot in slotRecipes) slots.push([slot, cva(slotRecipes[slot])])
+
+  const defaultVariants = config.defaultVariants ?? {}
+
+  const classNameMap = {}
+  if (config.className) {
+    for (const [slot, slotFn] of slots) classNameMap[slot] = slotFn.config.className
+  }
+
+  const variants = config.variants ?? {}
+  const variantKeys = Object.keys(variants)
+  const variantMap = toVariantMap(variants)
+
+  const svaFn = (props) => {
+    const result = {}
+    for (const [slot, slotFn] of slots) result[slot] = cx(slotFn(props), classNameMap[slot])
+    return result
+  }
+
+  const raw = (props) => {
+    const result = {}
+    for (const [slot, slotFn] of slots) result[slot] = slotFn.raw(props)
+    return result
+  }
+  const rawMemo = memo(raw)
+
+  return Object.assign(memo(svaFn), {
+    __cva__: false,
+    raw,
+    __memoizedRaw__: rawMemo,
+    config,
+    variantMap,
+    variantKeys,
+    classNameMap,
+    splitVariantProps(props) {
+      return splitProps(props, variantKeys)
+    },
+    getVariantProps(props) {
+      return withDefaults(defaultVariants, props)
+    },
+  })
+}

package/packages/panda/styled-system/css/view-transition.d.ts

@@ -0,0 +1,7 @@
+import type { SystemStyleObject } from '../types/system';
+
+export type ViewTransitionStyleObject = { group?: SystemStyleObject; imagePair?: SystemStyleObject; old?: SystemStyleObject; new?: SystemStyleObject };
+
+export type ViewTransitionFn = (options: ViewTransitionStyleObject) => string;
+
+export declare const viewTransition: ViewTransitionFn;

package/packages/panda/styled-system/css/view-transition.js

@@ -0,0 +1,18 @@
+import { stableStringify, toHash } from '../helpers';
+
+export const viewTransition = (options) => {
+  const prefix = null
+  if (typeof options === 'string') {
+    const base = 'vt_' + options
+    return prefix ? prefix + '-' + base : base
+  }
+  const slots = ['group', 'imagePair', 'old', 'new']
+  const filtered = {}
+  if (options && typeof options === 'object') {
+    for (const key of slots) {
+      if (key in options) filtered[key] = options[key]
+    }
+  }
+  const base = 'vt_' + toHash(stableStringify(filtered))
+  return prefix ? prefix + '-' + base : base
+}

package/packages/panda/styled-system/helpers.d.ts

@@ -0,0 +1,67 @@
+export declare function isObject(v: unknown): v is Record<string, unknown>;
+
+export declare function isBaseCondition(v: string): boolean;
+
+export declare function filterBaseConditions(c: string[]): string[];
+
+export declare function toHash(v: string): string;
+
+export declare function stableStringify(value: any): string;
+
+export declare function toCssVar(path: string): string;
+
+export declare function colorMix(tokens: Record<string, string>, path: string, resolveVar?: (path: string) => string): string | undefined;
+
+export declare function compact<T extends Record<string, unknown>>(v: T): Partial<T>;
+
+export declare function withDefaults(defaults: Record<string, any>, props: Record<string, any>): Record<string, any>;
+
+export declare function toVariantMap(variants: Record<string, any>): Record<string, any>;
+
+export declare function getCompoundVariantClassNames(compoundVariants: Array<Record<string, any>>, variants: Record<string, any>, formatClassName?: (className: string) => string): string;
+
+export declare function getCompoundVariantCss(compoundVariants: Array<Record<string, any>>, variants: Record<string, any>): Record<string, any>;
+
+export declare function getSlotCompoundVariant(compoundVariants: Array<Record<string, any>>, slot: string): Array<Record<string, any>>;
+
+export declare function getSlotRecipes(recipe: Record<string, any>): Record<string, any>;
+
+export declare function toResponsiveObject(values: any[], breakpoints: string[]): Record<string, any>;
+
+export declare function walkObject(target: unknown, fn: (value: any, path: string[]) => any, options?: Record<string, any>): any;
+
+export declare function mapObject(obj: unknown, fn: (value: any) => any): any;
+
+export declare function normalizeStyleObject(styles: Record<string, any>, context: Record<string, any>, shorthand?: boolean): Record<string, any>;
+
+export declare function memo<T extends (...args: any[]) => any>(fn: T): T;
+
+export declare function weakMemo<T extends (arg: any) => any>(fn: T): T;
+
+export declare function mergeProps(...src: Array<Record<string, any> | undefined>): Record<string, any>;
+
+export declare function resolveStyleArgs(styles: Array<any> | IArguments, context: Record<string, any>): any[];
+
+export declare function createSerializeCss(context: Record<string, any>): (...styles: any[]) => string;
+
+export declare function createMergeCss(context: Record<string, any>): (...styles: any[]) => any;
+
+export declare function createSerializeCssArgs(serializeCss: (...styles: any[]) => string, mergeCss: (...styles: any[]) => any): (...styles: any[]) => string;
+
+export declare function createAssignCss(context: Record<string, any>): (...styles: any[]) => any;
+
+export declare function hypenateProperty(property: string): string;
+
+export declare function splitProps<T extends Record<string, any>>(props: T, ...keys: Array<Array<keyof T> | ((key: keyof T) => boolean)>): any[];
+
+export declare const normalizeHTMLProps: ((props: Record<string, any>) => Record<string, any>) & {
+  keys: string[];
+};
+
+export declare function uniq<T>(...items: Array<T[] | undefined>): T[];
+
+export declare function withoutSpace<T extends string | number | boolean>(str: T): T;
+
+export declare function isImportant(value: unknown): boolean;
+
+export declare function withoutImportant<T extends string | number | boolean>(value: T): T;