@rango-dev/ui 0.33.1-next.0 → 0.33.1-next.2

package/src/components/FullExpandedQuote/mock.tsx

@@ -1,449 +0,0 @@
-import type { Step } from '../StepDetails/StepDetails.types';
-
-import React from 'react';
-
-import { Alert } from '../Alert';
-
-export const steps: Step[] = [
-  {
-    swapper: {
-      displayName: 'AllBridge',
-      image:
-        'https://raw.githubusercontent.com/rango-exchange/assets/main/swappers/AllBridge/icon.svg',
-    },
-    from: {
-      token: {
-        displayName: 'USDC',
-        image: 'https://rango.vip/i/mh9zko',
-      },
-      chain: {
-        displayName: 'Polygon',
-        image:
-          'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/POLYGON/icon.svg',
-      },
-      price: {
-        value: '1.00000000',
-        realValue: '5.5',
-      },
-    },
-    to: {
-      token: {
-        displayName: 'AVAX',
-        image: 'https://api.rango.exchange/tokens/AVAX/AVAX.png',
-      },
-      chain: {
-        displayName: 'Avax',
-        image:
-          'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/AVAX_CCHAIN/icon.svg',
-      },
-      price: {
-        value: '1.00000000',
-        realValue: '5.5',
-      },
-    },
-    internalSwaps: [
-      {
-        from: {
-          chain: {
-            displayName: 'BSC',
-            image:
-              'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/BSC/icon.svg',
-          },
-          price: {
-            value: '1',
-          },
-          token: {
-            displayName: 'USDT',
-            image: 'https://rango.vip/i/6837hX',
-          },
-        },
-        to: {
-          chain: {
-            displayName: 'BSC',
-            image:
-              'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/BSC/icon.svg',
-          },
-          price: {
-            value: '1',
-          },
-          token: {
-            displayName: 'USDT',
-            image: 'https://rango.vip/i/6837hX',
-          },
-        },
-        swapper: {
-          displayName: 'AllBridge',
-          image:
-            'https://raw.githubusercontent.com/rango-exchange/assets/main/swappers/AllBridge/icon.svg',
-        },
-      },
-    ],
-    alerts: undefined,
-    fee: '0.19',
-    time: '07:00',
-  },
-  {
-    swapper: {
-      displayName: 'ThorChain',
-      image: 'https://api.rango.exchange/swappers/Thorchain.svg',
-    },
-    from: {
-      token: {
-        displayName: 'AVAX',
-        image: 'https://api.rango.exchange/tokens/AVAX/AVAX.png',
-      },
-      chain: {
-        displayName: 'Avax',
-        image:
-          'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/AVAX_CCHAIN/icon.svg',
-      },
-      price: {
-        value: '1.00000000',
-        realValue: '5.5',
-      },
-    },
-    to: {
-      token: {
-        displayName: 'WMATIC',
-        image: 'https://rango.vip/i/NcQpfK',
-      },
-      chain: {
-        displayName: 'BTC',
-        image: 'https://api.rango.exchange/tokens/BTC/BTC.png',
-      },
-      price: {
-        value: '3.5',
-      },
-    },
-    internalSwaps: [
-      {
-        from: {
-          chain: {
-            displayName: 'Solana',
-            image:
-              'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/SOLANA/icon.svg',
-          },
-          price: {
-            value: '1',
-          },
-          token: {
-            displayName: 'USDT',
-            image: 'https://rango.vip/i/6837hX',
-          },
-        },
-        to: {
-          chain: {
-            displayName: 'SOL',
-            image: 'https://rango.vip/tokens/SOLANA/SOL.png',
-          },
-          price: {
-            value: '1',
-          },
-          token: {
-            displayName: 'USDT',
-            image: 'https://rango.vip/i/6837hX',
-          },
-        },
-        swapper: {
-          displayName: 'AllBridge',
-          image:
-            'https://raw.githubusercontent.com/rango-exchange/assets/main/swappers/AllBridge/icon.svg',
-        },
-      },
-      {
-        from: {
-          chain: {
-            displayName: 'Solana',
-            image:
-              'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/SOLANA/icon.svg',
-          },
-          price: {
-            value: '1',
-          },
-          token: {
-            displayName: 'USDT',
-            image: 'https://rango.vip/i/6837hX',
-          },
-        },
-        to: {
-          chain: {
-            displayName: 'Solana',
-            image:
-              'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/SOLANA/icon.svg',
-          },
-          price: {
-            value: '1',
-          },
-          token: {
-            displayName: 'SOL',
-            image: 'https://rango.vip/tokens/SOLANA/SOL.png',
-          },
-        },
-        swapper: {
-          displayName: 'Jupiter',
-          image:
-            'https://raw.githubusercontent.com/rango-exchange/assets/main/swappers/Jupiter/icon.svg',
-        },
-      },
-    ],
-    state: 'warning',
-    alerts: [
-      <Alert
-        key="alert"
-        variant="alarm"
-        type="warning"
-        title="Slippage Warning"
-      />,
-    ],
-    time: '02:45',
-    fee: '0.07',
-  },
-  {
-    swapper: {
-      displayName: 'Satellite',
-      image: 'https://api.rango.exchange/swappers/satellite.png',
-    },
-    from: {
-      token: {
-        displayName: 'WMATIC',
-        image: 'https://rango.vip/i/NcQpfK',
-      },
-      chain: {
-        displayName: 'BTC',
-        image: 'https://api.rango.exchange/tokens/BTC/BTC.png',
-      },
-      price: {
-        value: '3.5',
-      },
-    },
-    to: {
-      token: {
-        displayName: 'BTC',
-        image: 'https://api.rango.exchange/tokens/BTC/BTC.png',
-      },
-      chain: {
-        displayName: 'BTC',
-        image: 'https://api.rango.exchange/tokens/BTC/BTC.png',
-      },
-      price: {
-        value: '2',
-      },
-    },
-    fee: '0.19',
-    time: '07:00',
-  },
-  {
-    swapper: {
-      displayName: 'CurveFi',
-      image:
-        'https://raw.githubusercontent.com/rango-exchange/assets/main/swappers/CurveFi/icon.png',
-    },
-    from: {
-      token: {
-        displayName: 'BTC',
-        image: 'https://api.rango.exchange/tokens/BTC/BTC.png',
-      },
-      chain: {
-        displayName: 'BTC',
-        image: 'https://api.rango.exchange/tokens/BTC/BTC.png',
-      },
-      price: {
-        value: '2',
-      },
-    },
-    to: {
-      token: {
-        displayName: 'OSMO',
-        image: 'https://api.rango.exchange/tokens/COSMOS/OSMO.png',
-      },
-      chain: {
-        displayName: 'Osmosis',
-        image:
-          'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/OSMOSIS/icon.svg',
-      },
-      price: {
-        value: '5.546',
-      },
-    },
-    internalSwaps: [
-      {
-        from: {
-          chain: {
-            displayName: 'BSC',
-            image:
-              'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/BSC/icon.svg',
-          },
-          price: {
-            value: '1',
-          },
-          token: {
-            displayName: 'USDT',
-            image: 'https://rango.vip/i/6837hX',
-          },
-        },
-        to: {
-          chain: {
-            displayName: 'BSC',
-            image:
-              'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/BSC/icon.svg',
-          },
-          price: {
-            value: '1',
-          },
-          token: {
-            displayName: 'USDT',
-            image: 'https://rango.vip/i/6837hX',
-          },
-        },
-        swapper: {
-          displayName: 'UniSwap',
-          image:
-            'https://raw.githubusercontent.com/rango-exchange/assets/main/swappers/UniSwapV2/icon.svg',
-        },
-      },
-      {
-        from: {
-          chain: {
-            displayName: 'Solana',
-            image:
-              'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/SOLANA/icon.svg',
-          },
-          price: {
-            value: '1',
-          },
-          token: {
-            displayName: 'USDT',
-            image: 'https://rango.vip/i/6837hX',
-          },
-        },
-        to: {
-          chain: {
-            displayName: 'Solana',
-            image:
-              'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/SOLANA/icon.svg',
-          },
-          price: {
-            value: '1',
-          },
-          token: {
-            displayName: 'SOL',
-            image: 'https://rango.vip/tokens/SOLANA/SOL.png',
-          },
-        },
-        swapper: {
-          displayName: 'DeBridge',
-          image:
-            'https://raw.githubusercontent.com/rango-exchange/assets/main/swappers/DeBridge/icon.svg',
-        },
-      },
-    ],
-    fee: '0.19',
-    time: '07:00',
-  },
-  {
-    swapper: {
-      displayName: '1inch',
-      image:
-        'https://raw.githubusercontent.com/rango-exchange/assets/main/swappers/1Inch/icon.svg',
-    },
-    from: {
-      token: {
-        displayName: 'OSMO',
-        image: 'https://api.rango.exchange/tokens/COSMOS/OSMO.png',
-      },
-      chain: {
-        displayName: 'Osmosis',
-        image:
-          'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/OSMOSIS/icon.svg',
-      },
-      price: {
-        value: '5.546',
-      },
-    },
-    to: {
-      token: {
-        displayName: 'USDC',
-        image: 'https://rango.vip/i/cY81Jl',
-      },
-      chain: {
-        displayName: 'Optimism',
-        image:
-          'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/OPTIMISM/icon.svg',
-      },
-      price: {
-        value: '5.546',
-      },
-    },
-    alerts: [
-      <Alert
-        key="alert"
-        variant="alarm"
-        type="error"
-        title="Bridge Limit Error: Please decrease your amount."
-      />,
-    ],
-    state: 'error',
-    fee: '0.00',
-    time: '01:45',
-  },
-  {
-    swapper: {
-      displayName: 'Pancake',
-      image:
-        'https://raw.githubusercontent.com/rango-exchange/assets/main/swappers/Pancake/icon.svg',
-    },
-    from: {
-      token: {
-        displayName: 'USDC',
-        image: 'https://rango.vip/i/cY81Jl',
-      },
-      chain: {
-        displayName: 'Optimism',
-        image:
-          'https://raw.githubusercontent.com/rango-exchange/assets/main/blockchains/OPTIMISM/icon.svg',
-      },
-      price: {
-        value: '5.546',
-      },
-    },
-    to: {
-      chain: {
-        displayName: 'ETH',
-        image: 'https://api.rango.exchange/blockchains/ethereum.svg',
-      },
-      token: {
-        displayName: 'ETH',
-
-        image: 'https://api.rango.exchange/tokens/ETH/ETH.png',
-      },
-      price: {
-        value: '14.86',
-      },
-    },
-    fee: '0.19',
-    time: '07:00',
-  },
-];
-
-export const tags = [
-  {
-    value: 'RECOMMENDED',
-    label: 'Recommended',
-  },
-  {
-    value: 'CENTRALIZED',
-    label: 'Centrailized',
-  },
-  {
-    value: 'LOWEST_FEE',
-    label: 'Lowest Fee',
-  },
-  {
-    value: 'FASTEST',
-    label: 'Fastest',
-  },
-  {
-    value: 'HIGH_IMPACT',
-    label: 'High Impact',
-  },
-];

package/src/components/IconButton/IconButton.stories.tsx

@@ -1,20 +0,0 @@
-import type { PropTypes } from './IconButton.types';
-import type { Meta } from '@storybook/react';
-
-import React from 'react';
-
-import { WalletIcon } from '../../icons';
-
-import { IconButton } from './IconButton';
-
-const meta: Meta<typeof IconButton> = {
-  component: IconButton,
-};
-
-export default meta;
-
-export const Main = (props: PropTypes) => (
-  <IconButton {...props}>
-    <WalletIcon />
-  </IconButton>
-);

package/src/components/List/List.stories.tsx

@@ -1,181 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-
-import React, { useState } from 'react';
-
-import {
-  ChevronRightIcon,
-  DeleteIcon,
-  RefreshIcon,
-  WalletIcon,
-} from '../../icons';
-import { Button } from '../Button';
-import { Checkbox } from '../Checkbox';
-import { Chip } from '../Chip';
-import { ListItemButton } from '../ListItemButton';
-
-import { List } from './List';
-
-const DEFAULT_TITLE = 'Your title';
-const DEFAULT_DESCRIPTION = 'Here you can write your description.';
-const DEFAULT_ICON = <WalletIcon />;
-
-type Story = StoryObj<typeof List>;
-
-export default {
-  title: 'Components/List',
-  component: List,
-  argTypes: {},
-} satisfies Meta<typeof List>;
-
-export const Item: Story = {
-  args: {},
-  render: () => {
-    return (
-      <List
-        items={[
-          {
-            id: '1',
-            title: DEFAULT_TITLE,
-            description: DEFAULT_DESCRIPTION,
-          },
-          {
-            id: '2',
-            title: DEFAULT_TITLE,
-          },
-          {
-            id: '3',
-            title: DEFAULT_TITLE,
-            description: DEFAULT_DESCRIPTION,
-            start: <DeleteIcon />,
-          },
-          {
-            id: '4',
-            title: DEFAULT_TITLE,
-            start: <RefreshIcon />,
-            end: (
-              <Button
-                type="primary"
-                onClick={() => {
-                  console.log('Clicked on Hello Button.');
-                }}>
-                Hello, Button.
-              </Button>
-            ),
-          },
-          {
-            id: '5',
-            title: DEFAULT_TITLE,
-            description: DEFAULT_DESCRIPTION,
-            start: DEFAULT_ICON,
-            end: <ChevronRightIcon />,
-          },
-          {
-            id: '6',
-            title: DEFAULT_TITLE,
-            description: DEFAULT_DESCRIPTION,
-            start: DEFAULT_ICON,
-            end: <Checkbox checked />,
-          },
-          {
-            id: '7',
-            title: (
-              <>
-                Dai
-                <Chip label="Ethereum" />
-              </>
-            ),
-            description: DEFAULT_DESCRIPTION,
-            start: DEFAULT_ICON,
-            end: <Checkbox checked />,
-          },
-          {
-            id: '8',
-            title: DEFAULT_TITLE,
-            description: DEFAULT_DESCRIPTION,
-            start: DEFAULT_ICON,
-            end: 'end can be anything',
-          },
-        ]}
-      />
-    );
-  },
-};
-
-export const ItemButton: Story = {
-  args: {},
-  render: () => {
-    return <ItemButtonExamples />;
-  },
-};
-
-function ItemButtonExamples() {
-  const [checkedItem, setCheckedItem] = useState('');
-  return (
-    <List
-      type={
-        <ListItemButton
-          id="_"
-          title="List Item Button"
-          onClick={(id) => {
-            console.log('clicked on ', {
-              id,
-              checkedItem,
-              check: checkedItem === id,
-              result: checkedItem === id ? '' : id,
-            });
-            setCheckedItem(checkedItem === id ? '' : id);
-          }}
-        />
-      }
-      items={[
-        {
-          id: '1',
-          title: DEFAULT_TITLE,
-          description: DEFAULT_DESCRIPTION,
-        },
-        {
-          id: '2',
-          title: DEFAULT_TITLE,
-        },
-        {
-          id: '3',
-          title: DEFAULT_TITLE,
-          description: DEFAULT_DESCRIPTION,
-          start: <DeleteIcon />,
-        },
-        {
-          id: '4',
-          title: DEFAULT_TITLE,
-          start: <RefreshIcon />,
-          end: <Button type="primary">Hello, Button.</Button>,
-        },
-        {
-          id: '5',
-          title: DEFAULT_TITLE,
-          description: DEFAULT_DESCRIPTION,
-          start: DEFAULT_ICON,
-          end: <ChevronRightIcon />,
-        },
-        {
-          id: '6',
-          title: DEFAULT_TITLE,
-          description: DEFAULT_DESCRIPTION,
-          start: DEFAULT_ICON,
-          end: <Checkbox checked={checkedItem === '6'} />,
-        },
-        {
-          id: '7',
-          title: (
-            <>
-              Dai
-              <Chip label="Ethereum" />
-            </>
-          ),
-          description: DEFAULT_DESCRIPTION,
-          start: DEFAULT_ICON,
-          end: <Checkbox checked={checkedItem === '7'} />,
-        },
-      ]}
-    />
-  );
-}

package/src/components/MessageBox/CollapsibleMessageBox.stories.tsx

@@ -1,27 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-
-import React from 'react';
-
-import { Typography } from '../Typography';
-
-import { CollapsibleMessageBox } from './CollapsibleMessageBox';
-
-const meta: Meta<typeof CollapsibleMessageBox> = {
-  component: CollapsibleMessageBox,
-};
-
-export default meta;
-type Story = StoryObj<typeof CollapsibleMessageBox>;
-
-export const Main: Story = {
-  args: {
-    status: 'warning',
-    title: 'Title',
-    description: 'This is a test text',
-    children: (
-      <Typography variant="body" size="medium">
-        test
-      </Typography>
-    ),
-  },
-};

package/src/components/MessageBox/MessageBox.stories.tsx

@@ -1,18 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-
-import { MessageBox } from './DefaultMessageBox';
-
-const meta: Meta<typeof MessageBox> = {
-  component: MessageBox,
-};
-
-export default meta;
-type Story = StoryObj<typeof MessageBox>;
-
-export const Main: Story = {
-  args: {
-    type: 'warning',
-    title: 'Title',
-    description: 'This is a test text',
-  },
-};