@cofhe/react 0.2.0 → 0.3.0

package/dist/styles.css

@@ -100,9 +100,8 @@
 .fnx-token-list-container {
   display: flex;
   flex-direction: column;
-  gap: 0.25rem;
-  max-height: var(--fnx-token-list-max-height);
-  overflow-y: auto;
+  gap: 0.5rem;
+  padding: 0.25rem;
 }
 /* Loading dots animation */
 .fnx-loading-dots {
@@ -847,15 +846,15 @@ video {
 .mt-3 {
   margin-top: 0.75rem;
 }
-.mt-4 {
-  margin-top: 1rem;
-}
 .mt-auto {
   margin-top: auto;
 }
 .block {
   display: block;
 }
+.inline-block {
+  display: inline-block;
+}
 .flex {
   display: flex;
 }
@@ -868,10 +867,6 @@ video {
 .hidden {
   display: none;
 }
-.size-3 {
-  width: 0.75rem;
-  height: 0.75rem;
-}
 .size-5 {
   width: 1.25rem;
   height: 1.25rem;
@@ -912,9 +907,6 @@ video {
 .h-full {
   height: 100%;
 }
-.max-h-60 {
-  max-height: 15rem;
-}
 .max-h-64 {
   max-height: 16rem;
 }
@@ -1028,6 +1020,11 @@ video {
 .cursor-pointer {
   cursor: pointer;
 }
+.select-none {
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
 .appearance-none {
   -webkit-appearance: none;
      -moz-appearance: none;
@@ -1111,11 +1108,6 @@ video {
   margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
   margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
 }
-.space-y-5 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
-}
 .self-start {
   align-self: flex-start;
 }
@@ -1148,9 +1140,6 @@ video {
 .rounded {
   border-radius: 0.25rem;
 }
-.rounded-2xl {
-  border-radius: 1rem;
-}
 .rounded-full {
   border-radius: 9999px;
 }
@@ -1183,10 +1172,6 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(6 133 113 / var(--tw-border-opacity, 1));
 }
-.border-\[\#0E2F3F\] {
-  --tw-border-opacity: 1;
-  border-color: rgb(14 47 63 / var(--tw-border-opacity, 1));
-}
 .border-\[\#0E2F3F\]\/15 {
   border-color: rgb(14 47 63 / 0.15);
 }
@@ -1196,10 +1181,6 @@ video {
 .border-\[\#0E2F3F\]\/40 {
   border-color: rgb(14 47 63 / 0.4);
 }
-.border-\[\#154054\] {
-  --tw-border-opacity: 1;
-  border-color: rgb(21 64 84 / var(--tw-border-opacity, 1));
-}
 .border-\[\#247AFF\] {
   --tw-border-opacity: 1;
   border-color: rgb(36 122 255 / var(--tw-border-opacity, 1));
@@ -1208,10 +1189,6 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(102 102 102 / var(--tw-border-opacity, 1));
 }
-.border-\[\#68D8EB\] {
-  --tw-border-opacity: 1;
-  border-color: rgb(104 216 235 / var(--tw-border-opacity, 1));
-}
 .border-\[\#A1421F\] {
   --tw-border-opacity: 1;
   border-color: rgb(161 66 31 / var(--tw-border-opacity, 1));
@@ -1277,14 +1254,6 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(128 230 230 / var(--tw-bg-opacity, 1));
 }
-.bg-\[\#A8F3FB\] {
-  --tw-bg-opacity: 1;
-  background-color: rgb(168 243 251 / var(--tw-bg-opacity, 1));
-}
-.bg-\[\#EEF6F8\] {
-  --tw-bg-opacity: 1;
-  background-color: rgb(238 246 248 / var(--tw-bg-opacity, 1));
-}
 .bg-\[\#F0784F\] {
   --tw-bg-opacity: 1;
   background-color: rgb(240 120 79 / var(--tw-bg-opacity, 1));
@@ -1321,6 +1290,9 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
 }
+.bg-cyan-200\/70 {
+  background-color: rgb(165 243 252 / 0.7);
+}
 .bg-gray-100 {
   --tw-bg-opacity: 1;
   background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
@@ -1396,9 +1368,6 @@ video {
 .p-1 {
   padding: 0.25rem;
 }
-.p-1\.5 {
-  padding: 0.375rem;
-}
 .p-10 {
   padding: 2.5rem;
 }
@@ -1411,9 +1380,6 @@ video {
 .p-4 {
   padding: 1rem;
 }
-.p-5 {
-  padding: 1.25rem;
-}
 .px-0\.5 {
   padding-left: 0.125rem;
   padding-right: 0.125rem;
@@ -1466,6 +1432,10 @@ video {
   padding-top: 1rem;
   padding-bottom: 1rem;
 }
+.py-6 {
+  padding-top: 1.5rem;
+  padding-bottom: 1.5rem;
+}
 .py-8 {
   padding-top: 2rem;
   padding-bottom: 2rem;
@@ -1509,6 +1479,9 @@ video {
 .text-right {
   text-align: right;
 }
+.align-baseline {
+  vertical-align: baseline;
+}
 .font-mono {
   font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
 }
@@ -1559,12 +1532,6 @@ video {
 .font-semibold {
   font-weight: 600;
 }
-.uppercase {
-  text-transform: uppercase;
-}
-.capitalize {
-  text-transform: capitalize;
-}
 .italic {
   font-style: italic;
 }
@@ -1578,16 +1545,12 @@ video {
 .leading-relaxed {
   line-height: 1.625;
 }
+.leading-tight {
+  line-height: 1.25;
+}
 .tracking-tight {
   letter-spacing: -0.025em;
 }
-.tracking-wide {
-  letter-spacing: 0.025em;
-}
-.text-\[\#00314E\] {
-  --tw-text-opacity: 1;
-  color: rgb(0 49 78 / var(--tw-text-opacity, 1));
-}
 .text-\[\#003366\] {
   --tw-text-opacity: 1;
   color: rgb(0 51 102 / var(--tw-text-opacity, 1));
@@ -1604,9 +1567,6 @@ video {
   --tw-text-opacity: 1;
   color: rgb(14 47 63 / var(--tw-text-opacity, 1));
 }
-.text-\[\#0E2F3F\]\/70 {
-  color: rgb(14 47 63 / 0.7);
-}
 .text-\[\#355366\] {
   --tw-text-opacity: 1;
   color: rgb(53 83 102 / var(--tw-text-opacity, 1));
@@ -1615,10 +1575,6 @@ video {
   --tw-text-opacity: 1;
   color: rgb(74 16 4 / var(--tw-text-opacity, 1));
 }
-.text-\[\#D14324\] {
-  --tw-text-opacity: 1;
-  color: rgb(209 67 36 / var(--tw-text-opacity, 1));
-}
 .text-\[\#F0784F\] {
   --tw-text-opacity: 1;
   color: rgb(240 120 79 / var(--tw-text-opacity, 1));
@@ -1679,6 +1635,10 @@ video {
   --tw-text-opacity: 1;
   color: rgb(153 27 27 / var(--tw-text-opacity, 1));
 }
+.text-teal-500 {
+  --tw-text-opacity: 1;
+  color: rgb(20 184 166 / var(--tw-text-opacity, 1));
+}
 .text-white {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity, 1));
@@ -1703,6 +1663,9 @@ video {
   --tw-placeholder-opacity: 1;
   color: rgb(156 163 175 / var(--tw-placeholder-opacity, 1));
 }
+.opacity-0 {
+  opacity: 0;
+}
 .opacity-15 {
   opacity: 0.15;
 }
@@ -1721,11 +1684,6 @@ video {
 .opacity-80 {
   opacity: 0.8;
 }
-.shadow-\[0_25px_60px_rgba\(13\2c 53\2c 71\2c 0\.15\)\] {
-  --tw-shadow: 0 25px 60px rgba(13,53,71,0.15);
-  --tw-shadow-colored: 0 25px 60px var(--tw-shadow-color);
-  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
-}
 .shadow-sm {
   --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
   --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
@@ -1818,17 +1776,10 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(74 74 74 / var(--tw-border-opacity, 1));
 }
-.hover\:bg-\[\#0E2F3F\]\/10:hover {
-  background-color: rgb(14 47 63 / 0.1);
-}
 .hover\:bg-\[\#6DD5D5\]:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(109 213 213 / var(--tw-bg-opacity, 1));
 }
-.hover\:bg-\[\#90edf7\]:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(144 237 247 / var(--tw-bg-opacity, 1));
-}
 .hover\:bg-\[\#FF9F80\]:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(255 159 128 / var(--tw-bg-opacity, 1));
@@ -1857,13 +1808,6 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(22 163 74 / var(--tw-bg-opacity, 1));
 }
-.hover\:bg-white:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
-}
-.hover\:bg-opacity-5:hover {
-  --tw-bg-opacity: 0.05;
-}
 .hover\:text-blue-700:hover {
   --tw-text-opacity: 1;
   color: rgb(29 78 216 / var(--tw-text-opacity, 1));
@@ -1913,20 +1857,9 @@ video {
 .disabled\:opacity-50:disabled {
   opacity: 0.5;
 }
-.disabled\:opacity-60:disabled {
-  opacity: 0.6;
-}
 .dark\:border-\[\#\#858585\]:is(.dark *) {
   border-color: ##858585;
 }
-.dark\:border-\[\#1F6B7D\]:is(.dark *) {
-  --tw-border-opacity: 1;
-  border-color: rgb(31 107 125 / var(--tw-border-opacity, 1));
-}
-.dark\:border-\[\#2C6D80\]:is(.dark *) {
-  --tw-border-opacity: 1;
-  border-color: rgb(44 109 128 / var(--tw-border-opacity, 1));
-}
 .dark\:border-blue-800:is(.dark *) {
   --tw-border-opacity: 1;
   border-color: rgb(30 64 175 / var(--tw-border-opacity, 1));
@@ -1955,29 +1888,14 @@ video {
 .dark\:border-white\/40:is(.dark *) {
   border-color: rgb(255 255 255 / 0.4);
 }
-.dark\:border-white\/70:is(.dark *) {
-  border-color: rgb(255 255 255 / 0.7);
-}
 .dark\:border-yellow-800:is(.dark *) {
   --tw-border-opacity: 1;
   border-color: rgb(133 77 14 / var(--tw-border-opacity, 1));
 }
-.dark\:bg-\[\#102027\]:is(.dark *) {
-  --tw-bg-opacity: 1;
-  background-color: rgb(16 32 39 / var(--tw-bg-opacity, 1));
-}
-.dark\:bg-\[\#114C5A\]:is(.dark *) {
-  --tw-bg-opacity: 1;
-  background-color: rgb(17 76 90 / var(--tw-bg-opacity, 1));
-}
 .dark\:bg-\[\#121212\]:is(.dark *) {
   --tw-bg-opacity: 1;
   background-color: rgb(18 18 18 / var(--tw-bg-opacity, 1));
 }
-.dark\:bg-\[\#1F1F1F\]:is(.dark *) {
-  --tw-bg-opacity: 1;
-  background-color: rgb(31 31 31 / var(--tw-bg-opacity, 1));
-}
 .dark\:bg-\[\#2E9D9D\]:is(.dark *) {
   --tw-bg-opacity: 1;
   background-color: rgb(46 157 157 / var(--tw-bg-opacity, 1));
@@ -2004,6 +1922,9 @@ video {
 .dark\:bg-blue-900\/50:is(.dark *) {
   background-color: rgb(30 58 138 / 0.5);
 }
+.dark\:bg-cyan-900\/40:is(.dark *) {
+  background-color: rgb(22 78 99 / 0.4);
+}
 .dark\:bg-gray-600:is(.dark *) {
   --tw-bg-opacity: 1;
   background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1));
@@ -2083,13 +2004,14 @@ video {
   --tw-text-opacity: 1;
   color: rgb(248 113 113 / var(--tw-text-opacity, 1));
 }
+.dark\:text-teal-400:is(.dark *) {
+  --tw-text-opacity: 1;
+  color: rgb(45 212 191 / var(--tw-text-opacity, 1));
+}
 .dark\:text-white:is(.dark *) {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity, 1));
 }
-.dark\:text-white\/70:is(.dark *) {
-  color: rgb(255 255 255 / 0.7);
-}
 .dark\:text-white\/80:is(.dark *) {
   color: rgb(255 255 255 / 0.8);
 }
@@ -2125,10 +2047,6 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(158 158 158 / var(--tw-border-opacity, 1));
 }
-.dark\:hover\:bg-\[\#0f3f4b\]:hover:is(.dark *) {
-  --tw-bg-opacity: 1;
-  background-color: rgb(15 63 75 / var(--tw-bg-opacity, 1));
-}
 .dark\:hover\:bg-\[\#268585\]:hover:is(.dark *) {
   --tw-bg-opacity: 1;
   background-color: rgb(38 133 133 / var(--tw-bg-opacity, 1));
@@ -2156,9 +2074,6 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1));
 }
-.dark\:hover\:bg-white\/10:hover:is(.dark *) {
-  background-color: rgb(255 255 255 / 0.1);
-}
 .dark\:hover\:text-blue-300:hover:is(.dark *) {
   --tw-text-opacity: 1;
   color: rgb(147 197 253 / var(--tw-text-opacity, 1));
@@ -2179,3 +2094,12 @@ video {
   --tw-ring-opacity: 1;
   --tw-ring-color: rgb(75 85 99 / var(--tw-ring-opacity, 1));
 }
+.\[\&_\.recharts-cartesian-grid_line\]\:stroke-slate-400\/25 .recharts-cartesian-grid line {
+  stroke: rgb(148 163 184 / 0.25);
+}
+.dark\:\[\&_\.recharts-cartesian-grid_line\]\:stroke-white\/10 .recharts-cartesian-grid line:is(.dark *) {
+  stroke: rgb(255 255 255 / 0.1);
+}
+.\[\&_\.recharts-tooltip-cursor\]\:stroke-current .recharts-tooltip-cursor {
+  stroke: currentColor;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cofhe/react",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -27,13 +27,10 @@
     "@mui/icons-material": "^5.0.0",
     "@svgr/core": "^8.1.0",
     "@svgr/plugin-jsx": "^8.1.0",
-    "@testing-library/jest-dom": "^6.4.8",
-    "@testing-library/react": "^16.1.0",
     "@types/react": "^18.2.61",
     "@types/react-dom": "^18.2.19",
     "eslint": "^8.57.0",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "happy-dom": "^15.0.0",
     "nodemon": "^3.1.11",
     "postcss-cli": "^11.0.1",
     "postcss-import": "^16.1.1",
@@ -43,24 +40,26 @@
     "ts-essentials": "^10.1.1",
     "tsup": "^8.5.0",
     "typescript": "5.5.4",
-    "vitest": "^3.0.0",
-    "@cofhe/abi": "^0.2.0",
+    "@cofhe/abi": "^0.3.0",
     "@cofhe/eslint-config": "0.2.0",
     "@cofhe/tsconfig": "0.1.1"
   },
   "dependencies": {
     "@radix-ui/react-dropdown-menu": "^2.1.16",
     "@radix-ui/react-select": "^2.2.6",
+    "@tanstack/query-async-storage-persister": "^5.90.22",
     "@tanstack/react-query": "^5.90.7",
+    "@tanstack/react-query-persist-client": "^5.90.7",
     "bignumber.js": "^9.3.1",
     "clsx": "^2.0.0",
     "motion": "^12.23.26",
     "react-error-boundary": "^6.0.0",
     "react-icons": "^5.5.0",
+    "recharts": "^3.7.0",
     "tailwind-merge": "^2.0.0",
-    "zod": "^3.22.0",
+    "zod": "^4.0.0",
     "zustand": "^5.0.1",
-    "@cofhe/sdk": "0.2.0"
+    "@cofhe/sdk": "0.3.0"
   },
   "peerDependencies": {
     "@mui/icons-material": "^5.0.0",
@@ -76,10 +75,8 @@
     "build": "tsup && postcss ./src/styles.css -o ./dist/styles.css --minify",
     "dev": "nodemon",
     "lint": "eslint \"src/**/*.ts*\"",
-    "type-check": "tsc --noEmit",
+    "check:types": "tsc --noEmit",
     "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist",
-    "test": "vitest run",
-    "test:watch": "vitest",
-    "test:coverage": "vitest run --coverage"
+    "test": "echo 'No tests configured for @cofhe/react'"
   }
 }