@magiclabs/ui-components 1.52.1 → 2.0.0

package/dist/types/styles/tokens.d.ts

@@ -1,235 +1,95 @@
 export declare const colorTokens: {
-    slate: {
-        0: {
-            value: string;
-        };
-        1: {
-            value: string;
-        };
-        2: {
-            value: string;
-        };
-        3: {
-            value: string;
-        };
-        4: {
-            value: string;
-        };
-    };
-    ink: {
-        10: {
-            value: string;
-        };
-        20: {
-            value: string;
-        };
-        30: {
-            value: string;
-        };
-        40: {
-            value: string;
-        };
-        50: {
-            value: string;
-        };
-        60: {
-            value: string;
-        };
-        70: {
-            value: string;
-        };
-        80: {
-            value: string;
-        };
-        90: {
-            value: string;
-        };
-    };
-    magic: {
-        10: {
-            value: string;
-        };
-        20: {
-            value: string;
-        };
-        30: {
-            value: string;
-        };
-        40: {
-            value: string;
-        };
-        50: {
-            value: string;
-        };
-        60: {
-            value: string;
-        };
-        70: {
-            value: string;
-        };
-        80: {
-            value: string;
-        };
-        90: {
-            value: string;
-        };
-    };
-    leaf: {
-        10: {
-            value: string;
-        };
-        20: {
-            value: string;
-        };
-        30: {
-            value: string;
-        };
-        40: {
-            value: string;
-        };
-        50: {
-            value: string;
-        };
-        60: {
-            value: string;
-        };
-        70: {
-            value: string;
-        };
-        80: {
-            value: string;
-        };
-        90: {
-            value: string;
-        };
-    };
-    ruby: {
-        10: {
-            value: string;
-        };
-        20: {
-            value: string;
-        };
-        30: {
-            value: string;
-        };
-        40: {
-            value: string;
-        };
-        50: {
-            value: string;
-        };
-        60: {
-            value: string;
-        };
-        70: {
-            value: string;
-        };
-        80: {
-            value: string;
-        };
-        90: {
-            value: string;
-        };
-    };
-    gold: {
-        10: {
-            value: string;
-        };
-        20: {
-            value: string;
-        };
-        30: {
-            value: string;
-        };
-        40: {
-            value: string;
-        };
-        50: {
-            value: string;
-        };
-        60: {
-            value: string;
-        };
-        70: {
-            value: string;
-        };
-        80: {
-            value: string;
-        };
-        90: {
-            value: string;
-        };
-    };
-    sky: {
-        10: {
-            value: string;
-        };
-        20: {
-            value: string;
-        };
-        30: {
-            value: string;
-        };
-        40: {
-            value: string;
-        };
-        50: {
-            value: string;
-        };
-        60: {
-            value: string;
-        };
-        70: {
-            value: string;
-        };
-        80: {
-            value: string;
-        };
-        90: {
-            value: string;
-        };
-    };
-    chalk: {
-        value: string;
-    };
-    paper: {
-        value: string;
-    };
+    readonly slate: {
+        readonly 0: "#19191A";
+        readonly 1: "#252525";
+        readonly 2: "#303030";
+        readonly 3: "#383838";
+        readonly 4: "#474747";
+    };
+    readonly ink: {
+        readonly 10: "#F8F8FA";
+        readonly 20: "#EDEDF3";
+        readonly 30: "#E2E0E5";
+        readonly 40: "#CCCAD0";
+        readonly 50: "#B6B4BA";
+        readonly 60: "#97959A";
+        readonly 70: "#77767A";
+        readonly 80: "#4E4D52";
+        readonly 90: "#18171A";
+    };
+    readonly magic: {
+        readonly 10: "#EDEBFF";
+        readonly 20: "#CAC2FF";
+        readonly 30: "#A799FF";
+        readonly 40: "#8875FF";
+        readonly 50: "#6851FF";
+        readonly 60: "#5D40EA";
+        readonly 70: "#522FD4";
+        readonly 80: "#4421C3";
+        readonly 90: "#3512B2";
+    };
+    readonly leaf: {
+        readonly 10: "#E3FAF3";
+        readonly 20: "#BAF5E3";
+        readonly 30: "#90F0D3";
+        readonly 40: "#48DEB1";
+        readonly 50: "#00CC8F";
+        readonly 60: "#00AA77";
+        readonly 70: "#00875F";
+        readonly 80: "#007753";
+        readonly 90: "#006647";
+    };
+    readonly ruby: {
+        readonly 10: "#FFEAE5";
+        readonly 20: "#FFC3B3";
+        readonly 30: "#FF9B80";
+        readonly 40: "#FE7C58";
+        readonly 50: "#FC5C30";
+        readonly 60: "#E84718";
+        readonly 70: "#D43100";
+        readonly 80: "#C12E02";
+        readonly 90: "#AD2B03";
+    };
+    readonly gold: {
+        readonly 10: "#FCF4E5";
+        readonly 20: "#FEE5BD";
+        readonly 30: "#FFD594";
+        readonly 40: "#EDBD72";
+        readonly 50: "#DBA550";
+        readonly 60: "#BF8832";
+        readonly 70: "#A36B14";
+        readonly 80: "#97630C";
+        readonly 90: "#8A5A03";
+    };
+    readonly sky: {
+        readonly 10: "#EBF0FE";
+        readonly 20: "#AFC4FF";
+        readonly 30: "#7398FF";
+        readonly 40: "#5482FB";
+        readonly 50: "#346BF7";
+        readonly 60: "#295EE7";
+        readonly 70: "#1E50D6";
+        readonly 80: "#1344C7";
+        readonly 90: "#0737B8";
+    };
+    readonly chalk: "#FFFFFF";
+    readonly paper: "#FFFFFF";
 };
 export declare const borderWidthTokens: {
-    thin: {
-        value: string;
-    };
-    medium: {
-        value: string;
-    };
-    thick: {
-        value: string;
-    };
+    readonly thin: "0.0625rem";
+    readonly medium: "0.09375rem";
+    readonly thick: "0.125rem";
 };
 export declare const radiiTokens: {
-    button: {
-        value: string;
-    };
-    container: {
-        value: string;
-    };
-    input: {
-        value: string;
-    };
+    readonly button: "var(--button-radius, 9999px)";
+    readonly container: "var(--container-radius, 1.75rem)";
+    readonly input: "var(--input-radius, 0.875rem)";
 };
 export declare const sizeTokens: {
-    13: {
-        value: string;
-    };
-    15: {
-        value: string;
-    };
+    readonly 13: "3.25rem";
+    readonly 15: "3.75rem";
 };
 export declare const zIndexTokens: {
-    max: {
-        value: string;
-    };
+    readonly max: "2147483647";
 };
 //# sourceMappingURL=tokens.d.ts.map

package/dist/types/styles/tokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../../src/styles/tokens.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4EtB,CAAC;AAEH,eAAO,MAAM,iBAAiB;;;;;;;;;;CAI5B,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;;;;;;CAItB,CAAC;AAEH,eAAO,MAAM,UAAU;;;;;;;CAIrB,CAAC;AAEH,eAAO,MAAM,YAAY;;;;CAEvB,CAAC"}
+{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../../src/styles/tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4Ed,CAAC;AAEX,eAAO,MAAM,iBAAiB;;;;CAIpB,CAAC;AAEX,eAAO,MAAM,WAAW;;;;CAId,CAAC;AAEX,eAAO,MAAM,UAAU;;;CAGb,CAAC;AAEX,eAAO,MAAM,YAAY;;CAEf,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@magiclabs/ui-components",
-  "version": "1.52.1",
+  "version": "2.0.0",
   "packageManager": "pnpm@9.15.4+sha512.b2dc20e2fc72b3e18848459b37359a32064663e5627a51e4c74b2c29dd8e8e0491483c3abb40789cfd578bf362fb6ba8261b05f0387d76792ed6e23ea3b1b6a0",
   "description": "💅 A theme-able library of reusable UI components",
   "author": "Magic Labs <open-source@magic.link>",
@@ -19,7 +19,8 @@
       "types": "./dist/types/presets.d.ts",
       "import": "./dist/es/presets.js",
       "require": "./dist/cjs/presets.js"
-    }
+    },
+    "./styles.css": "./dist/styles.css"
   },
   "files": [
     "dist/*"
@@ -35,17 +36,16 @@
     "commit": "git add --all && git-cz",
     "generate:icons": "tsx ./scripts/generateIcons.ts",
     "preinstall": "npx only-allow pnpm",
-    "prepare": "panda codegen",
-    "lib:dev": "rimraf dist && rollup -w -c rollup.config.mjs && pnpm lib:buildinfo",
-    "lib:build": "rimraf dist && rollup -c rollup.config.mjs && pnpm lib:buildinfo",
-    "lib:buildinfo": "panda ship --outfile dist/panda.buildinfo.json",
+    "lib:dev": "rimraf dist && rollup -w -c rollup.config.mjs",
+    "lib:build": "rimraf dist && rollup -c rollup.config.mjs && pnpm lib:css",
+    "lib:css": "tailwindcss -i ./src/styles/globals.css -o ./dist/styles.css --minify",
     "lib:publish": "auto shipit -v",
     "docs:dev": "storybook dev -p 6006",
     "docs:build": "storybook build",
     "docs:test": "playwright install && test-storybook",
     "docs:test:ci": "concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"pnpm docs:build --quiet && npx http-server storybook-static --port 6006 --silent\" \"wait-on tcp:6006 && pnpm docs:test\"",
     "lint": "eslint --ext .ts,.tsx ./src",
-    "reset": "rimraf node_modules && rimraf styled-system && rimraf dist && rimraf coverage",
+    "reset": "rimraf node_modules && rimraf dist && rimraf coverage",
     "test": "jest --maxWorkers=50%",
     "test:watch": "jest --watch --maxWorkers=25%",
     "test:ci": "jest --runInBand --passWithNoTests",
@@ -56,8 +56,6 @@
     "@auto-it/conventional-commits": "^11.1.6",
     "@commitlint/cli": "^19.3.0",
     "@commitlint/config-conventional": "^19.2.2",
-    "@pandacss/dev": "^0.40.1",
-    "@pandacss/types": "^0.40.1",
     "@rollup/plugin-commonjs": "^26.0.1",
     "@rollup/plugin-node-resolve": "^15.2.3",
     "@rollup/plugin-url": "^8.0.2",
@@ -92,6 +90,7 @@
     "@typescript-eslint/parser": "^7.13.0",
     "agadoo": "^3.0.0",
     "auto": "^11.1.6",
+    "autoprefixer": "^10.4.27",
     "axios": "^1.7.2",
     "builtin-modules": "^4.0.0",
     "chalk": "^5.3.0",
@@ -133,6 +132,7 @@
     "storybook": "^8.3.0",
     "storybook-addon-deep-controls": "^0.6.2",
     "storybook-dark-mode": "^4.0.2",
+    "tailwindcss": "3",
     "ts-jest": "^29.1.4",
     "ts-node": "^10.9.2",
     "tsx": "^4.15.1",
@@ -143,7 +143,6 @@
     "yargs": "^17.7.2"
   },
   "peerDependencies": {
-    "@pandacss/dev": "^0.35.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
@@ -154,9 +153,12 @@
     ]
   },
   "dependencies": {
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
     "create-slots": "^0.6.1",
     "react-aria": "^3.33.1",
     "react-international-phone": "^4.3.0",
-    "react-qrcode-logo": "^3.0.0"
+    "react-qrcode-logo": "^3.0.0",
+    "tailwind-merge": "^3.5.0"
   }
 }

package/dist/cjs/components/layouts/dialogue.js

@@ -1,2 +0,0 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("./page.js"),a=require("../primitives/button.js"),t=require("../primitives/text.js"),h=require("@styled/css"),q=require("@styled/jsx"),l=require("create-slots");const n=l.createSlot(r.Page.Icon),v=({children:c,cancelLabel:s,confirmLabel:i,title:o,message:u,onCancel:x=()=>{},onConfirm:d=()=>{},...g})=>l.createHost(c,j=>e.jsxs(r.Page,{...g,children:[e.jsx(r.Page.Icon,{children:j.get(n)}),e.jsxs(r.Page.Content,{children:[e.jsx(t.default.H3,{styles:{textAlign:"center"},children:o}),e.jsx(t.default,{size:"md",children:u}),e.jsxs(q.HStack,{className:h.css({pt:6}),children:[e.jsx(a.default,{onPress:d,label:i}),s&&e.jsx(a.default,{onPress:x,label:s})]})]}),e.jsx(r.Page.Footer,{})]})),P=Object.assign(v,{Icon:n});exports.Dialogue=P;
-//# sourceMappingURL=dialogue.js.map

package/dist/cjs/components/layouts/dialogue.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dialogue.js","sources":["../../../../src/components/layouts/dialogue.tsx"],"sourcesContent":["import { Page, PageProps } from '@components/layouts/page';\nimport Button from '@components/primitives/button';\nimport Text from '@components/primitives/text';\nimport { css } from '@styled/css';\nimport { HStack } from '@styled/jsx';\nimport { createHost, createSlot } from 'create-slots';\n\nexport interface DialogueProps extends PageProps {\n  cancelLabel?: string;\n  confirmLabel: string;\n  title: string;\n  message: string;\n  onCancel?: () => void;\n  onConfirm?: () => void;\n}\n\nconst DialogueIcon = createSlot(Page.Icon);\n\nconst DialogueHost = ({\n  children,\n  cancelLabel,\n  confirmLabel,\n  title,\n  message,\n  onCancel = () => {},\n  onConfirm = () => {},\n  ...props\n}: DialogueProps) => {\n  return createHost(children, slots => {\n    return (\n      <Page {...props}>\n        <Page.Icon>{slots.get(DialogueIcon)}</Page.Icon>\n        <Page.Content>\n          <Text.H3 styles={{ textAlign: 'center' }}>{title}</Text.H3>\n          <Text size=\"md\">{message}</Text>\n          {/* {children} */}\n          <HStack className={css({ pt: 6 })}>\n            <Button onPress={onConfirm} label={confirmLabel} />\n            {cancelLabel && <Button onPress={onCancel} label={cancelLabel} />}\n          </HStack>\n        </Page.Content>\n        <Page.Footer />\n      </Page>\n    );\n  });\n};\n\nexport const Dialogue = Object.assign(DialogueHost, {\n  Icon: DialogueIcon,\n});\n"],"names":["DialogueIcon","createSlot","Page","DialogueHost","children","cancelLabel","confirmLabel","title","message","onCancel","onConfirm","props","createHost","slots","_jsxs","_jsx","Text","HStack","css","Button","Dialogue"],"mappings":"2NAgBA,MAAMA,EAAeC,aAAWC,OAAK,IAAI,EAEnCC,EAAe,CAAC,CACpB,SAAAC,EACA,YAAAC,EACA,aAAAC,EACA,MAAAC,EACA,QAAAC,EACA,SAAAC,EAAW,IAAO,GAClB,UAAAC,EAAY,IAAO,GACnB,GAAGC,CAAK,IAEDC,EAAAA,WAAWR,EAAUS,GAExBC,EAAAA,KAACZ,EAAAA,KAAI,CAAA,GAAKS,EACR,SAAA,CAAAI,EAACb,IAAAA,EAAAA,KAAK,eAAMW,EAAM,IAAIb,CAAY,CAAc,CAAA,EAChDc,OAACZ,EAAAA,KAAK,mBACJa,EAAAA,IAACC,UAAK,GAAE,CAAC,OAAQ,CAAE,UAAW,QAAQ,WAAKT,CAAK,CAAA,EAChDQ,EAAAA,IAACC,EAAAA,SAAK,KAAK,KAAI,SAAER,CAAO,CAAA,EAExBM,OAACG,UAAO,UAAWC,EAAAA,IAAI,CAAE,GAAI,CAAC,CAAE,EAC9B,SAAA,CAAAH,EAACI,IAAAA,EAAAA,QAAO,CAAA,QAAST,EAAW,MAAOJ,CAAY,CAAA,EAC9CD,GAAeU,MAACI,EAAAA,QAAM,CAAC,QAASV,EAAU,MAAOJ,GAAe,CAC1D,CAAA,CAAA,CAAA,CAAA,EAEXU,MAACb,EAAAA,KAAK,OAAM,CAAA,CAAA,CAAG,CACV,CAAA,CAEV,EAGUkB,EAAW,OAAO,OAAOjB,EAAc,CAClD,KAAMH,CACP,CAAA"}

package/dist/cjs/components/layouts/passport-page.js

@@ -1,2 +0,0 @@
-"use strict";var e=require("react/jsx-runtime");require("../containers/button.js"),require("../containers/card.js"),require("@styled/css");var l=require("@styled/jsx"),m=require("../containers/drawer.js"),V=require("react");require("../utils/client-asset-logo.js");var v=require("@styled/tokens");require("react-qrcode-logo"),require("../utils/secured-by-magic.js");var A=require("../icons/ico-caret-left.js"),w=require("../icons/ico-newton.js"),G=require("../icons/ico-question-circle-fill.js");require("../containers/header.js");var S=require("../containers/menu.js"),I=require("../containers/modal.js");require("../containers/overlay.js"),require("../info/copy-button.js"),require("../info/email-wbr.js"),require("../info/security-otp.js"),require("../info/text-box.js");var L=require("../info/wallet-address.js"),n=require("../primitives/button.js"),f=require("../primitives/popover.js"),j=require("../primitives/text.js"),a=require("create-slots");const C=a.createSlot(({children:r})=>V.Children.map(r,t=>e.jsx(n.default,{expand:!0,...t.props}))),b=a.createSlot(n.default),P=a.createSlot(n.default),y=a.createSlot(({children:r})=>e.jsxs(f.Popover,{textStyle:"subtle",variant:"text",children:[e.jsx(f.Popover.TrailingIcon,{children:e.jsx(G.default,{})}),e.jsx(f.Popover.Content,{children:r})]})),k=a.createSlot(({branding:r,title:t})=>t?e.jsx(j.default,{size:"sm",fontColor:"text.secondary",children:t}):e.jsx(w.default,{color:v.token(r==="light"?"colors.text.primary":"colors.neutral.primary")})),B=a.createSlot(({children:r,height:t="auto",flexGrow:s=0})=>e.jsx(l.VStack,{w:"full",justify:"center",height:t,flexGrow:s,children:r})),H=a.createSlot(S.Menu),z=a.createSlot(m.Drawer),D=a.createSlot(({children:r})=>e.jsx(l.Center,{pt:3,w:"full",children:r})),F=a.createSlot(({children:r,domain:t,name:s,logoUrl:o})=>e.jsxs(l.HStack,{borderBottomColor:"neutral.primary",borderBottomWidth:"1px",p:3,width:"full",children:[o?e.jsx("img",{src:o,alt:s,width:24,height:24}):e.jsx(w.default,{color:v.token("colors.brand.base"),height:24,width:24}),e.jsx(j.default,{size:"sm",fontWeight:"semibold",children:s}),t&&e.jsx(j.default,{size:"sm",fontColor:"text.tertiary",children:t}),r]})),J=({actionDirection:r="row",address:t,children:s,onBack:o,onCancel:d,hideHeader:M=!1,...W})=>a.createHost(s,i=>{const c=i.getProps(b),u=i.getProps(P),p=i.getProps(z),x=i.getProps(H),g=i.get(C),q=i.get(y),T=i.get(k),h=r==="row";return e.jsxs(I.Modal,{...W,fullscreen:!0,paddingType:"none",gap:0,children:[!M&&e.jsxs(l.VStack,{gap:0,width:"full",children:[e.jsxs(l.HStack,{borderBottomColor:"neutral.primary",borderBottomWidth:"1px",justifyContent:"space-between",p:3,width:"full",children:[o&&e.jsx(n.default,{onPress:o,size:"md",textStyle:"neutral",variant:"text",children:e.jsx(n.default.LeadingIcon,{children:e.jsx(A.default,{})})}),d&&e.jsx(n.default,{onPress:d,label:"Cancel",size:"sm",textStyle:"neutral",variant:"text"}),!(o||d)&&e.jsx(l.Box,{w:6}),T,t||q||x?e.jsxs(l.HStack,{children:[t&&e.jsx(L.default,{address:t}),q,x&&e.jsx(S.Menu,{...x})]}):e.jsx(l.Box,{w:6})]}),i.get(F)]}),e.jsxs(l.VStack,{h:"full",w:"full",justify:"space-between",p:6,maxW:393,children:[i.get(B),e.jsxs(l.VStack,{w:"full",gap:3,children:[i.get(D),(c||u)&&e.jsxs(l.Flex,{direction:h?"row":"column-reverse",gap:h?4:3,width:"full",children:[c&&e.jsx(n.default,{expand:!0,label:"Cancel",variant:"neutral",...c}),u&&e.jsx(n.default,{expand:!0,label:"Confirm",variant:"inverse",...u})]}),g&&e.jsx(l.Flex,{direction:r,gap:h?4:3,width:"full",children:g})]})]}),p&&e.jsx(m.Drawer,{...p})]})}),N=Object.assign(J,{Actions:C,Cancel:b,Confirm:P,Content:B,Menu:H,Drawer:z,Footer:D,Header:F,Info:y,Title:k});exports.PassportPage=N;
-//# sourceMappingURL=passport-page.js.map

package/dist/cjs/components/layouts/passport-page.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"passport-page.js","sources":["../../../../src/components/layouts/passport-page.tsx"],"sourcesContent":["import { Menu } from '@components/containers';\nimport { Drawer } from '@components/containers/drawer';\nimport { Modal } from '@components/containers/modal';\nimport { IcoCaretLeft, IcoNewton, IcoQuestionCircleFill } from '@components/icons';\nimport { WalletAddress } from '@components/info';\nimport Button from '@components/primitives/button';\nimport Popover from '@components/primitives/popover';\nimport Text from '@components/primitives/text';\nimport { Box, Center, Flex, HStack, VStack } from '@styled/jsx';\nimport { token } from '@styled/tokens';\nimport { createHost, createSlot } from 'create-slots';\nimport { Children, PropsWithChildren } from 'react';\n\nexport interface HeaderProps extends PropsWithChildren {\n  name: string;\n  domain?: string;\n  logoUrl?: string;\n}\n\nexport interface TitleProps {\n  branding?: 'light' | 'dark';\n  title?: string;\n}\n\nexport interface PassportPageProps extends PropsWithChildren {\n  address?: string;\n  animate?: boolean;\n  actionDirection?: 'column' | 'row';\n  isOpen?: boolean;\n  hideHeader?: boolean;\n  onAnimated?: () => void;\n  onBack?: () => void;\n  onClosed?: () => void;\n  onCancel?: () => void;\n}\n\nconst Actions = createSlot(({ children }) => Children.map(children, child => <Button expand {...child.props} />));\nconst Cancel = createSlot(Button);\nconst Confirm = createSlot(Button);\nconst Info = createSlot(({ children }) => (\n  <Popover textStyle=\"subtle\" variant=\"text\">\n    <Popover.TrailingIcon>\n      <IcoQuestionCircleFill />\n    </Popover.TrailingIcon>\n    <Popover.Content>{children}</Popover.Content>\n  </Popover>\n));\nconst Title = createSlot(({ branding, title }: TitleProps) => {\n  return title ? (\n    <Text size=\"sm\" fontColor=\"text.secondary\">\n      {title}\n    </Text>\n  ) : (\n    <IcoNewton color={token(branding === 'light' ? 'colors.text.primary' : 'colors.neutral.primary')} />\n  );\n});\n\nconst PageContent = createSlot(({ children, height = 'auto', flexGrow = 0 }) => (\n  <VStack w=\"full\" justify=\"center\" height={height} flexGrow={flexGrow}>\n    {children}\n  </VStack>\n));\nconst PageMenu = createSlot(Menu);\nconst PageDrawer = createSlot(Drawer);\nconst PageFooter = createSlot(({ children }) => (\n  <Center pt={3} w=\"full\">\n    {children}\n  </Center>\n));\nconst PageHeader = createSlot(({ children, domain, name, logoUrl }: HeaderProps) => (\n  <HStack borderBottomColor=\"neutral.primary\" borderBottomWidth=\"1px\" p={3} width=\"full\">\n    {logoUrl ? (\n      <img src={logoUrl} alt={name} width={24} height={24} />\n    ) : (\n      <IcoNewton color={token('colors.brand.base')} height={24} width={24} />\n    )}\n    <Text size=\"sm\" fontWeight=\"semibold\">\n      {name}\n    </Text>\n    {domain && (\n      <Text size=\"sm\" fontColor=\"text.tertiary\">\n        {domain}\n      </Text>\n    )}\n    {children}\n  </HStack>\n));\n\nconst PageHost = ({\n  actionDirection = 'row',\n  address,\n  children,\n  onBack,\n  onCancel,\n  hideHeader = false,\n  ...props\n}: PassportPageProps) => {\n  return createHost(children, slots => {\n    const cancelProps = slots.getProps(Cancel);\n    const confirmProps = slots.getProps(Confirm);\n    const drawerProps = slots.getProps(PageDrawer);\n    const menuProps = slots.getProps(PageMenu);\n\n    const actions = slots.get(Actions);\n    const info = slots.get(Info);\n    const title = slots.get(Title);\n\n    const isRowDirection = actionDirection === 'row';\n\n    return (\n      <Modal {...props} fullscreen paddingType=\"none\" gap={0}>\n        {!hideHeader && (\n          <VStack gap={0} width=\"full\">\n            <HStack\n              borderBottomColor=\"neutral.primary\"\n              borderBottomWidth=\"1px\"\n              justifyContent=\"space-between\"\n              p={3}\n              width=\"full\"\n            >\n              {onBack && (\n                <Button onPress={onBack} size=\"md\" textStyle=\"neutral\" variant=\"text\">\n                  <Button.LeadingIcon>\n                    <IcoCaretLeft />\n                  </Button.LeadingIcon>\n                </Button>\n              )}\n              {onCancel && <Button onPress={onCancel} label=\"Cancel\" size=\"sm\" textStyle=\"neutral\" variant=\"text\" />}\n              {!(onBack || onCancel) && <Box w={6} />}\n              {title}\n              {address || info || menuProps ? (\n                <HStack>\n                  {address && <WalletAddress address={address} />}\n                  {info}\n                  {menuProps && <Menu {...menuProps} />}\n                </HStack>\n              ) : (\n                <Box w={6} />\n              )}\n            </HStack>\n            {slots.get(PageHeader)}\n          </VStack>\n        )}\n        <VStack h=\"full\" w=\"full\" justify=\"space-between\" p={6} maxW={393}>\n          {slots.get(PageContent)}\n          <VStack w=\"full\" gap={3}>\n            {slots.get(PageFooter)}\n            {(cancelProps || confirmProps) && (\n              <Flex direction={isRowDirection ? 'row' : 'column-reverse'} gap={isRowDirection ? 4 : 3} width=\"full\">\n                {cancelProps && <Button expand label=\"Cancel\" variant=\"neutral\" {...cancelProps} />}\n                {confirmProps && <Button expand label=\"Confirm\" variant=\"inverse\" {...confirmProps} />}\n              </Flex>\n            )}\n            {actions && (\n              <Flex direction={actionDirection} gap={isRowDirection ? 4 : 3} width=\"full\">\n                {actions}\n              </Flex>\n            )}\n          </VStack>\n        </VStack>\n        {drawerProps && <Drawer {...drawerProps} />}\n      </Modal>\n    );\n  });\n};\n\nexport const PassportPage = Object.assign(PageHost, {\n  Actions,\n  Cancel,\n  Confirm,\n  Content: PageContent,\n  Menu: PageMenu,\n  Drawer: PageDrawer,\n  Footer: PageFooter,\n  Header: PageHeader,\n  Info,\n  Title,\n});\n"],"names":["Actions","createSlot","children","Children","child","_jsx","Button","Cancel","Confirm","Info","_jsxs","Popover","IcoQuestionCircleFill","Title","branding","title","Text","IcoNewton","token","PageContent","height","flexGrow","VStack","PageMenu","Menu","PageDrawer","Drawer","PageFooter","Center","PageHeader","domain","name","logoUrl","HStack","PageHost","actionDirection","address","onBack","onCancel","hideHeader","props","createHost","slots","cancelProps","confirmProps","drawerProps","menuProps","actions","info","isRowDirection","Modal","IcoCaretLeft","Box","WalletAddress","Flex","PassportPage"],"mappings":"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"}

package/dist/cjs/components/layouts/wallet-page/account-menu.js

@@ -1,2 +0,0 @@
-"use strict";var e=require("react/jsx-runtime"),h=require("@styled/tokens"),j=require("../../icons/ico-qrcode.js"),m=require("../../primitives/button.js");require("../../primitives/checkbox.js"),require("../../primitives/dropdown-selector.js");var o=require("../../primitives/popover.js");require("../../primitives/radio.js"),require("../../primitives/segmented-control.js"),require("../../primitives/switch.js");var l=require("../../primitives/text.js"),u=require("@styled/css/css"),s=require("@styled/jsx"),x=require("react");const v=({avatarUrl:i,email:r,name:t,logoutLabel:d="Log out",onReceive:a,onLogout:f})=>{const[p,n]=x.useState(!1);x.useEffect(()=>{n(!1)},[i]);const c=()=>e.jsxs(o.Popover,{iconSize:28,placement:"bottom right",variant:"text",children:[e.jsx(o.Popover.LeadingIcon,{children:i&&!p?e.jsx("img",{style:{borderRadius:"50%"},src:i,alt:"user avatar",onError:()=>n(!0)}):e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"28",height:"28",viewBox:"0 0 28 28",fill:"none",children:[e.jsx("circle",{cx:"14",cy:"14",r:"13",fill:"url(#paint0_radial_3600_63997)",stroke:"white",strokeOpacity:"0.24",strokeWidth:"0.5"}),e.jsx("defs",{children:e.jsxs("radialGradient",{id:"paint0_radial_3600_63997",cx:"0",cy:"0",r:"1",gradientUnits:"userSpaceOnUse",gradientTransform:"translate(15 30.75) rotate(-90) scale(37.3333 65.833)",children:[e.jsx("stop",{offset:"0.01",stopColor:"#FFF507"}),e.jsx("stop",{offset:"0.259381",stopColor:"#F09BEB"}),e.jsx("stop",{offset:"0.598165",stopColor:"#412CB9"}),e.jsx("stop",{offset:"1",stopColor:"#18171A"})]})})]})}),e.jsx(o.Popover.Content,{className:u.css({w:t&&r?"200px":"fit-content",maxW:"200px"}),children:e.jsxs(s.Stack,{w:"full",alignItems:"start",gap:0,children:[(r||t)&&e.jsxs(s.Stack,{w:"full",gap:1,children:[t&&e.jsx(l.default,{fontWeight:"medium",children:t}),r&&e.jsx(l.default,{size:"sm",truncate:!0,fontColor:"text.secondary",children:r})]}),(r||t)&&e.jsx(s.Divider,{color:"surface.quaternary",my:3,minW:"88px"}),e.jsx(m.default,{label:d,textStyle:"negative",variant:"text",size:"sm",onPress:f})]})})]});return a?e.jsxs(s.HStack,{gap:1,minWidth:"fit-content",minHeight:"fit-content",children:[e.jsx(s.Box,{onClick:a,cursor:"pointer",transition:"transform 0.1s",_active:{transform:"scale(0.95)"},className:u.css({"@media (max-width: 370px)":{display:"none"}}),children:e.jsx(j.default,{height:18,width:18,color:h.token("colors.text.secondary")})}),e.jsx(c,{})]}):e.jsx(c,{})};exports.AccountMenu=v;
-//# sourceMappingURL=account-menu.js.map

package/dist/cjs/components/layouts/wallet-page/account-menu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"account-menu.js","sources":["../../../../../src/components/layouts/wallet-page/account-menu.tsx"],"sourcesContent":["import { IcoQrcode } from '@components/icons';\nimport { Button, Popover, Text } from '@components/primitives';\nimport { css } from '@styled/css/css';\nimport { Box, Divider, HStack, Stack } from '@styled/jsx';\nimport { token } from '@styled/tokens';\nimport { useEffect, useState } from 'react';\n\nexport interface AccountMenuProps {\n  avatarUrl?: string;\n  email?: string;\n  name?: string;\n  logoutLabel?: string;\n  onReceive?: () => void;\n  onLogout?: () => void;\n}\n\nexport const AccountMenu = ({\n  avatarUrl,\n  email,\n  name,\n  logoutLabel = 'Log out',\n  onReceive,\n  onLogout,\n}: AccountMenuProps) => {\n  const [error, setError] = useState(false);\n\n  useEffect(() => {\n    setError(false);\n  }, [avatarUrl]);\n\n  const PopoverElement = () => (\n    <Popover iconSize={28} placement=\"bottom right\" variant=\"text\">\n      <Popover.LeadingIcon>\n        {avatarUrl && !error ? (\n          <img style={{ borderRadius: '50%' }} src={avatarUrl} alt=\"user avatar\" onError={() => setError(true)} />\n        ) : (\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"28\" height=\"28\" viewBox=\"0 0 28 28\" fill=\"none\">\n            <circle\n              cx=\"14\"\n              cy=\"14\"\n              r=\"13\"\n              fill=\"url(#paint0_radial_3600_63997)\"\n              stroke=\"white\"\n              strokeOpacity=\"0.24\"\n              strokeWidth=\"0.5\"\n            />\n            <defs>\n              <radialGradient\n                id=\"paint0_radial_3600_63997\"\n                cx=\"0\"\n                cy=\"0\"\n                r=\"1\"\n                gradientUnits=\"userSpaceOnUse\"\n                gradientTransform=\"translate(15 30.75) rotate(-90) scale(37.3333 65.833)\"\n              >\n                <stop offset=\"0.01\" stopColor=\"#FFF507\" />\n                <stop offset=\"0.259381\" stopColor=\"#F09BEB\" />\n                <stop offset=\"0.598165\" stopColor=\"#412CB9\" />\n                <stop offset=\"1\" stopColor=\"#18171A\" />\n              </radialGradient>\n            </defs>\n          </svg>\n        )}\n      </Popover.LeadingIcon>\n      <Popover.Content className={css({ w: name && email ? '200px' : 'fit-content', maxW: '200px' })}>\n        <Stack w=\"full\" alignItems=\"start\" gap={0}>\n          {(email || name) && (\n            <Stack w=\"full\" gap={1}>\n              {name && <Text fontWeight=\"medium\">{name}</Text>}\n              {email && (\n                <Text size=\"sm\" truncate fontColor=\"text.secondary\">\n                  {email}\n                </Text>\n              )}\n            </Stack>\n          )}\n          {(email || name) && <Divider color=\"surface.quaternary\" my={3} minW=\"88px\" />}\n          <Button label={logoutLabel} textStyle=\"negative\" variant=\"text\" size=\"sm\" onPress={onLogout} />\n        </Stack>\n      </Popover.Content>\n    </Popover>\n  );\n\n  if (!onReceive) return <PopoverElement />;\n\n  return (\n    <HStack gap={1} minWidth=\"fit-content\" minHeight=\"fit-content\">\n      <Box\n        onClick={onReceive}\n        cursor=\"pointer\"\n        transition=\"transform 0.1s\"\n        _active={{ transform: 'scale(0.95)' }}\n        className={css({\n          '@media (max-width: 370px)': {\n            display: 'none',\n          },\n        })}\n      >\n        <IcoQrcode height={18} width={18} color={token('colors.text.secondary')} />\n      </Box>\n      <PopoverElement />\n    </HStack>\n  );\n};\n"],"names":["AccountMenu","avatarUrl","email","name","logoutLabel","onReceive","onLogout","error","setError","useState","useEffect","PopoverElement","_jsxs","Popover","_jsx","css","Stack","Text","Divider","Button","HStack","Box","IcoQrcode","token"],"mappings":"ghBAgBa,MAAAA,EAAc,CAAC,CAC1B,UAAAC,EACA,MAAAC,EACA,KAAAC,EACA,YAAAC,EAAc,UACd,UAAAC,EACA,SAAAC,CACiB,IAAI,CACrB,KAAM,CAACC,EAAOC,CAAQ,EAAIC,EAAAA,SAAS,EAAK,EAExCC,YAAU,IAAK,CACbF,EAAS,EAAK,CAChB,EAAG,CAACP,CAAS,CAAC,EAEd,MAAMU,EAAiB,IACrBC,EAAAA,KAACC,EAAAA,QAAQ,CAAA,SAAU,GAAI,UAAU,eAAe,QAAQ,OAAM,SAAA,CAC5DC,EAAAA,IAACD,EAAQ,QAAA,YAAW,CAAA,SACjBZ,GAAa,CAACM,EACbO,EAAAA,WAAK,MAAO,CAAE,aAAc,KAAK,EAAI,IAAKb,EAAW,IAAI,cAAc,QAAS,IAAMO,EAAS,EAAI,CAAC,CAAA,EAEpGI,OAAK,MAAA,CAAA,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAM,SAAA,CAC5FE,MACE,SAAA,CAAA,GAAG,KACH,GAAG,KACH,EAAE,KACF,KAAK,iCACL,OAAO,QACP,cAAc,OACd,YAAY,QAEdA,EAAAA,IAAA,OAAA,CAAA,SACEF,EAAAA,uBACE,GAAG,2BACH,GAAG,IACH,GAAG,IACH,EAAE,IACF,cAAc,iBACd,kBAAkB,kEAElBE,MAAM,OAAA,CAAA,OAAO,OAAO,UAAU,SAAY,CAAA,EAC1CA,EAAAA,YAAM,OAAO,WAAW,UAAU,YAClCA,EAAAA,IAAA,OAAA,CAAM,OAAO,WAAW,UAAU,SAAS,CAAA,EAC3CA,MAAA,OAAA,CAAM,OAAO,IAAI,UAAU,SAAS,CAAA,CAAG,GAEpC,CAAA,CAAA,CAAA,CAAA,CAGS,CAAA,EACtBA,EAAAA,IAACD,EAAAA,QAAQ,QAAO,CAAC,UAAWE,EAAAA,IAAI,CAAE,EAAGZ,GAAQD,EAAQ,QAAU,cAAe,KAAM,OAAO,CAAE,EAC3F,SAAAU,OAACI,EAAAA,MAAK,CAAC,EAAE,OAAO,WAAW,QAAQ,IAAK,aACpCd,GAASC,IACTS,EAAAA,KAACI,EAAAA,OAAM,EAAE,OAAO,IAAK,EAAC,SAAA,CACnBb,GAAQW,EAAAA,IAACG,EAAAA,QAAI,CAAC,WAAW,SAAU,SAAAd,CAAY,CAAA,EAC/CD,GACCY,MAACG,EAAAA,QAAI,CAAC,KAAK,KAAK,YAAS,UAAU,iBAAgB,SAChDf,CACI,CAAA,CACR,CACK,CAAA,GAERA,GAASC,IAASW,MAACI,EAAAA,QAAQ,CAAA,MAAM,qBAAqB,GAAI,EAAG,KAAK,SACpEJ,MAACK,EAAAA,QAAO,CAAA,MAAOf,EAAa,UAAU,WAAW,QAAQ,OAAO,KAAK,KAAK,QAASE,CAAQ,CAAA,CAAI,GAEjF,CAAA,CAAA,CAAA,CAAA,EAItB,OAAKD,EAGHO,EAAAA,KAACQ,EAAAA,QAAO,IAAK,EAAG,SAAS,cAAc,UAAU,wBAC/CN,EAAAA,IAACO,OACC,QAAShB,EACT,OAAO,UACP,WAAW,iBACX,QAAS,CAAE,UAAW,aAAa,EACnC,UAAWU,EAAI,IAAA,CACb,4BAA6B,CAC3B,QAAS,MACV,EACF,EAAC,SAEFD,EAAAA,IAACQ,UAAU,CAAA,OAAQ,GAAI,MAAO,GAAI,MAAOC,EAAM,MAAA,uBAAuB,CAAK,CAAA,CAAA,CAAA,EAE7ET,EAAAA,IAACH,EAAc,EAAA,CAAG,CACX,CAAA,EAlBYG,EAACH,IAAAA,EAAc,EAAA,CAoBxC"}

package/dist/cjs/components/layouts/wallet-page/actions.js

@@ -1,2 +0,0 @@
-"use strict";var e=require("react/jsx-runtime");require("@styled/tokens");var u=require("../../icons/ico-arrow-down.js"),A=require("../../icons/ico-paper-plane.js"),x=require("../../icons/ico-refresh.js");require("../../sections/verify-pincode.js");var a=require("../../sections/wallet-actions.js");require("../../sections/wallet-navigation.js");const L=({actionBox:r,buyLabel:n="Buy",buyDisabledLabel:o,sendLabel:t="Send",sendDisabledLabel:c,swapLabel:b="Swap",swapDisabledLabel:d,onBuy:l,onSend:s,onSwap:i})=>e.jsxs(a.WalletActions,{actionBox:r,children:[l&&e.jsx(a.WalletActions.Action,{disabledLabel:o,label:n,onPress:l,children:e.jsx(u.default,{})}),i&&e.jsx(a.WalletActions.Action,{disabledLabel:d,label:b,onPress:i,children:e.jsx(x.default,{})}),s&&e.jsx(a.WalletActions.Action,{disabledLabel:c,label:t,onPress:s,children:e.jsx(A.default,{})})]});exports.Actions=L;
-//# sourceMappingURL=actions.js.map

package/dist/cjs/components/layouts/wallet-page/actions.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"actions.js","sources":["../../../../../src/components/layouts/wallet-page/actions.tsx"],"sourcesContent":["import { IcoArrowDown, IcoPaperPlane, IcoRefresh } from '@components/icons';\nimport { WalletActions } from '@components/sections';\n\nexport interface ActionsProps {\n  actionBox?: boolean;\n  buyLabel?: string;\n  buyDisabledLabel?: string;\n  sendLabel?: string;\n  sendDisabledLabel?: string;\n  swapLabel?: string;\n  swapDisabledLabel?: string;\n  onBuy?: () => void;\n  onSwap?: () => void;\n  onSend?: () => void;\n}\n\nexport const Actions = ({\n  actionBox,\n  buyLabel = 'Buy',\n  buyDisabledLabel,\n  sendLabel = 'Send',\n  sendDisabledLabel,\n  swapLabel = 'Swap',\n  swapDisabledLabel,\n  onBuy,\n  onSend,\n  onSwap,\n}: ActionsProps) => (\n  <WalletActions actionBox={actionBox}>\n    {onBuy && (\n      <WalletActions.Action disabledLabel={buyDisabledLabel} label={buyLabel} onPress={onBuy}>\n        <IcoArrowDown />\n      </WalletActions.Action>\n    )}\n    {onSwap && (\n      <WalletActions.Action disabledLabel={swapDisabledLabel} label={swapLabel} onPress={onSwap}>\n        <IcoRefresh />\n      </WalletActions.Action>\n    )}\n    {onSend && (\n      <WalletActions.Action disabledLabel={sendDisabledLabel} label={sendLabel} onPress={onSend}>\n        <IcoPaperPlane />\n      </WalletActions.Action>\n    )}\n  </WalletActions>\n);\n"],"names":["Actions","actionBox","buyLabel","buyDisabledLabel","sendLabel","sendDisabledLabel","swapLabel","swapDisabledLabel","onBuy","onSend","onSwap","_jsxs","WalletActions","_jsx","IcoArrowDown","IcoRefresh","IcoPaperPlane"],"mappings":"0VAgBa,MAAAA,EAAU,CAAC,CACtB,UAAAC,EACA,SAAAC,EAAW,MACX,iBAAAC,EACA,UAAAC,EAAY,OACZ,kBAAAC,EACA,UAAAC,EAAY,OACZ,kBAAAC,EACA,MAAAC,EACA,OAAAC,EACA,OAAAC,CACa,IACbC,EAACC,KAAAA,EAAAA,cAAa,CAAC,UAAWX,EAAS,SAAA,CAChCO,GACCK,MAACD,EAAAA,cAAc,OAAM,CAAC,cAAeT,EAAkB,MAAOD,EAAU,QAASM,EAC/E,SAAAK,MAACC,EAAAA,QAAY,CAAA,CAAA,CACQ,CAAA,EAExBJ,GACCG,EAACD,IAAAA,EAAAA,cAAc,OAAO,CAAA,cAAeL,EAAmB,MAAOD,EAAW,QAASI,EACjF,SAAAG,MAACE,EAAU,QAAA,EAAA,CACU,CAAA,EAExBN,GACCI,EAAAA,IAACD,EAAAA,cAAc,OAAO,CAAA,cAAeP,EAAmB,MAAOD,EAAW,QAASK,EACjF,SAAAI,EAACG,IAAAA,UAAa,CAAA,CAAA,CACO,CAAA,CACxB,CACa,CAAA"}

package/dist/cjs/components/layouts/wallet-page/address.js

@@ -1,2 +0,0 @@
-"use strict";var r=require("react/jsx-runtime");require("../../info/copy-button.js"),require("../../info/email-wbr.js"),require("../../info/security-otp.js"),require("../../info/text-box.js");var t=require("../../info/wallet-address.js"),s=require("@styled/jsx"),e=require("@styled/tokens");const n=({address:i,onAddressCopy:o})=>r.jsxs(s.HStack,{gap:0,style:{filter:`drop-shadow(0px 0px 0.5px color-mix(in srgb, ${e.token("colors.text.primary")}, transparent 20%)`},children:[r.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"48",height:"48",viewBox:"0 0 48 48",fill:"none",children:r.jsx("path",{d:"M0 0L48 0V48H47.4146C37.829 48 29.1682 42.28 25.4052 33.4639L16.4163 12.405C13.533 5.65001 7.28559 0.929159 0 0Z",fill:e.token("colors.surface.primary")})}),r.jsx(s.Center,{bgColor:"surface.primary",w:"114px",h:"48px",children:r.jsx(t.default,{address:i,onCopy:o,size:"sm",icon:!0,fontColor:"text.secondary",fontWeight:"medium"})}),r.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"48",height:"48",viewBox:"0 0 48 48",fill:"none",children:r.jsx("path",{d:"M48 0L0 0V48H0.299999C9.94709 48 18.6672 42.2544 22.4737 33.39L31.4615 12.4594C34.3773 5.66924 40.669 0.929361 48 0Z",fill:e.token("colors.surface.primary")})})]});exports.Address=n;
-//# sourceMappingURL=address.js.map

package/dist/cjs/components/layouts/wallet-page/address.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"address.js","sources":["../../../../../src/components/layouts/wallet-page/address.tsx"],"sourcesContent":["import { WalletAddress } from '@components/info';\nimport { Center, HStack } from '@styled/jsx';\nimport { token } from '@styled/tokens';\n\nexport interface AddressProps {\n  address: string;\n  onAddressCopy?: (address: string) => void;\n}\n\nexport const Address = ({ address, onAddressCopy }: AddressProps) => (\n  <HStack\n    gap={0}\n    style={{ filter: `drop-shadow(0px 0px 0.5px color-mix(in srgb, ${token('colors.text.primary')}, transparent 20%)` }}\n  >\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\n      <path\n        d=\"M0 0L48 0V48H47.4146C37.829 48 29.1682 42.28 25.4052 33.4639L16.4163 12.405C13.533 5.65001 7.28559 0.929159 0 0Z\"\n        fill={token('colors.surface.primary')}\n      />\n    </svg>\n    <Center bgColor=\"surface.primary\" w=\"114px\" h=\"48px\">\n      <WalletAddress\n        address={address}\n        onCopy={onAddressCopy}\n        size=\"sm\"\n        icon\n        fontColor=\"text.secondary\"\n        fontWeight=\"medium\"\n      />\n    </Center>\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\n      <path\n        d=\"M48 0L0 0V48H0.299999C9.94709 48 18.6672 42.2544 22.4737 33.39L31.4615 12.4594C34.3773 5.66924 40.669 0.929361 48 0Z\"\n        fill={token('colors.surface.primary')}\n      />\n    </svg>\n  </HStack>\n);\n"],"names":["Address","address","onAddressCopy","_jsxs","HStack","token","_jsx","Center","WalletAddress"],"mappings":"mSASO,MAAMA,EAAU,CAAC,CAAE,QAAAC,EAAS,cAAAC,CAA6B,IAC9DC,OAACC,EAAAA,OACC,CAAA,IAAK,EACL,MAAO,CAAE,OAAQ,gDAAgDC,EAAAA,MAAM,qBAAqB,CAAC,sBAE7F,SAAA,CAAAC,EAAAA,IAAA,MAAA,CAAK,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OACtF,SAAAA,EAAAA,IAAA,OAAA,CACE,EAAE,mHACF,KAAMD,EAAM,MAAA,wBAAwB,CACpC,CAAA,CAAA,CAAA,EAEJC,EAAAA,IAACC,SAAO,CAAA,QAAQ,kBAAkB,EAAE,QAAQ,EAAE,OAAM,SAClDD,EAAAA,IAACE,EAAa,QAAA,CACZ,QAASP,EACT,OAAQC,EACR,KAAK,KACL,KAAI,GACJ,UAAU,iBACV,WAAW,UAEN,CAAA,EACTI,MAAK,MAAA,CAAA,MAAM,6BAA6B,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAM,SAC5FA,MACE,OAAA,CAAA,EAAE,uHACF,KAAMD,EAAAA,MAAM,wBAAwB,CAAC,CAAA,CAEnC,CAAA,CAAA,CAAA,CAAA"}

package/dist/cjs/components/layouts/wallet-page/connection-menu.js

@@ -1,2 +0,0 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("@styled/tokens"),m=require("../../icons/ico-globe.js"),b=require("../../icons/ico-remove.js"),x=require("../../primitives/button.js");require("../../primitives/checkbox.js"),require("../../primitives/dropdown-selector.js");var s=require("../../primitives/popover.js");require("../../primitives/radio.js"),require("../../primitives/segmented-control.js"),require("../../primitives/switch.js");var n=require("../../primitives/text.js"),d=require("@styled/css/css"),r=require("@styled/jsx"),h=require("react");const q=({connected:i,connectedLabel:u="Connected",disconnectLabel:c,disconnectedLabel:v="Not connected",domain:j,logoUrl:o,onDisconnect:g,onReceive:p})=>{const[f,a]=h.useState(!1);h.useEffect(()=>{a(!1)},[o]);const l=()=>e.jsxs(s.Popover,{iconSize:28,variant:"text",children:[e.jsx(s.Popover.LeadingIcon,{color:t.token("colors.text.tertiary"),children:o&&i&&!f?e.jsxs(r.Circle,{position:"relative",w:7,h:7,children:[e.jsx("img",{style:{borderRadius:"50%"},width:28,height:28,src:o,alt:"app logo",onError:()=>a(!0)}),e.jsx(r.Circle,{size:"7px",position:"absolute",bg:"positive.base",borderWidth:"thin",borderColor:"surface.primary",bottom:"-1px",right:"-1px",boxSizing:"border-box"})]}):e.jsxs("svg",{width:"28",height:"28",children:[e.jsx("circle",{cx:"14",cy:"14",r:"14",fill:t.token("colors.surface.tertiary")}),e.jsx(m.default,{color:t.token("colors.text.tertiary"),x:6,y:6,height:16,width:16})]})}),e.jsxs(s.Popover.Content,{className:d.css({w:"200px"}),children:[e.jsxs(r.Stack,{w:"100%",gap:1,overflow:"hidden",children:[i?e.jsx(n.default,{size:"xs",variant:"success",fontWeight:"normal",children:u}):e.jsx(n.default,{fontColor:"text.tertiary",size:"xs",children:v}),e.jsx(n.default,{truncate:!0,children:j})]}),i&&c&&e.jsxs(e.Fragment,{children:[e.jsx(r.Divider,{color:"surface.quaternary",my:3}),e.jsx(x.default,{label:c,size:"sm",textStyle:"negative",variant:"text",onPress:g,children:e.jsx(x.default.LeadingIcon,{children:e.jsxs("svg",{width:"20",height:"20",children:[e.jsx("circle",{cx:"8",cy:"8",r:"8",fill:t.token("colors.negative.lightest")}),e.jsx(b.default,{color:t.token("colors.negative.base"),x:3,y:3,height:10,width:10})]})})})]})]})]});return p?e.jsxs(r.HStack,{gap:1,minWidth:"fit-content",minHeight:"fit-content",children:[e.jsx(l,{}),e.jsx(r.Box,{className:d.css({"@media (max-width: 370px)":{display:"none"}}),minH:"18px",minW:"18px"})]}):e.jsx(l,{})};exports.ConnectionMenu=q;
-//# sourceMappingURL=connection-menu.js.map

package/dist/cjs/components/layouts/wallet-page/connection-menu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"connection-menu.js","sources":["../../../../../src/components/layouts/wallet-page/connection-menu.tsx"],"sourcesContent":["import { IcoGlobe, IcoRemove } from '@components/icons';\nimport { Button, Popover, Text } from '@components/primitives';\nimport { css } from '@styled/css/css';\nimport { Box, Circle, Divider, HStack, Stack } from '@styled/jsx';\nimport { token } from '@styled/tokens';\nimport { useEffect, useState } from 'react';\n\nexport interface ConnectionMenuProps {\n  connected?: boolean;\n  connectedLabel?: string;\n  disconnectLabel?: string;\n  disconnectedLabel?: string;\n  domain: string;\n  logoUrl?: string;\n  onDisconnect?: () => void;\n  onReceive?: () => void;\n}\n\nexport const ConnectionMenu = ({\n  connected,\n  connectedLabel = 'Connected',\n  disconnectLabel,\n  disconnectedLabel = 'Not connected',\n  domain,\n  logoUrl,\n  onDisconnect,\n  onReceive,\n}: ConnectionMenuProps) => {\n  const [error, setError] = useState(false);\n\n  useEffect(() => {\n    setError(false);\n  }, [logoUrl]);\n\n  const PopoverElement = () => (\n    <Popover iconSize={28} variant=\"text\">\n      <Popover.LeadingIcon color={token('colors.text.tertiary')}>\n        {logoUrl && connected && !error ? (\n          <Circle position=\"relative\" w={7} h={7}>\n            <img\n              style={{ borderRadius: '50%' }}\n              width={28}\n              height={28}\n              src={logoUrl}\n              alt=\"app logo\"\n              onError={() => setError(true)}\n            />\n            <Circle\n              size=\"7px\"\n              position=\"absolute\"\n              bg=\"positive.base\"\n              borderWidth=\"thin\"\n              borderColor=\"surface.primary\"\n              bottom=\"-1px\"\n              right=\"-1px\"\n              boxSizing=\"border-box\"\n            />\n          </Circle>\n        ) : (\n          <svg width=\"28\" height=\"28\">\n            <circle cx=\"14\" cy=\"14\" r=\"14\" fill={token('colors.surface.tertiary')} />\n            <IcoGlobe color={token('colors.text.tertiary')} x={6} y={6} height={16} width={16} />\n          </svg>\n        )}\n      </Popover.LeadingIcon>\n      <Popover.Content className={css({ w: '200px' })}>\n        <Stack w=\"100%\" gap={1} overflow=\"hidden\">\n          {!connected ? (\n            <Text fontColor=\"text.tertiary\" size=\"xs\">\n              {disconnectedLabel}\n            </Text>\n          ) : (\n            <Text size=\"xs\" variant=\"success\" fontWeight=\"normal\">\n              {connectedLabel}\n            </Text>\n          )}\n          <Text truncate>{domain}</Text>\n        </Stack>\n        {connected && disconnectLabel && (\n          <>\n            <Divider color=\"surface.quaternary\" my={3} />\n            <Button label={disconnectLabel} size=\"sm\" textStyle=\"negative\" variant=\"text\" onPress={onDisconnect}>\n              <Button.LeadingIcon>\n                <svg width=\"20\" height=\"20\">\n                  <circle cx=\"8\" cy=\"8\" r=\"8\" fill={token('colors.negative.lightest')} />\n                  <IcoRemove color={token('colors.negative.base')} x={3} y={3} height={10} width={10} />\n                </svg>\n              </Button.LeadingIcon>\n            </Button>\n          </>\n        )}\n      </Popover.Content>\n    </Popover>\n  );\n\n  if (!onReceive) return <PopoverElement />;\n\n  return (\n    <HStack gap={1} minWidth=\"fit-content\" minHeight=\"fit-content\">\n      <PopoverElement />\n      <Box\n        className={css({\n          '@media (max-width: 370px)': {\n            display: 'none',\n          },\n        })}\n        minH={'18px'}\n        minW={'18px'}\n      />\n    </HStack>\n  );\n};\n"],"names":["ConnectionMenu","connected","connectedLabel","disconnectLabel","disconnectedLabel","domain","logoUrl","onDisconnect","onReceive","error","setError","useState","useEffect","PopoverElement","_jsxs","Popover","_jsx","token","Circle","IcoGlobe","css","Stack","Text","Divider","Button","IcoRemove","HStack","Box"],"mappings":"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"}

package/dist/cjs/components/layouts/wallet-page/fiat.js

@@ -1,2 +0,0 @@
-"use strict";var t=require("react/jsx-runtime"),s=require("../../primitives/text.js"),a=require("@styled/jsx");const n=({fiatTotal:e,symbol:l})=>{const i=e?e.split("."):["0","00"],r=e?"text.primary":"text.tertiary";return t.jsxs(a.HStack,{alignItems:"flex-start",gap:1,my:3,children:[t.jsx(s.default.H4,{fontColor:r,styles:{lineHeight:"2.75rem"},children:l}),t.jsxs(a.HStack,{alignItems:"baseline",gap:0,children:[t.jsx(s.default.H1,{fontColor:r,children:i[0]}),t.jsx(s.default.H4,{fontColor:r,children:`.${i[1]||"00"}`})]})]})};exports.Fiat=n;
-//# sourceMappingURL=fiat.js.map

package/dist/cjs/components/layouts/wallet-page/fiat.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"fiat.js","sources":["../../../../../src/components/layouts/wallet-page/fiat.tsx"],"sourcesContent":["import Text from '@components/primitives/text';\nimport { HStack } from '@styled/jsx';\n\nexport interface FiatProps {\n  fiatTotal?: string;\n  symbol?: string;\n}\n\nexport const Fiat = ({ fiatTotal, symbol }: FiatProps) => {\n  const fiat = fiatTotal ? fiatTotal.split('.') : ['0', '00'];\n  const fiatColor = fiatTotal ? 'text.primary' : 'text.tertiary';\n\n  return (\n    <HStack alignItems=\"flex-start\" gap={1} my={3}>\n      <Text.H4 fontColor={fiatColor} styles={{ lineHeight: '2.75rem' }}>\n        {symbol}\n      </Text.H4>\n      <HStack alignItems=\"baseline\" gap={0}>\n        <Text.H1 fontColor={fiatColor}>{fiat[0]}</Text.H1>\n        <Text.H4 fontColor={fiatColor}>{`.${fiat[1] || '00'}`}</Text.H4>\n      </HStack>\n    </HStack>\n  );\n};\n"],"names":["Fiat","fiatTotal","symbol","fiat","fiatColor","_jsxs","HStack","_jsx","Text"],"mappings":"+GAQa,MAAAA,EAAO,CAAC,CAAE,UAAAC,EAAW,OAAAC,CAAmB,IAAI,CACvD,MAAMC,EAAOF,EAAYA,EAAU,MAAM,GAAG,EAAI,CAAC,IAAK,IAAI,EACpDG,EAAYH,EAAY,eAAiB,gBAE/C,OACEI,OAACC,SAAO,CAAA,WAAW,aAAa,IAAK,EAAG,GAAI,EAAC,SAAA,CAC3CC,EAAAA,IAACC,UAAK,GAAE,CAAC,UAAWJ,EAAW,OAAQ,CAAE,WAAY,SAAS,WAC3DF,CAAM,CAAA,EAETG,EAAAA,KAACC,UAAO,WAAW,WAAW,IAAK,YACjCC,MAACC,EAAAA,QAAK,GAAE,CAAC,UAAWJ,EAAY,SAAAD,EAAK,CAAC,IACtCI,MAACC,EAAAA,QAAK,GAAG,CAAA,UAAWJ,EAAS,SAAG,IAAID,EAAK,CAAC,GAAK,IAAI,IAAa,CACzD,CAAA,CAAA,CAAA,CAAA,CAGf"}

package/dist/cjs/components/layouts/wallet-page/index.js

@@ -1,2 +0,0 @@
-"use strict";var e=require("react/jsx-runtime"),y=require("../../containers/modal.js"),g=require("../../sections/wallet-navigation.js"),a=require("@styled/jsx"),r=require("create-slots"),b=require("@styled/tokens"),x=require("./account-menu.js"),j=require("./actions.js"),p=require("./address.js"),v=require("./connection-menu.js"),q=require("./fiat.js");const S=r.createSlot(x.AccountMenu),M=r.createSlot(j.Actions),h=r.createSlot(p.Address),A=r.createSlot(v.ConnectionMenu),f=r.createSlot(({children:n})=>e.jsx(a.VStack,{w:"full",justify:"center",children:n})),w=r.createSlot(q.Fiat),P=r.createSlot(g.WalletNavigation),C=({children:n,...k})=>r.createHost(n,t=>{const s=t.getProps(S),c=t.getProps(M),o=t.getProps(h),i=t.getProps(A),l=t.getProps(w),u=t.getProps(P),m=`radial-gradient(circle at top, color-mix(in srgb, ${b.token("colors.text.primary")}, transparent 88%) 0%, transparent 25%)`,d=i||o||s;return e.jsxs(y.Modal,{...k,fullscreen:!0,paddingType:"none",gap:0,children:[e.jsxs(a.VStack,{h:"full",w:"full",style:d?{background:m}:{},children:[d&&e.jsxs(a.HStack,{justify:"space-between",px:4,w:"full",children:[i?e.jsx(v.ConnectionMenu,{...i}):e.jsx(a.Box,{h:10,w:10,m:1}),o&&e.jsx(p.Address,{...o}),s?e.jsx(x.AccountMenu,{...s}):e.jsx(a.Box,{h:10,w:10,m:1})]}),l&&e.jsx(q.Fiat,{...l}),c&&e.jsx(j.Actions,{...c}),t.get(f)]}),u&&e.jsx(g.WalletNavigation,{...u})]})}),N=Object.assign(C,{AccountMenu:S,Actions:M,Address:h,ConnectionMenu:A,Content:f,Fiat:w,Navigation:P});exports.WalletPage=N;
-//# sourceMappingURL=index.js.map

package/dist/cjs/components/layouts/wallet-page/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/layouts/wallet-page/index.tsx"],"sourcesContent":["import { Modal } from '@components/containers/modal';\nimport { WalletNavigation } from '@components/sections/wallet-navigation';\nimport { Box, HStack, VStack } from '@styled/jsx';\nimport { createHost, createSlot } from 'create-slots';\nimport { PropsWithChildren } from 'react';\n\nimport { token } from '@styled/tokens';\nimport { AccountMenu } from './account-menu';\nimport { Actions } from './actions';\nimport { Address } from './address';\nimport { ConnectionMenu } from './connection-menu';\nimport { Fiat } from './fiat';\n\nconst PageAccountMenu = createSlot(AccountMenu);\nconst PageActions = createSlot(Actions);\nconst PageAddress = createSlot(Address);\nconst PageConnectionMenu = createSlot(ConnectionMenu);\nconst PageContent = createSlot(({ children }) => (\n  <VStack w=\"full\" justify=\"center\">\n    {children}\n  </VStack>\n));\nconst PageFiat = createSlot(Fiat);\nconst PageNavigation = createSlot(WalletNavigation);\n\nexport interface WalletPageProps extends PropsWithChildren {}\n\nconst PageHost = ({ children, ...props }: WalletPageProps) => {\n  return createHost(children, slots => {\n    const accountProps = slots.getProps(PageAccountMenu);\n    const actionProps = slots.getProps(PageActions);\n    const addressProps = slots.getProps(PageAddress);\n    const connectionProps = slots.getProps(PageConnectionMenu);\n    const fiatProps = slots.getProps(PageFiat);\n    const navigationProps = slots.getProps(PageNavigation);\n\n    const background = `radial-gradient(circle at top, color-mix(in srgb, ${token('colors.text.primary')}, transparent 88%) 0%, transparent 25%)`;\n    const showHeader = connectionProps || addressProps || accountProps;\n\n    return (\n      <Modal {...props} fullscreen paddingType=\"none\" gap={0}>\n        <VStack h=\"full\" w=\"full\" style={showHeader ? { background } : {}}>\n          {showHeader && (\n            <HStack justify=\"space-between\" px={4} w=\"full\">\n              {connectionProps ? <ConnectionMenu {...connectionProps} /> : <Box h={10} w={10} m={1} />}\n              {addressProps && <Address {...addressProps} />}\n              {accountProps ? <AccountMenu {...accountProps} /> : <Box h={10} w={10} m={1} />}\n            </HStack>\n          )}\n          {fiatProps && <Fiat {...fiatProps} />}\n          {actionProps && <Actions {...actionProps} />}\n          {slots.get(PageContent)}\n        </VStack>\n        {navigationProps && <WalletNavigation {...navigationProps} />}\n      </Modal>\n    );\n  });\n};\n\nexport const WalletPage = Object.assign(PageHost, {\n  AccountMenu: PageAccountMenu,\n  Actions: PageActions,\n  Address: PageAddress,\n  ConnectionMenu: PageConnectionMenu,\n  Content: PageContent,\n  Fiat: PageFiat,\n  Navigation: PageNavigation,\n});\n"],"names":["PageAccountMenu","createSlot","AccountMenu","PageActions","Actions","PageAddress","Address","PageConnectionMenu","ConnectionMenu","PageContent","children","_jsx","VStack","PageFiat","Fiat","PageNavigation","WalletNavigation","PageHost","props","createHost","slots","accountProps","actionProps","addressProps","connectionProps","fiatProps","navigationProps","background","token","showHeader","_jsxs","Modal","HStack","Box","WalletPage"],"mappings":"mWAaA,MAAMA,EAAkBC,EAAAA,WAAWC,aAAW,EACxCC,EAAcF,EAAAA,WAAWG,EAAO,OAAA,EAChCC,EAAcJ,aAAWK,EAAAA,OAAO,EAChCC,EAAqBN,aAAWO,EAAAA,cAAc,EAC9CC,EAAcR,EAAAA,WAAW,CAAC,CAAE,SAAAS,CAAU,IAC1CC,MAACC,EAAAA,OAAM,CAAC,EAAE,OAAO,QAAQ,SAAQ,SAC9BF,CAAQ,CAAA,CAEZ,EACKG,EAAWZ,EAAAA,WAAWa,EAAI,IAAA,EAC1BC,EAAiBd,aAAWe,EAAAA,gBAAgB,EAI5CC,EAAW,CAAC,CAAE,SAAAP,EAAU,GAAGQ,CAAwB,IAChDC,EAAAA,WAAWT,EAAUU,GAAQ,CAClC,MAAMC,EAAeD,EAAM,SAASpB,CAAe,EAC7CsB,EAAcF,EAAM,SAASjB,CAAW,EACxCoB,EAAeH,EAAM,SAASf,CAAW,EACzCmB,EAAkBJ,EAAM,SAASb,CAAkB,EACnDkB,EAAYL,EAAM,SAASP,CAAQ,EACnCa,EAAkBN,EAAM,SAASL,CAAc,EAE/CY,EAAa,qDAAqDC,QAAM,qBAAqB,CAAC,0CAC9FC,EAAaL,GAAmBD,GAAgBF,EAEtD,OACES,EAAAA,KAACC,QAAU,CAAA,GAAAb,EAAO,WAAU,GAAC,YAAY,OAAO,IAAK,YACnDY,EAAAA,KAAClB,SAAO,CAAA,EAAE,OAAO,EAAE,OAAO,MAAOiB,EAAa,CAAE,WAAAF,GAAe,aAC5DE,GACCC,EAACE,KAAAA,EAAAA,OAAO,CAAA,QAAQ,gBAAgB,GAAI,EAAG,EAAE,OACtC,SAAA,CAAAR,EAAkBb,MAACH,EAAAA,mBAAmBgB,CAAe,CAAA,EAAOb,MAACsB,EAAAA,KAAI,EAAG,GAAI,EAAG,GAAI,EAAG,CAAC,CAAA,EACnFV,GAAgBZ,EAAAA,IAACL,EAAAA,YAAYiB,CAAY,CAAA,EACzCF,EAAeV,EAAAA,IAACT,kBAAgBmB,CAAY,CAAA,EAAOV,EAAAA,IAACsB,MAAI,CAAA,EAAG,GAAI,EAAG,GAAI,EAAG,GAAK,CACxE,CAAA,EAEVR,GAAad,MAACG,EAAAA,KAAS,CAAA,GAAAW,IACvBH,GAAeX,EAAAA,IAACP,EAAY,QAAA,CAAA,GAAAkB,CAAe,CAAA,EAC3CF,EAAM,IAAIX,CAAW,CAAC,CAChB,CAAA,EACRiB,GAAmBf,EAACK,IAAAA,mBAAgB,CAAA,GAAKU,CAAmB,CAAA,CAAA,CAAA,CAAA,CAGnE,CAAC,EAGUQ,EAAa,OAAO,OAAOjB,EAAU,CAChD,YAAajB,EACb,QAASG,EACT,QAASE,EACT,eAAgBE,EAChB,QAASE,EACT,KAAMI,EACN,WAAYE,CACb,CAAA"}

package/dist/cjs/components/sections/wallet-actions.js

@@ -1,2 +0,0 @@
-"use strict";var e=require("react/jsx-runtime"),j=require("../containers/button.js");require("../containers/card.js");var p=require("@styled/css"),i=require("@styled/jsx");require("@styled/tokens");var d=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"),x=require("react");require("../utils/client-asset-logo.js"),require("react-qrcode-logo"),require("../utils/secured-by-magic.js"),require("../containers/header.js"),require("../containers/menu.js"),require("../containers/modal.js"),require("../containers/overlay.js"),require("../feedback/callout.js"),require("../feedback/progress-bar.js"),require("../primitives/portal.js"),require("../../hooks/useToast.js"),require("../../recipes/toast.js");var b=require("../feedback/tooltip.js"),l=require("create-slots/list");const o=l.createSlot(({actionBox:a,children:s,disabledLabel:r,label:t,onPress:n})=>a?e.jsx(i.Center,{h:"76px",maxW:"115px",w:"full",opacity:r?.3:1,pointerEvents:r?"none":"initial",children:e.jsx(j.ButtonContainer,{className:p.css({_hover:{bgColor:"neutral.secondary"},bgColor:"neutral.tertiary",h:"100%"}),borderRadius:"0.75rem",expand:!0,onPress:n,children:e.jsxs(i.VStack,{gap:2,children:[x.cloneElement(x.Children.only(s),{height:20,width:20}),e.jsx(q.default,{size:"sm",styles:{fontWeight:500},children:t})]})})}):e.jsxs(i.VStack,{gap:1,minW:20,opacity:r?.3:1,pointerEvents:r?"none":"initial",children:[e.jsx(d.default,{variant:"neutral",size:"sm",onPress:n,"aria-label":"Buy",children:e.jsx(d.default.LeadingIcon,{children:s})}),e.jsx(q.default,{size:"sm",styles:{fontWeight:500},children:t})]})),h=({actionBox:a,children:s})=>e.jsx(i.Box,{w:"full",children:l.createHost(s,r=>e.jsx(i.HStack,{w:"full",justifyContent:"space-around",px:10,children:r.map(t=>{if(l.isSlot(t,o)){const{key:n,disabledLabel:u,...c}=l.getSlotProps(t);return u?e.jsx(b.default,{content:u,width:"max-content",children:e.jsx(i.Box,{children:e.jsx(o,{actionBox:a,disabledLabel:u,...c})})},n):e.jsx(o,{actionBox:a,...c},n)}})}))});h.Action=o,exports.WalletActions=h;
-//# sourceMappingURL=wallet-actions.js.map

package/dist/cjs/components/sections/wallet-actions.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"wallet-actions.js","sources":["../../../../src/components/sections/wallet-actions.tsx"],"sourcesContent":["import { ButtonContainer } from '@components/containers';\nimport { Tooltip } from '@components/feedback';\nimport { Button, Text } from '@components/primitives';\nimport { css } from '@styled/css';\nimport { Box, Center, HStack, VStack } from '@styled/jsx';\nimport { createHost, createSlot, getSlotProps, isSlot } from 'create-slots/list';\nimport { Children, cloneElement, PropsWithChildren, ReactElement } from 'react';\n\nexport interface ActionProps extends PropsWithChildren {\n  key?: string;\n  label: string;\n  onPress: () => void;\n  actionBox?: boolean;\n  disabledLabel?: string;\n}\n\nconst Action = createSlot(({ actionBox, children, disabledLabel, label, onPress }: ActionProps) => {\n  if (actionBox) {\n    return (\n      <Center\n        h=\"76px\"\n        maxW=\"115px\"\n        w=\"full\"\n        opacity={disabledLabel ? 0.3 : 1}\n        pointerEvents={disabledLabel ? 'none' : 'initial'}\n      >\n        <ButtonContainer\n          className={css({\n            _hover: { bgColor: 'neutral.secondary' },\n            bgColor: 'neutral.tertiary',\n            h: '100%',\n          })}\n          borderRadius=\"0.75rem\"\n          expand\n          onPress={onPress}\n        >\n          <VStack gap={2}>\n            {cloneElement(Children.only(children) as ReactElement, { height: 20, width: 20 })}\n            <Text size=\"sm\" styles={{ fontWeight: 500 }}>\n              {label}\n            </Text>\n          </VStack>\n        </ButtonContainer>\n      </Center>\n    );\n  }\n\n  return (\n    <VStack gap={1} minW={20} opacity={disabledLabel ? 0.3 : 1} pointerEvents={disabledLabel ? 'none' : 'initial'}>\n      <Button variant=\"neutral\" size=\"sm\" onPress={onPress} aria-label=\"Buy\">\n        <Button.LeadingIcon>{children}</Button.LeadingIcon>\n      </Button>\n      <Text size=\"sm\" styles={{ fontWeight: 500 }}>\n        {label}\n      </Text>\n    </VStack>\n  );\n});\n\nexport interface WalletActionsProps extends PropsWithChildren {\n  actionBox?: boolean;\n}\n\nexport const WalletActions = ({ actionBox, children }: WalletActionsProps) => (\n  <Box w=\"full\">\n    {createHost(children, slots => {\n      return (\n        <HStack w=\"full\" justifyContent=\"space-around\" px={10}>\n          {slots.map(slot => {\n            if (isSlot(slot, Action)) {\n              const { key, disabledLabel, ...slotProps } = getSlotProps(slot);\n\n              if (disabledLabel) {\n                return (\n                  <Tooltip key={key} content={disabledLabel} width=\"max-content\">\n                    <Box>\n                      <Action actionBox={actionBox} disabledLabel={disabledLabel} {...slotProps} />\n                    </Box>\n                  </Tooltip>\n                );\n              }\n              return <Action key={key} actionBox={actionBox} {...slotProps} />;\n            }\n          })}\n        </HStack>\n      );\n    })}\n  </Box>\n);\n\nWalletActions.Action = Action;\n"],"names":["Action","createSlot","actionBox","children","disabledLabel","label","onPress","_jsx","Center","ButtonContainer","css","_jsxs","VStack","cloneElement","Children","Text","Button","WalletActions","Box","createHost","slots","HStack","slot","isSlot","key","slotProps","getSlotProps","Tooltip"],"mappings":"mgCAgBA,MAAMA,EAASC,EAAAA,WAAW,CAAC,CAAE,UAAAC,EAAW,SAAAC,EAAU,cAAAC,EAAe,MAAAC,EAAO,QAAAC,CAAO,IACzEJ,EAEAK,EAAAA,IAACC,SAAM,CACL,EAAE,OACF,KAAK,QACL,EAAE,OACF,QAASJ,EAAgB,GAAM,EAC/B,cAAeA,EAAgB,OAAS,UAExC,SAAAG,MAACE,EAAAA,gBACC,CAAA,UAAWC,MAAI,CACb,OAAQ,CAAE,QAAS,mBAAqB,EACxC,QAAS,mBACT,EAAG,OACJ,EACD,aAAa,UACb,OAAM,GACN,QAASJ,EAAO,SAEhBK,EAAAA,KAACC,EAAAA,OAAO,CAAA,IAAK,EACV,SAAA,CAAAC,EAAaC,aAAAA,EAAAA,SAAS,KAAKX,CAAQ,EAAmB,CAAE,OAAQ,GAAI,MAAO,EAAI,CAAA,EAChFI,EAACQ,IAAAA,EAAAA,QAAI,CAAC,KAAK,KAAK,OAAQ,CAAE,WAAY,GAAK,EAAA,SACxCV,CAAK,CAAA,CACD,CACA,CAAA,CAAA,CAAA,CAEJ,CAAA,EAKXM,EAAAA,KAACC,EAAAA,OAAO,CAAA,IAAK,EAAG,KAAM,GAAI,QAASR,EAAgB,GAAM,EAAG,cAAeA,EAAgB,OAAS,UAClG,SAAA,CAAAG,EAAAA,IAACS,EAAAA,QAAO,CAAA,QAAQ,UAAU,KAAK,KAAK,QAASV,EAAoB,aAAA,eAC/DC,MAACS,UAAO,YAAW,CAAA,SAAEb,CAA8B,CAAA,CAAA,CAAA,EAErDI,EAAAA,IAACQ,EAAK,QAAA,CAAA,KAAK,KAAK,OAAQ,CAAE,WAAY,GAAK,EAAA,SACxCV,CACI,CAAA,CAAA,CAAA,CAAA,CAGZ,EAMYY,EAAgB,CAAC,CAAE,UAAAf,EAAW,SAAAC,CAA8B,IACvEI,MAACW,EAAAA,IAAG,CAAC,EAAE,OAAM,SACVC,EAAAA,WAAWhB,EAAUiB,GAElBb,MAACc,EAAAA,OAAM,CAAC,EAAE,OAAO,eAAe,eAAe,GAAI,GAChD,SAAAD,EAAM,IAAIE,GAAO,CAChB,GAAIC,SAAOD,EAAMtB,CAAM,EAAG,CACxB,KAAM,CAAE,IAAAwB,EAAK,cAAApB,EAAe,GAAGqB,CAAS,EAAKC,EAAaJ,aAAAA,CAAI,EAE9D,OAAIlB,EAEAG,MAACoB,EAAAA,QAAO,CAAW,QAASvB,EAAe,MAAM,cAC/C,SAAAG,EAACW,IAAAA,EAAAA,IACC,CAAA,SAAAX,EAACP,IAAAA,EAAM,CAAC,UAAWE,EAAW,cAAeE,EAAmB,GAAAqB,GAC5D,CAAA,CAAA,EAHMD,CAAG,EAOdjB,EAAAA,IAACP,EAAM,CAAW,UAAWE,EAAS,GAAMuB,CAAS,EAAxCD,CAAG,CACzB,CACF,CAAC,CACM,CAAA,CAEZ,CACG,CAAA,EAGRP,EAAc,OAASjB"}

package/dist/cjs/components/sections/wallet-navigation.js

@@ -1,2 +0,0 @@
-"use strict";var r=require("react/jsx-runtime"),x=require("@styled/tokens"),y=require("../icons/ico-clock-fill.js"),q=require("../icons/ico-grid-fill.js"),g=require("../icons/ico-home-fill.js"),m=require("../icons/ico-settings-fill.js");require("react");var o=require("@styled/jsx"),b=require("@styled/css");require("../feedback/callout.js"),require("../feedback/progress-bar.js");var d=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"),require("../primitives/text.js"),require("../primitives/portal.js"),require("../../hooks/useToast.js"),require("../../recipes/toast.js");var h=require("../feedback/tooltip.js");const v={Home:g.default,Gallery:q.default,Activity:y.default,Settings:m.default};exports.WalletNavigationType=void 0,function(e){e.Home="home",e.Gallery="gallery",e.Activity="activity",e.Settings="settings"}(exports.WalletNavigationType||(exports.WalletNavigationType={}));const j=({active:e,children:i,label:t,onPress:a})=>r.jsx(o.Box,{pointerEvents:e===t?"none":"initial",children:r.jsx(d.default,{variant:"text",onPress:a,children:r.jsx(d.default.LeadingIcon,{className:b.css({color:e===t?"text.primary":"text.tertiary",_groupHover:{color:e===t?"text.primary":"text.secondary"}}),children:i})})}),f=(e,i)=>e[i],N=({active:e=exports.WalletNavigationType.Home,disabled:i=[],...t})=>r.jsx(o.Center,{bottom:0,pos:"fixed",h:"6.25rem",w:"full",style:{background:`linear-gradient(180deg, transparent 0%, ${x.token("colors.surface.primary")} 100%)`},children:r.jsx(o.HStack,{bg:"text.primary/6",borderColor:"text.primary/10",borderWidth:"medium",borderStyle:"solid",borderRadius:52,backdropFilter:"blur(24px)",p:1.5,children:Object.keys(exports.WalletNavigationType).map(a=>{var n;const l=exports.WalletNavigationType[a],s=(n=i.find(p=>p.type===l))===null||n===void 0?void 0:n.label,c=v[a],u=f(t,`on${a}`);return u?s?r.jsx(h.default,{content:s,width:"max-content",children:r.jsx(o.Box,{border:"thin solid transparent",opacity:.3,p:1.5,children:r.jsx(c,{})})},l):r.jsx(j,{active:e,label:l,onPress:u,children:r.jsx(c,{})},l):null})})});exports.WalletNavigation=N,exports.WalletNavigationIcons=v;
-//# sourceMappingURL=wallet-navigation.js.map