@relayprotocol/relay-kit-ui 7.1.6 → 8.0.1

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

@@ -1,49 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as Switch from '@radix-ui/react-switch';
-import { cva, css as designCss } from '@relayprotocol/relay-design-system/css';
 import { forwardRef } from 'react';
-const StyledSwitchCss = 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'
-        }
-    }
+import { cn } from '../../utils/cn.js';
+export const StyledSwitch = forwardRef(({ children, className, ...props }, forwardedRef) => {
+    return (_jsx(Switch.Root, { ref: forwardedRef, ...props, className: 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 }));
 });
-export const StyledSwitch = forwardRef(({ children, css, ...props }, forwardedRef) => {
-    return (_jsx(Switch.Root, { ref: forwardedRef, ...props, className: designCss(StyledSwitchCss.raw(), designCss.raw(css)), children: children }));
-});
-const StyledThumbCss = 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)'
-        }
-    }
-});
-export const StyledThumb = forwardRef(({ children, css, ...props }, forwardedRef) => {
-    return (_jsx(Switch.Thumb, { ref: forwardedRef, ...props, className: designCss(StyledThumbCss.raw(), designCss.raw(css)) }));
+export const StyledThumb = forwardRef(({ children, className, ...props }, forwardedRef) => {
+    return (_jsx(Switch.Thumb, { ref: forwardedRef, ...props, className: 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/_esm/src/components/primitives/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../../src/components/primitives/Switch.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,MAAM,wBAAwB,CAAA;AAChD,OAAO,EACL,GAAG,EACH,GAAG,IAAI,SAAS,EAEjB,MAAM,wCAAwC,CAAA;AAC/C,OAAO,EAEL,UAAU,EAEX,MAAM,OAAO,CAAA;AAEd,MAAM,eAAe,GAAG,GAAG,CAAC;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;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CAGpC,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC9C,OAAO,CACL,KAAC,MAAM,CAAC,IAAI,IACV,GAAG,EAAE,YAAY,KACb,KAAK,EACT,SAAS,EAAE,SAAS,CAAC,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,GAAG,CAAC;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;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CAGnC,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC9C,OAAO,CACL,KAAC,MAAM,CAAC,KAAK,IACX,GAAG,EAAE,YAAY,KACb,KAAK,EACT,SAAS,EAAE,SAAS,CAAC,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,OAAO,KAAK,MAAM,MAAM,wBAAwB,CAAA;AAChD,OAAO,EAEL,UAAU,EAEX,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAEtC,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CAGpC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IACpD,OAAO,CACL,KAAC,MAAM,CAAC,IAAI,IACV,GAAG,EAAE,YAAY,KACb,KAAK,EACT,SAAS,EAAE,EAAE,CACX,oDAAoD,EACpD,yDAAyD,EACzD,8DAA8D,EAC9D,yCAAyC,EACzC,iFAAiF,EACjF,SAAS,CACV,YAEA,QAAQ,GACG,CACf,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CAGnC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IACpD,OAAO,CACL,KAAC,MAAM,CAAC,KAAK,IACX,GAAG,EAAE,YAAY,KACb,KAAK,EACT,SAAS,EAAE,EAAE,CACX,+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/_esm/src/components/primitives/Tabs.js

@@ -1,48 +1,18 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as TabsPrimitive from '@radix-ui/react-tabs';
-import { cva, css as designCss } from '@relayprotocol/relay-design-system/css';
 import { forwardRef } from 'react';
-const TabsListCss = cva({
-    base: {
-        display: 'flex',
-        alignItems: 'center',
-        borderRadius: 8,
-        p: '1',
-        backgroundColor: 'gray2',
-        border: 'none'
-    }
+import { cn } from '../../utils/cn.js';
+const TabsList = forwardRef(({ children, className, ...props }, forwardedRef) => {
+    return (_jsx(TabsPrimitive.List, { ...props, ref: forwardedRef, className: cn('relay:flex relay:items-center relay:rounded-[8px] relay:p-1', 'relay:bg-[var(--relay-colors-gray2)] relay:border-none', className), children: children }));
 });
-const TabsTriggerCss = 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 TabsTrigger = forwardRef(({ children, className, ...props }, forwardedRef) => {
+    return (_jsx(TabsPrimitive.Trigger, { ...props, ref: forwardedRef, className: 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 }));
 });
-const TabsList = forwardRef(({ children, css, ...props }, forwardedRef) => {
-    return (_jsx(TabsPrimitive.List, { ...props, ref: forwardedRef, className: designCss(TabsListCss.raw(), designCss.raw(css)), children: children }));
+const TabsContent = forwardRef(({ children, className, ...props }, forwardedRef) => {
+    return (_jsx(TabsPrimitive.Content, { ...props, ref: forwardedRef, className: cn(className), children: children }));
 });
-const TabsTrigger = forwardRef(({ children, css, ...props }, forwardedRef) => {
-    return (_jsx(TabsPrimitive.Trigger, { ...props, ref: forwardedRef, className: designCss(TabsTriggerCss.raw(), designCss.raw(css)), children: children }));
-});
-const TabsContent = forwardRef(({ children, css, ...props }, forwardedRef) => {
-    return (_jsx(TabsPrimitive.Content, { ...props, ref: forwardedRef, className: designCss(designCss.raw(css)), children: children }));
-});
-const TabsRoot = forwardRef(({ children, css, ...props }, forwardedRef) => {
-    return (_jsx(TabsPrimitive.Root, { ...props, ref: forwardedRef, className: designCss(designCss.raw(css)), children: children }));
+const TabsRoot = forwardRef(({ children, className, ...props }, forwardedRef) => {
+    return (_jsx(TabsPrimitive.Root, { ...props, ref: forwardedRef, className: cn(className), children: children }));
 });
 export { TabsRoot, TabsList, TabsTrigger, TabsContent };
 //# sourceMappingURL=Tabs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../../src/components/primitives/Tabs.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,aAAa,MAAM,sBAAsB,CAAA;AACrD,OAAO,EACL,GAAG,EACH,GAAG,IAAI,SAAS,EAEjB,MAAM,wCAAwC,CAAA;AAC/C,OAAO,EACL,UAAU,EAGX,MAAM,OAAO,CAAA;AAEd,MAAM,WAAW,GAAG,GAAG,CAAC;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,GAAG,CAAC;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,UAAU,CAKzB,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC9C,OAAO,CACL,KAAC,aAAa,CAAC,IAAI,OACb,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,SAAS,CAAC,WAAW,CAAC,GAAG,EAAE,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,YAE1D,QAAQ,GACU,CACtB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,WAAW,GAAG,UAAU,CAK5B,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC9C,OAAO,CACL,KAAC,aAAa,CAAC,OAAO,OAChB,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,GAAG,EAAE,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,YAE7D,QAAQ,GACa,CACzB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,WAAW,GAAG,UAAU,CAK5B,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC9C,OAAO,CACL,KAAC,aAAa,CAAC,OAAO,OAChB,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,SAAS,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,YAEvC,QAAQ,GACa,CACzB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,QAAQ,GAAG,UAAU,CAKzB,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC9C,OAAO,CACL,KAAC,aAAa,CAAC,IAAI,OACb,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,SAAS,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,YAEvC,QAAQ,GACU,CACtB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,CAAA"}
+{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../../src/components/primitives/Tabs.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,aAAa,MAAM,sBAAsB,CAAA;AACrD,OAAO,EACL,UAAU,EAGX,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAEtC,MAAM,QAAQ,GAAG,UAAU,CAKzB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IACpD,OAAO,CACL,KAAC,aAAa,CAAC,IAAI,OACb,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,EAAE,CACX,6DAA6D,EAC7D,wDAAwD,EACxD,SAAS,CACV,YAEA,QAAQ,GACU,CACtB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,WAAW,GAAG,UAAU,CAK5B,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IACpD,OAAO,CACL,KAAC,aAAa,CAAC,OAAO,OAChB,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,EAAE,CACX,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;AAEF,MAAM,WAAW,GAAG,UAAU,CAK5B,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IACpD,OAAO,CACL,KAAC,aAAa,CAAC,OAAO,OAChB,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,EAAE,CAAC,SAAS,CAAC,YAEvB,QAAQ,GACa,CACzB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,QAAQ,GAAG,UAAU,CAKzB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IACpD,OAAO,CACL,KAAC,aAAa,CAAC,IAAI,OACb,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,EAAE,CAAC,SAAS,CAAC,YAEvB,QAAQ,GACU,CACtB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,CAAA"}

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

@@ -1,109 +1,51 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { cva, css as designCss } from '@relayprotocol/relay-design-system/css';
-const TextCss = cva({
-    base: {
-        color: 'text-default',
-        fontFamily: 'body'
-    },
+import { cva } from 'class-variance-authority';
+import { cn } from '../../utils/cn.js';
+const textVariants = 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 (_jsx("div", { className: designCss(TextCss.raw(props), designCss.raw(css)), children: children }));
+const Text = ({ className, children, ...props }) => {
+    return (_jsx("div", { className: cn(textVariants(props), className), children: children }));
 };
 export default Text;
 //# sourceMappingURL=Text.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../../../src/components/primitives/Text.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,GAAG,EACH,GAAG,IAAI,SAAS,EAEjB,MAAM,wCAAwC,CAAA;AAG/C,MAAM,OAAO,GAAG,GAAG,CAAC;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,cAAK,SAAS,EAAE,SAAS,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,YAC9D,QAAQ,GACL,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,IAAI,CAAA"}
+{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../../../src/components/primitives/Text.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAA;AAEjE,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAEtC,MAAM,YAAY,GAAG,GAAG,CACtB,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,cAAK,SAAS,EAAE,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,YAC/C,QAAQ,GACL,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,IAAI,CAAA"}

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

@@ -2,40 +2,13 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import * as Popover from '@radix-ui/react-popover';
 import { useMediaQuery } from 'usehooks-ts';
-import Box from './Box.js';
-import { cva } from '@relayprotocol/relay-design-system/css';
-const TooltipArrowStyle = cva({
-    base: {
-        fill: 'modal-background'
-    }
-});
-const PopoverArrow = cva({
-    base: {
-        fill: 'modal-background'
-    }
-});
+import { cn } from '../../utils/cn.js';
 const Tooltip = ({ children, content, open, defaultOpen, onOpenChange, asChild = false, ...props }) => {
     const isSmallDevice = useMediaQuery('(max-width: 600px)');
     if (isSmallDevice) {
-        return (_jsxs(Popover.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: onOpenChange, children: [_jsx(Popover.Trigger, { asChild: asChild, children: children }), _jsxs(Popover.Content, { sideOffset: 2, side: "bottom", align: "center", style: { zIndex: 10000003, outline: 'none', maxWidth: '100vw' }, ...props, children: [_jsx(Popover.Arrow, { className: PopoverArrow() }), _jsx(Box, { css: {
-                                zIndex: 10000004,
-                                boxShadow: '0px 1px 5px rgba(0,0,0,0.2)',
-                                borderRadius: 8,
-                                overflow: 'hidden'
-                            }, children: _jsx(Box, { css: {
-                                    background: 'modal-background',
-                                    p: '2'
-                                }, children: content }) })] })] }));
+        return (_jsxs(Popover.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: onOpenChange, children: [_jsx(Popover.Trigger, { asChild: asChild, children: children }), _jsx(Popover.Content, { sideOffset: 2, side: "bottom", align: "center", style: { zIndex: 10000003, outline: 'none', maxWidth: '100vw' }, ...props, children: _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: _jsx("div", { className: "relay:bg-[var(--relay-colors-modal-background)] relay:p-2", children: content }) }) })] }));
     }
-    return (_jsx(TooltipPrimitive.Provider, { children: _jsxs(TooltipPrimitive.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: onOpenChange, delayDuration: 250, children: [_jsx(TooltipPrimitive.Trigger, { asChild: asChild, children: children }), _jsxs(TooltipPrimitive.Content, { sideOffset: 2, side: "bottom", align: "center", style: { zIndex: 10000003 }, ...props, children: [_jsx("div", { className: TooltipArrowStyle() }), _jsx(Box, { css: {
-                                zIndex: 10000004,
-                                boxShadow: '0px 1px 5px rgba(0,0,0,0.2)',
-                                borderRadius: 8,
-                                overflow: 'hidden'
-                            }, children: _jsx(Box, { css: {
-                                    background: 'modal-background',
-                                    p: '2'
-                                }, children: content }) })] })] }) }));
+    return (_jsx(TooltipPrimitive.Provider, { children: _jsxs(TooltipPrimitive.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: onOpenChange, delayDuration: 250, children: [_jsx(TooltipPrimitive.Trigger, { asChild: asChild, children: children }), _jsx(TooltipPrimitive.Content, { sideOffset: 2, side: "bottom", align: "center", style: { zIndex: 10000003 }, className: "relay:animate-content-fade-in", ...props, children: _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: _jsx("div", { className: "relay:bg-[var(--relay-colors-modal-background)] relay:p-2", children: content }) }) })] }) }));
 };
 export default Tooltip;
 //# sourceMappingURL=Tooltip.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../../src/components/primitives/Tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,gBAAgB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,KAAK,OAAO,MAAM,yBAAyB,CAAA;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAC3C,OAAO,GAAG,MAAM,UAAU,CAAA;AAC1B,OAAO,EAAE,GAAG,EAAE,MAAM,wCAAwC,CAAA;AAE5D,MAAM,iBAAiB,GAAG,GAAG,CAAC;IAC5B,IAAI,EAAE;QACJ,IAAI,EAAE,kBAAkB;KACzB;CACF,CAAC,CAAA;AAEF,MAAM,YAAY,GAAG,GAAG,CAAC;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,aAAa,CAAC,oBAAoB,CAAC,CAAA;IAEzD,IAAI,aAAa,EAAE,CAAC;QAClB,OAAO,CACL,MAAC,OAAO,CAAC,IAAI,IACX,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,aAE1B,KAAC,OAAO,CAAC,OAAO,IAAC,OAAO,EAAE,OAAO,YAAG,QAAQ,GAAmB,EAC/D,MAAC,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,KAAC,OAAO,CAAC,KAAK,IAAC,SAAS,EAAE,YAAY,EAAE,GAAI,EAC5C,KAAC,GAAG,IACF,GAAG,EAAE;gCACH,MAAM,EAAE,QAAQ;gCAChB,SAAS,EAAE,6BAA6B;gCACxC,YAAY,EAAE,CAAC;gCACf,QAAQ,EAAE,QAAQ;6BACnB,YAED,KAAC,GAAG,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,KAAC,gBAAgB,CAAC,QAAQ,cACxB,MAAC,gBAAgB,CAAC,IAAI,IACpB,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,GAAG,aAElB,KAAC,gBAAgB,CAAC,OAAO,IAAC,OAAO,EAAE,OAAO,YACvC,QAAQ,GACgB,EAC3B,MAAC,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,cAAK,SAAS,EAAE,iBAAiB,EAAE,GAAQ,EAC3C,KAAC,GAAG,IACF,GAAG,EAAE;gCACH,MAAM,EAAE,QAAQ;gCAChB,SAAS,EAAE,6BAA6B;gCACxC,YAAY,EAAE,CAAC;gCACf,QAAQ,EAAE,QAAQ;6BACnB,YAED,KAAC,GAAG,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,eAAe,OAAO,CAAA"}
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../../src/components/primitives/Tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,gBAAgB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,KAAK,OAAO,MAAM,yBAAyB,CAAA;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAC3C,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAEtC,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,aAAa,CAAC,oBAAoB,CAAC,CAAA;IAEzD,IAAI,aAAa,EAAE,CAAC;QAClB,OAAO,CACL,MAAC,OAAO,CAAC,IAAI,IACX,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,aAE1B,KAAC,OAAO,CAAC,OAAO,IAAC,OAAO,EAAE,OAAO,YAAG,QAAQ,GAAmB,EAC/D,KAAC,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,cACE,SAAS,EAAC,4HAA4H,YAEtI,cAAK,SAAS,EAAC,2DAA2D,YACvE,OAAO,GACJ,GACF,GACU,IACL,CAChB,CAAA;IACH,CAAC;IACD,OAAO,CACL,KAAC,gBAAgB,CAAC,QAAQ,cACxB,MAAC,gBAAgB,CAAC,IAAI,IACpB,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,GAAG,aAElB,KAAC,gBAAgB,CAAC,OAAO,IAAC,OAAO,EAAE,OAAO,YACvC,QAAQ,GACgB,EAC3B,KAAC,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,cACE,SAAS,EAAC,4HAA4H,YAEtI,cAAK,SAAS,EAAC,2DAA2D,YACvE,OAAO,GACJ,GACF,GACmB,IACL,GACE,CAC7B,CAAA;AACH,CAAC,CAAA;AAED,eAAe,OAAO,CAAA"}

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

@@ -7,11 +7,13 @@ import { faGasPump } from '@fortawesome/free-solid-svg-icons/faGasPump';
 import { faChevronDown } from '@fortawesome/free-solid-svg-icons/faChevronDown';
 import FetchingQuoteLoader from '../widgets/FetchingQuoteLoader.js';
 import { CollapsibleContent, CollapsibleRoot, CollapsibleTrigger } from '../primitives/Collapsible.js';
-import { faClock, faInfoCircle } from '@fortawesome/free-solid-svg-icons';
+import { faClock } from '@fortawesome/free-solid-svg-icons/faClock';
+import { faInfoCircle } from '@fortawesome/free-solid-svg-icons/faInfoCircle';
 import { PriceImpactTooltip } from './PriceImpactTooltip.js';
 import { getSlippageRating, ratingToColor } from '../../utils/slippage.js';
 import Tooltip from '../primitives/Tooltip.js';
 import React from 'react';
+import { cn } from '../../utils/cn.js';
 const formatSwapRate = (rate) => {
     return rate >= 1 ? formatBN(rate, 2, 18, false) : formatBN(rate, 4, 18, false);
 };
@@ -43,107 +45,48 @@ const FeeBreakdown = ({ feeBreakdown, isFetchingQuote, quote, toToken, fromToken
     const breakdown = [
         {
             title: 'Estimated time',
-            value: (_jsxs(Flex, { align: "center", css: {
-                    gap: '1',
+            value: (_jsxs(Flex, { align: "center", className: "relay:gap-1", style: {
                     color: timeEstimate && timeEstimate.time <= 30
-                        ? '{colors.grass.9}'
-                        : '{colors.amber.9}'
+                        ? 'var(--relay-colors-grass-9)'
+                        : 'var(--relay-colors-amber-9)'
                 }, children: [_jsx(FontAwesomeIcon, { icon: faClock, width: 16 }), _jsxs(Text, { style: "subtitle2", children: ["~ ", timeEstimate?.formattedTime] })] }))
         },
         {
             title: 'Network cost',
-            value: (_jsxs(Flex, { align: "center", css: { gap: '1' }, children: [_jsx(FontAwesomeIcon, { icon: faGasPump, width: 16, style: { color: '#C1C8CD' } }), _jsx(Text, { style: "subtitle2", children: originGasFeeFormatted })] }))
+            value: (_jsxs(Flex, { align: "center", className: "relay:gap-1", children: [_jsx(FontAwesomeIcon, { icon: faGasPump, width: 16, className: "relay:text-[#C1C8CD]" }), _jsx(Text, { style: "subtitle2", children: originGasFeeFormatted })] }))
         },
         {
             title: 'Price Impact',
-            value: (_jsx(PriceImpactTooltip, { feeBreakdown: feeBreakdown, tooltipProps: { side: 'top', align: 'end' }, children: _jsx("div", { children: _jsxs(Flex, { align: "center", css: { gap: '1', color: 'gray8' }, children: [_jsx(Text, { style: "subtitle2", css: {
-                                    color: isHighPriceImpact ? 'red11' : undefined
-                                }, children: feeBreakdown?.totalFees?.priceImpactPercentage }), _jsx(FontAwesomeIcon, { icon: faInfoCircle, width: 14, height: 14, style: {
-                                    display: 'inline-block',
-                                    marginLeft: 4
-                                } })] }) }) }))
+            value: (_jsx(PriceImpactTooltip, { feeBreakdown: feeBreakdown, tooltipProps: { side: 'top', align: 'end' }, children: _jsx("div", { children: _jsxs(Flex, { align: "center", className: "relay:gap-1 relay:text-[color:var(--relay-colors-gray8)]", children: [_jsx(Text, { style: "subtitle2", className: cn(isHighPriceImpact &&
+                                    'relay:text-[color:var(--relay-colors-red11)]'), children: feeBreakdown?.totalFees?.priceImpactPercentage }), _jsx(FontAwesomeIcon, { icon: faInfoCircle, width: 14, height: 14, className: "relay:inline-block relay:ml-[4px]" })] }) }) }))
         }
     ];
     if (!feeBreakdown) {
         if (isFetchingQuote) {
-            return (_jsx(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: _jsx(FetchingQuoteLoader, { isLoading: isFetchingQuote, containerCss: {
-                        mt: 0,
-                        mb: 0,
-                        px: '4',
-                        py: '3',
-                        width: '100%',
-                        justifyContent: 'center'
-                    } }) }));
+            return (_jsx(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: _jsx("div", { className: "relay:mt-0 relay:mb-0 relay:px-3 relay:py-[12px] relay:w-full relay:flex relay:justify-center", children: _jsx(FetchingQuoteLoader, { isLoading: isFetchingQuote, containerClassName: "relay:!my-0 relay:!py-0" }) }) }));
         }
         else {
             return null;
         }
     }
-    return (_jsxs(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: [_jsxs(Flex, { justify: "between", align: "center", css: { p: '3', pb: '0' }, children: [_jsx(Text, { style: "subtitle2", children: "Max Slippage" }), _jsxs(Flex, { align: "center", css: { gap: '2' }, children: [isAutoSlippage ? (_jsx(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 (_jsxs(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: [_jsxs(Flex, { justify: "between", align: "center", className: "relay:p-3 relay:pb-0", children: [_jsx(Text, { style: "subtitle2", children: "Max Slippage" }), _jsxs(Flex, { align: "center", className: "relay:gap-2", children: [isAutoSlippage ? (_jsx(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, _jsx(Tooltip, { side: "top", align: "end", content: minimumAmountFormatted ? (_jsxs(Flex, { direction: "row", css: { gap: '2' }, children: [_jsx(Text, { style: "subtitle2", color: "subtle", children: "Min. received" }), _jsxs(Text, { style: "subtitle2", children: [minimumAmountFormatted, " ", toToken?.symbol] })] })) : null, children: _jsxs(Text, { style: "subtitle2", css: { color: slippageRatingColor }, children: [slippage, "%"] }) })] })] }), _jsxs(CollapsibleRoot, { open: isOpen, onOpenChange: setIsOpen, children: [_jsx(CollapsibleTrigger, { id: 'fee-breakdown-section', children: _jsxs(Flex, { justify: "between", align: "center", css: {
-                                flexDirection: 'row',
-                                gap: '2',
-                                width: '100%',
-                                p: '3'
-                            }, children: [_jsx("span", { style: {
-                                        cursor: 'pointer',
-                                        flexShrink: 1,
-                                        overflow: 'hidden',
-                                        height: 21
-                                    }, onClick: (e) => {
+                                }, children: "Auto" })) : null, _jsx(Tooltip, { side: "top", align: "end", content: minimumAmountFormatted ? (_jsxs(Flex, { direction: "row", className: "relay:gap-2", children: [_jsx(Text, { style: "subtitle2", color: "subtle", children: "Min. received" }), _jsxs(Text, { style: "subtitle2", children: [minimumAmountFormatted, " ", toToken?.symbol] })] })) : null, children: _jsx(Text, { style: "subtitle2", children: _jsxs("span", { style: {
+                                            color: slippageRatingColor
+                                                ? `var(--relay-colors-${slippageRatingColor})`
+                                                : undefined
+                                        }, children: [slippage, "%"] }) }) })] })] }), _jsxs(CollapsibleRoot, { open: isOpen, onOpenChange: setIsOpen, children: [_jsx(CollapsibleTrigger, { id: 'fee-breakdown-section', children: _jsxs(Flex, { justify: "between", align: "center", className: "relay:flex-row relay:gap-2 relay:w-full relay:p-3", children: [_jsx("span", { className: "relay:cursor-pointer relay:shrink relay:overflow-hidden relay:h-[21px]", onClick: (e) => {
                                         setRateMode(rateMode === 'input' ? 'output' : 'input');
                                         e.preventDefault();
-                                    }, children: _jsx(ConversionRate, { fromToken: fromToken, toToken: toToken, rate: Number(swapRate), isInputMode: rateMode === 'input' }) }), _jsxs(Flex, { css: {
-                                        gap: '2',
+                                    }, children: _jsx(ConversionRate, { fromToken: fromToken, toToken: toToken, rate: Number(swapRate), isInputMode: rateMode === 'input' }) }), _jsxs(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 ? (_jsxs(_Fragment, { children: [_jsx(FontAwesomeIcon, { icon: faClock, width: 16 }), _jsxs(Text, { style: "subtitle2", css: { flexShrink: 0 }, children: ["~ ", timeEstimate?.formattedTime] }), _jsx(Flex, { justify: "center", align: "center", css: { color: 'gray6', height: 4 }, children: "\u2022" })] })) : null, !isOpen && (_jsxs(_Fragment, { children: [_jsx(FontAwesomeIcon, { icon: faGasPump, width: 16, style: { color: '#C1C8CD' } }), _jsx(Text, { style: "subtitle2", css: { flexShrink: 0 }, children: originGasFeeFormatted })] })), _jsx(Box, { css: {
-                                                marginLeft: '2',
-                                                transition: 'transform 300ms',
-                                                transform: isOpen ? 'rotate(-180deg)' : 'rotate(0)',
-                                                color: 'gray9'
-                                            }, children: _jsx(FontAwesomeIcon, { icon: faChevronDown, width: 12 }) })] })] }) }), _jsx(CollapsibleContent, { css: {
-                            borderRadius: '0 0 12px 12px'
-                        }, children: _jsx(Flex, { direction: "column", css: {
-                                px: '3',
-                                pb: '3',
-                                pt: '0',
-                                gap: '2',
-                                backgroundColor: 'widget-background'
-                            }, children: breakdown.map((item) => {
-                                return (_jsx(React.Fragment, { children: _jsxs(Flex, { justify: "between", align: "center", css: { width: '100%', gap: '4' }, children: [_jsx(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 ? (_jsxs(_Fragment, { children: [_jsx(FontAwesomeIcon, { icon: faClock, width: 16 }), _jsxs(Text, { style: "subtitle2", className: "relay:shrink-0", children: ["~ ", timeEstimate?.formattedTime] }), _jsx(Flex, { justify: "center", align: "center", className: "relay:text-[color:var(--relay-colors-gray6)] relay:h-[4px]", children: "\u2022" })] })) : null, !isOpen && (_jsxs(_Fragment, { children: [_jsx(FontAwesomeIcon, { icon: faGasPump, width: 16, className: "relay:text-[#C1C8CD]" }), _jsx(Text, { style: "subtitle2", className: "relay:shrink-0", children: originGasFeeFormatted })] })), _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: _jsx(FontAwesomeIcon, { icon: faChevronDown, width: 12 }) })] })] }) }), _jsx(CollapsibleContent, { children: _jsx(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 (_jsx(React.Fragment, { children: _jsxs(Flex, { justify: "between", align: "center", className: "relay:w-full relay:gap-4", children: [_jsx(Text, { style: "subtitle2", color: 'subtle', className: "relay:self-start", children: item.title }), item.value] }) }, item.title));
                             }) }) })] })] }));
 };
 export default FeeBreakdown;
@@ -153,7 +96,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 = (_jsx("div", { style: { width: '100%', minWidth: 0 }, children: _jsx(Text, { style: "subtitle2", ellipsify: true, children: rateText }) }));
+    const content = (_jsx("div", { className: "relay:w-full relay:min-w-0", children: _jsx(Text, { style: "subtitle2", ellipsify: true, children: rateText }) }));
     if (shouldShowTooltip) {
         return (_jsx(Tooltip, { content: _jsx(Text, { style: "subtitle2", children: rateText }), asChild: true, children: content }));
     }

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

@@ -1 +1 @@
-{"version":3,"file":"FeeBreakdown.js","sourceRoot":"","sources":["../../../../src/components/widgets/FeeBreakdown.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAW,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAA;AAEhE,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAA;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,6CAA6C,CAAA;AACvE,OAAO,EAAE,aAAa,EAAE,MAAM,iDAAiD,CAAA;AAC/E,OAAO,mBAAmB,MAAM,mCAAmC,CAAA;AAEnE,OAAO,EACL,kBAAkB,EAClB,eAAe,EACf,kBAAkB,EACnB,MAAM,8BAA8B,CAAA;AACrC,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAA;AACzE,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAA;AAC5D,OAAO,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAA;AAC1E,OAAO,OAAO,MAAM,0BAA0B,CAAA;AAC9C,OAAO,KAAK,MAAM,OAAO,CAAA;AAoBzB,MAAM,cAAc,GAAG,CAAC,IAAY,EAAE,EAAE;IACtC,OAAO,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,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,QAAQ,CAAC,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,YAAY,CACxC,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC,CAAC,CACvC,CAAA;IAED,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAqB,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,iBAAiB,CAAC,QAAQ,CAAC,CAAA;IAClD,MAAM,mBAAmB,GAAG,aAAa,CAAC,cAAc,CAAC,CAAA;IACzD,MAAM,sBAAsB,GAAG,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,aAAa;QACvE,CAAC,CAAC,QAAQ,CACN,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,MAAC,IAAI,IACH,KAAK,EAAC,QAAQ,EACd,GAAG,EAAE;oBACH,GAAG,EAAE,GAAG;oBACR,KAAK,EACH,YAAY,IAAI,YAAY,CAAC,IAAI,IAAI,EAAE;wBACrC,CAAC,CAAC,kBAAkB;wBACpB,CAAC,CAAC,kBAAkB;iBACzB,aAED,KAAC,eAAe,IAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,GAAI,EAC7C,MAAC,IAAI,IAAC,KAAK,EAAC,WAAW,mBAAI,YAAY,EAAE,aAAa,IAAQ,IACzD,CACR;SACF;QACD;YACE,KAAK,EAAE,cAAc;YACrB,KAAK,EAAE,CACL,MAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,EAAC,GAAG,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,aACpC,KAAC,eAAe,IACd,IAAI,EAAE,SAAS,EACf,KAAK,EAAE,EAAE,EACT,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,GAC3B,EACF,KAAC,IAAI,IAAC,KAAK,EAAC,WAAW,YAAE,qBAAqB,GAAQ,IACjD,CACR;SACF;QACD;YACE,KAAK,EAAE,cAAc;YACrB,KAAK,EAAE,CACL,KAAC,kBAAkB,IACjB,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,YAGzC,wBACE,MAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,EAAC,GAAG,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE,aACpD,KAAC,IAAI,IACH,KAAK,EAAC,WAAW,EACjB,GAAG,EAAE;oCACH,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS;iCAC/C,YAEA,YAAY,EAAE,SAAS,EAAE,qBAAqB,GAC1C,EACP,KAAC,eAAe,IACd,IAAI,EAAE,YAAY,EAClB,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EACV,KAAK,EAAE;oCACL,OAAO,EAAE,cAAc;oCACvB,UAAU,EAAE,CAAC;iCACd,GACD,IACG,GACH,GAEW,CACtB;SACF;KACF,CAAA;IAED,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,IAAI,eAAe,EAAE,CAAC;YACpB,OAAO,CACL,KAAC,GAAG,IACF,EAAE,EAAE,uBAAuB,EAC3B,GAAG,EAAE;oBACH,YAAY,EAAE,2BAA2B;oBACzC,eAAe,EAAE,mBAAmB;oBACpC,MAAM,EAAE,oBAAoB;oBAC5B,QAAQ,EAAE,QAAQ;oBAClB,EAAE,EAAE,4BAA4B;iBACjC,YAED,KAAC,mBAAmB,IAClB,SAAS,EAAE,eAAe,EAC1B,YAAY,EAAE;wBACZ,EAAE,EAAE,CAAC;wBACL,EAAE,EAAE,CAAC;wBACL,EAAE,EAAE,GAAG;wBACP,EAAE,EAAE,GAAG;wBACP,KAAK,EAAE,MAAM;wBACb,cAAc,EAAE,QAAQ;qBACzB,GACD,GACE,CACP,CAAA;QACH,CAAC;aAAM,CAAC;YACN,OAAO,IAAI,CAAA;QACb,CAAC;IACH,CAAC;IAED,OAAO,CACL,MAAC,IAAI,IACH,GAAG,EAAE;YACH,YAAY,EAAE,2BAA2B;YACzC,kBAAkB,EAAE,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,2BAA2B;YAC9D,eAAe,EAAE,mBAAmB;YACpC,MAAM,EAAE,oBAAoB;YAC5B,YAAY,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,oBAAoB;YACpD,QAAQ,EAAE,QAAQ;YAClB,UAAU,EAAE,uCAAuC;YACnD,eAAe,EAAE,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW;YAChD,EAAE,EAAE,4BAA4B;SACjC,EACD,SAAS,EAAC,QAAQ,aAElB,MAAC,IAAI,IAAC,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE,aAC7D,KAAC,IAAI,IAAC,KAAK,EAAC,WAAW,6BAAoB,EAC3C,MAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,EAAC,GAAG,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,aACnC,cAAc,CAAC,CAAC,CAAC,CAChB,KAAC,MAAM,kBACM,MAAM,EACjB,GAAG,EAAE;oCACH,QAAQ,EAAE,EAAE;oCACZ,UAAU,EAAE,KAAK;oCACjB,EAAE,EAAE,GAAG;oCACP,EAAE,EAAE,GAAG;oCACP,SAAS,EAAE,MAAM;oCACjB,UAAU,EAAE,MAAM;oCAClB,eAAe,EAAE,4BAA4B;oCAC7C,MAAM,EAAE,MAAM;oCACd,MAAM,EAAE;wCACN,eAAe,EAAE,kCAAkC;qCACpD;iCACF,EACD,KAAK,EAAC,OAAO,EACb,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,KAAC,OAAO,IACN,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,KAAK,EACX,OAAO,EACL,sBAAsB,CAAC,CAAC,CAAC,CACvB,MAAC,IAAI,IAAC,SAAS,EAAC,KAAK,EAAC,GAAG,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,aACrC,KAAC,IAAI,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,QAAQ,8BAE/B,EACP,MAAC,IAAI,IAAC,KAAK,EAAC,WAAW,aACpB,sBAAsB,OAAG,OAAO,EAAE,MAAM,IACpC,IACF,CACR,CAAC,CAAC,CAAC,IAAI,YAGV,MAAC,IAAI,IAAC,KAAK,EAAC,WAAW,EAAC,GAAG,EAAE,EAAE,KAAK,EAAE,mBAAmB,EAAE,aACxD,QAAQ,SACJ,GACC,IACL,IACF,EACP,MAAC,eAAe,IAAC,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,SAAS,aACpD,KAAC,kBAAkB,IAAC,EAAE,EAAE,uBAAuB,YAC7C,MAAC,IAAI,IACH,OAAO,EAAC,SAAS,EACjB,KAAK,EAAC,QAAQ,EACd,GAAG,EAAE;gCACH,aAAa,EAAE,KAAK;gCACpB,GAAG,EAAE,GAAG;gCACR,KAAK,EAAE,MAAM;gCACb,CAAC,EAAE,GAAG;6BACP,aAED,eACE,KAAK,EAAE;wCACL,MAAM,EAAE,SAAS;wCACjB,UAAU,EAAE,CAAC;wCACb,QAAQ,EAAE,QAAQ;wCAClB,MAAM,EAAE,EAAE;qCACX,EACD,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,KAAC,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,MAAC,IAAI,IACH,GAAG,EAAE;wCACH,GAAG,EAAE,GAAG;wCACR,KAAK,EACH,YAAY,IAAI,YAAY,CAAC,IAAI,IAAI,EAAE;4CACrC,CAAC,CAAC,kBAAkB;4CACpB,CAAC,CAAC,kBAAkB;wCACxB,UAAU,EAAE,CAAC;qCACd,EACD,KAAK,EAAC,QAAQ,aAEb,CAAC,MAAM,IAAI,YAAY,IAAI,YAAY,EAAE,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,CACrD,8BACE,KAAC,eAAe,IAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,GAAI,EAC7C,MAAC,IAAI,IAAC,KAAK,EAAC,WAAW,EAAC,GAAG,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,mBACzC,YAAY,EAAE,aAAa,IACzB,EACP,KAAC,IAAI,IACH,OAAO,EAAC,QAAQ,EAChB,KAAK,EAAC,QAAQ,EACd,GAAG,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE,uBAG7B,IACN,CACJ,CAAC,CAAC,CAAC,IAAI,EACP,CAAC,MAAM,IAAI,CACV,8BACE,KAAC,eAAe,IACd,IAAI,EAAE,SAAS,EACf,KAAK,EAAE,EAAE,EACT,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,GAC3B,EACF,KAAC,IAAI,IAAC,KAAK,EAAC,WAAW,EAAC,GAAG,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,YAC3C,qBAAqB,GACjB,IACN,CACJ,EACD,KAAC,GAAG,IACF,GAAG,EAAE;gDACH,UAAU,EAAE,GAAG;gDACf,UAAU,EAAE,iBAAiB;gDAC7B,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,WAAW;gDACnD,KAAK,EAAE,OAAO;6CACf,YAED,KAAC,eAAe,IAAC,IAAI,EAAE,aAAa,EAAE,KAAK,EAAE,EAAE,GAAI,GAC/C,IACD,IACF,GACY,EACrB,KAAC,kBAAkB,IACjB,GAAG,EAAE;4BACH,YAAY,EAAE,eAAe;yBAC9B,YAED,KAAC,IAAI,IACH,SAAS,EAAC,QAAQ,EAClB,GAAG,EAAE;gCACH,EAAE,EAAE,GAAG;gCACP,EAAE,EAAE,GAAG;gCACP,EAAE,EAAE,GAAG;gCACP,GAAG,EAAE,GAAG;gCACR,eAAe,EAAE,mBAAmB;6BACrC,YAEA,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;gCACtB,OAAO,CACL,KAAC,KAAK,CAAC,QAAQ,cACb,MAAC,IAAI,IACH,OAAO,EAAC,SAAS,EACjB,KAAK,EAAC,QAAQ,EACd,GAAG,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,aAEhC,KAAC,IAAI,IACH,KAAK,EAAC,WAAW,EACjB,KAAK,EAAE,QAAQ,EACf,GAAG,EAAE,EAAE,SAAS,EAAE,YAAY,EAAE,YAE/B,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,eAAe,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,cAAK,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,EAAE,YACxC,KAAC,IAAI,IAAC,KAAK,EAAC,WAAW,EAAC,SAAS,kBAC9B,QAAQ,GACJ,GACH,CACP,CAAA;IAED,IAAI,iBAAiB,EAAE,CAAC;QACtB,OAAO,CACL,KAAC,OAAO,IACN,OAAO,EAAE,KAAC,IAAI,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"}
+{"version":3,"file":"FeeBreakdown.js","sourceRoot":"","sources":["../../../../src/components/widgets/FeeBreakdown.tsx"],"names":[],"mappings":"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"}

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

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

package/_esm/src/components/widgets/FetchingQuoteLoader.js.map

@@ -1 +1 @@
-{"version":3,"file":"FetchingQuoteLoader.js","sourceRoot":"","sources":["../../../../src/components/widgets/FetchingQuoteLoader.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAW,MAAM,OAAO,CAAA;AAC/B,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAA;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAQ5D,MAAM,mBAAmB,GAAc,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,EAAE,EAAE;IACrE,IAAI,CAAC,SAAS,EAAE,CAAC;QACf,OAAO,IAAI,CAAA;IACb,CAAC;IAED,OAAO,CACL,MAAC,IAAI,IACH,KAAK,EAAC,QAAQ,EACd,GAAG,EAAE;YACH,GAAG,EAAE,EAAE;YACP,EAAE,EAAE,GAAG;YACP,EAAE,EAAE,GAAG;YACP,CAAC,EAAE,KAAK;YACR,CAAC,EAAE,QAAQ;YACX,GAAG,YAAY;SAChB,aAED,KAAC,cAAc,IAAC,GAAG,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,GAAI,EAClD,KAAC,IAAI,IAAC,KAAK,EAAC,WAAW,wCAA+B,IACjD,CACR,CAAA;AACH,CAAC,CAAA;AAED,eAAe,mBAAmB,CAAA"}
+{"version":3,"file":"FetchingQuoteLoader.js","sourceRoot":"","sources":["../../../../src/components/widgets/FetchingQuoteLoader.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAW,MAAM,OAAO,CAAA;AAC/B,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAA;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAC5D,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAOtC,MAAM,mBAAmB,GAAc,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,EAAE,EAAE;IAC3E,IAAI,CAAC,SAAS,EAAE,CAAC;QACf,OAAO,IAAI,CAAA;IACb,CAAC;IAED,OAAO,CACL,MAAC,IAAI,IACH,KAAK,EAAC,QAAQ,EACd,SAAS,EAAE,EAAE,CACX,iEAAiE,EACjE,kBAAkB,CACnB,aAED,KAAC,cAAc,IAAC,SAAS,EAAC,qBAAqB,GAAG,EAClD,KAAC,IAAI,IAAC,KAAK,EAAC,WAAW,wCAA+B,IACjD,CACR,CAAA;AACH,CAAC,CAAA;AAED,eAAe,mBAAmB,CAAA"}