@magiclabs/ui-components 1.18.4 → 1.18.5

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

@@ -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("./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"),q=require("create-slots"),d=require("react-aria");const f=q.createSlot(({children:r,...t})=>i.jsx(l.Flex,{alignItems:"center",justifyContent:"center",children:o.Children.map(r,e=>o.cloneElement(e,t))})),y=q.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:v,validating:h,iconSize:S,onHover:g}=r,u=S||(p==="sm"?16:24),s=I.button({variant:c,expand:v,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 q.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&&v&&i.jsx(l.Box,{w:b}),e&&i.jsx("span",{className:s.label,children:e}),n&&e&&v&&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 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;
 //# sourceMappingURL=button.js.map

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

@@ -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":"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"}
+{"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":"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"}

package/dist/cjs/components/primitives/dropdown-selector.js

@@ -0,0 +1,2 @@
+"use strict";var t=require("react/jsx-runtime");require("../feedback/callout.js");var S=require("@styled/css"),c=require("@styled/jsx"),b=require("@styled/tokens"),B=require("../icons/ico-caret-down.js"),I=require("../icons/ico-caret-up.js"),L=require("../icons/ico-checkmark.js"),V=require("../icons/ico-question-circle-fill.js");require("./button.js"),require("./checkbox.js"),require("./popover.js"),require("./radio.js"),require("./segmented-control.js"),require("./switch.js");var g=require("./text.js");require("./portal.js");var r=require("react");require("../../hooks/useToast.js"),require("../../recipes/toast.js");var _=require("../feedback/tooltip.js"),w=require("react-aria");const D=r.createContext({selectedOption:null,setSelectedOption:()=>{}}),O=({value:l,label:i,isFocused:v})=>{const{selectedOption:u,setSelectedOption:d}=r.useContext(D),s=u?.value===l,y=r.useCallback(()=>{d({value:l,label:i})},[d,l,i]);return t.jsxs(c.HStack,{px:4,py:1.5,gap:2,bg:s?"brand.base":v?"brand.lightest":"",_hover:s?{}:{bg:"brand.lightest"},onClick:y,children:[t.jsx(c.Box,{w:4,children:s&&t.jsx(L.default,{width:16,height:16,color:b.token("colors.surface.primary")})}),t.jsx(g.default,{size:"lg",styles:{fontWeight:500,color:b.token(`colors.${s?"surface":"text"}.primary`)},children:i})]})},E=({children:l,onSelect:i,label:v,selectedValue:u,tooltipContent:d,disabled:s,viewMax:y=5,...P})=>{const[p,f]=r.useState(!1),[o,h]=r.useState(null),x=r.useRef(null),k=r.useRef(null),A=y*2.5+1,z=r.useCallback(()=>{f(e=>!e),p||(h(null),setTimeout(()=>{var e;return(e=k.current)===null||e===void 0?void 0:e.focus()}))},[p]),F=r.useCallback(e=>{i(e.value),f(!1)},[i]),q=r.useMemo(()=>{const e=r.Children.toArray(l).find(n=>n.props.value===u);return e?e.props.label:"Select one"},[u,l]),{buttonProps:H}=w.useButton({...P,isDisabled:s,onPress:z},x),{focusProps:N,isFocusVisible:R}=w.useFocusRing(),{keyboardProps:W}=w.useKeyboard({onKeyDown:e=>{var n,a;if(!p)return;let m=o;const C=r.Children.toArray(l);switch(e.key){case"ArrowUp":e.preventDefault(),o===null?h(r.Children.count(l)-1):(m=o>0?o-1:r.Children.count(l)-1,h(m));break;case"ArrowDown":e.preventDefault(),o===null?h(0):(m=o<r.Children.count(l)-1?o+1:0,h(m));break;case"Enter":if(e.preventDefault(),(n=x.current)===null||n===void 0||n.focus(),o===null)return;if(o>=0&&o<C.length){const j=C[o];j&&i(j.props.value)}break;case"Escape":f(!1),(a=x.current)===null||a===void 0||a.focus();break}}});return r.useEffect(()=>{const e=n=>{var a;!((a=k.current)===null||a===void 0)&&a.contains(n.target)||f(!1)};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[]),t.jsx(D.Provider,{value:{selectedOption:{value:u??"",label:q},setSelectedOption:F},children:t.jsxs(c.VStack,{gap:2,w:"full",alignItems:"flex-start",children:[t.jsxs(c.HStack,{gap:2,opacity:s?.3:"",transition:"all linear 120ms",children:[v&&t.jsx(g.default,{size:"sm",styles:{fontWeight:500},children:v}),d&&t.jsx(_.default,{isDisabled:s,content:d,children:t.jsx(V.default,{className:S.css({w:4,h:4,color:"neutral.primary"})})})]}),t.jsxs("button",{className:S.css({w:"full",h:"fit-content",borderWidth:"thin",borderColor:"neutral.secondary",rounded:"xl",transition:"all linear 120ms",position:"relative",cursor:"pointer",outlineColor:"brand.base",outlineStyle:R?"solid":"none",outlineWidth:"thick",outlineOffset:.5,_hover:{borderColor:"neutral.primary"},_disabled:{opacity:.3,pointerEvents:"none"}}),ref:x,...w.mergeProps(H,N,W),children:[t.jsxs(c.HStack,{w:"full",h:12,p:4,justifyContent:"space-between",children:[t.jsx(g.default,{size:"lg",styles:{color:b.token(`colors.text.${u?"primary":"tertiary"}`)},children:q}),p?t.jsx(I.default,{width:18,height:18,color:b.token("colors.brand.base")}):t.jsx(B.default,{width:18,height:18,color:b.token("colors.brand.base")})]}),p&&t.jsx(c.Box,{ref:k,tabIndex:-1,py:2,bg:"surface.primary",position:"absolute",w:"full",rounded:"input",top:55,boxShadow:"4px 8px 20px 0px rgba(0, 0, 0, 0.15)",style:{maxHeight:`${A}rem`},overflowY:"auto",outline:"none",zIndex:"max",children:r.Children.map(l,(e,n)=>r.cloneElement(e,{isFocused:n===o}))})]})]})})};O.displayName="DropdownOption",E.displayName="DropdownSelector",exports.DropdownOption=O,exports.DropdownSelector=E;
+//# sourceMappingURL=dropdown-selector.js.map

package/dist/cjs/components/primitives/dropdown-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown-selector.js","sources":["../../../../src/components/primitives/dropdown-selector.tsx"],"sourcesContent":["import { Tooltip } from '@components/feedback';\nimport { IcoCaretDown, IcoCaretUp, IcoCheckmark, IcoQuestionCircleFill } from '@components/icons';\nimport { Text } from '@components/primitives';\nimport { css } from '@styled/css';\nimport { Box, HStack, VStack } from '@styled/jsx';\nimport { token } from '@styled/tokens';\nimport {\n  Children,\n  cloneElement,\n  createContext,\n  ReactElement,\n  ReactNode,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { AriaButtonProps, mergeProps, useButton, useFocusRing, useKeyboard } from 'react-aria';\n\nexport interface DropdownSelectorProps extends AriaButtonProps {\n  children: ReactNode;\n  onSelect: (value: string) => void;\n  label?: string;\n  selectedValue?: string;\n  tooltipContent?: string;\n  disabled?: boolean;\n  viewMax?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10;\n}\n\nexport interface DropdownOptionProps {\n  value: string;\n  label: string;\n  isFocused?: boolean;\n}\n\ninterface OptionData {\n  value: string;\n  label: string;\n}\n\nexport interface DropdownContextType {\n  selectedOption: OptionData | null;\n  setSelectedOption: (option: OptionData) => void;\n}\n\nconst DropdownContext = createContext<DropdownContextType>({\n  selectedOption: null,\n  setSelectedOption: () => {},\n});\n\nexport const DropdownOption = ({ value, label, isFocused }: DropdownOptionProps) => {\n  const { selectedOption, setSelectedOption } = useContext(DropdownContext);\n  const isSelected = selectedOption?.value === value;\n\n  const handleSelectOption = useCallback(() => {\n    setSelectedOption({ value, label });\n  }, [setSelectedOption, value, label]);\n\n  return (\n    <HStack\n      px={4}\n      py={1.5}\n      gap={2}\n      bg={isSelected ? 'brand.base' : isFocused ? 'brand.lightest' : ''}\n      _hover={!isSelected ? { bg: 'brand.lightest' } : {}}\n      onClick={handleSelectOption}\n    >\n      <Box w={4}>{isSelected && <IcoCheckmark width={16} height={16} color={token('colors.surface.primary')} />}</Box>\n      <Text size=\"lg\" styles={{ fontWeight: 500, color: token(`colors.${isSelected ? 'surface' : 'text'}.primary`) }}>\n        {label}\n      </Text>\n    </HStack>\n  );\n};\n\nexport const DropdownSelector = ({\n  children,\n  onSelect,\n  label,\n  selectedValue,\n  tooltipContent,\n  disabled,\n  viewMax = 5,\n  ...props\n}: DropdownSelectorProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const dropdownRef = useRef<HTMLDivElement>(null);\n  const maxHeight = viewMax * 2.5 + 1;\n\n  const toggleDropdown = useCallback(() => {\n    setIsOpen(prev => !prev);\n    if (!isOpen) {\n      setFocusedIndex(null);\n      setTimeout(() => dropdownRef.current?.focus());\n    }\n  }, [isOpen]);\n\n  const handleSelect = useCallback(\n    (option: OptionData) => {\n      onSelect(option.value);\n      setIsOpen(false);\n    },\n    [onSelect],\n  );\n\n  const selectedLabel = useMemo(() => {\n    const childElements = Children.toArray(children) as ReactElement<DropdownOptionProps>[];\n    const matchedChild = childElements.find(child => child.props.value === selectedValue);\n    return matchedChild ? matchedChild.props.label : 'Select one';\n  }, [selectedValue, children]);\n\n  const { buttonProps } = useButton(\n    {\n      ...props,\n      isDisabled: disabled,\n      onPress: toggleDropdown,\n    },\n    buttonRef,\n  );\n\n  const { focusProps, isFocusVisible } = useFocusRing();\n\n  const { keyboardProps } = useKeyboard({\n    onKeyDown: event => {\n      if (!isOpen) return;\n\n      let newFocusedIndex = focusedIndex;\n      const childArray = Children.toArray(children);\n\n      switch (event.key) {\n        case 'ArrowUp':\n          event.preventDefault();\n          if (focusedIndex === null) {\n            setFocusedIndex(Children.count(children) - 1);\n          } else {\n            newFocusedIndex = focusedIndex > 0 ? focusedIndex - 1 : Children.count(children) - 1;\n            setFocusedIndex(newFocusedIndex);\n          }\n          break;\n        case 'ArrowDown':\n          event.preventDefault();\n          if (focusedIndex === null) {\n            setFocusedIndex(0);\n          } else {\n            newFocusedIndex = focusedIndex < Children.count(children) - 1 ? focusedIndex + 1 : 0;\n            setFocusedIndex(newFocusedIndex);\n          }\n          break;\n        case 'Enter':\n          event.preventDefault();\n          buttonRef.current?.focus();\n          if (focusedIndex === null) return;\n          if (focusedIndex >= 0 && focusedIndex < childArray.length) {\n            const selectedChild = childArray[focusedIndex] as ReactElement<DropdownOptionProps>;\n            if (selectedChild) {\n              onSelect(selectedChild.props.value);\n            }\n          }\n          break;\n        case 'Escape':\n          setIsOpen(false);\n          buttonRef.current?.focus();\n          break;\n        default:\n          break;\n      }\n    },\n  });\n\n  useEffect(() => {\n    const handleClick = (event: MouseEvent) => {\n      if (!dropdownRef.current?.contains(event.target as Node)) {\n        setIsOpen(false);\n      }\n    };\n\n    document.addEventListener('mousedown', handleClick);\n\n    return () => {\n      document.removeEventListener('mousedown', handleClick);\n    };\n  }, []);\n\n  return (\n    <DropdownContext.Provider\n      value={{ selectedOption: { value: selectedValue ?? '', label: selectedLabel }, setSelectedOption: handleSelect }}\n    >\n      <VStack gap={2} w=\"full\" alignItems=\"flex-start\">\n        <HStack gap={2} opacity={disabled ? 0.3 : ''} transition={'all linear 120ms'}>\n          {label && (\n            <Text size=\"sm\" styles={{ fontWeight: 500 }}>\n              {label}\n            </Text>\n          )}\n\n          {tooltipContent && (\n            <Tooltip isDisabled={disabled} content={tooltipContent}>\n              <IcoQuestionCircleFill className={css({ w: 4, h: 4, color: 'neutral.primary' })} />\n            </Tooltip>\n          )}\n        </HStack>\n\n        <button\n          className={css({\n            w: 'full',\n            h: 'fit-content',\n            borderWidth: 'thin',\n            borderColor: 'neutral.secondary',\n            rounded: 'xl',\n            transition: 'all linear 120ms',\n            position: 'relative',\n            cursor: 'pointer',\n            outlineColor: 'brand.base',\n            outlineStyle: isFocusVisible ? 'solid' : 'none',\n            outlineWidth: 'thick',\n            outlineOffset: 0.5,\n            _hover: { borderColor: 'neutral.primary' },\n            _disabled: { opacity: 0.3, pointerEvents: 'none' },\n          })}\n          ref={buttonRef}\n          {...mergeProps(buttonProps, focusProps, keyboardProps)}\n        >\n          <HStack w=\"full\" h={12} p={4} justifyContent=\"space-between\">\n            <Text size=\"lg\" styles={{ color: token(`colors.text.${selectedValue ? 'primary' : 'tertiary'}`) }}>\n              {selectedLabel}\n            </Text>\n            {isOpen ? (\n              <IcoCaretUp width={18} height={18} color={token('colors.brand.base')} />\n            ) : (\n              <IcoCaretDown width={18} height={18} color={token('colors.brand.base')} />\n            )}\n          </HStack>\n\n          {isOpen && (\n            <Box\n              ref={dropdownRef}\n              tabIndex={-1}\n              py={2}\n              bg=\"surface.primary\"\n              position=\"absolute\"\n              w=\"full\"\n              rounded=\"input\"\n              top={55}\n              boxShadow=\"4px 8px 20px 0px rgba(0, 0, 0, 0.15)\"\n              style={{ maxHeight: `${maxHeight}rem` }}\n              overflowY=\"auto\"\n              outline=\"none\"\n              zIndex=\"max\"\n            >\n              {Children.map(children, (child, index) =>\n                cloneElement(child as ReactElement<DropdownOptionProps>, {\n                  isFocused: index === focusedIndex,\n                }),\n              )}\n            </Box>\n          )}\n        </button>\n      </VStack>\n    </DropdownContext.Provider>\n  );\n};\n\nDropdownOption.displayName = 'DropdownOption';\nDropdownSelector.displayName = 'DropdownSelector';\n"],"names":["DropdownContext","createContext","DropdownOption","value","label","isFocused","selectedOption","setSelectedOption","useContext","isSelected","handleSelectOption","useCallback","_jsxs","HStack","_jsx","Box","IcoCheckmark","token","Text","DropdownSelector","children","onSelect","selectedValue","tooltipContent","disabled","viewMax","props","isOpen","setIsOpen","useState","focusedIndex","setFocusedIndex","buttonRef","useRef","dropdownRef","maxHeight","toggleDropdown","prev","_a","handleSelect","option","selectedLabel","useMemo","matchedChild","Children","child","buttonProps","useButton","focusProps","isFocusVisible","useFocusRing","keyboardProps","useKeyboard","event","newFocusedIndex","childArray","selectedChild","_b","useEffect","handleClick","VStack","Tooltip","IcoQuestionCircleFill","css","mergeProps","IcoCaretUp","IcoCaretDown","index","cloneElement"],"mappings":"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"}

package/dist/cjs/components/primitives/popover.js

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

package/dist/cjs/components/primitives/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","sources":["../../../../src/components/primitives/popover.tsx"],"sourcesContent":["import { Button, ButtonProps } from '@components/primitives';\nimport { useToggleState } from '@hooks/useToggleState';\nimport { cx } from '@styled/css';\nimport { Center } from '@styled/jsx';\nimport { vstack } from '@styled/patterns';\nimport { token } from '@styled/tokens';\nimport { createHost, createSlot } from 'create-slots';\nimport {\n  Children,\n  ComponentProps,\n  PropsWithChildren,\n  cloneElement,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  type ReactNode,\n} from 'react';\nimport type { AriaPopoverProps, Placement } from 'react-aria';\nimport { Overlay, mergeProps, useOverlayTrigger, usePopover } from 'react-aria';\n\ninterface OverlayTriggerProps extends ButtonProps {\n  isOpen?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\ninterface OverlayTriggerState {\n  readonly isOpen: boolean;\n  setOpen(isOpen: boolean): void;\n  open(): void;\n  close(): void;\n  toggle(): void;\n}\n\ntype PopoverContentProps = Omit<AriaPopoverProps, 'popoverRef' | 'triggerRef'> & {\n  children?: ReactNode;\n  state?: OverlayTriggerState;\n} & ComponentProps<'div'>;\n\nexport const DEFAULT_PLACEMENT: Placement = 'bottom left';\nexport const DEFAULT_OFFSET = 8;\n\nconst PopoverContent = createSlot(({ children }: PopoverContentProps) => <>{children}</>);\n\nconst LeadingIcon = createSlot(({ children, ...props }) => {\n  return (\n    <Center>\n      {Children.map(children, child => {\n        return cloneElement(child, props);\n      })}\n    </Center>\n  );\n});\n\nconst TrailingIcon = createSlot(({ children, ...props }) => {\n  return (\n    <Center>\n      {Children.map(children, child => {\n        return cloneElement(child, props);\n      })}\n    </Center>\n  );\n});\n\nexport type PopoverProps = PropsWithChildren<OverlayTriggerProps>;\n\nexport const PopoverHost = ({ children, ...props }: PopoverProps) => {\n  return createHost(children, slots => {\n    const { isSelected, setSelected: setOpen } = useToggleState({\n      isOpen: props.isOpen,\n      defaultSelected: props.defaultOpen,\n      onChange: props.onOpenChange,\n      ...props,\n    });\n\n    const isOpen = props.isOpen !== undefined ? props.isOpen : isSelected;\n    const safeZoneRadius = 24;\n\n    const state = useMemo(\n      () => ({\n        isOpen,\n        open: () => {\n          setOpen(true);\n        },\n        close: () => {\n          setOpen(false);\n        },\n        setOpen(value: boolean) {\n          setOpen(value);\n        },\n        toggle() {},\n      }),\n      [isOpen],\n    );\n\n    const popoverContentProps = slots.getProps(PopoverContent);\n\n    const triggerRef = useRef<HTMLButtonElement>(null);\n    const { triggerProps, overlayProps } = useOverlayTrigger({ type: 'dialog' }, state, triggerRef);\n\n    const contentRef = useRef<HTMLDivElement>(null);\n    const { popoverProps, underlayProps } = usePopover(\n      {\n        placement: DEFAULT_PLACEMENT,\n        offset: DEFAULT_OFFSET,\n        popoverRef: contentRef,\n        triggerRef,\n        ...popoverContentProps,\n      },\n      state,\n    );\n\n    const contentProps = mergeProps(popoverContentProps, popoverProps);\n\n    // Need to override zIndex set by react-aria so popover displays over iframe\n    if (contentProps?.style?.zIndex) {\n      contentProps.style.zIndex = token('zIndex.max');\n    }\n\n    const handleMouseEnter = useCallback(() => {\n      state.open();\n    }, [state]);\n\n    const handleMouseLeave = useCallback(\n      (event: MouseEvent) => {\n        const buttonRect = triggerRef.current?.getBoundingClientRect();\n        const popoverRect = contentRef.current?.getBoundingClientRect();\n\n        if (buttonRect && popoverRect) {\n          const withinButtonSafeZone =\n            event.clientX >= buttonRect.left - safeZoneRadius &&\n            event.clientX <= buttonRect.right + safeZoneRadius &&\n            event.clientY >= buttonRect.top - safeZoneRadius &&\n            event.clientY <= buttonRect.bottom + safeZoneRadius;\n\n          const withinPopoverSafeZone =\n            event.clientX >= popoverRect.left - safeZoneRadius &&\n            event.clientX <= popoverRect.right + safeZoneRadius &&\n            event.clientY >= popoverRect.top - safeZoneRadius &&\n            event.clientY <= popoverRect.bottom + safeZoneRadius;\n\n          if (!withinButtonSafeZone && !withinPopoverSafeZone) {\n            state.close();\n          }\n        }\n      },\n      [state],\n    );\n\n    const focusFirstInteractiveElement = () => {\n      if (contentRef.current) {\n        const interactiveElements = contentRef.current.querySelectorAll(\n          'a, button, input, select, textarea, [tabindex]:not([tabindex=\"-1\"])',\n        );\n        if (interactiveElements.length > 0) {\n          (interactiveElements[0] as HTMLElement).focus();\n        }\n      }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n      if (event.key === 'Enter') {\n        event.preventDefault();\n        if (isOpen) {\n          state.close();\n        } else {\n          state.open();\n          setTimeout(focusFirstInteractiveElement, 0);\n        }\n      }\n    };\n\n    useEffect(() => {\n      document.addEventListener('mousemove', handleMouseLeave);\n      return () => {\n        document.removeEventListener('mousemove', handleMouseLeave);\n      };\n    }, [handleMouseLeave]);\n\n    const iconSize = props.size === 'sm' ? 16 : 24;\n    const leadingIcon = slots.get(LeadingIcon);\n    const trailingIcon = slots.get(TrailingIcon);\n\n    return (\n      <>\n        <Button\n          ref={triggerRef}\n          {...mergeProps(triggerProps, props)}\n          onHover={handleMouseEnter}\n          onKeyDown={handleKeyDown}\n        >\n          {leadingIcon && (\n            <Button.LeadingIcon>\n              {leadingIcon && { ...leadingIcon, props: { ...leadingIcon.props, width: iconSize, height: iconSize } }}\n            </Button.LeadingIcon>\n          )}\n          {trailingIcon && (\n            <Button.TrailingIcon>\n              {trailingIcon && { ...trailingIcon, props: { ...trailingIcon.props, width: iconSize, height: iconSize } }}\n            </Button.TrailingIcon>\n          )}\n        </Button>\n        {isOpen && (\n          <Overlay {...overlayProps}>\n            <div {...underlayProps} className=\"underlay\" />\n            <div\n              ref={contentRef}\n              {...contentProps}\n              className={cx(\n                vstack({\n                  bg: 'surface.primary',\n                  p: 3,\n                  gap: 0,\n                  color: 'text.secondary',\n                  borderWidth: 1,\n                  borderColor: 'neutral.secondary',\n                  borderRadius: 'xl',\n                  boxShadow: '0px 4px 20px 0px rgba(0, 0, 0, 0.10)',\n                  maxW: 52,\n                  alignItems: 'start',\n                }),\n                contentProps.className,\n              )}\n            >\n              {slots.get(PopoverContent)}\n            </div>\n          </Overlay>\n        )}\n      </>\n    );\n  });\n};\n\nexport const Popover = Object.assign(PopoverHost, {\n  LeadingIcon,\n  TrailingIcon,\n  Content: PopoverContent,\n});\n\nexport default Popover;\n"],"names":["DEFAULT_PLACEMENT","DEFAULT_OFFSET","PopoverContent","createSlot","children","_jsx","_Fragment","LeadingIcon","props","Center","Children","child","cloneElement","TrailingIcon","PopoverHost","createHost","slots","isSelected","setOpen","useToggleState","isOpen","safeZoneRadius","state","useMemo","value","popoverContentProps","triggerRef","useRef","triggerProps","overlayProps","useOverlayTrigger","contentRef","popoverProps","underlayProps","usePopover","contentProps","mergeProps","_a","token","handleMouseEnter","useCallback","handleMouseLeave","event","buttonRect","popoverRect","_b","withinButtonSafeZone","withinPopoverSafeZone","focusFirstInteractiveElement","interactiveElements","handleKeyDown","useEffect","iconSize","leadingIcon","trailingIcon","_jsxs","Button","Overlay","cx","vstack","Popover"],"mappings":"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"}
+{"version":3,"file":"popover.js","sources":["../../../../src/components/primitives/popover.tsx"],"sourcesContent":["import { Button, ButtonProps } from '@components/primitives';\nimport { useToggleState } from '@hooks/useToggleState';\nimport { cx } from '@styled/css';\nimport { Center } from '@styled/jsx';\nimport { vstack } from '@styled/patterns';\nimport { token } from '@styled/tokens';\nimport { createHost, createSlot } from 'create-slots';\nimport {\n  Children,\n  ComponentProps,\n  PropsWithChildren,\n  cloneElement,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  type ReactNode,\n} from 'react';\nimport type { AriaPopoverProps, Placement } from 'react-aria';\nimport { Overlay, mergeProps, useOverlayTrigger, usePopover } from 'react-aria';\n\ninterface OverlayTriggerProps extends ButtonProps {\n  isOpen?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\ninterface OverlayTriggerState {\n  readonly isOpen: boolean;\n  setOpen(isOpen: boolean): void;\n  open(): void;\n  close(): void;\n  toggle(): void;\n}\n\ntype PopoverContentProps = Omit<AriaPopoverProps, 'popoverRef' | 'triggerRef'> & {\n  children?: ReactNode;\n  state?: OverlayTriggerState;\n} & ComponentProps<'div'>;\n\nexport const DEFAULT_PLACEMENT: Placement = 'bottom left';\nexport const DEFAULT_OFFSET = 8;\n\nconst PopoverContent = createSlot(({ children }: PopoverContentProps) => <>{children}</>);\n\nconst LeadingIcon = createSlot(({ children, ...props }) => {\n  return (\n    <Center>\n      {Children.map(children, child => {\n        return cloneElement(child, props);\n      })}\n    </Center>\n  );\n});\n\nconst TrailingIcon = createSlot(({ children, ...props }) => {\n  return (\n    <Center>\n      {Children.map(children, child => {\n        return cloneElement(child, props);\n      })}\n    </Center>\n  );\n});\n\nexport type PopoverProps = PropsWithChildren<OverlayTriggerProps>;\n\nexport const PopoverHost = ({ children, ...props }: PopoverProps) => {\n  return createHost(children, slots => {\n    const { isSelected, setSelected: setOpen } = useToggleState({\n      isOpen: props.isOpen,\n      defaultSelected: props.defaultOpen,\n      onChange: props.onOpenChange,\n      ...props,\n    });\n\n    const isOpen = props.isOpen !== undefined ? props.isOpen : isSelected;\n    const safeZoneRadius = 24;\n\n    const state = useMemo(\n      () => ({\n        isOpen,\n        open: () => {\n          setOpen(true);\n        },\n        close: () => {\n          setOpen(false);\n        },\n        setOpen(value: boolean) {\n          setOpen(value);\n        },\n        toggle() {},\n      }),\n      [isOpen],\n    );\n\n    const popoverContentProps = slots.getProps(PopoverContent);\n\n    const triggerRef = useRef<HTMLButtonElement>(null);\n    const { triggerProps, overlayProps } = useOverlayTrigger({ type: 'dialog' }, state, triggerRef);\n\n    const contentRef = useRef<HTMLDivElement>(null);\n    const { popoverProps, underlayProps } = usePopover(\n      {\n        placement: DEFAULT_PLACEMENT,\n        offset: DEFAULT_OFFSET,\n        popoverRef: contentRef,\n        triggerRef,\n        ...popoverContentProps,\n      },\n      state,\n    );\n\n    const contentProps = mergeProps(popoverContentProps, popoverProps);\n\n    // Need to override zIndex set by react-aria so popover displays over iframe\n    if (contentProps?.style?.zIndex) {\n      contentProps.style.zIndex = token('zIndex.max');\n    }\n\n    const handleMouseEnter = useCallback(() => {\n      state.open();\n    }, [state]);\n\n    const handleMouseLeave = useCallback(\n      (event: MouseEvent) => {\n        const buttonRect = triggerRef.current?.getBoundingClientRect();\n        const popoverRect = contentRef.current?.getBoundingClientRect();\n\n        if (buttonRect && popoverRect) {\n          const withinButtonSafeZone =\n            event.clientX >= buttonRect.left - safeZoneRadius &&\n            event.clientX <= buttonRect.right + safeZoneRadius &&\n            event.clientY >= buttonRect.top - safeZoneRadius &&\n            event.clientY <= buttonRect.bottom + safeZoneRadius;\n\n          const withinPopoverSafeZone =\n            event.clientX >= popoverRect.left - safeZoneRadius &&\n            event.clientX <= popoverRect.right + safeZoneRadius &&\n            event.clientY >= popoverRect.top - safeZoneRadius &&\n            event.clientY <= popoverRect.bottom + safeZoneRadius;\n\n          if (!withinButtonSafeZone && !withinPopoverSafeZone) {\n            state.close();\n          }\n        }\n      },\n      [state],\n    );\n\n    const focusFirstInteractiveElement = () => {\n      if (contentRef.current) {\n        const interactiveElements = contentRef.current.querySelectorAll(\n          'a, button, input, select, textarea, [tabindex]:not([tabindex=\"-1\"])',\n        );\n        if (interactiveElements.length > 0) {\n          (interactiveElements[0] as HTMLElement).focus();\n        }\n      }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n      if (event.key === 'Enter') {\n        event.preventDefault();\n        if (isOpen) {\n          state.close();\n        } else {\n          state.open();\n          setTimeout(focusFirstInteractiveElement, 0);\n        }\n      }\n    };\n\n    useEffect(() => {\n      document.addEventListener('mousemove', handleMouseLeave);\n      return () => {\n        document.removeEventListener('mousemove', handleMouseLeave);\n      };\n    }, [handleMouseLeave]);\n\n    const iconSize = props.size === 'sm' ? 16 : 24;\n    const leadingIcon = slots.get(LeadingIcon);\n    const trailingIcon = slots.get(TrailingIcon);\n\n    return (\n      <>\n        <Button\n          ref={triggerRef}\n          {...mergeProps(triggerProps, props)}\n          onHover={handleMouseEnter}\n          onKeyDown={handleKeyDown}\n        >\n          {leadingIcon && (\n            <Button.LeadingIcon>\n              {leadingIcon && { ...leadingIcon, props: { ...leadingIcon.props, width: iconSize, height: iconSize } }}\n            </Button.LeadingIcon>\n          )}\n          {trailingIcon && (\n            <Button.TrailingIcon>\n              {trailingIcon && { ...trailingIcon, props: { ...trailingIcon.props, width: iconSize, height: iconSize } }}\n            </Button.TrailingIcon>\n          )}\n        </Button>\n        {isOpen && (\n          <Overlay {...overlayProps}>\n            <div {...underlayProps} className=\"underlay\" />\n            <div\n              ref={contentRef}\n              {...contentProps}\n              className={cx(\n                vstack({\n                  bg: 'surface.primary',\n                  p: 3,\n                  gap: 0,\n                  color: 'text.secondary',\n                  borderWidth: 1,\n                  borderColor: 'neutral.secondary',\n                  borderRadius: 'xl',\n                  boxShadow: '0px 4px 20px 0px rgba(0, 0, 0, 0.10)',\n                  maxW: 52,\n                  alignItems: 'start',\n                }),\n                contentProps.className,\n              )}\n            >\n              {slots.get(PopoverContent)}\n            </div>\n          </Overlay>\n        )}\n      </>\n    );\n  });\n};\n\nexport const Popover = Object.assign(PopoverHost, {\n  LeadingIcon,\n  TrailingIcon,\n  Content: PopoverContent,\n});\n\nexport default Popover;\n"],"names":["DEFAULT_PLACEMENT","DEFAULT_OFFSET","PopoverContent","createSlot","children","_jsx","_Fragment","LeadingIcon","props","Center","Children","child","cloneElement","TrailingIcon","PopoverHost","createHost","slots","isSelected","setOpen","useToggleState","isOpen","safeZoneRadius","state","useMemo","value","popoverContentProps","triggerRef","useRef","triggerProps","overlayProps","useOverlayTrigger","contentRef","popoverProps","underlayProps","usePopover","contentProps","mergeProps","_a","token","handleMouseEnter","useCallback","handleMouseLeave","event","buttonRect","popoverRect","_b","withinButtonSafeZone","withinPopoverSafeZone","focusFirstInteractiveElement","interactiveElements","handleKeyDown","useEffect","iconSize","leadingIcon","trailingIcon","_jsxs","Button","Overlay","cx","vstack","Popover"],"mappings":"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"}

package/dist/cjs/components/primitives/radio.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),m=require("./text.js"),u=require("@styled/jsx"),R=require("@styled/patterns"),t=require("react"),a=require("react-aria");const p=t.createContext({currentValue:void 0,setCurrentValue:()=>{}}),v=d=>{const{children:c,onChange:i,selectedValue:r,vertical:s}=d,[x,o]=t.useState(r);t.useEffect(()=>{r!==void 0&&o(r)},[r]);const b=t.useCallback(n=>{o(n),i(n)},[o,i]);return e.jsx(u.Flex,{direction:s?"column":"row",gap:s?5:10,role:"radiogroup",children:e.jsx(p.Provider,{value:{currentValue:x,setCurrentValue:b},children:c})})},f=t.forwardRef((d,c)=>{const{label:i,value:r}=d,s=t.useContext(p),x=t.useRef(null),o=c||x,b=t.useCallback(()=>{s.setCurrentValue(r)},[s,r]),{hoverProps:n}=a.useHover({}),{focusProps:C,isFocusVisible:h}=a.useFocusRing(),{pressProps:j}=a.usePress({onPress:b}),l=s.currentValue===r,g=l?0:-1;return e.jsxs("label",{className:R.flex({alignItems:"center"}),children:[e.jsx(a.VisuallyHidden,{children:e.jsx("input",{...a.mergeProps(j,C,n),ref:o,type:"radio",checked:l,tabIndex:g,readOnly:!0})}),e.jsx(u.Flex,{justifyContent:"center",alignItems:"center",borderWidth:"thick",borderColor:h||l?"brand.base":"text.tertiary",transition:"border-color 0.2s ease",outlineColor:"brand.base",outlineStyle:h?"solid":"none",outlineWidth:"thick",outlineOffset:.5,_hover:{borderColor:"brand.base"},cursor:"pointer",w:6,h:6,rounded:"full","aria-hidden":"true",children:l&&e.jsx(u.Circle,{size:3,bg:"brand.base"})}),e.jsx(u.Box,{ml:3,children:e.jsx(m.default,{size:"lg",styles:{fontWeight:500},children:i})})]})});v.displayName="RadioGroup",f.displayName="Radio",exports.Radio=f,exports.RadioGroup=v;
+"use strict";var e=require("react/jsx-runtime"),C=require("./text.js"),i=require("@styled/jsx"),R=require("@styled/patterns"),s=require("react"),t=require("react-aria");const b=s.createContext({selectedValue:void 0,setSelectedValue:()=>{}}),h=n=>{const{children:d,onChange:a,selectedValue:l,vertical:r}=n,u=s.useCallback(c=>{a(c)},[a]);return e.jsx(i.Flex,{direction:r?"column":"row",gap:r?5:10,role:"radiogroup",children:e.jsx(b.Provider,{value:{selectedValue:l,setSelectedValue:u},children:d})})},p=s.forwardRef((n,d)=>{const{label:a,value:l}=n,r=s.useContext(b),u=s.useRef(null),c=d||u,v=s.useCallback(()=>{r.setSelectedValue(l)},[r,l]),{hoverProps:f}=t.useHover({}),{focusProps:j,isFocusVisible:x}=t.useFocusRing(),{pressProps:g}=t.usePress({onPress:v}),o=r.selectedValue===l,m=o?0:-1;return e.jsxs("label",{className:R.flex({alignItems:"center"}),children:[e.jsx(t.VisuallyHidden,{children:e.jsx("input",{...t.mergeProps(g,j,f),ref:c,type:"radio",checked:o,tabIndex:m,readOnly:!0})}),e.jsx(i.Flex,{justifyContent:"center",alignItems:"center",borderWidth:"thick",borderColor:x||o?"brand.base":"text.tertiary",transition:"border-color 0.2s ease",outlineColor:"brand.base",outlineStyle:x?"solid":"none",outlineWidth:"thick",outlineOffset:.5,_hover:{borderColor:"brand.base"},cursor:"pointer",w:6,h:6,rounded:"full","aria-hidden":"true",children:o&&e.jsx(i.Circle,{size:3,bg:"brand.base"})}),e.jsx(i.Box,{ml:3,children:e.jsx(C.default,{size:"lg",styles:{fontWeight:500},children:a})})]})});h.displayName="RadioGroup",p.displayName="Radio",exports.Radio=p,exports.RadioGroup=h;
 //# sourceMappingURL=radio.js.map

package/dist/cjs/components/primitives/radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio.js","sources":["../../../../src/components/primitives/radio.tsx"],"sourcesContent":["import Text from '@components/primitives/text';\nimport { Box, Circle, Flex } from '@styled/jsx';\nimport { flex } from '@styled/patterns';\nimport {\n  PropsWithChildren,\n  createContext,\n  forwardRef,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport {\n  AriaRadioGroupProps,\n  AriaRadioProps,\n  VisuallyHidden,\n  mergeProps,\n  useFocusRing,\n  useHover,\n  usePress,\n} from 'react-aria';\n\nexport interface RadioGroupProps extends AriaRadioGroupProps, PropsWithChildren {\n  onChange: (value: string) => void;\n  selectedValue?: string;\n  vertical?: boolean;\n}\n\nexport interface RadioProps extends AriaRadioProps {\n  label?: string;\n}\n\nconst RadioContext = createContext<{\n  currentValue: string | undefined;\n  setCurrentValue: (value: string) => void;\n}>({\n  currentValue: undefined,\n  setCurrentValue: () => {},\n});\n\nexport const RadioGroup = (props: RadioGroupProps) => {\n  const { children, onChange, selectedValue, vertical } = props;\n  const [currentValue, setCurrentValue] = useState<string | undefined>(selectedValue);\n\n  useEffect(() => {\n    if (selectedValue !== undefined) {\n      setCurrentValue(selectedValue);\n    }\n  }, [selectedValue]);\n\n  const handleSelect = useCallback(\n    (value: string) => {\n      setCurrentValue(value);\n      onChange(value);\n    },\n    [setCurrentValue, onChange],\n  );\n\n  return (\n    <Flex direction={vertical ? 'column' : 'row'} gap={vertical ? 5 : 10} role=\"radiogroup\">\n      <RadioContext.Provider value={{ currentValue, setCurrentValue: handleSelect }}>{children}</RadioContext.Provider>\n    </Flex>\n  );\n};\n\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>((props, forwardedRef) => {\n  const { label, value } = props;\n  const state = useContext(RadioContext);\n\n  const internalRef = useRef<HTMLInputElement>(null);\n  const ref = forwardedRef || internalRef;\n\n  const handlePress = useCallback(() => {\n    state.setCurrentValue(value);\n  }, [state, value]);\n\n  const { hoverProps } = useHover({});\n  const { focusProps, isFocusVisible } = useFocusRing();\n  const { pressProps } = usePress({\n    onPress: handlePress,\n  });\n\n  const isSelected = state.currentValue === value;\n\n  const tabIndex = isSelected ? 0 : -1;\n\n  return (\n    <label className={flex({ alignItems: 'center' })}>\n      <VisuallyHidden>\n        <input\n          {...mergeProps(pressProps, focusProps, hoverProps)}\n          ref={ref}\n          type=\"radio\"\n          checked={isSelected}\n          tabIndex={tabIndex}\n          readOnly\n        />\n      </VisuallyHidden>\n      <Flex\n        justifyContent=\"center\"\n        alignItems=\"center\"\n        borderWidth=\"thick\"\n        borderColor={isFocusVisible || isSelected ? 'brand.base' : 'text.tertiary'}\n        transition=\"border-color 0.2s ease\"\n        outlineColor=\"brand.base\"\n        outlineStyle={isFocusVisible ? 'solid' : 'none'}\n        outlineWidth=\"thick\"\n        outlineOffset={0.5}\n        _hover={{ borderColor: 'brand.base' }}\n        cursor=\"pointer\"\n        w={6}\n        h={6}\n        rounded=\"full\"\n        aria-hidden=\"true\"\n      >\n        {isSelected && <Circle size={3} bg=\"brand.base\" />}\n      </Flex>\n      <Box ml={3}>\n        <Text size=\"lg\" styles={{ fontWeight: 500 }}>\n          {label}\n        </Text>\n      </Box>\n    </label>\n  );\n});\n\nRadioGroup.displayName = 'RadioGroup';\nRadio.displayName = 'Radio';\n"],"names":["RadioContext","createContext","RadioGroup","props","children","onChange","selectedValue","vertical","currentValue","setCurrentValue","useState","useEffect","handleSelect","useCallback","value","_jsx","Flex","Radio","forwardRef","forwardedRef","label","state","useContext","internalRef","useRef","ref","handlePress","hoverProps","useHover","focusProps","isFocusVisible","useFocusRing","pressProps","usePress","isSelected","tabIndex","_jsxs","flex","VisuallyHidden","mergeProps","Circle","Box","Text"],"mappings":"yKAiCA,MAAMA,EAAeC,EAAAA,cAGlB,CACD,aAAc,OACd,gBAAiB,IAAK,CACvB,CAAA,CAAA,EAEYC,EAAcC,GAA0B,CACnD,KAAM,CAAE,SAAAC,EAAU,SAAAC,EAAU,cAAAC,EAAe,SAAAC,CAAQ,EAAKJ,EAClD,CAACK,EAAcC,CAAe,EAAIC,EAA6BJ,SAAAA,CAAa,EAElFK,EAAAA,UAAU,IAAK,CACTL,IAAkB,QACpBG,EAAgBH,CAAa,CAEjC,EAAG,CAACA,CAAa,CAAC,EAElB,MAAMM,EAAeC,EAAAA,YAClBC,GAAiB,CAChBL,EAAgBK,CAAK,EACrBT,EAASS,CAAK,CAChB,EACA,CAACL,EAAiBJ,CAAQ,CAAC,EAG7B,OACEU,MAACC,EAAI,KAAA,CAAC,UAAWT,EAAW,SAAW,MAAO,IAAKA,EAAW,EAAI,GAAI,KAAK,aAAY,SACrFQ,EAACf,IAAAA,EAAa,SAAQ,CAAC,MAAO,CAAE,aAAAQ,EAAc,gBAAiBI,CAAY,WAAKR,CAAQ,CAAA,CACnF,CAAA,CAEX,EAEaa,EAAQC,EAAAA,WAAyC,CAACf,EAAOgB,IAAgB,CACpF,KAAM,CAAE,MAAAC,EAAO,MAAAN,CAAO,EAAGX,EACnBkB,EAAQC,EAAWtB,WAAAA,CAAY,EAE/BuB,EAAcC,EAAAA,OAAyB,IAAI,EAC3CC,EAAMN,GAAgBI,EAEtBG,EAAcb,EAAAA,YAAY,IAAK,CACnCQ,EAAM,gBAAgBP,CAAK,CAC7B,EAAG,CAACO,EAAOP,CAAK,CAAC,EAEX,CAAE,WAAAa,CAAY,EAAGC,EAAAA,SAAS,CAAE,CAAA,EAC5B,CAAE,WAAAC,EAAY,eAAAC,GAAmBC,EAAAA,eACjC,CAAE,WAAAC,CAAY,EAAGC,EAAAA,SAAS,CAC9B,QAASP,CACV,CAAA,EAEKQ,EAAab,EAAM,eAAiBP,EAEpCqB,EAAWD,EAAa,EAAI,GAElC,OACEE,OAAO,QAAA,CAAA,UAAWC,EAAK,KAAA,CAAE,WAAY,SAAU,EAAC,SAAA,CAC9CtB,EAACuB,IAAAA,EAAAA,eAAc,CAAA,SACbvB,EAAAA,gBACMwB,EAAWP,WAAAA,EAAYH,EAAYF,CAAU,EACjD,IAAKF,EACL,KAAK,QACL,QAASS,EACT,SAAUC,EACV,aAEa,CAAA,EACjBpB,EAAAA,IAACC,EAAAA,KAAI,CACH,eAAe,SACf,WAAW,SACX,YAAY,QACZ,YAAac,GAAkBI,EAAa,aAAe,gBAC3D,WAAW,yBACX,aAAa,aACb,aAAcJ,EAAiB,QAAU,OACzC,aAAa,QACb,cAAe,GACf,OAAQ,CAAE,YAAa,cACvB,OAAO,UACP,EAAG,EACH,EAAG,EACH,QAAQ,qBACI,OAAM,SAEjBI,GAAcnB,EAACyB,IAAAA,EAAAA,OAAM,CAAC,KAAM,EAAG,GAAG,YAAY,CAAA,IAEjDzB,EAAC0B,IAAAA,EAAAA,IAAI,CAAA,GAAI,EAAC,SACR1B,EAAAA,IAAC2B,EAAAA,SAAK,KAAK,KAAK,OAAQ,CAAE,WAAY,KACnC,SAAAtB,GAEC,CAAA,CAAA,CAAA,CAAA,CAGZ,CAAC,EAEDlB,EAAW,YAAc,aACzBe,EAAM,YAAc"}
+{"version":3,"file":"radio.js","sources":["../../../../src/components/primitives/radio.tsx"],"sourcesContent":["import Text from '@components/primitives/text';\nimport { Box, Circle, Flex } from '@styled/jsx';\nimport { flex } from '@styled/patterns';\nimport { PropsWithChildren, createContext, forwardRef, useCallback, useContext, useRef } from 'react';\nimport {\n  AriaRadioGroupProps,\n  AriaRadioProps,\n  VisuallyHidden,\n  mergeProps,\n  useFocusRing,\n  useHover,\n  usePress,\n} from 'react-aria';\n\nexport interface RadioGroupProps extends AriaRadioGroupProps, PropsWithChildren {\n  onChange: (value: string) => void;\n  selectedValue?: string;\n  vertical?: boolean;\n}\n\nexport interface RadioProps extends AriaRadioProps {\n  label?: string;\n}\n\nconst RadioContext = createContext<{\n  selectedValue: string | undefined;\n  setSelectedValue: (value: string) => void;\n}>({\n  selectedValue: undefined,\n  setSelectedValue: () => {},\n});\n\nexport const RadioGroup = (props: RadioGroupProps) => {\n  const { children, onChange, selectedValue, vertical } = props;\n\n  const handleSelect = useCallback(\n    (value: string) => {\n      onChange(value);\n    },\n    [onChange],\n  );\n\n  return (\n    <Flex direction={vertical ? 'column' : 'row'} gap={vertical ? 5 : 10} role=\"radiogroup\">\n      <RadioContext.Provider value={{ selectedValue, setSelectedValue: handleSelect }}>\n        {children}\n      </RadioContext.Provider>\n    </Flex>\n  );\n};\n\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>((props, forwardedRef) => {\n  const { label, value } = props;\n  const state = useContext(RadioContext);\n\n  const internalRef = useRef<HTMLInputElement>(null);\n  const ref = forwardedRef || internalRef;\n\n  const handlePress = useCallback(() => {\n    state.setSelectedValue(value);\n  }, [state, value]);\n\n  const { hoverProps } = useHover({});\n  const { focusProps, isFocusVisible } = useFocusRing();\n  const { pressProps } = usePress({\n    onPress: handlePress,\n  });\n\n  const isSelected = state.selectedValue === value;\n\n  const tabIndex = isSelected ? 0 : -1;\n\n  return (\n    <label className={flex({ alignItems: 'center' })}>\n      <VisuallyHidden>\n        <input\n          {...mergeProps(pressProps, focusProps, hoverProps)}\n          ref={ref}\n          type=\"radio\"\n          checked={isSelected}\n          tabIndex={tabIndex}\n          readOnly\n        />\n      </VisuallyHidden>\n      <Flex\n        justifyContent=\"center\"\n        alignItems=\"center\"\n        borderWidth=\"thick\"\n        borderColor={isFocusVisible || isSelected ? 'brand.base' : 'text.tertiary'}\n        transition=\"border-color 0.2s ease\"\n        outlineColor=\"brand.base\"\n        outlineStyle={isFocusVisible ? 'solid' : 'none'}\n        outlineWidth=\"thick\"\n        outlineOffset={0.5}\n        _hover={{ borderColor: 'brand.base' }}\n        cursor=\"pointer\"\n        w={6}\n        h={6}\n        rounded=\"full\"\n        aria-hidden=\"true\"\n      >\n        {isSelected && <Circle size={3} bg=\"brand.base\" />}\n      </Flex>\n      <Box ml={3}>\n        <Text size=\"lg\" styles={{ fontWeight: 500 }}>\n          {label}\n        </Text>\n      </Box>\n    </label>\n  );\n});\n\nRadioGroup.displayName = 'RadioGroup';\nRadio.displayName = 'Radio';\n"],"names":["RadioContext","createContext","RadioGroup","props","children","onChange","selectedValue","vertical","handleSelect","useCallback","value","_jsx","Flex","Radio","forwardRef","forwardedRef","label","state","useContext","internalRef","useRef","ref","handlePress","hoverProps","useHover","focusProps","isFocusVisible","useFocusRing","pressProps","usePress","isSelected","tabIndex","_jsxs","flex","VisuallyHidden","mergeProps","Circle","Box","Text"],"mappings":"yKAwBA,MAAMA,EAAeC,EAAAA,cAGlB,CACD,cAAe,OACf,iBAAkB,IAAK,CACxB,CAAA,CAAA,EAEYC,EAAcC,GAA0B,CACnD,KAAM,CAAE,SAAAC,EAAU,SAAAC,EAAU,cAAAC,EAAe,SAAAC,CAAQ,EAAKJ,EAElDK,EAAeC,EAAAA,YAClBC,GAAiB,CAChBL,EAASK,CAAK,CAChB,EACA,CAACL,CAAQ,CAAC,EAGZ,OACEM,EAACC,IAAAA,EAAAA,KAAI,CAAC,UAAWL,EAAW,SAAW,MAAO,IAAKA,EAAW,EAAI,GAAI,KAAK,aAAY,SACrFI,MAACX,EAAa,SAAQ,CAAC,MAAO,CAAE,cAAAM,EAAe,iBAAkBE,CAAY,WAC1EJ,CAAQ,CAAA,CAEN,CAAA,CAEX,EAEaS,EAAQC,EAAAA,WAAyC,CAACX,EAAOY,IAAgB,CACpF,KAAM,CAAE,MAAAC,EAAO,MAAAN,CAAO,EAAGP,EACnBc,EAAQC,EAAWlB,WAAAA,CAAY,EAE/BmB,EAAcC,EAAAA,OAAyB,IAAI,EAC3CC,EAAMN,GAAgBI,EAEtBG,EAAcb,EAAAA,YAAY,IAAK,CACnCQ,EAAM,iBAAiBP,CAAK,CAC9B,EAAG,CAACO,EAAOP,CAAK,CAAC,EAEX,CAAE,WAAAa,CAAY,EAAGC,EAAS,SAAA,CAAE,CAAA,EAC5B,CAAE,WAAAC,EAAY,eAAAC,GAAmBC,iBACjC,CAAE,WAAAC,CAAY,EAAGC,WAAS,CAC9B,QAASP,CACV,CAAA,EAEKQ,EAAab,EAAM,gBAAkBP,EAErCqB,EAAWD,EAAa,EAAI,GAElC,OACEE,EAAAA,KAAO,QAAA,CAAA,UAAWC,EAAK,KAAA,CAAE,WAAY,SAAU,EAAC,SAAA,CAC9CtB,EAAAA,IAACuB,iBAAc,CAAA,SACbvB,kBACMwB,EAAAA,WAAWP,EAAYH,EAAYF,CAAU,EACjD,IAAKF,EACL,KAAK,QACL,QAASS,EACT,SAAUC,EACV,aAEa,CAAA,EACjBpB,EAACC,IAAAA,EAAAA,KAAI,CACH,eAAe,SACf,WAAW,SACX,YAAY,QACZ,YAAac,GAAkBI,EAAa,aAAe,gBAC3D,WAAW,yBACX,aAAa,aACb,aAAcJ,EAAiB,QAAU,OACzC,aAAa,QACb,cAAe,GACf,OAAQ,CAAE,YAAa,cACvB,OAAO,UACP,EAAG,EACH,EAAG,EACH,QAAQ,qBACI,OAAM,SAEjBI,GAAcnB,EAAAA,IAACyB,EAAAA,OAAM,CAAC,KAAM,EAAG,GAAG,YAAY,CAAA,IAEjDzB,EAAAA,IAAC0B,EAAI,IAAA,CAAA,GAAI,EAAC,SACR1B,EAAC2B,IAAAA,EAAAA,SAAK,KAAK,KAAK,OAAQ,CAAE,WAAY,KACnC,SAAAtB,GAEC,CAAA,CAAA,CAAA,CAAA,CAGZ,CAAC,EAEDd,EAAW,YAAc,aACzBW,EAAM,YAAc"}

package/dist/cjs/components/sections/verify-pincode.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime");require("../feedback/callout.js");var j=require("../feedback/loading-spinner.js"),m=require("@styled/tokens"),v=require("../icons/ico-checkmark-circle-fill.js");require("../primitives/button.js"),require("../primitives/checkbox.js"),require("../primitives/popover.js"),require("../primitives/radio.js"),require("../primitives/segmented-control.js"),require("../primitives/switch.js");var C=require("../primitives/text.js");require("../primitives/portal.js"),require("react"),require("../../hooks/useToast.js"),require("../../recipes/toast.js");var n=require("@styled/jsx");require("../feedback/tooltip.js"),require("../inputs/dropdown-selector.js"),require("../inputs/phone-input.js");var k=require("../inputs/pincode-input.js");require("../inputs/text-input.js");var t=require("create-slots");const o=t.createSlot(({children:r})=>r),S=r=>{const{isPending:s,isSuccess:u,onChange:a,onComplete:c,originName:q,pinLength:d,id:l,autoFocus:g,errorMessage:i,children:h}=r,p=()=>s?e.jsx(j.LoadingSpinner,{size:36,strokeWidth:4}):u?e.jsx(v.default,{color:m.token("colors.brand.base"),width:36,height:36}):e.jsx(k.PinCodeInput,{originName:q,onChange:a,pinLength:d,onComplete:c,id:l,autoFocus:g});return t.createHost(h,x=>e.jsxs(n.VStack,{gap:3,my:3,children:[e.jsx(n.Center,{height:12,children:p()}),i&&e.jsx(C.default,{variant:"error",size:"sm",styles:{textAlign:"center"},children:i}),x.get(o)]}))},y=Object.assign(S,{RetryContent:o});exports.VerifyPincode=y;
+"use strict";var e=require("react/jsx-runtime");require("../feedback/callout.js");var j=require("../feedback/loading-spinner.js"),m=require("@styled/tokens"),v=require("../icons/ico-checkmark-circle-fill.js");require("../primitives/button.js"),require("../primitives/checkbox.js"),require("../primitives/dropdown-selector.js"),require("../primitives/popover.js"),require("../primitives/radio.js"),require("../primitives/segmented-control.js"),require("../primitives/switch.js");var C=require("../primitives/text.js");require("../primitives/portal.js"),require("react"),require("../../hooks/useToast.js"),require("../../recipes/toast.js");var n=require("@styled/jsx");require("../feedback/tooltip.js"),require("../inputs/phone-input.js");var k=require("../inputs/pincode-input.js");require("../inputs/text-input.js");var t=require("create-slots");const o=t.createSlot(({children:r})=>r),S=r=>{const{isPending:s,isSuccess:u,onChange:a,onComplete:c,originName:q,pinLength:d,id:l,autoFocus:g,errorMessage:i,children:h}=r,p=()=>s?e.jsx(j.LoadingSpinner,{size:36,strokeWidth:4}):u?e.jsx(v.default,{color:m.token("colors.brand.base"),width:36,height:36}):e.jsx(k.PinCodeInput,{originName:q,onChange:a,pinLength:d,onComplete:c,id:l,autoFocus:g});return t.createHost(h,x=>e.jsxs(n.VStack,{gap:3,my:3,children:[e.jsx(n.Center,{height:12,children:p()}),i&&e.jsx(C.default,{variant:"error",size:"sm",styles:{textAlign:"center"},children:i}),x.get(o)]}))},y=Object.assign(S,{RetryContent:o});exports.VerifyPincode=y;
 //# sourceMappingURL=verify-pincode.js.map

package/dist/cjs/components/sections/verify-pincode.js.map

@@ -1 +1 @@
-{"version":3,"file":"verify-pincode.js","sources":["../../../../src/components/sections/verify-pincode.tsx"],"sourcesContent":["import { LoadingSpinner } from '@components/feedback';\nimport { IcoCheckmarkCircleFill } from '@components/icons';\nimport { PinCodeInput, PinCodeInputProps } from '@components/inputs';\nimport { Text } from '@components/primitives';\nimport { Center, VStack } from '@styled/jsx';\nimport { token } from '@styled/tokens';\nimport { createHost, createSlot } from 'create-slots';\n\nexport interface VerifyPincodeProps extends PinCodeInputProps {\n  isPending: boolean;\n  isSuccess: boolean;\n  errorMessage?: string;\n  children?: React.ReactNode;\n}\n\nconst RetryContent = createSlot(({ children }) => {\n  return children;\n});\n\nconst VerifyPincodeHost = (props: VerifyPincodeProps) => {\n  const { isPending, isSuccess, onChange, onComplete, originName, pinLength, id, autoFocus, errorMessage, children } =\n    props;\n\n  const renderPincodeOrStatus = () => {\n    if (isPending) return <LoadingSpinner size={36} strokeWidth={4} />;\n\n    if (isSuccess) return <IcoCheckmarkCircleFill color={token('colors.brand.base')} width={36} height={36} />;\n\n    return (\n      <PinCodeInput\n        originName={originName}\n        onChange={onChange}\n        pinLength={pinLength}\n        onComplete={onComplete}\n        id={id}\n        // eslint-disable-next-line jsx-a11y/no-autofocus\n        autoFocus={autoFocus}\n      />\n    );\n  };\n\n  return createHost(children, slots => {\n    return (\n      <VStack gap={3} my={3}>\n        <Center height={12}>{renderPincodeOrStatus()}</Center>\n        {errorMessage && (\n          <Text variant=\"error\" size=\"sm\" styles={{ textAlign: 'center' }}>\n            {errorMessage}\n          </Text>\n        )}\n        {slots.get(RetryContent)}\n      </VStack>\n    );\n  });\n};\n\nexport const VerifyPincode = Object.assign(VerifyPincodeHost, { RetryContent });\n"],"names":["RetryContent","createSlot","children","VerifyPincodeHost","props","isPending","isSuccess","onChange","onComplete","originName","pinLength","id","autoFocus","errorMessage","renderPincodeOrStatus","_jsx","LoadingSpinner","IcoCheckmarkCircleFill","token","PinCodeInput","createHost","slots","_jsxs","VStack","Center","Text","VerifyPincode"],"mappings":"00BAeA,MAAMA,EAAeC,EAAAA,WAAW,CAAC,CAAE,SAAAC,CAAU,IACpCA,CACR,EAEKC,EAAqBC,GAA6B,CACtD,KAAM,CAAE,UAAAC,EAAW,UAAAC,EAAW,SAAAC,EAAU,WAAAC,EAAY,WAAAC,EAAY,UAAAC,EAAW,GAAAC,EAAI,UAAAC,EAAW,aAAAC,EAAc,SAAAX,CAAQ,EAC9GE,EAEIU,EAAwB,IACxBT,EAAkBU,EAAAA,IAACC,iBAAc,CAAC,KAAM,GAAI,YAAa,CAAC,CAAA,EAE1DV,EAAkBS,MAACE,EAAAA,QAAsB,CAAC,MAAOC,EAAAA,MAAM,mBAAmB,EAAG,MAAO,GAAI,OAAQ,KAGlGH,MAACI,EAAY,aAAA,CACX,WAAYV,EACZ,SAAUF,EACV,UAAWG,EACX,WAAYF,EACZ,GAAIG,EAEJ,UAAWC,CACX,CAAA,EAIN,OAAOQ,EAAAA,WAAWlB,EAAUmB,GAExBC,EAAAA,KAACC,SAAO,CAAA,IAAK,EAAG,GAAI,EAClB,SAAA,CAAAR,EAAAA,IAACS,EAAAA,OAAO,CAAA,OAAQ,GAAK,SAAAV,GAAuB,CAAA,EAC3CD,GACCE,EAAAA,IAACU,WAAK,QAAQ,QAAQ,KAAK,KAAK,OAAQ,CAAE,UAAW,QAAU,EAAA,SAC5DZ,CAAY,CAAA,EAGhBQ,EAAM,IAAIrB,CAAY,CAAC,CACjB,CAAA,CAEZ,CACH,EAEa0B,EAAgB,OAAO,OAAOvB,EAAmB,CAAE,aAAAH,CAAY,CAAE"}
+{"version":3,"file":"verify-pincode.js","sources":["../../../../src/components/sections/verify-pincode.tsx"],"sourcesContent":["import { LoadingSpinner } from '@components/feedback';\nimport { IcoCheckmarkCircleFill } from '@components/icons';\nimport { PinCodeInput, PinCodeInputProps } from '@components/inputs';\nimport { Text } from '@components/primitives';\nimport { Center, VStack } from '@styled/jsx';\nimport { token } from '@styled/tokens';\nimport { createHost, createSlot } from 'create-slots';\n\nexport interface VerifyPincodeProps extends PinCodeInputProps {\n  isPending: boolean;\n  isSuccess: boolean;\n  errorMessage?: string;\n  children?: React.ReactNode;\n}\n\nconst RetryContent = createSlot(({ children }) => {\n  return children;\n});\n\nconst VerifyPincodeHost = (props: VerifyPincodeProps) => {\n  const { isPending, isSuccess, onChange, onComplete, originName, pinLength, id, autoFocus, errorMessage, children } =\n    props;\n\n  const renderPincodeOrStatus = () => {\n    if (isPending) return <LoadingSpinner size={36} strokeWidth={4} />;\n\n    if (isSuccess) return <IcoCheckmarkCircleFill color={token('colors.brand.base')} width={36} height={36} />;\n\n    return (\n      <PinCodeInput\n        originName={originName}\n        onChange={onChange}\n        pinLength={pinLength}\n        onComplete={onComplete}\n        id={id}\n        // eslint-disable-next-line jsx-a11y/no-autofocus\n        autoFocus={autoFocus}\n      />\n    );\n  };\n\n  return createHost(children, slots => {\n    return (\n      <VStack gap={3} my={3}>\n        <Center height={12}>{renderPincodeOrStatus()}</Center>\n        {errorMessage && (\n          <Text variant=\"error\" size=\"sm\" styles={{ textAlign: 'center' }}>\n            {errorMessage}\n          </Text>\n        )}\n        {slots.get(RetryContent)}\n      </VStack>\n    );\n  });\n};\n\nexport const VerifyPincode = Object.assign(VerifyPincodeHost, { RetryContent });\n"],"names":["RetryContent","createSlot","children","VerifyPincodeHost","props","isPending","isSuccess","onChange","onComplete","originName","pinLength","id","autoFocus","errorMessage","renderPincodeOrStatus","_jsx","LoadingSpinner","IcoCheckmarkCircleFill","token","PinCodeInput","createHost","slots","_jsxs","VStack","Center","Text","VerifyPincode"],"mappings":"80BAeA,MAAMA,EAAeC,EAAAA,WAAW,CAAC,CAAE,SAAAC,CAAU,IACpCA,CACR,EAEKC,EAAqBC,GAA6B,CACtD,KAAM,CAAE,UAAAC,EAAW,UAAAC,EAAW,SAAAC,EAAU,WAAAC,EAAY,WAAAC,EAAY,UAAAC,EAAW,GAAAC,EAAI,UAAAC,EAAW,aAAAC,EAAc,SAAAX,CAAQ,EAC9GE,EAEIU,EAAwB,IACxBT,EAAkBU,EAAAA,IAACC,iBAAc,CAAC,KAAM,GAAI,YAAa,CAAC,CAAA,EAE1DV,EAAkBS,MAACE,EAAAA,QAAsB,CAAC,MAAOC,EAAAA,MAAM,mBAAmB,EAAG,MAAO,GAAI,OAAQ,KAGlGH,MAACI,EAAY,aAAA,CACX,WAAYV,EACZ,SAAUF,EACV,UAAWG,EACX,WAAYF,EACZ,GAAIG,EAEJ,UAAWC,CACX,CAAA,EAIN,OAAOQ,EAAAA,WAAWlB,EAAUmB,GAExBC,EAAAA,KAACC,SAAO,CAAA,IAAK,EAAG,GAAI,EAClB,SAAA,CAAAR,EAAAA,IAACS,EAAAA,OAAO,CAAA,OAAQ,GAAK,SAAAV,GAAuB,CAAA,EAC3CD,GACCE,EAAAA,IAACU,WAAK,QAAQ,QAAQ,KAAK,KAAK,OAAQ,CAAE,UAAW,QAAU,EAAA,SAC5DZ,CAAY,CAAA,EAGhBQ,EAAM,IAAIrB,CAAY,CAAC,CACjB,CAAA,CAEZ,CACH,EAEa0B,EAAgB,OAAO,OAAOvB,EAAmB,CAAE,aAAAH,CAAY,CAAE"}

package/dist/cjs/index.js

@@ -1,2 +1,2 @@
-"use strict";var i=require("./components/containers/content.js"),l=require("./components/containers/drawer.js"),u=require("./components/containers/footer.js"),t=require("./components/containers/header.js"),c=require("./components/containers/modal.js"),n=require("./components/containers/overlay.js"),d=require("./components/external/paypal-button.js"),f=require("./components/external/social-login-button.js"),v=require("./components/feedback/callout.js"),q=require("./components/feedback/loading-spinner.js"),e=require("./components/feedback/toast-provider.js"),g=require("./components/feedback/tooltip.js"),s=require("./components/icons/ico-add.js"),L=require("./components/icons/ico-alert-circle-fill.js"),M=require("./components/icons/ico-alert-circle.js"),k=require("./components/icons/ico-arrow-down.js"),I=require("./components/icons/ico-arrow-left.js"),m=require("./components/icons/ico-arrow-right.js"),p=require("./components/icons/ico-asterisk.js"),w=require("./components/icons/ico-astronaut.js"),b=require("./components/icons/ico-bank.js"),C=require("./components/icons/ico-bell-notification.js"),h=require("./components/icons/ico-bell.js"),B=require("./components/icons/ico-branding.js"),F=require("./components/icons/ico-caret-down.js"),P=require("./components/icons/ico-caret-left.js"),A=require("./components/icons/ico-caret-right.js"),y=require("./components/icons/ico-caret-up.js"),S=require("./components/icons/ico-checkmark-circle-fill.js"),T=require("./components/icons/ico-checkmark-circle.js"),W=require("./components/icons/ico-checkmark.js"),D=require("./components/icons/ico-code-editor.js"),E=require("./components/icons/ico-code-sandbox.js"),G=require("./components/icons/ico-code.js"),x=require("./components/icons/ico-command-line.js"),O=require("./components/icons/ico-comment.js"),R=require("./components/icons/ico-copy.js"),H=require("./components/icons/ico-credit-card.js"),Z=require("./components/icons/ico-dedicated.js"),N=require("./components/icons/ico-diamond.js"),z=require("./components/icons/ico-dismiss-circle-fill.js"),X=require("./components/icons/ico-dismiss-circle.js"),j=require("./components/icons/ico-dismiss.js"),U=require("./components/icons/ico-doc.js"),V=require("./components/icons/ico-download.js"),Q=require("./components/icons/ico-edit-email.js"),J=require("./components/icons/ico-edit.js"),K=require("./components/icons/ico-email-fill.js"),_=require("./components/icons/ico-email-open.js"),Y=require("./components/icons/ico-email.js"),$=require("./components/icons/ico-expiration.js"),ee=require("./components/icons/ico-external-link.js"),re=require("./components/icons/ico-eye-closed.js"),oe=require("./components/icons/ico-eye-opened.js"),ae=require("./components/icons/ico-fingerprint-fill.js"),ie=require("./components/icons/ico-fingerprint.js"),le=require("./components/icons/ico-gas.js"),ue=require("./components/icons/ico-gift.js"),te=require("./components/icons/ico-globe.js"),ce=require("./components/icons/ico-guide.js"),ne=require("./components/icons/ico-home.js"),de=require("./components/icons/ico-hourglass.js"),fe=require("./components/icons/ico-info-circle-fill.js"),ve=require("./components/icons/ico-info-circle.js"),qe=require("./components/icons/ico-key.js"),ge=require("./components/icons/ico-lightbulb-fill.js"),se=require("./components/icons/ico-lightbulb.js"),Le=require("./components/icons/ico-lightning-fill.js"),Me=require("./components/icons/ico-lightning.js"),ke=require("./components/icons/ico-link.js"),Ie=require("./components/icons/ico-loading.js"),me=require("./components/icons/ico-lock-locked.js"),pe=require("./components/icons/ico-lock-password.js"),we=require("./components/icons/ico-lock-unlocked.js"),be=require("./components/icons/ico-login-form.js"),Ce=require("./components/icons/ico-magic.js"),he=require("./components/icons/ico-menu.js"),Be=require("./components/icons/ico-message-fill.js"),Fe=require("./components/icons/ico-message.js"),Pe=require("./components/icons/ico-mfa.js"),Ae=require("./components/icons/ico-mobile2fa.js"),ye=require("./components/icons/ico-mobile2fafill.js"),Se=require("./components/icons/ico-open-book.js"),Te=require("./components/icons/ico-paper-plane.js"),We=require("./components/icons/ico-passport.js"),De=require("./components/icons/ico-passwordless.js"),Ee=require("./components/icons/ico-pending-connection.js"),Ge=require("./components/icons/ico-phone.js"),xe=require("./components/icons/ico-price.js"),Oe=require("./components/icons/ico-qrcode.js"),Re=require("./components/icons/ico-question-circle-fill.js"),He=require("./components/icons/ico-question-circle.js"),Ze=require("./components/icons/ico-refresh-circle-fill.js"),Ne=require("./components/icons/ico-refresh.js"),ze=require("./components/icons/ico-rocket-fill.js"),Xe=require("./components/icons/ico-search.js"),je=require("./components/icons/ico-settings.js"),Ue=require("./components/icons/ico-shield-approved.js"),Ve=require("./components/icons/ico-shield-rejected.js"),Qe=require("./components/icons/ico-shield.js"),Je=require("./components/icons/ico-social.js"),Ke=require("./components/icons/ico-sold-out-tag.js"),_e=require("./components/icons/ico-star.js"),Ye=require("./components/icons/ico-swap.js"),$e=require("./components/icons/ico-swatches.js"),er=require("./components/icons/ico-team.js"),rr=require("./components/icons/ico-users.js"),or=require("./components/icons/ico-wallet-fill.js"),ar=require("./components/icons/ico-wallet.js"),ir=require("./components/icons/ico-wand.js"),lr=require("./components/icons/ico-warning-fill.js"),ur=require("./components/icons/ico-warning.js"),tr=require("./components/icons/ico-widget-ui.js"),cr=require("./components/info/copy-button.js"),nr=require("./components/info/email-wbr.js"),dr=require("./components/info/security-otp.js"),fr=require("./components/info/text-box.js"),vr=require("./components/info/wallet-address.js"),r=require("./components/inputs/dropdown-selector.js"),qr=require("./components/inputs/phone-input.js"),gr=require("./components/inputs/pincode-input.js"),sr=require("./components/inputs/text-input.js"),Lr=require("./components/layouts/dialogue.js"),Mr=require("./components/layouts/error.js"),kr=require("./components/layouts/page.js"),Ir=require("./components/list-items/navigation-button.js"),mr=require("./components/list-items/nft-tile.js"),pr=require("./components/list-items/token-list-item.js"),wr=require("./components/logos/blc-algorand.js"),br=require("./components/logos/blc-aptos.js"),Cr=require("./components/logos/blc-arbitrum.js"),hr=require("./components/logos/blc-astar.js"),Br=require("./components/logos/blc-avalanche.js"),Fr=require("./components/logos/blc-base.js"),Pr=require("./components/logos/blc-berachain.js"),Ar=require("./components/logos/blc-binance.js"),yr=require("./components/logos/blc-bitcoin.js"),Sr=require("./components/logos/blc-celo.js"),Tr=require("./components/logos/blc-chiliz.js"),Wr=require("./components/logos/blc-cosmos.js"),Dr=require("./components/logos/blc-ethereum.js"),Er=require("./components/logos/blc-etherlink.js"),Gr=require("./components/logos/blc-flow.js"),xr=require("./components/logos/blc-harmony.js"),Or=require("./components/logos/blc-icon.js"),Rr=require("./components/logos/blc-immutable-x.js"),Hr=require("./components/logos/blc-loopring.js"),Zr=require("./components/logos/blc-moonbeam.js"),Nr=require("./components/logos/blc-near.js"),zr=require("./components/logos/blc-optimism.js"),Xr=require("./components/logos/blc-polkadot.js"),jr=require("./components/logos/blc-polygon.js"),Ur=require("./components/logos/blc-rarichain.js"),Vr=require("./components/logos/blc-solana.js"),Qr=require("./components/logos/blc-stability.js"),Jr=require("./components/logos/blc-sui.js"),Kr=require("./components/logos/blc-tezos.js"),_r=require("./components/logos/blc-wax.js"),Yr=require("./components/logos/blc-zetachain.js"),$r=require("./components/logos/blc-zilliqa.js"),eo=require("./components/logos/blc-zksync.js"),ro=require("./components/logos/fwk-11ty.js"),oo=require("./components/logos/fwk-android.js"),ao=require("./components/logos/fwk-apple.js"),io=require("./components/logos/fwk-authy.js"),lo=require("./components/logos/fwk-binance-fill.js"),uo=require("./components/logos/fwk-chrome.js"),to=require("./components/logos/fwk-electron.js"),co=require("./components/logos/fwk-express.js"),no=require("./components/logos/fwk-fauna.js"),fo=require("./components/logos/fwk-firebase.js"),vo=require("./components/logos/fwk-go.js"),qo=require("./components/logos/fwk-google-authenticator.js"),go=require("./components/logos/fwk-hasura.js"),so=require("./components/logos/fwk-javascript.js"),Lo=require("./components/logos/fwk-jwt.js"),Mo=require("./components/logos/fwk-laravel.js"),ko=require("./components/logos/fwk-nextjs.js"),Io=require("./components/logos/fwk-nodejs.js"),mo=require("./components/logos/fwk-nuxtjs.js"),po=require("./components/logos/fwk-php.js"),wo=require("./components/logos/fwk-react.js"),bo=require("./components/logos/fwk-strapi.js"),Co=require("./components/logos/fwk-stripe.js"),ho=require("./components/logos/fwk-vue.js"),Bo=require("./components/logos/fwk-webflow.js"),Fo=require("./components/logos/fwk-wordpress.js"),Po=require("./components/logos/fwk-zapier.js"),Ao=require("./components/logos/icon-art-dark.js"),yo=require("./components/logos/icon-art.js"),So=require("./components/logos/icon-game-controller-dark.js"),To=require("./components/logos/icon-game-controller.js"),Wo=require("./components/logos/icon-generic-token.js"),Do=require("./components/logos/icon-magic-logo.js"),Eo=require("./components/logos/icon-music-dark.js"),Go=require("./components/logos/icon-music.js"),xo=require("./components/logos/icon-profile-dark.js"),Oo=require("./components/logos/icon-profile-light.js"),Ro=require("./components/logos/icon-ticket-dark.js"),Ho=require("./components/logos/icon-ticket.js"),Zo=require("./components/logos/logo-algorand-mono.js"),No=require("./components/logos/logo-algorand.js"),zo=require("./components/logos/logo-apple-mono.js"),Xo=require("./components/logos/logo-apple.js"),jo=require("./components/logos/logo-aptos-mono.js"),Uo=require("./components/logos/logo-aptos.js"),Vo=require("./components/logos/logo-arbitrum-mono.js"),Qo=require("./components/logos/logo-arbitrum-one-mono.js"),Jo=require("./components/logos/logo-arbitrum-one.js"),Ko=require("./components/logos/logo-arbitrum.js"),_o=require("./components/logos/logo-astar-mono.js"),Yo=require("./components/logos/logo-astar.js"),$o=require("./components/logos/logo-avalanche-mono.js"),ea=require("./components/logos/logo-avalanche.js"),ra=require("./components/logos/logo-base-mono.js"),oa=require("./components/logos/logo-base.js"),aa=require("./components/logos/logo-berachain-mono.js"),ia=require("./components/logos/logo-berachain.js"),la=require("./components/logos/logo-binance-mono.js"),ua=require("./components/logos/logo-binance.js"),ta=require("./components/logos/logo-bit-bucket-mono.js"),ca=require("./components/logos/logo-bit-bucket.js"),na=require("./components/logos/logo-bitcoin-mono.js"),da=require("./components/logos/logo-bitcoin.js"),fa=require("./components/logos/logo-bnb-mono.js"),va=require("./components/logos/logo-bnb.js"),qa=require("./components/logos/logo-celo-mono.js"),ga=require("./components/logos/logo-celo.js"),sa=require("./components/logos/logo-chiliz-mono.js"),La=require("./components/logos/logo-chiliz.js"),Ma=require("./components/logos/logo-cosmos-mono.js"),ka=require("./components/logos/logo-cosmos.js"),Ia=require("./components/logos/logo-discord-mono.js"),ma=require("./components/logos/logo-discord.js"),pa=require("./components/logos/logo-ethereum-mono.js"),wa=require("./components/logos/logo-ethereum.js"),ba=require("./components/logos/logo-etherlink-mono.js"),Ca=require("./components/logos/logo-etherlink.js"),ha=require("./components/logos/logo-facebook-mono.js"),Ba=require("./components/logos/logo-facebook.js"),Fa=require("./components/logos/logo-flare-mono.js"),Pa=require("./components/logos/logo-flare.js"),Aa=require("./components/logos/logo-flow-mono.js"),ya=require("./components/logos/logo-flow.js"),Sa=require("./components/logos/logo-git-hub-mono.js"),Ta=require("./components/logos/logo-git-hub.js"),Wa=require("./components/logos/logo-git-lab-mono.js"),Da=require("./components/logos/logo-git-lab.js"),Ea=require("./components/logos/logo-google-mono.js"),Ga=require("./components/logos/logo-google.js"),xa=require("./components/logos/logo-harmony-mono.js"),Oa=require("./components/logos/logo-harmony.js"),Ra=require("./components/logos/logo-horizen-mono.js"),Ha=require("./components/logos/logo-horizen.js"),Za=require("./components/logos/logo-icon-mono.js"),Na=require("./components/logos/logo-icon.js"),za=require("./components/logos/logo-immutable-x-mono.js"),Xa=require("./components/logos/logo-immutable-x.js"),ja=require("./components/logos/logo-link-by-stripe-mono.js"),Ua=require("./components/logos/logo-link-by-stripe.js"),Va=require("./components/logos/logo-link-mono.js"),Qa=require("./components/logos/logo-link.js"),Ja=require("./components/logos/logo-linked-in-mono.js"),Ka=require("./components/logos/logo-linked-in.js"),_a=require("./components/logos/logo-loopring-mono.js"),Ya=require("./components/logos/logo-loopring.js"),$a=require("./components/logos/logo-microsoft-mono.js"),ei=require("./components/logos/logo-microsoft.js"),ri=require("./components/logos/logo-moonbeam-mono.js"),oi=require("./components/logos/logo-moonbeam.js"),ai=require("./components/logos/logo-near-mono.js"),ii=require("./components/logos/logo-near.js"),li=require("./components/logos/logo-onramper-mono.js"),ui=require("./components/logos/logo-onramper.js"),ti=require("./components/logos/logo-optimism-mono.js"),ci=require("./components/logos/logo-optimism.js"),ni=require("./components/logos/logo-pay-pal-mono.js"),di=require("./components/logos/logo-pay-pal-wordmark-mono.js"),fi=require("./components/logos/logo-pay-pal-wordmark.js"),vi=require("./components/logos/logo-pay-pal.js"),qi=require("./components/logos/logo-poa-mono.js"),gi=require("./components/logos/logo-poa.js"),si=require("./components/logos/logo-polkadot-mono.js"),Li=require("./components/logos/logo-polkadot.js"),Mi=require("./components/logos/logo-polygon-mono.js"),ki=require("./components/logos/logo-polygon.js"),Ii=require("./components/logos/logo-rarichain-mono.js"),mi=require("./components/logos/logo-rarichain.js"),pi=require("./components/logos/logo-sardine-mono.js"),wi=require("./components/logos/logo-sardine.js"),bi=require("./components/logos/logo-sei-mono.js"),Ci=require("./components/logos/logo-sei.js"),hi=require("./components/logos/logo-solana-mono.js"),Bi=require("./components/logos/logo-solana.js"),Fi=require("./components/logos/logo-stability-mono.js"),Pi=require("./components/logos/logo-stability.js"),Ai=require("./components/logos/logo-sui-mono.js"),yi=require("./components/logos/logo-sui.js"),Si=require("./components/logos/logo-tezos-mono.js"),Ti=require("./components/logos/logo-tezos.js"),Wi=require("./components/logos/logo-twitch-mono.js"),Di=require("./components/logos/logo-twitch.js"),Ei=require("./components/logos/logo-twitter-mono.js"),Gi=require("./components/logos/logo-twitter.js"),xi=require("./components/logos/logo-wallet-connect-mono.js"),Oi=require("./components/logos/logo-wallet-connect.js"),Ri=require("./components/logos/logo-warpcast-mono.js"),Hi=require("./components/logos/logo-warpcast.js"),Zi=require("./components/logos/logo-wax-mono.js"),Ni=require("./components/logos/logo-wax.js"),zi=require("./components/logos/logo-xdc-mono.js"),Xi=require("./components/logos/logo-xdc.js"),ji=require("./components/logos/logo-zetachain-mono.js"),Ui=require("./components/logos/logo-zetachain.js"),Vi=require("./components/logos/logo-zilliqa-mono.js"),Qi=require("./components/logos/logo-zilliqa.js"),Ji=require("./components/logos/logo-zksync-mono.js"),Ki=require("./components/logos/logo-zksync.js"),_i=require("./components/logos/pay-amex.js"),Yi=require("./components/logos/pay-discover.js"),$i=require("./components/logos/pay-mastercard.js"),el=require("./components/logos/pay-visa.js"),rl=require("./components/logos/presentation-logo.js"),ol=require("./components/logos/wlt-coinbase.js"),al=require("./components/logos/wlt-mattel.js"),il=require("./components/logos/wlt-metamask.js"),ll=require("./components/logos/wlt-phantom.js"),ul=require("./components/logos/wlt-rainbow.js"),tl=require("./components/logos/wlt-wallet-connect.js"),cl=require("./components/primitives/button.js"),nl=require("./components/primitives/checkbox.js"),dl=require("./components/primitives/popover.js"),o=require("./components/primitives/radio.js"),a=require("./components/primitives/segmented-control.js"),fl=require("./components/primitives/switch.js"),vl=require("./components/primitives/text.js"),ql=require("./components/sections/verify-pincode.js"),gl=require("./components/utils/animate.js"),sl=require("./components/utils/client-asset-logo.js"),Ll=require("./components/utils/qr-code.js"),Ml=require("./components/utils/secured-by-magic.js"),kl=require("./components/utils/shared-logo.js"),Il=require("./hooks/theme.js"),ml=require("./hooks/useToast.js");exports.Content=i.Content,exports.Drawer=l.Drawer,exports.Footer=u.Footer,exports.Header=t.Header,exports.Modal=c.Modal,exports.Overlay=n.Overlay,exports.PayPalButton=d.PayPalButton,exports.SocialLoginButton=f.SocialLoginButton,exports.Callout=v.Callout,exports.LoadingSpinner=q.LoadingSpinner,exports.Toast=e.Toast,exports.ToastProvider=e.ToastProvider,exports.Tooltip=g.default,exports.IcoAdd=s.default,exports.IcoAlertCircleFill=L.default,exports.IcoAlertCircle=M.default,exports.IcoArrowDown=k.default,exports.IcoArrowLeft=I.default,exports.IcoArrowRight=m.default,exports.IcoAsterisk=p.default,exports.IcoAstronaut=w.default,exports.IcoBank=b.default,exports.IcoBellNotification=C.default,exports.IcoBell=h.default,exports.IcoBranding=B.default,exports.IcoCaretDown=F.default,exports.IcoCaretLeft=P.default,exports.IcoCaretRight=A.default,exports.IcoCaretUp=y.default,exports.IcoCheckmarkCircleFill=S.default,exports.IcoCheckmarkCircle=T.default,exports.IcoCheckmark=W.default,exports.IcoCodeEditor=D.default,exports.IcoCodeSandbox=E.default,exports.IcoCode=G.default,exports.IcoCommandLine=x.default,exports.IcoComment=O.default,exports.IcoCopy=R.default,exports.IcoCreditCard=H.default,exports.IcoDedicated=Z.default,exports.IcoDiamond=N.default,exports.IcoDismissCircleFill=z.default,exports.IcoDismissCircle=X.default,exports.IcoDismiss=j.default,exports.IcoDoc=U.default,exports.IcoDownload=V.default,exports.IcoEditEmail=Q.default,exports.IcoEdit=J.default,exports.IcoEmailFill=K.default,exports.IcoEmailOpen=_.default,exports.IcoEmail=Y.default,exports.IcoExpiration=$.default,exports.IcoExternalLink=ee.default,exports.IcoEyeClosed=re.default,exports.IcoEyeOpened=oe.default,exports.IcoFingerprintFill=ae.default,exports.IcoFingerprint=ie.default,exports.IcoGas=le.default,exports.IcoGift=ue.default,exports.IcoGlobe=te.default,exports.IcoGuide=ce.default,exports.IcoHome=ne.default,exports.IcoHourglass=de.default,exports.IcoInfoCircleFill=fe.default,exports.IcoInfoCircle=ve.default,exports.IcoKey=qe.default,exports.IcoLightbulbFill=ge.default,exports.IcoLightbulb=se.default,exports.IcoLightningFill=Le.default,exports.IcoLightning=Me.default,exports.IcoLink=ke.default,exports.IcoLoading=Ie.default,exports.IcoLockLocked=me.default,exports.IcoLockPassword=pe.default,exports.IcoLockUnlocked=we.default,exports.IcoLoginForm=be.default,exports.IcoMagic=Ce.default,exports.IcoMenu=he.default,exports.IcoMessageFill=Be.default,exports.IcoMessage=Fe.default,exports.IcoMfa=Pe.default,exports.IcoMobile2fa=Ae.default,exports.IcoMobile2fafill=ye.default,exports.IcoOpenBook=Se.default,exports.IcoPaperPlane=Te.default,exports.IcoPassport=We.default,exports.IcoPasswordless=De.default,exports.IcoPendingConnection=Ee.default,exports.IcoPhone=Ge.default,exports.IcoPrice=xe.default,exports.IcoQrcode=Oe.default,exports.IcoQuestionCircleFill=Re.default,exports.IcoQuestionCircle=He.default,exports.IcoRefreshCircleFill=Ze.default,exports.IcoRefresh=Ne.default,exports.IcoRocketFill=ze.default,exports.IcoSearch=Xe.default,exports.IcoSettings=je.default,exports.IcoShieldApproved=Ue.default,exports.IcoShieldRejected=Ve.default,exports.IcoShield=Qe.default,exports.IcoSocial=Je.default,exports.IcoSoldOutTag=Ke.default,exports.IcoStar=_e.default,exports.IcoSwap=Ye.default,exports.IcoSwatches=$e.default,exports.IcoTeam=er.default,exports.IcoUsers=rr.default,exports.IcoWalletFill=or.default,exports.IcoWallet=ar.default,exports.IcoWand=ir.default,exports.IcoWarningFill=lr.default,exports.IcoWarning=ur.default,exports.IcoWidgetUi=tr.default,exports.CopyButton=cr.default,exports.EmailWbr=nr.default,exports.SecurityOtp=dr.default,exports.TextBox=fr.default,exports.WalletAddress=vr.default,exports.DropdownOption=r.DropdownOption,exports.DropdownSelector=r.DropdownSelector,exports.PhoneInput=qr.default,exports.PinCodeInput=gr.PinCodeInput,exports.TextInput=sr.TextInput,exports.Dialogue=Lr.Dialogue,exports.Error=Mr.Error,exports.Page=kr.Page,exports.NavigationButton=Ir.default,exports.NFTTile=mr.NFTTile,exports.TokenListItem=pr.TokenListItem,exports.BlcAlgorand=wr.default,exports.BlcAptos=br.default,exports.BlcArbitrum=Cr.default,exports.BlcAstar=hr.default,exports.BlcAvalanche=Br.default,exports.BlcBase=Fr.default,exports.BlcBerachain=Pr.default,exports.BlcBinance=Ar.default,exports.BlcBitcoin=yr.default,exports.BlcCelo=Sr.default,exports.BlcChiliz=Tr.default,exports.BlcCosmos=Wr.default,exports.BlcEthereum=Dr.default,exports.BlcEtherlink=Er.default,exports.BlcFlow=Gr.default,exports.BlcHarmony=xr.default,exports.BlcIcon=Or.default,exports.BlcImmutableX=Rr.default,exports.BlcLoopring=Hr.default,exports.BlcMoonbeam=Zr.default,exports.BlcNear=Nr.default,exports.BlcOptimism=zr.default,exports.BlcPolkadot=Xr.default,exports.BlcPolygon=jr.default,exports.BlcRarichain=Ur.default,exports.BlcSolana=Vr.default,exports.BlcStability=Qr.default,exports.BlcSui=Jr.default,exports.BlcTezos=Kr.default,exports.BlcWax=_r.default,exports.BlcZetachain=Yr.default,exports.BlcZilliqa=$r.default,exports.BlcZksync=eo.default,exports.Fwk11ty=ro.default,exports.FwkAndroid=oo.default,exports.FwkApple=ao.default,exports.FwkAuthy=io.default,exports.FwkBinanceFill=lo.default,exports.FwkChrome=uo.default,exports.FwkElectron=to.default,exports.FwkExpress=co.default,exports.FwkFauna=no.default,exports.FwkFirebase=fo.default,exports.FwkGo=vo.default,exports.FwkGoogleAuthenticator=qo.default,exports.FwkHasura=go.default,exports.FwkJavascript=so.default,exports.FwkJwt=Lo.default,exports.FwkLaravel=Mo.default,exports.FwkNextjs=ko.default,exports.FwkNodejs=Io.default,exports.FwkNuxtjs=mo.default,exports.FwkPhp=po.default,exports.FwkReact=wo.default,exports.FwkStrapi=bo.default,exports.FwkStripe=Co.default,exports.FwkVue=ho.default,exports.FwkWebflow=Bo.default,exports.FwkWordpress=Fo.default,exports.FwkZapier=Po.default,exports.IconArtDark=Ao.default,exports.IconArt=yo.default,exports.IconGameControllerDark=So.default,exports.IconGameController=To.default,exports.IconGenericToken=Wo.default,exports.IconMagicLogo=Do.default,exports.IconMusicDark=Eo.default,exports.IconMusic=Go.default,exports.IconProfileDark=xo.default,exports.IconProfileLight=Oo.default,exports.IconTicketDark=Ro.default,exports.IconTicket=Ho.default,exports.LogoAlgorandMono=Zo.default,exports.LogoAlgorand=No.default,exports.LogoAppleMono=zo.default,exports.LogoApple=Xo.default,exports.LogoAptosMono=jo.default,exports.LogoAptos=Uo.default,exports.LogoArbitrumMono=Vo.default,exports.LogoArbitrumOneMono=Qo.default,exports.LogoArbitrumOne=Jo.default,exports.LogoArbitrum=Ko.default,exports.LogoAstarMono=_o.default,exports.LogoAstar=Yo.default,exports.LogoAvalancheMono=$o.default,exports.LogoAvalanche=ea.default,exports.LogoBaseMono=ra.default,exports.LogoBase=oa.default,exports.LogoBerachainMono=aa.default,exports.LogoBerachain=ia.default,exports.LogoBinanceMono=la.default,exports.LogoBinance=ua.default,exports.LogoBitBucketMono=ta.default,exports.LogoBitBucket=ca.default,exports.LogoBitcoinMono=na.default,exports.LogoBitcoin=da.default,exports.LogoBnbMono=fa.default,exports.LogoBnb=va.default,exports.LogoCeloMono=qa.default,exports.LogoCelo=ga.default,exports.LogoChilizMono=sa.default,exports.LogoChiliz=La.default,exports.LogoCosmosMono=Ma.default,exports.LogoCosmos=ka.default,exports.LogoDiscordMono=Ia.default,exports.LogoDiscord=ma.default,exports.LogoEthereumMono=pa.default,exports.LogoEthereum=wa.default,exports.LogoEtherlinkMono=ba.default,exports.LogoEtherlink=Ca.default,exports.LogoFacebookMono=ha.default,exports.LogoFacebook=Ba.default,exports.LogoFlareMono=Fa.default,exports.LogoFlare=Pa.default,exports.LogoFlowMono=Aa.default,exports.LogoFlow=ya.default,exports.LogoGitHubMono=Sa.default,exports.LogoGitHub=Ta.default,exports.LogoGitLabMono=Wa.default,exports.LogoGitLab=Da.default,exports.LogoGoogleMono=Ea.default,exports.LogoGoogle=Ga.default,exports.LogoHarmonyMono=xa.default,exports.LogoHarmony=Oa.default,exports.LogoHorizenMono=Ra.default,exports.LogoHorizen=Ha.default,exports.LogoIconMono=Za.default,exports.LogoIcon=Na.default,exports.LogoImmutableXMono=za.default,exports.LogoImmutableX=Xa.default,exports.LogoLinkByStripeMono=ja.default,exports.LogoLinkByStripe=Ua.default,exports.LogoLinkMono=Va.default,exports.LogoLink=Qa.default,exports.LogoLinkedInMono=Ja.default,exports.LogoLinkedIn=Ka.default,exports.LogoLoopringMono=_a.default,exports.LogoLoopring=Ya.default,exports.LogoMicrosoftMono=$a.default,exports.LogoMicrosoft=ei.default,exports.LogoMoonbeamMono=ri.default,exports.LogoMoonbeam=oi.default,exports.LogoNearMono=ai.default,exports.LogoNear=ii.default,exports.LogoOnramperMono=li.default,exports.LogoOnramper=ui.default,exports.LogoOptimismMono=ti.default,exports.LogoOptimism=ci.default,exports.LogoPayPalMono=ni.default,exports.LogoPayPalWordmarkMono=di.default,exports.LogoPayPalWordmark=fi.default,exports.LogoPayPal=vi.default,exports.LogoPoaMono=qi.default,exports.LogoPoa=gi.default,exports.LogoPolkadotMono=si.default,exports.LogoPolkadot=Li.default,exports.LogoPolygonMono=Mi.default,exports.LogoPolygon=ki.default,exports.LogoRarichainMono=Ii.default,exports.LogoRarichain=mi.default,exports.LogoSardineMono=pi.default,exports.LogoSardine=wi.default,exports.LogoSeiMono=bi.default,exports.LogoSei=Ci.default,exports.LogoSolanaMono=hi.default,exports.LogoSolana=Bi.default,exports.LogoStabilityMono=Fi.default,exports.LogoStability=Pi.default,exports.LogoSuiMono=Ai.default,exports.LogoSui=yi.default,exports.LogoTezosMono=Si.default,exports.LogoTezos=Ti.default,exports.LogoTwitchMono=Wi.default,exports.LogoTwitch=Di.default,exports.LogoTwitterMono=Ei.default,exports.LogoTwitter=Gi.default,exports.LogoWalletConnectMono=xi.default,exports.LogoWalletConnect=Oi.default,exports.LogoWarpcastMono=Ri.default,exports.LogoWarpcast=Hi.default,exports.LogoWaxMono=Zi.default,exports.LogoWax=Ni.default,exports.LogoXdcMono=zi.default,exports.LogoXdc=Xi.default,exports.LogoZetachainMono=ji.default,exports.LogoZetachain=Ui.default,exports.LogoZilliqaMono=Vi.default,exports.LogoZilliqa=Qi.default,exports.LogoZksyncMono=Ji.default,exports.LogoZksync=Ki.default,exports.PayAmex=_i.default,exports.PayDiscover=Yi.default,exports.PayMastercard=$i.default,exports.PayVisa=el.default,exports.PresentationLogo=rl.default,exports.WltCoinbase=ol.default,exports.WltMattel=al.default,exports.WltMetamask=il.default,exports.WltPhantom=ll.default,exports.WltRainbow=ul.default,exports.WltWalletConnect=tl.default,exports.Button=cl.default,exports.Checkbox=nl.default,exports.Popover=dl.Popover,exports.Radio=o.Radio,exports.RadioGroup=o.RadioGroup,exports.SegmentedControl=a.SegmentedControl,exports.Tab=a.Tab,exports.Switch=fl.default,exports.Text=vl.default,exports.VerifyPincode=ql.VerifyPincode,exports.Animate=gl.default,exports.ClientAssetLogo=sl.ClientAssetLogo,exports.QRCode=Ll.default,exports.SecuredByMagic=Ml.default,exports.SharedLogo=kl.default,exports.useCustomVars=Il.useCustomVars,exports.useToast=ml.useToast;
+"use strict";var i=require("./components/containers/content.js"),l=require("./components/containers/drawer.js"),u=require("./components/containers/footer.js"),t=require("./components/containers/header.js"),c=require("./components/containers/modal.js"),n=require("./components/containers/overlay.js"),d=require("./components/external/paypal-button.js"),f=require("./components/external/social-login-button.js"),v=require("./components/feedback/callout.js"),q=require("./components/feedback/loading-spinner.js"),e=require("./components/feedback/toast-provider.js"),g=require("./components/feedback/tooltip.js"),s=require("./components/icons/ico-add.js"),L=require("./components/icons/ico-alert-circle-fill.js"),M=require("./components/icons/ico-alert-circle.js"),k=require("./components/icons/ico-arrow-down.js"),I=require("./components/icons/ico-arrow-left.js"),m=require("./components/icons/ico-arrow-right.js"),p=require("./components/icons/ico-asterisk.js"),w=require("./components/icons/ico-astronaut.js"),b=require("./components/icons/ico-bank.js"),C=require("./components/icons/ico-bell-notification.js"),h=require("./components/icons/ico-bell.js"),B=require("./components/icons/ico-branding.js"),F=require("./components/icons/ico-caret-down.js"),P=require("./components/icons/ico-caret-left.js"),A=require("./components/icons/ico-caret-right.js"),y=require("./components/icons/ico-caret-up.js"),S=require("./components/icons/ico-checkmark-circle-fill.js"),T=require("./components/icons/ico-checkmark-circle.js"),W=require("./components/icons/ico-checkmark.js"),D=require("./components/icons/ico-code-editor.js"),E=require("./components/icons/ico-code-sandbox.js"),G=require("./components/icons/ico-code.js"),x=require("./components/icons/ico-command-line.js"),O=require("./components/icons/ico-comment.js"),R=require("./components/icons/ico-copy.js"),H=require("./components/icons/ico-credit-card.js"),Z=require("./components/icons/ico-dedicated.js"),N=require("./components/icons/ico-diamond.js"),z=require("./components/icons/ico-dismiss-circle-fill.js"),X=require("./components/icons/ico-dismiss-circle.js"),j=require("./components/icons/ico-dismiss.js"),U=require("./components/icons/ico-doc.js"),V=require("./components/icons/ico-download.js"),Q=require("./components/icons/ico-edit-email.js"),J=require("./components/icons/ico-edit.js"),K=require("./components/icons/ico-email-fill.js"),_=require("./components/icons/ico-email-open.js"),Y=require("./components/icons/ico-email.js"),$=require("./components/icons/ico-expiration.js"),ee=require("./components/icons/ico-external-link.js"),re=require("./components/icons/ico-eye-closed.js"),oe=require("./components/icons/ico-eye-opened.js"),ae=require("./components/icons/ico-fingerprint-fill.js"),ie=require("./components/icons/ico-fingerprint.js"),le=require("./components/icons/ico-gas.js"),ue=require("./components/icons/ico-gift.js"),te=require("./components/icons/ico-globe.js"),ce=require("./components/icons/ico-guide.js"),ne=require("./components/icons/ico-home.js"),de=require("./components/icons/ico-hourglass.js"),fe=require("./components/icons/ico-info-circle-fill.js"),ve=require("./components/icons/ico-info-circle.js"),qe=require("./components/icons/ico-key.js"),ge=require("./components/icons/ico-lightbulb-fill.js"),se=require("./components/icons/ico-lightbulb.js"),Le=require("./components/icons/ico-lightning-fill.js"),Me=require("./components/icons/ico-lightning.js"),ke=require("./components/icons/ico-link.js"),Ie=require("./components/icons/ico-loading.js"),me=require("./components/icons/ico-lock-locked.js"),pe=require("./components/icons/ico-lock-password.js"),we=require("./components/icons/ico-lock-unlocked.js"),be=require("./components/icons/ico-login-form.js"),Ce=require("./components/icons/ico-magic.js"),he=require("./components/icons/ico-menu.js"),Be=require("./components/icons/ico-message-fill.js"),Fe=require("./components/icons/ico-message.js"),Pe=require("./components/icons/ico-mfa.js"),Ae=require("./components/icons/ico-mobile2fa.js"),ye=require("./components/icons/ico-mobile2fafill.js"),Se=require("./components/icons/ico-open-book.js"),Te=require("./components/icons/ico-paper-plane.js"),We=require("./components/icons/ico-passport.js"),De=require("./components/icons/ico-passwordless.js"),Ee=require("./components/icons/ico-pending-connection.js"),Ge=require("./components/icons/ico-phone.js"),xe=require("./components/icons/ico-price.js"),Oe=require("./components/icons/ico-qrcode.js"),Re=require("./components/icons/ico-question-circle-fill.js"),He=require("./components/icons/ico-question-circle.js"),Ze=require("./components/icons/ico-refresh-circle-fill.js"),Ne=require("./components/icons/ico-refresh.js"),ze=require("./components/icons/ico-rocket-fill.js"),Xe=require("./components/icons/ico-search.js"),je=require("./components/icons/ico-settings.js"),Ue=require("./components/icons/ico-shield-approved.js"),Ve=require("./components/icons/ico-shield-rejected.js"),Qe=require("./components/icons/ico-shield.js"),Je=require("./components/icons/ico-social.js"),Ke=require("./components/icons/ico-sold-out-tag.js"),_e=require("./components/icons/ico-star.js"),Ye=require("./components/icons/ico-swap.js"),$e=require("./components/icons/ico-swatches.js"),er=require("./components/icons/ico-team.js"),rr=require("./components/icons/ico-users.js"),or=require("./components/icons/ico-wallet-fill.js"),ar=require("./components/icons/ico-wallet.js"),ir=require("./components/icons/ico-wand.js"),lr=require("./components/icons/ico-warning-fill.js"),ur=require("./components/icons/ico-warning.js"),tr=require("./components/icons/ico-widget-ui.js"),cr=require("./components/info/copy-button.js"),nr=require("./components/info/email-wbr.js"),dr=require("./components/info/security-otp.js"),fr=require("./components/info/text-box.js"),vr=require("./components/info/wallet-address.js"),qr=require("./components/inputs/phone-input.js"),gr=require("./components/inputs/pincode-input.js"),sr=require("./components/inputs/text-input.js"),Lr=require("./components/layouts/dialogue.js"),Mr=require("./components/layouts/error.js"),kr=require("./components/layouts/page.js"),Ir=require("./components/list-items/navigation-button.js"),mr=require("./components/list-items/nft-tile.js"),pr=require("./components/list-items/token-list-item.js"),wr=require("./components/logos/blc-algorand.js"),br=require("./components/logos/blc-aptos.js"),Cr=require("./components/logos/blc-arbitrum.js"),hr=require("./components/logos/blc-astar.js"),Br=require("./components/logos/blc-avalanche.js"),Fr=require("./components/logos/blc-base.js"),Pr=require("./components/logos/blc-berachain.js"),Ar=require("./components/logos/blc-binance.js"),yr=require("./components/logos/blc-bitcoin.js"),Sr=require("./components/logos/blc-celo.js"),Tr=require("./components/logos/blc-chiliz.js"),Wr=require("./components/logos/blc-cosmos.js"),Dr=require("./components/logos/blc-ethereum.js"),Er=require("./components/logos/blc-etherlink.js"),Gr=require("./components/logos/blc-flow.js"),xr=require("./components/logos/blc-harmony.js"),Or=require("./components/logos/blc-icon.js"),Rr=require("./components/logos/blc-immutable-x.js"),Hr=require("./components/logos/blc-loopring.js"),Zr=require("./components/logos/blc-moonbeam.js"),Nr=require("./components/logos/blc-near.js"),zr=require("./components/logos/blc-optimism.js"),Xr=require("./components/logos/blc-polkadot.js"),jr=require("./components/logos/blc-polygon.js"),Ur=require("./components/logos/blc-rarichain.js"),Vr=require("./components/logos/blc-solana.js"),Qr=require("./components/logos/blc-stability.js"),Jr=require("./components/logos/blc-sui.js"),Kr=require("./components/logos/blc-tezos.js"),_r=require("./components/logos/blc-wax.js"),Yr=require("./components/logos/blc-zetachain.js"),$r=require("./components/logos/blc-zilliqa.js"),eo=require("./components/logos/blc-zksync.js"),ro=require("./components/logos/fwk-11ty.js"),oo=require("./components/logos/fwk-android.js"),ao=require("./components/logos/fwk-apple.js"),io=require("./components/logos/fwk-authy.js"),lo=require("./components/logos/fwk-binance-fill.js"),uo=require("./components/logos/fwk-chrome.js"),to=require("./components/logos/fwk-electron.js"),co=require("./components/logos/fwk-express.js"),no=require("./components/logos/fwk-fauna.js"),fo=require("./components/logos/fwk-firebase.js"),vo=require("./components/logos/fwk-go.js"),qo=require("./components/logos/fwk-google-authenticator.js"),go=require("./components/logos/fwk-hasura.js"),so=require("./components/logos/fwk-javascript.js"),Lo=require("./components/logos/fwk-jwt.js"),Mo=require("./components/logos/fwk-laravel.js"),ko=require("./components/logos/fwk-nextjs.js"),Io=require("./components/logos/fwk-nodejs.js"),mo=require("./components/logos/fwk-nuxtjs.js"),po=require("./components/logos/fwk-php.js"),wo=require("./components/logos/fwk-react.js"),bo=require("./components/logos/fwk-strapi.js"),Co=require("./components/logos/fwk-stripe.js"),ho=require("./components/logos/fwk-vue.js"),Bo=require("./components/logos/fwk-webflow.js"),Fo=require("./components/logos/fwk-wordpress.js"),Po=require("./components/logos/fwk-zapier.js"),Ao=require("./components/logos/icon-art-dark.js"),yo=require("./components/logos/icon-art.js"),So=require("./components/logos/icon-game-controller-dark.js"),To=require("./components/logos/icon-game-controller.js"),Wo=require("./components/logos/icon-generic-token.js"),Do=require("./components/logos/icon-magic-logo.js"),Eo=require("./components/logos/icon-music-dark.js"),Go=require("./components/logos/icon-music.js"),xo=require("./components/logos/icon-profile-dark.js"),Oo=require("./components/logos/icon-profile-light.js"),Ro=require("./components/logos/icon-ticket-dark.js"),Ho=require("./components/logos/icon-ticket.js"),Zo=require("./components/logos/logo-algorand-mono.js"),No=require("./components/logos/logo-algorand.js"),zo=require("./components/logos/logo-apple-mono.js"),Xo=require("./components/logos/logo-apple.js"),jo=require("./components/logos/logo-aptos-mono.js"),Uo=require("./components/logos/logo-aptos.js"),Vo=require("./components/logos/logo-arbitrum-mono.js"),Qo=require("./components/logos/logo-arbitrum-one-mono.js"),Jo=require("./components/logos/logo-arbitrum-one.js"),Ko=require("./components/logos/logo-arbitrum.js"),_o=require("./components/logos/logo-astar-mono.js"),Yo=require("./components/logos/logo-astar.js"),$o=require("./components/logos/logo-avalanche-mono.js"),ea=require("./components/logos/logo-avalanche.js"),ra=require("./components/logos/logo-base-mono.js"),oa=require("./components/logos/logo-base.js"),aa=require("./components/logos/logo-berachain-mono.js"),ia=require("./components/logos/logo-berachain.js"),la=require("./components/logos/logo-binance-mono.js"),ua=require("./components/logos/logo-binance.js"),ta=require("./components/logos/logo-bit-bucket-mono.js"),ca=require("./components/logos/logo-bit-bucket.js"),na=require("./components/logos/logo-bitcoin-mono.js"),da=require("./components/logos/logo-bitcoin.js"),fa=require("./components/logos/logo-bnb-mono.js"),va=require("./components/logos/logo-bnb.js"),qa=require("./components/logos/logo-celo-mono.js"),ga=require("./components/logos/logo-celo.js"),sa=require("./components/logos/logo-chiliz-mono.js"),La=require("./components/logos/logo-chiliz.js"),Ma=require("./components/logos/logo-cosmos-mono.js"),ka=require("./components/logos/logo-cosmos.js"),Ia=require("./components/logos/logo-discord-mono.js"),ma=require("./components/logos/logo-discord.js"),pa=require("./components/logos/logo-ethereum-mono.js"),wa=require("./components/logos/logo-ethereum.js"),ba=require("./components/logos/logo-etherlink-mono.js"),Ca=require("./components/logos/logo-etherlink.js"),ha=require("./components/logos/logo-facebook-mono.js"),Ba=require("./components/logos/logo-facebook.js"),Fa=require("./components/logos/logo-flare-mono.js"),Pa=require("./components/logos/logo-flare.js"),Aa=require("./components/logos/logo-flow-mono.js"),ya=require("./components/logos/logo-flow.js"),Sa=require("./components/logos/logo-git-hub-mono.js"),Ta=require("./components/logos/logo-git-hub.js"),Wa=require("./components/logos/logo-git-lab-mono.js"),Da=require("./components/logos/logo-git-lab.js"),Ea=require("./components/logos/logo-google-mono.js"),Ga=require("./components/logos/logo-google.js"),xa=require("./components/logos/logo-harmony-mono.js"),Oa=require("./components/logos/logo-harmony.js"),Ra=require("./components/logos/logo-horizen-mono.js"),Ha=require("./components/logos/logo-horizen.js"),Za=require("./components/logos/logo-icon-mono.js"),Na=require("./components/logos/logo-icon.js"),za=require("./components/logos/logo-immutable-x-mono.js"),Xa=require("./components/logos/logo-immutable-x.js"),ja=require("./components/logos/logo-link-by-stripe-mono.js"),Ua=require("./components/logos/logo-link-by-stripe.js"),Va=require("./components/logos/logo-link-mono.js"),Qa=require("./components/logos/logo-link.js"),Ja=require("./components/logos/logo-linked-in-mono.js"),Ka=require("./components/logos/logo-linked-in.js"),_a=require("./components/logos/logo-loopring-mono.js"),Ya=require("./components/logos/logo-loopring.js"),$a=require("./components/logos/logo-microsoft-mono.js"),ei=require("./components/logos/logo-microsoft.js"),ri=require("./components/logos/logo-moonbeam-mono.js"),oi=require("./components/logos/logo-moonbeam.js"),ai=require("./components/logos/logo-near-mono.js"),ii=require("./components/logos/logo-near.js"),li=require("./components/logos/logo-onramper-mono.js"),ui=require("./components/logos/logo-onramper.js"),ti=require("./components/logos/logo-optimism-mono.js"),ci=require("./components/logos/logo-optimism.js"),ni=require("./components/logos/logo-pay-pal-mono.js"),di=require("./components/logos/logo-pay-pal-wordmark-mono.js"),fi=require("./components/logos/logo-pay-pal-wordmark.js"),vi=require("./components/logos/logo-pay-pal.js"),qi=require("./components/logos/logo-poa-mono.js"),gi=require("./components/logos/logo-poa.js"),si=require("./components/logos/logo-polkadot-mono.js"),Li=require("./components/logos/logo-polkadot.js"),Mi=require("./components/logos/logo-polygon-mono.js"),ki=require("./components/logos/logo-polygon.js"),Ii=require("./components/logos/logo-rarichain-mono.js"),mi=require("./components/logos/logo-rarichain.js"),pi=require("./components/logos/logo-sardine-mono.js"),wi=require("./components/logos/logo-sardine.js"),bi=require("./components/logos/logo-sei-mono.js"),Ci=require("./components/logos/logo-sei.js"),hi=require("./components/logos/logo-solana-mono.js"),Bi=require("./components/logos/logo-solana.js"),Fi=require("./components/logos/logo-stability-mono.js"),Pi=require("./components/logos/logo-stability.js"),Ai=require("./components/logos/logo-sui-mono.js"),yi=require("./components/logos/logo-sui.js"),Si=require("./components/logos/logo-tezos-mono.js"),Ti=require("./components/logos/logo-tezos.js"),Wi=require("./components/logos/logo-twitch-mono.js"),Di=require("./components/logos/logo-twitch.js"),Ei=require("./components/logos/logo-twitter-mono.js"),Gi=require("./components/logos/logo-twitter.js"),xi=require("./components/logos/logo-wallet-connect-mono.js"),Oi=require("./components/logos/logo-wallet-connect.js"),Ri=require("./components/logos/logo-warpcast-mono.js"),Hi=require("./components/logos/logo-warpcast.js"),Zi=require("./components/logos/logo-wax-mono.js"),Ni=require("./components/logos/logo-wax.js"),zi=require("./components/logos/logo-xdc-mono.js"),Xi=require("./components/logos/logo-xdc.js"),ji=require("./components/logos/logo-zetachain-mono.js"),Ui=require("./components/logos/logo-zetachain.js"),Vi=require("./components/logos/logo-zilliqa-mono.js"),Qi=require("./components/logos/logo-zilliqa.js"),Ji=require("./components/logos/logo-zksync-mono.js"),Ki=require("./components/logos/logo-zksync.js"),_i=require("./components/logos/pay-amex.js"),Yi=require("./components/logos/pay-discover.js"),$i=require("./components/logos/pay-mastercard.js"),el=require("./components/logos/pay-visa.js"),rl=require("./components/logos/presentation-logo.js"),ol=require("./components/logos/wlt-coinbase.js"),al=require("./components/logos/wlt-mattel.js"),il=require("./components/logos/wlt-metamask.js"),ll=require("./components/logos/wlt-phantom.js"),ul=require("./components/logos/wlt-rainbow.js"),tl=require("./components/logos/wlt-wallet-connect.js"),cl=require("./components/primitives/button.js"),nl=require("./components/primitives/checkbox.js"),r=require("./components/primitives/dropdown-selector.js"),dl=require("./components/primitives/popover.js"),o=require("./components/primitives/radio.js"),a=require("./components/primitives/segmented-control.js"),fl=require("./components/primitives/switch.js"),vl=require("./components/primitives/text.js"),ql=require("./components/sections/verify-pincode.js"),gl=require("./components/utils/animate.js"),sl=require("./components/utils/client-asset-logo.js"),Ll=require("./components/utils/qr-code.js"),Ml=require("./components/utils/secured-by-magic.js"),kl=require("./components/utils/shared-logo.js"),Il=require("./hooks/theme.js"),ml=require("./hooks/useToast.js");exports.Content=i.Content,exports.Drawer=l.Drawer,exports.Footer=u.Footer,exports.Header=t.Header,exports.Modal=c.Modal,exports.Overlay=n.Overlay,exports.PayPalButton=d.PayPalButton,exports.SocialLoginButton=f.SocialLoginButton,exports.Callout=v.Callout,exports.LoadingSpinner=q.LoadingSpinner,exports.Toast=e.Toast,exports.ToastProvider=e.ToastProvider,exports.Tooltip=g.default,exports.IcoAdd=s.default,exports.IcoAlertCircleFill=L.default,exports.IcoAlertCircle=M.default,exports.IcoArrowDown=k.default,exports.IcoArrowLeft=I.default,exports.IcoArrowRight=m.default,exports.IcoAsterisk=p.default,exports.IcoAstronaut=w.default,exports.IcoBank=b.default,exports.IcoBellNotification=C.default,exports.IcoBell=h.default,exports.IcoBranding=B.default,exports.IcoCaretDown=F.default,exports.IcoCaretLeft=P.default,exports.IcoCaretRight=A.default,exports.IcoCaretUp=y.default,exports.IcoCheckmarkCircleFill=S.default,exports.IcoCheckmarkCircle=T.default,exports.IcoCheckmark=W.default,exports.IcoCodeEditor=D.default,exports.IcoCodeSandbox=E.default,exports.IcoCode=G.default,exports.IcoCommandLine=x.default,exports.IcoComment=O.default,exports.IcoCopy=R.default,exports.IcoCreditCard=H.default,exports.IcoDedicated=Z.default,exports.IcoDiamond=N.default,exports.IcoDismissCircleFill=z.default,exports.IcoDismissCircle=X.default,exports.IcoDismiss=j.default,exports.IcoDoc=U.default,exports.IcoDownload=V.default,exports.IcoEditEmail=Q.default,exports.IcoEdit=J.default,exports.IcoEmailFill=K.default,exports.IcoEmailOpen=_.default,exports.IcoEmail=Y.default,exports.IcoExpiration=$.default,exports.IcoExternalLink=ee.default,exports.IcoEyeClosed=re.default,exports.IcoEyeOpened=oe.default,exports.IcoFingerprintFill=ae.default,exports.IcoFingerprint=ie.default,exports.IcoGas=le.default,exports.IcoGift=ue.default,exports.IcoGlobe=te.default,exports.IcoGuide=ce.default,exports.IcoHome=ne.default,exports.IcoHourglass=de.default,exports.IcoInfoCircleFill=fe.default,exports.IcoInfoCircle=ve.default,exports.IcoKey=qe.default,exports.IcoLightbulbFill=ge.default,exports.IcoLightbulb=se.default,exports.IcoLightningFill=Le.default,exports.IcoLightning=Me.default,exports.IcoLink=ke.default,exports.IcoLoading=Ie.default,exports.IcoLockLocked=me.default,exports.IcoLockPassword=pe.default,exports.IcoLockUnlocked=we.default,exports.IcoLoginForm=be.default,exports.IcoMagic=Ce.default,exports.IcoMenu=he.default,exports.IcoMessageFill=Be.default,exports.IcoMessage=Fe.default,exports.IcoMfa=Pe.default,exports.IcoMobile2fa=Ae.default,exports.IcoMobile2fafill=ye.default,exports.IcoOpenBook=Se.default,exports.IcoPaperPlane=Te.default,exports.IcoPassport=We.default,exports.IcoPasswordless=De.default,exports.IcoPendingConnection=Ee.default,exports.IcoPhone=Ge.default,exports.IcoPrice=xe.default,exports.IcoQrcode=Oe.default,exports.IcoQuestionCircleFill=Re.default,exports.IcoQuestionCircle=He.default,exports.IcoRefreshCircleFill=Ze.default,exports.IcoRefresh=Ne.default,exports.IcoRocketFill=ze.default,exports.IcoSearch=Xe.default,exports.IcoSettings=je.default,exports.IcoShieldApproved=Ue.default,exports.IcoShieldRejected=Ve.default,exports.IcoShield=Qe.default,exports.IcoSocial=Je.default,exports.IcoSoldOutTag=Ke.default,exports.IcoStar=_e.default,exports.IcoSwap=Ye.default,exports.IcoSwatches=$e.default,exports.IcoTeam=er.default,exports.IcoUsers=rr.default,exports.IcoWalletFill=or.default,exports.IcoWallet=ar.default,exports.IcoWand=ir.default,exports.IcoWarningFill=lr.default,exports.IcoWarning=ur.default,exports.IcoWidgetUi=tr.default,exports.CopyButton=cr.default,exports.EmailWbr=nr.default,exports.SecurityOtp=dr.default,exports.TextBox=fr.default,exports.WalletAddress=vr.default,exports.PhoneInput=qr.default,exports.PinCodeInput=gr.PinCodeInput,exports.TextInput=sr.TextInput,exports.Dialogue=Lr.Dialogue,exports.Error=Mr.Error,exports.Page=kr.Page,exports.NavigationButton=Ir.default,exports.NFTTile=mr.NFTTile,exports.TokenListItem=pr.TokenListItem,exports.BlcAlgorand=wr.default,exports.BlcAptos=br.default,exports.BlcArbitrum=Cr.default,exports.BlcAstar=hr.default,exports.BlcAvalanche=Br.default,exports.BlcBase=Fr.default,exports.BlcBerachain=Pr.default,exports.BlcBinance=Ar.default,exports.BlcBitcoin=yr.default,exports.BlcCelo=Sr.default,exports.BlcChiliz=Tr.default,exports.BlcCosmos=Wr.default,exports.BlcEthereum=Dr.default,exports.BlcEtherlink=Er.default,exports.BlcFlow=Gr.default,exports.BlcHarmony=xr.default,exports.BlcIcon=Or.default,exports.BlcImmutableX=Rr.default,exports.BlcLoopring=Hr.default,exports.BlcMoonbeam=Zr.default,exports.BlcNear=Nr.default,exports.BlcOptimism=zr.default,exports.BlcPolkadot=Xr.default,exports.BlcPolygon=jr.default,exports.BlcRarichain=Ur.default,exports.BlcSolana=Vr.default,exports.BlcStability=Qr.default,exports.BlcSui=Jr.default,exports.BlcTezos=Kr.default,exports.BlcWax=_r.default,exports.BlcZetachain=Yr.default,exports.BlcZilliqa=$r.default,exports.BlcZksync=eo.default,exports.Fwk11ty=ro.default,exports.FwkAndroid=oo.default,exports.FwkApple=ao.default,exports.FwkAuthy=io.default,exports.FwkBinanceFill=lo.default,exports.FwkChrome=uo.default,exports.FwkElectron=to.default,exports.FwkExpress=co.default,exports.FwkFauna=no.default,exports.FwkFirebase=fo.default,exports.FwkGo=vo.default,exports.FwkGoogleAuthenticator=qo.default,exports.FwkHasura=go.default,exports.FwkJavascript=so.default,exports.FwkJwt=Lo.default,exports.FwkLaravel=Mo.default,exports.FwkNextjs=ko.default,exports.FwkNodejs=Io.default,exports.FwkNuxtjs=mo.default,exports.FwkPhp=po.default,exports.FwkReact=wo.default,exports.FwkStrapi=bo.default,exports.FwkStripe=Co.default,exports.FwkVue=ho.default,exports.FwkWebflow=Bo.default,exports.FwkWordpress=Fo.default,exports.FwkZapier=Po.default,exports.IconArtDark=Ao.default,exports.IconArt=yo.default,exports.IconGameControllerDark=So.default,exports.IconGameController=To.default,exports.IconGenericToken=Wo.default,exports.IconMagicLogo=Do.default,exports.IconMusicDark=Eo.default,exports.IconMusic=Go.default,exports.IconProfileDark=xo.default,exports.IconProfileLight=Oo.default,exports.IconTicketDark=Ro.default,exports.IconTicket=Ho.default,exports.LogoAlgorandMono=Zo.default,exports.LogoAlgorand=No.default,exports.LogoAppleMono=zo.default,exports.LogoApple=Xo.default,exports.LogoAptosMono=jo.default,exports.LogoAptos=Uo.default,exports.LogoArbitrumMono=Vo.default,exports.LogoArbitrumOneMono=Qo.default,exports.LogoArbitrumOne=Jo.default,exports.LogoArbitrum=Ko.default,exports.LogoAstarMono=_o.default,exports.LogoAstar=Yo.default,exports.LogoAvalancheMono=$o.default,exports.LogoAvalanche=ea.default,exports.LogoBaseMono=ra.default,exports.LogoBase=oa.default,exports.LogoBerachainMono=aa.default,exports.LogoBerachain=ia.default,exports.LogoBinanceMono=la.default,exports.LogoBinance=ua.default,exports.LogoBitBucketMono=ta.default,exports.LogoBitBucket=ca.default,exports.LogoBitcoinMono=na.default,exports.LogoBitcoin=da.default,exports.LogoBnbMono=fa.default,exports.LogoBnb=va.default,exports.LogoCeloMono=qa.default,exports.LogoCelo=ga.default,exports.LogoChilizMono=sa.default,exports.LogoChiliz=La.default,exports.LogoCosmosMono=Ma.default,exports.LogoCosmos=ka.default,exports.LogoDiscordMono=Ia.default,exports.LogoDiscord=ma.default,exports.LogoEthereumMono=pa.default,exports.LogoEthereum=wa.default,exports.LogoEtherlinkMono=ba.default,exports.LogoEtherlink=Ca.default,exports.LogoFacebookMono=ha.default,exports.LogoFacebook=Ba.default,exports.LogoFlareMono=Fa.default,exports.LogoFlare=Pa.default,exports.LogoFlowMono=Aa.default,exports.LogoFlow=ya.default,exports.LogoGitHubMono=Sa.default,exports.LogoGitHub=Ta.default,exports.LogoGitLabMono=Wa.default,exports.LogoGitLab=Da.default,exports.LogoGoogleMono=Ea.default,exports.LogoGoogle=Ga.default,exports.LogoHarmonyMono=xa.default,exports.LogoHarmony=Oa.default,exports.LogoHorizenMono=Ra.default,exports.LogoHorizen=Ha.default,exports.LogoIconMono=Za.default,exports.LogoIcon=Na.default,exports.LogoImmutableXMono=za.default,exports.LogoImmutableX=Xa.default,exports.LogoLinkByStripeMono=ja.default,exports.LogoLinkByStripe=Ua.default,exports.LogoLinkMono=Va.default,exports.LogoLink=Qa.default,exports.LogoLinkedInMono=Ja.default,exports.LogoLinkedIn=Ka.default,exports.LogoLoopringMono=_a.default,exports.LogoLoopring=Ya.default,exports.LogoMicrosoftMono=$a.default,exports.LogoMicrosoft=ei.default,exports.LogoMoonbeamMono=ri.default,exports.LogoMoonbeam=oi.default,exports.LogoNearMono=ai.default,exports.LogoNear=ii.default,exports.LogoOnramperMono=li.default,exports.LogoOnramper=ui.default,exports.LogoOptimismMono=ti.default,exports.LogoOptimism=ci.default,exports.LogoPayPalMono=ni.default,exports.LogoPayPalWordmarkMono=di.default,exports.LogoPayPalWordmark=fi.default,exports.LogoPayPal=vi.default,exports.LogoPoaMono=qi.default,exports.LogoPoa=gi.default,exports.LogoPolkadotMono=si.default,exports.LogoPolkadot=Li.default,exports.LogoPolygonMono=Mi.default,exports.LogoPolygon=ki.default,exports.LogoRarichainMono=Ii.default,exports.LogoRarichain=mi.default,exports.LogoSardineMono=pi.default,exports.LogoSardine=wi.default,exports.LogoSeiMono=bi.default,exports.LogoSei=Ci.default,exports.LogoSolanaMono=hi.default,exports.LogoSolana=Bi.default,exports.LogoStabilityMono=Fi.default,exports.LogoStability=Pi.default,exports.LogoSuiMono=Ai.default,exports.LogoSui=yi.default,exports.LogoTezosMono=Si.default,exports.LogoTezos=Ti.default,exports.LogoTwitchMono=Wi.default,exports.LogoTwitch=Di.default,exports.LogoTwitterMono=Ei.default,exports.LogoTwitter=Gi.default,exports.LogoWalletConnectMono=xi.default,exports.LogoWalletConnect=Oi.default,exports.LogoWarpcastMono=Ri.default,exports.LogoWarpcast=Hi.default,exports.LogoWaxMono=Zi.default,exports.LogoWax=Ni.default,exports.LogoXdcMono=zi.default,exports.LogoXdc=Xi.default,exports.LogoZetachainMono=ji.default,exports.LogoZetachain=Ui.default,exports.LogoZilliqaMono=Vi.default,exports.LogoZilliqa=Qi.default,exports.LogoZksyncMono=Ji.default,exports.LogoZksync=Ki.default,exports.PayAmex=_i.default,exports.PayDiscover=Yi.default,exports.PayMastercard=$i.default,exports.PayVisa=el.default,exports.PresentationLogo=rl.default,exports.WltCoinbase=ol.default,exports.WltMattel=al.default,exports.WltMetamask=il.default,exports.WltPhantom=ll.default,exports.WltRainbow=ul.default,exports.WltWalletConnect=tl.default,exports.Button=cl.default,exports.Checkbox=nl.default,exports.DropdownOption=r.DropdownOption,exports.DropdownSelector=r.DropdownSelector,exports.Popover=dl.Popover,exports.Radio=o.Radio,exports.RadioGroup=o.RadioGroup,exports.SegmentedControl=a.SegmentedControl,exports.Tab=a.Tab,exports.Switch=fl.default,exports.Text=vl.default,exports.VerifyPincode=ql.VerifyPincode,exports.Animate=gl.default,exports.ClientAssetLogo=sl.ClientAssetLogo,exports.QRCode=Ll.default,exports.SecuredByMagic=Ml.default,exports.SharedLogo=kl.default,exports.useCustomVars=Il.useCustomVars,exports.useToast=ml.useToast;
 //# sourceMappingURL=index.js.map

package/dist/es/components/containers/drawer.js

@@ -1,2 +1,2 @@
-import{jsxs as i,Fragment as w,jsx as r}from"react/jsx-runtime";import"@styled/tokens";import y from"../icons/ico-caret-down.js";import a from"../primitives/button.js";import"../primitives/checkbox.js";import"../primitives/popover.js";import"../primitives/radio.js";import"../primitives/segmented-control.js";import"../primitives/switch.js";import j from"../primitives/text.js";import{Box as s,HStack as k}from"@styled/jsx";import{useState as p,useRef as v,useEffect as c,useCallback as E}from"react";const T=({isOpen:t=!1,title:u,onToggle:o,children:d})=>{const[f,l]=p(t),[b,m]=p(t),n=v(null);c(()=>{let e;return t?(l(!0),e=setTimeout(()=>m(!0),10)):m(!1),()=>clearTimeout(e)},[t]),c(()=>{const e=g=>{n.current&&!n.current.contains(g.target)&&o(!1)};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[o]);const h=()=>{t||l(!1)},x=E(()=>{o(!1)},[o]);return i(w,{children:[r(s,{position:"absolute",display:t?"block":"none",h:"full",bottom:0,left:0,right:0,bg:"text.primary/20",backdropFilter:"blur(3px)"}),f&&i(s,{ref:n,position:"absolute",transform:b?"translateY(0)":"translateY(100%)",transition:"transform 0.3s",bottom:0,left:0,right:0,bg:"surface.primary",rounded:"xl",boxShadow:"0px -12px 56px 0px rgba(119, 118, 122, 0.15)",onTransitionEnd:h,children:[i(k,{justifyContent:"space-between",p:6,pb:5,children:[r(j,{styles:{fontWeight:"bold"},children:u}),r(a,{size:"sm",variant:"neutral",onPress:x,children:r(a.LeadingIcon,{children:r(y,{})})})]}),r(s,{px:6,pb:8,children:d})]})]})};export{T as Drawer};
+import{jsxs as i,Fragment as w,jsx as r}from"react/jsx-runtime";import"@styled/tokens";import y from"../icons/ico-caret-down.js";import a 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 j from"../primitives/text.js";import{Box as s,HStack as k}from"@styled/jsx";import{useState as p,useRef as v,useEffect as c,useCallback as E}from"react";const T=({isOpen:t=!1,title:u,onToggle:e,children:d})=>{const[f,m]=p(t),[b,l]=p(t),n=v(null);c(()=>{let o;return t?(m(!0),o=setTimeout(()=>l(!0),10)):l(!1),()=>clearTimeout(o)},[t]),c(()=>{const o=g=>{n.current&&!n.current.contains(g.target)&&e(!1)};return document.addEventListener("mousedown",o),()=>{document.removeEventListener("mousedown",o)}},[e]);const h=()=>{t||m(!1)},x=E(()=>{e(!1)},[e]);return i(w,{children:[r(s,{position:"absolute",display:t?"block":"none",h:"full",bottom:0,left:0,right:0,bg:"text.primary/20",backdropFilter:"blur(3px)"}),f&&i(s,{ref:n,position:"absolute",transform:b?"translateY(0)":"translateY(100%)",transition:"transform 0.3s",bottom:0,left:0,right:0,bg:"surface.primary",rounded:"xl",boxShadow:"0px -12px 56px 0px rgba(119, 118, 122, 0.15)",onTransitionEnd:h,children:[i(k,{justifyContent:"space-between",p:6,pb:5,children:[r(j,{styles:{fontWeight:"bold"},children:u}),r(a,{size:"sm",variant:"neutral",onPress:x,children:r(a.LeadingIcon,{children:r(y,{})})})]}),r(s,{px:6,pb:8,children:d})]})]})};export{T as Drawer};
 //# sourceMappingURL=drawer.js.map

package/dist/es/components/containers/drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer.js","sources":["../../../../src/components/containers/drawer.tsx"],"sourcesContent":["import { IcoCaretDown } from '@components/icons';\nimport { Button, Text } from '@components/primitives';\nimport { Box, HStack } from '@styled/jsx';\nimport { PropsWithChildren, useCallback, useEffect, useRef, useState } from 'react';\n\nexport interface DrawerProps extends PropsWithChildren {\n  onToggle: (isOpen: boolean) => void;\n  isOpen: boolean;\n  title?: string;\n}\n\nexport const Drawer = ({ isOpen = false, title, onToggle, children }: DrawerProps) => {\n  const [shouldRender, setShouldRender] = useState(isOpen);\n  const [isVisible, setIsVisible] = useState(isOpen);\n  const drawerRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    let timeoutId: NodeJS.Timeout;\n\n    if (isOpen) {\n      setShouldRender(true);\n      timeoutId = setTimeout(() => setIsVisible(true), 10);\n    } else {\n      setIsVisible(false);\n    }\n\n    return () => clearTimeout(timeoutId);\n  }, [isOpen]);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (drawerRef.current && !drawerRef.current.contains(event.target as Node)) {\n        onToggle(false);\n      }\n    };\n\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside);\n    };\n  }, [onToggle]);\n\n  const handleTransitionEnd = () => {\n    if (!isOpen) {\n      setShouldRender(false);\n    }\n  };\n  const handleClose = useCallback(() => {\n    onToggle(false);\n  }, [onToggle]);\n\n  return (\n    <>\n      <Box\n        position=\"absolute\"\n        display={isOpen ? 'block' : 'none'}\n        h=\"full\"\n        bottom={0}\n        left={0}\n        right={0}\n        bg=\"text.primary/20\"\n        backdropFilter=\"blur(3px)\"\n      />\n      {shouldRender && (\n        <Box\n          ref={drawerRef}\n          position=\"absolute\"\n          transform={isVisible ? 'translateY(0)' : 'translateY(100%)'}\n          transition=\"transform 0.3s\"\n          bottom={0}\n          left={0}\n          right={0}\n          bg=\"surface.primary\"\n          rounded=\"xl\"\n          boxShadow=\"0px -12px 56px 0px rgba(119, 118, 122, 0.15)\"\n          onTransitionEnd={handleTransitionEnd}\n        >\n          <HStack justifyContent=\"space-between\" p={6} pb={5}>\n            <Text styles={{ fontWeight: 'bold' }}>{title}</Text>\n            <Button size=\"sm\" variant=\"neutral\" onPress={handleClose}>\n              <Button.LeadingIcon>\n                <IcoCaretDown />\n              </Button.LeadingIcon>\n            </Button>\n          </HStack>\n          <Box px={6} pb={8}>\n            {children}\n          </Box>\n        </Box>\n      )}\n    </>\n  );\n};\n"],"names":["Drawer","isOpen","title","onToggle","children","shouldRender","setShouldRender","useState","isVisible","setIsVisible","drawerRef","useRef","useEffect","timeoutId","handleClickOutside","event","handleTransitionEnd","handleClose","useCallback","_jsxs","_Fragment","_jsx","Box","HStack","Text","Button","IcoCaretDown"],"mappings":"qfAWa,MAAAA,EAAS,CAAC,CAAE,OAAAC,EAAS,GAAO,MAAAC,EAAO,SAAAC,EAAU,SAAAC,CAAQ,IAAmB,CACnF,KAAM,CAACC,EAAcC,CAAe,EAAIC,EAASN,CAAM,EACjD,CAACO,EAAWC,CAAY,EAAIF,EAASN,CAAM,EAC3CS,EAAYC,EAAuB,IAAI,EAE7CC,EAAU,IAAK,CACb,IAAIC,EAEJ,OAAIZ,GACFK,EAAgB,EAAI,EACpBO,EAAY,WAAW,IAAMJ,EAAa,EAAI,EAAG,EAAE,GAEnDA,EAAa,EAAK,EAGb,IAAM,aAAaI,CAAS,CACrC,EAAG,CAACZ,CAAM,CAAC,EAEXW,EAAU,IAAK,CACb,MAAME,EAAsBC,GAAqB,CAC3CL,EAAU,SAAW,CAACA,EAAU,QAAQ,SAASK,EAAM,MAAc,GACvEZ,EAAS,EAAK,CAElB,EAEA,OAAS,SAAA,iBAAiB,YAAaW,CAAkB,EAClD,IAAK,CACV,SAAS,oBAAoB,YAAaA,CAAkB,CAC9D,CACF,EAAG,CAACX,CAAQ,CAAC,EAEb,MAAMa,EAAsB,IAAK,CAC1Bf,GACHK,EAAgB,EAAK,CAEzB,EACMW,EAAcC,EAAY,IAAK,CACnCf,EAAS,EAAK,CAChB,EAAG,CAACA,CAAQ,CAAC,EAEb,OACEgB,EACEC,EAAA,CAAA,SAAA,CAAAC,EAACC,EACC,CAAA,SAAS,WACT,QAASrB,EAAS,QAAU,OAC5B,EAAE,OACF,OAAQ,EACR,KAAM,EACN,MAAO,EACP,GAAG,kBACH,eAAe,WAAW,CAAA,EAE3BI,GACCc,EAACG,GACC,IAAKZ,EACL,SAAS,WACT,UAAWF,EAAY,gBAAkB,mBACzC,WAAW,iBACX,OAAQ,EACR,KAAM,EACN,MAAO,EACP,GAAG,kBACH,QAAQ,KACR,UAAU,+CACV,gBAAiBQ,EAAmB,SAAA,CAEpCG,EAACI,EAAM,CAAC,eAAe,gBAAgB,EAAG,EAAG,GAAI,YAC/CF,EAACG,GAAK,OAAQ,CAAE,WAAY,MAAQ,EAAA,SAAGtB,CAAa,CAAA,EACpDmB,EAACI,GAAO,KAAK,KAAK,QAAQ,UAAU,QAASR,WAC3CI,EAACI,EAAO,YAAW,CAAA,SACjBJ,EAACK,EAAY,CAAA,CAAA,CACM,CAAA,CAAA,CAAA,CACd,IAEXL,EAACC,EAAI,CAAA,GAAI,EAAG,GAAI,WACblB,CAAQ,CAAA,CACL,GAET,CAAA,CAAA,CAGP"}
+{"version":3,"file":"drawer.js","sources":["../../../../src/components/containers/drawer.tsx"],"sourcesContent":["import { IcoCaretDown } from '@components/icons';\nimport { Button, Text } from '@components/primitives';\nimport { Box, HStack } from '@styled/jsx';\nimport { PropsWithChildren, useCallback, useEffect, useRef, useState } from 'react';\n\nexport interface DrawerProps extends PropsWithChildren {\n  onToggle: (isOpen: boolean) => void;\n  isOpen: boolean;\n  title?: string;\n}\n\nexport const Drawer = ({ isOpen = false, title, onToggle, children }: DrawerProps) => {\n  const [shouldRender, setShouldRender] = useState(isOpen);\n  const [isVisible, setIsVisible] = useState(isOpen);\n  const drawerRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    let timeoutId: NodeJS.Timeout;\n\n    if (isOpen) {\n      setShouldRender(true);\n      timeoutId = setTimeout(() => setIsVisible(true), 10);\n    } else {\n      setIsVisible(false);\n    }\n\n    return () => clearTimeout(timeoutId);\n  }, [isOpen]);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (drawerRef.current && !drawerRef.current.contains(event.target as Node)) {\n        onToggle(false);\n      }\n    };\n\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside);\n    };\n  }, [onToggle]);\n\n  const handleTransitionEnd = () => {\n    if (!isOpen) {\n      setShouldRender(false);\n    }\n  };\n  const handleClose = useCallback(() => {\n    onToggle(false);\n  }, [onToggle]);\n\n  return (\n    <>\n      <Box\n        position=\"absolute\"\n        display={isOpen ? 'block' : 'none'}\n        h=\"full\"\n        bottom={0}\n        left={0}\n        right={0}\n        bg=\"text.primary/20\"\n        backdropFilter=\"blur(3px)\"\n      />\n      {shouldRender && (\n        <Box\n          ref={drawerRef}\n          position=\"absolute\"\n          transform={isVisible ? 'translateY(0)' : 'translateY(100%)'}\n          transition=\"transform 0.3s\"\n          bottom={0}\n          left={0}\n          right={0}\n          bg=\"surface.primary\"\n          rounded=\"xl\"\n          boxShadow=\"0px -12px 56px 0px rgba(119, 118, 122, 0.15)\"\n          onTransitionEnd={handleTransitionEnd}\n        >\n          <HStack justifyContent=\"space-between\" p={6} pb={5}>\n            <Text styles={{ fontWeight: 'bold' }}>{title}</Text>\n            <Button size=\"sm\" variant=\"neutral\" onPress={handleClose}>\n              <Button.LeadingIcon>\n                <IcoCaretDown />\n              </Button.LeadingIcon>\n            </Button>\n          </HStack>\n          <Box px={6} pb={8}>\n            {children}\n          </Box>\n        </Box>\n      )}\n    </>\n  );\n};\n"],"names":["Drawer","isOpen","title","onToggle","children","shouldRender","setShouldRender","useState","isVisible","setIsVisible","drawerRef","useRef","useEffect","timeoutId","handleClickOutside","event","handleTransitionEnd","handleClose","useCallback","_jsxs","_Fragment","_jsx","Box","HStack","Text","Button","IcoCaretDown"],"mappings":"giBAWa,MAAAA,EAAS,CAAC,CAAE,OAAAC,EAAS,GAAO,MAAAC,EAAO,SAAAC,EAAU,SAAAC,CAAQ,IAAmB,CACnF,KAAM,CAACC,EAAcC,CAAe,EAAIC,EAASN,CAAM,EACjD,CAACO,EAAWC,CAAY,EAAIF,EAASN,CAAM,EAC3CS,EAAYC,EAAuB,IAAI,EAE7CC,EAAU,IAAK,CACb,IAAIC,EAEJ,OAAIZ,GACFK,EAAgB,EAAI,EACpBO,EAAY,WAAW,IAAMJ,EAAa,EAAI,EAAG,EAAE,GAEnDA,EAAa,EAAK,EAGb,IAAM,aAAaI,CAAS,CACrC,EAAG,CAACZ,CAAM,CAAC,EAEXW,EAAU,IAAK,CACb,MAAME,EAAsBC,GAAqB,CAC3CL,EAAU,SAAW,CAACA,EAAU,QAAQ,SAASK,EAAM,MAAc,GACvEZ,EAAS,EAAK,CAElB,EAEA,OAAS,SAAA,iBAAiB,YAAaW,CAAkB,EAClD,IAAK,CACV,SAAS,oBAAoB,YAAaA,CAAkB,CAC9D,CACF,EAAG,CAACX,CAAQ,CAAC,EAEb,MAAMa,EAAsB,IAAK,CAC1Bf,GACHK,EAAgB,EAAK,CAEzB,EACMW,EAAcC,EAAY,IAAK,CACnCf,EAAS,EAAK,CAChB,EAAG,CAACA,CAAQ,CAAC,EAEb,OACEgB,EACEC,EAAA,CAAA,SAAA,CAAAC,EAACC,EACC,CAAA,SAAS,WACT,QAASrB,EAAS,QAAU,OAC5B,EAAE,OACF,OAAQ,EACR,KAAM,EACN,MAAO,EACP,GAAG,kBACH,eAAe,WAAW,CAAA,EAE3BI,GACCc,EAACG,GACC,IAAKZ,EACL,SAAS,WACT,UAAWF,EAAY,gBAAkB,mBACzC,WAAW,iBACX,OAAQ,EACR,KAAM,EACN,MAAO,EACP,GAAG,kBACH,QAAQ,KACR,UAAU,+CACV,gBAAiBQ,EAAmB,SAAA,CAEpCG,EAACI,EAAM,CAAC,eAAe,gBAAgB,EAAG,EAAG,GAAI,YAC/CF,EAACG,GAAK,OAAQ,CAAE,WAAY,MAAQ,EAAA,SAAGtB,CAAa,CAAA,EACpDmB,EAACI,GAAO,KAAK,KAAK,QAAQ,UAAU,QAASR,WAC3CI,EAACI,EAAO,YAAW,CAAA,SACjBJ,EAACK,EAAY,CAAA,CAAA,CACM,CAAA,CAAA,CAAA,CACd,IAEXL,EAACC,EAAI,CAAA,GAAI,EAAG,GAAI,WACblB,CAAQ,CAAA,CACL,GAET,CAAA,CAAA,CAGP"}

package/dist/es/components/external/paypal-button.js

@@ -1,2 +1,2 @@
-import{jsx as o,jsxs as u}from"react/jsx-runtime";import"../feedback/callout.js";import{LoadingSpinner as c}from"../feedback/loading-spinner.js";import{token as h}from"@styled/tokens";import"../primitives/button.js";import"../primitives/checkbox.js";import"../primitives/popover.js";import"../primitives/radio.js";import"../primitives/segmented-control.js";import"../primitives/switch.js";import b from"../primitives/text.js";import"../primitives/portal.js";import{forwardRef as g,useRef as P}from"react";import"../../hooks/useToast.js";import"../../recipes/toast.js";import{HStack as x,Box as y}from"@styled/jsx";import"../feedback/tooltip.js";import k from"../logos/logo-pay-pal-wordmark.js";import{button as j}from"../../recipes/button.js";import{cx as w,css as B}from"@styled/css";import{useButton as v,useFocusRing as R,mergeProps as S}from"react-aria";const n=g((t,m)=>{const{disabled:i,expand:s,validating:r}=t,p=j({expand:s,validating:r}),l=P(null),e=m||l,{buttonProps:a}=v({...t,isDisabled:i??!1},e),{isFocusVisible:f,focusProps:d}=R();return o("button",{className:w(p.button,B({bg:"#ffc439",outlineColor:"#ffc439",outlineWidth:"thick",outlineOffset:.5,outlineStyle:f?"solid":"none"})),ref:e,...S(a,d),"aria-disabled":i,children:r?o(c,{size:24,strokeWidth:2.5,inverted:!0}):u(x,{w:"full",gap:1,justifyContent:"center",children:[o(b,{styles:{fontWeight:600,color:h("colors.ink.90")},children:"Pay with"}),o(y,{mt:.5,children:o(k,{width:60})})]})})});n.displayName="PayPalButton";export{n as PayPalButton};
+import{jsx as o,jsxs as u}from"react/jsx-runtime";import"../feedback/callout.js";import{LoadingSpinner as c}from"../feedback/loading-spinner.js";import{token as h}from"@styled/tokens";import"../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 b from"../primitives/text.js";import"../primitives/portal.js";import{forwardRef as g,useRef as P}from"react";import"../../hooks/useToast.js";import"../../recipes/toast.js";import{HStack as x,Box as y}from"@styled/jsx";import"../feedback/tooltip.js";import k from"../logos/logo-pay-pal-wordmark.js";import{button as j}from"../../recipes/button.js";import{cx as w,css as B}from"@styled/css";import{useButton as v,useFocusRing as R,mergeProps as S}from"react-aria";const m=g((t,n)=>{const{disabled:i,expand:s,validating:r}=t,p=j({expand:s,validating:r}),l=P(null),e=n||l,{buttonProps:a}=v({...t,isDisabled:i??!1},e),{isFocusVisible:f,focusProps:d}=R();return o("button",{className:w(p.button,B({bg:"#ffc439",outlineColor:"#ffc439",outlineWidth:"thick",outlineOffset:.5,outlineStyle:f?"solid":"none"})),ref:e,...S(a,d),"aria-disabled":i,children:r?o(c,{size:24,strokeWidth:2.5,inverted:!0}):u(x,{w:"full",gap:1,justifyContent:"center",children:[o(b,{styles:{fontWeight:600,color:h("colors.ink.90")},children:"Pay with"}),o(y,{mt:.5,children:o(k,{width:60})})]})})});m.displayName="PayPalButton";export{m as PayPalButton};
 //# sourceMappingURL=paypal-button.js.map

package/dist/es/components/external/paypal-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"paypal-button.js","sources":["../../../../src/components/external/paypal-button.tsx"],"sourcesContent":["import { LoadingSpinner } from '@components/feedback';\nimport { LogoPayPalWordmark } from '@components/logos';\nimport { Text } from '@components/primitives';\nimport { button } from '@recipes/button';\nimport { css, cx } from '@styled/css';\nimport { Box, HStack } from '@styled/jsx';\nimport { token } from '@styled/tokens';\nimport React, { forwardRef, useRef } from 'react';\nimport { mergeProps, useButton, useFocusRing, type AriaButtonProps } from 'react-aria';\n\nexport interface PayPalButtonProps extends AriaButtonProps {\n  disabled?: boolean;\n  expand?: boolean;\n  validating?: boolean;\n}\n\nexport const PayPalButton = forwardRef<HTMLButtonElement, PayPalButtonProps>((props, forwardedRef) => {\n  const { disabled, expand, validating } = props;\n\n  const classes = button({ expand, validating });\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\n  const { isFocusVisible, focusProps } = useFocusRing();\n\n  return (\n    <button\n      className={cx(\n        classes.button,\n        css({\n          bg: '#ffc439',\n          outlineColor: '#ffc439',\n          outlineWidth: 'thick',\n          outlineOffset: 0.5,\n          outlineStyle: isFocusVisible ? 'solid' : 'none',\n        }),\n      )}\n      ref={ref}\n      {...mergeProps(buttonProps, focusProps)}\n      aria-disabled={disabled}\n    >\n      {validating ? (\n        <LoadingSpinner size={24} strokeWidth={2.5} inverted />\n      ) : (\n        <HStack w=\"full\" gap={1} justifyContent=\"center\">\n          <Text styles={{ fontWeight: 600, color: token('colors.ink.90') }}>Pay with</Text>\n          <Box mt={0.5}>\n            <LogoPayPalWordmark width={60} />\n          </Box>\n        </HStack>\n      )}\n    </button>\n  );\n});\n\nPayPalButton.displayName = 'PayPalButton';\n"],"names":["PayPalButton","forwardRef","props","forwardedRef","disabled","expand","validating","classes","button","internalRef","useRef","ref","buttonProps","useButton","isFocusVisible","focusProps","useFocusRing","_jsx","cx","css","mergeProps","LoadingSpinner","_jsxs","HStack","Text","token","Box","LogoPayPalWordmark"],"mappings":"01BAgBO,MAAMA,EAAeC,EAAiD,CAACC,EAAOC,IAAgB,CACnG,KAAM,CAAE,SAAAC,EAAU,OAAAC,EAAQ,WAAAC,CAAU,EAAKJ,EAEnCK,EAAUC,EAAO,CAAE,OAAAH,EAAQ,WAAAC,CAAY,CAAA,EAEvCG,EAAcC,EAAO,IAAI,EACzBC,EAAMR,GAAgBM,EAEtB,CAAE,YAAAG,CAAa,EAAGC,EACtB,CAAE,GAAGX,EAAO,WAAYE,GAAY,EAAO,EAC3CO,CAAyC,EAGrC,CAAE,eAAAG,EAAgB,WAAAC,GAAeC,IAEvC,OACEC,EACE,SAAA,CAAA,UAAWC,EACTX,EAAQ,OACRY,EAAI,CACF,GAAI,UACJ,aAAc,UACd,aAAc,QACd,cAAe,GACf,aAAcL,EAAiB,QAAU,MAC1C,CAAA,CAAC,EAEJ,IAAKH,EAAG,GACJS,EAAWR,EAAaG,CAAU,kBACvBX,EAAQ,SAEtBE,EACCW,EAACI,EAAe,CAAA,KAAM,GAAI,YAAa,IAAK,SAAQ,EAAA,CAAA,EAEpDC,EAACC,EAAO,CAAA,EAAE,OAAO,IAAK,EAAG,eAAe,SACtC,SAAA,CAAAN,EAACO,EAAK,CAAA,OAAQ,CAAE,WAAY,IAAK,MAAOC,EAAM,eAAe,GAAoB,SAAA,UAAA,CAAA,EACjFR,EAACS,EAAG,CAAC,GAAI,YACPT,EAACU,GAAmB,MAAO,EAAM,CAAA,CAAA,CAAA,CAC7B,GAET,CAAA,CAGP,CAAC,EAED3B,EAAa,YAAc"}
+{"version":3,"file":"paypal-button.js","sources":["../../../../src/components/external/paypal-button.tsx"],"sourcesContent":["import { LoadingSpinner } from '@components/feedback';\nimport { LogoPayPalWordmark } from '@components/logos';\nimport { Text } from '@components/primitives';\nimport { button } from '@recipes/button';\nimport { css, cx } from '@styled/css';\nimport { Box, HStack } from '@styled/jsx';\nimport { token } from '@styled/tokens';\nimport React, { forwardRef, useRef } from 'react';\nimport { mergeProps, useButton, useFocusRing, type AriaButtonProps } from 'react-aria';\n\nexport interface PayPalButtonProps extends AriaButtonProps {\n  disabled?: boolean;\n  expand?: boolean;\n  validating?: boolean;\n}\n\nexport const PayPalButton = forwardRef<HTMLButtonElement, PayPalButtonProps>((props, forwardedRef) => {\n  const { disabled, expand, validating } = props;\n\n  const classes = button({ expand, validating });\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\n  const { isFocusVisible, focusProps } = useFocusRing();\n\n  return (\n    <button\n      className={cx(\n        classes.button,\n        css({\n          bg: '#ffc439',\n          outlineColor: '#ffc439',\n          outlineWidth: 'thick',\n          outlineOffset: 0.5,\n          outlineStyle: isFocusVisible ? 'solid' : 'none',\n        }),\n      )}\n      ref={ref}\n      {...mergeProps(buttonProps, focusProps)}\n      aria-disabled={disabled}\n    >\n      {validating ? (\n        <LoadingSpinner size={24} strokeWidth={2.5} inverted />\n      ) : (\n        <HStack w=\"full\" gap={1} justifyContent=\"center\">\n          <Text styles={{ fontWeight: 600, color: token('colors.ink.90') }}>Pay with</Text>\n          <Box mt={0.5}>\n            <LogoPayPalWordmark width={60} />\n          </Box>\n        </HStack>\n      )}\n    </button>\n  );\n});\n\nPayPalButton.displayName = 'PayPalButton';\n"],"names":["PayPalButton","forwardRef","props","forwardedRef","disabled","expand","validating","classes","button","internalRef","useRef","ref","buttonProps","useButton","isFocusVisible","focusProps","useFocusRing","_jsx","cx","css","mergeProps","LoadingSpinner","_jsxs","HStack","Text","token","Box","LogoPayPalWordmark"],"mappings":"q4BAgBO,MAAMA,EAAeC,EAAiD,CAACC,EAAOC,IAAgB,CACnG,KAAM,CAAE,SAAAC,EAAU,OAAAC,EAAQ,WAAAC,CAAU,EAAKJ,EAEnCK,EAAUC,EAAO,CAAE,OAAAH,EAAQ,WAAAC,CAAY,CAAA,EAEvCG,EAAcC,EAAO,IAAI,EACzBC,EAAMR,GAAgBM,EAEtB,CAAE,YAAAG,CAAa,EAAGC,EACtB,CAAE,GAAGX,EAAO,WAAYE,GAAY,EAAO,EAC3CO,CAAyC,EAGrC,CAAE,eAAAG,EAAgB,WAAAC,GAAeC,IAEvC,OACEC,EACE,SAAA,CAAA,UAAWC,EACTX,EAAQ,OACRY,EAAI,CACF,GAAI,UACJ,aAAc,UACd,aAAc,QACd,cAAe,GACf,aAAcL,EAAiB,QAAU,MAC1C,CAAA,CAAC,EAEJ,IAAKH,EAAG,GACJS,EAAWR,EAAaG,CAAU,kBACvBX,EAAQ,SAEtBE,EACCW,EAACI,EAAe,CAAA,KAAM,GAAI,YAAa,IAAK,SAAQ,EAAA,CAAA,EAEpDC,EAACC,EAAO,CAAA,EAAE,OAAO,IAAK,EAAG,eAAe,SACtC,SAAA,CAAAN,EAACO,EAAK,CAAA,OAAQ,CAAE,WAAY,IAAK,MAAOC,EAAM,eAAe,GAAoB,SAAA,UAAA,CAAA,EACjFR,EAACS,EAAG,CAAC,GAAI,YACPT,EAACU,GAAmB,MAAO,EAAM,CAAA,CAAA,CAAA,CAC7B,GAET,CAAA,CAGP,CAAC,EAED3B,EAAa,YAAc"}

package/dist/es/components/feedback/toast-provider.js

@@ -1,2 +1,2 @@
-import{jsx as t,jsxs as h}from"react/jsx-runtime";import{token as x}from"@styled/tokens";import C from"../icons/ico-dismiss.js";import"../primitives/button.js";import"../primitives/checkbox.js";import"../primitives/popover.js";import"../primitives/radio.js";import"../primitives/segmented-control.js";import"../primitives/switch.js";import S from"../primitives/text.js";import j from"../primitives/portal.js";import y from"../utils/animate.js";import{ToastContext as g}from"../../hooks/useToast.js";import{toast as v}from"../../recipes/toast.js";import{HStack as H,VStack as P}from"@styled/jsx";import{useState as R,useRef as $,useReducer as w,useCallback as N,useMemo as A}from"react";import{StatusIcon as I}from"./status-icon.js";let M=0;const T=i=>{const{dismissible:c,lifespan:a,message:l="",variant:o="branded"}=i,e=v({variant:o}),s=i.id,n=i.removeToast,[p,m]=R(!0);return a&&setTimeout(()=>{m(!1)},a),t(y,{"aria-live":["error"].includes(o||"")?"assertive":"polite",show:p,type:"slide",onHidden:()=>{s&&n(s)},children:h(H,{className:e.toast,children:[i.icon&&t(I,{className:e.icon,variant:o}),t(S,{styles:{color:x("colors.surface.primary")},children:l}),c&&t("button",{className:e.dismiss,onClick:()=>m(!1),"aria-label":"dismiss toast",children:t(C,{className:e.icon})})]})})},V=({icon:i=!1,lifespan:c=0,position:a="top-right",children:l})=>{const o=$([]),e=w(r=>r+1,0)[1],s=N(r=>{o.current=o.current.filter(d=>d.id!==r),e()},[]),n=N(r=>{const{icon:d=r.icon||i,lifespan:b=r.lifespan||c,...k}=r,f=++M;return o.current.push({icon:d,lifespan:b,id:f,...k}),e(),f},[]),p=A(()=>({createToast:n,removeToast:s}),[n,s]),m=(a?.startsWith("top")?[...o.current]:[...o.current].reverse()).map(r=>t(T,{...r,removeToast:s},r.id)),u=v({position:a});return h(g.Provider,{value:p,children:[l,t(j,{children:t("div",{className:u.portal,children:t(P,{className:u.container,children:m})})})]})};export{T as Toast,V as ToastProvider};
+import{jsx as t,jsxs as h}from"react/jsx-runtime";import{token as x}from"@styled/tokens";import C from"../icons/ico-dismiss.js";import"../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 S from"../primitives/text.js";import j from"../primitives/portal.js";import y from"../utils/animate.js";import{ToastContext as g}from"../../hooks/useToast.js";import{toast as v}from"../../recipes/toast.js";import{HStack as H,VStack as P}from"@styled/jsx";import{useState as R,useRef as $,useReducer as w,useCallback as N,useMemo as A}from"react";import{StatusIcon as I}from"./status-icon.js";let M=0;const T=e=>{const{dismissible:c,lifespan:a,message:l="",variant:o="branded"}=e,i=v({variant:o}),s=e.id,n=e.removeToast,[p,m]=R(!0);return a&&setTimeout(()=>{m(!1)},a),t(y,{"aria-live":["error"].includes(o||"")?"assertive":"polite",show:p,type:"slide",onHidden:()=>{s&&n(s)},children:h(H,{className:i.toast,children:[e.icon&&t(I,{className:i.icon,variant:o}),t(S,{styles:{color:x("colors.surface.primary")},children:l}),c&&t("button",{className:i.dismiss,onClick:()=>m(!1),"aria-label":"dismiss toast",children:t(C,{className:i.icon})})]})})},V=({icon:e=!1,lifespan:c=0,position:a="top-right",children:l})=>{const o=$([]),i=w(r=>r+1,0)[1],s=N(r=>{o.current=o.current.filter(d=>d.id!==r),i()},[]),n=N(r=>{const{icon:d=r.icon||e,lifespan:b=r.lifespan||c,...k}=r,f=++M;return o.current.push({icon:d,lifespan:b,id:f,...k}),i(),f},[]),p=A(()=>({createToast:n,removeToast:s}),[n,s]),m=(a?.startsWith("top")?[...o.current]:[...o.current].reverse()).map(r=>t(T,{...r,removeToast:s},r.id)),u=v({position:a});return h(g.Provider,{value:p,children:[l,t(j,{children:t("div",{className:u.portal,children:t(P,{className:u.container,children:m})})})]})};export{T as Toast,V as ToastProvider};
 //# sourceMappingURL=toast-provider.js.map