mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
af09521a69
* updated background color for picker network * updated color for pressed state * fixed linting error * updated snapshots * removed borderstyle * update color * updated snapshot * added truncate to the text * updated snapshot |
||
---|---|---|
.. | ||
__snapshots__ | ||
index.js | ||
picker-network.js | ||
picker-network.scss | ||
picker-network.stories.js | ||
picker-network.test.js | ||
README.mdx |
import { Story, Canvas, ArgsTable } from '@storybook/addon-docs'; import { PickerNetwork } from './picker-network'; # PickerNetwork The `PickerNetwork` is used for the action of changing a network. <Canvas> <Story id="ui-components-component-library-picker-network-picker-network-stories-js--default-story" /> </Canvas> ## Props The `PickerNetwork` accepts all props below as well as all [Box](/docs/ui-components-ui-box-box-stories-js--default-story#props) component props. <ArgsTable of={PickerNetwork} /> ### Src Use the `src` prop with an image url to render the `AvatarNetwork`. <Canvas> <Story id="ui-components-component-library-picker-network-picker-network-stories-js--src" /> </Canvas> ```jsx import { PickerNetwork } from '../../ui/component-library/picker-network'; <PickerNetwork src="./images/arbitrum.svg" /> <PickerNetwork src="./images/matic-token.png" /> <PickerNetwork src="./images/optimism.svg" /> ``` ### Label Use the `label` prop for the text content of the `PickerNetwork` component <Canvas> <Story id="ui-components-component-library-picker-network-picker-network-stories-js--label" /> </Canvas> ```jsx import { PickerNetwork } from '../../ui/component-library/picker-network'; <PickerNetwork label="Arbitrum One" /> <PickerNetwork label="Polygon Mainnet" /> <PickerNetwork label="Optimism" /> ```