@nation-a/ui 0.16.28 → 0.17.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (132) hide show
  1. package/dist/ark-ui-D--_sKY0.js +7066 -0
  2. package/dist/ark-ui-D--_sKY0.js.map +1 -0
  3. package/dist/ark-ui-e4-hVrsF.cjs +2 -0
  4. package/dist/ark-ui-e4-hVrsF.cjs.map +1 -0
  5. package/dist/{index-BroabscA.cjs → index-B5IKaL0m.cjs} +2 -2
  6. package/dist/index-B5IKaL0m.cjs.map +1 -0
  7. package/dist/{index-B4n-XEbJ.js → index-FC3cETza.js} +2 -2
  8. package/dist/index-FC3cETza.js.map +1 -0
  9. package/dist/index.cjs +7 -7
  10. package/dist/index.cjs.map +1 -1
  11. package/dist/index.js +5010 -4958
  12. package/dist/index.js.map +1 -1
  13. package/dist/react-hot-toast-BCKriZQY.js +404 -0
  14. package/dist/react-hot-toast-BCKriZQY.js.map +1 -0
  15. package/dist/react-hot-toast-CvGdrsnM.cjs +178 -0
  16. package/dist/react-hot-toast-CvGdrsnM.cjs.map +1 -0
  17. package/dist/{react-lottie-DygynGMG.js → react-lottie-BoWlnUa4.js} +257 -257
  18. package/dist/react-lottie-BoWlnUa4.js.map +1 -0
  19. package/dist/react-lottie-D3xAW5ky.cjs +29 -0
  20. package/dist/react-lottie-D3xAW5ky.cjs.map +1 -0
  21. package/dist/stats.html +1 -1
  22. package/dist/styled-system/css/conditions.mjs +1 -1
  23. package/dist/styled-system/css/css.mjs +1 -1
  24. package/dist/styled-system/css/sva.mjs +9 -4
  25. package/dist/styled-system/helpers.mjs +12 -20
  26. package/dist/styled-system/jsx/create-style-context.d.ts +54 -0
  27. package/dist/styled-system/jsx/create-style-context.mjs +98 -0
  28. package/dist/styled-system/jsx/factory.mjs +14 -5
  29. package/dist/styled-system/jsx/index.d.ts +1 -0
  30. package/dist/styled-system/jsx/index.mjs +1 -0
  31. package/dist/styled-system/patterns/aspect-ratio.d.ts +0 -1
  32. package/dist/styled-system/patterns/bleed.d.ts +0 -1
  33. package/dist/styled-system/patterns/box.d.ts +0 -1
  34. package/dist/styled-system/patterns/center.d.ts +0 -1
  35. package/dist/styled-system/patterns/circle.d.ts +0 -1
  36. package/dist/styled-system/patterns/container.d.ts +0 -1
  37. package/dist/styled-system/patterns/cq.d.ts +0 -1
  38. package/dist/styled-system/patterns/divider.d.ts +0 -1
  39. package/dist/styled-system/patterns/flex.d.ts +0 -1
  40. package/dist/styled-system/patterns/float.d.ts +0 -1
  41. package/dist/styled-system/patterns/grid-item.d.ts +0 -1
  42. package/dist/styled-system/patterns/grid.d.ts +0 -1
  43. package/dist/styled-system/patterns/grid.mjs +1 -1
  44. package/dist/styled-system/patterns/hstack.d.ts +0 -1
  45. package/dist/styled-system/patterns/hstack.mjs +1 -1
  46. package/dist/styled-system/patterns/link-overlay.d.ts +0 -1
  47. package/dist/styled-system/patterns/spacer.d.ts +0 -1
  48. package/dist/styled-system/patterns/square.d.ts +0 -1
  49. package/dist/styled-system/patterns/stack.d.ts +0 -1
  50. package/dist/styled-system/patterns/stack.mjs +1 -1
  51. package/dist/styled-system/patterns/visually-hidden.d.ts +0 -1
  52. package/dist/styled-system/patterns/vstack.d.ts +0 -1
  53. package/dist/styled-system/patterns/vstack.mjs +1 -1
  54. package/dist/styled-system/patterns/wrap.d.ts +0 -1
  55. package/dist/styled-system/patterns/wrap.mjs +1 -1
  56. package/dist/styled-system/styles.css +1003 -993
  57. package/dist/styled-system/tokens/tokens.d.ts +1 -1
  58. package/dist/styled-system/types/composition.d.ts +83 -23
  59. package/dist/styled-system/types/conditions.d.ts +13 -9
  60. package/dist/styled-system/types/jsx.d.ts +25 -10
  61. package/dist/styled-system/types/prop-type.d.ts +12 -1
  62. package/dist/styled-system/types/style-props.d.ts +17 -5
  63. package/dist/styled-system/types/system-types.d.ts +76 -0
  64. package/dist/types/components/BottomSheet/BottomSheet.stories.d.ts +322 -4
  65. package/dist/types/components/BottomSheet/index.d.ts +23 -21
  66. package/dist/types/components/BottomSheet/react-modal-sheet/SheetBackdrop.d.ts +6 -1
  67. package/dist/types/components/BottomSheet/react-modal-sheet/SheetContainer.d.ts +7 -5
  68. package/dist/types/components/BottomSheet/react-modal-sheet/SheetContent.d.ts +7 -6
  69. package/dist/types/components/BottomSheet/react-modal-sheet/SheetHeader.d.ts +7 -6
  70. package/dist/types/components/BottomSheet/react-modal-sheet/SheetScroller.d.ts +7 -3
  71. package/dist/types/components/BottomSheet/react-modal-sheet/constants.d.ts +3 -8
  72. package/dist/types/components/BottomSheet/react-modal-sheet/hooks.d.ts +1 -1
  73. package/dist/types/components/BottomSheet/react-modal-sheet/index.d.ts +1 -1
  74. package/dist/types/components/BottomSheet/react-modal-sheet/sheet.d.ts +7 -16
  75. package/dist/types/components/BottomSheet/react-modal-sheet/types.d.ts +5 -5
  76. package/dist/types/components/Button/Button.stories.d.ts +10 -3
  77. package/dist/types/components/Button/index.d.ts +8 -298
  78. package/dist/types/components/Checkbox/checkbox.stories.d.ts +15 -3
  79. package/dist/types/components/Checkbox/checkbox.styled.d.ts +29 -12
  80. package/dist/types/components/Checkbox/index.d.ts +4 -1
  81. package/dist/types/components/Dialog/Dialog.stories.d.ts +9 -3
  82. package/dist/types/components/Dialog/index.d.ts +15 -25
  83. package/dist/types/components/Fab/Fab.stories.d.ts +25 -3
  84. package/dist/types/components/Fab/index.d.ts +301 -2
  85. package/dist/types/components/IconButton/IconButton.stories.d.ts +43 -3
  86. package/dist/types/components/IconButton/index.d.ts +5 -6
  87. package/dist/types/components/Input/Input.stories.d.ts +1 -1
  88. package/dist/types/components/Input/index.d.ts +4 -1
  89. package/dist/types/components/Layout/index.d.ts +16 -16
  90. package/dist/types/components/List/List.stories.d.ts +64 -4
  91. package/dist/types/components/List/index.d.ts +82 -13
  92. package/dist/types/components/Navigation/Navigation.stories.d.ts +9 -4
  93. package/dist/types/components/Navigation/index.d.ts +6 -9
  94. package/dist/types/components/RadioGroup/Radio.stories.d.ts +8 -3
  95. package/dist/types/components/RadioGroup/index.d.ts +10 -9
  96. package/dist/types/components/RadioGroup/radio.recipe.d.ts +1 -1
  97. package/dist/types/components/Select/Select.stories.d.ts +1 -9
  98. package/dist/types/components/Select/index.d.ts +75 -28
  99. package/dist/types/components/Select/select.recipe.d.ts +1 -1
  100. package/dist/types/components/Spinner/Spinner.stories.d.ts +1 -1
  101. package/dist/types/components/Spinner/index.d.ts +4 -1
  102. package/dist/types/components/Switch/Switch.stories.d.ts +1 -1
  103. package/dist/types/components/Switch/index.d.ts +5 -2
  104. package/dist/types/components/Switch/switch.styled.d.ts +89 -15
  105. package/dist/types/components/Tabs/Tabs.stories.d.ts +8 -4
  106. package/dist/types/components/Tabs/index.d.ts +208 -29
  107. package/dist/types/components/Tag/Tag.stories.d.ts +9 -4
  108. package/dist/types/components/Tag/index.d.ts +5 -2
  109. package/dist/types/components/Text/Text.stories.d.ts +25 -3
  110. package/dist/types/components/Text/index.d.ts +4 -276
  111. package/dist/types/components/TextArea/TextArea.stories.d.ts +9 -4
  112. package/dist/types/components/TextArea/index.d.ts +4 -1
  113. package/dist/types/components/Toast/Toast.stories.d.ts +9 -4
  114. package/dist/types/components/Toast/index.d.ts +47 -24
  115. package/dist/types/index.d.ts +0 -1
  116. package/dist/types/utils/with-polymorphic-component.d.ts +5 -4
  117. package/package.json +35 -40
  118. package/dist/ark-ui-BakX7_HR.cjs +0 -2
  119. package/dist/ark-ui-BakX7_HR.cjs.map +0 -1
  120. package/dist/ark-ui-BitYUtmQ.js +0 -6713
  121. package/dist/ark-ui-BitYUtmQ.js.map +0 -1
  122. package/dist/index-B4n-XEbJ.js.map +0 -1
  123. package/dist/index-BroabscA.cjs.map +0 -1
  124. package/dist/react-hot-toast-BQTk3w2h.cjs +0 -178
  125. package/dist/react-hot-toast-BQTk3w2h.cjs.map +0 -1
  126. package/dist/react-hot-toast-CPO7pUT3.js +0 -389
  127. package/dist/react-hot-toast-CPO7pUT3.js.map +0 -1
  128. package/dist/react-lottie-DTf3gNPc.cjs +0 -29
  129. package/dist/react-lottie-DTf3gNPc.cjs.map +0 -1
  130. package/dist/react-lottie-DygynGMG.js.map +0 -1
  131. package/dist/types/utils/create-style-context.d.ts +0 -20
  132. package/dist/types/utils/index.d.ts +0 -1
@@ -1,6 +1,6 @@
1
1
  import { withoutSpace } from '../helpers.mjs';
2
2
 
3
- const conditionsStr = "_hover,_focus,_focusWithin,_focusVisible,_disabled,_active,_visited,_target,_readOnly,_readWrite,_empty,_checked,_enabled,_expanded,_highlighted,_complete,_incomplete,_dragging,_before,_after,_firstLetter,_firstLine,_marker,_selection,_file,_backdrop,_first,_last,_only,_even,_odd,_firstOfType,_lastOfType,_onlyOfType,_peerFocus,_peerHover,_peerActive,_peerFocusWithin,_peerFocusVisible,_peerDisabled,_peerChecked,_peerInvalid,_peerExpanded,_peerPlaceholderShown,_groupFocus,_groupHover,_groupActive,_groupFocusWithin,_groupFocusVisible,_groupDisabled,_groupChecked,_groupExpanded,_groupInvalid,_indeterminate,_required,_valid,_invalid,_autofill,_inRange,_outOfRange,_placeholder,_placeholderShown,_pressed,_selected,_grabbed,_underValue,_overValue,_atValue,_default,_optional,_open,_closed,_fullscreen,_loading,_hidden,_current,_currentPage,_currentStep,_today,_unavailable,_rangeStart,_rangeEnd,_now,_topmost,_motionReduce,_motionSafe,_print,_landscape,_portrait,_dark,_light,_osDark,_osLight,_highContrast,_lessContrast,_moreContrast,_ltr,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_horizontal,_vertical,_icon,_starting,_collapsed,_off,_on,xs,xsOnly,xsDown,sm,smOnly,smDown,md,mdOnly,mdDown,lg,lgOnly,lgDown,xl,xlOnly,xlDown,2xl,2xlOnly,2xlDown,xsToSm,xsToMd,xsToLg,xsToXl,xsTo2xl,smToMd,smToLg,smToXl,smTo2xl,mdToLg,mdToXl,mdTo2xl,lgToXl,lgTo2xl,xlTo2xl,base"
3
+ const conditionsStr = "_hover,_focus,_focusWithin,_focusVisible,_disabled,_active,_visited,_target,_readOnly,_readWrite,_empty,_checked,_enabled,_expanded,_highlighted,_complete,_incomplete,_dragging,_before,_after,_firstLetter,_firstLine,_marker,_selection,_file,_backdrop,_first,_last,_only,_even,_odd,_firstOfType,_lastOfType,_onlyOfType,_peerFocus,_peerHover,_peerActive,_peerFocusWithin,_peerFocusVisible,_peerDisabled,_peerChecked,_peerInvalid,_peerExpanded,_peerPlaceholderShown,_groupFocus,_groupHover,_groupActive,_groupFocusWithin,_groupFocusVisible,_groupDisabled,_groupChecked,_groupExpanded,_groupInvalid,_indeterminate,_required,_valid,_invalid,_autofill,_inRange,_outOfRange,_placeholder,_placeholderShown,_pressed,_selected,_grabbed,_underValue,_overValue,_atValue,_default,_optional,_open,_closed,_fullscreen,_loading,_hidden,_current,_currentPage,_currentStep,_today,_unavailable,_rangeStart,_rangeEnd,_now,_topmost,_motionReduce,_motionSafe,_print,_landscape,_portrait,_dark,_light,_osDark,_osLight,_highContrast,_lessContrast,_moreContrast,_ltr,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_horizontal,_vertical,_icon,_starting,_noscript,_invertedColors,_collapsed,_off,_on,xs,xsOnly,xsDown,sm,smOnly,smDown,md,mdOnly,mdDown,lg,lgOnly,lgDown,xl,xlOnly,xlDown,2xl,2xlOnly,2xlDown,xsToSm,xsToMd,xsToLg,xsToXl,xsTo2xl,smToMd,smToLg,smToXl,smTo2xl,mdToLg,mdToXl,mdTo2xl,lgToXl,lgTo2xl,xlTo2xl,base"
4
4
  const conditions = new Set(conditionsStr.split(','))
5
5
 
6
6
  const conditionRegex = /^@|&|&$/
@@ -1,7 +1,7 @@
1
1
  import { createCss, createMergeCss, hypenateProperty, withoutSpace } from '../helpers.mjs';
2
2
  import { sortConditions, finalizeConditions } from './conditions.mjs';
3
3
 
4
- const utilities = "aspectRatio:asp,boxDecorationBreak:bx-db,zIndex:z,boxSizing:bx-s,objectPosition:obj-p,objectFit:obj-f,overscrollBehavior:ovs-b,overscrollBehaviorX:ovs-bx,overscrollBehaviorY:ovs-by,position:pos/1,top:top,left:left,inset:inset,insetInline:inset-x/insetX,insetBlock:inset-y/insetY,insetBlockEnd:inset-be,insetBlockStart:inset-bs,insetInlineEnd:inset-e/insetEnd/end,insetInlineStart:inset-s/insetStart/start,right:right,bottom:bottom,float:float,visibility:vis,display:d,hideFrom:hide,hideBelow:show,flexBasis:flex-b,flex:flex,flexDirection:flex-d/flexDir,flexGrow:flex-g,flexShrink:flex-sh,gridTemplateColumns:grid-tc,gridTemplateRows:grid-tr,gridColumn:grid-c,gridRow:grid-r,gridColumnStart:grid-cs,gridColumnEnd:grid-ce,gridAutoFlow:grid-af,gridAutoColumns:grid-ac,gridAutoRows:grid-ar,gap:gap,gridGap:grid-g,gridRowGap:grid-rg,gridColumnGap:grid-cg,rowGap:rg,columnGap:cg,justifyContent:jc,alignContent:ac,alignItems:ai,alignSelf:as,padding:p/1,paddingLeft:pl/1,paddingRight:pr/1,paddingTop:pt/1,paddingBottom:pb/1,paddingBlock:py/1/paddingY,paddingBlockEnd:pbe,paddingBlockStart:pbs,paddingInline:px/paddingX/1,paddingInlineEnd:pe/1/paddingEnd,paddingInlineStart:ps/1/paddingStart,marginLeft:ml/1,marginRight:mr/1,marginTop:mt/1,marginBottom:mb/1,margin:m/1,marginBlock:my/1/marginY,marginBlockEnd:mbe,marginBlockStart:mbs,marginInline:mx/1/marginX,marginInlineEnd:me/1/marginEnd,marginInlineStart:ms/1/marginStart,spaceX:sx,spaceY:sy,outlineWidth:ring-w/ringWidth,outlineColor:ring-c/ringColor,outline:ring/1,outlineOffset:ring-o/ringOffset,divideX:dvd-x,divideY:dvd-y,divideColor:dvd-c,divideStyle:dvd-s,width:w/1,inlineSize:w-is,minWidth:min-w/minW,minInlineSize:min-w-is,maxWidth:max-w/maxW,maxInlineSize:max-w-is,height:h/1,blockSize:h-bs,minHeight:min-h/minH,minBlockSize:min-h-bs,maxHeight:max-h/maxH,maxBlockSize:max-b,color:c,fontFamily:ff,fontSize:fs,fontSizeAdjust:fs-a,fontPalette:fp,fontKerning:fk,fontFeatureSettings:ff-s,fontWeight:fw,fontSmoothing:fsmt,fontVariant:fv,fontVariantAlternates:fv-alt,fontVariantCaps:fv-caps,fontVariationSettings:fv-s,fontVariantNumeric:fv-num,letterSpacing:ls,lineHeight:lh,textAlign:ta,textDecoration:td,textDecorationColor:td-c,textEmphasisColor:te-c,textDecorationStyle:td-s,textDecorationThickness:td-t,textUnderlineOffset:tu-o,textTransform:tt,textIndent:ti,textShadow:tsh,textShadowColor:tsh-c/textShadowColor,textOverflow:tov,verticalAlign:va,wordBreak:wb,textWrap:tw,truncate:trunc,lineClamp:lc,listStyleType:li-t,listStylePosition:li-pos,listStyleImage:li-img,listStyle:li-s,backgroundPosition:bg-p/bgPosition,backgroundPositionX:bg-p-x/bgPositionX,backgroundPositionY:bg-p-y/bgPositionY,backgroundAttachment:bg-a/bgAttachment,backgroundClip:bg-cp/bgClip,background:bg/1,backgroundColor:bg-c/bgColor,backgroundOrigin:bg-o/bgOrigin,backgroundImage:bg-i/bgImage,backgroundRepeat:bg-r/bgRepeat,backgroundBlendMode:bg-bm/bgBlendMode,backgroundSize:bg-s/bgSize,backgroundGradient:bg-grad/bgGradient,textGradient:txt-grad,gradientFromPosition:grad-from-pos,gradientToPosition:grad-to-pos,gradientFrom:grad-from,gradientTo:grad-to,gradientVia:grad-via,gradientViaPosition:grad-via-pos,borderRadius:bdr/rounded,borderTopLeftRadius:bdr-tl/roundedTopLeft,borderTopRightRadius:bdr-tr/roundedTopRight,borderBottomRightRadius:bdr-br/roundedBottomRight,borderBottomLeftRadius:bdr-bl/roundedBottomLeft,borderTopRadius:bdr-t/roundedTop,borderRightRadius:bdr-r/roundedRight,borderBottomRadius:bdr-b/roundedBottom,borderLeftRadius:bdr-l/roundedLeft,borderStartStartRadius:bdr-ss/roundedStartStart,borderStartEndRadius:bdr-se/roundedStartEnd,borderStartRadius:bdr-s/roundedStart,borderEndStartRadius:bdr-es/roundedEndStart,borderEndEndRadius:bdr-ee/roundedEndEnd,borderEndRadius:bdr-e/roundedEnd,border:bd,borderWidth:bd-w,borderTopWidth:bd-t-w,borderLeftWidth:bd-l-w,borderRightWidth:bd-r-w,borderBottomWidth:bd-b-w,borderColor:bd-c,borderInline:bd-x/borderX,borderInlineWidth:bd-x-w/borderXWidth,borderInlineColor:bd-x-c/borderXColor,borderBlock:bd-y/borderY,borderBlockWidth:bd-y-w/borderYWidth,borderBlockColor:bd-y-c/borderYColor,borderLeft:bd-l,borderLeftColor:bd-l-c,borderInlineStart:bd-s/borderStart,borderInlineStartWidth:bd-s-w/borderStartWidth,borderInlineStartColor:bd-s-c/borderStartColor,borderRight:bd-r,borderRightColor:bd-r-c,borderInlineEnd:bd-e/borderEnd,borderInlineEndWidth:bd-e-w/borderEndWidth,borderInlineEndColor:bd-e-c/borderEndColor,borderTop:bd-t,borderTopColor:bd-t-c,borderBottom:bd-b,borderBottomColor:bd-b-c,borderBlockEnd:bd-be,borderBlockEndColor:bd-be-c,borderBlockStart:bd-bs,borderBlockStartColor:bd-bs-c,opacity:op,boxShadow:bx-sh/shadow,boxShadowColor:bx-sh-c/shadowColor,mixBlendMode:mix-bm,filter:filter,brightness:brightness,contrast:contrast,grayscale:grayscale,hueRotate:hue-rotate,invert:invert,saturate:saturate,sepia:sepia,dropShadow:drop-shadow,blur:blur,backdropFilter:bkdp,backdropBlur:bkdp-blur,backdropBrightness:bkdp-brightness,backdropContrast:bkdp-contrast,backdropGrayscale:bkdp-grayscale,backdropHueRotate:bkdp-hue-rotate,backdropInvert:bkdp-invert,backdropOpacity:bkdp-opacity,backdropSaturate:bkdp-saturate,backdropSepia:bkdp-sepia,borderCollapse:bd-cl,borderSpacing:bd-sp,borderSpacingX:bd-sx,borderSpacingY:bd-sy,tableLayout:tbl,transitionTimingFunction:trs-tmf,transitionDelay:trs-dly,transitionDuration:trs-dur,transitionProperty:trs-prop,transition:trs,animation:anim,animationName:anim-n,animationTimingFunction:anim-tmf,animationDuration:anim-dur,animationDelay:anim-dly,animationPlayState:anim-ps,animationComposition:anim-comp,animationFillMode:anim-fm,animationDirection:anim-dir,animationIterationCount:anim-ic,animationRange:anim-r,animationState:anim-s,animationRangeStart:anim-rs,animationRangeEnd:anim-re,animationTimeline:anim-tl,transformOrigin:trf-o,transformBox:trf-b,transformStyle:trf-s,transform:trf,rotate:rotate,rotateX:rotate-x,rotateY:rotate-y,rotateZ:rotate-z,scale:scale,scaleX:scale-x,scaleY:scale-y,translate:translate,translateX:translate-x/x,translateY:translate-y/y,translateZ:translate-z/z,accentColor:ac-c,caretColor:ca-c,scrollBehavior:scr-bhv,scrollbar:scr-bar,scrollbarColor:scr-bar-c,scrollbarGutter:scr-bar-g,scrollbarWidth:scr-bar-w,scrollMargin:scr-m,scrollMarginLeft:scr-ml,scrollMarginRight:scr-mr,scrollMarginTop:scr-mt,scrollMarginBottom:scr-mb,scrollMarginBlock:scr-my/scrollMarginY,scrollMarginBlockEnd:scr-mbe,scrollMarginBlockStart:scr-mbt,scrollMarginInline:scr-mx/scrollMarginX,scrollMarginInlineEnd:scr-me,scrollMarginInlineStart:scr-ms,scrollPadding:scr-p,scrollPaddingBlock:scr-py/scrollPaddingY,scrollPaddingBlockStart:scr-pbs,scrollPaddingBlockEnd:scr-pbe,scrollPaddingInline:scr-px/scrollPaddingX,scrollPaddingInlineEnd:scr-pe,scrollPaddingInlineStart:scr-ps,scrollPaddingLeft:scr-pl,scrollPaddingRight:scr-pr,scrollPaddingTop:scr-pt,scrollPaddingBottom:scr-pb,scrollSnapAlign:scr-sa,scrollSnapStop:scrs-s,scrollSnapType:scrs-t,scrollSnapStrictness:scrs-strt,scrollSnapMargin:scrs-m,scrollSnapMarginTop:scrs-mt,scrollSnapMarginBottom:scrs-mb,scrollSnapMarginLeft:scrs-ml,scrollSnapMarginRight:scrs-mr,scrollSnapCoordinate:scrs-c,scrollSnapDestination:scrs-d,scrollSnapPointsX:scrs-px,scrollSnapPointsY:scrs-py,scrollSnapTypeX:scrs-tx,scrollSnapTypeY:scrs-ty,scrollTimeline:scrtl,scrollTimelineAxis:scrtl-a,scrollTimelineName:scrtl-n,touchAction:tch-a,userSelect:us,overflow:ov,overflowWrap:ov-wrap,overflowX:ov-x,overflowY:ov-y,overflowAnchor:ov-a,overflowBlock:ov-b,overflowInline:ov-i,overflowClipBox:ovcp-bx,overflowClipMargin:ovcp-m,overscrollBehaviorBlock:ovs-bb,overscrollBehaviorInline:ovs-bi,fill:fill,stroke:stk,strokeWidth:stk-w,strokeDasharray:stk-dsh,strokeDashoffset:stk-do,strokeLinecap:stk-lc,strokeLinejoin:stk-lj,strokeMiterlimit:stk-ml,strokeOpacity:stk-op,srOnly:sr,debug:debug,appearance:ap,backfaceVisibility:bfv,clipPath:cp-path,hyphens:hy,mask:msk,maskImage:msk-i,maskSize:msk-s,textSizeAdjust:txt-adj,container:cq,containerName:cq-n,containerType:cq-t,cursor:cursor,textStyle:textStyle"
4
+ const utilities = "aspectRatio:asp,boxDecorationBreak:bx-db,zIndex:z,boxSizing:bx-s,objectPosition:obj-p,objectFit:obj-f,overscrollBehavior:ovs-b,overscrollBehaviorX:ovs-bx,overscrollBehaviorY:ovs-by,position:pos/1,top:top,left:left,inset:inset,insetInline:inset-x/insetX,insetBlock:inset-y/insetY,insetBlockEnd:inset-be,insetBlockStart:inset-bs,insetInlineEnd:inset-e/insetEnd/end,insetInlineStart:inset-s/insetStart/start,right:right,bottom:bottom,float:float,visibility:vis,display:d,hideFrom:hide,hideBelow:show,flexBasis:flex-b,flex:flex,flexDirection:flex-d/flexDir,flexGrow:flex-g,flexShrink:flex-sh,gridTemplateColumns:grid-tc,gridTemplateRows:grid-tr,gridColumn:grid-c,gridRow:grid-r,gridColumnStart:grid-cs,gridColumnEnd:grid-ce,gridAutoFlow:grid-af,gridAutoColumns:grid-ac,gridAutoRows:grid-ar,gap:gap,gridGap:grid-g,gridRowGap:grid-rg,gridColumnGap:grid-cg,rowGap:rg,columnGap:cg,justifyContent:jc,alignContent:ac,alignItems:ai,alignSelf:as,padding:p/1,paddingLeft:pl/1,paddingRight:pr/1,paddingTop:pt/1,paddingBottom:pb/1,paddingBlock:py/1/paddingY,paddingBlockEnd:pbe,paddingBlockStart:pbs,paddingInline:px/paddingX/1,paddingInlineEnd:pe/1/paddingEnd,paddingInlineStart:ps/1/paddingStart,marginLeft:ml/1,marginRight:mr/1,marginTop:mt/1,marginBottom:mb/1,margin:m/1,marginBlock:my/1/marginY,marginBlockEnd:mbe,marginBlockStart:mbs,marginInline:mx/1/marginX,marginInlineEnd:me/1/marginEnd,marginInlineStart:ms/1/marginStart,spaceX:sx,spaceY:sy,outlineWidth:ring-w/ringWidth,outlineColor:ring-c/ringColor,outline:ring/1,outlineOffset:ring-o/ringOffset,focusRing:focus-ring,focusVisibleRing:focus-v-ring,focusRingColor:focus-ring-c,focusRingOffset:focus-ring-o,focusRingWidth:focus-ring-w,focusRingStyle:focus-ring-s,divideX:dvd-x,divideY:dvd-y,divideColor:dvd-c,divideStyle:dvd-s,width:w/1,inlineSize:w-is,minWidth:min-w/minW,minInlineSize:min-w-is,maxWidth:max-w/maxW,maxInlineSize:max-w-is,height:h/1,blockSize:h-bs,minHeight:min-h/minH,minBlockSize:min-h-bs,maxHeight:max-h/maxH,maxBlockSize:max-b,boxSize:size,color:c,fontFamily:ff,fontSize:fs,fontSizeAdjust:fs-a,fontPalette:fp,fontKerning:fk,fontFeatureSettings:ff-s,fontWeight:fw,fontSmoothing:fsmt,fontVariant:fv,fontVariantAlternates:fv-alt,fontVariantCaps:fv-caps,fontVariationSettings:fv-s,fontVariantNumeric:fv-num,letterSpacing:ls,lineHeight:lh,textAlign:ta,textDecoration:td,textDecorationColor:td-c,textEmphasisColor:te-c,textDecorationStyle:td-s,textDecorationThickness:td-t,textUnderlineOffset:tu-o,textTransform:tt,textIndent:ti,textShadow:tsh,textShadowColor:tsh-c/textShadowColor,textOverflow:tov,verticalAlign:va,wordBreak:wb,textWrap:tw,truncate:trunc,lineClamp:lc,listStyleType:li-t,listStylePosition:li-pos,listStyleImage:li-img,listStyle:li-s,backgroundPosition:bg-p/bgPosition,backgroundPositionX:bg-p-x/bgPositionX,backgroundPositionY:bg-p-y/bgPositionY,backgroundAttachment:bg-a/bgAttachment,backgroundClip:bg-cp/bgClip,background:bg/1,backgroundColor:bg-c/bgColor,backgroundOrigin:bg-o/bgOrigin,backgroundImage:bg-i/bgImage,backgroundRepeat:bg-r/bgRepeat,backgroundBlendMode:bg-bm/bgBlendMode,backgroundSize:bg-s/bgSize,backgroundGradient:bg-grad/bgGradient,backgroundLinear:bg-linear/bgLinear,backgroundRadial:bg-radial/bgRadial,backgroundConic:bg-conic/bgConic,textGradient:txt-grad,gradientFromPosition:grad-from-pos,gradientToPosition:grad-to-pos,gradientFrom:grad-from,gradientTo:grad-to,gradientVia:grad-via,gradientViaPosition:grad-via-pos,borderRadius:bdr/rounded,borderTopLeftRadius:bdr-tl/roundedTopLeft,borderTopRightRadius:bdr-tr/roundedTopRight,borderBottomRightRadius:bdr-br/roundedBottomRight,borderBottomLeftRadius:bdr-bl/roundedBottomLeft,borderTopRadius:bdr-t/roundedTop,borderRightRadius:bdr-r/roundedRight,borderBottomRadius:bdr-b/roundedBottom,borderLeftRadius:bdr-l/roundedLeft,borderStartStartRadius:bdr-ss/roundedStartStart,borderStartEndRadius:bdr-se/roundedStartEnd,borderStartRadius:bdr-s/roundedStart,borderEndStartRadius:bdr-es/roundedEndStart,borderEndEndRadius:bdr-ee/roundedEndEnd,borderEndRadius:bdr-e/roundedEnd,border:bd,borderWidth:bd-w,borderTopWidth:bd-t-w,borderLeftWidth:bd-l-w,borderRightWidth:bd-r-w,borderBottomWidth:bd-b-w,borderBlockStartWidth:bd-bs-w,borderBlockEndWidth:bd-be-w,borderColor:bd-c,borderInline:bd-x/borderX,borderInlineWidth:bd-x-w/borderXWidth,borderInlineColor:bd-x-c/borderXColor,borderBlock:bd-y/borderY,borderBlockWidth:bd-y-w/borderYWidth,borderBlockColor:bd-y-c/borderYColor,borderLeft:bd-l,borderLeftColor:bd-l-c,borderInlineStart:bd-s/borderStart,borderInlineStartWidth:bd-s-w/borderStartWidth,borderInlineStartColor:bd-s-c/borderStartColor,borderRight:bd-r,borderRightColor:bd-r-c,borderInlineEnd:bd-e/borderEnd,borderInlineEndWidth:bd-e-w/borderEndWidth,borderInlineEndColor:bd-e-c/borderEndColor,borderTop:bd-t,borderTopColor:bd-t-c,borderBottom:bd-b,borderBottomColor:bd-b-c,borderBlockEnd:bd-be,borderBlockEndColor:bd-be-c,borderBlockStart:bd-bs,borderBlockStartColor:bd-bs-c,opacity:op,boxShadow:bx-sh/shadow,boxShadowColor:bx-sh-c/shadowColor,mixBlendMode:mix-bm,filter:filter,brightness:brightness,contrast:contrast,grayscale:grayscale,hueRotate:hue-rotate,invert:invert,saturate:saturate,sepia:sepia,dropShadow:drop-shadow,blur:blur,backdropFilter:bkdp,backdropBlur:bkdp-blur,backdropBrightness:bkdp-brightness,backdropContrast:bkdp-contrast,backdropGrayscale:bkdp-grayscale,backdropHueRotate:bkdp-hue-rotate,backdropInvert:bkdp-invert,backdropOpacity:bkdp-opacity,backdropSaturate:bkdp-saturate,backdropSepia:bkdp-sepia,borderCollapse:bd-cl,borderSpacing:bd-sp,borderSpacingX:bd-sx,borderSpacingY:bd-sy,tableLayout:tbl,transitionTimingFunction:trs-tmf,transitionDelay:trs-dly,transitionDuration:trs-dur,transitionProperty:trs-prop,transition:trs,animation:anim,animationName:anim-n,animationTimingFunction:anim-tmf,animationDuration:anim-dur,animationDelay:anim-dly,animationPlayState:anim-ps,animationComposition:anim-comp,animationFillMode:anim-fm,animationDirection:anim-dir,animationIterationCount:anim-ic,animationRange:anim-r,animationState:anim-s,animationRangeStart:anim-rs,animationRangeEnd:anim-re,animationTimeline:anim-tl,transformOrigin:trf-o,transformBox:trf-b,transformStyle:trf-s,transform:trf,rotate:rotate,rotateX:rotate-x,rotateY:rotate-y,rotateZ:rotate-z,scale:scale,scaleX:scale-x,scaleY:scale-y,translate:translate,translateX:translate-x/x,translateY:translate-y/y,translateZ:translate-z/z,accentColor:ac-c,caretColor:ca-c,scrollBehavior:scr-bhv,scrollbar:scr-bar,scrollbarColor:scr-bar-c,scrollbarGutter:scr-bar-g,scrollbarWidth:scr-bar-w,scrollMargin:scr-m,scrollMarginLeft:scr-ml,scrollMarginRight:scr-mr,scrollMarginTop:scr-mt,scrollMarginBottom:scr-mb,scrollMarginBlock:scr-my/scrollMarginY,scrollMarginBlockEnd:scr-mbe,scrollMarginBlockStart:scr-mbt,scrollMarginInline:scr-mx/scrollMarginX,scrollMarginInlineEnd:scr-me,scrollMarginInlineStart:scr-ms,scrollPadding:scr-p,scrollPaddingBlock:scr-py/scrollPaddingY,scrollPaddingBlockStart:scr-pbs,scrollPaddingBlockEnd:scr-pbe,scrollPaddingInline:scr-px/scrollPaddingX,scrollPaddingInlineEnd:scr-pe,scrollPaddingInlineStart:scr-ps,scrollPaddingLeft:scr-pl,scrollPaddingRight:scr-pr,scrollPaddingTop:scr-pt,scrollPaddingBottom:scr-pb,scrollSnapAlign:scr-sa,scrollSnapStop:scrs-s,scrollSnapType:scrs-t,scrollSnapStrictness:scrs-strt,scrollSnapMargin:scrs-m,scrollSnapMarginTop:scrs-mt,scrollSnapMarginBottom:scrs-mb,scrollSnapMarginLeft:scrs-ml,scrollSnapMarginRight:scrs-mr,scrollSnapCoordinate:scrs-c,scrollSnapDestination:scrs-d,scrollSnapPointsX:scrs-px,scrollSnapPointsY:scrs-py,scrollSnapTypeX:scrs-tx,scrollSnapTypeY:scrs-ty,scrollTimeline:scrtl,scrollTimelineAxis:scrtl-a,scrollTimelineName:scrtl-n,touchAction:tch-a,userSelect:us,overflow:ov,overflowWrap:ov-wrap,overflowX:ov-x,overflowY:ov-y,overflowAnchor:ov-a,overflowBlock:ov-b,overflowInline:ov-i,overflowClipBox:ovcp-bx,overflowClipMargin:ovcp-m,overscrollBehaviorBlock:ovs-bb,overscrollBehaviorInline:ovs-bi,fill:fill,stroke:stk,strokeWidth:stk-w,strokeDasharray:stk-dsh,strokeDashoffset:stk-do,strokeLinecap:stk-lc,strokeLinejoin:stk-lj,strokeMiterlimit:stk-ml,strokeOpacity:stk-op,srOnly:sr,debug:debug,appearance:ap,backfaceVisibility:bfv,clipPath:cp-path,hyphens:hy,mask:msk,maskImage:msk-i,maskSize:msk-s,textSizeAdjust:txt-adj,container:cq,containerName:cq-n,containerType:cq-t,cursor:cursor,textStyle:textStyle"
5
5
 
6
6
  const classNameByProp = new Map()
7
7
  const shorthands = new Map()
@@ -2,14 +2,17 @@ import { compact, getSlotRecipes, memo, splitProps } from '../helpers.mjs';
2
2
  import { cva } from './cva.mjs';
3
3
  import { cx } from './cx.mjs';
4
4
 
5
- const slotClass = (className, slot) => className + '__' + slot
6
-
7
5
  export function sva(config) {
8
6
  const slots = Object.entries(getSlotRecipes(config)).map(([slot, slotCva]) => [slot, cva(slotCva)])
9
7
  const defaultVariants = config.defaultVariants ?? {}
10
8
 
9
+ const classNameMap = slots.reduce((acc, [slot, cvaFn]) => {
10
+ if (config.className) acc[slot] = cvaFn.config.className
11
+ return acc
12
+ }, {})
13
+
11
14
  function svaFn(props) {
12
- const result = slots.map(([slot, cvaFn]) => [slot, cx(cvaFn(props), config.className && slotClass(config.className, slot))])
15
+ const result = slots.map(([slot, cvaFn]) => [slot, cx(cvaFn(props), classNameMap[slot])])
13
16
  return Object.fromEntries(result)
14
17
  }
15
18
 
@@ -24,7 +27,7 @@ export function sva(config) {
24
27
  function splitVariantProps(props) {
25
28
  return splitProps(props, variantKeys);
26
29
  }
27
- const getVariantProps = (variants) => ({ ...(defaultVariants || {}), ...compact(variants) })
30
+ const getVariantProps = (variants) => ({ ...defaultVariants, ...compact(variants) })
28
31
 
29
32
  const variantMap = Object.fromEntries(
30
33
  Object.entries(variants).map(([key, value]) => [key, Object.keys(value)])
@@ -33,8 +36,10 @@ export function sva(config) {
33
36
  return Object.assign(memo(svaFn), {
34
37
  __cva__: false,
35
38
  raw,
39
+ config,
36
40
  variantMap,
37
41
  variantKeys,
42
+ classNameMap,
38
43
  splitVariantProps,
39
44
  getVariantProps,
40
45
  })
@@ -22,14 +22,12 @@ function toChar(code) {
22
22
  function toName(code) {
23
23
  let name = "";
24
24
  let x;
25
- for (x = Math.abs(code); x > 52; x = x / 52 | 0)
26
- name = toChar(x % 52) + name;
25
+ for (x = Math.abs(code); x > 52; x = x / 52 | 0) name = toChar(x % 52) + name;
27
26
  return toChar(x % 52) + name;
28
27
  }
29
28
  function toPhash(h, x) {
30
29
  let i = x.length;
31
- while (i)
32
- h = h * 33 ^ x.charCodeAt(--i);
30
+ while (i) h = h * 33 ^ x.charCodeAt(--i);
33
31
  return h;
34
32
  }
35
33
  function toHash(value) {
@@ -64,11 +62,12 @@ var memo = (fn) => {
64
62
  };
65
63
 
66
64
  // src/merge-props.ts
65
+ var MERGE_OMIT = /* @__PURE__ */ new Set(["__proto__", "constructor", "prototype"]);
67
66
  function mergeProps(...sources) {
68
67
  return sources.reduce((prev, obj) => {
69
- if (!obj)
70
- return prev;
68
+ if (!obj) return prev;
71
69
  Object.keys(obj).forEach((key) => {
70
+ if (MERGE_OMIT.has(key)) return;
72
71
  const prevValue = prev[key];
73
72
  const value = obj[key];
74
73
  if (isObject(prevValue) && isObject(value)) {
@@ -106,10 +105,8 @@ function walkObject(target, predicate, options = {}) {
106
105
  return inner(target);
107
106
  }
108
107
  function mapObject(obj, fn) {
109
- if (Array.isArray(obj))
110
- return obj.map((value) => fn(value));
111
- if (!isObject(obj))
112
- return fn(obj);
108
+ if (Array.isArray(obj)) return obj.map((value) => fn(value));
109
+ if (!isObject(obj)) return fn(obj);
113
110
  return walkObject(obj, (value) => fn(value));
114
111
  }
115
112
 
@@ -167,15 +164,13 @@ function createCss(context) {
167
164
  const normalizedObject = normalizeStyleObject(styleObject, context);
168
165
  const classNames = /* @__PURE__ */ new Set();
169
166
  walkObject(normalizedObject, (value, paths) => {
170
- if (value == null)
171
- return;
167
+ if (value == null) return;
172
168
  const important = isImportant(value);
173
169
  const [prop, ...allConditions] = conds.shift(paths);
174
170
  const conditions = filterBaseConditions(allConditions);
175
171
  const transformed = utility.transform(prop, withoutImportant(sanitize(value)));
176
172
  let className = hashFn(conditions, transformed.className);
177
- if (important)
178
- className = `${className}!`;
173
+ if (important) className = `${className}!`;
179
174
  classNames.add(className);
180
175
  });
181
176
  return Array.from(classNames).join(" ");
@@ -187,8 +182,7 @@ function compactStyles(...styles) {
187
182
  function createMergeCss(context) {
188
183
  function resolve(styles) {
189
184
  const allStyles = compactStyles(...styles);
190
- if (allStyles.length === 1)
191
- return allStyles;
185
+ if (allStyles.length === 1) return allStyles;
192
186
  return allStyles.map((style) => normalizeStyleObject(style, context));
193
187
  }
194
188
  function mergeCss(...styles) {
@@ -204,8 +198,7 @@ function createMergeCss(context) {
204
198
  var wordRegex = /([A-Z])/g;
205
199
  var msRegex = /^ms-/;
206
200
  var hypenateProperty = memo((property) => {
207
- if (property.startsWith("--"))
208
- return property;
201
+ if (property.startsWith("--")) return property;
209
202
  return property.replace(wordRegex, "-$1").replace(msRegex, "-ms-").toLowerCase();
210
203
  });
211
204
 
@@ -231,8 +224,7 @@ var patternFns = {
231
224
  isCssUnit
232
225
  };
233
226
  var getPatternStyles = (pattern, styles) => {
234
- if (!pattern?.defaultValues)
235
- return styles;
227
+ if (!pattern?.defaultValues) return styles;
236
228
  const defaults = typeof pattern.defaultValues === "function" ? pattern.defaultValues(styles) : pattern.defaultValues;
237
229
  return Object.assign({}, defaults, compact(styles));
238
230
  };
@@ -0,0 +1,54 @@
1
+ /* eslint-disable */
2
+ import type { SlotRecipeRuntimeFn, RecipeVariantProps } from '../types/recipe';
3
+ import type { JsxHTMLProps, JsxStyleProps, Assign } from '../types/system-types';
4
+ import type { JsxFactoryOptions, ComponentProps } from '../types/jsx';
5
+ import type { ComponentType, ElementType } from 'react'
6
+
7
+ interface UnstyledProps {
8
+ unstyled?: boolean | undefined
9
+ }
10
+
11
+ type SvaFn<S extends string = any> = SlotRecipeRuntimeFn<S, any>
12
+ interface SlotRecipeFn {
13
+ __type: any
14
+ __slot: string
15
+ (props?: any): any
16
+ }
17
+ type SlotRecipe = SvaFn | SlotRecipeFn
18
+
19
+ type InferSlot<R extends SlotRecipe> = R extends SlotRecipeFn ? R['__slot'] : R extends SvaFn<infer S> ? S : never
20
+
21
+ interface WithProviderOptions<P = {}> {
22
+ defaultProps?: Partial<P> | undefined
23
+ }
24
+
25
+ type StyleContextProvider<T extends ElementType, R extends SlotRecipe> = ComponentType<
26
+ JsxHTMLProps<ComponentProps<T> & UnstyledProps, Assign<RecipeVariantProps<R>, JsxStyleProps>>
27
+ >
28
+
29
+ type StyleContextRootProvider<T extends ElementType, R extends SlotRecipe> = ComponentType<
30
+ ComponentProps<T> & UnstyledProps & RecipeVariantProps<R>
31
+ >
32
+
33
+ type StyleContextConsumer<T extends ElementType> = ComponentType<
34
+ JsxHTMLProps<ComponentProps<T> & UnstyledProps, JsxStyleProps>
35
+ >
36
+
37
+ export interface StyleContext<R extends SlotRecipe> {
38
+ withRootProvider: <T extends ElementType>(
39
+ Component: T,
40
+ options?: WithProviderOptions<ComponentProps<T>> | undefined
41
+ ) => StyleContextRootProvider<T, R>
42
+ withProvider: <T extends ElementType>(
43
+ Component: T,
44
+ slot: InferSlot<R>,
45
+ options?: JsxFactoryOptions<ComponentProps<T>> | undefined
46
+ ) => StyleContextProvider<T, R>
47
+ withContext: <T extends ElementType>(
48
+ Component: T,
49
+ slot: InferSlot<R>,
50
+ options?: JsxFactoryOptions<ComponentProps<T>> | undefined
51
+ ) => StyleContextConsumer<T>
52
+ }
53
+
54
+ export declare function createStyleContext<R extends SlotRecipe>(recipe: R): StyleContext<R>
@@ -0,0 +1,98 @@
1
+ 'use client'
2
+
3
+ import { cx, css, sva } from '../css/index.mjs';
4
+ import { styled } from './factory.mjs';
5
+ import { getDisplayName } from './factory-helper.mjs';
6
+ import { createContext, useContext, createElement, forwardRef } from 'react'
7
+
8
+ export function createStyleContext(recipe) {
9
+ const StyleContext = createContext({})
10
+ const isConfigRecipe = '__recipe__' in recipe
11
+ const svaFn = isConfigRecipe ? recipe : sva(recipe.config)
12
+
13
+ const getResolvedProps = (props, slotStyles) => {
14
+ const { unstyled, ...restProps } = props
15
+ if (unstyled) return restProps
16
+ if (isConfigRecipe) {
17
+ return { ...restProps, className: cx(slotStyles, restProps.className) }
18
+ }
19
+ return { ...restProps, css: css.raw(slotStyles, restProps.css) }
20
+ }
21
+
22
+ const withRootProvider = (Component, options) => {
23
+ const WithRootProvider = (props) => {
24
+ const [variantProps, otherProps] = svaFn.splitVariantProps(props)
25
+
26
+ const slotStyles = isConfigRecipe ? svaFn(variantProps) : svaFn.raw(variantProps)
27
+ slotStyles._classNameMap = svaFn.classNameMap
28
+
29
+ const mergedProps = options?.defaultProps
30
+ ? { ...options.defaultProps, ...otherProps }
31
+ : otherProps
32
+
33
+ return createElement(StyleContext.Provider, {
34
+ value: slotStyles,
35
+ children: createElement(Component, mergedProps)
36
+ })
37
+ }
38
+
39
+ const componentName = getDisplayName(Component)
40
+ WithRootProvider.displayName = `withRootProvider(${componentName})`
41
+
42
+ return WithRootProvider
43
+ }
44
+
45
+ const withProvider = (Component, slot, options) => {
46
+ const StyledComponent = styled(Component, {}, options)
47
+
48
+ const WithProvider = forwardRef((props, ref) => {
49
+ const [variantProps, restProps] = svaFn.splitVariantProps(props)
50
+
51
+ const slotStyles = isConfigRecipe ? svaFn(variantProps) : svaFn.raw(variantProps)
52
+ slotStyles._classNameMap = svaFn.classNameMap
53
+
54
+ const propsWithClass = { ...restProps, className: restProps.className ?? options?.defaultProps?.className }
55
+ const resolvedProps = getResolvedProps(propsWithClass, slotStyles[slot])
56
+ return createElement(StyleContext.Provider, {
57
+ value: slotStyles,
58
+ children: createElement(StyledComponent, {
59
+ ...resolvedProps,
60
+ className: cx(resolvedProps.className, slotStyles._classNameMap[slot]),
61
+ ref,
62
+ })
63
+ })
64
+ })
65
+
66
+ const componentName = getDisplayName(Component)
67
+ WithProvider.displayName = `withProvider(${componentName})`
68
+
69
+ return WithProvider
70
+ }
71
+
72
+ const withContext = (Component, slot, options) => {
73
+ const StyledComponent = styled(Component, {}, options)
74
+
75
+ const WithContext = forwardRef((props, ref) => {
76
+ const slotStyles = useContext(StyleContext)
77
+
78
+ const propsWithClass = { ...props, className: props.className ?? options?.defaultProps?.className }
79
+ const resolvedProps = getResolvedProps(propsWithClass, slotStyles[slot])
80
+ return createElement(StyledComponent, {
81
+ ...resolvedProps,
82
+ className: cx(resolvedProps.className, slotStyles._classNameMap[slot]),
83
+ ref,
84
+ })
85
+ })
86
+
87
+ const componentName = getDisplayName(Component)
88
+ WithContext.displayName = `withContext(${componentName})`
89
+
90
+ return WithContext
91
+ }
92
+
93
+ return {
94
+ withRootProvider,
95
+ withProvider,
96
+ withContext,
97
+ }
98
+ }
@@ -8,8 +8,11 @@ function styledFn(Dynamic, configOrCva = {}, options = {}) {
8
8
  const cvaFn = configOrCva.__cva__ || configOrCva.__recipe__ ? configOrCva : cva(configOrCva)
9
9
 
10
10
  const forwardFn = options.shouldForwardProp || defaultShouldForwardProp
11
- const shouldForwardProp = (prop) => forwardFn(prop, cvaFn.variantKeys)
12
-
11
+ const shouldForwardProp = (prop) => {
12
+ if (options.forwardProps?.includes(prop)) return true
13
+ return forwardFn(prop, cvaFn.variantKeys)
14
+ }
15
+
13
16
  const defaultProps = Object.assign(
14
17
  options.dataAttr && configOrCva.__name__ ? { 'data-recipe': configOrCva.__name__ } : {},
15
18
  options.defaultProps,
@@ -20,7 +23,7 @@ function styledFn(Dynamic, configOrCva = {}, options = {}) {
20
23
  const __base__ = Dynamic.__base__ || Dynamic
21
24
 
22
25
  const StyledComponent = /* @__PURE__ */ forwardRef(function StyledComponent(props, ref) {
23
- const { as: Element = __base__, children, ...restProps } = props
26
+ const { as: Element = __base__, unstyled, children, ...restProps } = props
24
27
 
25
28
  const combinedProps = useMemo(() => Object.assign({}, defaultProps, restProps), [restProps])
26
29
 
@@ -40,7 +43,13 @@ function styledFn(Dynamic, configOrCva = {}, options = {}) {
40
43
  return cx(css(cvaStyles, propStyles, cssStyles), combinedProps.className)
41
44
  }
42
45
 
43
- const classes = configOrCva.__recipe__ ? recipeClass : cvaClass
46
+ const classes = () => {
47
+ if (unstyled) {
48
+ const { css: cssStyles, ...propStyles } = styleProps
49
+ return cx(css(propStyles, cssStyles), combinedProps.className)
50
+ }
51
+ return configOrCva.__recipe__ ? recipeClass() : cvaClass()
52
+ }
44
53
 
45
54
  return createElement(Element, {
46
55
  ref,
@@ -48,7 +57,7 @@ function styledFn(Dynamic, configOrCva = {}, options = {}) {
48
57
  ...elementProps,
49
58
  ...normalizeHTMLProps(htmlProps),
50
59
  className: classes(),
51
- }, combinedProps.children ?? children)
60
+ }, children ?? combinedProps.children)
52
61
  })
53
62
 
54
63
  const name = getDisplayName(__base__)
@@ -1,6 +1,7 @@
1
1
  /* eslint-disable */
2
2
  export * from './factory';
3
3
  export * from './is-valid-prop';
4
+ export * from './create-style-context';
4
5
  export * from './box';
5
6
  export * from './flex';
6
7
  export * from './stack';
@@ -1,5 +1,6 @@
1
1
  export * from './factory.mjs';
2
2
  export * from './is-valid-prop.mjs';
3
+ export * from './create-style-context.mjs';
3
4
  export * from './box.mjs';
4
5
  export * from './flex.mjs';
5
6
  export * from './stack.mjs';
@@ -9,7 +9,6 @@ export interface AspectRatioProperties {
9
9
  ratio?: ConditionalValue<number>
10
10
  }
11
11
 
12
-
13
12
  interface AspectRatioStyles extends AspectRatioProperties, DistributiveOmit<SystemStyleObject, keyof AspectRatioProperties | 'aspectRatio'> {}
14
13
 
15
14
  interface AspectRatioPatternFn {
@@ -10,7 +10,6 @@ export interface BleedProperties {
10
10
  block?: SystemProperties["marginBlock"]
11
11
  }
12
12
 
13
-
14
13
  interface BleedStyles extends BleedProperties, DistributiveOmit<SystemStyleObject, keyof BleedProperties > {}
15
14
 
16
15
  interface BleedPatternFn {
@@ -9,7 +9,6 @@ export interface BoxProperties {
9
9
 
10
10
  }
11
11
 
12
-
13
12
  interface BoxStyles extends BoxProperties, DistributiveOmit<SystemStyleObject, keyof BoxProperties > {}
14
13
 
15
14
  interface BoxPatternFn {
@@ -9,7 +9,6 @@ export interface CenterProperties {
9
9
  inline?: ConditionalValue<boolean>
10
10
  }
11
11
 
12
-
13
12
  interface CenterStyles extends CenterProperties, DistributiveOmit<SystemStyleObject, keyof CenterProperties > {}
14
13
 
15
14
  interface CenterPatternFn {
@@ -9,7 +9,6 @@ export interface CircleProperties {
9
9
  size?: SystemProperties["width"]
10
10
  }
11
11
 
12
-
13
12
  interface CircleStyles extends CircleProperties, DistributiveOmit<SystemStyleObject, keyof CircleProperties > {}
14
13
 
15
14
  interface CirclePatternFn {
@@ -9,7 +9,6 @@ export interface ContainerProperties {
9
9
 
10
10
  }
11
11
 
12
-
13
12
  interface ContainerStyles extends ContainerProperties, DistributiveOmit<SystemStyleObject, keyof ContainerProperties > {}
14
13
 
15
14
  interface ContainerPatternFn {
@@ -10,7 +10,6 @@ export interface CqProperties {
10
10
  type?: SystemProperties["containerType"]
11
11
  }
12
12
 
13
-
14
13
  interface CqStyles extends CqProperties, DistributiveOmit<SystemStyleObject, keyof CqProperties > {}
15
14
 
16
15
  interface CqPatternFn {
@@ -11,7 +11,6 @@ export interface DividerProperties {
11
11
  color?: ConditionalValue<Tokens["colors"] | Properties["borderColor"]>
12
12
  }
13
13
 
14
-
15
14
  interface DividerStyles extends DividerProperties, DistributiveOmit<SystemStyleObject, keyof DividerProperties > {}
16
15
 
17
16
  interface DividerPatternFn {
@@ -15,7 +15,6 @@ export interface FlexProperties {
15
15
  shrink?: SystemProperties["flexShrink"]
16
16
  }
17
17
 
18
-
19
18
  interface FlexStyles extends FlexProperties, DistributiveOmit<SystemStyleObject, keyof FlexProperties > {}
20
19
 
21
20
  interface FlexPatternFn {
@@ -12,7 +12,6 @@ export interface FloatProperties {
12
12
  placement?: ConditionalValue<"bottom-end" | "bottom-start" | "top-end" | "top-start" | "bottom-center" | "top-center" | "middle-center" | "middle-end" | "middle-start">
13
13
  }
14
14
 
15
-
16
15
  interface FloatStyles extends FloatProperties, DistributiveOmit<SystemStyleObject, keyof FloatProperties > {}
17
16
 
18
17
  interface FloatPatternFn {
@@ -14,7 +14,6 @@ export interface GridItemProperties {
14
14
  rowEnd?: ConditionalValue<number>
15
15
  }
16
16
 
17
-
18
17
  interface GridItemStyles extends GridItemProperties, DistributiveOmit<SystemStyleObject, keyof GridItemProperties > {}
19
18
 
20
19
  interface GridItemPatternFn {
@@ -13,7 +13,6 @@ export interface GridProperties {
13
13
  minChildWidth?: ConditionalValue<Tokens["sizes"] | Properties["width"]>
14
14
  }
15
15
 
16
-
17
16
  interface GridStyles extends GridProperties, DistributiveOmit<SystemStyleObject, keyof GridProperties > {}
18
17
 
19
18
  interface GridPatternFn {
@@ -15,7 +15,7 @@ transform(props, { map, isCssUnit }) {
15
15
  };
16
16
  },
17
17
  defaultValues(props) {
18
- return { gap: props.columnGap || props.rowGap ? void 0 : "10px" };
18
+ return { gap: props.columnGap || props.rowGap ? void 0 : "8px" };
19
19
  }}
20
20
 
21
21
  export const getGridStyle = (styles = {}) => {
@@ -10,7 +10,6 @@ export interface HstackProperties {
10
10
  gap?: SystemProperties["gap"]
11
11
  }
12
12
 
13
-
14
13
  interface HstackStyles extends HstackProperties, DistributiveOmit<SystemStyleObject, keyof HstackProperties > {}
15
14
 
16
15
  interface HstackPatternFn {
@@ -13,7 +13,7 @@ transform(props) {
13
13
  ...rest
14
14
  };
15
15
  },
16
- defaultValues:{gap:'10px'}}
16
+ defaultValues:{gap:'8px'}}
17
17
 
18
18
  export const getHstackStyle = (styles = {}) => {
19
19
  const _styles = getPatternStyles(hstackConfig, styles)
@@ -9,7 +9,6 @@ export interface LinkOverlayProperties {
9
9
 
10
10
  }
11
11
 
12
-
13
12
  interface LinkOverlayStyles extends LinkOverlayProperties, DistributiveOmit<SystemStyleObject, keyof LinkOverlayProperties > {}
14
13
 
15
14
  interface LinkOverlayPatternFn {
@@ -9,7 +9,6 @@ export interface SpacerProperties {
9
9
  size?: ConditionalValue<Tokens["spacing"]>
10
10
  }
11
11
 
12
-
13
12
  interface SpacerStyles extends SpacerProperties, DistributiveOmit<SystemStyleObject, keyof SpacerProperties > {}
14
13
 
15
14
  interface SpacerPatternFn {
@@ -9,7 +9,6 @@ export interface SquareProperties {
9
9
  size?: SystemProperties["width"]
10
10
  }
11
11
 
12
-
13
12
  interface SquareStyles extends SquareProperties, DistributiveOmit<SystemStyleObject, keyof SquareProperties > {}
14
13
 
15
14
  interface SquarePatternFn {
@@ -12,7 +12,6 @@ export interface StackProperties {
12
12
  gap?: SystemProperties["gap"]
13
13
  }
14
14
 
15
-
16
15
  interface StackStyles extends StackProperties, DistributiveOmit<SystemStyleObject, keyof StackProperties > {}
17
16
 
18
17
  interface StackPatternFn {
@@ -13,7 +13,7 @@ transform(props) {
13
13
  ...rest
14
14
  };
15
15
  },
16
- defaultValues:{direction:'column',gap:'10px'}}
16
+ defaultValues:{direction:'column',gap:'8px'}}
17
17
 
18
18
  export const getStackStyle = (styles = {}) => {
19
19
  const _styles = getPatternStyles(stackConfig, styles)
@@ -9,7 +9,6 @@ export interface VisuallyHiddenProperties {
9
9
 
10
10
  }
11
11
 
12
-
13
12
  interface VisuallyHiddenStyles extends VisuallyHiddenProperties, DistributiveOmit<SystemStyleObject, keyof VisuallyHiddenProperties > {}
14
13
 
15
14
  interface VisuallyHiddenPatternFn {
@@ -10,7 +10,6 @@ export interface VstackProperties {
10
10
  gap?: SystemProperties["gap"]
11
11
  }
12
12
 
13
-
14
13
  interface VstackStyles extends VstackProperties, DistributiveOmit<SystemStyleObject, keyof VstackProperties > {}
15
14
 
16
15
  interface VstackPatternFn {
@@ -13,7 +13,7 @@ transform(props) {
13
13
  ...rest
14
14
  };
15
15
  },
16
- defaultValues:{gap:'10px'}}
16
+ defaultValues:{gap:'8px'}}
17
17
 
18
18
  export const getVstackStyle = (styles = {}) => {
19
19
  const _styles = getPatternStyles(vstackConfig, styles)
@@ -13,7 +13,6 @@ export interface WrapProperties {
13
13
  justify?: SystemProperties["justifyContent"]
14
14
  }
15
15
 
16
-
17
16
  interface WrapStyles extends WrapProperties, DistributiveOmit<SystemStyleObject, keyof WrapProperties > {}
18
17
 
19
18
  interface WrapPatternFn {
@@ -3,7 +3,7 @@ import { css } from '../css/index.mjs';
3
3
 
4
4
  const wrapConfig = {
5
5
  transform(props) {
6
- const { columnGap, rowGap, gap = columnGap || rowGap ? void 0 : "10px", align, justify, ...rest } = props;
6
+ const { columnGap, rowGap, gap = columnGap || rowGap ? void 0 : "8px", align, justify, ...rest } = props;
7
7
  return {
8
8
  display: "flex",
9
9
  flexWrap: "wrap",