@rango-dev/ui 0.33.1-next.1 → 0.33.1-next.3

package/src/components/Typography/Typography.stories.tsx

@@ -1,125 +0,0 @@
-import type { PropTypes } from './Typography.types';
-import type { Meta } from '@storybook/react';
-
-import React from 'react';
-
-import { Typography } from './Typography';
-
-export default {
-  title: 'Components/Typography',
-  component: Typography,
-  argTypes: {
-    variant: {
-      name: 'variant',
-      control: { type: 'select' },
-      options: [
-        'body1',
-        'body2',
-        'body3',
-        'h1',
-        'h2',
-        'h3',
-        'h4',
-        'h5',
-        'h6',
-        'caption',
-      ],
-      defaultValue: 'h1',
-    },
-    align: {
-      name: 'align',
-      control: { type: 'select' },
-      options: ['center', 'left', 'right'],
-    },
-    noWrap: {
-      name: 'noWrap',
-      control: { type: 'boolean' },
-    },
-  },
-} satisfies Meta<typeof Typography>;
-
-export const Main = (props: PropTypes) => (
-  <div>
-    <div>
-      <Typography {...props} variant="display" size="large">
-        Display Large
-      </Typography>
-      {', '}
-      <Typography {...props} variant="display" size="medium">
-        Display Medium
-      </Typography>
-      {', '}
-      <Typography {...props} variant="display" size="small">
-        Display Small
-      </Typography>
-    </div>
-
-    <div>
-      <Typography {...props} variant="headline" size="large">
-        Headline Large
-      </Typography>
-      {', '}
-      <Typography {...props} variant="headline" size="medium">
-        Headline Medium
-      </Typography>
-      {', '}
-      <Typography {...props} variant="headline" size="small">
-        Headline Small
-      </Typography>
-      {', '}
-      <Typography {...props} variant="headline" size="xsmall">
-        Headline Xsmall
-      </Typography>
-    </div>
-
-    <div>
-      <Typography {...props} variant="title" size="large">
-        Title Large
-      </Typography>
-      {', '}
-      <Typography {...props} variant="title" size="medium">
-        Title Medium
-      </Typography>
-      {', '}
-      <Typography {...props} variant="title" size="xmedium">
-        Title Xmedium
-      </Typography>
-      {', '}
-      <Typography {...props} variant="title" size="small">
-        Title Small
-      </Typography>
-    </div>
-
-    <div>
-      <Typography {...props} variant="label" size="large">
-        Label Large
-      </Typography>
-      {', '}
-      <Typography {...props} variant="label" size="medium">
-        Label Medium
-      </Typography>
-      {', '}
-      <Typography {...props} variant="label" size="small">
-        Label Small
-      </Typography>
-    </div>
-
-    <div>
-      <Typography {...props} variant="body" size="large">
-        Body Large
-      </Typography>
-      {', '}
-      <Typography {...props} variant="body" size="medium">
-        Body Medium
-      </Typography>
-      {', '}
-      <Typography {...props} variant="body" size="small">
-        Body Small
-      </Typography>
-      {', '}
-      <Typography {...props} variant="body" size="xsmall">
-        Body Xsmall
-      </Typography>
-    </div>
-  </div>
-);

package/src/components/Wallet/ClickableWallet.stories.tsx

@@ -1,23 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-
-import { Wallet } from './Wallet';
-import { WalletState } from './Wallet.types';
-
-const meta: Meta<typeof Wallet> = {
-  component: Wallet,
-};
-
-export default meta;
-type Story = StoryObj<typeof Wallet>;
-
-export const Main: Story = {
-  args: {
-    title: 'Trust Wallet',
-    image: 'https://api.rango.exchange/blockchains/zksync.png',
-    onClick: (type) => {
-      console.log('Clicked on', type);
-    },
-    type: 'wallet-connect-2',
-    state: WalletState.CONNECTED,
-  },
-};

package/src/components/Wallet/SelectableWallet.stories.tsx

@@ -1,23 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-
-import { SelectableWallet } from './SelectableWallet';
-
-const meta: Meta<typeof SelectableWallet> = {
-  component: SelectableWallet,
-};
-
-export default meta;
-type Story = StoryObj<typeof SelectableWallet>;
-
-export const Main: Story = {
-  args: {
-    title: 'Trust Wallet',
-    description: '0x......',
-    image: 'https://api.rango.exchange/blockchains/zksync.png',
-    onClick: (type) => {
-      console.log('Clicked on', type);
-    },
-    selected: true,
-    type: 'wallet-connect-2',
-  },
-};

package/src/containers/ConnectWalletsModal/ConnectWallets.stories.tsx

@@ -1,24 +0,0 @@
-import React, { useState } from 'react';
-import { Meta } from '@storybook/react';
-import { ConnectWalletsModal, PropTypes } from './ConnectWalletsModal';
-import { walletsInfo } from './mockData';
-
-export default {
-  title: 'Containers/Connect Wallets Modal',
-  component: ConnectWalletsModal,
-} as Meta<typeof ConnectWalletsModal>;
-
-export const Main = (args: PropTypes) => {
-  const [open, setOpen] = useState<boolean>(false);
-  return (
-    <div>
-      <button onClick={() => setOpen(true)}>Open Modal</button>
-      <ConnectWalletsModal
-        {...args}
-        list={walletsInfo}
-        open={open}
-        onClose={() => setOpen(false)}
-      />
-    </div>
-  );
-};

package/src/containers/SwapInput/SwapInput.stories.tsx

@@ -1,40 +0,0 @@
-import type { SwapInputProps } from './SwapInput.types';
-import type { Meta } from '@storybook/react';
-
-import React from 'react';
-
-import { SwapInput } from './SwapInput';
-
-const meta: Meta<typeof SwapInput> = {
-  title: 'Containers/Swap Input',
-  component: SwapInput,
-  args: {
-    chain: {
-      image: 'https://api.rango.exchange/blockchains/bsc.svg',
-      displayName: 'BSC',
-    },
-    token: {
-      displayName: 'BNB',
-      image: 'https://api.rango.exchange/tokens/ETH/BNB.png',
-    },
-    label: 'From',
-    price: { value: '0.5', usdValue: '151.2' },
-  },
-};
-
-export default meta;
-
-export const SwapFrom = (args: SwapInputProps) => (
-  <SwapInput {...args} label="From" />
-);
-
-export const SwapTo = (args: SwapInputProps) => (
-  <SwapInput
-    {...args}
-    label="To"
-    mode="To"
-    price={{ value: '2.5', usdValue: '610' }}
-    percentageChange="6.4"
-    warningLevel="high"
-  />
-);

package/src/icons/Icons.stories.tsx

@@ -1,68 +0,0 @@
-import type { SvgIconProps } from '../components/SvgIcon';
-import type { Meta } from '@storybook/react';
-
-import React from 'react';
-
-import { Typography } from '../components/Typography';
-import { styled } from '../theme';
-
-import * as Icons from '.';
-
-export default {
-  title: 'Components/Icons',
-  component: Icons.AutoThemeIcon,
-  args: {
-    size: 16,
-    color: 'black',
-  },
-  argTypes: {
-    color: {
-      name: 'color',
-      control: { type: 'select' },
-      options: [
-        'primary',
-        'secondary',
-        'error',
-        'warning',
-        'success',
-        'black',
-        'white',
-        'gray',
-        'info',
-      ],
-    },
-
-    size: {
-      name: 'size',
-      control: { type: 'select' },
-      // eslint-disable-next-line @typescript-eslint/no-magic-numbers
-      options: [16, 18, 20, 24, 28, 32, 36, 40],
-      defaultValue: 16,
-    },
-  },
-} as Meta<any>;
-
-const Container = styled('div', {
-  display: 'grid',
-  gridTemplateColumns: 'auto auto auto auto auto',
-  gap: 15,
-});
-
-export const Main = (props: SvgIconProps) => (
-  <Container>
-    {Object.keys(Icons).map((icon) => {
-      // eslint-disable-next-line
-      // @ts-ignore
-      const Component = Icons[icon];
-      return (
-        <div key={icon}>
-          <Component {...props} />
-          <div />
-          <Typography variant="label" size="medium">
-            {icon}
-          </Typography>
-        </div>
-      );
-    })}
-  </Container>
-);