From 6e03a12c4da9de551b0e2f08fd97cd7172685ec6 Mon Sep 17 00:00:00 2001
From: Rickard Andersson <gonz@severnatazvezda.com>
Date: Fri, 4 Aug 2023 12:18:37 +0300
Subject: [PATCH] feat: add `@status-im/components` library

---
 package.json |   2 +
 src/App.tsx  |  39 ++---
 yarn.lock    | 441 ++++++++++++++++++++++++++++++++++++++++++++++++++-
 3 files changed, 458 insertions(+), 24 deletions(-)

diff --git a/package.json b/package.json
index 4a655019..2d130157 100644
--- a/package.json
+++ b/package.json
@@ -17,6 +17,7 @@
     "react-dom": "18"
   },
   "dependencies": {
+    "@status-im/components": "^0.2.6",
     "@status-im/react": "^0.1.1",
     "@tamagui/config": "1.36.4",
     "@tamagui/react-17-patch": "1.36.4",
@@ -25,6 +26,7 @@
     "@types/react-dom": "18",
     "react": "18",
     "react-dom": "18",
+    "react-native-svg": "^13.10.0",
     "tamagui": "1.36.4"
   },
   "devDependencies": {
diff --git a/src/App.tsx b/src/App.tsx
index 78cbc8ba..c7fa6138 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -3,7 +3,7 @@ import reactLogo from './assets/react.svg'
 import viteLogo from '/vite.svg'
 import { Button, TamaguiProvider } from 'tamagui'
 import './App.css'
-import '@tamagui/react-17-patch'
+import { Button as StatusButton, Provider as StatusProvider } from '@status-im/components'
 
 import config from '../tamagui.config'
 
@@ -12,23 +12,26 @@ function App() {
 
   return (
     <TamaguiProvider config={config}>
-      <Button size="$6">LEL</Button>
-      <div>
-        <a href="https://vitejs.dev" target="_blank">
-          <img src={viteLogo} className="logo" alt="Vite logo" />
-        </a>
-        <a href="https://react.dev" target="_blank">
-          <img src={reactLogo} className="logo react" alt="React logo" />
-        </a>
-      </div>
-      <h1>Vite + React</h1>
-      <div className="card">
-        <button onClick={() => setCount(count => count + 1)}>count is {count}</button>
-        <p>
-          Edit <code>src/App.tsx</code> and save to test HMR
-        </p>
-      </div>
-      <p className="read-the-docs">Click on the Vite and React logos to learn more</p>
+      <StatusProvider>
+        <Button size="$6">Tamagui LEL</Button>
+        <StatusButton>Status LEL</StatusButton>
+        <div>
+          <a href="https://vitejs.dev" target="_blank">
+            <img src={viteLogo} className="logo" alt="Vite logo" />
+          </a>
+          <a href="https://react.dev" target="_blank">
+            <img src={reactLogo} className="logo react" alt="React logo" />
+          </a>
+        </div>
+        <h1>Vite + React</h1>
+        <div className="card">
+          <button onClick={() => setCount(count => count + 1)}>count is {count}</button>
+          <p>
+            Edit <code>src/App.tsx</code> and save to test HMR
+          </p>
+        </div>
+        <p className="read-the-docs">Click on the Vite and React logos to learn more</p>
+      </StatusProvider>
     </TamaguiProvider>
   )
 }
diff --git a/yarn.lock b/yarn.lock
index 71635093..0fcc1613 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3532,6 +3532,34 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@radix-ui/react-accordion@npm:^1.1.1":
+  version: 1.1.2
+  resolution: "@radix-ui/react-accordion@npm:1.1.2"
+  dependencies:
+    "@babel/runtime": ^7.13.10
+    "@radix-ui/primitive": 1.0.1
+    "@radix-ui/react-collapsible": 1.0.3
+    "@radix-ui/react-collection": 1.0.3
+    "@radix-ui/react-compose-refs": 1.0.1
+    "@radix-ui/react-context": 1.0.1
+    "@radix-ui/react-direction": 1.0.1
+    "@radix-ui/react-id": 1.0.1
+    "@radix-ui/react-primitive": 1.0.3
+    "@radix-ui/react-use-controllable-state": 1.0.1
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0
+    react-dom: ^16.8 || ^17.0 || ^18.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: ac8587c705bb723328399eb8759ebc188aa500a6e1884d7b63cbd9e98e8607e7373c4517b2e4c093a08477129be57259e740b465b963f30df63a4e0dadaee09d
+  languageName: node
+  linkType: hard
+
 "@radix-ui/react-alert-dialog@npm:^0.1.7":
   version: 0.1.7
   resolution: "@radix-ui/react-alert-dialog@npm:0.1.7"
@@ -3602,6 +3630,60 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@radix-ui/react-checkbox@npm:^1.0.4":
+  version: 1.0.4
+  resolution: "@radix-ui/react-checkbox@npm:1.0.4"
+  dependencies:
+    "@babel/runtime": ^7.13.10
+    "@radix-ui/primitive": 1.0.1
+    "@radix-ui/react-compose-refs": 1.0.1
+    "@radix-ui/react-context": 1.0.1
+    "@radix-ui/react-presence": 1.0.1
+    "@radix-ui/react-primitive": 1.0.3
+    "@radix-ui/react-use-controllable-state": 1.0.1
+    "@radix-ui/react-use-previous": 1.0.1
+    "@radix-ui/react-use-size": 1.0.1
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0
+    react-dom: ^16.8 || ^17.0 || ^18.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 6dac5bddd9e1c42b149555501440918d9eae70da13b6d8539c3bf46b6c07681119d865d2106a43f729884ae8e2043bedc34c4d00a09a527b3bf0feade088d188
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-collapsible@npm:1.0.3":
+  version: 1.0.3
+  resolution: "@radix-ui/react-collapsible@npm:1.0.3"
+  dependencies:
+    "@babel/runtime": ^7.13.10
+    "@radix-ui/primitive": 1.0.1
+    "@radix-ui/react-compose-refs": 1.0.1
+    "@radix-ui/react-context": 1.0.1
+    "@radix-ui/react-id": 1.0.1
+    "@radix-ui/react-presence": 1.0.1
+    "@radix-ui/react-primitive": 1.0.3
+    "@radix-ui/react-use-controllable-state": 1.0.1
+    "@radix-ui/react-use-layout-effect": 1.0.1
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0
+    react-dom: ^16.8 || ^17.0 || ^18.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 26976e4a72a3e0f4b2c62af2898b3e205c3652af46a3b41cda9a43567fe8381d9ef6afb0b29e3214c450b847f4f2099a533cffc5045844ecab290e9fa6114ca9
+  languageName: node
+  linkType: hard
+
 "@radix-ui/react-collapsible@npm:^0.1.6":
   version: 0.1.6
   resolution: "@radix-ui/react-collapsible@npm:0.1.6"
@@ -3754,6 +3836,39 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@radix-ui/react-dialog@npm:^1.0.3":
+  version: 1.0.4
+  resolution: "@radix-ui/react-dialog@npm:1.0.4"
+  dependencies:
+    "@babel/runtime": ^7.13.10
+    "@radix-ui/primitive": 1.0.1
+    "@radix-ui/react-compose-refs": 1.0.1
+    "@radix-ui/react-context": 1.0.1
+    "@radix-ui/react-dismissable-layer": 1.0.4
+    "@radix-ui/react-focus-guards": 1.0.1
+    "@radix-ui/react-focus-scope": 1.0.3
+    "@radix-ui/react-id": 1.0.1
+    "@radix-ui/react-portal": 1.0.3
+    "@radix-ui/react-presence": 1.0.1
+    "@radix-ui/react-primitive": 1.0.3
+    "@radix-ui/react-slot": 1.0.2
+    "@radix-ui/react-use-controllable-state": 1.0.1
+    aria-hidden: ^1.1.1
+    react-remove-scroll: 2.5.5
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0
+    react-dom: ^16.8 || ^17.0 || ^18.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 01ad549a3685e221628950e6fbec306494170aa3b92cbe00732b1531c16e1cf681138cd4a79d658f4f97d4096676a40d08642090fdea1675d0b7dc78df66d962
+  languageName: node
+  linkType: hard
+
 "@radix-ui/react-direction@npm:1.0.1":
   version: 1.0.1
   resolution: "@radix-ui/react-direction@npm:1.0.1"
@@ -3829,6 +3944,32 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@radix-ui/react-dropdown-menu@npm:^2.0.4":
+  version: 2.0.5
+  resolution: "@radix-ui/react-dropdown-menu@npm:2.0.5"
+  dependencies:
+    "@babel/runtime": ^7.13.10
+    "@radix-ui/primitive": 1.0.1
+    "@radix-ui/react-compose-refs": 1.0.1
+    "@radix-ui/react-context": 1.0.1
+    "@radix-ui/react-id": 1.0.1
+    "@radix-ui/react-menu": 2.0.5
+    "@radix-ui/react-primitive": 1.0.3
+    "@radix-ui/react-use-controllable-state": 1.0.1
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0
+    react-dom: ^16.8 || ^17.0 || ^18.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 42fd72f243a5246ba906c9f26e65149493e6bf7bd07fbc91ad31dbddb831e1b8b71a57808681b9efc641cb58918e8f8ae10ced83b283b7722ad88fb9a3b2b168
+  languageName: node
+  linkType: hard
+
 "@radix-ui/react-focus-guards@npm:0.1.0":
   version: 0.1.0
   resolution: "@radix-ui/react-focus-guards@npm:0.1.0"
@@ -3963,6 +4104,43 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@radix-ui/react-menu@npm:2.0.5":
+  version: 2.0.5
+  resolution: "@radix-ui/react-menu@npm:2.0.5"
+  dependencies:
+    "@babel/runtime": ^7.13.10
+    "@radix-ui/primitive": 1.0.1
+    "@radix-ui/react-collection": 1.0.3
+    "@radix-ui/react-compose-refs": 1.0.1
+    "@radix-ui/react-context": 1.0.1
+    "@radix-ui/react-direction": 1.0.1
+    "@radix-ui/react-dismissable-layer": 1.0.4
+    "@radix-ui/react-focus-guards": 1.0.1
+    "@radix-ui/react-focus-scope": 1.0.3
+    "@radix-ui/react-id": 1.0.1
+    "@radix-ui/react-popper": 1.1.2
+    "@radix-ui/react-portal": 1.0.3
+    "@radix-ui/react-presence": 1.0.1
+    "@radix-ui/react-primitive": 1.0.3
+    "@radix-ui/react-roving-focus": 1.0.4
+    "@radix-ui/react-slot": 1.0.2
+    "@radix-ui/react-use-callback-ref": 1.0.1
+    aria-hidden: ^1.1.1
+    react-remove-scroll: 2.5.5
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0
+    react-dom: ^16.8 || ^17.0 || ^18.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 938623497ffa4dc5290e572dc80bd0b36af910adfe15632290b6e081543e9a7158db954ccced0c9ab0f68bac512dfb772c057a55ece0e1d1e20633cd21057afe
+  languageName: node
+  linkType: hard
+
 "@radix-ui/react-popover@npm:^0.1.6":
   version: 0.1.6
   resolution: "@radix-ui/react-popover@npm:0.1.6"
@@ -3989,6 +4167,40 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@radix-ui/react-popover@npm:^1.0.5":
+  version: 1.0.6
+  resolution: "@radix-ui/react-popover@npm:1.0.6"
+  dependencies:
+    "@babel/runtime": ^7.13.10
+    "@radix-ui/primitive": 1.0.1
+    "@radix-ui/react-compose-refs": 1.0.1
+    "@radix-ui/react-context": 1.0.1
+    "@radix-ui/react-dismissable-layer": 1.0.4
+    "@radix-ui/react-focus-guards": 1.0.1
+    "@radix-ui/react-focus-scope": 1.0.3
+    "@radix-ui/react-id": 1.0.1
+    "@radix-ui/react-popper": 1.1.2
+    "@radix-ui/react-portal": 1.0.3
+    "@radix-ui/react-presence": 1.0.1
+    "@radix-ui/react-primitive": 1.0.3
+    "@radix-ui/react-slot": 1.0.2
+    "@radix-ui/react-use-controllable-state": 1.0.1
+    aria-hidden: ^1.1.1
+    react-remove-scroll: 2.5.5
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0
+    react-dom: ^16.8 || ^17.0 || ^18.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: fbe4264d0f943d8be1a3ea2fce161f8031fdee72756aaf16251910e62de5030ae81a40e691f2cd65bf3a53d4ecc19c001b87be61d7aef5cc474da81d2d7e964d
+  languageName: node
+  linkType: hard
+
 "@radix-ui/react-popper@npm:0.1.4":
   version: 0.1.4
   resolution: "@radix-ui/react-popper@npm:0.1.4"
@@ -4264,7 +4476,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@radix-ui/react-tabs@npm:^1.0.0":
+"@radix-ui/react-tabs@npm:^1.0.0, @radix-ui/react-tabs@npm:^1.0.3":
   version: 1.0.4
   resolution: "@radix-ui/react-tabs@npm:1.0.4"
   dependencies:
@@ -4314,6 +4526,37 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@radix-ui/react-toast@npm:^1.1.3":
+  version: 1.1.4
+  resolution: "@radix-ui/react-toast@npm:1.1.4"
+  dependencies:
+    "@babel/runtime": ^7.13.10
+    "@radix-ui/primitive": 1.0.1
+    "@radix-ui/react-collection": 1.0.3
+    "@radix-ui/react-compose-refs": 1.0.1
+    "@radix-ui/react-context": 1.0.1
+    "@radix-ui/react-dismissable-layer": 1.0.4
+    "@radix-ui/react-portal": 1.0.3
+    "@radix-ui/react-presence": 1.0.1
+    "@radix-ui/react-primitive": 1.0.3
+    "@radix-ui/react-use-callback-ref": 1.0.1
+    "@radix-ui/react-use-controllable-state": 1.0.1
+    "@radix-ui/react-use-layout-effect": 1.0.1
+    "@radix-ui/react-visually-hidden": 1.0.3
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0
+    react-dom: ^16.8 || ^17.0 || ^18.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: b79a8c2440151670be3f5134c2cf818b44582a33cf71c65462cd22a9107684a1c67d9f96819aa92e20cc7495aec7119787997d5ac6695d1e8d07105a6756577e
+  languageName: node
+  linkType: hard
+
 "@radix-ui/react-toggle-group@npm:^0.1.5":
   version: 0.1.5
   resolution: "@radix-ui/react-toggle-group@npm:0.1.5"
@@ -4345,7 +4588,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@radix-ui/react-tooltip@npm:^1.0.0":
+"@radix-ui/react-tooltip@npm:^1.0.0, @radix-ui/react-tooltip@npm:^1.0.5":
   version: 1.0.6
   resolution: "@radix-ui/react-tooltip@npm:1.0.6"
   dependencies:
@@ -4978,6 +5221,62 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@status-im/colors@npm:*":
+  version: 0.2.0
+  resolution: "@status-im/colors@npm:0.2.0"
+  checksum: 06390b83897193489f14b0e4fe371e87f30056b1c1d6ef9a14b0fe8dc068453e6b532a767077537eebc39f8fcedb832eb047c7f5e6f479683394152f115be3db
+  languageName: node
+  linkType: hard
+
+"@status-im/components@npm:^0.2.6":
+  version: 0.2.6
+  resolution: "@status-im/components@npm:0.2.6"
+  dependencies:
+    "@radix-ui/react-accordion": ^1.1.1
+    "@radix-ui/react-checkbox": ^1.0.4
+    "@radix-ui/react-dialog": ^1.0.3
+    "@radix-ui/react-dropdown-menu": ^2.0.4
+    "@radix-ui/react-popover": ^1.0.5
+    "@radix-ui/react-tabs": ^1.0.3
+    "@radix-ui/react-toast": ^1.1.3
+    "@radix-ui/react-tooltip": ^1.0.5
+    "@status-im/colors": "*"
+    "@status-im/icons": "*"
+    "@tamagui/animations-css": 1.36.4
+    "@tamagui/animations-react-native": 1.36.4
+    "@tamagui/core": 1.36.4
+    "@tamagui/font-inter": 1.36.4
+    "@tamagui/react-native-media-driver": 1.36.4
+    "@tamagui/shorthands": 1.36.4
+    "@tamagui/theme-base": 1.36.4
+    "@tamagui/web": 1.36.4
+    date-fns: ^2.30.0
+    expo-blur: ^12.2.2
+    expo-linear-gradient: ^12.1.2
+    react-day-picker: ^8.7.1
+    tamagui: 1.36.4
+    zustand: ^4.3.7
+  peerDependencies:
+    react: ^18.2.0
+  checksum: b83b11b33d12a213a2d228e27a7706912910f12eb4d376e92eafea084ec22b09764c10dde17c39ef7da86a8fe82ad1635d1ccaa037381e86040ece2448e0cd29
+  languageName: node
+  linkType: hard
+
+"@status-im/icons@npm:*":
+  version: 0.2.2
+  resolution: "@status-im/icons@npm:0.2.2"
+  dependencies:
+    "@tamagui/core": 1.36.4
+    "@tamagui/web": 1.36.4
+    tamagui: 1.36.4
+  peerDependencies:
+    react: ^16.x || ^17.x || ^18.x
+    react-dom: "*"
+    react-native-svg: ">=12"
+  checksum: 2e267fc392bb62eb4c0fc1c7391f320df76e6d5ae9010b09b652cb6b7d94b1e042ca2cdf00501580597829b4d184d52ad71be73d26506a6641fc244afffa9183
+  languageName: node
+  linkType: hard
+
 "@status-im/js@npm:0.1.1":
   version: 0.1.1
   resolution: "@status-im/js@npm:0.1.1"
@@ -6555,6 +6854,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@tamagui/create-themes@npm:1.36.4":
+  version: 1.36.4
+  resolution: "@tamagui/create-themes@npm:1.36.4"
+  dependencies:
+    "@tamagui/core": 1.36.4
+  checksum: 21417afb165efb60849081942718fc27b47120b6298caad79289c8505d0dbd3087e0efbc1bf21fa96ce987b1b49ce3752f4305a42e8de35967bf93fcf386ab18
+  languageName: node
+  linkType: hard
+
 "@tamagui/cubic-bezier-animator@npm:1.36.4":
   version: 1.36.4
   resolution: "@tamagui/cubic-bezier-animator@npm:1.36.4"
@@ -7258,6 +7566,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@tamagui/theme-base@npm:1.36.4":
+  version: 1.36.4
+  resolution: "@tamagui/theme-base@npm:1.36.4"
+  dependencies:
+    "@tamagui/colors": 1.36.4
+    "@tamagui/core": 1.36.4
+    "@tamagui/create-themes": 1.36.4
+  checksum: b9d49c5099eedc7df8ec87352463b96ace19fbe0f80004c3763cf64ec0f861db2b76838aa44edd639cafadc6312bcf94cdfa91112ca8cd08f70fb1bc331d18d0
+  languageName: node
+  linkType: hard
+
 "@tamagui/theme@npm:1.36.4":
   version: 1.36.4
   resolution: "@tamagui/theme@npm:1.36.4"
@@ -9641,6 +9960,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"css-select@npm:^5.1.0":
+  version: 5.1.0
+  resolution: "css-select@npm:5.1.0"
+  dependencies:
+    boolbase: ^1.0.0
+    css-what: ^6.1.0
+    domhandler: ^5.0.2
+    domutils: ^3.0.1
+    nth-check: ^2.0.1
+  checksum: 2772c049b188d3b8a8159907192e926e11824aea525b8282981f72ba3f349cf9ecd523fdf7734875ee2cb772246c22117fc062da105b6d59afe8dcd5c99c9bda
+  languageName: node
+  linkType: hard
+
 "css-tree@npm:1.0.0-alpha.37":
   version: 1.0.0-alpha.37
   resolution: "css-tree@npm:1.0.0-alpha.37"
@@ -9651,7 +9983,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"css-tree@npm:^1.1.2":
+"css-tree@npm:^1.1.2, css-tree@npm:^1.1.3":
   version: 1.1.3
   resolution: "css-tree@npm:1.1.3"
   dependencies:
@@ -9668,6 +10000,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"css-what@npm:^6.1.0":
+  version: 6.1.0
+  resolution: "css-what@npm:6.1.0"
+  checksum: b975e547e1e90b79625918f84e67db5d33d896e6de846c9b584094e529f0c63e2ab85ee33b9daffd05bff3a146a1916bec664e18bb76dd5f66cbff9fc13b2bbe
+  languageName: node
+  linkType: hard
+
 "csso@npm:^4.0.2":
   version: 4.2.0
   resolution: "csso@npm:4.2.0"
@@ -9714,7 +10053,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"date-fns@npm:^2.29.3":
+"date-fns@npm:^2.29.3, date-fns@npm:^2.30.0":
   version: 2.30.0
   resolution: "date-fns@npm:2.30.0"
   dependencies:
@@ -10047,6 +10386,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"dom-serializer@npm:^2.0.0":
+  version: 2.0.0
+  resolution: "dom-serializer@npm:2.0.0"
+  dependencies:
+    domelementtype: ^2.3.0
+    domhandler: ^5.0.2
+    entities: ^4.2.0
+  checksum: cd1810544fd8cdfbd51fa2c0c1128ec3a13ba92f14e61b7650b5de421b88205fd2e3f0cc6ace82f13334114addb90ed1c2f23074a51770a8e9c1273acbc7f3e6
+  languageName: node
+  linkType: hard
+
 "domelementtype@npm:1, domelementtype@npm:^1.3.1":
   version: 1.3.1
   resolution: "domelementtype@npm:1.3.1"
@@ -10054,7 +10404,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"domelementtype@npm:^2.0.1":
+"domelementtype@npm:^2.0.1, domelementtype@npm:^2.3.0":
   version: 2.3.0
   resolution: "domelementtype@npm:2.3.0"
   checksum: ee837a318ff702622f383409d1f5b25dd1024b692ef64d3096ff702e26339f8e345820f29a68bcdcea8cfee3531776b3382651232fbeae95612d6f0a75efb4f6
@@ -10070,6 +10420,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"domhandler@npm:^5.0.2, domhandler@npm:^5.0.3":
+  version: 5.0.3
+  resolution: "domhandler@npm:5.0.3"
+  dependencies:
+    domelementtype: ^2.3.0
+  checksum: 0f58f4a6af63e6f3a4320aa446d28b5790a009018707bce2859dcb1d21144c7876482b5188395a188dfa974238c019e0a1e610d2fc269a12b2c192ea2b0b131c
+  languageName: node
+  linkType: hard
+
 "domutils@npm:^1.5.1, domutils@npm:^1.7.0":
   version: 1.7.0
   resolution: "domutils@npm:1.7.0"
@@ -10080,6 +10439,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"domutils@npm:^3.0.1":
+  version: 3.1.0
+  resolution: "domutils@npm:3.1.0"
+  dependencies:
+    dom-serializer: ^2.0.0
+    domelementtype: ^2.3.0
+    domhandler: ^5.0.3
+  checksum: e5757456ddd173caa411cfc02c2bb64133c65546d2c4081381a3bafc8a57411a41eed70494551aa58030be9e58574fcc489828bebd673863d39924fb4878f416
+  languageName: node
+  linkType: hard
+
 "dotenv-expand@npm:^10.0.0":
   version: 10.0.0
   resolution: "dotenv-expand@npm:10.0.0"
@@ -10217,6 +10587,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"entities@npm:^4.2.0":
+  version: 4.5.0
+  resolution: "entities@npm:4.5.0"
+  checksum: 853f8ebd5b425d350bffa97dd6958143179a5938352ccae092c62d1267c4e392a039be1bae7d51b6e4ffad25f51f9617531fedf5237f15df302ccfb452cbf2d7
+  languageName: node
+  linkType: hard
+
 "env-paths@npm:^2.2.0":
   version: 2.2.1
   resolution: "env-paths@npm:2.2.1"
@@ -10896,6 +11273,24 @@ __metadata:
   languageName: node
   linkType: hard
 
+"expo-blur@npm:^12.2.2":
+  version: 12.5.0
+  resolution: "expo-blur@npm:12.5.0"
+  peerDependencies:
+    expo: "*"
+  checksum: eaf362df817b0fd6a3a1041c7ff10bef0240d42724df7d49e851d4686d241eedddcac824a8b03e14441040c017d9be0b905eb570faf0336674696ae879003d14
+  languageName: node
+  linkType: hard
+
+"expo-linear-gradient@npm:^12.1.2":
+  version: 12.4.0
+  resolution: "expo-linear-gradient@npm:12.4.0"
+  peerDependencies:
+    expo: "*"
+  checksum: 23af7dd46b67c7341da55e76efeeae80d8836df1056503c2eaff80ef03f0080a8171e755c23e34b55bd17f13d5d83faccec69ddc509e6e2e621851d2073895ab
+  languageName: node
+  linkType: hard
+
 "exponential-backoff@npm:^3.1.1":
   version: 3.1.1
   resolution: "exponential-backoff@npm:3.1.1"
@@ -14690,6 +15085,7 @@ __metadata:
   resolution: "nimbus-gui@workspace:."
   dependencies:
     "@fsouza/prettierd": ^0.24.2
+    "@status-im/components": ^0.2.6
     "@status-im/react": ^0.1.1
     "@storybook/addon-essentials": ^7.2.0
     "@storybook/addon-interactions": ^7.2.0
@@ -14716,6 +15112,7 @@ __metadata:
     prettier: ^3.0.1
     react: 18
     react-dom: 18
+    react-native-svg: ^13.10.0
     storybook: ^7.2.0
     tamagui: 1.36.4
     typescript: ^5.0.2
@@ -14880,6 +15277,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"nth-check@npm:^2.0.1":
+  version: 2.1.1
+  resolution: "nth-check@npm:2.1.1"
+  dependencies:
+    boolbase: ^1.0.0
+  checksum: 5afc3dafcd1573b08877ca8e6148c52abd565f1d06b1eb08caf982e3fa289a82f2cae697ffb55b5021e146d60443f1590a5d6b944844e944714a5b549675bcd3
+  languageName: node
+  linkType: hard
+
 "nullthrows@npm:^1.1.1":
   version: 1.1.1
   resolution: "nullthrows@npm:1.1.1"
@@ -15964,6 +16370,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-day-picker@npm:^8.7.1":
+  version: 8.8.0
+  resolution: "react-day-picker@npm:8.8.0"
+  peerDependencies:
+    date-fns: ^2.28.0
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0
+  checksum: c104b4ae44bad44183f6a273327aa1d00d23afe6f3860f8335eea2d06c0f64ea015ea7438655c79a5024a8db259ba5fa9431dbf92f03889120d0c2c00a28117f
+  languageName: node
+  linkType: hard
+
 "react-docgen-typescript@npm:^2.2.2":
   version: 2.2.2
   resolution: "react-docgen-typescript@npm:2.2.2"
@@ -16056,6 +16472,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-native-svg@npm:^13.10.0":
+  version: 13.10.0
+  resolution: "react-native-svg@npm:13.10.0"
+  dependencies:
+    css-select: ^5.1.0
+    css-tree: ^1.1.3
+  peerDependencies:
+    react: "*"
+    react-native: "*"
+  checksum: 5b71a69f779eb0c8139b716f76736a798c99d85cd5f1741bdc54cf46bfc032505df7b81a92c76859d09317fe5787dc31aabee8a79e67db083442d00af1600f26
+  languageName: node
+  linkType: hard
+
 "react-native-web-internals@npm:1.36.4":
   version: 1.36.4
   resolution: "react-native-web-internals@npm:1.36.4"
@@ -18749,7 +19178,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"zustand@npm:^4.3.3":
+"zustand@npm:^4.3.3, zustand@npm:^4.3.7":
   version: 4.4.0
   resolution: "zustand@npm:4.4.0"
   dependencies: