mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-11-22 09:57:02 +01:00
housekeeping for picker-network (#16982)
* updated test in picker-network * fixed import order in README * fixed global import path * fixed formatting
This commit is contained in:
parent
c9ddee9155
commit
a1c5224997
@ -16,21 +16,6 @@ The `PickerNetwork` accepts all props below as well as all [Box](/docs/ui-compon
|
||||
|
||||
<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
|
||||
@ -40,8 +25,23 @@ Use the `label` prop for the text content of the `PickerNetwork` component
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { PickerNetwork } from '../../ui/component-library/picker-network';
|
||||
<PickerNetwork label="Arbitrum One" />
|
||||
<PickerNetwork label="Polygon Mainnet" />
|
||||
<PickerNetwork label="Optimism" />
|
||||
import { PickerNetwork } from '../../ui/component-library';
|
||||
<PickerNetwork label="Arbitrum One" />
|
||||
<PickerNetwork label="Polygon Mainnet" />
|
||||
<PickerNetwork label="Optimism" />
|
||||
```
|
||||
|
||||
### Src
|
||||
|
||||
Use the `src` prop with an image url to render the `AvatarNetwork`. Use the `avatarNetworkProps` to pass additional props to the `AvatarNetwork` component.
|
||||
|
||||
<Canvas>
|
||||
<Story id="ui-components-component-library-picker-network-picker-network-stories-js--src" />
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { PickerNetwork } from '../../ui/component-library';
|
||||
<PickerNetwork src="./images/arbitrum.svg" />
|
||||
<PickerNetwork src="./images/matic-token.png" />
|
||||
<PickerNetwork src="./images/optimism.svg" />
|
||||
```
|
@ -54,4 +54,11 @@ describe('PickerNetwork', () => {
|
||||
'down-arrow-picker-icon',
|
||||
);
|
||||
});
|
||||
// className
|
||||
it('should render with custom className', () => {
|
||||
const { getByTestId } = render(
|
||||
<PickerNetwork data-testid="picker-network" className="test-class" />,
|
||||
);
|
||||
expect(getByTestId('picker-network')).toHaveClass('test-class');
|
||||
});
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user