npm - @magiclabs/ui-components - Versions diffs - 1.19.5 → 1.20.1 - Mend

@magiclabs/ui-components 1.19.5 → 1.20.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (46) hide show

package/dist/es/components/feedback/progress-bar.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{jsx as u}from"react/jsx-runtime";import{Box as d}from"@styled/jsx";import{token as e}from"@styled/tokens";import{useMemo as g}from"react";const h=75,m=90,a=e("colors.brand.lighter"),n=e("colors.negative.lighter"),f=e("colors.neutral.secondary"),p=e("colors.positive.lighter"),l=e("colors.warning.lighter"),x=({autoTarget:o="min",progress:r=0})=>o==="min"?r>m?n:r>h?l:a:r<=100-m?n:r<=100-h?l:r===100?p:a,y=({autoTarget:o,current:r=0,strokeWidth:t=8,total:s=100,variant:c="auto"})=>{const i=g(()=>Math.min(r,s)/s*100,[r,s]),b=g(()=>{switch(c){case"branded":return a;case"success":return p;case"error":return n;case"warning":return l;case"neutral":return f;default:return x({autoTarget:o,progress:i})}},[i,c]);return u(d,{bgColor:"surface.tertiary",borderRadius:"2rem",position:"relative",w:"full",style:{height:`${t}px`},children:u(d,{position:"absolute",borderRadius:"2rem",borderStyle:"solid",borderWidth:"thick",borderColor:"surface.primary",style:{height:`${t}px`,minWidth:`${t}px`,width:`${i}%`,background:b}})})};export{y as ProgressBar};
2	+ //# sourceMappingURL=progress-bar.js.map

package/dist/es/components/feedback/progress-bar.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"progress-bar.js","sources":["../../../../src/components/feedback/progress-bar.tsx"],"sourcesContent":["import { Box } from '@styled/jsx';\nimport { token } from '@styled/tokens';\nimport { useMemo } from 'react';\n\nconst WARNING_THRESHOLD = 75;\nconst ERROR_THRESHOLD = 90;\n\nconst BRAND_COLOR = token('colors.brand.lighter');\nconst ERROR_COLOR = token('colors.negative.lighter');\nconst NEUTRAL_COLOR = token('colors.neutral.secondary');\nconst SUCCESS_COLOR = token('colors.positive.lighter');\nconst WARN_COLOR = token('colors.warning.lighter');\n\nexport interface ProgressBarProps {\n autoTarget?: 'min' | 'max';\n current?: number;\n total?: number;\n strokeWidth?: number;\n variant?: 'auto' | 'branded' | 'success' | 'error' | 'warning' | 'neutral';\n}\n\nconst autoFillColor = ({ autoTarget = 'min', progress = 0 }) => {\n if (autoTarget === 'min') {\n if (progress > ERROR_THRESHOLD) {\n return ERROR_COLOR;\n } else if (progress > WARNING_THRESHOLD) {\n return WARN_COLOR;\n }\n return BRAND_COLOR;\n } else {\n if (progress <= 100 - ERROR_THRESHOLD) {\n return ERROR_COLOR;\n } else if (progress <= 100 - WARNING_THRESHOLD) {\n return WARN_COLOR;\n } else if (progress === 100) {\n return SUCCESS_COLOR;\n }\n return BRAND_COLOR;\n }\n};\n\nexport const ProgressBar = ({\n autoTarget,\n current = 0,\n strokeWidth = 8,\n total = 100,\n variant = 'auto',\n}: ProgressBarProps) => {\n const progress = useMemo(() => {\n return (Math.min(current, total) / total) * 100;\n }, [current, total]);\n\n const fillColor = useMemo(() => {\n switch (variant) {\n case 'branded':\n return BRAND_COLOR;\n case 'success':\n return SUCCESS_COLOR;\n case 'error':\n return ERROR_COLOR;\n case 'warning':\n return WARN_COLOR;\n case 'neutral':\n return NEUTRAL_COLOR;\n default:\n return autoFillColor({ autoTarget, progress });\n }\n }, [progress, variant]);\n\n return (\n <Box\n bgColor=\"surface.tertiary\"\n borderRadius=\"2rem\"\n position=\"relative\"\n w=\"full\"\n style={{\n height: `${strokeWidth}px`,\n }}\n >\n <Box\n position=\"absolute\"\n borderRadius=\"2rem\"\n borderStyle=\"solid\"\n borderWidth=\"thick\"\n borderColor=\"surface.primary\"\n style={{\n height: `${strokeWidth}px`,\n minWidth: `${strokeWidth}px`,\n width: `${progress}%`,\n background: fillColor,\n }}\n />\n </Box>\n );\n};\n"],"names":["WARNING_THRESHOLD","ERROR_THRESHOLD","BRAND_COLOR","token","ERROR_COLOR","NEUTRAL_COLOR","SUCCESS_COLOR","WARN_COLOR","autoFillColor","autoTarget","progress","ProgressBar","current","strokeWidth","total","variant","useMemo","fillColor","_jsx","Box"],"mappings":"iJAIA,MAAMA,EAAoB,GACpBC,EAAkB,GAElBC,EAAcC,EAAM,sBAAsB,EAC1CC,EAAcD,EAAM,yBAAyB,EAC7CE,EAAgBF,EAAM,0BAA0B,EAChDG,EAAgBH,EAAM,yBAAyB,EAC/CI,EAAaJ,EAAM,wBAAwB,EAU3CK,EAAgB,CAAC,CAAE,WAAAC,EAAa,MAAO,SAAAC,EAAW,CAAC,IACnDD,IAAe,MACbC,EAAWT,EACNG,EACEM,EAAWV,EACbO,EAEFL,EAEHQ,GAAY,IAAMT,EACbG,EACEM,GAAY,IAAMV,EACpBO,EACEG,IAAa,IACfJ,EAEFJ,EAIES,EAAc,CAAC,CAC1B,WAAAF,EACA,QAAAG,EAAU,EACV,YAAAC,EAAc,EACd,MAAAC,EAAQ,IACR,QAAAC,EAAU,MACO,IAAI,CACrB,MAAML,EAAWM,EAAQ,IACf,KAAK,IAAIJ,EAASE,CAAK,EAAIA,EAAS,IAC3C,CAACF,EAASE,CAAK,CAAC,EAEbG,EAAYD,EAAQ,IAAK,CAC7B,OAAQD,EAAAA,CACN,IAAK,UACH,OAAOb,EACT,IAAK,UACH,OAAOI,EACT,IAAK,QACH,OAAOF,EACT,IAAK,UACH,OAAOG,EACT,IAAK,UACH,OAAOF,EACT,QACE,OAAOG,EAAc,CAAE,WAAAC,EAAY,SAAAC,CAAQ,CAAE,CACjD,CACF,EAAG,CAACA,EAAUK,CAAO,CAAC,EAEtB,OACEG,EAACC,EAAG,CACF,QAAQ,mBACR,aAAa,OACb,SAAS,WACT,EAAE,OACF,MAAO,CACL,OAAQ,GAAGN,CAAW,MAGxB,SAAAK,EAACC,EAAG,CACF,SAAS,WACT,aAAa,OACb,YAAY,QACZ,YAAY,QACZ,YAAY,kBACZ,MAAO,CACL,OAAQ,GAAGN,CAAW,KACtB,SAAU,GAAGA,CAAW,KACxB,MAAO,GAAGH,CAAQ,IAClB,WAAYO,EAEd,CAAA,CAAA,CAAA,CAGR"}

package/dist/es/components/icons/ico-kebab.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as i,jsx as C}from"react/jsx-runtime";import{token as n}from"@styled/tokens";const c=({color:r,title:l,titleId:t,...o})=>{const e=r||n("colors.text.primary");return i("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",color:e,"aria-labelledby":t,...o,children:[l?C("title",{id:t,children:l}):null,C("path",{d:"M12.1203 8.10129C11.8232 8.10129 11.5384 7.98329 11.3283 7.77325C11.1183 7.56322 11.0003 7.27835 11.0003 6.98131C11.0003 6.68427 11.1183 6.3994 11.3283 6.18936C11.5384 5.97933 11.8232 5.86133 12.1203 5.86133C12.4173 5.86133 12.7022 5.97933 12.9122 6.18936C13.1223 6.3994 13.2403 6.68427 13.2403 6.98131C13.2403 7.27835 13.1223 7.56322 12.9122 7.77325C12.7022 7.98329 12.4173 8.10129 12.1203 8.10129Z",fill:"currentColor"}),C("path",{d:"M12.1203 12.9813C11.8232 12.9813 11.5384 12.8633 11.3283 12.6532C11.1183 12.4432 11.0003 12.1583 11.0003 11.8613C11.0003 11.5643 11.1183 11.2794 11.3283 11.0693C11.5384 10.8593 11.8232 10.7413 12.1203 10.7413C12.4173 10.7413 12.7022 10.8593 12.9122 11.0693C13.1223 11.2794 13.2403 11.5643 13.2403 11.8613C13.2403 12.1583 13.1223 12.4432 12.9122 12.6532C12.7022 12.8633 12.4173 12.9813 12.1203 12.9813Z",fill:"currentColor"}),C("path",{d:"M11.0003 16.7414C11.0003 17.0384 11.1183 17.3233 11.3283 17.5333C11.5384 17.7434 11.8232 17.8614 12.1203 17.8614C12.4173 17.8614 12.7022 17.7434 12.9122 17.5333C13.1223 17.3233 13.2403 17.0384 13.2403 16.7414C13.2403 16.4444 13.1223 16.1595 12.9122 15.9494C12.7022 15.7394 12.4173 15.6214 12.1203 15.6214C11.8232 15.6214 11.5384 15.7394 11.3283 15.9494C11.1183 16.1595 11.0003 16.4444 11.0003 16.7414Z",fill:"currentColor"})]})};export{c as default};
+import{jsxs as i,jsx as C}from"react/jsx-runtime";import{token as n}from"@styled/tokens";const c=({color:r,title:l,titleId:t,...o})=>{const e=r||n("colors.text.primary");return i("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",color:e,"aria-labelledby":t,...o,children:[l?C("title",{id:t,children:l}):null,C("path",{d:"M11.8666 5.73325C11.3716 5.73325 10.8968 5.53659 10.5467 5.18653C10.1967 4.83647 10 4.36169 10 3.86663C10 3.37157 10.1967 2.89678 10.5467 2.54672C10.8968 2.19666 11.3716 2 11.8666 2C12.3617 2 12.8365 2.19666 13.1865 2.54672C13.5366 2.89678 13.7333 3.37157 13.7333 3.86663C13.7333 4.36169 13.5366 4.83647 13.1865 5.18653C12.8365 5.53659 12.3617 5.73325 11.8666 5.73325Z",fill:"currentColor"}),C("path",{d:"M11.8666 13.8665C11.3716 13.8665 10.8968 13.6699 10.5467 13.3198C10.1967 12.9697 10 12.495 10 11.9999C10 11.5048 10.1967 11.0301 10.5467 10.68C10.8968 10.3299 11.3716 10.1333 11.8666 10.1333C12.3617 10.1333 12.8365 10.3299 13.1865 10.68C13.5366 11.0301 13.7333 11.5048 13.7333 11.9999C13.7333 12.495 13.5366 12.9697 13.1865 13.3198C12.8365 13.6699 12.3617 13.8665 11.8666 13.8665Z",fill:"currentColor"}),C("path",{d:"M10 20.1334C10 20.6284 10.1967 21.1032 10.5467 21.4533C10.8968 21.8033 11.3716 22 11.8666 22C12.3617 22 12.8365 21.8033 13.1865 21.4533C13.5366 21.1032 13.7333 20.6284 13.7333 20.1334C13.7333 19.6383 13.5366 19.1635 13.1865 18.8135C12.8365 18.4634 12.3617 18.2668 11.8666 18.2668C11.3716 18.2668 10.8968 18.4634 10.5467 18.8135C10.1967 19.1635 10 19.6383 10 20.1334Z",fill:"currentColor"})]})};export{c as default};
 //# sourceMappingURL=ico-kebab.js.map

package/dist/es/components/icons/ico-kebab.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ico-kebab.js","sources":["../../../../src/components/icons/ico-kebab.tsx"],"sourcesContent":["import type { SVGProps } from 'react';\nimport { token } from '@styled/tokens';\ninterface SVGRProps {\n title?: string;\n titleId?: string;\n}\nexport interface Props extends SVGRProps, SVGProps<SVGSVGElement> {\n /*\n Configures icon color on monochrome svgs.\n */\n color?: string;\n}\nconst IcoKebab = ({ color: customColor, title, titleId, ...props }: Props) => {\n // Utilize dynamic primary text color by default\n const color = customColor \|\| token('colors.text.primary');\n return (\n <svg\n width={24}\n height={24}\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n color={color}\n aria-labelledby={titleId}\n {...props}\n >\n {title ? <title id={titleId}>{title}</title> : null}\n <path\n d=\"~~M12~~.~~1203~~ 8.~~10129C11~~.~~8232~~ 8.~~10129~~ 11.~~5384~~ 7.~~98329~~ 11.~~3283~~ 7.~~77325C11~~.~~1183~~ 7.~~56322~~ ~~11.0003~~ 7.~~27835~~ ~~11.0003~~ 6.~~98131C11.0003~~ 6.~~68427~~ 11.~~1183~~ 6.~~3994~~ 11.~~3283~~ 6.~~18936C11~~.~~5384~~ 5.~~97933~~ 11.~~8232~~ ~~5.86133~~ 12.~~1203~~ 5.~~86133C12.4173~~ ~~5.86133~~ 12.~~7022~~ 5.~~97933~~ 12.~~9122~~ 6.~~18936C13~~.~~1223~~ 6.~~3994~~ 13.~~2403~~ 6.~~68427~~ 13.~~2403~~ 6.~~98131C13~~.~~2403~~ 7.~~27835~~ 13.~~1223~~ 7.~~56322~~ 12.~~9122~~ 7.~~77325C12~~.~~7022~~ 7.~~98329~~ 12.~~4173~~ 8.~~10129~~ 12.~~1203~~ 8.~~10129Z~~\"\n fill=\"currentColor\"\n />\n <path\n d=\"~~M12~~.~~1203~~ 12.~~9813C11~~.~~8232~~ 12.~~9813~~ 11.~~5384~~ 12.~~8633~~ 11.~~3283~~ 12.~~6532C11~~.~~1183~~ 12.~~4432~~ ~~11.0003~~ 12.~~1583~~ ~~11.0003~~ 11.~~8613C11.0003~~ 11.~~5643~~ 11.~~1183~~ 11.~~2794~~ 11.~~3283~~ 11.~~0693C11~~.~~5384~~ 10.~~8593~~ 11.~~8232~~ 10.~~7413~~ 12.~~1203~~ 10.~~7413C12~~.~~4173~~ 10.~~7413~~ 12.~~7022~~ 10.~~8593~~ 12.~~9122~~ 11.~~0693C13~~.~~1223~~ 11.~~2794~~ 13.~~2403~~ 11.~~5643~~ 13.~~2403~~ 11.~~8613C13~~.~~2403~~ 12.~~1583~~ 13.~~1223~~ 12.~~4432~~ 12.~~9122~~ 12.~~6532C12~~.~~7022~~ 12.~~8633~~ 12.~~4173~~ 12.~~9813~~ 12.~~1203~~ 12.~~9813Z~~\"\n fill=\"currentColor\"\n />\n <path\n d=\"~~M11.0003~~ 16.~~7414C11.0003~~ 17.~~0384~~ 11.~~1183~~ 17.~~3233~~ 11.~~3283~~ 17.~~5333C11~~.~~5384~~ 17.~~7434~~ 11.~~8232~~ ~~17.8614~~ 12.~~1203~~ 17.~~8614C12.4173~~ ~~17.8614~~ 12.~~7022~~ 17.~~7434~~ 12.~~9122~~ 17.~~5333C13~~.~~1223~~ 17.~~3233~~ 13.~~2403~~ 17.~~0384~~ 13.~~2403~~ 16.~~7414C13~~.~~2403~~ 16.~~4444~~ 13.~~1223~~ 16.~~1595~~ 12.~~9122~~ 15.~~9494C12~~.~~7022~~ 15.~~7394~~ 12.~~4173~~ 15.~~6214~~ 12.~~1203~~ 15.~~6214C11~~.~~8232~~ 15.~~6214~~ 11.~~5384~~ 15.~~7394~~ 11.~~3283~~ 15.~~9494C11~~.~~1183~~ 16.~~1595~~ ~~11.0003~~ 16.~~4444~~ ~~11.0003~~ 16.~~7414Z~~\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\nexport default IcoKebab;\n"],"names":["IcoKebab","customColor","title","titleId","props","color","token","_jsxs","_jsx"],"mappings":"yFAYA,MAAMA,EAAW,CAAC,CAAE,MAAOC,EAAa,MAAAC,EAAO,QAAAC,EAAS,GAAGC,CAAK,IAAa,CAE3E,MAAMC,EAAQJ,GAAeK,EAAM,qBAAqB,EACxD,OACEC,EACE,MAAA,CAAA,MAAO,GACP,OAAQ,GACR,QAAQ,YACR,KAAK,OACL,MAAM,6BACN,MAAOF,oBACUF,EAAO,GACpBC,EAAK,SAAA,CAERF,EAAQM,EAAA,QAAA,CAAO,GAAIL,EAAU,SAAAD,IAAiB,KAC/CM,EACE,OAAA,CAAA,EAAE,~~kZACF~~,KAAK,cAAc,CAAA,EAErBA,EACE,OAAA,CAAA,EAAE,~~oZACF,~~KAAK,cAAc,CAAA,EAErBA,EACE,OAAA,CAAA,EAAE,~~oZACF~~,KAAK,cACL,CAAA,CAAA,CAAA,CAAA,CAGR"}
1	+ {"version":3,"file":"ico-kebab.js","sources":["../../../../src/components/icons/ico-kebab.tsx"],"sourcesContent":["import type { SVGProps } from 'react';\nimport { token } from '@styled/tokens';\ninterface SVGRProps {\n title?: string;\n titleId?: string;\n}\nexport interface Props extends SVGRProps, SVGProps<SVGSVGElement> {\n /*\n Configures icon color on monochrome svgs.\n */\n color?: string;\n}\nconst IcoKebab = ({ color: customColor, title, titleId, ...props }: Props) => {\n // Utilize dynamic primary text color by default\n const color = customColor \|\| token('colors.text.primary');\n return (\n <svg\n width={24}\n height={24}\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n color={color}\n aria-labelledby={titleId}\n {...props}\n >\n {title ? <title id={titleId}>{title}</title> : null}\n <path\n d=\"M11.8666 5.73325C11.3716 5.73325 10.8968 5.53659 10.5467 5.18653C10.1967 4.83647 10 4.36169 10 3.86663C10 3.37157 10.1967 2.89678 10.5467 2.54672C10.8968 2.19666 11.3716 2 11.8666 2C12.3617 2 12.8365 2.19666 13.1865 2.54672C13.5366 2.89678 13.7333 3.37157 13.7333 3.86663C13.7333 4.36169 13.5366 4.83647 13.1865 5.18653C12.8365 5.53659 12.3617 5.73325 11.8666 5.73325Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M11.8666 13.8665C11.3716 13.8665 10.8968 13.6699 10.5467 13.3198C10.1967 12.9697 10 12.495 10 11.9999C10 11.5048 10.1967 11.0301 10.5467 10.68C10.8968 10.3299 11.3716 10.1333 11.8666 10.1333C12.3617 10.1333 12.8365 10.3299 13.1865 10.68C13.5366 11.0301 13.7333 11.5048 13.7333 11.9999C13.7333 12.495 13.5366 12.9697 13.1865 13.3198C12.8365 13.6699 12.3617 13.8665 11.8666 13.8665Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M10 20.1334C10 20.6284 10.1967 21.1032 10.5467 21.4533C10.8968 21.8033 11.3716 22 11.8666 22C12.3617 22 12.8365 21.8033 13.1865 21.4533C13.5366 21.1032 13.7333 20.6284 13.7333 20.1334C13.7333 19.6383 13.5366 19.1635 13.1865 18.8135C12.8365 18.4634 12.3617 18.2668 11.8666 18.2668C11.3716 18.2668 10.8968 18.4634 10.5467 18.8135C10.1967 19.1635 10 19.6383 10 20.1334Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\nexport default IcoKebab;\n"],"names":["IcoKebab","customColor","title","titleId","props","color","token","_jsxs","_jsx"],"mappings":"yFAYA,MAAMA,EAAW,CAAC,CAAE,MAAOC,EAAa,MAAAC,EAAO,QAAAC,EAAS,GAAGC,CAAK,IAAa,CAE3E,MAAMC,EAAQJ,GAAeK,EAAM,qBAAqB,EACxD,OACEC,EACE,MAAA,CAAA,MAAO,GACP,OAAQ,GACR,QAAQ,YACR,KAAK,OACL,MAAM,6BACN,MAAOF,oBACUF,EAAO,GACpBC,EAAK,SAAA,CAERF,EAAQM,EAAA,QAAA,CAAO,GAAIL,EAAU,SAAAD,IAAiB,KAC/CM,EACE,OAAA,CAAA,EAAE,mXACF,KAAK,cAAc,CAAA,EAErBA,EACE,OAAA,CAAA,EAAE,+XACF,KAAK,cAAc,CAAA,EAErBA,EACE,OAAA,CAAA,EAAE,iXACF,KAAK,cACL,CAAA,CAAA,CAAA,CAAA,CAGR"}

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"button.js","sources":["../../../../src/components/primitives/button.tsx"],"sourcesContent":["import { LoadingSpinner } from '@components/feedback';\nimport { button } from '@recipes/button';\nimport { cx } from '@styled/css';\nimport { Box, Flex, HStack } from '@styled/jsx';\nimport { createHost, createSlot } from 'create-slots';\nimport React, { Children, MouseEventHandler, TouchEventHandler, cloneElement, forwardRef, useRef } from 'react';\nimport { mergeProps, useButton, useFocusRing, useHover, type AriaButtonProps } from 'react-aria';\n\nexport interface ButtonProps extends AriaButtonProps {\n label?: string;\n size?: 'sm' \| 'md' \| 'lg';\n variant?: 'primary' \| 'secondary' \| 'negative' \| 'neutral' \| 'tertiary' \| 'text' \| 'transparent';\n textStyle?: 'negative' \| 'neutral' \| 'subtle';\n disabled?: boolean;\n expand?: boolean;\n validating?: boolean;\n iconSize?: number;\n onHover?: MouseEventHandler<HTMLButtonElement> \| TouchEventHandler<HTMLButtonElement>;\n}\n\nconst LeadingIcon = createSlot(({ children, ...props }) => {\n return (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Flex>\n );\n});\n\nconst TrailingIcon = createSlot(({ children, ...props }) => {\n return (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Flex>\n );\n});\n\nconst Validation = ({ variant = 'primary', size = 'md' }: Partial<ButtonProps>) => {\n const spinnerInverted = variant === 'primary' \|\| variant === 'negative';\n const spinnerNeutral = variant === 'neutral' \|\| variant === 'tertiary';\n const spinnerSizes = {\n sm: 20,\n md: 24,\n lg: 28,\n };\n\n return (\n <LoadingSpinner size={spinnerSizes[size]} strokeWidth={2.5} inverted={spinnerInverted} neutral={spinnerNeutral} />\n );\n};\n\nconst Component = forwardRef<HTMLButtonElement, ButtonProps>((props, forwardedRef) => {\n const {\n label,\n variant = 'primary',\n textStyle,\n size = 'md',\n disabled,\n expand,\n validating,\n iconSize: iconSizeOverride,\n onHover,\n } = props;\n\n const iconSize = iconSizeOverride \|\| (size === 'sm' ? 16 : 24);\n\n const classes = button({ variant, textStyle, expand, size, validating, iconOnly: !label });\n\n const internalRef = useRef(null);\n const ref = forwardedRef \|\| internalRef;\n\n const { buttonProps } = useButton(\n { ...props, isDisabled: disabled ?? false },\n ref as React.RefObject<HTMLButtonElement>,\n );\n const { hoverProps } = useHover({ isDisabled: disabled ?? false });\n const { isFocusVisible, focusProps } = useFocusRing();\n\n return createHost(props.children, slots => {\n const leadingIcon = slots.get(LeadingIcon);\n const trailingIcon = slots.get(TrailingIcon);\n const containerSize = iconSize / 4;\n\n return (\n <button\n className={cx(classes.button, 'group', !label && classes.iconContainer, isFocusVisible && classes.focus)}\n ref={ref}\n {...mergeProps(buttonProps, hoverProps, focusProps)}\n aria-disabled={disabled}\n onMouseEnter={onHover as MouseEventHandler}\n onTouchStart={onHover as TouchEventHandler}\n >\n {validating ? (\n <Validation variant={variant} size={size} />\n ) : (\n <HStack w=\"full\" gap={2} justify={label && (leadingIcon \|\| trailingIcon) ? 'space-between' : 'center'}>\n {leadingIcon && {\n ...leadingIcon,\n props: {\n ...leadingIcon.props,\n className: !leadingIcon.props.color ? classes.icon : undefined,\n width: iconSize,\n height: iconSize,\n },\n }}\n {trailingIcon && label && expand && <Box w={containerSize} />}\n {label && <span className={classes.label}>{label}</span>}\n {leadingIcon && label && expand && <Box w={containerSize} />}\n {trailingIcon && {\n ...trailingIcon,\n props: {\n ...trailingIcon.props,\n className: !trailingIcon.props.color ? classes.icon : undefined,\n width: iconSize,\n height: iconSize,\n },\n }}\n </HStack>\n )}\n </button>\n );\n });\n});\n\nconst Button = Object.assign(Component, {\n LeadingIcon,\n TrailingIcon,\n});\n\nComponent.displayName = 'Button';\n\nexport default Button;\n"],"names":["LeadingIcon","createSlot","children","props","_jsx","Flex","Children","child","cloneElement","TrailingIcon","Validation","variant","size","spinnerInverted","spinnerNeutral","LoadingSpinner","Component","forwardRef","forwardedRef","label","textStyle","disabled","expand","validating","iconSizeOverride","onHover","iconSize","classes","button","internalRef","useRef","ref","buttonProps","useButton","hoverProps","useHover","isFocusVisible","focusProps","useFocusRing","createHost","slots","leadingIcon","trailingIcon","containerSize","cx","mergeProps","_jsxs","HStack","Box","Button"],"mappings":"~~4yBAoBMA~~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"}
1	+ {"version":3,"file":"button.js","sources":["../../../../src/components/primitives/button.tsx"],"sourcesContent":["import { LoadingSpinner } from '@components/feedback';\nimport { button } from '@recipes/button';\nimport { cx } from '@styled/css';\nimport { Box, Flex, HStack } from '@styled/jsx';\nimport { createHost, createSlot } from 'create-slots';\nimport React, { Children, MouseEventHandler, TouchEventHandler, cloneElement, forwardRef, useRef } from 'react';\nimport { mergeProps, useButton, useFocusRing, useHover, type AriaButtonProps } from 'react-aria';\n\nexport interface ButtonProps extends AriaButtonProps {\n label?: string;\n size?: 'sm' \| 'md' \| 'lg';\n variant?: 'primary' \| 'secondary' \| 'negative' \| 'neutral' \| 'tertiary' \| 'text' \| 'transparent';\n textStyle?: 'negative' \| 'neutral' \| 'subtle';\n disabled?: boolean;\n expand?: boolean;\n validating?: boolean;\n iconSize?: number;\n onHover?: MouseEventHandler<HTMLButtonElement> \| TouchEventHandler<HTMLButtonElement>;\n}\n\nconst LeadingIcon = createSlot(({ children, ...props }) => {\n return (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Flex>\n );\n});\n\nconst TrailingIcon = createSlot(({ children, ...props }) => {\n return (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Flex>\n );\n});\n\nconst Validation = ({ variant = 'primary', size = 'md' }: Partial<ButtonProps>) => {\n const spinnerInverted = variant === 'primary' \|\| variant === 'negative';\n const spinnerNeutral = variant === 'neutral' \|\| variant === 'tertiary';\n const spinnerSizes = {\n sm: 20,\n md: 24,\n lg: 28,\n };\n\n return (\n <LoadingSpinner size={spinnerSizes[size]} strokeWidth={2.5} inverted={spinnerInverted} neutral={spinnerNeutral} />\n );\n};\n\nconst Component = forwardRef<HTMLButtonElement, ButtonProps>((props, forwardedRef) => {\n const {\n label,\n variant = 'primary',\n textStyle,\n size = 'md',\n disabled,\n expand,\n validating,\n iconSize: iconSizeOverride,\n onHover,\n } = props;\n\n const iconSize = iconSizeOverride \|\| (size === 'sm' ? 16 : 24);\n\n const classes = button({ variant, textStyle, expand, size, validating, iconOnly: !label });\n\n const internalRef = useRef(null);\n const ref = forwardedRef \|\| internalRef;\n\n const { buttonProps } = useButton(\n { ...props, isDisabled: disabled ?? false },\n ref as React.RefObject<HTMLButtonElement>,\n );\n const { hoverProps } = useHover({ isDisabled: disabled ?? false });\n const { isFocusVisible, focusProps } = useFocusRing();\n\n return createHost(props.children, slots => {\n const leadingIcon = slots.get(LeadingIcon);\n const trailingIcon = slots.get(TrailingIcon);\n const containerSize = iconSize / 4;\n\n return (\n <button\n className={cx(classes.button, 'group', !label && classes.iconContainer, isFocusVisible && classes.focus)}\n ref={ref}\n {...mergeProps(buttonProps, hoverProps, focusProps)}\n aria-disabled={disabled}\n onMouseEnter={onHover as MouseEventHandler}\n onTouchStart={onHover as TouchEventHandler}\n >\n {validating ? (\n <Validation variant={variant} size={size} />\n ) : (\n <HStack w=\"full\" gap={2} justify={label && (leadingIcon \|\| trailingIcon) ? 'space-between' : 'center'}>\n {leadingIcon && {\n ...leadingIcon,\n props: {\n ...leadingIcon.props,\n className: !leadingIcon.props.color ? classes.icon : undefined,\n width: iconSize,\n height: iconSize,\n },\n }}\n {trailingIcon && label && expand && <Box w={containerSize} />}\n {label && <span className={classes.label}>{label}</span>}\n {leadingIcon && label && expand && <Box w={containerSize} />}\n {trailingIcon && {\n ...trailingIcon,\n props: {\n ...trailingIcon.props,\n className: !trailingIcon.props.color ? classes.icon : undefined,\n width: iconSize,\n height: iconSize,\n },\n }}\n </HStack>\n )}\n </button>\n );\n });\n});\n\nconst Button = Object.assign(Component, {\n LeadingIcon,\n TrailingIcon,\n});\n\nComponent.displayName = 'Button';\n\nexport default Button;\n"],"names":["LeadingIcon","createSlot","children","props","_jsx","Flex","Children","child","cloneElement","TrailingIcon","Validation","variant","size","spinnerInverted","spinnerNeutral","LoadingSpinner","Component","forwardRef","forwardedRef","label","textStyle","disabled","expand","validating","iconSizeOverride","onHover","iconSize","classes","button","internalRef","useRef","ref","buttonProps","useButton","hoverProps","useHover","isFocusVisible","focusProps","useFocusRing","createHost","slots","leadingIcon","trailingIcon","containerSize","cx","mergeProps","_jsxs","HStack","Box","Button"],"mappings":"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"}

package/dist/es/components/primitives/dropdown-selector.js CHANGED Viewed

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

package/dist/es/components/primitives/dropdown-selector.js.map CHANGED Viewed

	@@ -1 +1 @@
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 placeholder?: string;\n selectedValue?: string;\n size?: 'sm' \| 'md' \| 'lg';\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 size?: DropdownSelectorProps['size'];\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 SIZES = {\n sm: { caret: 16, check: 14, height: '2.625rem', top: 48, width: '0.75rem', mult: 2.25 },\n md: { caret: 17, check: 15, height: '2.8125rem', top: 52, width: '0.85rem', mult: 2.25 },\n lg: { caret: 18, check: 16, height: '3rem', top: 55, width: '1rem', mult: 2.5 },\n};\n\nconst DropdownContext = createContext<DropdownContextType>({\n selectedOption: null,\n setSelectedOption: () => {},\n});\n\nexport const DropdownOption = ({ value, label, size = 'lg', isFocused }: DropdownOptionProps) => {\n const { selectedOption, setSelectedOption } = useContext(DropdownContext);\n const isSelected = selectedOption?.value === value;\n const sizeProps = SIZES[size];\n\n const handleSelectOption = useCallback(() => {\n setSelectedOption({ value, label });\n }, [setSelectedOption, value, label]);\n\n return (\n <HStack\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 style={{ paddingLeft: sizeProps.width, paddingRight: sizeProps.width }}\n >\n <Box style={{ width: sizeProps.width }}>\n {isSelected && (\n <IcoCheckmark width={sizeProps.check} height={sizeProps.check} color={token('colors.surface.primary')} />\n )}\n </Box>\n <Text size={size} 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 placeholder = 'Select one',\n selectedValue,\n size = 'lg',\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 sizeProps = SIZES[size];\n const maxHeight = viewMax * sizeProps.mult + 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 : placeholder;\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\" p={4} justifyContent=\"space-between\" style={{ height: sizeProps.height }}>\n <Text size={size} styles={{ color: token(`colors.text.${selectedValue ? 'primary' : 'tertiary'}`) }}>\n {selectedLabel}\n </Text>\n {isOpen ? (\n <IcoCaretUp width={sizeProps.caret} height={sizeProps.caret} color={token('colors.brand.base')} />\n ) : (\n <IcoCaretDown width={sizeProps.caret} height={sizeProps.caret} 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 boxShadow=\"4px 8px 20px 0px rgba(0, 0, 0, 0.15)\"\n style={{ maxHeight: `${maxHeight}rem`, top: sizeProps.top }}\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 size,\n }),\n )}\n </Box>\n )}\n </button>\n </VStack>\n </DropdownContext.Provider>\n );\n};\n\nDropdownOption.displayName = 'DropdownOption';\nDropdownSelector.displayName = 'DropdownSelector';\n"],"names":["SIZES","DropdownContext","createContext","DropdownOption","value","label","size","isFocused","selectedOption","setSelectedOption","useContext","isSelected","sizeProps","handleSelectOption","useCallback","_jsxs","HStack","_jsx","Box","IcoCheckmark","token","Text","DropdownSelector","children","onSelect","placeholder","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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"}
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 placeholder?: string;\n selectedValue?: string;\n size?: 'sm' \| 'md' \| 'lg';\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 size?: DropdownSelectorProps['size'];\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 SIZES = {\n sm: { caret: 16, check: 14, height: '2.625rem', top: 48, width: '0.75rem', mult: 2.25 },\n md: { caret: 17, check: 15, height: '2.8125rem', top: 52, width: '0.85rem', mult: 2.25 },\n lg: { caret: 18, check: 16, height: '3rem', top: 55, width: '1rem', mult: 2.5 },\n};\n\nconst DropdownContext = createContext<DropdownContextType>({\n selectedOption: null,\n setSelectedOption: () => {},\n});\n\nexport const DropdownOption = ({ value, label, size = 'lg', isFocused }: DropdownOptionProps) => {\n const { selectedOption, setSelectedOption } = useContext(DropdownContext);\n const isSelected = selectedOption?.value === value;\n const sizeProps = SIZES[size];\n\n const handleSelectOption = useCallback(() => {\n setSelectedOption({ value, label });\n }, [setSelectedOption, value, label]);\n\n return (\n <HStack\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 style={{ paddingLeft: sizeProps.width, paddingRight: sizeProps.width }}\n >\n <Box style={{ width: sizeProps.width }}>\n {isSelected && (\n <IcoCheckmark width={sizeProps.check} height={sizeProps.check} color={token('colors.surface.primary')} />\n )}\n </Box>\n <Text size={size} 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 placeholder = 'Select one',\n selectedValue,\n size = 'lg',\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 sizeProps = SIZES[size];\n const maxHeight = viewMax * sizeProps.mult + 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 : placeholder;\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\" p={4} justifyContent=\"space-between\" style={{ height: sizeProps.height }}>\n <Text size={size} styles={{ color: token(`colors.text.${selectedValue ? 'primary' : 'tertiary'}`) }}>\n {selectedLabel}\n </Text>\n {isOpen ? (\n <IcoCaretUp width={sizeProps.caret} height={sizeProps.caret} color={token('colors.brand.base')} />\n ) : (\n <IcoCaretDown width={sizeProps.caret} height={sizeProps.caret} 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 boxShadow=\"4px 8px 20px 0px rgba(0, 0, 0, 0.15)\"\n style={{ maxHeight: `${maxHeight}rem`, top: sizeProps.top }}\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 size,\n }),\n )}\n </Box>\n )}\n </button>\n </VStack>\n </DropdownContext.Provider>\n );\n};\n\nDropdownOption.displayName = 'DropdownOption';\nDropdownSelector.displayName = 'DropdownSelector';\n"],"names":["SIZES","DropdownContext","createContext","DropdownOption","value","label","size","isFocused","selectedOption","setSelectedOption","useContext","isSelected","sizeProps","handleSelectOption","useCallback","_jsxs","HStack","_jsx","Box","IcoCheckmark","token","Text","DropdownSelector","children","onSelect","placeholder","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/es/components/sections/verify-pincode.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as f,jsx as o}from"react/jsx-runtime";import"../feedback/callout.js";import{LoadingSpinner as u}from"../feedback/loading-spinner.js";import{token as C}from"@styled/tokens";import j from"../icons/ico-checkmark-circle-fill.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 x from"../primitives/text.js";import"../primitives/portal.js";import"react";import"../../hooks/useToast.js";import"../../recipes/toast.js";import{VStack as y,Center as S}from"@styled/jsx";import"../feedback/tooltip.js";import"../inputs/phone-input.js";import{PinCodeInput as b}from"../inputs/pincode-input.js";import"../inputs/text-input.js";import{createSlot as k,createHost as F}from"create-slots";const i=k(({children:r})=>r),L=r=>{const{isPending:e,isSuccess:n,onChange:m,onComplete:p,originName:s,pinLength:c,id:a,autoFocus:g,errorMessage:t,children:h}=r,d=()=>e?o(u,{size:36,strokeWidth:4}):n?o(j,{color:C("colors.brand.base"),width:36,height:36}):o(b,{originName:s,onChange:m,pinLength:c,onComplete:p,id:a,autoFocus:g});return F(h,l=>f(y,{gap:3,my:3,children:[o(S,{height:12,children:d()}),t&&o(x,{variant:"error",size:"sm",styles:{textAlign:"center"},children:t}),l.get(i)]}))},P=Object.assign(L,{RetryContent:i});export{P as VerifyPincode};
+import{jsxs as f,jsx as o}from"react/jsx-runtime";import"../feedback/callout.js";import{LoadingSpinner as u}from"../feedback/loading-spinner.js";import"../feedback/progress-bar.js";import{token as C}from"@styled/tokens";import j from"../icons/ico-checkmark-circle-fill.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 x from"../primitives/text.js";import"../primitives/portal.js";import"react";import"../../hooks/useToast.js";import"../../recipes/toast.js";import{VStack as y,Center as S}from"@styled/jsx";import"../feedback/tooltip.js";import"../inputs/phone-input.js";import{PinCodeInput as b}from"../inputs/pincode-input.js";import"../inputs/text-input.js";import{createSlot as k,createHost as F}from"create-slots";const i=k(({children:r})=>r),L=r=>{const{isPending:e,isSuccess:n,onChange:m,onComplete:p,originName:s,pinLength:c,id:a,autoFocus:g,errorMessage:t,children:h}=r,d=()=>e?o(u,{size:36,strokeWidth:4}):n?o(j,{color:C("colors.brand.base"),width:36,height:36}):o(b,{originName:s,onChange:m,pinLength:c,onComplete:p,id:a,autoFocus:g});return F(h,l=>f(y,{gap:3,my:3,children:[o(S,{height:12,children:d()}),t&&o(x,{variant:"error",size:"sm",styles:{textAlign:"center"},children:t}),l.get(i)]}))},P=Object.assign(L,{RetryContent:i});export{P as VerifyPincode};
 //# sourceMappingURL=verify-pincode.js.map

package/dist/es/components/sections/verify-pincode.js.map CHANGED Viewed

	@@ -1 +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":"~~43BAeA~~,MAAMA,EAAeC,EAAW,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,EAACC,EAAc,CAAC,KAAM,GAAI,YAAa,CAAC,CAAA,EAE1DV,EAAkBS,EAACE,EAAsB,CAAC,MAAOC,EAAM,mBAAmB,EAAG,MAAO,GAAI,OAAQ,KAGlGH,EAACI,EAAY,CACX,WAAYV,EACZ,SAAUF,EACV,UAAWG,EACX,WAAYF,EACZ,GAAIG,EAEJ,UAAWC,CACX,CAAA,EAIN,OAAOQ,EAAWlB,EAAUmB,GAExBC,EAACC,EAAO,CAAA,IAAK,EAAG,GAAI,EAClB,SAAA,CAAAR,EAACS,EAAO,CAAA,OAAQ,GAAK,SAAAV,GAAuB,CAAA,EAC3CD,GACCE,EAACU,GAAK,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"}
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":"g6BAeA,MAAMA,EAAeC,EAAW,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,EAACC,EAAc,CAAC,KAAM,GAAI,YAAa,CAAC,CAAA,EAE1DV,EAAkBS,EAACE,EAAsB,CAAC,MAAOC,EAAM,mBAAmB,EAAG,MAAO,GAAI,OAAQ,KAGlGH,EAACI,EAAY,CACX,WAAYV,EACZ,SAAUF,EACV,UAAWG,EACX,WAAYF,EACZ,GAAIG,EAEJ,UAAWC,CACX,CAAA,EAIN,OAAOQ,EAAWlB,EAAUmB,GAExBC,EAACC,EAAO,CAAA,IAAK,EAAG,GAAI,EAClB,SAAA,CAAAR,EAACS,EAAO,CAAA,OAAQ,GAAK,SAAAV,GAAuB,CAAA,EAC3CD,GACCE,EAACU,GAAK,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/es/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{Content as r}from"./components/containers/content.js";import{Drawer as a}from"./components/containers/drawer.js";import{Footer as l}from"./components/containers/footer.js";import{Header as m}from"./components/containers/header.js";import{Modal as d}from"./components/containers/modal.js";import{Overlay as x}from"./components/containers/overlay.js";import{PayPalButton as n}from"./components/external/paypal-button.js";import{SocialLoginButton as g}from"./components/external/social-login-button.js";import{Callout as I}from"./components/feedback/callout.js";import{LoadingSpinner as k}from"./components/feedback/loading-spinner.js";import{Toast as F,ToastProvider as h}from"./components/feedback/toast-provider.js";import{default as w}from"./components/feedback/tooltip.js";import{default as b}from"./components/icons/ico-add.js";import{default as S}from"./components/icons/ico-alert-circle-fill.js";import{default as W}from"./components/icons/ico-alert-circle.js";import{default as E}from"./components/icons/ico-arrow-down.js";import{default as G}from"./components/icons/ico-arrow-left.js";import{default as R}from"./components/icons/ico-arrow-right.js";import{default as z}from"./components/icons/ico-asterisk-with-shield.js";import{default as Z}from"./components/icons/ico-asterisk.js";import{default as X}from"./components/icons/ico-astronaut.js";import{default as Q}from"./components/icons/ico-atom.js";import{default as V}from"./components/icons/ico-bank.js";import{default as J}from"./components/icons/ico-bell-notification.js";import{default as Y}from"./components/icons/ico-bell.js";import{default as $}from"./components/icons/ico-block.js";import{default as eo}from"./components/icons/ico-branding.js";import{default as to}from"./components/icons/ico-caret-down.js";import{default as fo}from"./components/icons/ico-caret-left.js";import{default as so}from"./components/icons/ico-caret-right.js";import{default as po}from"./components/icons/ico-caret-up.js";import{default as xo}from"./components/icons/ico-checkmark-circle-fill.js";import{default as no}from"./components/icons/ico-checkmark-circle.js";import{default as go}from"./components/icons/ico-checkmark.js";import{default as Io}from"./components/icons/ico-code-editor.js";import{default as ko}from"./components/icons/ico-code-sandbox.js";import{default as Fo}from"./components/icons/ico-code.js";import{default as Co}from"./components/icons/ico-command-line.js";import{default as Ao}from"./components/icons/ico-comment.js";import{default as Po}from"./components/icons/ico-copy.js";import{default as yo}from"./components/icons/ico-credit-card.js";import{default as To}from"./components/icons/ico-dedicated.js";import{default as Do}from"./components/icons/ico-diamond.js";import{default as Oo}from"./components/icons/ico-dismiss-circle-fill.js";import{default as vo}from"./components/icons/ico-dismiss-circle.js";import{default as Ho}from"./components/icons/ico-dismiss.js";import{default as No}from"./components/icons/ico-doc.js";import{default as jo}from"./components/icons/ico-download.js";import{default as Uo}from"./components/icons/ico-edit-email.js";import{default as qo}from"./components/icons/ico-edit.js";import{default as Ko}from"./components/icons/ico-email-fill.js";import{default as _o}from"./components/icons/ico-email-open.js";import{default as oe}from"./components/icons/ico-email.js";import{default as re}from"./components/icons/ico-expand.js";import{default as ae}from"./components/icons/ico-expiration.js";import{default as le}from"./components/icons/ico-external-link.js";import{default as me}from"./components/icons/ico-eye-closed.js";import{default as de}from"./components/icons/ico-eye-opened.js";import{default as xe}from"./components/icons/ico-fingerprint-fill.js";import{default as ne}from"./components/icons/ico-fingerprint.js";import{default as ge}from"./components/icons/ico-gas.js";import{default as Ie}from"./components/icons/ico-gift.js";import{default as ke}from"./components/icons/ico-globe.js";import{default as Fe}from"./components/icons/ico-guide.js";import{default as Ce}from"./components/icons/ico-home.js";import{default as Ae}from"./components/icons/ico-hourglass.js";import{default as Pe}from"./components/icons/ico-info-circle-fill.js";import{default as ye}from"./components/icons/ico-info-circle.js";import{default as Te}from"./components/icons/ico-kebab.js";import{default as De}from"./components/icons/ico-key.js";import{default as Oe}from"./components/icons/ico-lightbulb-fill.js";import{default as ve}from"./components/icons/ico-lightbulb.js";import{default as He}from"./components/icons/ico-lightning-fill.js";import{default as Ne}from"./components/icons/ico-lightning.js";import{default as je}from"./components/icons/ico-link.js";import{default as Ue}from"./components/icons/ico-loading-fill.js";import{default as qe}from"./components/icons/ico-loading.js";import{default as Ke}from"./components/icons/ico-lock-locked.js";import{default as _e}from"./components/icons/ico-lock-password.js";import{default as or}from"./components/icons/ico-lock-unlocked.js";import{default as rr}from"./components/icons/ico-login-form.js";import{default as ar}from"./components/icons/ico-magic.js";import{default as lr}from"./components/icons/ico-megaphone.js";import{default as mr}from"./components/icons/ico-menu.js";import{default as dr}from"./components/icons/ico-message-fill.js";import{default as xr}from"./components/icons/ico-message.js";import{default as nr}from"./components/icons/ico-mfa.js";import{default as gr}from"./components/icons/ico-minimize.js";import{default as Ir}from"./components/icons/ico-mobile2fa.js";import{default as kr}from"./components/icons/ico-mobile2fafill.js";import{default as Fr}from"./components/icons/ico-open-book.js";import{default as Cr}from"./components/icons/ico-paper-plane.js";import{default as Ar}from"./components/icons/ico-passport.js";import{default as Pr}from"./components/icons/ico-passwordless.js";import{default as yr}from"./components/icons/ico-pending-connection.js";import{default as Tr}from"./components/icons/ico-phone.js";import{default as Dr}from"./components/icons/ico-price.js";import{default as Or}from"./components/icons/ico-qrcode.js";import{default as vr}from"./components/icons/ico-question-circle-fill.js";import{default as Hr}from"./components/icons/ico-question-circle.js";import{default as Nr}from"./components/icons/ico-refresh-circle-fill.js";import{default as jr}from"./components/icons/ico-refresh.js";import{default as Ur}from"./components/icons/ico-rocket-fill.js";import{default as qr}from"./components/icons/ico-search.js";import{default as Kr}from"./components/icons/ico-settings.js";import{default as _r}from"./components/icons/ico-shield-approved.js";import{default as ot}from"./components/icons/ico-shield-rejected.js";import{default as rt}from"./components/icons/ico-shield.js";import{default as at}from"./components/icons/ico-social.js";import{default as lt}from"./components/icons/ico-sold-out-tag.js";import{default as mt}from"./components/icons/ico-star.js";import{default as dt}from"./components/icons/ico-swap.js";import{default as xt}from"./components/icons/ico-swatches.js";import{default as nt}from"./components/icons/ico-team.js";import{default as gt}from"./components/icons/ico-trash.js";import{default as It}from"./components/icons/ico-users.js";import{default as kt}from"./components/icons/ico-wallet-fill.js";import{default as Ft}from"./components/icons/ico-wallet.js";import{default as Ct}from"./components/icons/ico-wand.js";import{default as At}from"./components/icons/ico-warning-fill.js";import{default as Pt}from"./components/icons/ico-warning.js";import{default as yt}from"./components/icons/ico-widget-ui.js";import{default as Tt}from"./components/info/copy-button.js";import{default as Dt}from"./components/info/email-wbr.js";import{default as Ot}from"./components/info/security-otp.js";import{default as vt}from"./components/info/text-box.js";import{default as Ht}from"./components/info/wallet-address.js";import{default as Nt}from"./components/inputs/phone-input.js";import{PinCodeInput as jt}from"./components/inputs/pincode-input.js";import{TextInput as Ut}from"./components/inputs/text-input.js";import{Dialogue as qt}from"./components/layouts/dialogue.js";import{Error as Kt}from"./components/layouts/error.js";import{Page as _t}from"./components/layouts/page.js";import{default as oa}from"./components/list-items/navigation-button.js";import{NFTTile as ra}from"./components/list-items/nft-tile.js";import{TokenListItem as aa}from"./components/list-items/token-list-item.js";import{default as la}from"./components/logos/blc-algorand.js";import{default as ma}from"./components/logos/blc-aptos.js";import{default as da}from"./components/logos/blc-arbitrum.js";import{default as xa}from"./components/logos/blc-astar.js";import{default as na}from"./components/logos/blc-avalanche.js";import{default as ga}from"./components/logos/blc-base.js";import{default as Ia}from"./components/logos/blc-berachain.js";import{default as ka}from"./components/logos/blc-binance.js";import{default as Fa}from"./components/logos/blc-bitcoin.js";import{default as Ca}from"./components/logos/blc-celo.js";import{default as Aa}from"./components/logos/blc-chiliz.js";import{default as Pa}from"./components/logos/blc-cosmos.js";import{default as ya}from"./components/logos/blc-ethereum.js";import{default as Ta}from"./components/logos/blc-etherlink.js";import{default as Da}from"./components/logos/blc-flow.js";import{default as Oa}from"./components/logos/blc-harmony.js";import{default as va}from"./components/logos/blc-icon.js";import{default as Ha}from"./components/logos/blc-immutable-x.js";import{default as Na}from"./components/logos/blc-loopring.js";import{default as ja}from"./components/logos/blc-moonbeam.js";import{default as Ua}from"./components/logos/blc-near.js";import{default as qa}from"./components/logos/blc-optimism.js";import{default as Ka}from"./components/logos/blc-polkadot.js";import{default as _a}from"./components/logos/blc-polygon.js";import{default as of}from"./components/logos/blc-rarichain.js";import{default as rf}from"./components/logos/blc-solana.js";import{default as af}from"./components/logos/blc-stability.js";import{default as lf}from"./components/logos/blc-sui.js";import{default as mf}from"./components/logos/blc-tezos.js";import{default as df}from"./components/logos/blc-wax.js";import{default as xf}from"./components/logos/blc-zetachain.js";import{default as nf}from"./components/logos/blc-zilliqa.js";import{default as Lf}from"./components/logos/blc-zksync.js";import{default as Mf}from"./components/logos/fwk-11ty.js";import{default as Bf}from"./components/logos/fwk-android.js";import{default as hf}from"./components/logos/fwk-apple.js";import{default as wf}from"./components/logos/fwk-authy.js";import{default as bf}from"./components/logos/fwk-binance-fill.js";import{default as Sf}from"./components/logos/fwk-chrome.js";import{default as Wf}from"./components/logos/fwk-electron.js";import{default as Ef}from"./components/logos/fwk-express.js";import{default as Gf}from"./components/logos/fwk-fauna.js";import{default as Rf}from"./components/logos/fwk-firebase.js";import{default as zf}from"./components/logos/fwk-go.js";import{default as Zf}from"./components/logos/fwk-google-authenticator.js";import{default as Xf}from"./components/logos/fwk-hasura.js";import{default as Qf}from"./components/logos/fwk-javascript.js";import{default as Vf}from"./components/logos/fwk-jwt.js";import{default as Jf}from"./components/logos/fwk-laravel.js";import{default as Yf}from"./components/logos/fwk-nextjs.js";import{default as $f}from"./components/logos/fwk-nodejs.js";import{default as el}from"./components/logos/fwk-nuxtjs.js";import{default as tl}from"./components/logos/fwk-php.js";import{default as fl}from"./components/logos/fwk-react.js";import{default as sl}from"./components/logos/fwk-strapi.js";import{default as pl}from"./components/logos/fwk-stripe.js";import{default as ul}from"./components/logos/fwk-vue.js";import{default as cl}from"./components/logos/fwk-webflow.js";import{default as il}from"./components/logos/fwk-wordpress.js";import{default as Ll}from"./components/logos/fwk-zapier.js";import{default as Ml}from"./components/logos/icon-art-dark.js";import{default as Bl}from"./components/logos/icon-art.js";import{default as hl}from"./components/logos/icon-email.js";import{default as wl}from"./components/logos/icon-game-controller-dark.js";import{default as bl}from"./components/logos/icon-game-controller.js";import{default as Sl}from"./components/logos/icon-generic-token.js";import{default as Wl}from"./components/logos/icon-magic-globe.js";import{default as El}from"./components/logos/icon-magic-logo.js";import{default as Gl}from"./components/logos/icon-music-dark.js";import{default as Rl}from"./components/logos/icon-music.js";import{default as zl}from"./components/logos/icon-profile-dark.js";import{default as Zl}from"./components/logos/icon-profile-light.js";import{default as Xl}from"./components/logos/icon-sms.js";import{default as Ql}from"./components/logos/icon-ticket-dark.js";import{default as Vl}from"./components/logos/icon-ticket.js";import{default as Jl}from"./components/logos/logo-algorand-mono.js";import{default as Yl}from"./components/logos/logo-algorand.js";import{default as $l}from"./components/logos/logo-apple-mono.js";import{default as es}from"./components/logos/logo-apple.js";import{default as ts}from"./components/logos/logo-aptos-mono.js";import{default as fs}from"./components/logos/logo-aptos.js";import{default as ss}from"./components/logos/logo-arbitrum-mono.js";import{default as ps}from"./components/logos/logo-arbitrum-one-mono.js";import{default as us}from"./components/logos/logo-arbitrum-one.js";import{default as cs}from"./components/logos/logo-arbitrum.js";import{default as is}from"./components/logos/logo-astar-mono.js";import{default as Ls}from"./components/logos/logo-astar.js";import{default as Ms}from"./components/logos/logo-auth0-mono.js";import{default as Bs}from"./components/logos/logo-auth0.js";import{default as hs}from"./components/logos/logo-avalanche-mono.js";import{default as ws}from"./components/logos/logo-avalanche.js";import{default as bs}from"./components/logos/logo-azure-mono.js";import{default as Ss}from"./components/logos/logo-azure.js";import{default as Ws}from"./components/logos/logo-base-mono.js";import{default as Es}from"./components/logos/logo-base.js";import{default as Gs}from"./components/logos/logo-berachain-mono.js";import{default as Rs}from"./components/logos/logo-berachain.js";import{default as zs}from"./components/logos/logo-binance-mono.js";import{default as Zs}from"./components/logos/logo-binance.js";import{default as Xs}from"./components/logos/logo-bit-bucket-mono.js";import{default as Qs}from"./components/logos/logo-bit-bucket.js";import{default as Vs}from"./components/logos/logo-bitcoin-mono.js";import{default as Js}from"./components/logos/logo-bitcoin.js";import{default as Ys}from"./components/logos/logo-bnb-mono.js";import{default as $s}from"./components/logos/logo-bnb.js";import{default as em}from"./components/logos/logo-celo-mono.js";import{default as tm}from"./components/logos/logo-celo.js";import{default as fm}from"./components/logos/logo-chiliz-mono.js";import{default as sm}from"./components/logos/logo-chiliz.js";import{default as pm}from"./components/logos/logo-cognito-mono.js";import{default as um}from"./components/logos/logo-cognito.js";import{default as cm}from"./components/logos/logo-cosmos-mono.js";import{default as im}from"./components/logos/logo-cosmos.js";import{default as Lm}from"./components/logos/logo-discord-mono.js";import{default as Mm}from"./components/logos/logo-discord.js";import{default as Bm}from"./components/logos/logo-ethereum-mono.js";import{default as hm}from"./components/logos/logo-ethereum.js";import{default as wm}from"./components/logos/logo-etherlink-mono.js";import{default as bm}from"./components/logos/logo-etherlink.js";import{default as Sm}from"./components/logos/logo-facebook-mono.js";import{default as Wm}from"./components/logos/logo-facebook.js";import{default as Em}from"./components/logos/logo-flare-mono.js";import{default as Gm}from"./components/logos/logo-flare.js";import{default as Rm}from"./components/logos/logo-flow-mono.js";import{default as zm}from"./components/logos/logo-flow.js";import{default as Zm}from"./components/logos/logo-git-hub-mono.js";import{default as Xm}from"./components/logos/logo-git-hub.js";import{default as Qm}from"./components/logos/logo-git-lab-mono.js";import{default as Vm}from"./components/logos/logo-git-lab.js";import{default as Jm}from"./components/logos/logo-google-mono.js";import{default as Ym}from"./components/logos/logo-google.js";import{default as $m}from"./components/logos/logo-harmony-mono.js";import{default as ep}from"./components/logos/logo-harmony.js";import{default as tp}from"./components/logos/logo-horizen-mono.js";import{default as fp}from"./components/logos/logo-horizen.js";import{default as sp}from"./components/logos/logo-icon-mono.js";import{default as pp}from"./components/logos/logo-icon.js";import{default as up}from"./components/logos/logo-immutable-x-mono.js";import{default as cp}from"./components/logos/logo-immutable-x.js";import{default as ip}from"./components/logos/logo-link-by-stripe-mono.js";import{default as Lp}from"./components/logos/logo-link-by-stripe.js";import{default as Mp}from"./components/logos/logo-link-mono.js";import{default as Bp}from"./components/logos/logo-link.js";import{default as hp}from"./components/logos/logo-linked-in-mono.js";import{default as wp}from"./components/logos/logo-linked-in.js";import{default as bp}from"./components/logos/logo-loopring-mono.js";import{default as Sp}from"./components/logos/logo-loopring.js";import{default as Wp}from"./components/logos/logo-microsoft-mono.js";import{default as Ep}from"./components/logos/logo-microsoft.js";import{default as Gp}from"./components/logos/logo-moonbeam-mono.js";import{default as Rp}from"./components/logos/logo-moonbeam.js";import{default as zp}from"./components/logos/logo-near-mono.js";import{default as Zp}from"./components/logos/logo-near.js";import{default as Xp}from"./components/logos/logo-onramper-mono.js";import{default as Qp}from"./components/logos/logo-onramper.js";import{default as Vp}from"./components/logos/logo-optimism-mono.js";import{default as Jp}from"./components/logos/logo-optimism.js";import{default as Yp}from"./components/logos/logo-pay-pal-mono.js";import{default as $p}from"./components/logos/logo-pay-pal-wordmark-mono.js";import{default as ed}from"./components/logos/logo-pay-pal-wordmark.js";import{default as td}from"./components/logos/logo-pay-pal.js";import{default as fd}from"./components/logos/logo-poa-mono.js";import{default as sd}from"./components/logos/logo-poa.js";import{default as pd}from"./components/logos/logo-polkadot-mono.js";import{default as ud}from"./components/logos/logo-polkadot.js";import{default as cd}from"./components/logos/logo-polygon-mono.js";import{default as id}from"./components/logos/logo-polygon.js";import{default as Ld}from"./components/logos/logo-rarichain-mono.js";import{default as Md}from"./components/logos/logo-rarichain.js";import{default as Bd}from"./components/logos/logo-sardine-mono.js";import{default as hd}from"./components/logos/logo-sardine.js";import{default as wd}from"./components/logos/logo-sei-mono.js";import{default as bd}from"./components/logos/logo-sei.js";import{default as Sd}from"./components/logos/logo-solana-mono.js";import{default as Wd}from"./components/logos/logo-solana.js";import{default as Ed}from"./components/logos/logo-stability-mono.js";import{default as Gd}from"./components/logos/logo-stability.js";import{default as Rd}from"./components/logos/logo-sui-mono.js";import{default as zd}from"./components/logos/logo-sui.js";import{default as Zd}from"./components/logos/logo-tezos-mono.js";import{default as Xd}from"./components/logos/logo-tezos.js";import{default as Qd}from"./components/logos/logo-twitch-mono.js";import{default as Vd}from"./components/logos/logo-twitch.js";import{default as Jd}from"./components/logos/logo-twitter-mono.js";import{default as Yd}from"./components/logos/logo-twitter.js";import{default as $d}from"./components/logos/logo-wallet-connect-mono.js";import{default as eu}from"./components/logos/logo-wallet-connect.js";import{default as tu}from"./components/logos/logo-warpcast-mono.js";import{default as fu}from"./components/logos/logo-warpcast.js";import{default as su}from"./components/logos/logo-wax-mono.js";import{default as pu}from"./components/logos/logo-wax.js";import{default as uu}from"./components/logos/logo-xdc-mono.js";import{default as cu}from"./components/logos/logo-xdc.js";import{default as iu}from"./components/logos/logo-zetachain-mono.js";import{default as Lu}from"./components/logos/logo-zetachain.js";import{default as Mu}from"./components/logos/logo-zilliqa-mono.js";import{default as Bu}from"./components/logos/logo-zilliqa.js";import{default as hu}from"./components/logos/logo-zksync-mono.js";import{default as wu}from"./components/logos/logo-zksync.js";import{default as bu}from"./components/logos/pay-amex.js";import{default as Su}from"./components/logos/pay-discover.js";import{default as Wu}from"./components/logos/pay-mastercard.js";import{default as Eu}from"./components/logos/pay-visa.js";import{default as Gu}from"./components/logos/presentation-logo.js";import{default as Ru}from"./components/logos/website-magic.js";import{default as zu}from"./components/logos/wlt-coinbase.js";import{default as Zu}from"./components/logos/wlt-mattel.js";import{default as Xu}from"./components/logos/wlt-metamask.js";import{default as Qu}from"./components/logos/wlt-phantom.js";import{default as Vu}from"./components/logos/wlt-rainbow.js";import{default as Ju}from"./components/logos/wlt-wallet-connect.js";import{default as Yu}from"./components/primitives/button.js";import{default as $u}from"./components/primitives/checkbox.js";import{DropdownOption as ex,DropdownSelector as rx}from"./components/primitives/dropdown-selector.js";import{Popover as ax}from"./components/primitives/popover.js";import{Radio as lx,RadioGroup as sx}from"./components/primitives/radio.js";import{SegmentedControl as px,Tab as dx}from"./components/primitives/segmented-control.js";import{default as xx}from"./components/primitives/switch.js";import{default as nx}from"./components/primitives/text.js";import{VerifyPincode as gx}from"./components/sections/verify-pincode.js";import{default as Ix}from"./components/utils/animate.js";import{ClientAssetLogo as kx}from"./components/utils/client-asset-logo.js";import{default as Fx}from"./components/utils/qr-code.js";import{default as Cx}from"./components/utils/secured-by-magic.js";import{default as Ax}from"./components/utils/shared-logo.js";import{useCustomVars as Px}from"./hooks/theme.js";import{useToast as yx}from"./hooks/useToast.js";export{Ix as Animate,la as BlcAlgorand,ma as BlcAptos,da as BlcArbitrum,xa as BlcAstar,na as BlcAvalanche,ga as BlcBase,Ia as BlcBerachain,ka as BlcBinance,Fa as BlcBitcoin,Ca as BlcCelo,Aa as BlcChiliz,Pa as BlcCosmos,ya as BlcEthereum,Ta as BlcEtherlink,Da as BlcFlow,Oa as BlcHarmony,va as BlcIcon,Ha as BlcImmutableX,Na as BlcLoopring,ja as BlcMoonbeam,Ua as BlcNear,qa as BlcOptimism,Ka as BlcPolkadot,_a as BlcPolygon,of as BlcRarichain,rf as BlcSolana,af as BlcStability,lf as BlcSui,mf as BlcTezos,df as BlcWax,xf as BlcZetachain,nf as BlcZilliqa,Lf as BlcZksync,Yu as Button,I as Callout,$u as Checkbox,kx as ClientAssetLogo,r as Content,Tt as CopyButton,qt as Dialogue,a as Drawer,ex as DropdownOption,rx as DropdownSelector,Dt as EmailWbr,Kt as Error,l as Footer,Mf as Fwk11ty,Bf as FwkAndroid,hf as FwkApple,wf as FwkAuthy,bf as FwkBinanceFill,Sf as FwkChrome,Wf as FwkElectron,Ef as FwkExpress,Gf as FwkFauna,Rf as FwkFirebase,zf as FwkGo,Zf as FwkGoogleAuthenticator,Xf as FwkHasura,Qf as FwkJavascript,Vf as FwkJwt,Jf as FwkLaravel,Yf as FwkNextjs,$f as FwkNodejs,el as FwkNuxtjs,tl as FwkPhp,fl as FwkReact,sl as FwkStrapi,pl as FwkStripe,ul as FwkVue,cl as FwkWebflow,il as FwkWordpress,Ll as FwkZapier,m as Header,b as IcoAdd,W as IcoAlertCircle,S as IcoAlertCircleFill,E as IcoArrowDown,G as IcoArrowLeft,R as IcoArrowRight,Z as IcoAsterisk,z as IcoAsteriskWithShield,X as IcoAstronaut,Q as IcoAtom,V as IcoBank,Y as IcoBell,J as IcoBellNotification,$ as IcoBlock,eo as IcoBranding,to as IcoCaretDown,fo as IcoCaretLeft,so as IcoCaretRight,po as IcoCaretUp,go as IcoCheckmark,no as IcoCheckmarkCircle,xo as IcoCheckmarkCircleFill,Fo as IcoCode,Io as IcoCodeEditor,ko as IcoCodeSandbox,Co as IcoCommandLine,Ao as IcoComment,Po as IcoCopy,yo as IcoCreditCard,To as IcoDedicated,Do as IcoDiamond,Ho as IcoDismiss,vo as IcoDismissCircle,Oo as IcoDismissCircleFill,No as IcoDoc,jo as IcoDownload,qo as IcoEdit,Uo as IcoEditEmail,oe as IcoEmail,Ko as IcoEmailFill,_o as IcoEmailOpen,re as IcoExpand,ae as IcoExpiration,le as IcoExternalLink,me as IcoEyeClosed,de as IcoEyeOpened,ne as IcoFingerprint,xe as IcoFingerprintFill,ge as IcoGas,Ie as IcoGift,ke as IcoGlobe,Fe as IcoGuide,Ce as IcoHome,Ae as IcoHourglass,ye as IcoInfoCircle,Pe as IcoInfoCircleFill,Te as IcoKebab,De as IcoKey,ve as IcoLightbulb,Oe as IcoLightbulbFill,Ne as IcoLightning,He as IcoLightningFill,je as IcoLink,qe as IcoLoading,Ue as IcoLoadingFill,Ke as IcoLockLocked,_e as IcoLockPassword,or as IcoLockUnlocked,rr as IcoLoginForm,ar as IcoMagic,lr as IcoMegaphone,mr as IcoMenu,xr as IcoMessage,dr as IcoMessageFill,nr as IcoMfa,gr as IcoMinimize,Ir as IcoMobile2fa,kr as IcoMobile2fafill,Fr as IcoOpenBook,Cr as IcoPaperPlane,Ar as IcoPassport,Pr as IcoPasswordless,yr as IcoPendingConnection,Tr as IcoPhone,Dr as IcoPrice,Or as IcoQrcode,Hr as IcoQuestionCircle,vr as IcoQuestionCircleFill,jr as IcoRefresh,Nr as IcoRefreshCircleFill,Ur as IcoRocketFill,qr as IcoSearch,Kr as IcoSettings,rt as IcoShield,_r as IcoShieldApproved,ot as IcoShieldRejected,at as IcoSocial,lt as IcoSoldOutTag,mt as IcoStar,dt as IcoSwap,xt as IcoSwatches,nt as IcoTeam,gt as IcoTrash,It as IcoUsers,Ft as IcoWallet,kt as IcoWalletFill,Ct as IcoWand,Pt as IcoWarning,At as IcoWarningFill,yt as IcoWidgetUi,Bl as IconArt,Ml as IconArtDark,hl as IconEmail,bl as IconGameController,wl as IconGameControllerDark,Sl as IconGenericToken,Wl as IconMagicGlobe,El as IconMagicLogo,Rl as IconMusic,Gl as IconMusicDark,zl as IconProfileDark,Zl as IconProfileLight,Xl as IconSms,Vl as IconTicket,Ql as IconTicketDark,k as LoadingSpinner,Yl as LogoAlgorand,Jl as LogoAlgorandMono,es as LogoApple,$l as LogoAppleMono,fs as LogoAptos,ts as LogoAptosMono,cs as LogoArbitrum,ss as LogoArbitrumMono,us as LogoArbitrumOne,ps as LogoArbitrumOneMono,Ls as LogoAstar,is as LogoAstarMono,Bs as LogoAuth0,Ms as LogoAuth0Mono,ws as LogoAvalanche,hs as LogoAvalancheMono,Ss as LogoAzure,bs as LogoAzureMono,Es as LogoBase,Ws as LogoBaseMono,Rs as LogoBerachain,Gs as LogoBerachainMono,Zs as LogoBinance,zs as LogoBinanceMono,Qs as LogoBitBucket,Xs as LogoBitBucketMono,Js as LogoBitcoin,Vs as LogoBitcoinMono,$s as LogoBnb,Ys as LogoBnbMono,tm as LogoCelo,em as LogoCeloMono,sm as LogoChiliz,fm as LogoChilizMono,um as LogoCognito,pm as LogoCognitoMono,im as LogoCosmos,cm as LogoCosmosMono,Mm as LogoDiscord,Lm as LogoDiscordMono,hm as LogoEthereum,Bm as LogoEthereumMono,bm as LogoEtherlink,wm as LogoEtherlinkMono,Wm as LogoFacebook,Sm as LogoFacebookMono,Gm as LogoFlare,Em as LogoFlareMono,zm as LogoFlow,Rm as LogoFlowMono,Xm as LogoGitHub,Zm as LogoGitHubMono,Vm as LogoGitLab,Qm as LogoGitLabMono,Ym as LogoGoogle,Jm as LogoGoogleMono,ep as LogoHarmony,$m as LogoHarmonyMono,fp as LogoHorizen,tp as LogoHorizenMono,pp as LogoIcon,sp as LogoIconMono,cp as LogoImmutableX,up as LogoImmutableXMono,Bp as LogoLink,Lp as LogoLinkByStripe,ip as LogoLinkByStripeMono,Mp as LogoLinkMono,wp as LogoLinkedIn,hp as LogoLinkedInMono,Sp as LogoLoopring,bp as LogoLoopringMono,Ep as LogoMicrosoft,Wp as LogoMicrosoftMono,Rp as LogoMoonbeam,Gp as LogoMoonbeamMono,Zp as LogoNear,zp as LogoNearMono,Qp as LogoOnramper,Xp as LogoOnramperMono,Jp as LogoOptimism,Vp as LogoOptimismMono,td as LogoPayPal,Yp as LogoPayPalMono,ed as LogoPayPalWordmark,$p as LogoPayPalWordmarkMono,sd as LogoPoa,fd as LogoPoaMono,ud as LogoPolkadot,pd as LogoPolkadotMono,id as LogoPolygon,cd as LogoPolygonMono,Md as LogoRarichain,Ld as LogoRarichainMono,hd as LogoSardine,Bd as LogoSardineMono,bd as LogoSei,wd as LogoSeiMono,Wd as LogoSolana,Sd as LogoSolanaMono,Gd as LogoStability,Ed as LogoStabilityMono,zd as LogoSui,Rd as LogoSuiMono,Xd as LogoTezos,Zd as LogoTezosMono,Vd as LogoTwitch,Qd as LogoTwitchMono,Yd as LogoTwitter,Jd as LogoTwitterMono,eu as LogoWalletConnect,$d as LogoWalletConnectMono,fu as LogoWarpcast,tu as LogoWarpcastMono,pu as LogoWax,su as LogoWaxMono,cu as LogoXdc,uu as LogoXdcMono,Lu as LogoZetachain,iu as LogoZetachainMono,Bu as LogoZilliqa,Mu as LogoZilliqaMono,wu as LogoZksync,hu as LogoZksyncMono,d as Modal,ra as NFTTile,oa as NavigationButton,x as Overlay,_t as Page,bu as PayAmex,Su as PayDiscover,Wu as PayMastercard,n as PayPalButton,Eu as PayVisa,Nt as PhoneInput,jt as PinCodeInput,ax as Popover,Gu as PresentationLogo,Fx as QRCode,lx as Radio,sx as RadioGroup,Cx as SecuredByMagic,Ot as SecurityOtp,px as SegmentedControl,Ax as SharedLogo,g as SocialLoginButton,xx as Switch,dx as Tab,nx as Text,vt as TextBox,Ut as TextInput,F as Toast,h as ToastProvider,aa as TokenListItem,w as Tooltip,gx as VerifyPincode,Ht as WalletAddress,Ru as WebsiteMagic,zu as WltCoinbase,Zu as WltMattel,Xu as WltMetamask,Qu as WltPhantom,Vu as WltRainbow,Ju as WltWalletConnect,Px as useCustomVars,yx as useToast};
+import{Card as r}from"./components/containers/card.js";import{Content as a}from"./components/containers/content.js";import{Drawer as l}from"./components/containers/drawer.js";import{Footer as m}from"./components/containers/footer.js";import{Header as d}from"./components/containers/header.js";import{Modal as x}from"./components/containers/modal.js";import{Overlay as n}from"./components/containers/overlay.js";import{PayPalButton as g}from"./components/external/paypal-button.js";import{SocialLoginButton as I}from"./components/external/social-login-button.js";import{Callout as k}from"./components/feedback/callout.js";import{LoadingSpinner as F}from"./components/feedback/loading-spinner.js";import{ProgressBar as C}from"./components/feedback/progress-bar.js";import{Toast as A,ToastProvider as P}from"./components/feedback/toast-provider.js";import{default as S}from"./components/feedback/tooltip.js";import{default as W}from"./components/icons/ico-add.js";import{default as E}from"./components/icons/ico-alert-circle-fill.js";import{default as G}from"./components/icons/ico-alert-circle.js";import{default as R}from"./components/icons/ico-arrow-down.js";import{default as z}from"./components/icons/ico-arrow-left.js";import{default as Z}from"./components/icons/ico-arrow-right.js";import{default as X}from"./components/icons/ico-asterisk-with-shield.js";import{default as Q}from"./components/icons/ico-asterisk.js";import{default as V}from"./components/icons/ico-astronaut.js";import{default as J}from"./components/icons/ico-atom.js";import{default as Y}from"./components/icons/ico-bank.js";import{default as $}from"./components/icons/ico-bell-notification.js";import{default as eo}from"./components/icons/ico-bell.js";import{default as to}from"./components/icons/ico-block.js";import{default as fo}from"./components/icons/ico-branding.js";import{default as so}from"./components/icons/ico-caret-down.js";import{default as po}from"./components/icons/ico-caret-left.js";import{default as xo}from"./components/icons/ico-caret-right.js";import{default as no}from"./components/icons/ico-caret-up.js";import{default as go}from"./components/icons/ico-checkmark-circle-fill.js";import{default as Io}from"./components/icons/ico-checkmark-circle.js";import{default as ko}from"./components/icons/ico-checkmark.js";import{default as Fo}from"./components/icons/ico-code-editor.js";import{default as Co}from"./components/icons/ico-code-sandbox.js";import{default as Ao}from"./components/icons/ico-code.js";import{default as bo}from"./components/icons/ico-command-line.js";import{default as yo}from"./components/icons/ico-comment.js";import{default as To}from"./components/icons/ico-copy.js";import{default as Do}from"./components/icons/ico-credit-card.js";import{default as Oo}from"./components/icons/ico-dedicated.js";import{default as vo}from"./components/icons/ico-diamond.js";import{default as Ho}from"./components/icons/ico-dismiss-circle-fill.js";import{default as No}from"./components/icons/ico-dismiss-circle.js";import{default as jo}from"./components/icons/ico-dismiss.js";import{default as Uo}from"./components/icons/ico-doc.js";import{default as qo}from"./components/icons/ico-download.js";import{default as Ko}from"./components/icons/ico-edit-email.js";import{default as _o}from"./components/icons/ico-edit.js";import{default as oe}from"./components/icons/ico-email-fill.js";import{default as re}from"./components/icons/ico-email-open.js";import{default as ae}from"./components/icons/ico-email.js";import{default as le}from"./components/icons/ico-expand.js";import{default as me}from"./components/icons/ico-expiration.js";import{default as de}from"./components/icons/ico-external-link.js";import{default as xe}from"./components/icons/ico-eye-closed.js";import{default as ne}from"./components/icons/ico-eye-opened.js";import{default as ge}from"./components/icons/ico-fingerprint-fill.js";import{default as Ie}from"./components/icons/ico-fingerprint.js";import{default as ke}from"./components/icons/ico-gas.js";import{default as Fe}from"./components/icons/ico-gift.js";import{default as Ce}from"./components/icons/ico-globe.js";import{default as Ae}from"./components/icons/ico-guide.js";import{default as be}from"./components/icons/ico-home.js";import{default as ye}from"./components/icons/ico-hourglass.js";import{default as Te}from"./components/icons/ico-info-circle-fill.js";import{default as De}from"./components/icons/ico-info-circle.js";import{default as Oe}from"./components/icons/ico-kebab.js";import{default as ve}from"./components/icons/ico-key.js";import{default as He}from"./components/icons/ico-lightbulb-fill.js";import{default as Ne}from"./components/icons/ico-lightbulb.js";import{default as je}from"./components/icons/ico-lightning-fill.js";import{default as Ue}from"./components/icons/ico-lightning.js";import{default as qe}from"./components/icons/ico-link.js";import{default as Ke}from"./components/icons/ico-loading-fill.js";import{default as _e}from"./components/icons/ico-loading.js";import{default as or}from"./components/icons/ico-lock-locked.js";import{default as rr}from"./components/icons/ico-lock-password.js";import{default as ar}from"./components/icons/ico-lock-unlocked.js";import{default as lr}from"./components/icons/ico-login-form.js";import{default as mr}from"./components/icons/ico-magic.js";import{default as dr}from"./components/icons/ico-megaphone.js";import{default as xr}from"./components/icons/ico-menu.js";import{default as nr}from"./components/icons/ico-message-fill.js";import{default as gr}from"./components/icons/ico-message.js";import{default as Ir}from"./components/icons/ico-mfa.js";import{default as kr}from"./components/icons/ico-minimize.js";import{default as Fr}from"./components/icons/ico-mobile2fa.js";import{default as Cr}from"./components/icons/ico-mobile2fafill.js";import{default as Ar}from"./components/icons/ico-open-book.js";import{default as br}from"./components/icons/ico-paper-plane.js";import{default as yr}from"./components/icons/ico-passport.js";import{default as Tr}from"./components/icons/ico-passwordless.js";import{default as Dr}from"./components/icons/ico-pending-connection.js";import{default as Or}from"./components/icons/ico-phone.js";import{default as vr}from"./components/icons/ico-price.js";import{default as Hr}from"./components/icons/ico-qrcode.js";import{default as Nr}from"./components/icons/ico-question-circle-fill.js";import{default as jr}from"./components/icons/ico-question-circle.js";import{default as Ur}from"./components/icons/ico-refresh-circle-fill.js";import{default as qr}from"./components/icons/ico-refresh.js";import{default as Kr}from"./components/icons/ico-rocket-fill.js";import{default as _r}from"./components/icons/ico-search.js";import{default as ot}from"./components/icons/ico-settings.js";import{default as rt}from"./components/icons/ico-shield-approved.js";import{default as at}from"./components/icons/ico-shield-rejected.js";import{default as lt}from"./components/icons/ico-shield.js";import{default as mt}from"./components/icons/ico-social.js";import{default as dt}from"./components/icons/ico-sold-out-tag.js";import{default as xt}from"./components/icons/ico-star.js";import{default as nt}from"./components/icons/ico-swap.js";import{default as gt}from"./components/icons/ico-swatches.js";import{default as It}from"./components/icons/ico-team.js";import{default as kt}from"./components/icons/ico-trash.js";import{default as Ft}from"./components/icons/ico-users.js";import{default as Ct}from"./components/icons/ico-wallet-fill.js";import{default as At}from"./components/icons/ico-wallet.js";import{default as bt}from"./components/icons/ico-wand.js";import{default as yt}from"./components/icons/ico-warning-fill.js";import{default as Tt}from"./components/icons/ico-warning.js";import{default as Dt}from"./components/icons/ico-widget-ui.js";import{default as Ot}from"./components/info/copy-button.js";import{default as vt}from"./components/info/email-wbr.js";import{default as Ht}from"./components/info/security-otp.js";import{default as Nt}from"./components/info/text-box.js";import{default as jt}from"./components/info/wallet-address.js";import{default as Ut}from"./components/inputs/phone-input.js";import{PinCodeInput as qt}from"./components/inputs/pincode-input.js";import{TextInput as Kt}from"./components/inputs/text-input.js";import{Dialogue as _t}from"./components/layouts/dialogue.js";import{Error as oa}from"./components/layouts/error.js";import{Page as ra}from"./components/layouts/page.js";import{default as aa}from"./components/list-items/navigation-button.js";import{NFTTile as la}from"./components/list-items/nft-tile.js";import{TokenListItem as ma}from"./components/list-items/token-list-item.js";import{default as da}from"./components/logos/blc-algorand.js";import{default as xa}from"./components/logos/blc-aptos.js";import{default as na}from"./components/logos/blc-arbitrum.js";import{default as ga}from"./components/logos/blc-astar.js";import{default as Ia}from"./components/logos/blc-avalanche.js";import{default as ka}from"./components/logos/blc-base.js";import{default as Fa}from"./components/logos/blc-berachain.js";import{default as Ca}from"./components/logos/blc-binance.js";import{default as Aa}from"./components/logos/blc-bitcoin.js";import{default as ba}from"./components/logos/blc-celo.js";import{default as ya}from"./components/logos/blc-chiliz.js";import{default as Ta}from"./components/logos/blc-cosmos.js";import{default as Da}from"./components/logos/blc-ethereum.js";import{default as Oa}from"./components/logos/blc-etherlink.js";import{default as va}from"./components/logos/blc-flow.js";import{default as Ha}from"./components/logos/blc-harmony.js";import{default as Na}from"./components/logos/blc-icon.js";import{default as ja}from"./components/logos/blc-immutable-x.js";import{default as Ua}from"./components/logos/blc-loopring.js";import{default as qa}from"./components/logos/blc-moonbeam.js";import{default as Ka}from"./components/logos/blc-near.js";import{default as _a}from"./components/logos/blc-optimism.js";import{default as of}from"./components/logos/blc-polkadot.js";import{default as rf}from"./components/logos/blc-polygon.js";import{default as af}from"./components/logos/blc-rarichain.js";import{default as lf}from"./components/logos/blc-solana.js";import{default as mf}from"./components/logos/blc-stability.js";import{default as df}from"./components/logos/blc-sui.js";import{default as xf}from"./components/logos/blc-tezos.js";import{default as nf}from"./components/logos/blc-wax.js";import{default as Lf}from"./components/logos/blc-zetachain.js";import{default as Mf}from"./components/logos/blc-zilliqa.js";import{default as Bf}from"./components/logos/blc-zksync.js";import{default as hf}from"./components/logos/fwk-11ty.js";import{default as wf}from"./components/logos/fwk-android.js";import{default as Pf}from"./components/logos/fwk-apple.js";import{default as Sf}from"./components/logos/fwk-authy.js";import{default as Wf}from"./components/logos/fwk-binance-fill.js";import{default as Ef}from"./components/logos/fwk-chrome.js";import{default as Gf}from"./components/logos/fwk-electron.js";import{default as Rf}from"./components/logos/fwk-express.js";import{default as zf}from"./components/logos/fwk-fauna.js";import{default as Zf}from"./components/logos/fwk-firebase.js";import{default as Xf}from"./components/logos/fwk-go.js";import{default as Qf}from"./components/logos/fwk-google-authenticator.js";import{default as Vf}from"./components/logos/fwk-hasura.js";import{default as Jf}from"./components/logos/fwk-javascript.js";import{default as Yf}from"./components/logos/fwk-jwt.js";import{default as $f}from"./components/logos/fwk-laravel.js";import{default as el}from"./components/logos/fwk-nextjs.js";import{default as tl}from"./components/logos/fwk-nodejs.js";import{default as fl}from"./components/logos/fwk-nuxtjs.js";import{default as sl}from"./components/logos/fwk-php.js";import{default as pl}from"./components/logos/fwk-react.js";import{default as ul}from"./components/logos/fwk-strapi.js";import{default as cl}from"./components/logos/fwk-stripe.js";import{default as il}from"./components/logos/fwk-vue.js";import{default as Ll}from"./components/logos/fwk-webflow.js";import{default as Ml}from"./components/logos/fwk-wordpress.js";import{default as Bl}from"./components/logos/fwk-zapier.js";import{default as hl}from"./components/logos/icon-art-dark.js";import{default as wl}from"./components/logos/icon-art.js";import{default as Pl}from"./components/logos/icon-email.js";import{default as Sl}from"./components/logos/icon-game-controller-dark.js";import{default as Wl}from"./components/logos/icon-game-controller.js";import{default as El}from"./components/logos/icon-generic-token.js";import{default as Gl}from"./components/logos/icon-magic-globe.js";import{default as Rl}from"./components/logos/icon-magic-logo.js";import{default as zl}from"./components/logos/icon-music-dark.js";import{default as Zl}from"./components/logos/icon-music.js";import{default as Xl}from"./components/logos/icon-profile-dark.js";import{default as Ql}from"./components/logos/icon-profile-light.js";import{default as Vl}from"./components/logos/icon-sms.js";import{default as Jl}from"./components/logos/icon-ticket-dark.js";import{default as Yl}from"./components/logos/icon-ticket.js";import{default as $l}from"./components/logos/logo-algorand-mono.js";import{default as es}from"./components/logos/logo-algorand.js";import{default as ts}from"./components/logos/logo-apple-mono.js";import{default as fs}from"./components/logos/logo-apple.js";import{default as ss}from"./components/logos/logo-aptos-mono.js";import{default as ps}from"./components/logos/logo-aptos.js";import{default as us}from"./components/logos/logo-arbitrum-mono.js";import{default as cs}from"./components/logos/logo-arbitrum-one-mono.js";import{default as is}from"./components/logos/logo-arbitrum-one.js";import{default as Ls}from"./components/logos/logo-arbitrum.js";import{default as Ms}from"./components/logos/logo-astar-mono.js";import{default as Bs}from"./components/logos/logo-astar.js";import{default as hs}from"./components/logos/logo-auth0-mono.js";import{default as ws}from"./components/logos/logo-auth0.js";import{default as Ps}from"./components/logos/logo-avalanche-mono.js";import{default as Ss}from"./components/logos/logo-avalanche.js";import{default as Ws}from"./components/logos/logo-azure-mono.js";import{default as Es}from"./components/logos/logo-azure.js";import{default as Gs}from"./components/logos/logo-base-mono.js";import{default as Rs}from"./components/logos/logo-base.js";import{default as zs}from"./components/logos/logo-berachain-mono.js";import{default as Zs}from"./components/logos/logo-berachain.js";import{default as Xs}from"./components/logos/logo-binance-mono.js";import{default as Qs}from"./components/logos/logo-binance.js";import{default as Vs}from"./components/logos/logo-bit-bucket-mono.js";import{default as Js}from"./components/logos/logo-bit-bucket.js";import{default as Ys}from"./components/logos/logo-bitcoin-mono.js";import{default as $s}from"./components/logos/logo-bitcoin.js";import{default as em}from"./components/logos/logo-bnb-mono.js";import{default as tm}from"./components/logos/logo-bnb.js";import{default as fm}from"./components/logos/logo-celo-mono.js";import{default as sm}from"./components/logos/logo-celo.js";import{default as pm}from"./components/logos/logo-chiliz-mono.js";import{default as um}from"./components/logos/logo-chiliz.js";import{default as cm}from"./components/logos/logo-cognito-mono.js";import{default as im}from"./components/logos/logo-cognito.js";import{default as Lm}from"./components/logos/logo-cosmos-mono.js";import{default as Mm}from"./components/logos/logo-cosmos.js";import{default as Bm}from"./components/logos/logo-discord-mono.js";import{default as hm}from"./components/logos/logo-discord.js";import{default as wm}from"./components/logos/logo-ethereum-mono.js";import{default as Pm}from"./components/logos/logo-ethereum.js";import{default as Sm}from"./components/logos/logo-etherlink-mono.js";import{default as Wm}from"./components/logos/logo-etherlink.js";import{default as Em}from"./components/logos/logo-facebook-mono.js";import{default as Gm}from"./components/logos/logo-facebook.js";import{default as Rm}from"./components/logos/logo-flare-mono.js";import{default as zm}from"./components/logos/logo-flare.js";import{default as Zm}from"./components/logos/logo-flow-mono.js";import{default as Xm}from"./components/logos/logo-flow.js";import{default as Qm}from"./components/logos/logo-git-hub-mono.js";import{default as Vm}from"./components/logos/logo-git-hub.js";import{default as Jm}from"./components/logos/logo-git-lab-mono.js";import{default as Ym}from"./components/logos/logo-git-lab.js";import{default as $m}from"./components/logos/logo-google-mono.js";import{default as ep}from"./components/logos/logo-google.js";import{default as tp}from"./components/logos/logo-harmony-mono.js";import{default as fp}from"./components/logos/logo-harmony.js";import{default as sp}from"./components/logos/logo-horizen-mono.js";import{default as pp}from"./components/logos/logo-horizen.js";import{default as up}from"./components/logos/logo-icon-mono.js";import{default as cp}from"./components/logos/logo-icon.js";import{default as ip}from"./components/logos/logo-immutable-x-mono.js";import{default as Lp}from"./components/logos/logo-immutable-x.js";import{default as Mp}from"./components/logos/logo-link-by-stripe-mono.js";import{default as Bp}from"./components/logos/logo-link-by-stripe.js";import{default as hp}from"./components/logos/logo-link-mono.js";import{default as wp}from"./components/logos/logo-link.js";import{default as Pp}from"./components/logos/logo-linked-in-mono.js";import{default as Sp}from"./components/logos/logo-linked-in.js";import{default as Wp}from"./components/logos/logo-loopring-mono.js";import{default as Ep}from"./components/logos/logo-loopring.js";import{default as Gp}from"./components/logos/logo-microsoft-mono.js";import{default as Rp}from"./components/logos/logo-microsoft.js";import{default as zp}from"./components/logos/logo-moonbeam-mono.js";import{default as Zp}from"./components/logos/logo-moonbeam.js";import{default as Xp}from"./components/logos/logo-near-mono.js";import{default as Qp}from"./components/logos/logo-near.js";import{default as Vp}from"./components/logos/logo-onramper-mono.js";import{default as Jp}from"./components/logos/logo-onramper.js";import{default as Yp}from"./components/logos/logo-optimism-mono.js";import{default as $p}from"./components/logos/logo-optimism.js";import{default as ed}from"./components/logos/logo-pay-pal-mono.js";import{default as td}from"./components/logos/logo-pay-pal-wordmark-mono.js";import{default as fd}from"./components/logos/logo-pay-pal-wordmark.js";import{default as sd}from"./components/logos/logo-pay-pal.js";import{default as pd}from"./components/logos/logo-poa-mono.js";import{default as ud}from"./components/logos/logo-poa.js";import{default as cd}from"./components/logos/logo-polkadot-mono.js";import{default as id}from"./components/logos/logo-polkadot.js";import{default as Ld}from"./components/logos/logo-polygon-mono.js";import{default as Md}from"./components/logos/logo-polygon.js";import{default as Bd}from"./components/logos/logo-rarichain-mono.js";import{default as hd}from"./components/logos/logo-rarichain.js";import{default as wd}from"./components/logos/logo-sardine-mono.js";import{default as Pd}from"./components/logos/logo-sardine.js";import{default as Sd}from"./components/logos/logo-sei-mono.js";import{default as Wd}from"./components/logos/logo-sei.js";import{default as Ed}from"./components/logos/logo-solana-mono.js";import{default as Gd}from"./components/logos/logo-solana.js";import{default as Rd}from"./components/logos/logo-stability-mono.js";import{default as zd}from"./components/logos/logo-stability.js";import{default as Zd}from"./components/logos/logo-sui-mono.js";import{default as Xd}from"./components/logos/logo-sui.js";import{default as Qd}from"./components/logos/logo-tezos-mono.js";import{default as Vd}from"./components/logos/logo-tezos.js";import{default as Jd}from"./components/logos/logo-twitch-mono.js";import{default as Yd}from"./components/logos/logo-twitch.js";import{default as $d}from"./components/logos/logo-twitter-mono.js";import{default as eu}from"./components/logos/logo-twitter.js";import{default as tu}from"./components/logos/logo-wallet-connect-mono.js";import{default as fu}from"./components/logos/logo-wallet-connect.js";import{default as su}from"./components/logos/logo-warpcast-mono.js";import{default as pu}from"./components/logos/logo-warpcast.js";import{default as uu}from"./components/logos/logo-wax-mono.js";import{default as cu}from"./components/logos/logo-wax.js";import{default as iu}from"./components/logos/logo-xdc-mono.js";import{default as Lu}from"./components/logos/logo-xdc.js";import{default as Mu}from"./components/logos/logo-zetachain-mono.js";import{default as Bu}from"./components/logos/logo-zetachain.js";import{default as hu}from"./components/logos/logo-zilliqa-mono.js";import{default as wu}from"./components/logos/logo-zilliqa.js";import{default as Pu}from"./components/logos/logo-zksync-mono.js";import{default as Su}from"./components/logos/logo-zksync.js";import{default as Wu}from"./components/logos/pay-amex.js";import{default as Eu}from"./components/logos/pay-discover.js";import{default as Gu}from"./components/logos/pay-mastercard.js";import{default as Ru}from"./components/logos/pay-visa.js";import{default as zu}from"./components/logos/presentation-logo.js";import{default as Zu}from"./components/logos/website-magic.js";import{default as Xu}from"./components/logos/wlt-coinbase.js";import{default as Qu}from"./components/logos/wlt-mattel.js";import{default as Vu}from"./components/logos/wlt-metamask.js";import{default as Ju}from"./components/logos/wlt-phantom.js";import{default as Yu}from"./components/logos/wlt-rainbow.js";import{default as $u}from"./components/logos/wlt-wallet-connect.js";import{default as ex}from"./components/primitives/button.js";import{default as tx}from"./components/primitives/checkbox.js";import{DropdownOption as fx,DropdownSelector as lx}from"./components/primitives/dropdown-selector.js";import{Popover as mx}from"./components/primitives/popover.js";import{Radio as dx,RadioGroup as ux}from"./components/primitives/radio.js";import{SegmentedControl as cx,Tab as nx}from"./components/primitives/segmented-control.js";import{default as gx}from"./components/primitives/switch.js";import{default as Ix}from"./components/primitives/text.js";import{VerifyPincode as kx}from"./components/sections/verify-pincode.js";import{default as Fx}from"./components/utils/animate.js";import{ClientAssetLogo as Cx}from"./components/utils/client-asset-logo.js";import{default as Ax}from"./components/utils/qr-code.js";import{default as bx}from"./components/utils/secured-by-magic.js";import{default as yx}from"./components/utils/shared-logo.js";import{useCustomVars as Tx}from"./hooks/theme.js";import{useToast as Dx}from"./hooks/useToast.js";export{Fx as Animate,da as BlcAlgorand,xa as BlcAptos,na as BlcArbitrum,ga as BlcAstar,Ia as BlcAvalanche,ka as BlcBase,Fa as BlcBerachain,Ca as BlcBinance,Aa as BlcBitcoin,ba as BlcCelo,ya as BlcChiliz,Ta as BlcCosmos,Da as BlcEthereum,Oa as BlcEtherlink,va as BlcFlow,Ha as BlcHarmony,Na as BlcIcon,ja as BlcImmutableX,Ua as BlcLoopring,qa as BlcMoonbeam,Ka as BlcNear,_a as BlcOptimism,of as BlcPolkadot,rf as BlcPolygon,af as BlcRarichain,lf as BlcSolana,mf as BlcStability,df as BlcSui,xf as BlcTezos,nf as BlcWax,Lf as BlcZetachain,Mf as BlcZilliqa,Bf as BlcZksync,ex as Button,k as Callout,r as Card,tx as Checkbox,Cx as ClientAssetLogo,a as Content,Ot as CopyButton,_t as Dialogue,l as Drawer,fx as DropdownOption,lx as DropdownSelector,vt as EmailWbr,oa as Error,m as Footer,hf as Fwk11ty,wf as FwkAndroid,Pf as FwkApple,Sf as FwkAuthy,Wf as FwkBinanceFill,Ef as FwkChrome,Gf as FwkElectron,Rf as FwkExpress,zf as FwkFauna,Zf as FwkFirebase,Xf as FwkGo,Qf as FwkGoogleAuthenticator,Vf as FwkHasura,Jf as FwkJavascript,Yf as FwkJwt,$f as FwkLaravel,el as FwkNextjs,tl as FwkNodejs,fl as FwkNuxtjs,sl as FwkPhp,pl as FwkReact,ul as FwkStrapi,cl as FwkStripe,il as FwkVue,Ll as FwkWebflow,Ml as FwkWordpress,Bl as FwkZapier,d as Header,W as IcoAdd,G as IcoAlertCircle,E as IcoAlertCircleFill,R as IcoArrowDown,z as IcoArrowLeft,Z as IcoArrowRight,Q as IcoAsterisk,X as IcoAsteriskWithShield,V as IcoAstronaut,J as IcoAtom,Y as IcoBank,eo as IcoBell,$ as IcoBellNotification,to as IcoBlock,fo as IcoBranding,so as IcoCaretDown,po as IcoCaretLeft,xo as IcoCaretRight,no as IcoCaretUp,ko as IcoCheckmark,Io as IcoCheckmarkCircle,go as IcoCheckmarkCircleFill,Ao as IcoCode,Fo as IcoCodeEditor,Co as IcoCodeSandbox,bo as IcoCommandLine,yo as IcoComment,To as IcoCopy,Do as IcoCreditCard,Oo as IcoDedicated,vo as IcoDiamond,jo as IcoDismiss,No as IcoDismissCircle,Ho as IcoDismissCircleFill,Uo as IcoDoc,qo as IcoDownload,_o as IcoEdit,Ko as IcoEditEmail,ae as IcoEmail,oe as IcoEmailFill,re as IcoEmailOpen,le as IcoExpand,me as IcoExpiration,de as IcoExternalLink,xe as IcoEyeClosed,ne as IcoEyeOpened,Ie as IcoFingerprint,ge as IcoFingerprintFill,ke as IcoGas,Fe as IcoGift,Ce as IcoGlobe,Ae as IcoGuide,be as IcoHome,ye as IcoHourglass,De as IcoInfoCircle,Te as IcoInfoCircleFill,Oe as IcoKebab,ve as IcoKey,Ne as IcoLightbulb,He as IcoLightbulbFill,Ue as IcoLightning,je as IcoLightningFill,qe as IcoLink,_e as IcoLoading,Ke as IcoLoadingFill,or as IcoLockLocked,rr as IcoLockPassword,ar as IcoLockUnlocked,lr as IcoLoginForm,mr as IcoMagic,dr as IcoMegaphone,xr as IcoMenu,gr as IcoMessage,nr as IcoMessageFill,Ir as IcoMfa,kr as IcoMinimize,Fr as IcoMobile2fa,Cr as IcoMobile2fafill,Ar as IcoOpenBook,br as IcoPaperPlane,yr as IcoPassport,Tr as IcoPasswordless,Dr as IcoPendingConnection,Or as IcoPhone,vr as IcoPrice,Hr as IcoQrcode,jr as IcoQuestionCircle,Nr as IcoQuestionCircleFill,qr as IcoRefresh,Ur as IcoRefreshCircleFill,Kr as IcoRocketFill,_r as IcoSearch,ot as IcoSettings,lt as IcoShield,rt as IcoShieldApproved,at as IcoShieldRejected,mt as IcoSocial,dt as IcoSoldOutTag,xt as IcoStar,nt as IcoSwap,gt as IcoSwatches,It as IcoTeam,kt as IcoTrash,Ft as IcoUsers,At as IcoWallet,Ct as IcoWalletFill,bt as IcoWand,Tt as IcoWarning,yt as IcoWarningFill,Dt as IcoWidgetUi,wl as IconArt,hl as IconArtDark,Pl as IconEmail,Wl as IconGameController,Sl as IconGameControllerDark,El as IconGenericToken,Gl as IconMagicGlobe,Rl as IconMagicLogo,Zl as IconMusic,zl as IconMusicDark,Xl as IconProfileDark,Ql as IconProfileLight,Vl as IconSms,Yl as IconTicket,Jl as IconTicketDark,F as LoadingSpinner,es as LogoAlgorand,$l as LogoAlgorandMono,fs as LogoApple,ts as LogoAppleMono,ps as LogoAptos,ss as LogoAptosMono,Ls as LogoArbitrum,us as LogoArbitrumMono,is as LogoArbitrumOne,cs as LogoArbitrumOneMono,Bs as LogoAstar,Ms as LogoAstarMono,ws as LogoAuth0,hs as LogoAuth0Mono,Ss as LogoAvalanche,Ps as LogoAvalancheMono,Es as LogoAzure,Ws as LogoAzureMono,Rs as LogoBase,Gs as LogoBaseMono,Zs as LogoBerachain,zs as LogoBerachainMono,Qs as LogoBinance,Xs as LogoBinanceMono,Js as LogoBitBucket,Vs as LogoBitBucketMono,$s as LogoBitcoin,Ys as LogoBitcoinMono,tm as LogoBnb,em as LogoBnbMono,sm as LogoCelo,fm as LogoCeloMono,um as LogoChiliz,pm as LogoChilizMono,im as LogoCognito,cm as LogoCognitoMono,Mm as LogoCosmos,Lm as LogoCosmosMono,hm as LogoDiscord,Bm as LogoDiscordMono,Pm as LogoEthereum,wm as LogoEthereumMono,Wm as LogoEtherlink,Sm as LogoEtherlinkMono,Gm as LogoFacebook,Em as LogoFacebookMono,zm as LogoFlare,Rm as LogoFlareMono,Xm as LogoFlow,Zm as LogoFlowMono,Vm as LogoGitHub,Qm as LogoGitHubMono,Ym as LogoGitLab,Jm as LogoGitLabMono,ep as LogoGoogle,$m as LogoGoogleMono,fp as LogoHarmony,tp as LogoHarmonyMono,pp as LogoHorizen,sp as LogoHorizenMono,cp as LogoIcon,up as LogoIconMono,Lp as LogoImmutableX,ip as LogoImmutableXMono,wp as LogoLink,Bp as LogoLinkByStripe,Mp as LogoLinkByStripeMono,hp as LogoLinkMono,Sp as LogoLinkedIn,Pp as LogoLinkedInMono,Ep as LogoLoopring,Wp as LogoLoopringMono,Rp as LogoMicrosoft,Gp as LogoMicrosoftMono,Zp as LogoMoonbeam,zp as LogoMoonbeamMono,Qp as LogoNear,Xp as LogoNearMono,Jp as LogoOnramper,Vp as LogoOnramperMono,$p as LogoOptimism,Yp as LogoOptimismMono,sd as LogoPayPal,ed as LogoPayPalMono,fd as LogoPayPalWordmark,td as LogoPayPalWordmarkMono,ud as LogoPoa,pd as LogoPoaMono,id as LogoPolkadot,cd as LogoPolkadotMono,Md as LogoPolygon,Ld as LogoPolygonMono,hd as LogoRarichain,Bd as LogoRarichainMono,Pd as LogoSardine,wd as LogoSardineMono,Wd as LogoSei,Sd as LogoSeiMono,Gd as LogoSolana,Ed as LogoSolanaMono,zd as LogoStability,Rd as LogoStabilityMono,Xd as LogoSui,Zd as LogoSuiMono,Vd as LogoTezos,Qd as LogoTezosMono,Yd as LogoTwitch,Jd as LogoTwitchMono,eu as LogoTwitter,$d as LogoTwitterMono,fu as LogoWalletConnect,tu as LogoWalletConnectMono,pu as LogoWarpcast,su as LogoWarpcastMono,cu as LogoWax,uu as LogoWaxMono,Lu as LogoXdc,iu as LogoXdcMono,Bu as LogoZetachain,Mu as LogoZetachainMono,wu as LogoZilliqa,hu as LogoZilliqaMono,Su as LogoZksync,Pu as LogoZksyncMono,x as Modal,la as NFTTile,aa as NavigationButton,n as Overlay,ra as Page,Wu as PayAmex,Eu as PayDiscover,Gu as PayMastercard,g as PayPalButton,Ru as PayVisa,Ut as PhoneInput,qt as PinCodeInput,mx as Popover,zu as PresentationLogo,C as ProgressBar,Ax as QRCode,dx as Radio,ux as RadioGroup,bx as SecuredByMagic,Ht as SecurityOtp,cx as SegmentedControl,yx as SharedLogo,I as SocialLoginButton,gx as Switch,nx as Tab,Ix as Text,Nt as TextBox,Kt as TextInput,A as Toast,P as ToastProvider,ma as TokenListItem,S as Tooltip,kx as VerifyPincode,jt as WalletAddress,Zu as WebsiteMagic,Xu as WltCoinbase,Qu as WltMattel,Vu as WltMetamask,Ju as WltPhantom,Yu as WltRainbow,$u as WltWalletConnect,Tx as useCustomVars,Dx as useToast};
 //# sourceMappingURL=index.js.map

package/dist/es/recipes/card.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{cva as e}from"@styled/css";const a=e({base:{bgColor:"surface.primary",borderRadius:"1rem"},variants:{asButton:{false:{cursor:"default"},true:{alignItems:"center",cursor:"pointer",h:"10.75rem",justifyContent:"center",p:4,transition:"all 0.1s ease",w:"10.75rem",_active:{transform:"scale(0.95)"}}},alignment:{center:{alignItems:"center"},left:{alignItems:"flex-start"},right:{alignItems:"flex-end"}},alt:{true:{}},expand:{false:{overflow:"hidden"},true:{overflow:"visible",w:"full"}},gapType:{none:{gap:0},sm:{gap:4},md:{gap:5},lg:{gap:6}},heavyShadow:{false:{boxShadow:"0px 1px 2px rgba(189, 189, 189, 0.3)"},true:{boxShadow:"8px 8px 48px rgba(16, 15, 17, 0.14)"}},paddingType:{none:{p:0},sm:{px:4,py:3},md:{px:8,py:6},lg:{p:12}},widthMax:{true:{flex:1,maxW:"29.125rem",mdDown:{maxW:"full"}}}},compoundVariants:[{asButton:!0,alt:!0,css:{bgColor:"surface.tertiary",color:"text.secondary",_hover:{filter:"brightness(0.9)"}}}],defaultVariants:{alt:!1,expand:!1,gapType:"md",heavyShadow:!1,paddingType:"md",widthMax:!1}});export{a as card};
2	+ //# sourceMappingURL=card.js.map

package/dist/es/recipes/card.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"card.js","sources":["../../../src/recipes/card.ts"],"sourcesContent":["import { cva, type RecipeVariantProps } from '@styled/css';\n\nexport const card = cva({\n base: {\n bgColor: 'surface.primary',\n borderRadius: '1rem',\n },\n variants: {\n asButton: {\n false: {\n cursor: 'default',\n },\n true: {\n alignItems: 'center',\n cursor: 'pointer',\n h: '10.75rem',\n justifyContent: 'center',\n p: 4,\n transition: 'all 0.1s ease',\n w: '10.75rem',\n _active: { transform: 'scale(0.95)' },\n },\n },\n alignment: {\n center: {\n alignItems: 'center',\n },\n left: {\n alignItems: 'flex-start',\n },\n right: {\n alignItems: 'flex-end',\n },\n },\n alt: {\n true: {},\n },\n expand: {\n false: {\n overflow: 'hidden',\n },\n true: {\n overflow: 'visible',\n w: 'full',\n },\n },\n gapType: {\n none: {\n gap: 0,\n },\n sm: {\n gap: 4,\n },\n md: {\n gap: 5,\n },\n lg: {\n gap: 6,\n },\n },\n heavyShadow: {\n false: {\n boxShadow: '0px 1px 2px rgba(189, 189, 189, 0.3)',\n },\n true: {\n boxShadow: '8px 8px 48px rgba(16, 15, 17, 0.14)',\n },\n },\n paddingType: {\n none: {\n p: 0,\n },\n sm: {\n px: 4,\n py: 3,\n },\n md: {\n px: 8,\n py: 6,\n },\n lg: {\n p: 12,\n },\n },\n widthMax: {\n true: {\n flex: 1,\n maxW: '29.125rem',\n mdDown: { maxW: 'full' },\n },\n },\n },\n compoundVariants: [\n {\n asButton: true,\n alt: true,\n css: {\n bgColor: 'surface.tertiary',\n color: 'text.secondary',\n _hover: {\n filter: 'brightness(0.9)',\n },\n },\n },\n ],\n defaultVariants: {\n alt: false,\n expand: false,\n gapType: 'md',\n heavyShadow: false,\n paddingType: 'md',\n widthMax: false,\n },\n});\n\nexport type CardVariants = RecipeVariantProps<typeof card>;\n"],"names":["card","cva"],"mappings":"kCAEO,MAAMA,EAAOC,EAAI,CACtB,KAAM,CACJ,QAAS,kBACT,aAAc,MACf,EACD,SAAU,CACR,SAAU,CACR,MAAO,CACL,OAAQ,SACT,EACD,KAAM,CACJ,WAAY,SACZ,OAAQ,UACR,EAAG,WACH,eAAgB,SAChB,EAAG,EACH,WAAY,gBACZ,EAAG,WACH,QAAS,CAAE,UAAW,aAAe,CACtC,CACF,EACD,UAAW,CACT,OAAQ,CACN,WAAY,QACb,EACD,KAAM,CACJ,WAAY,YACb,EACD,MAAO,CACL,WAAY,UACb,CACF,EACD,IAAK,CACH,KAAM,CACP,CAAA,EACD,OAAQ,CACN,MAAO,CACL,SAAU,QACX,EACD,KAAM,CACJ,SAAU,UACV,EAAG,MACJ,CACF,EACD,QAAS,CACP,KAAM,CACJ,IAAK,CACN,EACD,GAAI,CACF,IAAK,CACN,EACD,GAAI,CACF,IAAK,CACN,EACD,GAAI,CACF,IAAK,CACN,CACF,EACD,YAAa,CACX,MAAO,CACL,UAAW,sCACZ,EACD,KAAM,CACJ,UAAW,qCACZ,CACF,EACD,YAAa,CACX,KAAM,CACJ,EAAG,CACJ,EACD,GAAI,CACF,GAAI,EACJ,GAAI,CACL,EACD,GAAI,CACF,GAAI,EACJ,GAAI,CACL,EACD,GAAI,CACF,EAAG,EACJ,CACF,EACD,SAAU,CACR,KAAM,CACJ,KAAM,EACN,KAAM,YACN,OAAQ,CAAE,KAAM,MAAQ,CACzB,CACF,CACF,EACD,iBAAkB,CAChB,CACE,SAAU,GACV,IAAK,GACL,IAAK,CACH,QAAS,mBACT,MAAO,iBACP,OAAQ,CACN,OAAQ,iBACT,CACF,CACF,CACF,EACD,gBAAiB,CACf,IAAK,GACL,OAAQ,GACR,QAAS,KACT,YAAa,GACb,YAAa,KACb,SAAU,EACX,CACF,CAAA"}

package/dist/panda.buildinfo.json CHANGED Viewed

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