@relayprotocol/relay-kit-ui 7.1.6 → 8.0.0

package/_cjs/src/components/primitives/Switch.js

@@ -4,50 +4,12 @@ exports.StyledThumb = exports.StyledSwitch = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const Switch = tslib_1.__importStar(require("@radix-ui/react-switch"));
-const css_1 = require("@relayprotocol/relay-design-system/css");
 const react_1 = require("react");
-const StyledSwitchCss = (0, css_1.cva)({
-    base: {
-        cursor: 'pointer',
-        width: '38px',
-        height: '20px',
-        backgroundColor: 'gray7',
-        borderRadius: '9999px',
-        position: 'relative',
-        WebkitTapHighlightColor: 'rgba(0, 0, 0, 0)',
-        display: 'flex',
-        alignItems: 'center',
-        padding: '0 10px',
-        transition: 'background-color 250ms',
-        "&[data-state='checked']": {
-            backgroundColor: 'primary-button-background'
-        }
-    }
+const cn_js_1 = require("../../utils/cn.js");
+exports.StyledSwitch = (0, react_1.forwardRef)(({ children, className, ...props }, forwardedRef) => {
+    return ((0, jsx_runtime_1.jsx)(Switch.Root, { ref: forwardedRef, ...props, className: (0, cn_js_1.cn)('relay:cursor-pointer relay:w-[38px] relay:h-[20px]', 'relay:bg-[var(--relay-colors-gray7)] relay:rounded-full', 'relay:relative relay:flex relay:items-center relay:px-[10px]', 'relay:transition-all relay:duration-200', "relay:data-[state='checked']:bg-[var(--relay-colors-primary-button-background)]", className), children: children }));
 });
-exports.StyledSwitch = (0, react_1.forwardRef)(({ children, css, ...props }, forwardedRef) => {
-    return ((0, jsx_runtime_1.jsx)(Switch.Root, { ref: forwardedRef, ...props, className: (0, css_1.css)(StyledSwitchCss.raw(), css_1.css.raw(css)), children: children }));
-});
-const StyledThumbCss = (0, css_1.cva)({
-    base: {
-        display: 'block',
-        width: '17.5px',
-        height: '17.5px',
-        backgroundColor: 'gray1',
-        borderRadius: '9999px',
-        zIndex: 1,
-        '--borderColor': 'colors.gray.8',
-        border: '1px solid var(--borderColor)',
-        transition: 'transform 100ms',
-        transform: 'translateX(0px)',
-        willChange: 'transform',
-        position: 'absolute',
-        left: '2px',
-        "&[data-state='checked']": {
-            transform: 'translateX(17px)'
-        }
-    }
-});
-exports.StyledThumb = (0, react_1.forwardRef)(({ children, css, ...props }, forwardedRef) => {
-    return ((0, jsx_runtime_1.jsx)(Switch.Thumb, { ref: forwardedRef, ...props, className: (0, css_1.css)(StyledThumbCss.raw(), css_1.css.raw(css)) }));
+exports.StyledThumb = (0, react_1.forwardRef)(({ children, className, ...props }, forwardedRef) => {
+    return ((0, jsx_runtime_1.jsx)(Switch.Thumb, { ref: forwardedRef, ...props, className: (0, cn_js_1.cn)('relay:block relay:w-[17.5px] relay:h-[17.5px]', 'relay:bg-[var(--relay-colors-gray1)] relay:rounded-full', 'relay:z-[1] relay:border relay:border-solid relay:border-[var(--relay-colors-gray-8)] relay:shadow-sm', 'relay:transition-transform relay:duration-100', 'relay:translate-x-0 relay:will-change-transform', 'relay:absolute relay:left-[2px]', "relay:data-[state='checked']:translate-x-[17px]", className) }));
 });
 //# sourceMappingURL=Switch.js.map

package/_cjs/src/components/primitives/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../../src/components/primitives/Switch.tsx"],"names":[],"mappings":";;;;;AAAA,uEAAgD;AAChD,gEAI+C;AAC/C,iCAIc;AAEd,MAAM,eAAe,GAAG,IAAA,SAAG,EAAC;IAC1B,IAAI,EAAE;QACJ,MAAM,EAAE,SAAS;QACjB,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,eAAe,EAAE,OAAO;QACxB,YAAY,EAAE,QAAQ;QACtB,QAAQ,EAAE,UAAU;QACpB,uBAAuB,EAAE,kBAAkB;QAC3C,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,OAAO,EAAE,QAAQ;QACjB,UAAU,EAAE,wBAAwB;QACpC,yBAAyB,EAAE;YACzB,eAAe,EAAE,2BAA2B;SAC7C;KACF;CACF,CAAC,CAAA;AAEW,QAAA,YAAY,GAAG,IAAA,kBAAU,EAGpC,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC9C,OAAO,CACL,uBAAC,MAAM,CAAC,IAAI,IACV,GAAG,EAAE,YAAY,KACb,KAAK,EACT,SAAS,EAAE,IAAA,SAAS,EAAC,eAAe,CAAC,GAAG,EAAE,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,YAE9D,QAAQ,GACG,CACf,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,cAAc,GAAG,IAAA,SAAG,EAAC;IACzB,IAAI,EAAE;QACJ,OAAO,EAAE,OAAO;QAChB,KAAK,EAAE,QAAQ;QACf,MAAM,EAAE,QAAQ;QAChB,eAAe,EAAE,OAAO;QACxB,YAAY,EAAE,QAAQ;QACtB,MAAM,EAAE,CAAC;QACT,eAAe,EAAE,eAAe;QAChC,MAAM,EAAE,8BAA8B;QACtC,UAAU,EAAE,iBAAiB;QAC7B,SAAS,EAAE,iBAAiB;QAC5B,UAAU,EAAE,WAAW;QACvB,QAAQ,EAAE,UAAU;QACpB,IAAI,EAAE,KAAK;QACX,yBAAyB,EAAE;YACzB,SAAS,EAAE,kBAAkB;SAC9B;KACF;CACF,CAAC,CAAA;AAEW,QAAA,WAAW,GAAG,IAAA,kBAAU,EAGnC,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC9C,OAAO,CACL,uBAAC,MAAM,CAAC,KAAK,IACX,GAAG,EAAE,YAAY,KACb,KAAK,EACT,SAAS,EAAE,IAAA,SAAS,EAAC,cAAc,CAAC,GAAG,EAAE,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,GAC9D,CACH,CAAA;AACH,CAAC,CAAC,CAAA"}
+{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../../src/components/primitives/Switch.tsx"],"names":[],"mappings":";;;;;AAAA,uEAAgD;AAChD,iCAIc;AACd,6CAAsC;AAEzB,QAAA,YAAY,GAAG,IAAA,kBAAU,EAGpC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IACpD,OAAO,CACL,uBAAC,MAAM,CAAC,IAAI,IACV,GAAG,EAAE,YAAY,KACb,KAAK,EACT,SAAS,EAAE,IAAA,UAAE,EACX,oDAAoD,EACpD,yDAAyD,EACzD,8DAA8D,EAC9D,yCAAyC,EACzC,iFAAiF,EACjF,SAAS,CACV,YAEA,QAAQ,GACG,CACf,CAAA;AACH,CAAC,CAAC,CAAA;AAEW,QAAA,WAAW,GAAG,IAAA,kBAAU,EAGnC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IACpD,OAAO,CACL,uBAAC,MAAM,CAAC,KAAK,IACX,GAAG,EAAE,YAAY,KACb,KAAK,EACT,SAAS,EAAE,IAAA,UAAE,EACX,+CAA+C,EAC/C,yDAAyD,EACzD,uGAAuG,EACvG,+CAA+C,EAC/C,iDAAiD,EACjD,iCAAiC,EACjC,iDAAiD,EACjD,SAAS,CACV,GACD,CACH,CAAA;AACH,CAAC,CAAC,CAAA"}

package/_cjs/src/components/primitives/Tabs.js

@@ -4,52 +4,22 @@ exports.TabsContent = exports.TabsTrigger = exports.TabsList = exports.TabsRoot
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const TabsPrimitive = tslib_1.__importStar(require("@radix-ui/react-tabs"));
-const css_1 = require("@relayprotocol/relay-design-system/css");
 const react_1 = require("react");
-const TabsListCss = (0, css_1.cva)({
-    base: {
-        display: 'flex',
-        alignItems: 'center',
-        borderRadius: 8,
-        p: '1',
-        backgroundColor: 'gray2',
-        border: 'none'
-    }
-});
-const TabsTriggerCss = (0, css_1.cva)({
-    base: {
-        width: '100%',
-        fontWeight: '500',
-        fontSize: '14px',
-        cursor: 'pointer',
-        py: '2px',
-        color: 'gray12',
-        borderRadius: 8,
-        backgroundColor: 'transparent',
-        borderWidth: '1px',
-        borderStyle: 'solid',
-        borderColor: 'transparent',
-        '&[data-state="active"]': {
-            backgroundColor: 'subtle-background-color',
-            '--borderColor': 'colors.gray.5',
-            borderColor: 'var(--borderColor)'
-        }
-    }
-});
-const TabsList = (0, react_1.forwardRef)(({ children, css, ...props }, forwardedRef) => {
-    return ((0, jsx_runtime_1.jsx)(TabsPrimitive.List, { ...props, ref: forwardedRef, className: (0, css_1.css)(TabsListCss.raw(), css_1.css.raw(css)), children: children }));
+const cn_js_1 = require("../../utils/cn.js");
+const TabsList = (0, react_1.forwardRef)(({ children, className, ...props }, forwardedRef) => {
+    return ((0, jsx_runtime_1.jsx)(TabsPrimitive.List, { ...props, ref: forwardedRef, className: (0, cn_js_1.cn)('relay:flex relay:items-center relay:rounded-[8px] relay:p-1', 'relay:bg-[var(--relay-colors-gray2)] relay:border-none', className), children: children }));
 });
 exports.TabsList = TabsList;
-const TabsTrigger = (0, react_1.forwardRef)(({ children, css, ...props }, forwardedRef) => {
-    return ((0, jsx_runtime_1.jsx)(TabsPrimitive.Trigger, { ...props, ref: forwardedRef, className: (0, css_1.css)(TabsTriggerCss.raw(), css_1.css.raw(css)), children: children }));
+const TabsTrigger = (0, react_1.forwardRef)(({ children, className, ...props }, forwardedRef) => {
+    return ((0, jsx_runtime_1.jsx)(TabsPrimitive.Trigger, { ...props, ref: forwardedRef, className: (0, cn_js_1.cn)('relay:w-full relay:font-medium relay:text-[14px] relay:cursor-pointer', 'relay:py-[2px] relay:text-[color:var(--relay-colors-gray12)]', 'relay:rounded-[8px] relay:bg-transparent', 'relay:border relay:border-solid relay:border-transparent', 'relay:data-[state=active]:bg-[var(--relay-colors-subtle-background-color)]', 'relay:data-[state=active]:border-[var(--relay-colors-gray-5)]', className), children: children }));
 });
 exports.TabsTrigger = TabsTrigger;
-const TabsContent = (0, react_1.forwardRef)(({ children, css, ...props }, forwardedRef) => {
-    return ((0, jsx_runtime_1.jsx)(TabsPrimitive.Content, { ...props, ref: forwardedRef, className: (0, css_1.css)(css_1.css.raw(css)), children: children }));
+const TabsContent = (0, react_1.forwardRef)(({ children, className, ...props }, forwardedRef) => {
+    return ((0, jsx_runtime_1.jsx)(TabsPrimitive.Content, { ...props, ref: forwardedRef, className: (0, cn_js_1.cn)(className), children: children }));
 });
 exports.TabsContent = TabsContent;
-const TabsRoot = (0, react_1.forwardRef)(({ children, css, ...props }, forwardedRef) => {
-    return ((0, jsx_runtime_1.jsx)(TabsPrimitive.Root, { ...props, ref: forwardedRef, className: (0, css_1.css)(css_1.css.raw(css)), children: children }));
+const TabsRoot = (0, react_1.forwardRef)(({ children, className, ...props }, forwardedRef) => {
+    return ((0, jsx_runtime_1.jsx)(TabsPrimitive.Root, { ...props, ref: forwardedRef, className: (0, cn_js_1.cn)(className), children: children }));
 });
 exports.TabsRoot = TabsRoot;
 //# sourceMappingURL=Tabs.js.map

package/_cjs/src/components/primitives/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../../src/components/primitives/Tabs.tsx"],"names":[],"mappings":";;;;;AAAA,4EAAqD;AACrD,gEAI+C;AAC/C,iCAIc;AAEd,MAAM,WAAW,GAAG,IAAA,SAAG,EAAC;IACtB,IAAI,EAAE;QACJ,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,YAAY,EAAE,CAAC;QACf,CAAC,EAAE,GAAG;QACN,eAAe,EAAE,OAAO;QACxB,MAAM,EAAE,MAAM;KACf;CACF,CAAC,CAAA;AAEF,MAAM,cAAc,GAAG,IAAA,SAAG,EAAC;IACzB,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,UAAU,EAAE,KAAK;QACjB,QAAQ,EAAE,MAAM;QAChB,MAAM,EAAE,SAAS;QACjB,EAAE,EAAE,KAAK;QACT,KAAK,EAAE,QAAQ;QACf,YAAY,EAAE,CAAC;QACf,eAAe,EAAE,aAAa;QAC9B,WAAW,EAAE,KAAK;QAClB,WAAW,EAAE,OAAO;QACpB,WAAW,EAAE,aAAa;QAC1B,wBAAwB,EAAE;YACxB,eAAe,EAAE,yBAAyB;YAC1C,eAAe,EAAE,eAAe;YAChC,WAAW,EAAE,oBAAoB;SAClC;KACF;CACF,CAAC,CAAA;AAEF,MAAM,QAAQ,GAAG,IAAA,kBAAU,EAKzB,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC9C,OAAO,CACL,uBAAC,aAAa,CAAC,IAAI,OACb,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,SAAS,EAAC,WAAW,CAAC,GAAG,EAAE,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,YAE1D,QAAQ,GACU,CACtB,CAAA;AACH,CAAC,CAAC,CAAA;AAqDiB,4BAAQ;AAnD3B,MAAM,WAAW,GAAG,IAAA,kBAAU,EAK5B,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC9C,OAAO,CACL,uBAAC,aAAa,CAAC,OAAO,OAChB,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,SAAS,EAAC,cAAc,CAAC,GAAG,EAAE,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,YAE7D,QAAQ,GACa,CACzB,CAAA;AACH,CAAC,CAAC,CAAA;AAoC2B,kCAAW;AAlCxC,MAAM,WAAW,GAAG,IAAA,kBAAU,EAK5B,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC9C,OAAO,CACL,uBAAC,aAAa,CAAC,OAAO,OAChB,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,SAAS,EAAC,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,YAEvC,QAAQ,GACa,CACzB,CAAA;AACH,CAAC,CAAC,CAAA;AAmBwC,kCAAW;AAjBrD,MAAM,QAAQ,GAAG,IAAA,kBAAU,EAKzB,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC9C,OAAO,CACL,uBAAC,aAAa,CAAC,IAAI,OACb,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,SAAS,EAAC,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,YAEvC,QAAQ,GACU,CACtB,CAAA;AACH,CAAC,CAAC,CAAA;AAEO,4BAAQ"}
+{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../../src/components/primitives/Tabs.tsx"],"names":[],"mappings":";;;;;AAAA,4EAAqD;AACrD,iCAIc;AACd,6CAAsC;AAEtC,MAAM,QAAQ,GAAG,IAAA,kBAAU,EAKzB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IACpD,OAAO,CACL,uBAAC,aAAa,CAAC,IAAI,OACb,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,UAAE,EACX,6DAA6D,EAC7D,wDAAwD,EACxD,SAAS,CACV,YAEA,QAAQ,GACU,CACtB,CAAA;AACH,CAAC,CAAC,CAAA;AA6DiB,4BAAQ;AA3D3B,MAAM,WAAW,GAAG,IAAA,kBAAU,EAK5B,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IACpD,OAAO,CACL,uBAAC,aAAa,CAAC,OAAO,OAChB,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,UAAE,EACX,uEAAuE,EACvE,8DAA8D,EAC9D,0CAA0C,EAC1C,0DAA0D,EAC1D,4EAA4E,EAC5E,+DAA+D,EAC/D,SAAS,CACV,YAEA,QAAQ,GACa,CACzB,CAAA;AACH,CAAC,CAAC,CAAA;AAoC2B,kCAAW;AAlCxC,MAAM,WAAW,GAAG,IAAA,kBAAU,EAK5B,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IACpD,OAAO,CACL,uBAAC,aAAa,CAAC,OAAO,OAChB,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,UAAE,EAAC,SAAS,CAAC,YAEvB,QAAQ,GACa,CACzB,CAAA;AACH,CAAC,CAAC,CAAA;AAmBwC,kCAAW;AAjBrD,MAAM,QAAQ,GAAG,IAAA,kBAAU,EAKzB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IACpD,OAAO,CACL,uBAAC,aAAa,CAAC,IAAI,OACb,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,UAAE,EAAC,SAAS,CAAC,YAEvB,QAAQ,GACU,CACtB,CAAA;AACH,CAAC,CAAC,CAAA;AAEO,4BAAQ"}

package/_cjs/src/components/primitives/Text.js

@@ -1,111 +1,53 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
-const css_1 = require("@relayprotocol/relay-design-system/css");
-const TextCss = (0, css_1.cva)({
-    base: {
-        color: 'text-default',
-        fontFamily: 'body'
-    },
+const class_variance_authority_1 = require("class-variance-authority");
+const cn_js_1 = require("../../utils/cn.js");
+const textVariants = (0, class_variance_authority_1.cva)('relay:font-body', {
     variants: {
         style: {
-            h1: {
-                fontWeight: 800,
-                fontSize: '64px',
-                fontFamily: 'heading'
-            },
-            h2: {
-                fontWeight: 700,
-                fontSize: '48px'
-            },
-            h3: {
-                fontWeight: 700,
-                fontSize: '32px'
-            },
-            h4: {
-                fontWeight: 700,
-                fontSize: '24px'
-            },
-            h5: {
-                fontWeight: 700,
-                fontSize: '20px'
-            },
-            h6: {
-                fontWeight: 700,
-                fontSize: '16px'
-            },
-            subtitle1: {
-                fontWeight: 500,
-                fontSize: '16px'
-            },
-            subtitle2: {
-                fontWeight: 500,
-                fontSize: '14px'
-            },
-            subtitle3: {
-                fontWeight: 500,
-                fontSize: '12px'
-            },
-            body1: {
-                fontWeight: 400,
-                fontSize: '16px'
-            },
-            body2: {
-                fontWeight: 400,
-                fontSize: '14px'
-            },
-            body3: {
-                fontWeight: 400,
-                fontSize: '12px'
-            },
-            tiny: {
-                fontWeight: 500,
-                fontSize: 10,
-                color: 'gray11'
-            }
+            h1: 'relay:font-[800] relay:text-[64px] relay:font-heading',
+            h2: 'relay:font-bold relay:text-[48px]',
+            h3: 'relay:font-bold relay:text-[32px]',
+            h4: 'relay:font-bold relay:text-[24px]',
+            h5: 'relay:font-bold relay:text-[20px]',
+            h6: 'relay:font-bold relay:text-[16px]',
+            subtitle1: 'relay:font-medium relay:text-[16px]',
+            subtitle2: 'relay:font-medium relay:text-[14px]',
+            subtitle3: 'relay:font-medium relay:text-[12px]',
+            body1: 'relay:font-normal relay:text-[16px]',
+            body2: 'relay:font-normal relay:text-[14px]',
+            body3: 'relay:font-normal relay:text-[12px]',
+            tiny: 'relay:font-medium relay:text-[10px] relay:text-[color:var(--relay-colors-gray11)]'
         },
         color: {
-            subtle: {
-                color: 'text-subtle'
-            },
-            subtleSecondary: {
-                color: 'text-subtle-secondary'
-            },
-            error: {
-                color: 'text-error'
-            },
-            red: {
-                color: 'red11'
-            },
-            blue: {
-                color: 'blue12'
-            },
-            success: {
-                color: 'text-success'
-            },
-            warning: {
-                color: 'amber12'
-            },
-            warningSecondary: {
-                color: 'amber11'
-            }
+            default: 'relay:text-[color:var(--relay-colors-text-default)]',
+            subtle: 'relay:text-[color:var(--relay-colors-text-subtle)]',
+            subtleSecondary: 'relay:text-[color:var(--relay-colors-text-subtle-secondary)]',
+            error: 'relay:text-[color:var(--relay-colors-text-error)]',
+            red: 'relay:text-[color:var(--relay-colors-red11)]',
+            blue: 'relay:text-[color:var(--relay-colors-blue12)]',
+            success: 'relay:text-[color:var(--relay-colors-text-success)]',
+            warning: 'relay:text-[color:var(--relay-colors-amber12)]',
+            warningSecondary: 'relay:text-[color:var(--relay-colors-amber11)]',
+            primary: 'relay:text-[color:var(--relay-colors-primary11)]',
+            primary12: 'relay:text-[color:var(--relay-colors-primary12)]',
+            green: 'relay:text-[color:var(--relay-colors-green11)]',
+            slate: 'relay:text-[color:var(--relay-colors-slate10)]'
         },
         italic: {
-            true: {
-                fontStyle: 'italic'
-            }
+            true: 'relay:italic'
         },
         ellipsify: {
-            true: {
-                textOverflow: 'ellipsis',
-                overflow: 'hidden',
-                whiteSpace: 'nowrap'
-            }
+            true: 'relay:text-ellipsis relay:overflow-hidden relay:whitespace-nowrap'
         }
+    },
+    defaultVariants: {
+        color: 'default'
     }
 });
-const Text = ({ css, children, ...props }) => {
-    return ((0, jsx_runtime_1.jsx)("div", { className: (0, css_1.css)(TextCss.raw(props), css_1.css.raw(css)), children: children }));
+const Text = ({ className, children, ...props }) => {
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, cn_js_1.cn)(textVariants(props), className), children: children }));
 };
 exports.default = Text;
 //# sourceMappingURL=Text.js.map

package/_cjs/src/components/primitives/Text.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../../../src/components/primitives/Text.tsx"],"names":[],"mappings":";;;AAAA,gEAI+C;AAG/C,MAAM,OAAO,GAAG,IAAA,SAAG,EAAC;IAClB,IAAI,EAAE;QACJ,KAAK,EAAE,cAAc;QACrB,UAAU,EAAE,MAAM;KACnB;IACD,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,EAAE,EAAE;gBACF,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,MAAM;gBAChB,UAAU,EAAE,SAAS;aACtB;YACD,EAAE,EAAE;gBACF,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,MAAM;aACjB;YACD,EAAE,EAAE;gBACF,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,MAAM;aACjB;YACD,EAAE,EAAE;gBACF,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,MAAM;aACjB;YACD,EAAE,EAAE;gBACF,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,MAAM;aACjB;YACD,EAAE,EAAE;gBACF,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,MAAM;aACjB;YACD,SAAS,EAAE;gBACT,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,MAAM;aACjB;YACD,SAAS,EAAE;gBACT,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,MAAM;aACjB;YACD,SAAS,EAAE;gBACT,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,MAAM;aACjB;YACD,KAAK,EAAE;gBACL,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,MAAM;aACjB;YACD,KAAK,EAAE;gBACL,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,MAAM;aACjB;YACD,KAAK,EAAE;gBACL,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,MAAM;aACjB;YACD,IAAI,EAAE;gBACJ,UAAU,EAAE,GAAG;gBACf,QAAQ,EAAE,EAAE;gBACZ,KAAK,EAAE,QAAQ;aAChB;SACF;QACD,KAAK,EAAE;YACL,MAAM,EAAE;gBACN,KAAK,EAAE,aAAa;aACrB;YACD,eAAe,EAAE;gBACf,KAAK,EAAE,uBAAuB;aAC/B;YACD,KAAK,EAAE;gBACL,KAAK,EAAE,YAAY;aACpB;YACD,GAAG,EAAE;gBACH,KAAK,EAAE,OAAO;aACf;YACD,IAAI,EAAE;gBACJ,KAAK,EAAE,QAAQ;aAChB;YACD,OAAO,EAAE;gBACP,KAAK,EAAE,cAAc;aACtB;YACD,OAAO,EAAE;gBACP,KAAK,EAAE,SAAS;aACjB;YACD,gBAAgB,EAAE;gBAChB,KAAK,EAAE,SAAS;aACjB;SACF;QACD,MAAM,EAAE;YACN,IAAI,EAAE;gBACJ,SAAS,EAAE,QAAQ;aACpB;SACF;QACD,SAAS,EAAE;YACT,IAAI,EAAE;gBACJ,YAAY,EAAE,UAAU;gBACxB,QAAQ,EAAE,QAAQ;gBAClB,UAAU,EAAE,QAAQ;aACrB;SACF;KACF;CACF,CAAC,CAAA;AAIF,MAAM,IAAI,GAA4D,CAAC,EACrE,GAAG,EACH,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,EAAE;IACH,OAAO,CACL,gCAAK,SAAS,EAAE,IAAA,SAAS,EAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,YAC9D,QAAQ,GACL,CACP,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,IAAI,CAAA"}
+{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../../../src/components/primitives/Text.tsx"],"names":[],"mappings":";;;AAAA,uEAAiE;AAEjE,6CAAsC;AAEtC,MAAM,YAAY,GAAG,IAAA,8BAAG,EACtB,iBAAiB,EACjB;IACE,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,EAAE,EAAE,uDAAuD;YAC3D,EAAE,EAAE,mCAAmC;YACvC,EAAE,EAAE,mCAAmC;YACvC,EAAE,EAAE,mCAAmC;YACvC,EAAE,EAAE,mCAAmC;YACvC,EAAE,EAAE,mCAAmC;YACvC,SAAS,EAAE,qCAAqC;YAChD,SAAS,EAAE,qCAAqC;YAChD,SAAS,EAAE,qCAAqC;YAChD,KAAK,EAAE,qCAAqC;YAC5C,KAAK,EAAE,qCAAqC;YAC5C,KAAK,EAAE,qCAAqC;YAC5C,IAAI,EACF,mFAAmF;SACtF;QACD,KAAK,EAAE;YACL,OAAO,EAAE,qDAAqD;YAC9D,MAAM,EAAE,oDAAoD;YAC5D,eAAe,EACb,8DAA8D;YAChE,KAAK,EAAE,mDAAmD;YAC1D,GAAG,EAAE,8CAA8C;YACnD,IAAI,EAAE,+CAA+C;YACrD,OAAO,EAAE,qDAAqD;YAC9D,OAAO,EAAE,gDAAgD;YACzD,gBAAgB,EAAE,gDAAgD;YAClE,OAAO,EAAE,kDAAkD;YAC3D,SAAS,EAAE,kDAAkD;YAC7D,KAAK,EAAE,gDAAgD;YACvD,KAAK,EAAE,gDAAgD;SACxD;QACD,MAAM,EAAE;YACN,IAAI,EAAE,cAAc;SACrB;QACD,SAAS,EAAE;YACT,IAAI,EAAE,mEAAmE;SAC1E;KACF;IACD,eAAe,EAAE;QACf,KAAK,EAAE,SAAS;KACjB;CACF,CACF,CAAA;AAID,MAAM,IAAI,GAAsE,CAAC,EAC/E,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,EAAE;IACH,OAAO,CACL,gCAAK,SAAS,EAAE,IAAA,UAAE,EAAC,YAAY,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,YAC/C,QAAQ,GACL,CACP,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,IAAI,CAAA"}

package/_cjs/src/components/primitives/Tooltip.js

@@ -5,40 +5,12 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const TooltipPrimitive = tslib_1.__importStar(require("@radix-ui/react-tooltip"));
 const Popover = tslib_1.__importStar(require("@radix-ui/react-popover"));
 const usehooks_ts_1 = require("usehooks-ts");
-const Box_js_1 = tslib_1.__importDefault(require("./Box.js"));
-const css_1 = require("@relayprotocol/relay-design-system/css");
-const TooltipArrowStyle = (0, css_1.cva)({
-    base: {
-        fill: 'modal-background'
-    }
-});
-const PopoverArrow = (0, css_1.cva)({
-    base: {
-        fill: 'modal-background'
-    }
-});
 const Tooltip = ({ children, content, open, defaultOpen, onOpenChange, asChild = false, ...props }) => {
     const isSmallDevice = (0, usehooks_ts_1.useMediaQuery)('(max-width: 600px)');
     if (isSmallDevice) {
-        return ((0, jsx_runtime_1.jsxs)(Popover.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: onOpenChange, children: [(0, jsx_runtime_1.jsx)(Popover.Trigger, { asChild: asChild, children: children }), (0, jsx_runtime_1.jsxs)(Popover.Content, { sideOffset: 2, side: "bottom", align: "center", style: { zIndex: 10000003, outline: 'none', maxWidth: '100vw' }, ...props, children: [(0, jsx_runtime_1.jsx)(Popover.Arrow, { className: PopoverArrow() }), (0, jsx_runtime_1.jsx)(Box_js_1.default, { css: {
-                                zIndex: 10000004,
-                                boxShadow: '0px 1px 5px rgba(0,0,0,0.2)',
-                                borderRadius: 8,
-                                overflow: 'hidden'
-                            }, children: (0, jsx_runtime_1.jsx)(Box_js_1.default, { css: {
-                                    background: 'modal-background',
-                                    p: '2'
-                                }, children: content }) })] })] }));
+        return ((0, jsx_runtime_1.jsxs)(Popover.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: onOpenChange, children: [(0, jsx_runtime_1.jsx)(Popover.Trigger, { asChild: asChild, children: children }), (0, jsx_runtime_1.jsx)(Popover.Content, { sideOffset: 2, side: "bottom", align: "center", style: { zIndex: 10000003, outline: 'none', maxWidth: '100vw' }, ...props, children: (0, jsx_runtime_1.jsx)("div", { className: "relay:z-[10000004] relay:shadow-[0_2px_12px_rgba(0,0,0,0.12)] relay:rounded-[8px] relay:overflow-hidden relay:border-modal", children: (0, jsx_runtime_1.jsx)("div", { className: "relay:bg-[var(--relay-colors-modal-background)] relay:p-2", children: content }) }) })] }));
     }
-    return ((0, jsx_runtime_1.jsx)(TooltipPrimitive.Provider, { children: (0, jsx_runtime_1.jsxs)(TooltipPrimitive.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: onOpenChange, delayDuration: 250, children: [(0, jsx_runtime_1.jsx)(TooltipPrimitive.Trigger, { asChild: asChild, children: children }), (0, jsx_runtime_1.jsxs)(TooltipPrimitive.Content, { sideOffset: 2, side: "bottom", align: "center", style: { zIndex: 10000003 }, ...props, children: [(0, jsx_runtime_1.jsx)("div", { className: TooltipArrowStyle() }), (0, jsx_runtime_1.jsx)(Box_js_1.default, { css: {
-                                zIndex: 10000004,
-                                boxShadow: '0px 1px 5px rgba(0,0,0,0.2)',
-                                borderRadius: 8,
-                                overflow: 'hidden'
-                            }, children: (0, jsx_runtime_1.jsx)(Box_js_1.default, { css: {
-                                    background: 'modal-background',
-                                    p: '2'
-                                }, children: content }) })] })] }) }));
+    return ((0, jsx_runtime_1.jsx)(TooltipPrimitive.Provider, { children: (0, jsx_runtime_1.jsxs)(TooltipPrimitive.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: onOpenChange, delayDuration: 250, children: [(0, jsx_runtime_1.jsx)(TooltipPrimitive.Trigger, { asChild: asChild, children: children }), (0, jsx_runtime_1.jsx)(TooltipPrimitive.Content, { sideOffset: 2, side: "bottom", align: "center", style: { zIndex: 10000003 }, className: "relay:animate-content-fade-in", ...props, children: (0, jsx_runtime_1.jsx)("div", { className: "relay:z-[10000004] relay:shadow-[0_2px_12px_rgba(0,0,0,0.12)] relay:rounded-[8px] relay:overflow-hidden relay:border-modal", children: (0, jsx_runtime_1.jsx)("div", { className: "relay:bg-[var(--relay-colors-modal-background)] relay:p-2", children: content }) }) })] }) }));
 };
 exports.default = Tooltip;
 //# sourceMappingURL=Tooltip.js.map

package/_cjs/src/components/primitives/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../../src/components/primitives/Tooltip.tsx"],"names":[],"mappings":";;;;AAAA,kFAA2D;AAC3D,yEAAkD;AAClD,6CAA2C;AAC3C,8DAA0B;AAC1B,gEAA4D;AAE5D,MAAM,iBAAiB,GAAG,IAAA,SAAG,EAAC;IAC5B,IAAI,EAAE;QACJ,IAAI,EAAE,kBAAkB;KACzB;CACF,CAAC,CAAA;AAEF,MAAM,YAAY,GAAG,IAAA,SAAG,EAAC;IACvB,IAAI,EAAE;QACJ,IAAI,EAAE,kBAAkB;KACzB;CACF,CAAC,CAAA;AAEF,MAAM,OAAO,GAAG,CAAC,EACf,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,WAAW,EACX,YAAY,EACZ,OAAO,GAAG,KAAK,EACf,GAAG,KAAK,EACJ,EAAE,EAAE;IACR,MAAM,aAAa,GAAG,IAAA,2BAAa,EAAC,oBAAoB,CAAC,CAAA;IAEzD,IAAI,aAAa,EAAE,CAAC;QAClB,OAAO,CACL,wBAAC,OAAO,CAAC,IAAI,IACX,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,aAE1B,uBAAC,OAAO,CAAC,OAAO,IAAC,OAAO,EAAE,OAAO,YAAG,QAAQ,GAAmB,EAC/D,wBAAC,OAAO,CAAC,OAAO,IACd,UAAU,EAAE,CAAC,EACb,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,QAAQ,EACd,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,KAC3D,KAAK,aAET,uBAAC,OAAO,CAAC,KAAK,IAAC,SAAS,EAAE,YAAY,EAAE,GAAI,EAC5C,uBAAC,gBAAG,IACF,GAAG,EAAE;gCACH,MAAM,EAAE,QAAQ;gCAChB,SAAS,EAAE,6BAA6B;gCACxC,YAAY,EAAE,CAAC;gCACf,QAAQ,EAAE,QAAQ;6BACnB,YAED,uBAAC,gBAAG,IACF,GAAG,EAAE;oCACH,UAAU,EAAE,kBAAkB;oCAC9B,CAAC,EAAE,GAAG;iCACP,YAEA,OAAO,GACJ,GACF,IACU,IACL,CAChB,CAAA;IACH,CAAC;IACD,OAAO,CACL,uBAAC,gBAAgB,CAAC,QAAQ,cACxB,wBAAC,gBAAgB,CAAC,IAAI,IACpB,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,GAAG,aAElB,uBAAC,gBAAgB,CAAC,OAAO,IAAC,OAAO,EAAE,OAAO,YACvC,QAAQ,GACgB,EAC3B,wBAAC,gBAAgB,CAAC,OAAO,IACvB,UAAU,EAAE,CAAC,EACb,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,QAAQ,EACd,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,KACvB,KAAK,aAET,gCAAK,SAAS,EAAE,iBAAiB,EAAE,GAAQ,EAC3C,uBAAC,gBAAG,IACF,GAAG,EAAE;gCACH,MAAM,EAAE,QAAQ;gCAChB,SAAS,EAAE,6BAA6B;gCACxC,YAAY,EAAE,CAAC;gCACf,QAAQ,EAAE,QAAQ;6BACnB,YAED,uBAAC,gBAAG,IACF,GAAG,EAAE;oCACH,UAAU,EAAE,kBAAkB;oCAC9B,CAAC,EAAE,GAAG;iCACP,YAEA,OAAO,GACJ,GACF,IACmB,IACL,GACE,CAC7B,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,OAAO,CAAA"}
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../../src/components/primitives/Tooltip.tsx"],"names":[],"mappings":";;;;AAAA,kFAA2D;AAC3D,yEAAkD;AAClD,6CAA2C;AAG3C,MAAM,OAAO,GAAG,CAAC,EACf,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,WAAW,EACX,YAAY,EACZ,OAAO,GAAG,KAAK,EACf,GAAG,KAAK,EACJ,EAAE,EAAE;IACR,MAAM,aAAa,GAAG,IAAA,2BAAa,EAAC,oBAAoB,CAAC,CAAA;IAEzD,IAAI,aAAa,EAAE,CAAC;QAClB,OAAO,CACL,wBAAC,OAAO,CAAC,IAAI,IACX,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,aAE1B,uBAAC,OAAO,CAAC,OAAO,IAAC,OAAO,EAAE,OAAO,YAAG,QAAQ,GAAmB,EAC/D,uBAAC,OAAO,CAAC,OAAO,IACd,UAAU,EAAE,CAAC,EACb,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,QAAQ,EACd,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,KAC3D,KAAK,YAET,gCACE,SAAS,EAAC,4HAA4H,YAEtI,gCAAK,SAAS,EAAC,2DAA2D,YACvE,OAAO,GACJ,GACF,GACU,IACL,CAChB,CAAA;IACH,CAAC;IACD,OAAO,CACL,uBAAC,gBAAgB,CAAC,QAAQ,cACxB,wBAAC,gBAAgB,CAAC,IAAI,IACpB,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,GAAG,aAElB,uBAAC,gBAAgB,CAAC,OAAO,IAAC,OAAO,EAAE,OAAO,YACvC,QAAQ,GACgB,EAC3B,uBAAC,gBAAgB,CAAC,OAAO,IACvB,UAAU,EAAE,CAAC,EACb,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,QAAQ,EACd,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,EAC3B,SAAS,EAAC,+BAA+B,KACrC,KAAK,YAET,gCACE,SAAS,EAAC,4HAA4H,YAEtI,gCAAK,SAAS,EAAC,2DAA2D,YACvE,OAAO,GACJ,GACF,GACmB,IACL,GACE,CAC7B,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,OAAO,CAAA"}

package/_cjs/src/components/widgets/FeeBreakdown.js

@@ -10,11 +10,13 @@ const faGasPump_1 = require("@fortawesome/free-solid-svg-icons/faGasPump");
 const faChevronDown_1 = require("@fortawesome/free-solid-svg-icons/faChevronDown");
 const FetchingQuoteLoader_js_1 = tslib_1.__importDefault(require("../widgets/FetchingQuoteLoader.js"));
 const Collapsible_js_1 = require("../primitives/Collapsible.js");
-const free_solid_svg_icons_1 = require("@fortawesome/free-solid-svg-icons");
+const faClock_1 = require("@fortawesome/free-solid-svg-icons/faClock");
+const faInfoCircle_1 = require("@fortawesome/free-solid-svg-icons/faInfoCircle");
 const PriceImpactTooltip_js_1 = require("./PriceImpactTooltip.js");
 const slippage_js_1 = require("../../utils/slippage.js");
 const Tooltip_js_1 = tslib_1.__importDefault(require("../primitives/Tooltip.js"));
 const react_2 = tslib_1.__importDefault(require("react"));
+const cn_js_1 = require("../../utils/cn.js");
 const formatSwapRate = (rate) => {
     return rate >= 1 ? (0, numbers_js_1.formatBN)(rate, 2, 18, false) : (0, numbers_js_1.formatBN)(rate, 4, 18, false);
 };
@@ -46,107 +48,48 @@ const FeeBreakdown = ({ feeBreakdown, isFetchingQuote, quote, toToken, fromToken
     const breakdown = [
         {
             title: 'Estimated time',
-            value: ((0, jsx_runtime_1.jsxs)(index_js_1.Flex, { align: "center", css: {
-                    gap: '1',
+            value: ((0, jsx_runtime_1.jsxs)(index_js_1.Flex, { align: "center", className: "relay:gap-1", style: {
                     color: timeEstimate && timeEstimate.time <= 30
-                        ? '{colors.grass.9}'
-                        : '{colors.amber.9}'
-                }, children: [(0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faClock, width: 16 }), (0, jsx_runtime_1.jsxs)(index_js_1.Text, { style: "subtitle2", children: ["~ ", timeEstimate?.formattedTime] })] }))
+                        ? 'var(--relay-colors-grass-9)'
+                        : 'var(--relay-colors-amber-9)'
+                }, children: [(0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: faClock_1.faClock, width: 16 }), (0, jsx_runtime_1.jsxs)(index_js_1.Text, { style: "subtitle2", children: ["~ ", timeEstimate?.formattedTime] })] }))
         },
         {
             title: 'Network cost',
-            value: ((0, jsx_runtime_1.jsxs)(index_js_1.Flex, { align: "center", css: { gap: '1' }, children: [(0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: faGasPump_1.faGasPump, width: 16, style: { color: '#C1C8CD' } }), (0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", children: originGasFeeFormatted })] }))
+            value: ((0, jsx_runtime_1.jsxs)(index_js_1.Flex, { align: "center", className: "relay:gap-1", children: [(0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: faGasPump_1.faGasPump, width: 16, className: "relay:text-[#C1C8CD]" }), (0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", children: originGasFeeFormatted })] }))
         },
         {
             title: 'Price Impact',
-            value: ((0, jsx_runtime_1.jsx)(PriceImpactTooltip_js_1.PriceImpactTooltip, { feeBreakdown: feeBreakdown, tooltipProps: { side: 'top', align: 'end' }, children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)(index_js_1.Flex, { align: "center", css: { gap: '1', color: 'gray8' }, children: [(0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", css: {
-                                    color: isHighPriceImpact ? 'red11' : undefined
-                                }, children: feeBreakdown?.totalFees?.priceImpactPercentage }), (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faInfoCircle, width: 14, height: 14, style: {
-                                    display: 'inline-block',
-                                    marginLeft: 4
-                                } })] }) }) }))
+            value: ((0, jsx_runtime_1.jsx)(PriceImpactTooltip_js_1.PriceImpactTooltip, { feeBreakdown: feeBreakdown, tooltipProps: { side: 'top', align: 'end' }, children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)(index_js_1.Flex, { align: "center", className: "relay:gap-1 relay:text-[color:var(--relay-colors-gray8)]", children: [(0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", className: (0, cn_js_1.cn)(isHighPriceImpact &&
+                                    'relay:text-[color:var(--relay-colors-red11)]'), children: feeBreakdown?.totalFees?.priceImpactPercentage }), (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: faInfoCircle_1.faInfoCircle, width: 14, height: 14, className: "relay:inline-block relay:ml-[4px]" })] }) }) }))
         }
     ];
     if (!feeBreakdown) {
         if (isFetchingQuote) {
-            return ((0, jsx_runtime_1.jsx)(index_js_1.Box, { id: 'fee-breakdown-section', css: {
-                    borderRadius: 'widget-card-border-radius',
-                    backgroundColor: 'widget-background',
-                    border: 'widget-card-border',
-                    overflow: 'hidden',
-                    mb: 'widget-card-section-gutter'
-                }, children: (0, jsx_runtime_1.jsx)(FetchingQuoteLoader_js_1.default, { isLoading: isFetchingQuote, containerCss: {
-                        mt: 0,
-                        mb: 0,
-                        px: '4',
-                        py: '3',
-                        width: '100%',
-                        justifyContent: 'center'
-                    } }) }));
+            return ((0, jsx_runtime_1.jsx)(index_js_1.Box, { id: 'fee-breakdown-section', className: "relay:rounded-[var(--relay-radii-widget-card-border-radius)] relay:bg-[var(--relay-colors-widget-background)] relay:border-widget-card relay:overflow-hidden relay:mb-[var(--relay-spacing-widget-card-section-gutter)]", children: (0, jsx_runtime_1.jsx)("div", { className: "relay:mt-0 relay:mb-0 relay:px-3 relay:py-[12px] relay:w-full relay:flex relay:justify-center", children: (0, jsx_runtime_1.jsx)(FetchingQuoteLoader_js_1.default, { isLoading: isFetchingQuote, containerClassName: "relay:!my-0 relay:!py-0" }) }) }));
         }
         else {
             return null;
         }
     }
-    return ((0, jsx_runtime_1.jsxs)(index_js_1.Flex, { css: {
-            borderRadius: 'widget-card-border-radius',
-            borderBottomRadius: isOpen ? '0' : 'widget-card-border-radius',
-            backgroundColor: 'widget-background',
-            border: 'widget-card-border',
-            borderBottom: isOpen ? 'none' : 'widget-card-border',
-            overflow: 'hidden',
-            transition: 'border-radius 300ms, border-bottom 0s',
-            transitionDelay: isOpen ? '0s, 0s' : '0s, 300ms',
-            mb: 'widget-card-section-gutter'
-        }, direction: "column", children: [(0, jsx_runtime_1.jsxs)(index_js_1.Flex, { justify: "between", align: "center", css: { p: '3', pb: '0' }, children: [(0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", children: "Max Slippage" }), (0, jsx_runtime_1.jsxs)(index_js_1.Flex, { align: "center", css: { gap: '2' }, children: [isAutoSlippage ? ((0, jsx_runtime_1.jsx)(index_js_1.Button, { "aria-label": "Auto", css: {
-                                    fontSize: 12,
-                                    fontWeight: '500',
-                                    px: '1',
-                                    py: '1',
-                                    minHeight: '23px',
-                                    lineHeight: '100%',
-                                    backgroundColor: 'widget-selector-background',
-                                    border: 'none',
-                                    _hover: {
-                                        backgroundColor: 'widget-selector-hover-background'
-                                    }
-                                }, color: "white", onClick: (e) => {
+    return ((0, jsx_runtime_1.jsxs)(index_js_1.Flex, { className: "relay:rounded-[var(--relay-radii-widget-card-border-radius)] relay:bg-[var(--relay-colors-widget-background)] relay:overflow-hidden relay:mb-[var(--relay-spacing-widget-card-section-gutter)] relay:border-widget-card", direction: "column", children: [(0, jsx_runtime_1.jsxs)(index_js_1.Flex, { justify: "between", align: "center", className: "relay:p-3 relay:pb-0", children: [(0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", children: "Max Slippage" }), (0, jsx_runtime_1.jsxs)(index_js_1.Flex, { align: "center", className: "relay:gap-2", children: [isAutoSlippage ? ((0, jsx_runtime_1.jsx)(index_js_1.Button, { "aria-label": "Auto", className: "relay:font-medium relay:px-[6px] relay:py-[2px] relay:min-h-0 relay:leading-[20px] relay:bg-[var(--relay-colors-widget-selector-background)] relay:border-none relay:hover:bg-[var(--relay-colors-widget-selector-hover-background)]", style: { fontSize: '12px' }, color: "white", size: "none", onClick: (e) => {
                                     e.preventDefault();
                                     onOpenSlippageConfig?.();
-                                }, children: "Auto" })) : null, (0, jsx_runtime_1.jsx)(Tooltip_js_1.default, { side: "top", align: "end", content: minimumAmountFormatted ? ((0, jsx_runtime_1.jsxs)(index_js_1.Flex, { direction: "row", css: { gap: '2' }, children: [(0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", color: "subtle", children: "Min. received" }), (0, jsx_runtime_1.jsxs)(index_js_1.Text, { style: "subtitle2", children: [minimumAmountFormatted, " ", toToken?.symbol] })] })) : null, children: (0, jsx_runtime_1.jsxs)(index_js_1.Text, { style: "subtitle2", css: { color: slippageRatingColor }, children: [slippage, "%"] }) })] })] }), (0, jsx_runtime_1.jsxs)(Collapsible_js_1.CollapsibleRoot, { open: isOpen, onOpenChange: setIsOpen, children: [(0, jsx_runtime_1.jsx)(Collapsible_js_1.CollapsibleTrigger, { id: 'fee-breakdown-section', children: (0, jsx_runtime_1.jsxs)(index_js_1.Flex, { justify: "between", align: "center", css: {
-                                flexDirection: 'row',
-                                gap: '2',
-                                width: '100%',
-                                p: '3'
-                            }, children: [(0, jsx_runtime_1.jsx)("span", { style: {
-                                        cursor: 'pointer',
-                                        flexShrink: 1,
-                                        overflow: 'hidden',
-                                        height: 21
-                                    }, onClick: (e) => {
+                                }, children: "Auto" })) : null, (0, jsx_runtime_1.jsx)(Tooltip_js_1.default, { side: "top", align: "end", content: minimumAmountFormatted ? ((0, jsx_runtime_1.jsxs)(index_js_1.Flex, { direction: "row", className: "relay:gap-2", children: [(0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", color: "subtle", children: "Min. received" }), (0, jsx_runtime_1.jsxs)(index_js_1.Text, { style: "subtitle2", children: [minimumAmountFormatted, " ", toToken?.symbol] })] })) : null, children: (0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", children: (0, jsx_runtime_1.jsxs)("span", { style: {
+                                            color: slippageRatingColor
+                                                ? `var(--relay-colors-${slippageRatingColor})`
+                                                : undefined
+                                        }, children: [slippage, "%"] }) }) })] })] }), (0, jsx_runtime_1.jsxs)(Collapsible_js_1.CollapsibleRoot, { open: isOpen, onOpenChange: setIsOpen, children: [(0, jsx_runtime_1.jsx)(Collapsible_js_1.CollapsibleTrigger, { id: 'fee-breakdown-section', children: (0, jsx_runtime_1.jsxs)(index_js_1.Flex, { justify: "between", align: "center", className: "relay:flex-row relay:gap-2 relay:w-full relay:p-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "relay:cursor-pointer relay:shrink relay:overflow-hidden relay:h-[21px]", onClick: (e) => {
                                         setRateMode(rateMode === 'input' ? 'output' : 'input');
                                         e.preventDefault();
-                                    }, children: (0, jsx_runtime_1.jsx)(ConversionRate, { fromToken: fromToken, toToken: toToken, rate: Number(swapRate), isInputMode: rateMode === 'input' }) }), (0, jsx_runtime_1.jsxs)(index_js_1.Flex, { css: {
-                                        gap: '2',
+                                    }, children: (0, jsx_runtime_1.jsx)(ConversionRate, { fromToken: fromToken, toToken: toToken, rate: Number(swapRate), isInputMode: rateMode === 'input' }) }), (0, jsx_runtime_1.jsxs)(index_js_1.Flex, { className: "relay:gap-2 relay:shrink-0", style: {
                                         color: timeEstimate && timeEstimate.time <= 30
-                                            ? '{colors.grass.9}'
-                                            : '{colors.amber.9}',
-                                        flexShrink: 0
-                                    }, align: "center", children: [!isOpen && timeEstimate && timeEstimate?.time !== 0 ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faClock, width: 16 }), (0, jsx_runtime_1.jsxs)(index_js_1.Text, { style: "subtitle2", css: { flexShrink: 0 }, children: ["~ ", timeEstimate?.formattedTime] }), (0, jsx_runtime_1.jsx)(index_js_1.Flex, { justify: "center", align: "center", css: { color: 'gray6', height: 4 }, children: "\u2022" })] })) : null, !isOpen && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: faGasPump_1.faGasPump, width: 16, style: { color: '#C1C8CD' } }), (0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", css: { flexShrink: 0 }, children: originGasFeeFormatted })] })), (0, jsx_runtime_1.jsx)(index_js_1.Box, { css: {
-                                                marginLeft: '2',
-                                                transition: 'transform 300ms',
-                                                transform: isOpen ? 'rotate(-180deg)' : 'rotate(0)',
-                                                color: 'gray9'
-                                            }, children: (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: faChevronDown_1.faChevronDown, width: 12 }) })] })] }) }), (0, jsx_runtime_1.jsx)(Collapsible_js_1.CollapsibleContent, { css: {
-                            borderRadius: '0 0 12px 12px'
-                        }, children: (0, jsx_runtime_1.jsx)(index_js_1.Flex, { direction: "column", css: {
-                                px: '3',
-                                pb: '3',
-                                pt: '0',
-                                gap: '2',
-                                backgroundColor: 'widget-background'
-                            }, children: breakdown.map((item) => {
-                                return ((0, jsx_runtime_1.jsx)(react_2.default.Fragment, { children: (0, jsx_runtime_1.jsxs)(index_js_1.Flex, { justify: "between", align: "center", css: { width: '100%', gap: '4' }, children: [(0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", color: 'subtle', css: { alignSelf: 'flex-start' }, children: item.title }), item.value] }) }, item.title));
+                                            ? 'var(--relay-colors-grass-9)'
+                                            : 'var(--relay-colors-amber-9)'
+                                    }, align: "center", children: [!isOpen && timeEstimate && timeEstimate?.time !== 0 ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: faClock_1.faClock, width: 16 }), (0, jsx_runtime_1.jsxs)(index_js_1.Text, { style: "subtitle2", className: "relay:shrink-0", children: ["~ ", timeEstimate?.formattedTime] }), (0, jsx_runtime_1.jsx)(index_js_1.Flex, { justify: "center", align: "center", className: "relay:text-[color:var(--relay-colors-gray6)] relay:h-[4px]", children: "\u2022" })] })) : null, !isOpen && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: faGasPump_1.faGasPump, width: 16, className: "relay:text-[#C1C8CD]" }), (0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", className: "relay:shrink-0", children: originGasFeeFormatted })] })), (0, jsx_runtime_1.jsx)("div", { className: "relay:ml-2 relay:transition-transform relay:duration-300 relay:text-[color:var(--relay-colors-gray9)]", style: {
+                                                transform: isOpen ? 'rotate(-180deg)' : 'rotate(0)'
+                                            }, children: (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: faChevronDown_1.faChevronDown, width: 12 }) })] })] }) }), (0, jsx_runtime_1.jsx)(Collapsible_js_1.CollapsibleContent, { children: (0, jsx_runtime_1.jsx)(index_js_1.Flex, { direction: "column", className: "relay:px-3 relay:pb-3 relay:pt-0 relay:gap-2 relay:bg-[var(--relay-colors-widget-background)]", children: breakdown.map((item) => {
+                                return ((0, jsx_runtime_1.jsx)(react_2.default.Fragment, { children: (0, jsx_runtime_1.jsxs)(index_js_1.Flex, { justify: "between", align: "center", className: "relay:w-full relay:gap-4", children: [(0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", color: 'subtle', className: "relay:self-start", children: item.title }), item.value] }) }, item.title));
                             }) }) })] })] }));
 };
 exports.default = FeeBreakdown;
@@ -156,7 +99,7 @@ const ConversionRate = ({ fromToken, toToken, rate, isInputMode }) => {
     const toSymbol = isInputMode ? toToken?.symbol : fromToken?.symbol;
     const rateText = `1 ${fromSymbol} = ${formatSwapRate(displayRate)} ${toSymbol}`;
     const shouldShowTooltip = rateText.length > 22;
-    const content = ((0, jsx_runtime_1.jsx)("div", { style: { width: '100%', minWidth: 0 }, children: (0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", ellipsify: true, children: rateText }) }));
+    const content = ((0, jsx_runtime_1.jsx)("div", { className: "relay:w-full relay:min-w-0", children: (0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", ellipsify: true, children: rateText }) }));
     if (shouldShowTooltip) {
         return ((0, jsx_runtime_1.jsx)(Tooltip_js_1.default, { content: (0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", children: rateText }), asChild: true, children: content }));
     }

package/_cjs/src/components/widgets/FeeBreakdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"FeeBreakdown.js","sourceRoot":"","sources":["../../../../src/components/widgets/FeeBreakdown.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"FeeBreakdown.js","sourceRoot":"","sources":["../../../../src/components/widgets/FeeBreakdown.tsx"],"names":[],"mappings":";;;;AAAA,iCAAyC;AACzC,qDAAgE;AAEhE,uDAA+D;AAC/D,sEAAgE;AAChE,2EAAuE;AACvE,mFAA+E;AAC/E,uGAAmE;AAEnE,iEAIqC;AACrC,uEAAmE;AACnE,iFAA6E;AAC7E,mEAA4D;AAC5D,yDAA0E;AAC1E,kFAA8C;AAC9C,0DAAyB;AACzB,6CAAsC;AAoBtC,MAAM,cAAc,GAAG,CAAC,IAAY,EAAE,EAAE;IACtC,OAAO,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,IAAA,qBAAQ,EAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,IAAA,qBAAQ,EAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,KAAK,CAAC,CAAA;AAChF,CAAC,CAAA;AAED,MAAM,YAAY,GAAc,CAAC,EAC/B,YAAY,EACZ,eAAe,EACf,KAAK,EACL,OAAO,EACP,SAAS,EACT,OAAO,EACP,YAAY,EACZ,mBAAmB,EACnB,0BAA0B,EAC1B,cAAc,EACd,gBAAgB,EAChB,KAAK,EACL,oBAAoB,EACrB,EAAE,EAAE;IACH,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAA;IAC3C,MAAM,QAAQ,GAAG,KAAK,EAAE,OAAO,EAAE,IAAI,CAAA;IACrC,MAAM,WAAW,GAAG,KAAK,EAAE,OAAO,EAAE,WAAW,CAAA;IAC/C,MAAM,YAAY,GAAG,YAAY,EAAE,SAAS,EAAE,IAAI,CAChD,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,YAAY,CACjC,CAAA;IACD,MAAM,qBAAqB,GAAG,IAAA,yBAAY,EACxC,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC,CAAC,CACvC,CAAA;IAED,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,EAAqB,OAAO,CAAC,CAAA;IACrE,MAAM,iBAAiB,GAAG,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,OAAO,CAAC,GAAG,CAAC,GAAG,CAAA;IAE7E,MAAM,WAAW,GAAG,OAAO,EAAE,OAAO,KAAK,SAAS,EAAE,OAAO,CAAA;IAC3D,MAAM,uBAAuB,GAC3B,KAAK,EAAE,OAAO,EAAE,iBAAiB,EAAE,MAAM,EAAE,OAAO,CAAA;IACpD,MAAM,4BAA4B,GAChC,KAAK,EAAE,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,OAAO,CAAA;IACzD,MAAM,aAAa,GAAG,WAAW;QAC/B,CAAC,CAAC,GAAG;QACL,CAAC,CAAC,CAAC,CAAC,WAAW;YACX,CAAC,CAAC,4BAA4B,KAAK,GAAG;gBACpC,CAAC,CAAC,uBAAuB;gBACzB,CAAC,CAAC,4BAA4B;YAChC,CAAC,CAAC,4BAA4B,CAAC,IAAI,GAAG,CAAC,CAAA;IAC7C,MAAM,mBAAmB,GAAG,MAAM,CAChC,CAAC,MAAM,CAAC,gBAAgB,IAAI,GAAG,CAAC,GAAG,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CACnD,CAAA;IACD,MAAM,QAAQ,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,mBAAmB,CAAC,EAAE,CAAA;IAE1E,MAAM,cAAc,GAAG,IAAA,+BAAiB,EAAC,QAAQ,CAAC,CAAA;IAClD,MAAM,mBAAmB,GAAG,2BAAa,CAAC,cAAc,CAAC,CAAA;IACzD,MAAM,sBAAsB,GAAG,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,aAAa;QACvE,CAAC,CAAC,IAAA,qBAAQ,EACN,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,aAAa,EACvC,CAAC,EACD,OAAO,EAAE,QAAQ,EACjB,KAAK,CACN;QACH,CAAC,CAAC,SAAS,CAAA;IAEb,MAAM,SAAS,GAAG;QAChB;YACE,KAAK,EAAE,gBAAgB;YACvB,KAAK,EAAE,CACL,wBAAC,eAAI,IACH,KAAK,EAAC,QAAQ,EACd,SAAS,EAAC,aAAa,EACvB,KAAK,EAAE;oBACL,KAAK,EACH,YAAY,IAAI,YAAY,CAAC,IAAI,IAAI,EAAE;wBACrC,CAAC,CAAC,6BAA6B;wBAC/B,CAAC,CAAC,6BAA6B;iBACpC,aAED,uBAAC,mCAAe,IAAC,IAAI,EAAE,iBAAO,EAAE,KAAK,EAAE,EAAE,GAAI,EAC7C,wBAAC,eAAI,IAAC,KAAK,EAAC,WAAW,mBAAI,YAAY,EAAE,aAAa,IAAQ,IACzD,CACR;SACF;QACD;YACE,KAAK,EAAE,cAAc;YACrB,KAAK,EAAE,CACL,wBAAC,eAAI,IAAC,KAAK,EAAC,QAAQ,EAAC,SAAS,EAAC,aAAa,aAC1C,uBAAC,mCAAe,IACd,IAAI,EAAE,qBAAS,EACf,KAAK,EAAE,EAAE,EACT,SAAS,EAAC,sBAAsB,GAChC,EACF,uBAAC,eAAI,IAAC,KAAK,EAAC,WAAW,YAAE,qBAAqB,GAAQ,IACjD,CACR;SACF;QACD;YACE,KAAK,EAAE,cAAc;YACrB,KAAK,EAAE,CACL,uBAAC,0CAAkB,IACjB,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,YAGzC,0CACE,wBAAC,eAAI,IACH,KAAK,EAAC,QAAQ,EACd,SAAS,EAAC,0DAA0D,aAEpE,uBAAC,eAAI,IACH,KAAK,EAAC,WAAW,EACjB,SAAS,EAAE,IAAA,UAAE,EACX,iBAAiB;oCACf,8CAA8C,CACjD,YAEA,YAAY,EAAE,SAAS,EAAE,qBAAqB,GAC1C,EACP,uBAAC,mCAAe,IACd,IAAI,EAAE,2BAAY,EAClB,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EACV,SAAS,EAAC,mCAAmC,GAC7C,IACG,GACH,GAEW,CACtB;SACF;KACF,CAAA;IAED,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,IAAI,eAAe,EAAE,CAAC;YACpB,OAAO,CACL,uBAAC,cAAG,IACF,EAAE,EAAE,uBAAuB,EAC3B,SAAS,EAAC,yNAAyN,YAEnO,gCAAK,SAAS,EAAC,+FAA+F,YAC5G,uBAAC,gCAAmB,IAAC,SAAS,EAAE,eAAe,EAAE,kBAAkB,EAAC,yBAAyB,GAAG,GAC5F,GACF,CACP,CAAA;QACH,CAAC;aAAM,CAAC;YACN,OAAO,IAAI,CAAA;QACb,CAAC;IACH,CAAC;IAED,OAAO,CACL,wBAAC,eAAI,IACH,SAAS,EAAC,yNAAyN,EACnO,SAAS,EAAC,QAAQ,aAElB,wBAAC,eAAI,IAAC,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAC,SAAS,EAAC,sBAAsB,aACrE,uBAAC,eAAI,IAAC,KAAK,EAAC,WAAW,6BAAoB,EAC3C,wBAAC,eAAI,IAAC,KAAK,EAAC,QAAQ,EAAC,SAAS,EAAC,aAAa,aACzC,cAAc,CAAC,CAAC,CAAC,CAChB,uBAAC,iBAAM,kBACM,MAAM,EACjB,SAAS,EAAC,sOAAsO,EAChP,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,EAC3B,KAAK,EAAC,OAAO,EACb,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oCACb,CAAC,CAAC,cAAc,EAAE,CAAA;oCAClB,oBAAoB,EAAE,EAAE,CAAA;gCAC1B,CAAC,qBAGM,CACV,CAAC,CAAC,CAAC,IAAI,EACR,uBAAC,oBAAO,IACN,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,KAAK,EACX,OAAO,EACL,sBAAsB,CAAC,CAAC,CAAC,CACvB,wBAAC,eAAI,IAAC,SAAS,EAAC,KAAK,EAAC,SAAS,EAAC,aAAa,aAC3C,uBAAC,eAAI,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,QAAQ,8BAE/B,EACP,wBAAC,eAAI,IAAC,KAAK,EAAC,WAAW,aACpB,sBAAsB,OAAG,OAAO,EAAE,MAAM,IACpC,IACF,CACR,CAAC,CAAC,CAAC,IAAI,YAGV,uBAAC,eAAI,IAAC,KAAK,EAAC,WAAW,YACrB,kCACE,KAAK,EAAE;4CACL,KAAK,EAAE,mBAAmB;gDACxB,CAAC,CAAC,sBAAsB,mBAAmB,GAAG;gDAC9C,CAAC,CAAC,SAAS;yCACd,aAEA,QAAQ,SACJ,GACF,GACC,IACL,IACF,EACP,wBAAC,gCAAe,IAAC,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,SAAS,aACpD,uBAAC,mCAAkB,IAAC,EAAE,EAAE,uBAAuB,YAC7C,wBAAC,eAAI,IACH,OAAO,EAAC,SAAS,EACjB,KAAK,EAAC,QAAQ,EACd,SAAS,EAAC,mDAAmD,aAE7D,iCACE,SAAS,EAAC,wEAAwE,EAClF,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;wCACb,WAAW,CAAC,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAA;wCACtD,CAAC,CAAC,cAAc,EAAE,CAAA;oCACpB,CAAC,YAED,uBAAC,cAAc,IACb,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,MAAM,CAAC,QAAQ,CAAC,EACtB,WAAW,EAAE,QAAQ,KAAK,OAAO,GACjC,GACG,EAEP,wBAAC,eAAI,IACH,SAAS,EAAC,4BAA4B,EACtC,KAAK,EAAE;wCACL,KAAK,EACH,YAAY,IAAI,YAAY,CAAC,IAAI,IAAI,EAAE;4CACrC,CAAC,CAAC,6BAA6B;4CAC/B,CAAC,CAAC,6BAA6B;qCACpC,EACD,KAAK,EAAC,QAAQ,aAEb,CAAC,MAAM,IAAI,YAAY,IAAI,YAAY,EAAE,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,CACrD,6DACE,uBAAC,mCAAe,IAAC,IAAI,EAAE,iBAAO,EAAE,KAAK,EAAE,EAAE,GAAI,EAC7C,wBAAC,eAAI,IAAC,KAAK,EAAC,WAAW,EAAC,SAAS,EAAC,gBAAgB,mBAC7C,YAAY,EAAE,aAAa,IACzB,EACP,uBAAC,eAAI,IACH,OAAO,EAAC,QAAQ,EAChB,KAAK,EAAC,QAAQ,EACd,SAAS,EAAC,4DAA4D,uBAGjE,IACN,CACJ,CAAC,CAAC,CAAC,IAAI,EACP,CAAC,MAAM,IAAI,CACV,6DACE,uBAAC,mCAAe,IACd,IAAI,EAAE,qBAAS,EACf,KAAK,EAAE,EAAE,EACT,SAAS,EAAC,sBAAsB,GAChC,EACF,uBAAC,eAAI,IAAC,KAAK,EAAC,WAAW,EAAC,SAAS,EAAC,gBAAgB,YAC/C,qBAAqB,GACjB,IACN,CACJ,EACD,gCACE,SAAS,EAAC,uGAAuG,EACjH,KAAK,EAAE;gDACL,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,WAAW;6CACpD,YAED,uBAAC,mCAAe,IAAC,IAAI,EAAE,6BAAa,EAAE,KAAK,EAAE,EAAE,GAAI,GAC/C,IACD,IACF,GACY,EACrB,uBAAC,mCAAkB,cACjB,uBAAC,eAAI,IACH,SAAS,EAAC,QAAQ,EAClB,SAAS,EAAC,+FAA+F,YAExG,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;gCACtB,OAAO,CACL,uBAAC,eAAK,CAAC,QAAQ,cACb,wBAAC,eAAI,IACH,OAAO,EAAC,SAAS,EACjB,KAAK,EAAC,QAAQ,EACd,SAAS,EAAC,0BAA0B,aAEpC,uBAAC,eAAI,IACH,KAAK,EAAC,WAAW,EACjB,KAAK,EAAE,QAAQ,EACf,SAAS,EAAC,kBAAkB,YAE3B,IAAI,CAAC,KAAK,GACN,EACN,IAAI,CAAC,KAAK,IACN,IAdY,IAAI,CAAC,KAAK,CAed,CAClB,CAAA;4BACH,CAAC,CAAC,GACG,GACY,IACL,IACb,CACR,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,YAAY,CAAA;AAS3B,MAAM,cAAc,GAA4B,CAAC,EAC/C,SAAS,EACT,OAAO,EACP,IAAI,EACJ,WAAW,EACZ,EAAE,EAAE;IACH,MAAM,WAAW,GAAG,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAA;IACjD,MAAM,UAAU,GAAG,WAAW,CAAC,CAAC,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,OAAO,EAAE,MAAM,CAAA;IACpE,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,SAAS,EAAE,MAAM,CAAA;IAElE,MAAM,QAAQ,GAAG,KAAK,UAAU,MAAM,cAAc,CAAC,WAAW,CAAC,IAAI,QAAQ,EAAE,CAAA;IAC/E,MAAM,iBAAiB,GAAG,QAAQ,CAAC,MAAM,GAAG,EAAE,CAAA;IAE9C,MAAM,OAAO,GAAG,CACd,gCAAK,SAAS,EAAC,4BAA4B,YACzC,uBAAC,eAAI,IAAC,KAAK,EAAC,WAAW,EAAC,SAAS,kBAC9B,QAAQ,GACJ,GACH,CACP,CAAA;IAED,IAAI,iBAAiB,EAAE,CAAC;QACtB,OAAO,CACL,uBAAC,oBAAO,IACN,OAAO,EAAE,uBAAC,eAAI,IAAC,KAAK,EAAC,WAAW,YAAE,QAAQ,GAAQ,EAClD,OAAO,EAAE,IAAI,YAEZ,OAAO,GACA,CACX,CAAA;IACH,CAAC;IAED,OAAO,OAAO,CAAA;AAChB,CAAC,CAAA"}

package/_cjs/src/components/widgets/FetchingQuoteLoader.js

@@ -3,18 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 const index_js_1 = require("../primitives/index.js");
 const LoadingSpinner_js_1 = require("../common/LoadingSpinner.js");
-const FetchingQuoteLoader = ({ isLoading, containerCss }) => {
+const cn_js_1 = require("../../utils/cn.js");
+const FetchingQuoteLoader = ({ isLoading, containerClassName }) => {
     if (!isLoading) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(index_js_1.Flex, { align: "center", css: {
-            gap: 14,
-            mb: '3',
-            mt: '1',
-            p: '3 0',
-            m: '0 auto',
-            ...containerCss
-        }, children: [(0, jsx_runtime_1.jsx)(LoadingSpinner_js_1.LoadingSpinner, { css: { height: 16, width: 16 } }), (0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", children: "Fetching the best price" })] }));
+    return ((0, jsx_runtime_1.jsxs)(index_js_1.Flex, { align: "center", className: (0, cn_js_1.cn)('relay:gap-[14px] relay:mb-3 relay:mt-1 relay:py-3 relay:mx-auto', containerClassName), children: [(0, jsx_runtime_1.jsx)(LoadingSpinner_js_1.LoadingSpinner, { className: "relay:h-4 relay:w-4" }), (0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle2", children: "Fetching the best price" })] }));
 };
 exports.default = FetchingQuoteLoader;
 //# sourceMappingURL=FetchingQuoteLoader.js.map