@magiclabs/ui-components 1.26.0 → 1.26.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.
- package/dist/cjs/components/containers/drawer.js +1 -1
- package/dist/cjs/components/containers/drawer.js.map +1 -1
- package/dist/cjs/components/list-items/token-list-item.js +1 -1
- package/dist/cjs/components/list-items/token-list-item.js.map +1 -1
- package/dist/es/components/containers/drawer.js +1 -1
- package/dist/es/components/containers/drawer.js.map +1 -1
- package/dist/es/components/list-items/token-list-item.js +1 -1
- package/dist/es/components/list-items/token-list-item.js.map +1 -1
- package/dist/panda.buildinfo.json +1 -1
- package/dist/types/components/containers/drawer.d.ts +2 -1
- package/dist/types/components/containers/drawer.d.ts.map +1 -1
- package/dist/types/components/layouts/page.d.ts +1 -1
- package/dist/types/components/list-items/token-list-item.d.ts +1 -0
- package/dist/types/components/list-items/token-list-item.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime");require("@styled/tokens");var h=require("../icons/ico-caret-down.js"),l=require("../primitives/button.js");require("../primitives/checkbox.js"),require("../primitives/dropdown-selector.js"),require("../primitives/popover.js"),require("../primitives/radio.js"),require("../primitives/segmented-control.js"),require("../primitives/switch.js");var q=require("../primitives/text.js"),
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime");require("@styled/tokens");var h=require("../icons/ico-caret-down.js"),l=require("../primitives/button.js");require("../primitives/checkbox.js"),require("../primitives/dropdown-selector.js"),require("../primitives/popover.js"),require("../primitives/radio.js"),require("../primitives/segmented-control.js"),require("../primitives/switch.js");var q=require("../primitives/text.js"),o=require("@styled/jsx"),t=require("react");const j=({isOpen:r=!1,title:c,onToggle:s,children:d,showCloseButton:x=!0})=>{const[f,a]=t.useState(r),[p,u]=t.useState(r),i=t.useRef(null);t.useEffect(()=>{let n;return r?(a(!0),n=setTimeout(()=>u(!0),10)):u(!1),()=>clearTimeout(n)},[r]),t.useEffect(()=>{const n=g=>{i.current&&!i.current.contains(g.target)&&s(!1)};return document.addEventListener("mousedown",n),()=>{document.removeEventListener("mousedown",n)}},[s]);const b=()=>{r||a(!1)},m=t.useCallback(()=>{s(!1)},[s]);return e.jsxs(e.Fragment,{children:[e.jsx(o.Box,{position:"absolute",display:r?"block":"none",h:"full",bottom:0,left:0,right:0,bg:"text.primary/20",_dark:{bg:"rgba(0, 0, 0, .7)"},backdropFilter:"blur(3px)"}),f&&e.jsxs(o.Box,{ref:i,position:"absolute",transform:p?"translateY(0)":"translateY(100%)",transition:"transform 0.3s",bottom:0,left:0,right:0,bg:"surface.primary",_dark:{bg:"surface.secondary"},roundedTop:"3xl",boxShadow:"0px -12px 56px 0px rgba(119, 118, 122, 0.15)",onTransitionEnd:b,children:[e.jsxs(o.HStack,{justifyContent:"space-between",px:6,py:4,children:[e.jsx(q.default,{fontWeight:"medium",children:c}),x&&e.jsx(l.default,{size:"sm",variant:"neutral",onPress:m,children:e.jsx(l.default.LeadingIcon,{children:e.jsx(h.default,{})})})]}),e.jsx(o.Box,{px:6,pb:6,children:d})]})]})};exports.Drawer=j;
|
|
2
2
|
//# sourceMappingURL=drawer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer.js","sources":["../../../../src/components/containers/drawer.tsx"],"sourcesContent":["import { IcoCaretDown } from '@components/icons';\nimport { Button, Text } from '@components/primitives';\nimport { Box, HStack } from '@styled/jsx';\nimport { PropsWithChildren, useCallback, useEffect, useRef, useState } from 'react';\n\nexport interface DrawerProps extends PropsWithChildren {\n onToggle: (isOpen: boolean) => void;\n isOpen: boolean;\n title?: string;\n}\n\nexport const Drawer = ({ isOpen = false, title, onToggle, children }: DrawerProps) => {\n const [shouldRender, setShouldRender] = useState(isOpen);\n const [isVisible, setIsVisible] = useState(isOpen);\n const drawerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n let timeoutId: NodeJS.Timeout;\n\n if (isOpen) {\n setShouldRender(true);\n timeoutId = setTimeout(() => setIsVisible(true), 10);\n } else {\n setIsVisible(false);\n }\n\n return () => clearTimeout(timeoutId);\n }, [isOpen]);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (drawerRef.current && !drawerRef.current.contains(event.target as Node)) {\n onToggle(false);\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n return () => {\n document.removeEventListener('mousedown', handleClickOutside);\n };\n }, [onToggle]);\n\n const handleTransitionEnd = () => {\n if (!isOpen) {\n setShouldRender(false);\n }\n };\n const handleClose = useCallback(() => {\n onToggle(false);\n }, [onToggle]);\n\n return (\n <>\n <Box\n position=\"absolute\"\n display={isOpen ? 'block' : 'none'}\n h=\"full\"\n bottom={0}\n left={0}\n right={0}\n bg=\"text.primary/20\"\n backdropFilter=\"blur(3px)\"\n />\n {shouldRender && (\n <Box\n ref={drawerRef}\n position=\"absolute\"\n transform={isVisible ? 'translateY(0)' : 'translateY(100%)'}\n transition=\"transform 0.3s\"\n bottom={0}\n left={0}\n right={0}\n bg=\"surface.primary\"\n
|
|
1
|
+
{"version":3,"file":"drawer.js","sources":["../../../../src/components/containers/drawer.tsx"],"sourcesContent":["import { IcoCaretDown } from '@components/icons';\nimport { Button, Text } from '@components/primitives';\nimport { Box, HStack } from '@styled/jsx';\nimport { PropsWithChildren, useCallback, useEffect, useRef, useState } from 'react';\n\nexport interface DrawerProps extends PropsWithChildren {\n onToggle: (isOpen: boolean) => void;\n isOpen: boolean;\n title?: string;\n showCloseButton?: boolean;\n}\n\nexport const Drawer = ({ isOpen = false, title, onToggle, children, showCloseButton = true }: DrawerProps) => {\n const [shouldRender, setShouldRender] = useState(isOpen);\n const [isVisible, setIsVisible] = useState(isOpen);\n const drawerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n let timeoutId: NodeJS.Timeout;\n\n if (isOpen) {\n setShouldRender(true);\n timeoutId = setTimeout(() => setIsVisible(true), 10);\n } else {\n setIsVisible(false);\n }\n\n return () => clearTimeout(timeoutId);\n }, [isOpen]);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (drawerRef.current && !drawerRef.current.contains(event.target as Node)) {\n onToggle(false);\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n return () => {\n document.removeEventListener('mousedown', handleClickOutside);\n };\n }, [onToggle]);\n\n const handleTransitionEnd = () => {\n if (!isOpen) {\n setShouldRender(false);\n }\n };\n const handleClose = useCallback(() => {\n onToggle(false);\n }, [onToggle]);\n\n return (\n <>\n <Box\n position=\"absolute\"\n display={isOpen ? 'block' : 'none'}\n h=\"full\"\n bottom={0}\n left={0}\n right={0}\n bg=\"text.primary/20\"\n _dark={{ bg: 'rgba(0, 0, 0, .7)' }}\n backdropFilter=\"blur(3px)\"\n />\n {shouldRender && (\n <Box\n ref={drawerRef}\n position=\"absolute\"\n transform={isVisible ? 'translateY(0)' : 'translateY(100%)'}\n transition=\"transform 0.3s\"\n bottom={0}\n left={0}\n right={0}\n bg=\"surface.primary\"\n _dark={{ bg: 'surface.secondary' }}\n roundedTop=\"3xl\"\n boxShadow=\"0px -12px 56px 0px rgba(119, 118, 122, 0.15)\"\n onTransitionEnd={handleTransitionEnd}\n >\n <HStack justifyContent=\"space-between\" px={6} py={4}>\n <Text fontWeight=\"medium\">{title}</Text>\n {showCloseButton && (\n <Button size=\"sm\" variant=\"neutral\" onPress={handleClose}>\n <Button.LeadingIcon>\n <IcoCaretDown />\n </Button.LeadingIcon>\n </Button>\n )}\n </HStack>\n <Box px={6} pb={6}>\n {children}\n </Box>\n </Box>\n )}\n </>\n );\n};\n"],"names":["Drawer","isOpen","title","onToggle","children","showCloseButton","shouldRender","setShouldRender","useState","isVisible","setIsVisible","drawerRef","useRef","useEffect","timeoutId","handleClickOutside","event","handleTransitionEnd","handleClose","useCallback","_jsxs","_jsx","Box","HStack","Text","Button","IcoCaretDown"],"mappings":"wdAYa,MAAAA,EAAS,CAAC,CAAE,OAAAC,EAAS,GAAO,MAAAC,EAAO,SAAAC,EAAU,SAAAC,EAAU,gBAAAC,EAAkB,EAAmB,IAAI,CAC3G,KAAM,CAACC,EAAcC,CAAe,EAAIC,EAAAA,SAASP,CAAM,EACjD,CAACQ,EAAWC,CAAY,EAAIF,EAAAA,SAASP,CAAM,EAC3CU,EAAYC,EAAAA,OAAuB,IAAI,EAE7CC,EAAAA,UAAU,IAAK,CACb,IAAIC,EAEJ,OAAIb,GACFM,EAAgB,EAAI,EACpBO,EAAY,WAAW,IAAMJ,EAAa,EAAI,EAAG,EAAE,GAEnDA,EAAa,EAAK,EAGb,IAAM,aAAaI,CAAS,CACrC,EAAG,CAACb,CAAM,CAAC,EAEXY,EAAAA,UAAU,IAAK,CACb,MAAME,EAAsBC,GAAqB,CAC3CL,EAAU,SAAW,CAACA,EAAU,QAAQ,SAASK,EAAM,MAAc,GACvEb,EAAS,EAAK,CAElB,EAEA,OAAS,SAAA,iBAAiB,YAAaY,CAAkB,EAClD,IAAK,CACV,SAAS,oBAAoB,YAAaA,CAAkB,CAC9D,CACF,EAAG,CAACZ,CAAQ,CAAC,EAEb,MAAMc,EAAsB,IAAK,CAC1BhB,GACHM,EAAgB,EAAK,CAEzB,EACMW,EAAcC,cAAY,IAAK,CACnChB,EAAS,EAAK,CAChB,EAAG,CAACA,CAAQ,CAAC,EAEb,OACEiB,EAAAA,2BACEC,EAAAA,IAACC,EAAAA,KACC,SAAS,WACT,QAASrB,EAAS,QAAU,OAC5B,EAAE,OACF,OAAQ,EACR,KAAM,EACN,MAAO,EACP,GAAG,kBACH,MAAO,CAAE,GAAI,qBACb,eAAe,WAAW,CAAA,EAE3BK,GACCc,EAACE,KAAAA,EAAAA,KACC,IAAKX,EACL,SAAS,WACT,UAAWF,EAAY,gBAAkB,mBACzC,WAAW,iBACX,OAAQ,EACR,KAAM,EACN,MAAO,EACP,GAAG,kBACH,MAAO,CAAE,GAAI,mBAAqB,EAClC,WAAW,MACX,UAAU,+CACV,gBAAiBQ,EAAmB,SAAA,CAEpCG,EAAAA,KAACG,EAAM,OAAA,CAAC,eAAe,gBAAgB,GAAI,EAAG,GAAI,EAAC,SAAA,CACjDF,EAAAA,IAACG,UAAI,CAAC,WAAW,SAAU,SAAAtB,CAAa,CAAA,EACvCG,GACCgB,EAAAA,IAACI,EAAAA,QAAM,CAAC,KAAK,KAAK,QAAQ,UAAU,QAASP,EAAW,SACtDG,EAACI,IAAAA,EAAAA,QAAO,YAAW,CAAA,SACjBJ,EAACK,IAAAA,EAAAA,WACkB,CAAA,CAAA,CAAA,CAExB,CACM,CAAA,EACTL,EAAAA,IAACC,EAAG,IAAA,CAAC,GAAI,EAAG,GAAI,EACb,SAAAlB,GACG,CACF,CAAA,CACP,CACA,CAAA,CAEP"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),p=require("../logos/icon-generic-token.js");require("@styled/tokens"),require("../primitives/button.js"),require("../primitives/checkbox.js"),require("../primitives/dropdown-selector.js"),require("../primitives/popover.js"),require("../primitives/radio.js"),require("../primitives/segmented-control.js"),require("../primitives/switch.js");var c=require("../primitives/text.js"),S=require("@styled/css"),s=require("@styled/jsx"),g=require("create-slots"),l=require("react"),u=require("react-aria");const k=g.createSlot(({children:r,...t})=>e.jsx(s.Center,{children:l.Children.map(r,n=>l.cloneElement(n,t))})),f=({name:r,fiatBalanceWithSymbol:t,tokenBalanceWithSymbol:n,tokenIcon:i,logoUrl:a,tokenBalanceFirst:o})=>e.jsxs(s.HStack,{w:"full",justify:"space-between",children:[e.jsxs(s.HStack,{gap:4,children:[i?{...i,props:{...i.props,width:40,height:40}}:a?e.jsx("img",{width:40,height:40,src:a,alt:`${r} logo`}):e.jsx(p.default,{width:40,height:40}),e.jsx(c.default,{fontWeight:"medium",styles:{textTransform:"capitalize"},children:r})]}),e.jsxs(s.VStack,{gap:0,alignItems:"flex-end",children:[e.jsx(c.default,{size:"sm",styles:{lineHeight:"1.5rem"},children:o?n:t}),e.jsx(c.default,{size:"sm",fontColor:"text.secondary",styles:{lineHeight:"1.5rem"},children:o?t:n})]})]}),B=r=>{const{name:t,fiatBalanceWithSymbol:n,tokenBalanceWithSymbol:i,logoUrl:a,onPress:o,tokenBalanceFirst:h}=r,d=l.useRef(null),b=l.useCallback(()=>{o?.()},[o]),{buttonProps:x}=u.useButton({...r,onPress:b},d),{isFocusVisible:y,focusProps:q}=u.useFocusRing();return g.createHost(r.children,j=>{const m=j.get(k);return o?e.jsx("button",{ref:d,...u.mergeProps(x,q),className:S.css({w:"full",px:4,py:2,minH:16,bg:"neutral.quaternary",_dark:{bg:"surface.tertiary"},transition:"background-color 0.1s",_hover:{bg:"neutral.secondary"},rounded:"lg",outlineColor:"brand.base",outlineStyle:y?"solid":"none",outlineWidth:"thick",outlineOffset:1,cursor:"pointer"}),children:e.jsx(f,{name:t,fiatBalanceWithSymbol:n,tokenBalanceWithSymbol:i,tokenIcon:m,logoUrl:a,tokenBalanceFirst:h})}):e.jsx(f,{name:t,fiatBalanceWithSymbol:n,tokenBalanceWithSymbol:i,tokenIcon:m,logoUrl:a,tokenBalanceFirst:h})})},v=Object.assign(B,{TokenIcon:k});exports.TokenListItem=v;
|
|
2
2
|
//# sourceMappingURL=token-list-item.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"token-list-item.js","sources":["../../../../src/components/list-items/token-list-item.tsx"],"sourcesContent":["import { IconGenericToken } from '@components/logos';\nimport { Text } from '@components/primitives';\nimport { css } from '@styled/css';\nimport { Center, HStack, VStack } from '@styled/jsx';\nimport { createHost, createSlot } from 'create-slots';\nimport { Children, cloneElement, useCallback, useRef } from 'react';\nimport { AriaButtonProps, mergeProps, useButton, useFocusRing } from 'react-aria';\n\nexport interface TokenListItemProps extends AriaButtonProps {\n name: string;\n fiatBalanceWithSymbol: string;\n tokenBalanceWithSymbol: string;\n logoUrl?: string;\n onPress?: () => void;\n}\n\nconst TokenIcon = createSlot(({ children, ...props }) => {\n return (\n <Center>\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Center>\n );\n});\n\ninterface ListContentProps extends Omit<TokenListItemProps, 'onPress'> {\n tokenIcon?: React.ReactElement;\n}\n\nconst ListContent = ({
|
|
1
|
+
{"version":3,"file":"token-list-item.js","sources":["../../../../src/components/list-items/token-list-item.tsx"],"sourcesContent":["import { IconGenericToken } from '@components/logos';\nimport { Text } from '@components/primitives';\nimport { css } from '@styled/css';\nimport { Center, HStack, VStack } from '@styled/jsx';\nimport { createHost, createSlot } from 'create-slots';\nimport { Children, cloneElement, useCallback, useRef } from 'react';\nimport { AriaButtonProps, mergeProps, useButton, useFocusRing } from 'react-aria';\n\nexport interface TokenListItemProps extends AriaButtonProps {\n name: string;\n fiatBalanceWithSymbol: string;\n tokenBalanceWithSymbol: string;\n logoUrl?: string;\n onPress?: () => void;\n tokenBalanceFirst?: boolean;\n}\n\nconst TokenIcon = createSlot(({ children, ...props }) => {\n return (\n <Center>\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Center>\n );\n});\n\ninterface ListContentProps extends Omit<TokenListItemProps, 'onPress'> {\n tokenIcon?: React.ReactElement;\n}\n\nconst ListContent = ({\n name,\n fiatBalanceWithSymbol,\n tokenBalanceWithSymbol,\n tokenIcon,\n logoUrl,\n tokenBalanceFirst,\n}: ListContentProps) => {\n return (\n <HStack w=\"full\" justify=\"space-between\">\n <HStack gap={4}>\n {tokenIcon ? (\n {\n ...tokenIcon,\n props: {\n ...tokenIcon.props,\n width: 40,\n height: 40,\n },\n }\n ) : logoUrl ? (\n <img width={40} height={40} src={logoUrl} alt={`${name} logo`} />\n ) : (\n <IconGenericToken width={40} height={40} />\n )}\n <Text fontWeight=\"medium\" styles={{ textTransform: 'capitalize' }}>\n {name}\n </Text>\n </HStack>\n <VStack gap={0} alignItems=\"flex-end\">\n <Text size=\"sm\" styles={{ lineHeight: '1.5rem' }}>\n {tokenBalanceFirst ? tokenBalanceWithSymbol : fiatBalanceWithSymbol}\n </Text>\n <Text size=\"sm\" fontColor=\"text.secondary\" styles={{ lineHeight: '1.5rem' }}>\n {tokenBalanceFirst ? fiatBalanceWithSymbol : tokenBalanceWithSymbol}\n </Text>\n </VStack>\n </HStack>\n );\n};\n\nconst TokenListItemBase = (props: TokenListItemProps) => {\n const { name, fiatBalanceWithSymbol, tokenBalanceWithSymbol, logoUrl, onPress, tokenBalanceFirst } = props;\n\n const ref = useRef(null);\n\n const handlePress = useCallback(() => {\n onPress?.();\n }, [onPress]);\n\n const { buttonProps } = useButton({ ...props, onPress: handlePress }, ref);\n const { isFocusVisible, focusProps } = useFocusRing();\n\n return createHost(props.children, slots => {\n const tokenIcon = slots.get(TokenIcon);\n\n if (onPress)\n return (\n <button\n ref={ref}\n {...mergeProps(buttonProps, focusProps)}\n className={css({\n w: 'full',\n px: 4,\n py: 2,\n minH: 16,\n bg: 'neutral.quaternary',\n _dark: { bg: 'surface.tertiary' },\n transition: 'background-color 0.1s',\n _hover: { bg: 'neutral.secondary' },\n rounded: 'lg',\n outlineColor: 'brand.base',\n outlineStyle: isFocusVisible ? 'solid' : 'none',\n outlineWidth: 'thick',\n outlineOffset: 1,\n cursor: 'pointer',\n })}\n >\n <ListContent\n name={name}\n fiatBalanceWithSymbol={fiatBalanceWithSymbol}\n tokenBalanceWithSymbol={tokenBalanceWithSymbol}\n tokenIcon={tokenIcon}\n logoUrl={logoUrl}\n tokenBalanceFirst={tokenBalanceFirst}\n />\n </button>\n );\n\n return (\n <ListContent\n name={name}\n fiatBalanceWithSymbol={fiatBalanceWithSymbol}\n tokenBalanceWithSymbol={tokenBalanceWithSymbol}\n tokenIcon={tokenIcon}\n logoUrl={logoUrl}\n tokenBalanceFirst={tokenBalanceFirst}\n />\n );\n });\n};\n\nexport const TokenListItem = Object.assign(TokenListItemBase, { TokenIcon });\n"],"names":["TokenIcon","createSlot","children","props","_jsx","Center","Children","child","cloneElement","ListContent","name","fiatBalanceWithSymbol","tokenBalanceWithSymbol","tokenIcon","logoUrl","tokenBalanceFirst","_jsxs","HStack","IconGenericToken","Text","VStack","TokenListItemBase","onPress","ref","useRef","handlePress","useCallback","buttonProps","useButton","isFocusVisible","focusProps","useFocusRing","createHost","slots","mergeProps","css","TokenListItem"],"mappings":"iiBAiBA,MAAMA,EAAYC,EAAAA,WAAW,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAO,IAEhDC,EAAAA,IAACC,EAAAA,OAAM,CAAA,SACJC,WAAS,IAAIJ,EAAUK,GACfC,EAAAA,aAAaD,EAAOJ,CAAK,CACjC,CACM,CAAA,CAEZ,EAMKM,EAAc,CAAC,CACnB,KAAAC,EACA,sBAAAC,EACA,uBAAAC,EACA,UAAAC,EACA,QAAAC,EACA,kBAAAC,CAAiB,IAGfC,EAAAA,KAACC,EAAAA,OAAM,CAAC,EAAE,OAAO,QAAQ,0BACvBD,OAACC,EAAO,OAAA,CAAA,IAAK,YACVJ,EACC,CACE,GAAGA,EACH,MAAO,CACL,GAAGA,EAAU,MACb,MAAO,GACP,OAAQ,EACT,CACF,EACCC,EACFV,EAAAA,IAAK,MAAA,CAAA,MAAO,GAAI,OAAQ,GAAI,IAAKU,EAAS,IAAK,GAAGJ,CAAI,OAAO,CAAA,EAE7DN,EAAAA,IAACc,UAAiB,CAAA,MAAO,GAAI,OAAQ,EAAM,CAAA,EAE7Cd,EAAAA,IAACe,UAAK,CAAA,WAAW,SAAS,OAAQ,CAAE,cAAe,YAAY,EAC5D,SAAAT,CACI,CAAA,CAAA,CAAA,CAAA,EAETM,EAACI,KAAAA,EAAAA,OAAO,CAAA,IAAK,EAAG,WAAW,WACzB,SAAA,CAAAhB,EAACe,IAAAA,EAAAA,QAAI,CAAC,KAAK,KAAK,OAAQ,CAAE,WAAY,QAAQ,EAC3C,SAAAJ,EAAoBH,EAAyBD,CAAqB,CAAA,EAErEP,EAAAA,IAACe,EAAAA,QAAI,CAAC,KAAK,KAAK,UAAU,iBAAiB,OAAQ,CAAE,WAAY,QAAQ,EACtE,SAAAJ,EAAoBJ,EAAwBC,CAAsB,CAAA,CAC9D,CACA,CAAA,CAAA,CAAA,CAAA,EAKTS,EAAqBlB,GAA6B,CACtD,KAAM,CAAE,KAAAO,EAAM,sBAAAC,EAAuB,uBAAAC,EAAwB,QAAAE,EAAS,QAAAQ,EAAS,kBAAAP,CAAmB,EAAGZ,EAE/FoB,EAAMC,EAAAA,OAAO,IAAI,EAEjBC,EAAcC,EAAAA,YAAY,IAAK,CACnCJ,IACF,CAAA,EAAG,CAACA,CAAO,CAAC,EAEN,CAAE,YAAAK,CAAW,EAAKC,EAAAA,UAAU,CAAE,GAAGzB,EAAO,QAASsB,GAAeF,CAAG,EACnE,CAAE,eAAAM,EAAgB,WAAAC,GAAeC,EAAAA,eAEvC,OAAOC,EAAAA,WAAW7B,EAAM,SAAU8B,GAAQ,CACxC,MAAMpB,EAAYoB,EAAM,IAAIjC,CAAS,EAErC,OAAIsB,EAEAlB,EAAAA,IACE,SAAA,CAAA,IAAKmB,KACDW,EAAAA,WAAWP,EAAaG,CAAU,EACtC,UAAWK,EAAI,IAAA,CACb,EAAG,OACH,GAAI,EACJ,GAAI,EACJ,KAAM,GACN,GAAI,qBACJ,MAAO,CAAE,GAAI,kBAAoB,EACjC,WAAY,wBACZ,OAAQ,CAAE,GAAI,mBAAqB,EACnC,QAAS,KACT,aAAc,aACd,aAAcN,EAAiB,QAAU,OACzC,aAAc,QACd,cAAe,EACf,OAAQ,SACT,CAAA,EAED,SAAAzB,MAACK,EAAW,CACV,KAAMC,EACN,sBAAuBC,EACvB,uBAAwBC,EACxB,UAAWC,EACX,QAASC,EACT,kBAAmBC,CACnB,CAAA,CAAA,CAAA,EAKNX,EAAAA,IAACK,EAAW,CACV,KAAMC,EACN,sBAAuBC,EACvB,uBAAwBC,EACxB,UAAWC,EACX,QAASC,EACT,kBAAmBC,CAAiB,CAAA,CAG1C,CAAC,CACH,EAEaqB,EAAgB,OAAO,OAAOf,EAAmB,CAAE,UAAArB,CAAS,CAAE"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as i,Fragment as w,jsx as
|
|
1
|
+
import{jsxs as i,Fragment as w,jsx as t}from"react/jsx-runtime";import"@styled/tokens";import y from"../icons/ico-caret-down.js";import p from"../primitives/button.js";import"../primitives/checkbox.js";import"../primitives/dropdown-selector.js";import"../primitives/popover.js";import"../primitives/radio.js";import"../primitives/segmented-control.js";import"../primitives/switch.js";import T from"../primitives/text.js";import{Box as s,HStack as v}from"@styled/jsx";import{useState as l,useRef as E,useEffect as c,useCallback as j}from"react";const B=({isOpen:r=!1,title:u,onToggle:e,children:d,showCloseButton:f=!0})=>{const[b,a]=l(r),[g,m]=l(r),n=E(null);c(()=>{let o;return r?(a(!0),o=setTimeout(()=>m(!0),10)):m(!1),()=>clearTimeout(o)},[r]),c(()=>{const o=k=>{n.current&&!n.current.contains(k.target)&&e(!1)};return document.addEventListener("mousedown",o),()=>{document.removeEventListener("mousedown",o)}},[e]);const h=()=>{r||a(!1)},x=j(()=>{e(!1)},[e]);return i(w,{children:[t(s,{position:"absolute",display:r?"block":"none",h:"full",bottom:0,left:0,right:0,bg:"text.primary/20",_dark:{bg:"rgba(0, 0, 0, .7)"},backdropFilter:"blur(3px)"}),b&&i(s,{ref:n,position:"absolute",transform:g?"translateY(0)":"translateY(100%)",transition:"transform 0.3s",bottom:0,left:0,right:0,bg:"surface.primary",_dark:{bg:"surface.secondary"},roundedTop:"3xl",boxShadow:"0px -12px 56px 0px rgba(119, 118, 122, 0.15)",onTransitionEnd:h,children:[i(v,{justifyContent:"space-between",px:6,py:4,children:[t(T,{fontWeight:"medium",children:u}),f&&t(p,{size:"sm",variant:"neutral",onPress:x,children:t(p.LeadingIcon,{children:t(y,{})})})]}),t(s,{px:6,pb:6,children:d})]})]})};export{B as Drawer};
|
|
2
2
|
//# sourceMappingURL=drawer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer.js","sources":["../../../../src/components/containers/drawer.tsx"],"sourcesContent":["import { IcoCaretDown } from '@components/icons';\nimport { Button, Text } from '@components/primitives';\nimport { Box, HStack } from '@styled/jsx';\nimport { PropsWithChildren, useCallback, useEffect, useRef, useState } from 'react';\n\nexport interface DrawerProps extends PropsWithChildren {\n onToggle: (isOpen: boolean) => void;\n isOpen: boolean;\n title?: string;\n}\n\nexport const Drawer = ({ isOpen = false, title, onToggle, children }: DrawerProps) => {\n const [shouldRender, setShouldRender] = useState(isOpen);\n const [isVisible, setIsVisible] = useState(isOpen);\n const drawerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n let timeoutId: NodeJS.Timeout;\n\n if (isOpen) {\n setShouldRender(true);\n timeoutId = setTimeout(() => setIsVisible(true), 10);\n } else {\n setIsVisible(false);\n }\n\n return () => clearTimeout(timeoutId);\n }, [isOpen]);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (drawerRef.current && !drawerRef.current.contains(event.target as Node)) {\n onToggle(false);\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n return () => {\n document.removeEventListener('mousedown', handleClickOutside);\n };\n }, [onToggle]);\n\n const handleTransitionEnd = () => {\n if (!isOpen) {\n setShouldRender(false);\n }\n };\n const handleClose = useCallback(() => {\n onToggle(false);\n }, [onToggle]);\n\n return (\n <>\n <Box\n position=\"absolute\"\n display={isOpen ? 'block' : 'none'}\n h=\"full\"\n bottom={0}\n left={0}\n right={0}\n bg=\"text.primary/20\"\n backdropFilter=\"blur(3px)\"\n />\n {shouldRender && (\n <Box\n ref={drawerRef}\n position=\"absolute\"\n transform={isVisible ? 'translateY(0)' : 'translateY(100%)'}\n transition=\"transform 0.3s\"\n bottom={0}\n left={0}\n right={0}\n bg=\"surface.primary\"\n
|
|
1
|
+
{"version":3,"file":"drawer.js","sources":["../../../../src/components/containers/drawer.tsx"],"sourcesContent":["import { IcoCaretDown } from '@components/icons';\nimport { Button, Text } from '@components/primitives';\nimport { Box, HStack } from '@styled/jsx';\nimport { PropsWithChildren, useCallback, useEffect, useRef, useState } from 'react';\n\nexport interface DrawerProps extends PropsWithChildren {\n onToggle: (isOpen: boolean) => void;\n isOpen: boolean;\n title?: string;\n showCloseButton?: boolean;\n}\n\nexport const Drawer = ({ isOpen = false, title, onToggle, children, showCloseButton = true }: DrawerProps) => {\n const [shouldRender, setShouldRender] = useState(isOpen);\n const [isVisible, setIsVisible] = useState(isOpen);\n const drawerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n let timeoutId: NodeJS.Timeout;\n\n if (isOpen) {\n setShouldRender(true);\n timeoutId = setTimeout(() => setIsVisible(true), 10);\n } else {\n setIsVisible(false);\n }\n\n return () => clearTimeout(timeoutId);\n }, [isOpen]);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (drawerRef.current && !drawerRef.current.contains(event.target as Node)) {\n onToggle(false);\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n return () => {\n document.removeEventListener('mousedown', handleClickOutside);\n };\n }, [onToggle]);\n\n const handleTransitionEnd = () => {\n if (!isOpen) {\n setShouldRender(false);\n }\n };\n const handleClose = useCallback(() => {\n onToggle(false);\n }, [onToggle]);\n\n return (\n <>\n <Box\n position=\"absolute\"\n display={isOpen ? 'block' : 'none'}\n h=\"full\"\n bottom={0}\n left={0}\n right={0}\n bg=\"text.primary/20\"\n _dark={{ bg: 'rgba(0, 0, 0, .7)' }}\n backdropFilter=\"blur(3px)\"\n />\n {shouldRender && (\n <Box\n ref={drawerRef}\n position=\"absolute\"\n transform={isVisible ? 'translateY(0)' : 'translateY(100%)'}\n transition=\"transform 0.3s\"\n bottom={0}\n left={0}\n right={0}\n bg=\"surface.primary\"\n _dark={{ bg: 'surface.secondary' }}\n roundedTop=\"3xl\"\n boxShadow=\"0px -12px 56px 0px rgba(119, 118, 122, 0.15)\"\n onTransitionEnd={handleTransitionEnd}\n >\n <HStack justifyContent=\"space-between\" px={6} py={4}>\n <Text fontWeight=\"medium\">{title}</Text>\n {showCloseButton && (\n <Button size=\"sm\" variant=\"neutral\" onPress={handleClose}>\n <Button.LeadingIcon>\n <IcoCaretDown />\n </Button.LeadingIcon>\n </Button>\n )}\n </HStack>\n <Box px={6} pb={6}>\n {children}\n </Box>\n </Box>\n )}\n </>\n );\n};\n"],"names":["Drawer","isOpen","title","onToggle","children","showCloseButton","shouldRender","setShouldRender","useState","isVisible","setIsVisible","drawerRef","useRef","useEffect","timeoutId","handleClickOutside","event","handleTransitionEnd","handleClose","useCallback","_jsxs","_jsx","Box","HStack","Text","Button","IcoCaretDown"],"mappings":"giBAYa,MAAAA,EAAS,CAAC,CAAE,OAAAC,EAAS,GAAO,MAAAC,EAAO,SAAAC,EAAU,SAAAC,EAAU,gBAAAC,EAAkB,EAAmB,IAAI,CAC3G,KAAM,CAACC,EAAcC,CAAe,EAAIC,EAASP,CAAM,EACjD,CAACQ,EAAWC,CAAY,EAAIF,EAASP,CAAM,EAC3CU,EAAYC,EAAuB,IAAI,EAE7CC,EAAU,IAAK,CACb,IAAIC,EAEJ,OAAIb,GACFM,EAAgB,EAAI,EACpBO,EAAY,WAAW,IAAMJ,EAAa,EAAI,EAAG,EAAE,GAEnDA,EAAa,EAAK,EAGb,IAAM,aAAaI,CAAS,CACrC,EAAG,CAACb,CAAM,CAAC,EAEXY,EAAU,IAAK,CACb,MAAME,EAAsBC,GAAqB,CAC3CL,EAAU,SAAW,CAACA,EAAU,QAAQ,SAASK,EAAM,MAAc,GACvEb,EAAS,EAAK,CAElB,EAEA,OAAS,SAAA,iBAAiB,YAAaY,CAAkB,EAClD,IAAK,CACV,SAAS,oBAAoB,YAAaA,CAAkB,CAC9D,CACF,EAAG,CAACZ,CAAQ,CAAC,EAEb,MAAMc,EAAsB,IAAK,CAC1BhB,GACHM,EAAgB,EAAK,CAEzB,EACMW,EAAcC,EAAY,IAAK,CACnChB,EAAS,EAAK,CAChB,EAAG,CAACA,CAAQ,CAAC,EAEb,OACEiB,eACEC,EAACC,GACC,SAAS,WACT,QAASrB,EAAS,QAAU,OAC5B,EAAE,OACF,OAAQ,EACR,KAAM,EACN,MAAO,EACP,GAAG,kBACH,MAAO,CAAE,GAAI,qBACb,eAAe,WAAW,CAAA,EAE3BK,GACCc,EAACE,GACC,IAAKX,EACL,SAAS,WACT,UAAWF,EAAY,gBAAkB,mBACzC,WAAW,iBACX,OAAQ,EACR,KAAM,EACN,MAAO,EACP,GAAG,kBACH,MAAO,CAAE,GAAI,mBAAqB,EAClC,WAAW,MACX,UAAU,+CACV,gBAAiBQ,EAAmB,SAAA,CAEpCG,EAACG,EAAM,CAAC,eAAe,gBAAgB,GAAI,EAAG,GAAI,EAAC,SAAA,CACjDF,EAACG,EAAI,CAAC,WAAW,SAAU,SAAAtB,CAAa,CAAA,EACvCG,GACCgB,EAACI,EAAM,CAAC,KAAK,KAAK,QAAQ,UAAU,QAASP,EAAW,SACtDG,EAACI,EAAO,YAAW,CAAA,SACjBJ,EAACK,KACkB,CAAA,CAAA,CAAA,CAExB,CACM,CAAA,EACTL,EAACC,EAAG,CAAC,GAAI,EAAG,GAAI,EACb,SAAAlB,GACG,CACF,CAAA,CACP,CACA,CAAA,CAEP"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,jsxs as
|
|
1
|
+
import{jsx as e,jsxs as a}from"react/jsx-runtime";import B from"../logos/icon-generic-token.js";import"@styled/tokens";import"../primitives/button.js";import"../primitives/checkbox.js";import"../primitives/dropdown-selector.js";import"../primitives/popover.js";import"../primitives/radio.js";import"../primitives/segmented-control.js";import"../primitives/switch.js";import s from"../primitives/text.js";import{css as S}from"@styled/css";import{Center as W,HStack as p,VStack as x}from"@styled/jsx";import{createSlot as w,createHost as F}from"create-slots";import{Children as I,cloneElement as C,useRef as H,useCallback as P}from"react";import{useButton as j,useFocusRing as U,mergeProps as z}from"react-aria";const u=w(({children:o,...t})=>e(W,{children:I.map(o,n=>C(n,t))})),d=({name:o,fiatBalanceWithSymbol:t,tokenBalanceWithSymbol:n,tokenIcon:r,logoUrl:l,tokenBalanceFirst:i})=>a(p,{w:"full",justify:"space-between",children:[a(p,{gap:4,children:[r?{...r,props:{...r.props,width:40,height:40}}:l?e("img",{width:40,height:40,src:l,alt:`${o} logo`}):e(B,{width:40,height:40}),e(s,{fontWeight:"medium",styles:{textTransform:"capitalize"},children:o})]}),a(x,{gap:0,alignItems:"flex-end",children:[e(s,{size:"sm",styles:{lineHeight:"1.5rem"},children:i?n:t}),e(s,{size:"sm",fontColor:"text.secondary",styles:{lineHeight:"1.5rem"},children:i?t:n})]})]}),T=o=>{const{name:t,fiatBalanceWithSymbol:n,tokenBalanceWithSymbol:r,logoUrl:l,onPress:i,tokenBalanceFirst:c}=o,m=H(null),f=P(()=>{i?.()},[i]),{buttonProps:g}=j({...o,onPress:f},m),{isFocusVisible:b,focusProps:k}=U();return F(o.children,y=>{const h=y.get(u);return i?e("button",{ref:m,...z(g,k),className:S({w:"full",px:4,py:2,minH:16,bg:"neutral.quaternary",_dark:{bg:"surface.tertiary"},transition:"background-color 0.1s",_hover:{bg:"neutral.secondary"},rounded:"lg",outlineColor:"brand.base",outlineStyle:b?"solid":"none",outlineWidth:"thick",outlineOffset:1,cursor:"pointer"}),children:e(d,{name:t,fiatBalanceWithSymbol:n,tokenBalanceWithSymbol:r,tokenIcon:h,logoUrl:l,tokenBalanceFirst:c})}):e(d,{name:t,fiatBalanceWithSymbol:n,tokenBalanceWithSymbol:r,tokenIcon:h,logoUrl:l,tokenBalanceFirst:c})})},v=Object.assign(T,{TokenIcon:u});export{v as TokenListItem};
|
|
2
2
|
//# sourceMappingURL=token-list-item.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"token-list-item.js","sources":["../../../../src/components/list-items/token-list-item.tsx"],"sourcesContent":["import { IconGenericToken } from '@components/logos';\nimport { Text } from '@components/primitives';\nimport { css } from '@styled/css';\nimport { Center, HStack, VStack } from '@styled/jsx';\nimport { createHost, createSlot } from 'create-slots';\nimport { Children, cloneElement, useCallback, useRef } from 'react';\nimport { AriaButtonProps, mergeProps, useButton, useFocusRing } from 'react-aria';\n\nexport interface TokenListItemProps extends AriaButtonProps {\n name: string;\n fiatBalanceWithSymbol: string;\n tokenBalanceWithSymbol: string;\n logoUrl?: string;\n onPress?: () => void;\n}\n\nconst TokenIcon = createSlot(({ children, ...props }) => {\n return (\n <Center>\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Center>\n );\n});\n\ninterface ListContentProps extends Omit<TokenListItemProps, 'onPress'> {\n tokenIcon?: React.ReactElement;\n}\n\nconst ListContent = ({
|
|
1
|
+
{"version":3,"file":"token-list-item.js","sources":["../../../../src/components/list-items/token-list-item.tsx"],"sourcesContent":["import { IconGenericToken } from '@components/logos';\nimport { Text } from '@components/primitives';\nimport { css } from '@styled/css';\nimport { Center, HStack, VStack } from '@styled/jsx';\nimport { createHost, createSlot } from 'create-slots';\nimport { Children, cloneElement, useCallback, useRef } from 'react';\nimport { AriaButtonProps, mergeProps, useButton, useFocusRing } from 'react-aria';\n\nexport interface TokenListItemProps extends AriaButtonProps {\n name: string;\n fiatBalanceWithSymbol: string;\n tokenBalanceWithSymbol: string;\n logoUrl?: string;\n onPress?: () => void;\n tokenBalanceFirst?: boolean;\n}\n\nconst TokenIcon = createSlot(({ children, ...props }) => {\n return (\n <Center>\n {Children.map(children, child => {\n return cloneElement(child, props);\n })}\n </Center>\n );\n});\n\ninterface ListContentProps extends Omit<TokenListItemProps, 'onPress'> {\n tokenIcon?: React.ReactElement;\n}\n\nconst ListContent = ({\n name,\n fiatBalanceWithSymbol,\n tokenBalanceWithSymbol,\n tokenIcon,\n logoUrl,\n tokenBalanceFirst,\n}: ListContentProps) => {\n return (\n <HStack w=\"full\" justify=\"space-between\">\n <HStack gap={4}>\n {tokenIcon ? (\n {\n ...tokenIcon,\n props: {\n ...tokenIcon.props,\n width: 40,\n height: 40,\n },\n }\n ) : logoUrl ? (\n <img width={40} height={40} src={logoUrl} alt={`${name} logo`} />\n ) : (\n <IconGenericToken width={40} height={40} />\n )}\n <Text fontWeight=\"medium\" styles={{ textTransform: 'capitalize' }}>\n {name}\n </Text>\n </HStack>\n <VStack gap={0} alignItems=\"flex-end\">\n <Text size=\"sm\" styles={{ lineHeight: '1.5rem' }}>\n {tokenBalanceFirst ? tokenBalanceWithSymbol : fiatBalanceWithSymbol}\n </Text>\n <Text size=\"sm\" fontColor=\"text.secondary\" styles={{ lineHeight: '1.5rem' }}>\n {tokenBalanceFirst ? fiatBalanceWithSymbol : tokenBalanceWithSymbol}\n </Text>\n </VStack>\n </HStack>\n );\n};\n\nconst TokenListItemBase = (props: TokenListItemProps) => {\n const { name, fiatBalanceWithSymbol, tokenBalanceWithSymbol, logoUrl, onPress, tokenBalanceFirst } = props;\n\n const ref = useRef(null);\n\n const handlePress = useCallback(() => {\n onPress?.();\n }, [onPress]);\n\n const { buttonProps } = useButton({ ...props, onPress: handlePress }, ref);\n const { isFocusVisible, focusProps } = useFocusRing();\n\n return createHost(props.children, slots => {\n const tokenIcon = slots.get(TokenIcon);\n\n if (onPress)\n return (\n <button\n ref={ref}\n {...mergeProps(buttonProps, focusProps)}\n className={css({\n w: 'full',\n px: 4,\n py: 2,\n minH: 16,\n bg: 'neutral.quaternary',\n _dark: { bg: 'surface.tertiary' },\n transition: 'background-color 0.1s',\n _hover: { bg: 'neutral.secondary' },\n rounded: 'lg',\n outlineColor: 'brand.base',\n outlineStyle: isFocusVisible ? 'solid' : 'none',\n outlineWidth: 'thick',\n outlineOffset: 1,\n cursor: 'pointer',\n })}\n >\n <ListContent\n name={name}\n fiatBalanceWithSymbol={fiatBalanceWithSymbol}\n tokenBalanceWithSymbol={tokenBalanceWithSymbol}\n tokenIcon={tokenIcon}\n logoUrl={logoUrl}\n tokenBalanceFirst={tokenBalanceFirst}\n />\n </button>\n );\n\n return (\n <ListContent\n name={name}\n fiatBalanceWithSymbol={fiatBalanceWithSymbol}\n tokenBalanceWithSymbol={tokenBalanceWithSymbol}\n tokenIcon={tokenIcon}\n logoUrl={logoUrl}\n tokenBalanceFirst={tokenBalanceFirst}\n />\n );\n });\n};\n\nexport const TokenListItem = Object.assign(TokenListItemBase, { TokenIcon });\n"],"names":["TokenIcon","createSlot","children","props","_jsx","Center","Children","child","cloneElement","ListContent","name","fiatBalanceWithSymbol","tokenBalanceWithSymbol","tokenIcon","logoUrl","tokenBalanceFirst","_jsxs","HStack","IconGenericToken","Text","VStack","TokenListItemBase","onPress","ref","useRef","handlePress","useCallback","buttonProps","useButton","isFocusVisible","focusProps","useFocusRing","createHost","slots","mergeProps","css","TokenListItem"],"mappings":"ssBAiBA,MAAMA,EAAYC,EAAW,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAO,IAEhDC,EAACC,EAAM,CAAA,SACJC,EAAS,IAAIJ,EAAUK,GACfC,EAAaD,EAAOJ,CAAK,CACjC,CACM,CAAA,CAEZ,EAMKM,EAAc,CAAC,CACnB,KAAAC,EACA,sBAAAC,EACA,uBAAAC,EACA,UAAAC,EACA,QAAAC,EACA,kBAAAC,CAAiB,IAGfC,EAACC,EAAM,CAAC,EAAE,OAAO,QAAQ,0BACvBD,EAACC,EAAO,CAAA,IAAK,YACVJ,EACC,CACE,GAAGA,EACH,MAAO,CACL,GAAGA,EAAU,MACb,MAAO,GACP,OAAQ,EACT,CACF,EACCC,EACFV,EAAK,MAAA,CAAA,MAAO,GAAI,OAAQ,GAAI,IAAKU,EAAS,IAAK,GAAGJ,CAAI,OAAO,CAAA,EAE7DN,EAACc,EAAiB,CAAA,MAAO,GAAI,OAAQ,EAAM,CAAA,EAE7Cd,EAACe,EAAK,CAAA,WAAW,SAAS,OAAQ,CAAE,cAAe,YAAY,EAC5D,SAAAT,CACI,CAAA,CAAA,CAAA,CAAA,EAETM,EAACI,EAAO,CAAA,IAAK,EAAG,WAAW,WACzB,SAAA,CAAAhB,EAACe,EAAI,CAAC,KAAK,KAAK,OAAQ,CAAE,WAAY,QAAQ,EAC3C,SAAAJ,EAAoBH,EAAyBD,CAAqB,CAAA,EAErEP,EAACe,EAAI,CAAC,KAAK,KAAK,UAAU,iBAAiB,OAAQ,CAAE,WAAY,QAAQ,EACtE,SAAAJ,EAAoBJ,EAAwBC,CAAsB,CAAA,CAC9D,CACA,CAAA,CAAA,CAAA,CAAA,EAKTS,EAAqBlB,GAA6B,CACtD,KAAM,CAAE,KAAAO,EAAM,sBAAAC,EAAuB,uBAAAC,EAAwB,QAAAE,EAAS,QAAAQ,EAAS,kBAAAP,CAAmB,EAAGZ,EAE/FoB,EAAMC,EAAO,IAAI,EAEjBC,EAAcC,EAAY,IAAK,CACnCJ,IACF,CAAA,EAAG,CAACA,CAAO,CAAC,EAEN,CAAE,YAAAK,CAAW,EAAKC,EAAU,CAAE,GAAGzB,EAAO,QAASsB,GAAeF,CAAG,EACnE,CAAE,eAAAM,EAAgB,WAAAC,GAAeC,IAEvC,OAAOC,EAAW7B,EAAM,SAAU8B,GAAQ,CACxC,MAAMpB,EAAYoB,EAAM,IAAIjC,CAAS,EAErC,OAAIsB,EAEAlB,EACE,SAAA,CAAA,IAAKmB,KACDW,EAAWP,EAAaG,CAAU,EACtC,UAAWK,EAAI,CACb,EAAG,OACH,GAAI,EACJ,GAAI,EACJ,KAAM,GACN,GAAI,qBACJ,MAAO,CAAE,GAAI,kBAAoB,EACjC,WAAY,wBACZ,OAAQ,CAAE,GAAI,mBAAqB,EACnC,QAAS,KACT,aAAc,aACd,aAAcN,EAAiB,QAAU,OACzC,aAAc,QACd,cAAe,EACf,OAAQ,SACT,CAAA,EAED,SAAAzB,EAACK,EAAW,CACV,KAAMC,EACN,sBAAuBC,EACvB,uBAAwBC,EACxB,UAAWC,EACX,QAASC,EACT,kBAAmBC,CACnB,CAAA,CAAA,CAAA,EAKNX,EAACK,EAAW,CACV,KAAMC,EACN,sBAAuBC,EACvB,uBAAwBC,EACxB,UAAWC,EACX,QAASC,EACT,kBAAmBC,CAAiB,CAAA,CAG1C,CAAC,CACH,EAEaqB,EAAgB,OAAO,OAAOf,EAAmB,CAAE,UAAArB,CAAS,CAAE"}
|
|
@@ -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]___[cond:_light","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","background]___[value:ink.90","background]___[value:paper]___[cond:_dark","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:ink.90]___[cond:_dark","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","width]___[value:fit-content","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","textAlign]___[value:left","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","opacity]___[value:0.3","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","height]___[value:100vh]___[cond:@media (min-width: 48rem)","width]___[value:100vw]___[cond:@media (min-width: 48rem)","background]___[value:surface.primary]___[cond:@media (min-width: 48rem)","position]___[value:relative]___[cond:@media (min-width: 48rem)","overflow]___[value:auto]___[cond:@media (min-width: 48rem)","scrollbarWidth]___[value:none]___[cond:@media (min-width: 48rem)","borderRadius]___[value:0]___[cond:@media (min-width: 48rem)","top]___[value:0]___[cond:@media (min-width: 48rem)","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","maxWidth]___[value:none","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:right","fontSize]___[value:xl","transition]___[value:opacity linear 120ms","textWrap]___[value:wrap","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","fontWeight]___[value:bold","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","borderRadius]___[value:3xl","background]___[value:surface.primary]___[cond:_dark","left]___[value:-50%","transform]___[value:skewX(-20deg)","backgroundImage]___[value:linear-gradient(90deg, transparent,rgba(0, 0, 0, .1), transparent)","backgroundImage]___[value:linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent)]___[cond:_dark","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))","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","gap]___[value:3","userSelect]___[value:none","userSelect]___[value:auto","filter]___[value:blur(10px)","textWrap]___[value:nowrap","width]___[value:22","height]___[value:22","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","width]___[value:20","background]___[value:surface.tertiary]___[cond:_hover","borderLeftWidth]___[value:thin","borderRadius]___[value:0","gap]___[value:2","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","width]___[value:16","height]___[value:16","paddingBlock]___[value:2.5","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","caret]___[value:18","check]___[value:16","height]___[value:3rem","mult]___[value:2.5","width]___[value:4","display]___[value:inline-block","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","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","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]___[cond:_light","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","background]___[value:ink.90","background]___[value:paper]___[cond:_dark","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:ink.90]___[cond:_dark","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","width]___[value:fit-content","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","textAlign]___[value:left","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","opacity]___[value:0.3","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","height]___[value:100vh]___[cond:@media (min-width: 48rem)","width]___[value:100vw]___[cond:@media (min-width: 48rem)","background]___[value:surface.primary]___[cond:@media (min-width: 48rem)","position]___[value:relative]___[cond:@media (min-width: 48rem)","overflow]___[value:auto]___[cond:@media (min-width: 48rem)","scrollbarWidth]___[value:none]___[cond:@media (min-width: 48rem)","borderRadius]___[value:0]___[cond:@media (min-width: 48rem)","top]___[value:0]___[cond:@media (min-width: 48rem)","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","maxWidth]___[value:none","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:right","fontSize]___[value:xl","transition]___[value:opacity linear 120ms","textWrap]___[value:wrap","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","background]___[value:rgba(0, 0, 0, .7)]___[cond:_dark","transform]___[value:translateY(0)","transform]___[value:translateY(100%)","transition]___[value:transform 0.3s","background]___[value:surface.secondary]___[cond:_dark","borderTopRadius]___[value:3xl","boxShadow]___[value:0px -12px 56px 0px rgba(119, 118, 122, 0.15)","paddingBottom]___[value:6","justifyContent]___[value:space-between","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","borderRadius]___[value:3xl","background]___[value:surface.primary]___[cond:_dark","left]___[value:-50%","transform]___[value:skewX(-20deg)","backgroundImage]___[value:linear-gradient(90deg, transparent,rgba(0, 0, 0, .1), transparent)","backgroundImage]___[value:linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent)]___[cond:_dark","maxWidth]___[value:72","width]___[value:max","paddingInline]___[value:3","borderRadius]___[value:xl","boxShadow]___[value:0px 4px 20px 0px rgba(0, 0, 0, 0.10)","left]___[value:50%","transform]___[value:translateX(-50%) translateY(calc(-100% - 0.75rem))","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","gap]___[value:3","userSelect]___[value:none","userSelect]___[value:auto","filter]___[value:blur(10px)","textWrap]___[value:nowrap","width]___[value:22","height]___[value:22","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","width]___[value:20","background]___[value:surface.tertiary]___[cond:_hover","borderLeftWidth]___[value:thin","borderRadius]___[value:0","gap]___[value:2","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:40","height]___[value:40","minHeight]___[value:16","background]___[value:surface.tertiary]___[cond:_dark","transition]___[value:background-color 0.1s","width]___[value:16","height]___[value:16","paddingBlock]___[value:2.5","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","caret]___[value:18","check]___[value:16","height]___[value:3rem","mult]___[value:2.5","width]___[value:4","display]___[value:inline-block","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","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"],"recipes":{}}}
|
|
@@ -3,6 +3,7 @@ export interface DrawerProps extends PropsWithChildren {
|
|
|
3
3
|
onToggle: (isOpen: boolean) => void;
|
|
4
4
|
isOpen: boolean;
|
|
5
5
|
title?: string;
|
|
6
|
+
showCloseButton?: boolean;
|
|
6
7
|
}
|
|
7
|
-
export declare const Drawer: ({ isOpen, title, onToggle, children }: DrawerProps) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare const Drawer: ({ isOpen, title, onToggle, children, showCloseButton }: DrawerProps) => import("react/jsx-runtime").JSX.Element;
|
|
8
9
|
//# sourceMappingURL=drawer.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../../src/components/containers/drawer.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAA4C,MAAM,OAAO,CAAC;AAEpF,MAAM,WAAW,WAAY,SAAQ,iBAAiB;IACpD,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../../src/components/containers/drawer.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAA4C,MAAM,OAAO,CAAC;AAEpF,MAAM,WAAW,WAAY,SAAQ,iBAAiB;IACpD,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,eAAO,MAAM,MAAM,2DAA2E,WAAW,4CAqFxG,CAAC"}
|
|
@@ -9,6 +9,6 @@ export declare const Page: (({ children, overlay, ...props }: PageProps) => JSX.
|
|
|
9
9
|
Icon: ({ children }: any) => any;
|
|
10
10
|
Content: ({ children, className }: import("../containers/content").ContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
11
|
Footer: ({ children, showLogo, ...sbmProps }: import("../containers/footer").FooterProps) => import("react/jsx-runtime").JSX.Element;
|
|
12
|
-
Drawer: ({ isOpen, title, onToggle, children }: import("../containers/drawer").DrawerProps) => import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
Drawer: ({ isOpen, title, onToggle, children, showCloseButton }: import("../containers/drawer").DrawerProps) => import("react/jsx-runtime").JSX.Element;
|
|
13
13
|
};
|
|
14
14
|
//# sourceMappingURL=page.d.ts.map
|
|
@@ -6,6 +6,7 @@ export interface TokenListItemProps extends AriaButtonProps {
|
|
|
6
6
|
tokenBalanceWithSymbol: string;
|
|
7
7
|
logoUrl?: string;
|
|
8
8
|
onPress?: () => void;
|
|
9
|
+
tokenBalanceFirst?: boolean;
|
|
9
10
|
}
|
|
10
11
|
export declare const TokenListItem: ((props: TokenListItemProps) => JSX.Element) & {
|
|
11
12
|
TokenIcon: ({ children, ...props }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"token-list-item.d.ts","sourceRoot":"","sources":["../../../../src/components/list-items/token-list-item.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,eAAe,EAAuC,MAAM,YAAY,CAAC;AAElF,MAAM,WAAW,kBAAmB,SAAQ,eAAe;IACzD,IAAI,EAAE,MAAM,CAAC;IACb,qBAAqB,EAAE,MAAM,CAAC;IAC9B,sBAAsB,EAAE,MAAM,CAAC;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"token-list-item.d.ts","sourceRoot":"","sources":["../../../../src/components/list-items/token-list-item.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,eAAe,EAAuC,MAAM,YAAY,CAAC;AAElF,MAAM,WAAW,kBAAmB,SAAQ,eAAe;IACzD,IAAI,EAAE,MAAM,CAAC;IACb,qBAAqB,EAAE,MAAM,CAAC;IAC9B,sBAAsB,EAAE,MAAM,CAAC;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAsHD,eAAO,MAAM,aAAa,WA7DQ,kBAAkB;;CA6DwB,CAAC"}
|