mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-01 13:47:06 +01:00
429847a686
Our Storybook dependencies have been updated to v6.1.9, from v5. This was done to address a security vulnerability in a transitive dependency of these packages (`highlight.js`). The primary changes required by this Storybook update were the change in import path for the `withKnobs` hook, the change in background config format, and the webpack configuration. Storybook seems to work correctly. The migration was guided by the Storybook changelog[1] and the Storybook v6 migration guide[2]. There is one Storybook error remaining; it fails to load the Euclid font. This is a pre-existing error though, so we can fix it in a later PR. The `yarn.lock` file was deduplicated in this PR as well, as it was required to fix various install warnings that were introduced with this update. [1]: https://github.com/storybookjs/storybook/blob/next/CHANGELOG.md [2]: https://github.com/storybookjs/storybook/blob/next/MIGRATION.md
48 lines
1.5 KiB
JavaScript
48 lines
1.5 KiB
JavaScript
import React from 'react'
|
|
import { text, number } from '@storybook/addon-knobs'
|
|
import ExchangeRateDisplay from './exchange-rate-display'
|
|
|
|
export default {
|
|
title: 'ExchangeRateDisplay',
|
|
}
|
|
|
|
export const Default = () => {
|
|
return (
|
|
<ExchangeRateDisplay
|
|
primaryTokenValue={text('primaryTokenValue', '2000000000000000000')}
|
|
primaryTokenDecimals={number('primaryTokenDecimals', 18)}
|
|
primaryTokenSymbol={text('primaryTokenSymbol', 'ETH')}
|
|
secondaryTokenValue={text('secondaryTokenValue', '200000000000000000')}
|
|
secondaryTokenDecimals={number('secondaryTokenDecimals', 18)}
|
|
secondaryTokenSymbol={text('secondaryTokenSymbol', 'ABC')}
|
|
/>
|
|
)
|
|
}
|
|
|
|
export const WhiteOnBlue = () => {
|
|
return (
|
|
<div
|
|
style={{
|
|
width: '150px',
|
|
height: '30px',
|
|
borderRadius: '4px',
|
|
display: 'flex',
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
background: 'linear-gradient(90deg, #037DD6 0%, #1098FC 101.32%)',
|
|
}}
|
|
>
|
|
<ExchangeRateDisplay
|
|
primaryTokenValue={text('primaryTokenValue', '2000000000000000000')}
|
|
primaryTokenDecimals={number('primaryTokenDecimals', 18)}
|
|
primaryTokenSymbol={text('primaryTokenSymbol', 'ETH')}
|
|
secondaryTokenValue={text('secondaryTokenValue', '200000000000000000')}
|
|
secondaryTokenDecimals={number('secondaryTokenDecimals', 18)}
|
|
secondaryTokenSymbol={text('secondaryTokenSymbol', 'ABC')}
|
|
className="exchange-rate-display--white"
|
|
arrowColor="white"
|
|
/>
|
|
</div>
|
|
)
|
|
}
|