@velora-dex/widget 0.2.5-dev.9 → 0.3.1

package/dist/styles.css

@@ -7,6 +7,9 @@
       --tw-translate-x: 0;
       --tw-translate-y: 0;
       --tw-translate-z: 0;
+      --tw-scale-x: 1;
+      --tw-scale-y: 1;
+      --tw-scale-z: 1;
       --tw-rotate-x: initial;
       --tw-rotate-y: initial;
       --tw-rotate-z: initial;
@@ -67,7 +70,7 @@
     }
   }
 }
-:root, :host {
+.velora-widget {
   --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
   --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
   --color-red-800: oklch(44.4% .177 26.899);
@@ -326,6 +329,9 @@
 .velora-widget.velora-widget .collapse {
   visibility: collapse;
 }
+.velora-widget.velora-widget .invisible {
+  visibility: hidden;
+}
 .velora-widget.velora-widget .visible {
   visibility: visible;
 }
@@ -786,6 +792,9 @@
 .velora-widget.velora-widget .min-h-\[400px\] {
   min-height: 400px;
 }
+.velora-widget.velora-widget .min-h-\[620px\] {
+  min-height: 620px;
+}
 .velora-widget.velora-widget .w-3\.5 {
   width: calc(var(--spacing) * 3.5);
 }
@@ -879,6 +888,9 @@
 .velora-widget.velora-widget .max-w-\[calc\(100\%-2rem\)\] {
   max-width: calc(100% - 2rem);
 }
+.velora-widget.velora-widget .max-w-fit {
+  max-width: fit-content;
+}
 .velora-widget.velora-widget .max-w-md {
   max-width: var(--container-md);
 }
@@ -944,6 +956,10 @@
   --tw-translate-y: calc(-50% - 2px);
   translate: var(--tw-translate-x) var(--tw-translate-y);
 }
+.velora-widget.velora-widget .-scale-x-100 {
+  --tw-scale-x: calc(100% * -1);
+  scale: var(--tw-scale-x) var(--tw-scale-y);
+}
 .velora-widget.velora-widget .rotate-45 {
   rotate: 45deg;
 }
@@ -1082,9 +1098,6 @@
 .velora-widget.velora-widget .gap-\[16px\] {
   gap: 16px;
 }
-.velora-widget.velora-widget .gap-\[22px\] {
-  gap: 22px;
-}
 .velora-widget.velora-widget .gap-\[28px\] {
   gap: 28px;
 }
@@ -1393,6 +1406,9 @@
 .velora-widget.velora-widget .stroke-red-800 {
   stroke: var(--color-red-800);
 }
+.velora-widget.velora-widget .stroke-secondary-orange-peel-1 {
+  stroke: var(--secondary-orange_peel-1);
+}
 .velora-widget.velora-widget .p-0 {
   padding: calc(var(--spacing) * 0);
 }
@@ -1402,6 +1418,9 @@
 .velora-widget.velora-widget .p-1 {
   padding: calc(var(--spacing) * 1);
 }
+.velora-widget.velora-widget .p-1\.5 {
+  padding: calc(var(--spacing) * 1.5);
+}
 .velora-widget.velora-widget .p-2 {
   padding: calc(var(--spacing) * 2);
 }
@@ -1976,6 +1995,9 @@
 .velora-widget.velora-widget .group-data-\[state\=open\]\:rotate-90:is(:where(.group)[data-state="open"] *) {
   rotate: 90deg;
 }
+.velora-widget.velora-widget .group-data-\[state\=open\]\:rotate-180:is(:where(.group)[data-state="open"] *) {
+  rotate: 180deg;
+}
 .velora-widget.velora-widget .group-data-\[vaul-drawer-direction\=bottom\]\/drawer-content\:block:is(:where(.group\/drawer-content)[data-vaul-drawer-direction="bottom"] *) {
   display: block;
 }
@@ -2538,9 +2560,6 @@
 .velora-widget.velora-widget .dark\:border-b-contrast-5:is(.velora-widget.dark *) {
   border-bottom-color: var(--contrast-5);
 }
-.velora-widget.velora-widget .dark\:bg-\[\#0F111A\]:is(.velora-widget.dark *) {
-  background-color: #0f111a;
-}
 .velora-widget.velora-widget .dark\:bg-\[\#0000000D\]:is(.velora-widget.dark *) {
   background-color: #0000000d;
 }
@@ -2636,7 +2655,7 @@
   outline-color: var(--contrast-4);
 }
 @media (hover: hover) {
-  .velora-widget.velora-widget .group-hover\:dark\:fill-contrast-7:is(:where(.group):hover *):is(.velora-widget.dark *) {
+  .velora-widget.velora-widget .dark\:group-hover\:fill-contrast-7:is(.velora-widget.dark *):is(:where(.group):hover *) {
     fill: var(--contrast-7);
   }
 }
@@ -2800,9 +2819,6 @@
   width: calc(var(--spacing) * 3);
   height: calc(var(--spacing) * 3);
 }
-.velora-widget.velora-widget .\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state="open"] > svg {
-  rotate: 180deg;
-}
 @media (hover: hover) {
   a:is(.velora-widget.velora-widget .\[a\&\]\:hover\:bg-accent):hover {
     background-color: var(--accent);
@@ -3057,6 +3073,21 @@
   inherits: false;
   initial-value: 0;
 }
+@property --tw-scale-x {
+  syntax: "*";
+  inherits: false;
+  initial-value: 1;
+}
+@property --tw-scale-y {
+  syntax: "*";
+  inherits: false;
+  initial-value: 1;
+}
+@property --tw-scale-z {
+  syntax: "*";
+  inherits: false;
+  initial-value: 1;
+}
 @property --tw-rotate-x {
   syntax: "*";
   inherits: false

package/dist/tokens/utils/sorting.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sorting.d.ts","sourceRoot":"","sources":["../../../src/tokens/utils/sorting.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,gBAAgB,CAAC;AAG/D,KAAK,4BAA4B,GAAG,IAAI,CACtC,wBAAwB,EACxB,SAAS,GAAG,YAAY,CACzB,CAAC;AAEF,wBAAgB,UAAU,CACxB,MAAM,EAAE,4BAA4B,EACpC,MAAM,EAAE,4BAA4B,UA6BrC"}
+{"version":3,"file":"sorting.d.ts","sourceRoot":"","sources":["../../../src/tokens/utils/sorting.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,gBAAgB,CAAC;AAI/D,KAAK,4BAA4B,GAAG,IAAI,CACtC,wBAAwB,EACxB,SAAS,GAAG,YAAY,CACzB,CAAC;AAEF,wBAAgB,UAAU,CACxB,MAAM,EAAE,4BAA4B,EACpC,MAAM,EAAE,4BAA4B,UAgCrC"}

package/dist/tokens/utils/sorting.js

@@ -1,3 +1,4 @@
+import { isVLR } from './brand.js';
 import { isETH } from './eth.js';
 
 function sortTokens(tokenA, tokenB) {
@@ -6,6 +7,8 @@ function sortTokens(tokenA, tokenB) {
   }
   if (isETH(tokenA)) return -1;
   if (isETH(tokenB)) return 1;
+  if (isVLR(tokenA, 1)) return -1;
+  if (isVLR(tokenB, 1)) return 1;
   if ("usdBalance" in tokenA && "usdBalance" in tokenB) {
     const balanceA = "usdBalance" in tokenA && tokenA.usdBalance ? tokenA.usdBalance : 0;
     const balanceB = "usdBalance" in tokenB && tokenB.usdBalance ? tokenB.usdBalance : 0;

package/dist/tokens/utils/sorting.js.map

@@ -1 +1 @@
-{"version":3,"file":"sorting.js","sources":["../../../src/tokens/utils/sorting.ts"],"sourcesContent":["import type { TokenMaybeWithUsdBalance } from \"../state/types\";\nimport { isETH } from \"./eth\";\n\ntype TokenLikeMaybeWithUsdBalance = Pick<\n  TokenMaybeWithUsdBalance,\n  \"address\" | \"usdBalance\"\n>;\n\nexport function sortTokens(\n  tokenA: TokenLikeMaybeWithUsdBalance,\n  tokenB: TokenLikeMaybeWithUsdBalance\n) {\n  // both tokens are native (from different chains) - first goes with bigger usdBalance\n  if (\n    isETH(tokenA) &&\n    isETH(tokenB) &&\n    \"usdBalance\" in tokenA &&\n    \"usdBalance\" in tokenB &&\n    tokenA.usdBalance &&\n    tokenB.usdBalance\n  ) {\n    return tokenA.usdBalance > tokenB.usdBalance ? -1 : 1;\n  }\n  // Native Token goes first\n  if (isETH(tokenA)) return -1;\n  if (isETH(tokenB)) return 1;\n\n  if (\"usdBalance\" in tokenA && \"usdBalance\" in tokenB) {\n    const balanceA =\n      \"usdBalance\" in tokenA && tokenA.usdBalance ? tokenA.usdBalance : 0;\n    const balanceB =\n      \"usdBalance\" in tokenB && tokenB.usdBalance ? tokenB.usdBalance : 0;\n\n    // all other Tokens sort by USD balance\n    const balDiff = balanceB - balanceA;\n    return balDiff;\n  }\n\n  return 0;\n}\n"],"names":["sortTokens","tokenA","tokenB","isETH","usdBalance","balanceA","balanceB","balDiff"],"mappings":";;AAQO,SAASA,UAAAA,CACdC,QACAC,MAAAA,EACA;AAEA,EAAA,IACEC,KAAAA,CAAMF,MAAM,CAAA,IACZE,KAAAA,CAAMD,MAAM,CAAA,IACZ,YAAA,IAAgBD,MAAAA,IAChB,YAAA,IAAgBC,MAAAA,IAChBD,MAAAA,CAAOG,UAAAA,IACPF,OAAOE,UAAAA,EACP;AACA,IAAA,OAAOH,MAAAA,CAAOG,UAAAA,GAAaF,MAAAA,CAAOE,UAAAA,GAAa,EAAA,GAAK,CAAA;AAAA,EACtD;AAEA,EAAA,IAAID,KAAAA,CAAMF,MAAM,CAAA,EAAG,OAAO,EAAA;AAC1B,EAAA,IAAIE,KAAAA,CAAMD,MAAM,CAAA,EAAG,OAAO,CAAA;AAE1B,EAAA,IAAI,YAAA,IAAgBD,MAAAA,IAAU,YAAA,IAAgBC,MAAAA,EAAQ;AACpD,IAAA,MAAMG,WACJ,YAAA,IAAgBJ,MAAAA,IAAUA,MAAAA,CAAOG,UAAAA,GAAaH,OAAOG,UAAAA,GAAa,CAAA;AACpE,IAAA,MAAME,WACJ,YAAA,IAAgBJ,MAAAA,IAAUA,MAAAA,CAAOE,UAAAA,GAAaF,OAAOE,UAAAA,GAAa,CAAA;AAGpE,IAAA,MAAMG,UAAUD,QAAAA,GAAWD,QAAAA;AAC3B,IAAA,OAAOE,OAAAA;AAAAA,EACT;AAEA,EAAA,OAAO,CAAA;AACT;;;;"}
+{"version":3,"file":"sorting.js","sources":["../../../src/tokens/utils/sorting.ts"],"sourcesContent":["import type { TokenMaybeWithUsdBalance } from \"../state/types\";\nimport { isVLR } from \"./brand\";\nimport { isETH } from \"./eth\";\n\ntype TokenLikeMaybeWithUsdBalance = Pick<\n  TokenMaybeWithUsdBalance,\n  \"address\" | \"usdBalance\"\n>;\n\nexport function sortTokens(\n  tokenA: TokenLikeMaybeWithUsdBalance,\n  tokenB: TokenLikeMaybeWithUsdBalance\n) {\n  // both tokens are native (from different chains) - first goes with bigger usdBalance\n  if (\n    isETH(tokenA) &&\n    isETH(tokenB) &&\n    \"usdBalance\" in tokenA &&\n    \"usdBalance\" in tokenB &&\n    tokenA.usdBalance &&\n    tokenB.usdBalance\n  ) {\n    return tokenA.usdBalance > tokenB.usdBalance ? -1 : 1;\n  }\n  // Native Token goes first\n  if (isETH(tokenA)) return -1;\n  if (isETH(tokenB)) return 1;\n  // VLR goes second\n  if (isVLR(tokenA, 1)) return -1;\n  if (isVLR(tokenB, 1)) return 1;\n\n  if (\"usdBalance\" in tokenA && \"usdBalance\" in tokenB) {\n    const balanceA =\n      \"usdBalance\" in tokenA && tokenA.usdBalance ? tokenA.usdBalance : 0;\n    const balanceB =\n      \"usdBalance\" in tokenB && tokenB.usdBalance ? tokenB.usdBalance : 0;\n\n    // all other Tokens sort by USD balance\n    const balDiff = balanceB - balanceA;\n    return balDiff;\n  }\n\n  return 0;\n}\n"],"names":["sortTokens","tokenA","tokenB","isETH","usdBalance","isVLR","balanceA","balanceB","balDiff"],"mappings":";;;AASO,SAASA,UAAAA,CACdC,QACAC,MAAAA,EACA;AAEA,EAAA,IACEC,KAAAA,CAAMF,MAAM,CAAA,IACZE,KAAAA,CAAMD,MAAM,CAAA,IACZ,YAAA,IAAgBD,MAAAA,IAChB,YAAA,IAAgBC,MAAAA,IAChBD,MAAAA,CAAOG,UAAAA,IACPF,OAAOE,UAAAA,EACP;AACA,IAAA,OAAOH,MAAAA,CAAOG,UAAAA,GAAaF,MAAAA,CAAOE,UAAAA,GAAa,EAAA,GAAK,CAAA;AAAA,EACtD;AAEA,EAAA,IAAID,KAAAA,CAAMF,MAAM,CAAA,EAAG,OAAO,EAAA;AAC1B,EAAA,IAAIE,KAAAA,CAAMD,MAAM,CAAA,EAAG,OAAO,CAAA;AAE1B,EAAA,IAAIG,KAAAA,CAAMJ,MAAAA,EAAQ,CAAC,CAAA,EAAG,OAAO,EAAA;AAC7B,EAAA,IAAII,KAAAA,CAAMH,MAAAA,EAAQ,CAAC,CAAA,EAAG,OAAO,CAAA;AAE7B,EAAA,IAAI,YAAA,IAAgBD,MAAAA,IAAU,YAAA,IAAgBC,MAAAA,EAAQ;AACpD,IAAA,MAAMI,WACJ,YAAA,IAAgBL,MAAAA,IAAUA,MAAAA,CAAOG,UAAAA,GAAaH,OAAOG,UAAAA,GAAa,CAAA;AACpE,IAAA,MAAMG,WACJ,YAAA,IAAgBL,MAAAA,IAAUA,MAAAA,CAAOE,UAAAA,GAAaF,OAAOE,UAAAA,GAAa,CAAA;AAGpE,IAAA,MAAMI,UAAUD,QAAAA,GAAWD,QAAAA;AAC3B,IAAA,OAAOE,OAAAA;AAAAA,EACT;AAEA,EAAA,OAAO,CAAA;AACT;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@velora-dex/widget",
-  "version": "0.2.5-dev.9",
+  "version": "0.3.1",
   "license": "MIT",
   "type": "module",
   "files": [
@@ -74,7 +74,7 @@
     "@tanstack/react-pacer": "^0.14.0",
     "@tanstack/react-virtual": "^3.13.12",
     "@uniswap/token-lists": "1.0.0-beta.34",
-    "@velora-dex/sdk": "9.3.0-dev.1",
+    "@velora-dex/sdk": "9.3.0",
     "@wagmi/core": "^2.18.1",
     "axios": "^1.11.0",
     "big.js": "^7.0.1",
@@ -90,6 +90,7 @@
     "jotai-scope": "^0.10.0",
     "jotai-tanstack-query": "^0.11.0",
     "lucide-react": "^0.536.0",
+    "motion": "^12.24.11",
     "react-compiler-runtime": "1.0.0",
     "react-error-boundary": "^6.0.0",
     "react-number-format": "^5.4.4",