npm - @magiclabs/ui-components - Versions diffs - 1.18.5 → 1.19.0 - Mend

@magiclabs/ui-components 1.18.5 → 1.19.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 (16) hide show

package/dist/cjs/components/primitives/button.js +1 -1
package/dist/cjs/components/primitives/button.js.map +1 -1
package/dist/cjs/recipes/button.js +1 -1
package/dist/cjs/recipes/button.js.map +1 -1
package/dist/es/components/inputs/text-input.js +1 -1
package/dist/es/components/primitives/button.js +1 -1
package/dist/es/components/primitives/button.js.map +1 -1
package/dist/es/components/primitives/popover.js +1 -1
package/dist/es/recipes/button.js +1 -1
package/dist/es/recipes/button.js.map +1 -1
package/dist/panda.buildinfo.json +1 -1
package/dist/types/components/primitives/button.d.ts +1 -0
package/dist/types/components/primitives/button.d.ts.map +1 -1
package/dist/types/recipes/button.d.ts +7 -2
package/dist/types/recipes/button.d.ts.map +1 -1
package/package.json +1 -1

package/dist/cjs/components/primitives/button.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var i=require("react/jsx-runtime");require("../feedback/callout.js");var H=require("../feedback/loading-spinner.js");require("@styled/tokens"),require("./checkbox.js"),require("./dropdown-selector.js"),require("./popover.js"),require("./radio.js"),require("./segmented-control.js"),require("./switch.js"),require("./text.js"),require("./portal.js");var o=require("react");require("../../hooks/useToast.js"),require("../../recipes/toast.js");var l=require("@styled/jsx");require("../feedback/tooltip.js");var I=require("../../recipes/button.js"),F=require("@styled/css"),v=require("create-slots"),d=require("react-aria");const f=v.createSlot(({children:r,...t})=>i.jsx(l.Flex,{alignItems:"center",justifyContent:"center",children:o.Children.map(r,e=>o.cloneElement(e,t))})),y=v.createSlot(({children:r,...t})=>i.jsx(l.Flex,{alignItems:"center",justifyContent:"center",children:o.Children.map(r,e=>o.cloneElement(e,t))})),R=({variant:r="primary",size:t="md"})=>{const e=r==="primary"||r==="negative",c=r==="neutral"||r==="tertiary";return i.jsx(H.LoadingSpinner,{size:{sm:20,md:24,lg:28}[t],strokeWidth:2.5,inverted:e,neutral:c})},w=o.forwardRef((r,t)=>{const{label:e,variant:c="primary",size:p="md",disabled:m,expand:q,validating:h,iconSize:S,onHover:g}=r,u=S||(p==="sm"?16:24),s=I.button({variant:c,expand:q,size:p,validating:h,iconOnly:!e}),z=o.useRef(null),x=t||z,{buttonProps:C}=d.useButton({...r,isDisabled:m??!1},x),{hoverProps:N}=d.useHover({isDisabled:m??!1}),{isFocusVisible:P,focusProps:B}=d.useFocusRing();return v.createHost(r.children,j=>{const n=j.get(f),a=j.get(y),b=u/4;return i.jsx("button",{className:F.cx(s.button,"group",!e&&s.iconContainer,P&&s.focus),ref:x,...d.mergeProps(C,N,B),"aria-disabled":m,onMouseEnter:g,onTouchStart:g,children:h?i.jsx(R,{variant:c,size:p}):i.jsxs(l.HStack,{w:"full",gap:2,justify:e&&(n||a)?"space-between":"center",children:[n&&{...n,props:{...n.props,className:n.props.color?void 0:s.icon,width:u,height:u}},a&&e&&q&&i.jsx(l.Box,{w:b}),e&&i.jsx("span",{className:s.label,children:e}),n&&e&&q&&i.jsx(l.Box,{w:b}),a&&{...a,props:{...a.props,className:a.props.color?void 0:s.icon,width:u,height:u}}]})})})}),E=Object.assign(w,{LeadingIcon:f,TrailingIcon:y});w.displayName="Button",exports.default=E;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var i=require("react/jsx-runtime");require("../feedback/callout.js");var I=require("../feedback/loading-spinner.js");require("@styled/tokens"),require("./checkbox.js"),require("./dropdown-selector.js"),require("./popover.js"),require("./radio.js"),require("./segmented-control.js"),require("./switch.js"),require("./text.js"),require("./portal.js");var o=require("react");require("../../hooks/useToast.js"),require("../../recipes/toast.js");var u=require("@styled/jsx");require("../feedback/tooltip.js");var R=require("../../recipes/button.js"),F=require("@styled/css"),q=require("create-slots"),d=require("react-aria");const f=q.createSlot(({children:r,...t})=>i.jsx(u.Flex,{alignItems:"center",justifyContent:"center",children:o.Children.map(r,e=>o.cloneElement(e,t))})),y=q.createSlot(({children:r,...t})=>i.jsx(u.Flex,{alignItems:"center",justifyContent:"center",children:o.Children.map(r,e=>o.cloneElement(e,t))})),E=({variant:r="primary",size:t="md"})=>{const e=r==="primary"||r==="negative",c=r==="neutral"||r==="tertiary";return i.jsx(I.LoadingSpinner,{size:{sm:20,md:24,lg:28}[t],strokeWidth:2.5,inverted:e,neutral:c})},S=o.forwardRef((r,t)=>{const{label:e,variant:c="primary",textStyle:w,size:p="md",disabled:m,expand:v,validating:g,iconSize:z,onHover:x}=r,l=z||(p==="sm"?16:24),s=R.button({variant:c,textStyle:w,expand:v,size:p,validating:g,iconOnly:!e}),C=o.useRef(null),h=t||C,{buttonProps:N}=d.useButton({...r,isDisabled:m??!1},h),{hoverProps:P}=d.useHover({isDisabled:m??!1}),{isFocusVisible:B,focusProps:H}=d.useFocusRing();return q.createHost(r.children,j=>{const n=j.get(f),a=j.get(y),b=l/4;return i.jsx("button",{className:F.cx(s.button,"group",!e&&s.iconContainer,B&&s.focus),ref:h,...d.mergeProps(N,P,H),"aria-disabled":m,onMouseEnter:x,onTouchStart:x,children:g?i.jsx(E,{variant:c,size:p}):i.jsxs(u.HStack,{w:"full",gap:2,justify:e&&(n||a)?"space-between":"center",children:[n&&{...n,props:{...n.props,className:n.props.color?void 0:s.icon,width:l,height:l}},a&&e&&v&&i.jsx(u.Box,{w:b}),e&&i.jsx("span",{className:s.label,children:e}),n&&e&&v&&i.jsx(u.Box,{w:b}),a&&{...a,props:{...a.props,className:a.props.color?void 0:s.icon,width:l,height:l}}]})})})}),O=Object.assign(S,{LeadingIcon:f,TrailingIcon:y});S.displayName="Button",exports.default=O;
 //# sourceMappingURL=button.js.map

package/dist/cjs/components/primitives/button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"button.js","sources":["../../../../src/components/primitives/button.tsx"],"sourcesContent":["import { LoadingSpinner } from '@components/feedback';\nimport { button } from '@recipes/button';\nimport { cx } from '@styled/css';\nimport { Box, Flex, HStack } from '@styled/jsx';\nimport { createHost, createSlot } from 'create-slots';\nimport React, { Children, MouseEventHandler, TouchEventHandler, cloneElement, forwardRef, useRef } from 'react';\nimport { mergeProps, useButton, useFocusRing, useHover, type AriaButtonProps } from 'react-aria';\n\nexport interface ButtonProps extends AriaButtonProps {\n label?: string;\n size?: 'sm' \| 'md' \| 'lg';\n variant?: 'primary' \| 'secondary' \| 'negative' \| 'neutral' \| 'tertiary' \| 'text' \| 'transparent';\n disabled?: boolean;\n expand?: boolean;\n validating?: boolean;\n iconSize?: number;\n onHover?: MouseEventHandler<HTMLButtonElement> \| TouchEventHandler<HTMLButtonElement>;\n}\n\nconst LeadingIcon = createSlot(({ children, ...props }) => {\n return (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Flex>\n );\n});\n\nconst TrailingIcon = createSlot(({ children, ...props }) => {\n return (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Flex>\n );\n});\n\nconst Validation = ({ variant = 'primary', size = 'md' }: Partial<ButtonProps>) => {\n const spinnerInverted = variant === 'primary' \|\| variant === 'negative';\n const spinnerNeutral = variant === 'neutral' \|\| variant === 'tertiary';\n const spinnerSizes = {\n sm: 20,\n md: 24,\n lg: 28,\n };\n\n return (\n <LoadingSpinner size={spinnerSizes[size]} strokeWidth={2.5} inverted={spinnerInverted} neutral={spinnerNeutral} />\n );\n};\n\nconst Component = forwardRef<HTMLButtonElement, ButtonProps>((props, forwardedRef) => {\n const {\n label,\n variant = 'primary',\n size = 'md',\n disabled,\n expand,\n validating,\n iconSize: iconSizeOverride,\n onHover,\n } = props;\n\n const iconSize = iconSizeOverride \|\| (size === 'sm' ? 16 : 24);\n\n const classes = button({ variant, expand, size, validating, iconOnly: !label });\n\n const internalRef = useRef(null);\n const ref = forwardedRef \|\| internalRef;\n\n const { buttonProps } = useButton(\n { ...props, isDisabled: disabled ?? false },\n ref as React.RefObject<HTMLButtonElement>,\n );\n const { hoverProps } = useHover({ isDisabled: disabled ?? false });\n const { isFocusVisible, focusProps } = useFocusRing();\n\n return createHost(props.children, slots => {\n const leadingIcon = slots.get(LeadingIcon);\n const trailingIcon = slots.get(TrailingIcon);\n const containerSize = iconSize / 4;\n\n return (\n <button\n className={cx(classes.button, 'group', !label && classes.iconContainer, isFocusVisible && classes.focus)}\n ref={ref}\n {...mergeProps(buttonProps, hoverProps, focusProps)}\n aria-disabled={disabled}\n onMouseEnter={onHover as MouseEventHandler}\n onTouchStart={onHover as TouchEventHandler}\n >\n {validating ? (\n <Validation variant={variant} size={size} />\n ) : (\n <HStack w=\"full\" gap={2} justify={label && (leadingIcon \|\| trailingIcon) ? 'space-between' : 'center'}>\n {leadingIcon && {\n ...leadingIcon,\n props: {\n ...leadingIcon.props,\n className: !leadingIcon.props.color ? classes.icon : undefined,\n width: iconSize,\n height: iconSize,\n },\n }}\n {trailingIcon && label && expand && <Box w={containerSize} />}\n {label && <span className={classes.label}>{label}</span>}\n {leadingIcon && label && expand && <Box w={containerSize} />}\n {trailingIcon && {\n ...trailingIcon,\n props: {\n ...trailingIcon.props,\n className: !trailingIcon.props.color ? classes.icon : undefined,\n width: iconSize,\n height: iconSize,\n },\n }}\n </HStack>\n )}\n </button>\n );\n });\n});\n\nconst Button = Object.assign(Component, {\n LeadingIcon,\n TrailingIcon,\n});\n\nComponent.displayName = 'Button';\n\nexport default Button;\n"],"names":["LeadingIcon","createSlot","children","props","_jsx","Flex","Children","child","cloneElement","TrailingIcon","Validation","variant","size","spinnerInverted","spinnerNeutral","LoadingSpinner","Component","forwardRef","forwardedRef","label","disabled","expand","validating","iconSizeOverride","onHover","iconSize","classes","button","internalRef","useRef","ref","buttonProps","useButton","hoverProps","useHover","isFocusVisible","focusProps","useFocusRing","createHost","slots","leadingIcon","trailingIcon","containerSize","cx","mergeProps","_jsxs","HStack","Box","Button"],"mappings":"~~srBAmBMA~~,EAAcC,EAAAA,WAAW,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAO,IAElDC,~~MAACC,~~EAAAA,~~KAAI~~,CAAC,WAAW,SAAS,eAAe,SACtC,SAAAC,~~WAAS~~,IAAIJ,EAAUK,GACfC,~~EAAaD~~,~~aAAAA~~,EAAOJ,CAAK,CACjC,CACI,CAAA,CAEV,EAEKM,EAAeR,~~EAAAA~~,~~WAAW,~~CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAO,IAEnDC,~~MAACC~~,~~OAAI~~,CAAC,WAAW,SAAS,eAAe,SACtC,SAAAC,~~EAAS~~,~~SAAA~~,IAAIJ,EAAUK,GACfC,~~EAAaD~~,~~aAAAA,~~EAAOJ,CAAK,CACjC,CACI,CAAA,CAEV,EAEKO,EAAa,CAAC,CAAE,QAAAC,EAAU,UAAW,KAAAC,EAAO,IAAI,IAA4B,CAChF,MAAMC,EAAkBF,IAAY,WAAaA,IAAY,WACvDG,EAAiBH,IAAY,WAAaA,IAAY,WAO5D,OACEP,EAAAA,IAACW,~~EAAAA~~,~~eAAe,~~CAAA,KAPG,CACnB,GAAI,GACJ,GAAI,GACJ,GAAI,IAI+BH,CAAI,EAAG,YAAa,IAAK,SAAUC,EAAiB,QAASC,CAAkB,CAAA,CAEtH,EAEME,EAAYC,~~aAA2C~~,CAACd,EAAOe,IAAgB,CACnF,KAAM,CACJ,MAAAC,EACA,QAAAR,EAAU,UACV,~~KAAAC~~,EAAO,KACP,~~SAAAQ~~,EACA,OAAAC,EACA,WAAAC,EACA,SAAUC,EACV,QAAAC,CAAO,~~EACLrB~~,~~EAEEsB~~,EAAWF,~~IAAqBX~~,IAAS,KAAO,GAAK,~~IAErDc~~,EAAUC,EAAAA,OAAO,CAAE,~~QAAAhB~~,EAAS,~~OAAAU~~,EAAQ,~~KAAAT~~,EAAM,~~WAAAU~~,EAAY,SAAU,~~CAACH~~,~~CAAK~~,~~CAAE~~,~~EAExES~~,EAAcC,SAAO,IAAI,EACzBC,~~EAAMZ~~,~~GAAgBU~~,EAEtB,CAAE,YAAAG,CAAa,EAAGC,EAAAA,UACtB,CAAE,~~GAAG7B~~,EAAO,~~WAAYiB~~,GAAY,EAAO,EAC3CU,CAAyC,EAErC,CAAE,WAAAG,CAAU,EAAKC,~~WAAS~~,CAAE,WAAYd,GAAY,EAAK,CAAE,EAC3D,CAAE,eAAAe,EAAgB,WAAAC,GAAeC,EAAAA,~~aAEvC~~,~~EAAA~~,OAAOC,~~EAAWnC~~,~~WAAAA,~~EAAM,~~SAAUoC~~,GAAQ,CACxC,MAAMC,EAAcD,EAAM,~~IAAIvC~~,CAAW,~~EACnCyC~~,EAAeF,EAAM,~~IAAI9B~~,CAAY,~~EACrCiC~~,EAAgBjB,EAAW,EAEjC,~~OACErB~~,gBACE,~~UAAWuC~~,EAAAA,GAAGjB,EAAQ,OAAQ,QAAS,~~CAACP~~,~~GAASO~~,EAAQ,cAAeS,GAAkBT,EAAQ,KAAK,EACvG,IAAKI,EAAG,GACJc,~~aAAWb~~,EAAaE,EAAYG,CAAU,EACnC,gBAAAhB,EACf,aAAcI,EACd,aAAcA,EAEb,SAAAF,~~EACClB~~,~~MAACM~~,GAAW,QAASC,EAAS,KAAMC,CAAQ,CAAA,~~EAE5CiC~~,OAACC,~~EAAAA~~,~~OAAO,~~CAAA,EAAE,OAAO,IAAK,EAAG,~~QAAS3B~~,~~IAAUqB~~,GAAeC,GAAgB,gBAAkB,SAC1F,SAAA,CAAAD,GAAe,CACd,GAAGA,EACH,MAAO,CACL,GAAGA,EAAY,MACf,UAAYA,EAAY,MAAM,MAAuB,OAAfd,EAAQ,KAC9C,MAAOD,EACP,OAAQA,CACT,CACF,EACAgB,~~GAAgBtB~~,~~GAASE~~,~~GAAUjB~~,~~EAAAA~~,~~IAAC2C,~~EAAG,IAAA,CAAC,EAAGL,CAAiB,CAAA,~~EAC5DvB~~,GAASf,EAAAA,IAAA,OAAA,CAAM,~~UAAWsB~~,EAAQ,~~eAAQP~~,CAAK,CAAA,EAC/~~CqB~~,~~GAAerB~~,~~GAASE~~,~~GAAUjB~~,~~MAAC2C~~,~~EAAAA~~,~~KAAI,~~EAAGL,CAAiB,CAAA,EAC3DD,GAAgB,CACf,GAAGA,EACH,MAAO,CACL,GAAGA,EAAa,MAChB,UAAYA,EAAa,MAAM,MAAuB,OAAff,EAAQ,KAC/C,MAAOD,EACP,OAAQA,CACT,EACF,CACM,CAAA,CAEJ,CAAA,CAEb,CAAC,CACH,CAAC,EAEKuB,EAAS,OAAO,~~OAAOhC~~,EAAW,CACtC,YAAAhB,EACA,aAAAS,CACD,CAAA,EAEDO,EAAU,YAAc"}
1	+ {"version":3,"file":"button.js","sources":["../../../../src/components/primitives/button.tsx"],"sourcesContent":["import { LoadingSpinner } from '@components/feedback';\nimport { button } from '@recipes/button';\nimport { cx } from '@styled/css';\nimport { Box, Flex, HStack } from '@styled/jsx';\nimport { createHost, createSlot } from 'create-slots';\nimport React, { Children, MouseEventHandler, TouchEventHandler, cloneElement, forwardRef, useRef } from 'react';\nimport { mergeProps, useButton, useFocusRing, useHover, type AriaButtonProps } from 'react-aria';\n\nexport interface ButtonProps extends AriaButtonProps {\n label?: string;\n size?: 'sm' \| 'md' \| 'lg';\n variant?: 'primary' \| 'secondary' \| 'negative' \| 'neutral' \| 'tertiary' \| 'text' \| 'transparent';\n textStyle?: 'negative' \| 'neutral' \| 'subtle';\n disabled?: boolean;\n expand?: boolean;\n validating?: boolean;\n iconSize?: number;\n onHover?: MouseEventHandler<HTMLButtonElement> \| TouchEventHandler<HTMLButtonElement>;\n}\n\nconst LeadingIcon = createSlot(({ children, ...props }) => {\n return (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Flex>\n );\n});\n\nconst TrailingIcon = createSlot(({ children, ...props }) => {\n return (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Flex>\n );\n});\n\nconst Validation = ({ variant = 'primary', size = 'md' }: Partial<ButtonProps>) => {\n const spinnerInverted = variant === 'primary' \|\| variant === 'negative';\n const spinnerNeutral = variant === 'neutral' \|\| variant === 'tertiary';\n const spinnerSizes = {\n sm: 20,\n md: 24,\n lg: 28,\n };\n\n return (\n <LoadingSpinner size={spinnerSizes[size]} strokeWidth={2.5} inverted={spinnerInverted} neutral={spinnerNeutral} />\n );\n};\n\nconst Component = forwardRef<HTMLButtonElement, ButtonProps>((props, forwardedRef) => {\n const {\n label,\n variant = 'primary',\n textStyle,\n size = 'md',\n disabled,\n expand,\n validating,\n iconSize: iconSizeOverride,\n onHover,\n } = props;\n\n const iconSize = iconSizeOverride \|\| (size === 'sm' ? 16 : 24);\n\n const classes = button({ variant, textStyle, expand, size, validating, iconOnly: !label });\n\n const internalRef = useRef(null);\n const ref = forwardedRef \|\| internalRef;\n\n const { buttonProps } = useButton(\n { ...props, isDisabled: disabled ?? false },\n ref as React.RefObject<HTMLButtonElement>,\n );\n const { hoverProps } = useHover({ isDisabled: disabled ?? false });\n const { isFocusVisible, focusProps } = useFocusRing();\n\n return createHost(props.children, slots => {\n const leadingIcon = slots.get(LeadingIcon);\n const trailingIcon = slots.get(TrailingIcon);\n const containerSize = iconSize / 4;\n\n return (\n <button\n className={cx(classes.button, 'group', !label && classes.iconContainer, isFocusVisible && classes.focus)}\n ref={ref}\n {...mergeProps(buttonProps, hoverProps, focusProps)}\n aria-disabled={disabled}\n onMouseEnter={onHover as MouseEventHandler}\n onTouchStart={onHover as TouchEventHandler}\n >\n {validating ? (\n <Validation variant={variant} size={size} />\n ) : (\n <HStack w=\"full\" gap={2} justify={label && (leadingIcon \|\| trailingIcon) ? 'space-between' : 'center'}>\n {leadingIcon && {\n ...leadingIcon,\n props: {\n ...leadingIcon.props,\n className: !leadingIcon.props.color ? classes.icon : undefined,\n width: iconSize,\n height: iconSize,\n },\n }}\n {trailingIcon && label && expand && <Box w={containerSize} />}\n {label && <span className={classes.label}>{label}</span>}\n {leadingIcon && label && expand && <Box w={containerSize} />}\n {trailingIcon && {\n ...trailingIcon,\n props: {\n ...trailingIcon.props,\n className: !trailingIcon.props.color ? classes.icon : undefined,\n width: iconSize,\n height: iconSize,\n },\n }}\n </HStack>\n )}\n </button>\n );\n });\n});\n\nconst Button = Object.assign(Component, {\n LeadingIcon,\n TrailingIcon,\n});\n\nComponent.displayName = 'Button';\n\nexport default Button;\n"],"names":["LeadingIcon","createSlot","children","props","_jsx","Flex","Children","child","cloneElement","TrailingIcon","Validation","variant","size","spinnerInverted","spinnerNeutral","LoadingSpinner","Component","forwardRef","forwardedRef","label","textStyle","disabled","expand","validating","iconSizeOverride","onHover","iconSize","classes","button","internalRef","useRef","ref","buttonProps","useButton","hoverProps","useHover","isFocusVisible","focusProps","useFocusRing","createHost","slots","leadingIcon","trailingIcon","containerSize","cx","mergeProps","_jsxs","HStack","Box","Button"],"mappings":"srBAoBMA,EAAcC,EAAAA,WAAW,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAO,IAElDC,EAAAA,IAACC,EAAI,KAAA,CAAC,WAAW,SAAS,eAAe,SACtC,SAAAC,EAAAA,SAAS,IAAIJ,EAAUK,GACfC,EAAAA,aAAaD,EAAOJ,CAAK,CACjC,CACI,CAAA,CAEV,EAEKM,EAAeR,aAAW,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAO,IAEnDC,EAAAA,IAACC,EAAAA,KAAI,CAAC,WAAW,SAAS,eAAe,SACtC,SAAAC,EAAAA,SAAS,IAAIJ,EAAUK,GACfC,eAAaD,EAAOJ,CAAK,CACjC,CACI,CAAA,CAEV,EAEKO,EAAa,CAAC,CAAE,QAAAC,EAAU,UAAW,KAAAC,EAAO,IAAI,IAA4B,CAChF,MAAMC,EAAkBF,IAAY,WAAaA,IAAY,WACvDG,EAAiBH,IAAY,WAAaA,IAAY,WAO5D,OACEP,EAAAA,IAACW,iBAAe,CAAA,KAPG,CACnB,GAAI,GACJ,GAAI,GACJ,GAAI,IAI+BH,CAAI,EAAG,YAAa,IAAK,SAAUC,EAAiB,QAASC,CAAkB,CAAA,CAEtH,EAEME,EAAYC,EAAAA,WAA2C,CAACd,EAAOe,IAAgB,CACnF,KAAM,CACJ,MAAAC,EACA,QAAAR,EAAU,UACV,UAAAS,EACA,KAAAR,EAAO,KACP,SAAAS,EACA,OAAAC,EACA,WAAAC,EACA,SAAUC,EACV,QAAAC,CAAO,EACLtB,EAEEuB,EAAWF,IAAqBZ,IAAS,KAAO,GAAK,IAErDe,EAAUC,EAAAA,OAAO,CAAE,QAAAjB,EAAS,UAAAS,EAAW,OAAAE,EAAQ,KAAAV,EAAM,WAAAW,EAAY,SAAU,CAACJ,CAAO,CAAA,EAEnFU,EAAcC,SAAO,IAAI,EACzBC,EAAMb,GAAgBW,EAEtB,CAAE,YAAAG,CAAa,EAAGC,EAAAA,UACtB,CAAE,GAAG9B,EAAO,WAAYkB,GAAY,EAAO,EAC3CU,CAAyC,EAErC,CAAE,WAAAG,CAAU,EAAKC,EAAAA,SAAS,CAAE,WAAYd,GAAY,EAAK,CAAE,EAC3D,CAAE,eAAAe,EAAgB,WAAAC,GAAeC,EAAAA,aAAAA,EAEvC,OAAOC,aAAWpC,EAAM,SAAUqC,GAAQ,CACxC,MAAMC,EAAcD,EAAM,IAAIxC,CAAW,EACnC0C,EAAeF,EAAM,IAAI/B,CAAY,EACrCkC,EAAgBjB,EAAW,EAEjC,OACEtB,gBACE,UAAWwC,EAAAA,GAAGjB,EAAQ,OAAQ,QAAS,CAACR,GAASQ,EAAQ,cAAeS,GAAkBT,EAAQ,KAAK,EACvG,IAAKI,EAAG,GACJc,EAAWb,WAAAA,EAAaE,EAAYG,CAAU,EACnC,gBAAAhB,EACf,aAAcI,EACd,aAAcA,EAEb,SAAAF,EACCnB,EAACM,IAAAA,GAAW,QAASC,EAAS,KAAMC,CAAQ,CAAA,EAE5CkC,OAACC,SAAO,CAAA,EAAE,OAAO,IAAK,EAAG,QAAS5B,IAAUsB,GAAeC,GAAgB,gBAAkB,SAC1F,SAAA,CAAAD,GAAe,CACd,GAAGA,EACH,MAAO,CACL,GAAGA,EAAY,MACf,UAAYA,EAAY,MAAM,MAAuB,OAAfd,EAAQ,KAC9C,MAAOD,EACP,OAAQA,CACT,CACF,EACAgB,GAAgBvB,GAASG,GAAUlB,MAAC4C,EAAG,IAAA,CAAC,EAAGL,CAAiB,CAAA,EAC5DxB,GAASf,EAAAA,IAAA,OAAA,CAAM,UAAWuB,EAAQ,eAAQR,CAAK,CAAA,EAC/CsB,GAAetB,GAASG,GAAUlB,MAAC4C,OAAI,EAAGL,CAAiB,CAAA,EAC3DD,GAAgB,CACf,GAAGA,EACH,MAAO,CACL,GAAGA,EAAa,MAChB,UAAYA,EAAa,MAAM,MAAuB,OAAff,EAAQ,KAC/C,MAAOD,EACP,OAAQA,CACT,EACF,CACM,CAAA,CAEJ,CAAA,CAEb,CAAC,CACH,CAAC,EAEKuB,EAAS,OAAO,OAAOjC,EAAW,CACtC,YAAAhB,EACA,aAAAS,CACD,CAAA,EAEDO,EAAU,YAAc"}

package/dist/cjs/recipes/button.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var r=require("@styled/css");const e=r.sva({slots:["button","label","focus","icon","iconContainer"],base:{button:{display:"inline-flex",alignItems:"center",justifyContent:"center",position:"relative",fontWeight:"semibold",boxSizing:"border-box",borderRadius:"button",border:"thin solid",borderColor:"transparent",cursor:"pointer",transition:"all 0.2s ease",outline:"none",willChange:"transform, opacity",bg:"none",_active:{transform:"scale(0.95)"},_disabled:{opacity:"0.3",pointerEvents:"none"},_before:{content:'""',position:"absolute",top:0,left:0,right:0,bottom:0,borderRadius:"inherit",backgroundImage:"linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05))",_dark:{backgroundImage:"linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05))"},opacity:0,transition:"opacity 0.2s ease"},_hover:{_before:{opacity:1}}},label:{display:"flex",textAlign:"center",justifyContent:"center",whiteSpace:"nowrap",transition:"all 0.2s ease"},focus:{outlineColor:"brand.base",outlineStyle:"solid",outlineWidth:"thick",outlineOffset:.5},icon:{transition:"all 0.2s ease"}},variants:{size:{sm:{button:{h:9,py:1.5,px:4},label:{fontSize:"sm",lineHeight:"1.5rem"},iconContainer:{w:9,p:1.5}},md:{button:{h:12,py:3,px:6},label:{fontSize:"md",lineHeight:"1.5rem"},iconContainer:{w:12,p:3}},lg:{button:{h:15,py:4,px:6},label:{fontSize:"lg",lineHeight:"1.75rem"},iconContainer:{w:15,p:4}}},variant:{primary:{button:{bg:"brand.base"},label:{color:"surface.primary"},icon:{color:"surface.primary"}},secondary:{button:{bg:"brand.lightest"},label:{color:"brand.darker"},icon:{color:"brand.darker"}},negative:{button:{bg:"negative.darker"},label:{color:"surface.primary"},icon:{color:"surface.primary"}},neutral:{button:{bg:"neutral.quaternary"},label:{color:"text.primary"},icon:{color:"text.primary"}},tertiary:{button:{bg:"transparent",borderColor:"neutral.primary"},label:{color:"text.primary"},icon:{color:"brand.base"}},text:{button:{p:0,h:"fit-content",_hover:{_before:{opacity:0}}},label:{color:"brand.base",_groupHover:{color:"brand.darkest",_dark:{color:"brand.base"}}},icon:{color:"brand.base",_groupHover:{color:"brand.darkest",_dark:{color:"brand.base"}}}},transparent:{button:{bg:{base:"#ffffff14",_hover:"#ffffff4d"},_dark:{bg:"#ffffff29"},backdropFilter:"blur(3px)",_before:{display:"none"}},label:{color:"chalk"},icon:{color:"chalk"}}},validating:{true:{button:{pointerEvents:"none"}}},expand:{true:{button:{width:"full"}}},iconOnly:{true:{button:{borderRadius:"full"}}}},defaultVariants:{size:"md",variant:"primary"}});exports.button=e;
+"use strict";var r=require("@styled/css");const e=r.sva({slots:["button","label","focus","icon","iconContainer"],base:{button:{display:"inline-flex",alignItems:"center",justifyContent:"center",position:"relative",fontWeight:"semibold",boxSizing:"border-box",borderRadius:"button",border:"thin solid",borderColor:"transparent",cursor:"pointer",transition:"all 0.1s ease",outline:"none",willChange:"transform, opacity",bg:"none",_active:{transform:"scale(0.95)"},_disabled:{opacity:"0.3",pointerEvents:"none"},_before:{content:'""',position:"absolute",top:0,left:0,right:0,bottom:0,borderRadius:"inherit",backgroundImage:"linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05))",_dark:{backgroundImage:"linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05))"},opacity:0,transition:"opacity 0.1s ease"},_hover:{_before:{opacity:1}}},label:{display:"flex",textAlign:"center",justifyContent:"center",whiteSpace:"nowrap",transition:"all 0.1s ease"},focus:{outlineColor:"brand.base",outlineStyle:"solid",outlineWidth:"thick",outlineOffset:.5},icon:{transition:"all 0.1s ease"}},variants:{size:{sm:{button:{h:9,py:1.5,px:4},label:{fontSize:"sm",lineHeight:"1.5rem"},iconContainer:{w:9,p:1.5}},md:{button:{h:12,py:3,px:6},label:{fontSize:"md",lineHeight:"1.5rem"},iconContainer:{w:12,p:3}},lg:{button:{h:15,py:4,px:6},label:{fontSize:"lg",lineHeight:"1.75rem"},iconContainer:{w:15,p:4}}},variant:{primary:{button:{bg:"brand.base"},label:{color:"surface.primary"},icon:{color:"surface.primary"}},secondary:{button:{bg:"brand.lightest"},label:{color:"brand.darker"},icon:{color:"brand.darker"}},negative:{button:{bg:"negative.darker"},label:{color:"surface.primary"},icon:{color:"surface.primary"}},neutral:{button:{bg:"neutral.quaternary"},label:{color:"text.primary"},icon:{color:"text.primary"}},tertiary:{button:{bg:"transparent",borderColor:"neutral.primary"},label:{color:"text.primary"},icon:{color:"brand.base"}},text:{button:{p:0,h:"fit-content",_hover:{_before:{opacity:0}}},label:{color:"brand.base",_groupHover:{color:"brand.darkest",_dark:{color:"brand.lighter"}}},icon:{color:"brand.base",_groupHover:{color:"brand.darkest",_dark:{color:"brand.lighter"}}}},transparent:{button:{bg:{base:"#ffffff14",_hover:"#ffffff4d"},_dark:{bg:"#ffffff29"},backdropFilter:"blur(3px)",_before:{display:"none"}},label:{color:"chalk"},icon:{color:"chalk"}}},validating:{true:{button:{pointerEvents:"none"}}},expand:{true:{button:{width:"full"}}},iconOnly:{true:{button:{borderRadius:"full"}}},textStyle:{negative:{},neutral:{},subtle:{}}},compoundVariants:[{variant:"text",textStyle:"negative",css:{label:{color:"negative.darker",_groupHover:{color:"negative.darkest",_dark:{color:"ruby.70"}}},icon:{color:"negative.darker",_groupHover:{color:"negative.darkest",_dark:{color:"ruby.70"}}}}},{variant:"text",textStyle:"neutral",css:{label:{color:"text.primary",_groupHover:{color:"text.secondary",_dark:{color:"text.secondary"}}},icon:{color:"text.primary",_groupHover:{color:"text.secondary",_dark:{color:"text.secondary"}}}}},{variant:"text",textStyle:"subtle",css:{label:{color:"text.tertiary",_groupHover:{color:"text.secondary",_dark:{color:"text.secondary"}}},icon:{color:"text.tertiary",_groupHover:{color:"text.secondary",_dark:{color:"text.secondary"}}}}}],defaultVariants:{size:"md",variant:"primary"}});exports.button=e;
 //# sourceMappingURL=button.js.map

package/dist/cjs/recipes/button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"button.js","sources":["../../../src/recipes/button.ts"],"sourcesContent":["import { sva } from '@styled/css';\n\nexport const button = sva({\n slots: ['button', 'label', 'focus', 'icon', 'iconContainer'],\n base: {\n button: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n fontWeight: 'semibold',\n boxSizing: 'border-box',\n borderRadius: 'button',\n border: 'thin solid',\n borderColor: 'transparent',\n cursor: 'pointer',\n transition: 'all 0.2s ease',\n outline: 'none',\n willChange: 'transform, opacity',\n bg: 'none',\n _active: { transform: 'scale(0.95)' },\n _disabled: { opacity: '0.3', pointerEvents: 'none' },\n _before: {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n borderRadius: 'inherit',\n backgroundImage: 'linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05))',\n _dark: { backgroundImage: `linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05))` },\n opacity: 0,\n transition: 'opacity 0.2s ease',\n },\n _hover: {\n _before: {\n opacity: 1,\n },\n },\n },\n label: {\n display: 'flex',\n textAlign: 'center',\n justifyContent: 'center',\n whiteSpace: 'nowrap',\n transition: 'all 0.2s ease',\n },\n focus: {\n outlineColor: 'brand.base',\n outlineStyle: 'solid',\n outlineWidth: 'thick',\n outlineOffset: 0.5,\n },\n icon: {\n transition: 'all 0.2s ease',\n },\n },\n variants: {\n size: {\n sm: {\n button: {\n h: 9,\n py: 1.5,\n px: 4,\n },\n label: {\n fontSize: 'sm',\n lineHeight: '1.5rem',\n },\n iconContainer: {\n w: 9,\n p: 1.5,\n },\n },\n md: {\n button: {\n h: 12,\n py: 3,\n px: 6,\n },\n label: {\n fontSize: 'md',\n lineHeight: '1.5rem',\n },\n iconContainer: {\n w: 12,\n p: 3,\n },\n },\n lg: {\n button: {\n h: 15,\n py: 4,\n px: 6,\n },\n label: {\n fontSize: 'lg',\n lineHeight: '1.75rem',\n },\n iconContainer: {\n w: 15,\n p: 4,\n },\n },\n },\n variant: {\n primary: {\n button: {\n bg: 'brand.base',\n },\n label: {\n color: 'surface.primary',\n },\n icon: {\n color: 'surface.primary',\n },\n },\n secondary: {\n button: {\n bg: 'brand.lightest',\n },\n label: {\n color: 'brand.darker',\n },\n icon: {\n color: 'brand.darker',\n },\n },\n negative: {\n button: {\n bg: 'negative.darker',\n },\n label: {\n color: 'surface.primary',\n },\n icon: {\n color: 'surface.primary',\n },\n },\n neutral: {\n button: {\n bg: 'neutral.quaternary',\n },\n label: {\n color: 'text.primary',\n },\n icon: {\n color: 'text.primary',\n },\n },\n tertiary: {\n button: {\n bg: 'transparent',\n borderColor: 'neutral.primary',\n },\n label: {\n color: 'text.primary',\n },\n icon: {\n color: 'brand.base',\n },\n },\n text: {\n button: {\n p: 0,\n h: 'fit-content',\n _hover: {\n _before: {\n opacity: 0,\n },\n },\n },\n label: {\n color: 'brand.base',\n _groupHover: {\n color: 'brand.darkest',\n _dark: {\n color: 'brand.~~base~~',\n },\n },\n },\n icon: {\n color: 'brand.base',\n _groupHover: {\n color: 'brand.darkest',\n _dark: {\n color: 'brand.~~base~~',\n },\n },\n },\n },\n transparent: {\n button: {\n bg: { base: '#ffffff14', _hover: '#ffffff4d' },\n _dark: { bg: '#ffffff29' },\n backdropFilter: 'blur(3px)',\n _before: { display: 'none' },\n },\n label: {\n color: 'chalk',\n },\n icon: {\n color: 'chalk',\n },\n },\n },\n validating: {\n true: {\n button: {\n pointerEvents: 'none',\n },\n },\n },\n expand: {\n true: {\n button: {\n width: 'full',\n },\n },\n },\n iconOnly: {\n true: {\n button: {\n borderRadius: 'full',\n },\n },\n },\n },\n defaultVariants: {\n size: 'md',\n variant: 'primary',\n },\n});\n"],"names":["button","sva"],"mappings":"0CAEO,MAAMA,EAASC,EAAAA,IAAI,CACxB,MAAO,CAAC,SAAU,QAAS,QAAS,OAAQ,eAAe,EAC3D,KAAM,CACJ,OAAQ,CACN,QAAS,cACT,WAAY,SACZ,eAAgB,SAChB,SAAU,WACV,WAAY,WACZ,UAAW,aACX,aAAc,SACd,OAAQ,aACR,YAAa,cACb,OAAQ,UACR,WAAY,gBACZ,QAAS,OACT,WAAY,qBACZ,GAAI,OACJ,QAAS,CAAE,UAAW,aAAe,EACrC,UAAW,CAAE,QAAS,MAAO,cAAe,MAAQ,EACpD,QAAS,CACP,QAAS,KACT,SAAU,WACV,IAAK,EACL,KAAM,EACN,MAAO,EACP,OAAQ,EACR,aAAc,UACd,gBAAiB,4DACjB,MAAO,CAAE,gBAAiB,uEAAyE,EACnG,QAAS,EACT,WAAY,mBACb,EACD,OAAQ,CACN,QAAS,CACP,QAAS,CACV,CACF,CACF,EACD,MAAO,CACL,QAAS,OACT,UAAW,SACX,eAAgB,SAChB,WAAY,SACZ,WAAY,eACb,EACD,MAAO,CACL,aAAc,aACd,aAAc,QACd,aAAc,QACd,cAAe,EAChB,EACD,KAAM,CACJ,WAAY,eACb,CACF,EACD,SAAU,CACR,KAAM,CACJ,GAAI,CACF,OAAQ,CACN,EAAG,EACH,GAAI,IACJ,GAAI,CACL,EACD,MAAO,CACL,SAAU,KACV,WAAY,QACb,EACD,cAAe,CACb,EAAG,EACH,EAAG,GACJ,CACF,EACD,GAAI,CACF,OAAQ,CACN,EAAG,GACH,GAAI,EACJ,GAAI,CACL,EACD,MAAO,CACL,SAAU,KACV,WAAY,QACb,EACD,cAAe,CACb,EAAG,GACH,EAAG,CACJ,CACF,EACD,GAAI,CACF,OAAQ,CACN,EAAG,GACH,GAAI,EACJ,GAAI,CACL,EACD,MAAO,CACL,SAAU,KACV,WAAY,SACb,EACD,cAAe,CACb,EAAG,GACH,EAAG,CACJ,CACF,CACF,EACD,QAAS,CACP,QAAS,CACP,OAAQ,CACN,GAAI,YACL,EACD,MAAO,CACL,MAAO,iBACR,EACD,KAAM,CACJ,MAAO,iBACR,CACF,EACD,UAAW,CACT,OAAQ,CACN,GAAI,gBACL,EACD,MAAO,CACL,MAAO,cACR,EACD,KAAM,CACJ,MAAO,cACR,CACF,EACD,SAAU,CACR,OAAQ,CACN,GAAI,iBACL,EACD,MAAO,CACL,MAAO,iBACR,EACD,KAAM,CACJ,MAAO,iBACR,CACF,EACD,QAAS,CACP,OAAQ,CACN,GAAI,oBACL,EACD,MAAO,CACL,MAAO,cACR,EACD,KAAM,CACJ,MAAO,cACR,CACF,EACD,SAAU,CACR,OAAQ,CACN,GAAI,cACJ,YAAa,iBACd,EACD,MAAO,CACL,MAAO,cACR,EACD,KAAM,CACJ,MAAO,YACR,CACF,EACD,KAAM,CACJ,OAAQ,CACN,EAAG,EACH,EAAG,cACH,OAAQ,CACN,QAAS,CACP,QAAS,CACV,CACF,CACF,EACD,MAAO,CACL,MAAO,aACP,YAAa,CACX,MAAO,gBACP,MAAO,CACL,MAAO,~~YACR~~,CACF,CACF,EACD,KAAM,CACJ,MAAO,aACP,YAAa,CACX,MAAO,gBACP,MAAO,CACL,MAAO,~~YACR~~,CACF,CACF,CACF,EACD,YAAa,CACX,OAAQ,CACN,GAAI,CAAE,KAAM,YAAa,OAAQ,WAAa,EAC9C,MAAO,CAAE,GAAI,WAAa,EAC1B,eAAgB,YAChB,QAAS,CAAE,QAAS,MAAQ,CAC7B,EACD,MAAO,CACL,MAAO,OACR,EACD,KAAM,CACJ,MAAO,OACR,CACF,CACF,EACD,WAAY,CACV,KAAM,CACJ,OAAQ,CACN,cAAe,MAChB,CACF,CACF,EACD,OAAQ,CACN,KAAM,CACJ,OAAQ,CACN,MAAO,MACR,CACF,CACF,EACD,SAAU,CACR,KAAM,CACJ,OAAQ,CACN,aAAc,MACf,CACF,CACF,CACF,EACD,gBAAiB,CACf,KAAM,KACN,QAAS,SACV,CACF,CAAA"}
1	+ {"version":3,"file":"button.js","sources":["../../../src/recipes/button.ts"],"sourcesContent":["import { sva } from '@styled/css';\n\nexport const button = sva({\n slots: ['button', 'label', 'focus', 'icon', 'iconContainer'],\n base: {\n button: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n fontWeight: 'semibold',\n boxSizing: 'border-box',\n borderRadius: 'button',\n border: 'thin solid',\n borderColor: 'transparent',\n cursor: 'pointer',\n transition: 'all 0.1s ease',\n outline: 'none',\n willChange: 'transform, opacity',\n bg: 'none',\n _active: { transform: 'scale(0.95)' },\n _disabled: { opacity: '0.3', pointerEvents: 'none' },\n _before: {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n borderRadius: 'inherit',\n backgroundImage: 'linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05))',\n _dark: { backgroundImage: `linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05))` },\n opacity: 0,\n transition: 'opacity 0.1s ease',\n },\n _hover: {\n _before: {\n opacity: 1,\n },\n },\n },\n label: {\n display: 'flex',\n textAlign: 'center',\n justifyContent: 'center',\n whiteSpace: 'nowrap',\n transition: 'all 0.1s ease',\n },\n focus: {\n outlineColor: 'brand.base',\n outlineStyle: 'solid',\n outlineWidth: 'thick',\n outlineOffset: 0.5,\n },\n icon: {\n transition: 'all 0.1s ease',\n },\n },\n variants: {\n size: {\n sm: {\n button: {\n h: 9,\n py: 1.5,\n px: 4,\n },\n label: {\n fontSize: 'sm',\n lineHeight: '1.5rem',\n },\n iconContainer: {\n w: 9,\n p: 1.5,\n },\n },\n md: {\n button: {\n h: 12,\n py: 3,\n px: 6,\n },\n label: {\n fontSize: 'md',\n lineHeight: '1.5rem',\n },\n iconContainer: {\n w: 12,\n p: 3,\n },\n },\n lg: {\n button: {\n h: 15,\n py: 4,\n px: 6,\n },\n label: {\n fontSize: 'lg',\n lineHeight: '1.75rem',\n },\n iconContainer: {\n w: 15,\n p: 4,\n },\n },\n },\n variant: {\n primary: {\n button: {\n bg: 'brand.base',\n },\n label: {\n color: 'surface.primary',\n },\n icon: {\n color: 'surface.primary',\n },\n },\n secondary: {\n button: {\n bg: 'brand.lightest',\n },\n label: {\n color: 'brand.darker',\n },\n icon: {\n color: 'brand.darker',\n },\n },\n negative: {\n button: {\n bg: 'negative.darker',\n },\n label: {\n color: 'surface.primary',\n },\n icon: {\n color: 'surface.primary',\n },\n },\n neutral: {\n button: {\n bg: 'neutral.quaternary',\n },\n label: {\n color: 'text.primary',\n },\n icon: {\n color: 'text.primary',\n },\n },\n tertiary: {\n button: {\n bg: 'transparent',\n borderColor: 'neutral.primary',\n },\n label: {\n color: 'text.primary',\n },\n icon: {\n color: 'brand.base',\n },\n },\n text: {\n button: {\n p: 0,\n h: 'fit-content',\n _hover: {\n _before: {\n opacity: 0,\n },\n },\n },\n label: {\n color: 'brand.base',\n _groupHover: {\n color: 'brand.darkest',\n _dark: {\n color: 'brand.lighter',\n },\n },\n },\n icon: {\n color: 'brand.base',\n _groupHover: {\n color: 'brand.darkest',\n _dark: {\n color: 'brand.lighter',\n },\n },\n },\n },\n transparent: {\n button: {\n bg: { base: '#ffffff14', _hover: '#ffffff4d' },\n _dark: { bg: '#ffffff29' },\n backdropFilter: 'blur(3px)',\n _before: { display: 'none' },\n },\n label: {\n color: 'chalk',\n },\n icon: {\n color: 'chalk',\n },\n },\n },\n validating: {\n true: {\n button: {\n pointerEvents: 'none',\n },\n },\n },\n expand: {\n true: {\n button: {\n width: 'full',\n },\n },\n },\n iconOnly: {\n true: {\n button: {\n borderRadius: 'full',\n },\n },\n },\n textStyle: {\n negative: {},\n neutral: {},\n subtle: {},\n },\n },\n compoundVariants: [\n {\n variant: 'text',\n textStyle: 'negative',\n css: {\n label: {\n color: 'negative.darker',\n _groupHover: {\n color: 'negative.darkest',\n _dark: {\n color: 'ruby.70',\n },\n },\n },\n icon: {\n color: 'negative.darker',\n _groupHover: {\n color: 'negative.darkest',\n _dark: {\n color: 'ruby.70',\n },\n },\n },\n },\n },\n {\n variant: 'text',\n textStyle: 'neutral',\n css: {\n label: {\n color: 'text.primary',\n _groupHover: {\n color: 'text.secondary',\n _dark: { color: 'text.secondary' },\n },\n },\n icon: {\n color: 'text.primary',\n _groupHover: {\n color: 'text.secondary',\n _dark: { color: 'text.secondary' },\n },\n },\n },\n },\n {\n variant: 'text',\n textStyle: 'subtle',\n css: {\n label: {\n color: 'text.tertiary',\n _groupHover: {\n color: 'text.secondary',\n _dark: { color: 'text.secondary' },\n },\n },\n icon: {\n color: 'text.tertiary',\n _groupHover: {\n color: 'text.secondary',\n _dark: { color: 'text.secondary' },\n },\n },\n },\n },\n ],\n defaultVariants: {\n size: 'md',\n variant: 'primary',\n },\n});\n"],"names":["button","sva"],"mappings":"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"}

package/dist/es/components/inputs/text-input.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as t,jsxs as T}from"react/jsx-runtime";import{Children as z,cloneElement as D,isValidElement as _,forwardRef as E,useRef as S}from"react";import{useTextField as k,useFocusRing as w,useHover as A,mergeProps as H}from"react-aria";import M from"../primitives/button.js";import"../primitives/checkbox.js";import"../primitives/dropdown-selector.js";import"../primitives/popover.js";import"../primitives/radio.js";import"../primitives/segmented-control.js";import"../primitives/switch.js";import p from"../primitives/text.js";import{textInput as R}from"../../recipes/text-input.js";import{cx as V}from"@styled/css";import{Flex as N,VStack as ee,HStack as re}from"@styled/jsx";import{token as u}from"@styled/tokens";import{createSlot as m,createHost as te}from"create-slots";const B=m(({children:o,...n})=>t(N,{alignItems:"center",justifyContent:"center",children:z.map(o,e=>{var r;return D(e,{...n,color:(r=e.props.color)!==null&&r!==void 0?r:u("colors.neutral.primary")})})})),O=m(({children:o,...n})=>t(N,{alignItems:"center",justifyContent:"center",children:z.map(o,e=>{var r;return _(e)?D(e,{...n,color:(r=e.props.color)!==null&&r!==void 0?r:u("colors.brand.base")}):null})})),W=m(M),q=m(p),G=m(p),J=E((o,n)=>{const{label:e,disabled:r,size:a="md",alignText:h="left",attr:f,description:l,autoFocus:g,className:x="",errorMessage:d}=o,s=a==="sm"?16:20,L=S(null),P=n||L,{labelProps:Q,inputProps:U,descriptionProps:X,errorMessageProps:Y,isInvalid:y,validationErrors:I}=k({...o,isDisabled:r??!1,isInvalid:!!d},P),{focusProps:Z}=w({autoFocus:g??!1}),{hoverProps:$}=A({isDisabled:r??!1});return te(o.children,c=>{const b=c.get(B),v=c.get(O),j=c.getProps(W),C=c.getProps(q),F=c.getProps(G),i=R({size:a,alignText:h,disabled:r,isError:y});return T(ee,{className:V(i.container,x),children:[e&&t("label",{className:i.label,...Q,children:e}),T(re,{className:i.inputContainer,children:[b&&{...b,props:{...b.props,className:i.typeIcon,width:s,height:s}},C&&t(p,{...C,styles:{color:u("colors.text.tertiary")}}),t("input",{ref:P,className:i.input,...H(U,Z,$),...f}),F&&t(p,{...F,styles:{color:u("colors.text.tertiary")}}),v&&{...v,props:{...v.props,className:i.actionIcon,width:s,height:s}},j&&t(N,{alignItems:"center",justifyContent:"center",className:i.actionButton,children:t(M,{...j,variant:"text",size:a})})]}),l&&t("div",{className:i.description,...X,children:l}),y&&t(p,{variant:"error",...Y,size:"sm",styles:{fontWeight:"400"},children:I.length>0?I.join(" "):d})]})})}),K=E((o,n)=>{const{disabled:e,autoFocus:r,className:a="",attr:h}=o,f=S(null),l=n||f,{inputProps:g}=k({...o,isDisabled:e??!1},l),{focusProps:x}=w({autoFocus:r??!1}),{hoverProps:d}=A({isDisabled:e??!1}),s=R({char:!0,disabled:e});return t("div",{className:V(s.container,s.inputContainer,a),children:t("input",{ref:l,className:s.input,...H(g,x,d),size:1,...h})})}),oe=Object.assign(J,{TypeIcon:B,ActionIcon:O,ActionButton:W,Char:K,Prefix:q,Suffix:G});J.displayName="TextInput",K.displayName="TextInputChar";export{oe as TextInput};
+import{jsx as t,jsxs as T}from"react/jsx-runtime";import{Children as z,cloneElement as D,isValidElement as _,forwardRef as E,useRef as S}from"react";import{useTextField as k,useFocusRing as w,useHover as H,mergeProps as M}from"react-aria";import R from"../primitives/button.js";import"../primitives/checkbox.js";import"../primitives/dropdown-selector.js";import"../primitives/popover.js";import"../primitives/radio.js";import"../primitives/segmented-control.js";import"../primitives/switch.js";import p from"../primitives/text.js";import{textInput as V}from"../../recipes/text-input.js";import{cx as A}from"@styled/css";import{Flex as N,VStack as ee,HStack as re}from"@styled/jsx";import{token as u}from"@styled/tokens";import{createSlot as m,createHost as te}from"create-slots";const B=m(({children:o,...n})=>t(N,{alignItems:"center",justifyContent:"center",children:z.map(o,e=>{var r;return D(e,{...n,color:(r=e.props.color)!==null&&r!==void 0?r:u("colors.neutral.primary")})})})),G=m(({children:o,...n})=>t(N,{alignItems:"center",justifyContent:"center",children:z.map(o,e=>{var r;return _(e)?D(e,{...n,color:(r=e.props.color)!==null&&r!==void 0?r:u("colors.brand.base")}):null})})),O=m(R),W=m(p),$=m(p),q=E((o,n)=>{const{label:e,disabled:r,size:a="md",alignText:h="left",attr:f,description:l,autoFocus:g,className:x="",errorMessage:d}=o,s=a==="sm"?16:20,K=S(null),P=n||K,{labelProps:L,inputProps:Q,descriptionProps:U,errorMessageProps:X,isInvalid:y,validationErrors:I}=k({...o,isDisabled:r??!1,isInvalid:!!d},P),{focusProps:Y}=w({autoFocus:g??!1}),{hoverProps:Z}=H({isDisabled:r??!1});return te(o.children,c=>{const b=c.get(B),v=c.get(G),j=c.getProps(O),C=c.getProps(W),F=c.getProps($),i=V({size:a,alignText:h,disabled:r,isError:y});return T(ee,{className:A(i.container,x),children:[e&&t("label",{className:i.label,...L,children:e}),T(re,{className:i.inputContainer,children:[b&&{...b,props:{...b.props,className:i.typeIcon,width:s,height:s}},C&&t(p,{...C,styles:{color:u("colors.text.tertiary")}}),t("input",{ref:P,className:i.input,...M(Q,Y,Z),...f}),F&&t(p,{...F,styles:{color:u("colors.text.tertiary")}}),v&&{...v,props:{...v.props,className:i.actionIcon,width:s,height:s}},j&&t(N,{alignItems:"center",justifyContent:"center",className:i.actionButton,children:t(R,{...j,variant:"text",size:a})})]}),l&&t("div",{className:i.description,...U,children:l}),y&&t(p,{variant:"error",...X,size:"sm",styles:{fontWeight:"400"},children:I.length>0?I.join(" "):d})]})})}),J=E((o,n)=>{const{disabled:e,autoFocus:r,className:a="",attr:h}=o,f=S(null),l=n||f,{inputProps:g}=k({...o,isDisabled:e??!1},l),{focusProps:x}=w({autoFocus:r??!1}),{hoverProps:d}=H({isDisabled:e??!1}),s=V({char:!0,disabled:e});return t("div",{className:A(s.container,s.inputContainer,a),children:t("input",{ref:l,className:s.input,...M(g,x,d),size:1,...h})})}),oe=Object.assign(q,{TypeIcon:B,ActionIcon:G,ActionButton:O,Char:J,Prefix:W,Suffix:$});q.displayName="TextInput",J.displayName="TextInputChar";export{oe as TextInput};
 //# sourceMappingURL=text-input.js.map

package/dist/es/components/primitives/button.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as t,jsxs as F}from"react/jsx-runtime";import"../feedback/callout.js";import{LoadingSpinner as R}from"../feedback/loading-spinner.js";import"@styled/tokens";import"./checkbox.js";import"./dropdown-selector.js";import"./popover.js";import"./radio.js";import"./segmented-control.js";import"./switch.js";import"./text.js";import"./portal.js";import{Children as b,cloneElement as v,forwardRef as k,useRef as D}from"react";import"../../hooks/useToast.js";import"../../recipes/toast.js";import{Flex as y,HStack as E,Box as w}from"@styled/jsx";import"../feedback/tooltip.js";import{button as L}from"../../recipes/button.js";import{cx as O}from"@styled/css";import{createSlot as x,createHost as T}from"create-slots";import{useButton as q,useHover as A,useFocusRing as M,mergeProps as V}from"react-aria";const j=x(({children:e,...i})=>t(y,{alignItems:"center",justifyContent:"center",children:b.map(e,r=>v(r,i))})),z=x(({children:e,...i})=>t(y,{alignItems:"center",justifyContent:"center",children:b.map(e,r=>v(r,i))})),W=({variant:e="primary",size:i="md"})=>{const r=e==="primary"||e==="negative",p=e==="neutral"||e==="tertiary";return t(R,{size:{sm:20,md:24,lg:28}[i],strokeWidth:2.5,inverted:r,neutral:p})},N=k((e,i)=>{const{label:r,variant:p="primary",size:m="md",disabled:l,expand:c,validating:d,iconSize:C,onHover:u}=e,a=C||(m==="sm"?16:24),o=L({variant:p,expand:c,size:m,validating:d,iconOnly:!r}),H=D(null),f=i||H,{buttonProps:I}=q({...e,isDisabled:l??!1},f),{hoverProps:P}=A({isDisabled:l??!1}),{isFocusVisible:S,focusProps:B}=M();return T(e.children,h=>{const n=h.get(j),s=h.get(z),g=a/4;return t("button",{className:O(o.button,"group",!r&&o.iconContainer,S&&o.focus),ref:f,...V(I,P,B),"aria-disabled":l,onMouseEnter:u,onTouchStart:u,children:d?t(W,{variant:p,size:m}):F(E,{w:"full",gap:2,justify:r&&(n||s)?"space-between":"center",children:[n&&{...n,props:{...n.props,className:n.props.color?void 0:o.icon,width:a,height:a}},s&&r&&c&&t(w,{w:g}),r&&t("span",{className:o.label,children:r}),n&&r&&c&&t(w,{w:g}),s&&{...s,props:{...s.props,className:s.props.color?void 0:o.icon,width:a,height:a}}]})})})}),G=Object.assign(N,{LeadingIcon:j,TrailingIcon:z});N.displayName="Button";export{G as default};
+import{jsx as t,jsxs as F}from"react/jsx-runtime";import"../feedback/callout.js";import{LoadingSpinner as k}from"../feedback/loading-spinner.js";import"@styled/tokens";import"./checkbox.js";import"./dropdown-selector.js";import"./popover.js";import"./radio.js";import"./segmented-control.js";import"./switch.js";import"./text.js";import"./portal.js";import{Children as b,cloneElement as v,forwardRef as D,useRef as E}from"react";import"../../hooks/useToast.js";import"../../recipes/toast.js";import{Flex as y,HStack as L,Box as x}from"@styled/jsx";import"../feedback/tooltip.js";import{button as O}from"../../recipes/button.js";import{cx as T}from"@styled/css";import{createSlot as w,createHost as A}from"create-slots";import{useButton as G,useHover as M,useFocusRing as V,mergeProps as W}from"react-aria";const j=w(({children:r,...i})=>t(y,{alignItems:"center",justifyContent:"center",children:b.map(r,e=>v(e,i))})),S=w(({children:r,...i})=>t(y,{alignItems:"center",justifyContent:"center",children:b.map(r,e=>v(e,i))})),q=({variant:r="primary",size:i="md"})=>{const e=r==="primary"||r==="negative",p=r==="neutral"||r==="tertiary";return t(k,{size:{sm:20,md:24,lg:28}[i],strokeWidth:2.5,inverted:e,neutral:p})},z=D((r,i)=>{const{label:e,variant:p="primary",textStyle:N,size:m="md",disabled:l,expand:c,validating:d,iconSize:C,onHover:u}=r,a=C||(m==="sm"?16:24),o=O({variant:p,textStyle:N,expand:c,size:m,validating:d,iconOnly:!e}),H=E(null),f=i||H,{buttonProps:I}=G({...r,isDisabled:l??!1},f),{hoverProps:P}=M({isDisabled:l??!1}),{isFocusVisible:B,focusProps:R}=V();return A(r.children,g=>{const n=g.get(j),s=g.get(S),h=a/4;return t("button",{className:T(o.button,"group",!e&&o.iconContainer,B&&o.focus),ref:f,...W(I,P,R),"aria-disabled":l,onMouseEnter:u,onTouchStart:u,children:d?t(q,{variant:p,size:m}):F(L,{w:"full",gap:2,justify:e&&(n||s)?"space-between":"center",children:[n&&{...n,props:{...n.props,className:n.props.color?void 0:o.icon,width:a,height:a}},s&&e&&c&&t(x,{w:h}),e&&t("span",{className:o.label,children:e}),n&&e&&c&&t(x,{w:h}),s&&{...s,props:{...s.props,className:s.props.color?void 0:o.icon,width:a,height:a}}]})})})}),J=Object.assign(z,{LeadingIcon:j,TrailingIcon:S});z.displayName="Button";export{J as default};
 //# sourceMappingURL=button.js.map

package/dist/es/components/primitives/button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"button.js","sources":["../../../../src/components/primitives/button.tsx"],"sourcesContent":["import { LoadingSpinner } from '@components/feedback';\nimport { button } from '@recipes/button';\nimport { cx } from '@styled/css';\nimport { Box, Flex, HStack } from '@styled/jsx';\nimport { createHost, createSlot } from 'create-slots';\nimport React, { Children, MouseEventHandler, TouchEventHandler, cloneElement, forwardRef, useRef } from 'react';\nimport { mergeProps, useButton, useFocusRing, useHover, type AriaButtonProps } from 'react-aria';\n\nexport interface ButtonProps extends AriaButtonProps {\n label?: string;\n size?: 'sm' \| 'md' \| 'lg';\n variant?: 'primary' \| 'secondary' \| 'negative' \| 'neutral' \| 'tertiary' \| 'text' \| 'transparent';\n disabled?: boolean;\n expand?: boolean;\n validating?: boolean;\n iconSize?: number;\n onHover?: MouseEventHandler<HTMLButtonElement> \| TouchEventHandler<HTMLButtonElement>;\n}\n\nconst LeadingIcon = createSlot(({ children, ...props }) => {\n return (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Flex>\n );\n});\n\nconst TrailingIcon = createSlot(({ children, ...props }) => {\n return (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Flex>\n );\n});\n\nconst Validation = ({ variant = 'primary', size = 'md' }: Partial<ButtonProps>) => {\n const spinnerInverted = variant === 'primary' \|\| variant === 'negative';\n const spinnerNeutral = variant === 'neutral' \|\| variant === 'tertiary';\n const spinnerSizes = {\n sm: 20,\n md: 24,\n lg: 28,\n };\n\n return (\n <LoadingSpinner size={spinnerSizes[size]} strokeWidth={2.5} inverted={spinnerInverted} neutral={spinnerNeutral} />\n );\n};\n\nconst Component = forwardRef<HTMLButtonElement, ButtonProps>((props, forwardedRef) => {\n const {\n label,\n variant = 'primary',\n size = 'md',\n disabled,\n expand,\n validating,\n iconSize: iconSizeOverride,\n onHover,\n } = props;\n\n const iconSize = iconSizeOverride \|\| (size === 'sm' ? 16 : 24);\n\n const classes = button({ variant, expand, size, validating, iconOnly: !label });\n\n const internalRef = useRef(null);\n const ref = forwardedRef \|\| internalRef;\n\n const { buttonProps } = useButton(\n { ...props, isDisabled: disabled ?? false },\n ref as React.RefObject<HTMLButtonElement>,\n );\n const { hoverProps } = useHover({ isDisabled: disabled ?? false });\n const { isFocusVisible, focusProps } = useFocusRing();\n\n return createHost(props.children, slots => {\n const leadingIcon = slots.get(LeadingIcon);\n const trailingIcon = slots.get(TrailingIcon);\n const containerSize = iconSize / 4;\n\n return (\n <button\n className={cx(classes.button, 'group', !label && classes.iconContainer, isFocusVisible && classes.focus)}\n ref={ref}\n {...mergeProps(buttonProps, hoverProps, focusProps)}\n aria-disabled={disabled}\n onMouseEnter={onHover as MouseEventHandler}\n onTouchStart={onHover as TouchEventHandler}\n >\n {validating ? (\n <Validation variant={variant} size={size} />\n ) : (\n <HStack w=\"full\" gap={2} justify={label && (leadingIcon \|\| trailingIcon) ? 'space-between' : 'center'}>\n {leadingIcon && {\n ...leadingIcon,\n props: {\n ...leadingIcon.props,\n className: !leadingIcon.props.color ? classes.icon : undefined,\n width: iconSize,\n height: iconSize,\n },\n }}\n {trailingIcon && label && expand && <Box w={containerSize} />}\n {label && <span className={classes.label}>{label}</span>}\n {leadingIcon && label && expand && <Box w={containerSize} />}\n {trailingIcon && {\n ...trailingIcon,\n props: {\n ...trailingIcon.props,\n className: !trailingIcon.props.color ? classes.icon : undefined,\n width: iconSize,\n height: iconSize,\n },\n }}\n </HStack>\n )}\n </button>\n );\n });\n});\n\nconst Button = Object.assign(Component, {\n LeadingIcon,\n TrailingIcon,\n});\n\nComponent.displayName = 'Button';\n\nexport default Button;\n"],"names":["LeadingIcon","createSlot","children","props","_jsx","Flex","Children","child","cloneElement","TrailingIcon","Validation","variant","size","spinnerInverted","spinnerNeutral","LoadingSpinner","Component","forwardRef","forwardedRef","label","disabled","expand","validating","iconSizeOverride","onHover","iconSize","classes","button","internalRef","useRef","ref","buttonProps","useButton","hoverProps","useHover","isFocusVisible","focusProps","useFocusRing","createHost","slots","leadingIcon","trailingIcon","containerSize","cx","mergeProps","_jsxs","HStack","Box","Button"],"mappings":"~~4yBAmBMA~~,EAAcC,EAAW,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAO,IAElDC,EAACC,EAAI,CAAC,WAAW,SAAS,eAAe,SACtC,SAAAC,EAAS,IAAIJ,EAAUK,GACfC,EAAaD,EAAOJ,CAAK,CACjC,CACI,CAAA,CAEV,EAEKM,EAAeR,EAAW,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAO,IAEnDC,EAACC,EAAI,CAAC,WAAW,SAAS,eAAe,SACtC,SAAAC,EAAS,IAAIJ,EAAUK,GACfC,EAAaD,EAAOJ,CAAK,CACjC,CACI,CAAA,CAEV,EAEKO,EAAa,CAAC,CAAE,QAAAC,EAAU,UAAW,KAAAC,EAAO,IAAI,IAA4B,CAChF,MAAMC,EAAkBF,IAAY,WAAaA,IAAY,WACvDG,EAAiBH,IAAY,WAAaA,IAAY,WAO5D,OACEP,EAACW,EAAe,CAAA,KAPG,CACnB,GAAI,GACJ,GAAI,GACJ,GAAI,IAI+BH,CAAI,EAAG,YAAa,IAAK,SAAUC,EAAiB,QAASC,CAAkB,CAAA,CAEtH,EAEME,EAAYC,EAA2C,CAACd,EAAOe,IAAgB,CACnF,KAAM,CACJ,MAAAC,EACA,QAAAR,EAAU,UACV,~~KAAAC~~,EAAO,KACP,~~SAAAQ~~,EACA,OAAAC,EACA,WAAAC,EACA,SAAUC,EACV,QAAAC,CAAO,~~EACLrB~~,~~EAEEsB~~,EAAWF,~~IAAqBX~~,IAAS,KAAO,GAAK,~~IAErDc~~,EAAUC,EAAO,CAAE,~~QAAAhB~~,EAAS,~~OAAAU~~,EAAQ,~~KAAAT~~,EAAM,~~WAAAU~~,EAAY,SAAU,~~CAACH~~,~~CAAK~~,~~CAAE~~,~~EAExES~~,EAAcC,EAAO,IAAI,EACzBC,~~EAAMZ~~,~~GAAgBU~~,EAEtB,CAAE,YAAAG,CAAa,EAAGC,EACtB,CAAE,~~GAAG7B~~,EAAO,~~WAAYiB~~,GAAY,EAAO,EAC3CU,CAAyC,EAErC,CAAE,WAAAG,CAAU,EAAKC,EAAS,CAAE,WAAYd,GAAY,EAAK,CAAE,EAC3D,CAAE,eAAAe,EAAgB,WAAAC,GAAeC,EAEvC,~~EAAA,~~OAAOC,~~EAAWnC~~,EAAM,~~SAAUoC~~,GAAQ,CACxC,MAAMC,EAAcD,EAAM,~~IAAIvC~~,CAAW,~~EACnCyC~~,EAAeF,EAAM,~~IAAI9B~~,CAAY,~~EACrCiC~~,EAAgBjB,EAAW,EAEjC,~~OACErB~~,YACE,~~UAAWuC~~,EAAGjB,EAAQ,OAAQ,QAAS,~~CAACP~~,~~GAASO~~,EAAQ,cAAeS,GAAkBT,EAAQ,KAAK,EACvG,IAAKI,EAAG,GACJc,EAAWb,EAAaE,EAAYG,CAAU,EACnC,gBAAAhB,EACf,aAAcI,EACd,aAAcA,EAEb,SAAAF,~~EACClB~~,EAACM,GAAW,QAASC,EAAS,KAAMC,CAAQ,CAAA,~~EAE5CiC~~,EAACC,EAAO,CAAA,EAAE,OAAO,IAAK,EAAG,~~QAAS3B~~,~~IAAUqB~~,GAAeC,GAAgB,gBAAkB,SAC1F,SAAA,CAAAD,GAAe,CACd,GAAGA,EACH,MAAO,CACL,GAAGA,EAAY,MACf,UAAYA,EAAY,MAAM,MAAuB,OAAfd,EAAQ,KAC9C,MAAOD,EACP,OAAQA,CACT,CACF,EACAgB,~~GAAgBtB~~,~~GAASE~~,~~GAAUjB~~,~~EAAC2C~~,EAAG,CAAC,EAAGL,CAAiB,CAAA,~~EAC5DvB~~,GAASf,EAAA,OAAA,CAAM,~~UAAWsB~~,EAAQ,~~eAAQP~~,CAAK,CAAA,EAC/~~CqB~~,~~GAAerB~~,~~GAASE~~,~~GAAUjB~~,~~EAAC2C~~,GAAI,EAAGL,CAAiB,CAAA,EAC3DD,GAAgB,CACf,GAAGA,EACH,MAAO,CACL,GAAGA,EAAa,MAChB,UAAYA,EAAa,MAAM,MAAuB,OAAff,EAAQ,KAC/C,MAAOD,EACP,OAAQA,CACT,EACF,CACM,CAAA,CAEJ,CAAA,CAEb,CAAC,CACH,CAAC,EAEKuB,EAAS,OAAO,~~OAAOhC~~,EAAW,CACtC,YAAAhB,EACA,aAAAS,CACD,CAAA,EAEDO,EAAU,YAAc"}
1	+ {"version":3,"file":"button.js","sources":["../../../../src/components/primitives/button.tsx"],"sourcesContent":["import { LoadingSpinner } from '@components/feedback';\nimport { button } from '@recipes/button';\nimport { cx } from '@styled/css';\nimport { Box, Flex, HStack } from '@styled/jsx';\nimport { createHost, createSlot } from 'create-slots';\nimport React, { Children, MouseEventHandler, TouchEventHandler, cloneElement, forwardRef, useRef } from 'react';\nimport { mergeProps, useButton, useFocusRing, useHover, type AriaButtonProps } from 'react-aria';\n\nexport interface ButtonProps extends AriaButtonProps {\n label?: string;\n size?: 'sm' \| 'md' \| 'lg';\n variant?: 'primary' \| 'secondary' \| 'negative' \| 'neutral' \| 'tertiary' \| 'text' \| 'transparent';\n textStyle?: 'negative' \| 'neutral' \| 'subtle';\n disabled?: boolean;\n expand?: boolean;\n validating?: boolean;\n iconSize?: number;\n onHover?: MouseEventHandler<HTMLButtonElement> \| TouchEventHandler<HTMLButtonElement>;\n}\n\nconst LeadingIcon = createSlot(({ children, ...props }) => {\n return (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Flex>\n );\n});\n\nconst TrailingIcon = createSlot(({ children, ...props }) => {\n return (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Flex>\n );\n});\n\nconst Validation = ({ variant = 'primary', size = 'md' }: Partial<ButtonProps>) => {\n const spinnerInverted = variant === 'primary' \|\| variant === 'negative';\n const spinnerNeutral = variant === 'neutral' \|\| variant === 'tertiary';\n const spinnerSizes = {\n sm: 20,\n md: 24,\n lg: 28,\n };\n\n return (\n <LoadingSpinner size={spinnerSizes[size]} strokeWidth={2.5} inverted={spinnerInverted} neutral={spinnerNeutral} />\n );\n};\n\nconst Component = forwardRef<HTMLButtonElement, ButtonProps>((props, forwardedRef) => {\n const {\n label,\n variant = 'primary',\n textStyle,\n size = 'md',\n disabled,\n expand,\n validating,\n iconSize: iconSizeOverride,\n onHover,\n } = props;\n\n const iconSize = iconSizeOverride \|\| (size === 'sm' ? 16 : 24);\n\n const classes = button({ variant, textStyle, expand, size, validating, iconOnly: !label });\n\n const internalRef = useRef(null);\n const ref = forwardedRef \|\| internalRef;\n\n const { buttonProps } = useButton(\n { ...props, isDisabled: disabled ?? false },\n ref as React.RefObject<HTMLButtonElement>,\n );\n const { hoverProps } = useHover({ isDisabled: disabled ?? false });\n const { isFocusVisible, focusProps } = useFocusRing();\n\n return createHost(props.children, slots => {\n const leadingIcon = slots.get(LeadingIcon);\n const trailingIcon = slots.get(TrailingIcon);\n const containerSize = iconSize / 4;\n\n return (\n <button\n className={cx(classes.button, 'group', !label && classes.iconContainer, isFocusVisible && classes.focus)}\n ref={ref}\n {...mergeProps(buttonProps, hoverProps, focusProps)}\n aria-disabled={disabled}\n onMouseEnter={onHover as MouseEventHandler}\n onTouchStart={onHover as TouchEventHandler}\n >\n {validating ? (\n <Validation variant={variant} size={size} />\n ) : (\n <HStack w=\"full\" gap={2} justify={label && (leadingIcon \|\| trailingIcon) ? 'space-between' : 'center'}>\n {leadingIcon && {\n ...leadingIcon,\n props: {\n ...leadingIcon.props,\n className: !leadingIcon.props.color ? classes.icon : undefined,\n width: iconSize,\n height: iconSize,\n },\n }}\n {trailingIcon && label && expand && <Box w={containerSize} />}\n {label && <span className={classes.label}>{label}</span>}\n {leadingIcon && label && expand && <Box w={containerSize} />}\n {trailingIcon && {\n ...trailingIcon,\n props: {\n ...trailingIcon.props,\n className: !trailingIcon.props.color ? classes.icon : undefined,\n width: iconSize,\n height: iconSize,\n },\n }}\n </HStack>\n )}\n </button>\n );\n });\n});\n\nconst Button = Object.assign(Component, {\n LeadingIcon,\n TrailingIcon,\n});\n\nComponent.displayName = 'Button';\n\nexport default Button;\n"],"names":["LeadingIcon","createSlot","children","props","_jsx","Flex","Children","child","cloneElement","TrailingIcon","Validation","variant","size","spinnerInverted","spinnerNeutral","LoadingSpinner","Component","forwardRef","forwardedRef","label","textStyle","disabled","expand","validating","iconSizeOverride","onHover","iconSize","classes","button","internalRef","useRef","ref","buttonProps","useButton","hoverProps","useHover","isFocusVisible","focusProps","useFocusRing","createHost","slots","leadingIcon","trailingIcon","containerSize","cx","mergeProps","_jsxs","HStack","Box","Button"],"mappings":"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"}

package/dist/es/components/primitives/popover.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as l,Fragment as T,jsxs as O}from"react/jsx-runtime";import C from"./button.js";import"./checkbox.js";import"./dropdown-selector.js";import"./radio.js";import"./segmented-control.js";import"./switch.js";import"./text.js";import{useToggleState as $}from"../../hooks/useToggleState.js";import{cx as G}from"@styled/css";import{Center as S}from"@styled/jsx";import{vstack as J}from"@styled/patterns";import{token as Q}from"@styled/tokens";import{createSlot as E,createHost as V}from"create-slots";import{Children as L,cloneElement as A,useMemo as ee,useRef as R,useCallback as k,useEffect as oe}from"react";import{useOverlayTrigger as te,usePopover as re,mergeProps as z,Overlay as ne}from"react-aria";const D="bottom left",F=8,P=E(({children:i})=>l(T,{children:i})),N=E(({children:i,...o})=>l(S,{children:L.map(i,t=>A(t,o))})),X=E(({children:i,...o})=>l(S,{children:L.map(i,t=>A(t,o))})),Y=({children:i,...o})=>V(i,t=>{var h;const{isSelected:w,setSelected:v}=$({isOpen:o.isOpen,defaultSelected:o.defaultOpen,onChange:o.onOpenChange,...o}),a=o.isOpen!==void 0?o.isOpen:w,r=24,n=ee(()=>({isOpen:a,open:()=>{v(!0)},close:()=>{v(!1)},setOpen(e){v(e)},toggle(){}}),[a]),I=t.getProps(P),d=R(null),{triggerProps:H,overlayProps:B}=te({type:"dialog"},n,d),s=R(null),{popoverProps:M,underlayProps:U}=re({placement:D,offset:F,popoverRef:s,triggerRef:d,...I},n),m=z(I,M);!((h=m?.style)===null||h===void 0)&&h.zIndex&&(m.style.zIndex=Q("zIndex.max"));const W=k(()=>{n.open()},[n]),x=k(e=>{var b,y;const c=(b=d.current)===null||b===void 0?void 0:b.getBoundingClientRect(),p=(y=s.current)===null||y===void 0?void 0:y.getBoundingClientRect();if(c&&p){const K=e.clientX>=c.left-r&&e.clientX<=c.right+r&&e.clientY>=c.top-r&&e.clientY<=c.bottom+r,Z=e.clientX>=p.left-r&&e.clientX<=p.right+r&&e.clientY>=p.top-r&&e.clientY<=p.bottom+r;!K&&!Z&&n.close()}},[n]),_=()=>{if(s.current){const e=s.current.querySelectorAll('a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])');e.length>0&&e[0].focus()}},q=e=>{e.key==="Enter"&&(e.preventDefault(),a?n.close():(n.open(),setTimeout(_,0)))};oe(()=>(document.addEventListener("mousemove",x),()=>{document.removeEventListener("mousemove",x)}),[x]);const g=o.size==="sm"?16:24,u=t.get(N),f=t.get(X);return O(T,{children:[O(C,{ref:d,...z(H,o),onHover:W,onKeyDown:q,children:[u&&l(C.LeadingIcon,{children:u&&{...u,props:{...u.props,width:g,height:g}}}),f&&l(C.TrailingIcon,{children:f&&{...f,props:{...f.props,width:g,height:g}}})]}),a&&O(ne,{...B,children:[l("div",{...U,className:"underlay"}),l("div",{ref:s,...m,className:G(J({bg:"surface.primary",p:3,gap:0,color:"text.secondary",borderWidth:1,borderColor:"neutral.secondary",borderRadius:"xl",boxShadow:"0px 4px 20px 0px rgba(0, 0, 0, 0.10)",maxW:52,alignItems:"start"}),m.className),children:t.get(P)})]})]})}),j=Object.assign(Y,{LeadingIcon:N,TrailingIcon:X,Content:P});export{F as DEFAULT_OFFSET,D as DEFAULT_PLACEMENT,j as Popover,Y as PopoverHost,j as default};
+import{jsx as l,Fragment as T,jsxs as O}from"react/jsx-runtime";import C from"./button.js";import"./checkbox.js";import"./dropdown-selector.js";import"./radio.js";import"./segmented-control.js";import"./switch.js";import"./text.js";import{useToggleState as Z}from"../../hooks/useToggleState.js";import{cx as J}from"@styled/css";import{Center as S}from"@styled/jsx";import{vstack as Q}from"@styled/patterns";import{token as V}from"@styled/tokens";import{createSlot as E,createHost as $}from"create-slots";import{Children as L,cloneElement as R,useMemo as ee,useRef as k,useCallback as z,useEffect as oe}from"react";import{useOverlayTrigger as te,usePopover as re,mergeProps as A,Overlay as ne}from"react-aria";const D="bottom left",F=8,P=E(({children:i})=>l(T,{children:i})),N=E(({children:i,...o})=>l(S,{children:L.map(i,t=>R(t,o))})),X=E(({children:i,...o})=>l(S,{children:L.map(i,t=>R(t,o))})),Y=({children:i,...o})=>$(i,t=>{var h;const{isSelected:w,setSelected:v}=Z({isOpen:o.isOpen,defaultSelected:o.defaultOpen,onChange:o.onOpenChange,...o}),a=o.isOpen!==void 0?o.isOpen:w,r=24,n=ee(()=>({isOpen:a,open:()=>{v(!0)},close:()=>{v(!1)},setOpen(e){v(e)},toggle(){}}),[a]),I=t.getProps(P),d=k(null),{triggerProps:H,overlayProps:B}=te({type:"dialog"},n,d),s=k(null),{popoverProps:M,underlayProps:U}=re({placement:D,offset:F,popoverRef:s,triggerRef:d,...I},n),m=A(I,M);!((h=m?.style)===null||h===void 0)&&h.zIndex&&(m.style.zIndex=V("zIndex.max"));const W=z(()=>{n.open()},[n]),x=z(e=>{var b,y;const c=(b=d.current)===null||b===void 0?void 0:b.getBoundingClientRect(),p=(y=s.current)===null||y===void 0?void 0:y.getBoundingClientRect();if(c&&p){const G=e.clientX>=c.left-r&&e.clientX<=c.right+r&&e.clientY>=c.top-r&&e.clientY<=c.bottom+r,K=e.clientX>=p.left-r&&e.clientX<=p.right+r&&e.clientY>=p.top-r&&e.clientY<=p.bottom+r;!G&&!K&&n.close()}},[n]),_=()=>{if(s.current){const e=s.current.querySelectorAll('a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])');e.length>0&&e[0].focus()}},q=e=>{e.key==="Enter"&&(e.preventDefault(),a?n.close():(n.open(),setTimeout(_,0)))};oe(()=>(document.addEventListener("mousemove",x),()=>{document.removeEventListener("mousemove",x)}),[x]);const g=o.size==="sm"?16:24,u=t.get(N),f=t.get(X);return O(T,{children:[O(C,{ref:d,...A(H,o),onHover:W,onKeyDown:q,children:[u&&l(C.LeadingIcon,{children:u&&{...u,props:{...u.props,width:g,height:g}}}),f&&l(C.TrailingIcon,{children:f&&{...f,props:{...f.props,width:g,height:g}}})]}),a&&O(ne,{...B,children:[l("div",{...U,className:"underlay"}),l("div",{ref:s,...m,className:J(Q({bg:"surface.primary",p:3,gap:0,color:"text.secondary",borderWidth:1,borderColor:"neutral.secondary",borderRadius:"xl",boxShadow:"0px 4px 20px 0px rgba(0, 0, 0, 0.10)",maxW:52,alignItems:"start"}),m.className),children:t.get(P)})]})]})}),j=Object.assign(Y,{LeadingIcon:N,TrailingIcon:X,Content:P});export{F as DEFAULT_OFFSET,D as DEFAULT_PLACEMENT,j as Popover,Y as PopoverHost,j as default};
 //# sourceMappingURL=popover.js.map

package/dist/es/recipes/button.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{sva as r}from"@styled/css";const e=r({slots:["button","label","focus","icon","iconContainer"],base:{button:{display:"inline-flex",alignItems:"center",justifyContent:"center",position:"relative",fontWeight:"semibold",boxSizing:"border-box",borderRadius:"button",border:"thin solid",borderColor:"transparent",cursor:"pointer",transition:"all 0.2s ease",outline:"none",willChange:"transform, opacity",bg:"none",_active:{transform:"scale(0.95)"},_disabled:{opacity:"0.3",pointerEvents:"none"},_before:{content:'""',position:"absolute",top:0,left:0,right:0,bottom:0,borderRadius:"inherit",backgroundImage:"linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05))",_dark:{backgroundImage:"linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05))"},opacity:0,transition:"opacity 0.2s ease"},_hover:{_before:{opacity:1}}},label:{display:"flex",textAlign:"center",justifyContent:"center",whiteSpace:"nowrap",transition:"all 0.2s ease"},focus:{outlineColor:"brand.base",outlineStyle:"solid",outlineWidth:"thick",outlineOffset:.5},icon:{transition:"all 0.2s ease"}},variants:{size:{sm:{button:{h:9,py:1.5,px:4},label:{fontSize:"sm",lineHeight:"1.5rem"},iconContainer:{w:9,p:1.5}},md:{button:{h:12,py:3,px:6},label:{fontSize:"md",lineHeight:"1.5rem"},iconContainer:{w:12,p:3}},lg:{button:{h:15,py:4,px:6},label:{fontSize:"lg",lineHeight:"1.75rem"},iconContainer:{w:15,p:4}}},variant:{primary:{button:{bg:"brand.base"},label:{color:"surface.primary"},icon:{color:"surface.primary"}},secondary:{button:{bg:"brand.lightest"},label:{color:"brand.darker"},icon:{color:"brand.darker"}},negative:{button:{bg:"negative.darker"},label:{color:"surface.primary"},icon:{color:"surface.primary"}},neutral:{button:{bg:"neutral.quaternary"},label:{color:"text.primary"},icon:{color:"text.primary"}},tertiary:{button:{bg:"transparent",borderColor:"neutral.primary"},label:{color:"text.primary"},icon:{color:"brand.base"}},text:{button:{p:0,h:"fit-content",_hover:{_before:{opacity:0}}},label:{color:"brand.base",_groupHover:{color:"brand.darkest",_dark:{color:"brand.base"}}},icon:{color:"brand.base",_groupHover:{color:"brand.darkest",_dark:{color:"brand.base"}}}},transparent:{button:{bg:{base:"#ffffff14",_hover:"#ffffff4d"},_dark:{bg:"#ffffff29"},backdropFilter:"blur(3px)",_before:{display:"none"}},label:{color:"chalk"},icon:{color:"chalk"}}},validating:{true:{button:{pointerEvents:"none"}}},expand:{true:{button:{width:"full"}}},iconOnly:{true:{button:{borderRadius:"full"}}}},defaultVariants:{size:"md",variant:"primary"}});export{e as button};
+import{sva as r}from"@styled/css";const e=r({slots:["button","label","focus","icon","iconContainer"],base:{button:{display:"inline-flex",alignItems:"center",justifyContent:"center",position:"relative",fontWeight:"semibold",boxSizing:"border-box",borderRadius:"button",border:"thin solid",borderColor:"transparent",cursor:"pointer",transition:"all 0.1s ease",outline:"none",willChange:"transform, opacity",bg:"none",_active:{transform:"scale(0.95)"},_disabled:{opacity:"0.3",pointerEvents:"none"},_before:{content:'""',position:"absolute",top:0,left:0,right:0,bottom:0,borderRadius:"inherit",backgroundImage:"linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05))",_dark:{backgroundImage:"linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05))"},opacity:0,transition:"opacity 0.1s ease"},_hover:{_before:{opacity:1}}},label:{display:"flex",textAlign:"center",justifyContent:"center",whiteSpace:"nowrap",transition:"all 0.1s ease"},focus:{outlineColor:"brand.base",outlineStyle:"solid",outlineWidth:"thick",outlineOffset:.5},icon:{transition:"all 0.1s ease"}},variants:{size:{sm:{button:{h:9,py:1.5,px:4},label:{fontSize:"sm",lineHeight:"1.5rem"},iconContainer:{w:9,p:1.5}},md:{button:{h:12,py:3,px:6},label:{fontSize:"md",lineHeight:"1.5rem"},iconContainer:{w:12,p:3}},lg:{button:{h:15,py:4,px:6},label:{fontSize:"lg",lineHeight:"1.75rem"},iconContainer:{w:15,p:4}}},variant:{primary:{button:{bg:"brand.base"},label:{color:"surface.primary"},icon:{color:"surface.primary"}},secondary:{button:{bg:"brand.lightest"},label:{color:"brand.darker"},icon:{color:"brand.darker"}},negative:{button:{bg:"negative.darker"},label:{color:"surface.primary"},icon:{color:"surface.primary"}},neutral:{button:{bg:"neutral.quaternary"},label:{color:"text.primary"},icon:{color:"text.primary"}},tertiary:{button:{bg:"transparent",borderColor:"neutral.primary"},label:{color:"text.primary"},icon:{color:"brand.base"}},text:{button:{p:0,h:"fit-content",_hover:{_before:{opacity:0}}},label:{color:"brand.base",_groupHover:{color:"brand.darkest",_dark:{color:"brand.lighter"}}},icon:{color:"brand.base",_groupHover:{color:"brand.darkest",_dark:{color:"brand.lighter"}}}},transparent:{button:{bg:{base:"#ffffff14",_hover:"#ffffff4d"},_dark:{bg:"#ffffff29"},backdropFilter:"blur(3px)",_before:{display:"none"}},label:{color:"chalk"},icon:{color:"chalk"}}},validating:{true:{button:{pointerEvents:"none"}}},expand:{true:{button:{width:"full"}}},iconOnly:{true:{button:{borderRadius:"full"}}},textStyle:{negative:{},neutral:{},subtle:{}}},compoundVariants:[{variant:"text",textStyle:"negative",css:{label:{color:"negative.darker",_groupHover:{color:"negative.darkest",_dark:{color:"ruby.70"}}},icon:{color:"negative.darker",_groupHover:{color:"negative.darkest",_dark:{color:"ruby.70"}}}}},{variant:"text",textStyle:"neutral",css:{label:{color:"text.primary",_groupHover:{color:"text.secondary",_dark:{color:"text.secondary"}}},icon:{color:"text.primary",_groupHover:{color:"text.secondary",_dark:{color:"text.secondary"}}}}},{variant:"text",textStyle:"subtle",css:{label:{color:"text.tertiary",_groupHover:{color:"text.secondary",_dark:{color:"text.secondary"}}},icon:{color:"text.tertiary",_groupHover:{color:"text.secondary",_dark:{color:"text.secondary"}}}}}],defaultVariants:{size:"md",variant:"primary"}});export{e as button};
 //# sourceMappingURL=button.js.map

package/dist/es/recipes/button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"button.js","sources":["../../../src/recipes/button.ts"],"sourcesContent":["import { sva } from '@styled/css';\n\nexport const button = sva({\n slots: ['button', 'label', 'focus', 'icon', 'iconContainer'],\n base: {\n button: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n fontWeight: 'semibold',\n boxSizing: 'border-box',\n borderRadius: 'button',\n border: 'thin solid',\n borderColor: 'transparent',\n cursor: 'pointer',\n transition: 'all 0.2s ease',\n outline: 'none',\n willChange: 'transform, opacity',\n bg: 'none',\n _active: { transform: 'scale(0.95)' },\n _disabled: { opacity: '0.3', pointerEvents: 'none' },\n _before: {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n borderRadius: 'inherit',\n backgroundImage: 'linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05))',\n _dark: { backgroundImage: `linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05))` },\n opacity: 0,\n transition: 'opacity 0.2s ease',\n },\n _hover: {\n _before: {\n opacity: 1,\n },\n },\n },\n label: {\n display: 'flex',\n textAlign: 'center',\n justifyContent: 'center',\n whiteSpace: 'nowrap',\n transition: 'all 0.2s ease',\n },\n focus: {\n outlineColor: 'brand.base',\n outlineStyle: 'solid',\n outlineWidth: 'thick',\n outlineOffset: 0.5,\n },\n icon: {\n transition: 'all 0.2s ease',\n },\n },\n variants: {\n size: {\n sm: {\n button: {\n h: 9,\n py: 1.5,\n px: 4,\n },\n label: {\n fontSize: 'sm',\n lineHeight: '1.5rem',\n },\n iconContainer: {\n w: 9,\n p: 1.5,\n },\n },\n md: {\n button: {\n h: 12,\n py: 3,\n px: 6,\n },\n label: {\n fontSize: 'md',\n lineHeight: '1.5rem',\n },\n iconContainer: {\n w: 12,\n p: 3,\n },\n },\n lg: {\n button: {\n h: 15,\n py: 4,\n px: 6,\n },\n label: {\n fontSize: 'lg',\n lineHeight: '1.75rem',\n },\n iconContainer: {\n w: 15,\n p: 4,\n },\n },\n },\n variant: {\n primary: {\n button: {\n bg: 'brand.base',\n },\n label: {\n color: 'surface.primary',\n },\n icon: {\n color: 'surface.primary',\n },\n },\n secondary: {\n button: {\n bg: 'brand.lightest',\n },\n label: {\n color: 'brand.darker',\n },\n icon: {\n color: 'brand.darker',\n },\n },\n negative: {\n button: {\n bg: 'negative.darker',\n },\n label: {\n color: 'surface.primary',\n },\n icon: {\n color: 'surface.primary',\n },\n },\n neutral: {\n button: {\n bg: 'neutral.quaternary',\n },\n label: {\n color: 'text.primary',\n },\n icon: {\n color: 'text.primary',\n },\n },\n tertiary: {\n button: {\n bg: 'transparent',\n borderColor: 'neutral.primary',\n },\n label: {\n color: 'text.primary',\n },\n icon: {\n color: 'brand.base',\n },\n },\n text: {\n button: {\n p: 0,\n h: 'fit-content',\n _hover: {\n _before: {\n opacity: 0,\n },\n },\n },\n label: {\n color: 'brand.base',\n _groupHover: {\n color: 'brand.darkest',\n _dark: {\n color: 'brand.~~base~~',\n },\n },\n },\n icon: {\n color: 'brand.base',\n _groupHover: {\n color: 'brand.darkest',\n _dark: {\n color: 'brand.~~base~~',\n },\n },\n },\n },\n transparent: {\n button: {\n bg: { base: '#ffffff14', _hover: '#ffffff4d' },\n _dark: { bg: '#ffffff29' },\n backdropFilter: 'blur(3px)',\n _before: { display: 'none' },\n },\n label: {\n color: 'chalk',\n },\n icon: {\n color: 'chalk',\n },\n },\n },\n validating: {\n true: {\n button: {\n pointerEvents: 'none',\n },\n },\n },\n expand: {\n true: {\n button: {\n width: 'full',\n },\n },\n },\n iconOnly: {\n true: {\n button: {\n borderRadius: 'full',\n },\n },\n },\n },\n defaultVariants: {\n size: 'md',\n variant: 'primary',\n },\n});\n"],"names":["button","sva"],"mappings":"kCAEO,MAAMA,EAASC,EAAI,CACxB,MAAO,CAAC,SAAU,QAAS,QAAS,OAAQ,eAAe,EAC3D,KAAM,CACJ,OAAQ,CACN,QAAS,cACT,WAAY,SACZ,eAAgB,SAChB,SAAU,WACV,WAAY,WACZ,UAAW,aACX,aAAc,SACd,OAAQ,aACR,YAAa,cACb,OAAQ,UACR,WAAY,gBACZ,QAAS,OACT,WAAY,qBACZ,GAAI,OACJ,QAAS,CAAE,UAAW,aAAe,EACrC,UAAW,CAAE,QAAS,MAAO,cAAe,MAAQ,EACpD,QAAS,CACP,QAAS,KACT,SAAU,WACV,IAAK,EACL,KAAM,EACN,MAAO,EACP,OAAQ,EACR,aAAc,UACd,gBAAiB,4DACjB,MAAO,CAAE,gBAAiB,uEAAyE,EACnG,QAAS,EACT,WAAY,mBACb,EACD,OAAQ,CACN,QAAS,CACP,QAAS,CACV,CACF,CACF,EACD,MAAO,CACL,QAAS,OACT,UAAW,SACX,eAAgB,SAChB,WAAY,SACZ,WAAY,eACb,EACD,MAAO,CACL,aAAc,aACd,aAAc,QACd,aAAc,QACd,cAAe,EAChB,EACD,KAAM,CACJ,WAAY,eACb,CACF,EACD,SAAU,CACR,KAAM,CACJ,GAAI,CACF,OAAQ,CACN,EAAG,EACH,GAAI,IACJ,GAAI,CACL,EACD,MAAO,CACL,SAAU,KACV,WAAY,QACb,EACD,cAAe,CACb,EAAG,EACH,EAAG,GACJ,CACF,EACD,GAAI,CACF,OAAQ,CACN,EAAG,GACH,GAAI,EACJ,GAAI,CACL,EACD,MAAO,CACL,SAAU,KACV,WAAY,QACb,EACD,cAAe,CACb,EAAG,GACH,EAAG,CACJ,CACF,EACD,GAAI,CACF,OAAQ,CACN,EAAG,GACH,GAAI,EACJ,GAAI,CACL,EACD,MAAO,CACL,SAAU,KACV,WAAY,SACb,EACD,cAAe,CACb,EAAG,GACH,EAAG,CACJ,CACF,CACF,EACD,QAAS,CACP,QAAS,CACP,OAAQ,CACN,GAAI,YACL,EACD,MAAO,CACL,MAAO,iBACR,EACD,KAAM,CACJ,MAAO,iBACR,CACF,EACD,UAAW,CACT,OAAQ,CACN,GAAI,gBACL,EACD,MAAO,CACL,MAAO,cACR,EACD,KAAM,CACJ,MAAO,cACR,CACF,EACD,SAAU,CACR,OAAQ,CACN,GAAI,iBACL,EACD,MAAO,CACL,MAAO,iBACR,EACD,KAAM,CACJ,MAAO,iBACR,CACF,EACD,QAAS,CACP,OAAQ,CACN,GAAI,oBACL,EACD,MAAO,CACL,MAAO,cACR,EACD,KAAM,CACJ,MAAO,cACR,CACF,EACD,SAAU,CACR,OAAQ,CACN,GAAI,cACJ,YAAa,iBACd,EACD,MAAO,CACL,MAAO,cACR,EACD,KAAM,CACJ,MAAO,YACR,CACF,EACD,KAAM,CACJ,OAAQ,CACN,EAAG,EACH,EAAG,cACH,OAAQ,CACN,QAAS,CACP,QAAS,CACV,CACF,CACF,EACD,MAAO,CACL,MAAO,aACP,YAAa,CACX,MAAO,gBACP,MAAO,CACL,MAAO,~~YACR~~,CACF,CACF,EACD,KAAM,CACJ,MAAO,aACP,YAAa,CACX,MAAO,gBACP,MAAO,CACL,MAAO,~~YACR~~,CACF,CACF,CACF,EACD,YAAa,CACX,OAAQ,CACN,GAAI,CAAE,KAAM,YAAa,OAAQ,WAAa,EAC9C,MAAO,CAAE,GAAI,WAAa,EAC1B,eAAgB,YAChB,QAAS,CAAE,QAAS,MAAQ,CAC7B,EACD,MAAO,CACL,MAAO,OACR,EACD,KAAM,CACJ,MAAO,OACR,CACF,CACF,EACD,WAAY,CACV,KAAM,CACJ,OAAQ,CACN,cAAe,MAChB,CACF,CACF,EACD,OAAQ,CACN,KAAM,CACJ,OAAQ,CACN,MAAO,MACR,CACF,CACF,EACD,SAAU,CACR,KAAM,CACJ,OAAQ,CACN,aAAc,MACf,CACF,CACF,CACF,EACD,gBAAiB,CACf,KAAM,KACN,QAAS,SACV,CACF,CAAA"}
1	+ {"version":3,"file":"button.js","sources":["../../../src/recipes/button.ts"],"sourcesContent":["import { sva } from '@styled/css';\n\nexport const button = sva({\n slots: ['button', 'label', 'focus', 'icon', 'iconContainer'],\n base: {\n button: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n fontWeight: 'semibold',\n boxSizing: 'border-box',\n borderRadius: 'button',\n border: 'thin solid',\n borderColor: 'transparent',\n cursor: 'pointer',\n transition: 'all 0.1s ease',\n outline: 'none',\n willChange: 'transform, opacity',\n bg: 'none',\n _active: { transform: 'scale(0.95)' },\n _disabled: { opacity: '0.3', pointerEvents: 'none' },\n _before: {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n borderRadius: 'inherit',\n backgroundImage: 'linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05))',\n _dark: { backgroundImage: `linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05))` },\n opacity: 0,\n transition: 'opacity 0.1s ease',\n },\n _hover: {\n _before: {\n opacity: 1,\n },\n },\n },\n label: {\n display: 'flex',\n textAlign: 'center',\n justifyContent: 'center',\n whiteSpace: 'nowrap',\n transition: 'all 0.1s ease',\n },\n focus: {\n outlineColor: 'brand.base',\n outlineStyle: 'solid',\n outlineWidth: 'thick',\n outlineOffset: 0.5,\n },\n icon: {\n transition: 'all 0.1s ease',\n },\n },\n variants: {\n size: {\n sm: {\n button: {\n h: 9,\n py: 1.5,\n px: 4,\n },\n label: {\n fontSize: 'sm',\n lineHeight: '1.5rem',\n },\n iconContainer: {\n w: 9,\n p: 1.5,\n },\n },\n md: {\n button: {\n h: 12,\n py: 3,\n px: 6,\n },\n label: {\n fontSize: 'md',\n lineHeight: '1.5rem',\n },\n iconContainer: {\n w: 12,\n p: 3,\n },\n },\n lg: {\n button: {\n h: 15,\n py: 4,\n px: 6,\n },\n label: {\n fontSize: 'lg',\n lineHeight: '1.75rem',\n },\n iconContainer: {\n w: 15,\n p: 4,\n },\n },\n },\n variant: {\n primary: {\n button: {\n bg: 'brand.base',\n },\n label: {\n color: 'surface.primary',\n },\n icon: {\n color: 'surface.primary',\n },\n },\n secondary: {\n button: {\n bg: 'brand.lightest',\n },\n label: {\n color: 'brand.darker',\n },\n icon: {\n color: 'brand.darker',\n },\n },\n negative: {\n button: {\n bg: 'negative.darker',\n },\n label: {\n color: 'surface.primary',\n },\n icon: {\n color: 'surface.primary',\n },\n },\n neutral: {\n button: {\n bg: 'neutral.quaternary',\n },\n label: {\n color: 'text.primary',\n },\n icon: {\n color: 'text.primary',\n },\n },\n tertiary: {\n button: {\n bg: 'transparent',\n borderColor: 'neutral.primary',\n },\n label: {\n color: 'text.primary',\n },\n icon: {\n color: 'brand.base',\n },\n },\n text: {\n button: {\n p: 0,\n h: 'fit-content',\n _hover: {\n _before: {\n opacity: 0,\n },\n },\n },\n label: {\n color: 'brand.base',\n _groupHover: {\n color: 'brand.darkest',\n _dark: {\n color: 'brand.lighter',\n },\n },\n },\n icon: {\n color: 'brand.base',\n _groupHover: {\n color: 'brand.darkest',\n _dark: {\n color: 'brand.lighter',\n },\n },\n },\n },\n transparent: {\n button: {\n bg: { base: '#ffffff14', _hover: '#ffffff4d' },\n _dark: { bg: '#ffffff29' },\n backdropFilter: 'blur(3px)',\n _before: { display: 'none' },\n },\n label: {\n color: 'chalk',\n },\n icon: {\n color: 'chalk',\n },\n },\n },\n validating: {\n true: {\n button: {\n pointerEvents: 'none',\n },\n },\n },\n expand: {\n true: {\n button: {\n width: 'full',\n },\n },\n },\n iconOnly: {\n true: {\n button: {\n borderRadius: 'full',\n },\n },\n },\n textStyle: {\n negative: {},\n neutral: {},\n subtle: {},\n },\n },\n compoundVariants: [\n {\n variant: 'text',\n textStyle: 'negative',\n css: {\n label: {\n color: 'negative.darker',\n _groupHover: {\n color: 'negative.darkest',\n _dark: {\n color: 'ruby.70',\n },\n },\n },\n icon: {\n color: 'negative.darker',\n _groupHover: {\n color: 'negative.darkest',\n _dark: {\n color: 'ruby.70',\n },\n },\n },\n },\n },\n {\n variant: 'text',\n textStyle: 'neutral',\n css: {\n label: {\n color: 'text.primary',\n _groupHover: {\n color: 'text.secondary',\n _dark: { color: 'text.secondary' },\n },\n },\n icon: {\n color: 'text.primary',\n _groupHover: {\n color: 'text.secondary',\n _dark: { color: 'text.secondary' },\n },\n },\n },\n },\n {\n variant: 'text',\n textStyle: 'subtle',\n css: {\n label: {\n color: 'text.tertiary',\n _groupHover: {\n color: 'text.secondary',\n _dark: { color: 'text.secondary' },\n },\n },\n icon: {\n color: 'text.tertiary',\n _groupHover: {\n color: 'text.secondary',\n _dark: { color: 'text.secondary' },\n },\n },\n },\n },\n ],\n defaultVariants: {\n size: 'md',\n variant: 'primary',\n },\n});\n"],"names":["button","sva"],"mappings":"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"}

package/dist/panda.buildinfo.json CHANGED Viewed

	@@ -1 +1 @@
1	- {"schemaVersion":"0.40.1","styles":{"atomic":["display]___[value:inline-flex","alignItems]___[value:center","justifyContent]___[value:center","position]___[value:relative","fontWeight]___[value:semibold","boxSizing]___[value:border-box","borderRadius]___[value:button","border]___[value:thin solid","borderColor]___[value:transparent","cursor]___[value:pointer","transition]___[value:all 0.2s ease","outline]___[value:none","willChange]___[value:transform, opacity","background]___[value:none","transform]___[value:scale(0.95)]___[cond:_active","opacity]___[value:0.3]___[cond:_disabled","pointerEvents]___[value:none]___[cond:_disabled","content]___[value:\"\"]___[cond:_before","position]___[value:absolute]___[cond:_before","top]___[value:0]___[cond:_before","left]___[value:0]___[cond:_before","right]___[value:0]___[cond:_before","bottom]___[value:0]___[cond:_before","borderRadius]___[value:inherit]___[cond:_before","backgroundImage]___[value:linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05))]___[cond:_before","backgroundImage]___[value:linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05))]___[cond:_before<___>_dark","opacity]___[value:0]___[cond:_before","transition]___[value:opacity 0.2s ease]___[cond:_before","opacity]___[value:1]___[cond:_hover<___>_before","height]___[value:9","paddingBlock]___[value:1.5","paddingInline]___[value:4","height]___[value:12","paddingBlock]___[value:3","paddingInline]___[value:6","height]___[value:15","paddingBlock]___[value:4","background]___[value:brand.base","background]___[value:brand.lightest","background]___[value:negative.darker","background]___[value:neutral.quaternary","background]___[value:transparent","borderColor]___[value:neutral.primary","padding]___[value:0","height]___[value:fit-content","opacity]___[value:0]___[cond:_hover<___>_before","background]___[value:#ffffff14","background]___[value:#ffffff4d]___[cond:_hover","background]___[value:#ffffff29]___[cond:_dark","backdropFilter]___[value:blur(3px)","display]___[value:none]___[cond:_before","pointerEvents]___[value:none","width]___[value:full","borderRadius]___[value:full","display]___[value:flex","textAlign]___[value:center","whiteSpace]___[value:nowrap","fontSize]___[value:sm","lineHeight]___[value:1.5rem","fontSize]___[value:md","fontSize]___[value:lg","lineHeight]___[value:1.75rem","color]___[value:surface.primary","color]___[value:brand.darker","color]___[value:text.primary","color]___[value:brand.base","color]___[value:brand.darkest]___[cond:_groupHover","color]___[value:brand.base]___[cond:_groupHover<___>_dark","color]___[value:chalk","outlineColor]___[value:brand.base","outlineStyle]___[value:solid","outlineWidth]___[value:thick","outlineOffset]___[value:0.5","width]___[value:9","padding]___[value:1.5","width]___[value:12","padding]___[value:3","width]___[value:15","padding]___[value:4","borderRadius]___[value:10","outlineColor]___[value:brand.lightest]___[cond:_focusVisible","background]___[value:positive.lightest","outlineColor]___[value:positive.lightest]___[cond:_focusVisible","background]___[value:negative.lightest","outlineColor]___[value:negative.lightest]___[cond:_focusVisible","background]___[value:warning.lightest","outlineColor]___[value:warning.lightest]___[cond:_focusVisible","background]___[value:surface.secondary","outlineColor]___[value:surface.secondary]___[cond:_focusVisible","transition]___[value:transform 0.2s ease, opacity 0.2s ease","opacity]___[value:0.8]___[cond:_hover","outlineStyle]___[value:solid]___[cond:_focusVisible","outlineWidth]___[value:thick]___[cond:_focusVisible","outlineOffset]___[value:0.5]___[cond:_focusVisible","animationFillMode]___[value:forwards","animationName]___[value:scaleOut","animationDuration]___[value:150ms","scale]___[value:1]___[cond:_motionReduce","color]___[value:brand.darkest","color]___[value:positive.darkest","color]___[value:negative.darkest","color]___[value:warning.darkest","color]___[value:text.secondary","textTransform]___[value:uppercase","fontSize]___[value:xs","letterSpacing]___[value:0.06rem","marginLeft]___[value:7","marginRight]___[value:7","outlineColor]___[value:brand.base]___[cond:_focusVisible","borderRadius]___[value:2]___[cond:_focusVisible","height]___[value:full","background]___[value:surface.primary","overflow]___[value:auto","scrollbarWidth]___[value:none","top]___[value:12]___[cond:@media (min-width: 48rem)","marginInline]___[value:auto]___[cond:@media (min-width: 48rem)","width]___[value:25rem]___[cond:@media (min-width: 48rem)","height]___[value:fit-content]___[cond:@media (min-width: 48rem)","boxShadow]___[value:0px 12px 56px {colors.ink.70/15}]___[cond:@media (min-width: 48rem)","borderRadius]___[value:container]___[cond:@media (min-width: 48rem)","boxShadow]___[value:none]___[cond:@media (min-width: 48rem)<___>_dark","animationName]___[value:none","scale]___[value:1","padding]___[value:2","paddingBottom]___[value:0","padding]___[value:8","borderWidth]___[value:1]___[cond:@media (min-width: 48rem)<___>_dark","borderBlock]___[value:solid]___[cond:@media (min-width: 48rem)<___>_dark","borderColor]___[value:neutral.secondary]___[cond:@media (min-width: 48rem)<___>_dark","animationName]___[value:scaleIn","animationDuration]___[value:250ms","pointerEvents]___[value:all","position]___[value:fixed","top]___[value:0","left]___[value:0","backdropBlur]___[value:0.375rem","backdropFilter]___[value:auto","backgroundColor]___[value:surface.primary/70","backgroundColor]___[value:surface.tertiary","animationName]___[value:fadeIn","animationDuration]___[value:400ms","animationName]___[value:fadeOut","height]___[value:100vh","width]___[value:100vw","maxWidth]___[value:100rem","margin]___[value:0 auto","alignItems]___[value:flex-start","alignItems]___[value:flex-end","opacity]___[value:0.3","fontWeight]___[value:medium","backgroundColor]___[value:transparent","borderStyle]___[value:solid","borderWidth]___[value:thin","borderColor]___[value:neutral.secondary","borderRadius]___[value:input","transition]___[value:all linear 120ms","width]___[value:100%","borderColor]___[value:neutral.primary]___[cond:_hover","outlineColor]___[value:brand.base]___[cond:_focusWithin","outlineStyle]___[value:solid]___[cond:_focusWithin","outlineWidth]___[value:thick]___[cond:_focusWithin","outlineOffset]___[value:0.5]___[cond:_focusWithin","height]___[value:10","borderColor]___[value:negative.base","paddingBlock]___[value:2","borderColor]___[value:neutral.secondary]___[cond:_hover","margin]___[value:0","minWidth]___[value:10","fontWeight]___[value:normal","color]___[value:text.tertiary]___[cond:_placeholder","borderColor]___[value:neutral.primary]___[cond:_groupHover","textAlign]___[value:left","textAlign]___[value:right","fontSize]___[value:xl","transition]___[value:opacity linear 120ms","color]___[value:negative.darker","color]___[value:positive.base","color]___[value:warning.base","textStyle]___[value:body-xs","textStyle]___[value:body-sm","textStyle]___[value:body-md","textStyle]___[value:body-lg","textStyle]___[value:body-sm-scaled","textStyle]___[value:body-md-scaled","textStyle]___[value:body-lg-scaled","textStyle]___[value:mono-sm","textStyle]___[value:mono-md","textStyle]___[value:mono-lg","padding]___[value:20px","justifyContent]___[value:flex-start","justifyContent]___[value:flex-end","zIndex]___[value:max","boxShadow]___[value:4px 8px 20px 0px rgba(0, 0, 0, 0.15)","backgroundColor]___[value:brand.base","backgroundColor]___[value:positive.darker","backgroundColor]___[value:warning.darker","backgroundColor]___[value:negative.darker","backgroundColor]___[value:text.tertiary","backgroundColor]___[value:text.secondary]___[cond:_dark","height]___[value:1rem","width]___[value:1rem","background]___[value:linear-gradient(#00CC8F, #6851FF)","inset]___[value:0","display]___[value:grid","gridTemplateColumns]___[value:repeat(6, minmax(0, 1fr))","columnGap]___[value:2rem","rowGap]___[value:2rem","marginTop]___[value:6","gap]___[value:10px","flexDirection]___[value:column","fill]___[value:white","truncate]___[value:true","flexShrink]___[value:0","paddingTop]___[value:6","paddingInline]___[value:8","display]___[value:block","display]___[value:none","position]___[value:absolute","bottom]___[value:0","right]___[value:0","background]___[value:text.primary/20","transform]___[value:translateY(0)","transform]___[value:translateY(100%)","transition]___[value:transform 0.3s","borderRadius]___[value:xl","boxShadow]___[value:0px -12px 56px 0px rgba(119, 118, 122, 0.15)","paddingBottom]___[value:8","justifyContent]___[value:space-between","flexDirection]___[value:row","padding]___[value:6","paddingBottom]___[value:5","minWidth]___[value:8]___[cond:& ><___>_first","minWidth]___[value:8]___[cond:& ><___>_last","outlineStyle]___[value:none","background]___[value:#ffc439","outlineColor]___[value:#ffc439","strokeWidth]___[value:2.5","gap]___[value:1","marginTop]___[value:0.5","width]___[value:60","gap]___[value:1.5","stroke]___[value:text.primary","stroke]___[value:brand.base","stroke]___[value:surface.primary","strokeOpacity]___[value:0.12","animation]___[value:spin 1s linear infinite","transformOrigin]___[value:center center","maxWidth]___[value:72","width]___[value:max","backgroundColor]___[value:surface.primary","paddingInline]___[value:3","boxShadow]___[value:0px 4px 20px 0px rgba(0, 0, 0, 0.10)","left]___[value:50%","transform]___[value:translateX(-50%) translateY(calc(-100% - 0.75rem))","width]___[value:72","height]___[value:4","transform]___[value:translateX(-50%) translateY(0.75rem)","overflowWrap]___[value:break-word","wordBreak]___[value:break-word","fontWeight]___[value:600","justifyContent]___[value:space-around","borderRadius]___[value:lg","minWidth]___[value:15rem","width]___[value:40%","borderLeft]___[value:thin solid","borderColor]___[value:neutral.tertiary","height]___[value:8","filter]___[value:blur(10px)","textWrap]___[value:nowrap","overflow]___[value:hidden","textOverflow]___[value:ellipsis","zIndex]___[value:10","gap]___[value:2","width]___[value:20","height]___[value:20","color]___[value:positive.darker","color]___[value:text.tertiary","outlineOffset]___[value:1","fontVariant]___[value:no-contextual","width]___[value:1.125rem","height]___[value:1.125rem","objectFit]___[value:cover","borderStartRadius]___[value:input","background]___[value:surface.tertiary]___[cond:_hover","borderLeftWidth]___[value:thin","borderRadius]___[value:0","background]___[value:brand.lightest]___[cond:_hover","gap]___[value:4","transform]___[value:rotate(180)","width]___[value:14","height]___[value:14","top]___[value:55","maxHeight]___[value:17.5rem","overflowY]___[value:auto","width]___[value:18","height]___[value:18","minWidth]___[value:0","maxWidth]___[value:30rem","caretColor]___[value:transparent","borderRadius]___[value:0.5rem","marginBlock]___[value:4","maxWidth]___[value:8xl","marginInline]___[value:auto","paddingInline]___[value:6]___[cond:md","paddingInline]___[value:8]___[cond:lg","overlay]___[value:true","gap]___[value:0","marginTop]___[value:8","marginTop]___[value:4","transition]___[value:background-color 0.2s","background]___[value:neutral.secondary]___[cond:_hover","color]___[value:neutral.primary","borderRadius]___[value:2xl","boxShadow]___[value:0 6px 8px 2px rgba(0, 0, 0, .18)]___[cond:_hover","width]___[value:30","height]___[value:30","minHeight]___[value:20","opacity]___[value:1","borderRadius]___[value:sm","borderColor]___[value:brand.base","borderColor]___[value:text.tertiary","pointerEvents]___[value:auto","outlineColor]___[value:transparent","width]___[value:5","height]___[value:5","borderWidth]___[value:thick","transition]___[value:background-color 0.2s ease, border-color 0.2s ease","cursor]___[value:pointer]___[cond:_hover","borderColor]___[value:brand.base]___[cond:_hover","width]___[value:2.5","height]___[value:0.5","marginLeft]___[value:3","srOnly]___[value:true","height]___[value:16","width]___[value:16","width]___[value:4","alignItems]___[value:start","borderWidth]___[value:1","maxWidth]___[value:52","gap]___[value:5","gap]___[value:10","transition]___[value:border-color 0.2s ease","width]___[value:6","height]___[value:6","flex]___[value:0 0 auto","width]___[value:3","height]___[value:3","borderRadius]___[value:9999px","padding]___[value:1","background]___[value:ink.10","background]___[value:slate.2]___[cond:_dark","opacity]___[value:0.5","background]___[value:paper","background]___[value:slate.4]___[cond:_dark","boxShadow]___[value:0px 4px 20px 0px {colors.ink.90/10}","transition]___[value:transform 0.2s ease","borderRadius]___[value:inherit","marginLeft]___[value:-1","height]___[value:13","transition]___[value:background 0s","transition]___[value:background 0.2s ease","background]___[value:transparent]___[cond:_hover","background]___[value:ink.20]___[cond:_hover","background]___[value:transparent]___[cond:_hover<___>_dark","background]___[value:slate.1]___[cond:_hover<___>_dark","zIndex]___[value:0","marginRight]___[value:1","marginRight]___[value:2","background]___[value:neutral.primary","background]___[value:ink.70]___[cond:_hover","background]___[value:brand.base]___[cond:_hover","background]___[value:slate.4]___[cond:_hover<___>_dark","background]___[value:brand.base]___[cond:_hover<___>_dark","paddingInline]___[value:0.5","width]___[value:11","transition]___[value:background-color 0.2s ease","left]___[value:6","transition]___[value:left 0.2s ease","textStyle]___[value:h1-scaled","textStyle]___[value:h1","textStyle]___[value:h2-scaled","textStyle]___[value:h2","textStyle]___[value:h3-scaled","textStyle]___[value:h3","textStyle]___[value:h4-scaled","textStyle]___[value:h4","textStyle]___[value:h5-scaled","textStyle]___[value:h5","textStyle]___[value:h6-scaled","textStyle]___[value:h6","truncate]___[value:false","strokeWidth]___[value:4","width]___[value:36","height]___[value:36","gap]___[value:3","marginBlock]___[value:3","height]___[value:2.625rem","width]___[value:2.625rem","boxShadow]___[value:0.125rem 0.125rem 1.5rem {colors.ink.70/15}","borderRadius]___[value:1rem","fill]___[value:ink.50","fill]___[value:ink.70]___[cond:_dark","fill]___[value:url(\"#logo-gradient\")]___[cond:_hover","fill]___[value:url(\"#logo-gradient\")]___[cond:_active","fill]___[value:url(\"#logo-gradient\")]___[cond:_focus","color]___[value:text.tertiary]___[cond:_groupHover","color]___[value:ink.50","color]___[value:ink.70]___[cond:_dark","cursor]___[value:default","backgroundColor]___[value:magic.10","animation]___[value:fadeIn 0.5s, moveRight 1s 0.5s forwards","borderRadius]___[value:50%","borderWidth]___[value:3px","borderColor]___[value:surface.primary","height]___[value:3.875rem","width]___[value:3.875rem","marginTop]___[value:-3px","marginRight]___[value:0.9rem","zIndex]___[value:1","marginLeft]___[value:0.9rem","animation]___[value:fadeIn 0.5s, moveLeft 1s 0.5s forwards","height]___[value:34","width]___[value:34","height]___[value:56","width]___[value:56","marginBlock]___[value:10","height]___[value:250","color]___[value:ink.70","gridTemplateColumns]___[value:2","fontWeight]___[value:bold","gap]___[value:8","width]___[value:40","height]___[value:40"],"recipes":{}}}
1	+ {"schemaVersion":"0.40.1","styles":{"atomic":["display]___[value:inline-flex","alignItems]___[value:center","justifyContent]___[value:center","position]___[value:relative","fontWeight]___[value:semibold","boxSizing]___[value:border-box","borderRadius]___[value:button","border]___[value:thin solid","borderColor]___[value:transparent","cursor]___[value:pointer","transition]___[value:all 0.1s ease","outline]___[value:none","willChange]___[value:transform, opacity","background]___[value:none","transform]___[value:scale(0.95)]___[cond:_active","opacity]___[value:0.3]___[cond:_disabled","pointerEvents]___[value:none]___[cond:_disabled","content]___[value:\"\"]___[cond:_before","position]___[value:absolute]___[cond:_before","top]___[value:0]___[cond:_before","left]___[value:0]___[cond:_before","right]___[value:0]___[cond:_before","bottom]___[value:0]___[cond:_before","borderRadius]___[value:inherit]___[cond:_before","backgroundImage]___[value:linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05))]___[cond:_before","backgroundImage]___[value:linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05))]___[cond:_before<___>_dark","opacity]___[value:0]___[cond:_before","transition]___[value:opacity 0.1s ease]___[cond:_before","opacity]___[value:1]___[cond:_hover<___>_before","height]___[value:9","paddingBlock]___[value:1.5","paddingInline]___[value:4","height]___[value:12","paddingBlock]___[value:3","paddingInline]___[value:6","height]___[value:15","paddingBlock]___[value:4","background]___[value:brand.base","background]___[value:brand.lightest","background]___[value:negative.darker","background]___[value:neutral.quaternary","background]___[value:transparent","borderColor]___[value:neutral.primary","padding]___[value:0","height]___[value:fit-content","opacity]___[value:0]___[cond:_hover<___>_before","background]___[value:#ffffff14","background]___[value:#ffffff4d]___[cond:_hover","background]___[value:#ffffff29]___[cond:_dark","backdropFilter]___[value:blur(3px)","display]___[value:none]___[cond:_before","pointerEvents]___[value:none","width]___[value:full","borderRadius]___[value:full","display]___[value:flex","textAlign]___[value:center","whiteSpace]___[value:nowrap","fontSize]___[value:sm","lineHeight]___[value:1.5rem","fontSize]___[value:md","fontSize]___[value:lg","lineHeight]___[value:1.75rem","color]___[value:surface.primary","color]___[value:brand.darker","color]___[value:text.primary","color]___[value:brand.base","color]___[value:brand.darkest]___[cond:_groupHover","color]___[value:brand.lighter]___[cond:_groupHover<___>_dark","color]___[value:chalk","color]___[value:negative.darker","color]___[value:negative.darkest]___[cond:_groupHover","color]___[value:ruby.70]___[cond:_groupHover<___>_dark","color]___[value:text.secondary]___[cond:_groupHover","color]___[value:text.secondary]___[cond:_groupHover<___>_dark","color]___[value:text.tertiary","outlineColor]___[value:brand.base","outlineStyle]___[value:solid","outlineWidth]___[value:thick","outlineOffset]___[value:0.5","width]___[value:9","padding]___[value:1.5","width]___[value:12","padding]___[value:3","width]___[value:15","padding]___[value:4","borderRadius]___[value:10","outlineColor]___[value:brand.lightest]___[cond:_focusVisible","background]___[value:positive.lightest","outlineColor]___[value:positive.lightest]___[cond:_focusVisible","background]___[value:negative.lightest","outlineColor]___[value:negative.lightest]___[cond:_focusVisible","background]___[value:warning.lightest","outlineColor]___[value:warning.lightest]___[cond:_focusVisible","background]___[value:surface.secondary","outlineColor]___[value:surface.secondary]___[cond:_focusVisible","transition]___[value:transform 0.2s ease, opacity 0.2s ease","opacity]___[value:0.8]___[cond:_hover","outlineStyle]___[value:solid]___[cond:_focusVisible","outlineWidth]___[value:thick]___[cond:_focusVisible","outlineOffset]___[value:0.5]___[cond:_focusVisible","animationFillMode]___[value:forwards","animationName]___[value:scaleOut","animationDuration]___[value:150ms","scale]___[value:1]___[cond:_motionReduce","color]___[value:brand.darkest","color]___[value:positive.darkest","color]___[value:negative.darkest","color]___[value:warning.darkest","color]___[value:text.secondary","textTransform]___[value:uppercase","fontSize]___[value:xs","letterSpacing]___[value:0.06rem","marginLeft]___[value:7","marginRight]___[value:7","outlineColor]___[value:brand.base]___[cond:_focusVisible","borderRadius]___[value:2]___[cond:_focusVisible","height]___[value:full","background]___[value:surface.primary","overflow]___[value:auto","scrollbarWidth]___[value:none","top]___[value:12]___[cond:@media (min-width: 48rem)","marginInline]___[value:auto]___[cond:@media (min-width: 48rem)","width]___[value:25rem]___[cond:@media (min-width: 48rem)","height]___[value:fit-content]___[cond:@media (min-width: 48rem)","boxShadow]___[value:0px 12px 56px {colors.ink.70/15}]___[cond:@media (min-width: 48rem)","borderRadius]___[value:container]___[cond:@media (min-width: 48rem)","boxShadow]___[value:none]___[cond:@media (min-width: 48rem)<___>_dark","animationName]___[value:none","scale]___[value:1","padding]___[value:2","paddingBottom]___[value:0","padding]___[value:8","borderWidth]___[value:1]___[cond:@media (min-width: 48rem)<___>_dark","borderBlock]___[value:solid]___[cond:@media (min-width: 48rem)<___>_dark","borderColor]___[value:neutral.secondary]___[cond:@media (min-width: 48rem)<___>_dark","animationName]___[value:scaleIn","animationDuration]___[value:250ms","pointerEvents]___[value:all","position]___[value:fixed","top]___[value:0","left]___[value:0","backdropBlur]___[value:0.375rem","backdropFilter]___[value:auto","backgroundColor]___[value:surface.primary/70","backgroundColor]___[value:surface.tertiary","animationName]___[value:fadeIn","animationDuration]___[value:400ms","animationName]___[value:fadeOut","height]___[value:100vh","width]___[value:100vw","maxWidth]___[value:100rem","margin]___[value:0 auto","alignItems]___[value:flex-start","alignItems]___[value:flex-end","opacity]___[value:0.3","fontWeight]___[value:medium","backgroundColor]___[value:transparent","borderStyle]___[value:solid","borderWidth]___[value:thin","borderColor]___[value:neutral.secondary","borderRadius]___[value:input","transition]___[value:all linear 120ms","width]___[value:100%","borderColor]___[value:neutral.primary]___[cond:_hover","outlineColor]___[value:brand.base]___[cond:_focusWithin","outlineStyle]___[value:solid]___[cond:_focusWithin","outlineWidth]___[value:thick]___[cond:_focusWithin","outlineOffset]___[value:0.5]___[cond:_focusWithin","height]___[value:10","borderColor]___[value:negative.base","paddingBlock]___[value:2","borderColor]___[value:neutral.secondary]___[cond:_hover","margin]___[value:0","minWidth]___[value:10","fontWeight]___[value:normal","color]___[value:text.tertiary]___[cond:_placeholder","borderColor]___[value:neutral.primary]___[cond:_groupHover","textAlign]___[value:left","textAlign]___[value:right","fontSize]___[value:xl","transition]___[value:opacity linear 120ms","color]___[value:positive.base","color]___[value:warning.base","textStyle]___[value:body-xs","textStyle]___[value:body-sm","textStyle]___[value:body-md","textStyle]___[value:body-lg","textStyle]___[value:body-sm-scaled","textStyle]___[value:body-md-scaled","textStyle]___[value:body-lg-scaled","textStyle]___[value:mono-sm","textStyle]___[value:mono-md","textStyle]___[value:mono-lg","padding]___[value:20px","justifyContent]___[value:flex-start","justifyContent]___[value:flex-end","zIndex]___[value:max","boxShadow]___[value:4px 8px 20px 0px rgba(0, 0, 0, 0.15)","backgroundColor]___[value:brand.base","backgroundColor]___[value:positive.darker","backgroundColor]___[value:warning.darker","backgroundColor]___[value:negative.darker","backgroundColor]___[value:text.tertiary","backgroundColor]___[value:text.secondary]___[cond:_dark","height]___[value:1rem","width]___[value:1rem","background]___[value:linear-gradient(#00CC8F, #6851FF)","inset]___[value:0","display]___[value:grid","gridTemplateColumns]___[value:repeat(6, minmax(0, 1fr))","columnGap]___[value:2rem","rowGap]___[value:2rem","marginTop]___[value:6","gap]___[value:10px","flexDirection]___[value:column","fill]___[value:white","truncate]___[value:true","flexShrink]___[value:0","paddingTop]___[value:6","paddingInline]___[value:8","display]___[value:block","display]___[value:none","position]___[value:absolute","bottom]___[value:0","right]___[value:0","background]___[value:text.primary/20","transform]___[value:translateY(0)","transform]___[value:translateY(100%)","transition]___[value:transform 0.3s","borderRadius]___[value:xl","boxShadow]___[value:0px -12px 56px 0px rgba(119, 118, 122, 0.15)","paddingBottom]___[value:8","justifyContent]___[value:space-between","flexDirection]___[value:row","padding]___[value:6","paddingBottom]___[value:5","minWidth]___[value:8]___[cond:& ><___>_first","minWidth]___[value:8]___[cond:& ><___>_last","outlineStyle]___[value:none","background]___[value:#ffc439","outlineColor]___[value:#ffc439","strokeWidth]___[value:2.5","gap]___[value:1","marginTop]___[value:0.5","width]___[value:60","gap]___[value:1.5","stroke]___[value:text.primary","stroke]___[value:brand.base","stroke]___[value:surface.primary","strokeOpacity]___[value:0.12","animation]___[value:spin 1s linear infinite","transformOrigin]___[value:center center","maxWidth]___[value:72","width]___[value:max","backgroundColor]___[value:surface.primary","paddingInline]___[value:3","boxShadow]___[value:0px 4px 20px 0px rgba(0, 0, 0, 0.10)","left]___[value:50%","transform]___[value:translateX(-50%) translateY(calc(-100% - 0.75rem))","width]___[value:72","height]___[value:4","transform]___[value:translateX(-50%) translateY(0.75rem)","overflowWrap]___[value:break-word","wordBreak]___[value:break-word","fontWeight]___[value:600","justifyContent]___[value:space-around","borderRadius]___[value:lg","minWidth]___[value:15rem","width]___[value:40%","borderLeft]___[value:thin solid","borderColor]___[value:neutral.tertiary","height]___[value:8","filter]___[value:blur(10px)","textWrap]___[value:nowrap","overflow]___[value:hidden","textOverflow]___[value:ellipsis","zIndex]___[value:10","gap]___[value:2","width]___[value:20","height]___[value:20","color]___[value:positive.darker","outlineOffset]___[value:1","fontVariant]___[value:no-contextual","width]___[value:1.125rem","height]___[value:1.125rem","objectFit]___[value:cover","borderStartRadius]___[value:input","background]___[value:surface.tertiary]___[cond:_hover","borderLeftWidth]___[value:thin","borderRadius]___[value:0","background]___[value:brand.lightest]___[cond:_hover","gap]___[value:4","transform]___[value:rotate(180)","width]___[value:14","height]___[value:14","top]___[value:55","maxHeight]___[value:17.5rem","overflowY]___[value:auto","width]___[value:18","height]___[value:18","minWidth]___[value:0","maxWidth]___[value:30rem","caretColor]___[value:transparent","borderRadius]___[value:0.5rem","marginBlock]___[value:4","maxWidth]___[value:8xl","marginInline]___[value:auto","paddingInline]___[value:6]___[cond:md","paddingInline]___[value:8]___[cond:lg","overlay]___[value:true","gap]___[value:0","marginTop]___[value:8","marginTop]___[value:4","transition]___[value:background-color 0.2s","background]___[value:neutral.secondary]___[cond:_hover","color]___[value:neutral.primary","borderRadius]___[value:2xl","boxShadow]___[value:0 6px 8px 2px rgba(0, 0, 0, .18)]___[cond:_hover","width]___[value:30","height]___[value:30","minHeight]___[value:20","opacity]___[value:1","borderRadius]___[value:sm","borderColor]___[value:brand.base","borderColor]___[value:text.tertiary","pointerEvents]___[value:auto","outlineColor]___[value:transparent","width]___[value:5","height]___[value:5","borderWidth]___[value:thick","transition]___[value:background-color 0.2s ease, border-color 0.2s ease","cursor]___[value:pointer]___[cond:_hover","borderColor]___[value:brand.base]___[cond:_hover","width]___[value:2.5","height]___[value:0.5","marginLeft]___[value:3","srOnly]___[value:true","height]___[value:16","width]___[value:16","width]___[value:4","alignItems]___[value:start","borderWidth]___[value:1","maxWidth]___[value:52","gap]___[value:5","gap]___[value:10","transition]___[value:border-color 0.2s ease","width]___[value:6","height]___[value:6","flex]___[value:0 0 auto","width]___[value:3","height]___[value:3","borderRadius]___[value:9999px","padding]___[value:1","background]___[value:ink.10","background]___[value:slate.2]___[cond:_dark","opacity]___[value:0.5","background]___[value:paper","background]___[value:slate.4]___[cond:_dark","boxShadow]___[value:0px 4px 20px 0px {colors.ink.90/10}","transition]___[value:transform 0.2s ease","borderRadius]___[value:inherit","marginLeft]___[value:-1","height]___[value:13","transition]___[value:background 0s","transition]___[value:background 0.2s ease","background]___[value:transparent]___[cond:_hover","background]___[value:ink.20]___[cond:_hover","background]___[value:transparent]___[cond:_hover<___>_dark","background]___[value:slate.1]___[cond:_hover<___>_dark","zIndex]___[value:0","marginRight]___[value:1","marginRight]___[value:2","background]___[value:neutral.primary","background]___[value:ink.70]___[cond:_hover","background]___[value:brand.base]___[cond:_hover","background]___[value:slate.4]___[cond:_hover<___>_dark","background]___[value:brand.base]___[cond:_hover<___>_dark","paddingInline]___[value:0.5","width]___[value:11","transition]___[value:background-color 0.2s ease","left]___[value:6","transition]___[value:left 0.2s ease","textStyle]___[value:h1-scaled","textStyle]___[value:h1","textStyle]___[value:h2-scaled","textStyle]___[value:h2","textStyle]___[value:h3-scaled","textStyle]___[value:h3","textStyle]___[value:h4-scaled","textStyle]___[value:h4","textStyle]___[value:h5-scaled","textStyle]___[value:h5","textStyle]___[value:h6-scaled","textStyle]___[value:h6","truncate]___[value:false","strokeWidth]___[value:4","width]___[value:36","height]___[value:36","gap]___[value:3","marginBlock]___[value:3","height]___[value:2.625rem","width]___[value:2.625rem","boxShadow]___[value:0.125rem 0.125rem 1.5rem {colors.ink.70/15}","borderRadius]___[value:1rem","fill]___[value:ink.50","fill]___[value:ink.70]___[cond:_dark","fill]___[value:url(\"#logo-gradient\")]___[cond:_hover","fill]___[value:url(\"#logo-gradient\")]___[cond:_active","fill]___[value:url(\"#logo-gradient\")]___[cond:_focus","color]___[value:text.tertiary]___[cond:_groupHover","color]___[value:ink.50","color]___[value:ink.70]___[cond:_dark","cursor]___[value:default","backgroundColor]___[value:magic.10","animation]___[value:fadeIn 0.5s, moveRight 1s 0.5s forwards","borderRadius]___[value:50%","borderWidth]___[value:3px","borderColor]___[value:surface.primary","height]___[value:3.875rem","width]___[value:3.875rem","marginTop]___[value:-3px","marginRight]___[value:0.9rem","zIndex]___[value:1","marginLeft]___[value:0.9rem","animation]___[value:fadeIn 0.5s, moveLeft 1s 0.5s forwards","height]___[value:34","width]___[value:34","height]___[value:56","width]___[value:56","marginBlock]___[value:10","height]___[value:250","color]___[value:ink.70","gridTemplateColumns]___[value:2","fontWeight]___[value:bold","gap]___[value:8","width]___[value:40","height]___[value:40"],"recipes":{}}}

package/dist/types/components/primitives/button.d.ts CHANGED Viewed

@@ -4,6 +4,7 @@ export interface ButtonProps extends AriaButtonProps {
     label?: string;
     size?: 'sm' | 'md' | 'lg';
     variant?: 'primary' | 'secondary' | 'negative' | 'neutral' | 'tertiary' | 'text' | 'transparent';
+    textStyle?: 'negative' | 'neutral' | 'subtle';
     disabled?: boolean;
     expand?: boolean;
     validating?: boolean;

package/dist/types/components/primitives/button.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/button.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAAE,iBAAiB,EAAoC,MAAM,OAAO,CAAC;AAChH,OAAO,EAAiD,KAAK,eAAe,EAAE,MAAM,YAAY,CAAC;AAEjG,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,GAAG,MAAM,GAAG,aAAa,CAAC;IACjG,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CACvF;~~AA4GD~~,QAAA,MAAM,MAAM;;;CAGV,CAAC;AAIH,eAAe,MAAM,CAAC"}
1	+ {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/button.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAAE,iBAAiB,EAAoC,MAAM,OAAO,CAAC;AAChH,OAAO,EAAiD,KAAK,eAAe,EAAE,MAAM,YAAY,CAAC;AAEjG,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,GAAG,MAAM,GAAG,aAAa,CAAC;IACjG,SAAS,CAAC,EAAE,UAAU,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC9C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CACvF;AA6GD,QAAA,MAAM,MAAM;;;CAGV,CAAC;AAIH,eAAe,MAAM,CAAC"}

package/dist/types/recipes/button.d.ts CHANGED Viewed

@@ -118,7 +118,7 @@ export declare const button: import("../../styled-system/types").SlotRecipeRunti
                 _groupHover: {
                     color: "brand.darkest";
                     _dark: {
-                        color: "brand.base";
+                        color: "brand.lighter";
                     };
                 };
             };
@@ -127,7 +127,7 @@ export declare const button: import("../../styled-system/types").SlotRecipeRunti
                 _groupHover: {
                     color: "brand.darkest";
                     _dark: {
-                        color: "brand.base";
+                        color: "brand.lighter";
                     };
                 };
             };
@@ -175,5 +175,10 @@ export declare const button: import("../../styled-system/types").SlotRecipeRunti
             };
         };
     };
+    textStyle: {
+        negative: {};
+        neutral: {};
+        subtle: {};
+    };
 }>;
 //# sourceMappingURL=button.d.ts.map

package/dist/types/recipes/button.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/recipes/button.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuOjB~~,CAAC"}
1	+ {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/recipes/button.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8SjB,CAAC"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@magiclabs/ui-components",
-  "version": "1.18.5",
+  "version": "1.19.0",
   "description": "💅 A theme-able library of reusable UI components",
   "author": "Magic Labs <open-source@magic.link>",
   "repository": {