mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
Consolidated all component import paths (#17368)
This commit is contained in:
parent
709d0267f8
commit
1d1b751f62
@ -37,7 +37,7 @@ Possible sizes include:
|
||||
|
||||
```jsx
|
||||
import { SIZES } from '../../../helpers/constants/design-system';
|
||||
import { ButtonBase } from '../../ui/components/component-library';
|
||||
import { ButtonBase } from '../../component-library';
|
||||
|
||||
<ButtonBase size={SIZES.AUTO} />
|
||||
<ButtonBase size={SIZES.SM} />
|
||||
@ -55,7 +55,7 @@ Use boolean `block` prop to quickly enable a full width block button
|
||||
|
||||
```jsx
|
||||
import { DISPLAY } from '../../../helpers/constants/design-system';
|
||||
import { ButtonBase } from '../../ui/components/component-library';
|
||||
import { ButtonBase } from '../../component-library';
|
||||
|
||||
<ButtonBase>Default Button</ButtonBase>
|
||||
<ButtonBase block>Block Button</ButtonBase>
|
||||
@ -77,7 +77,7 @@ Button `as` options:
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { ButtonBase } from '../../ui/components/component-library';
|
||||
import { ButtonBase } from '../../component-library';
|
||||
|
||||
|
||||
<ButtonBase as="button">Button Element</ButtonBase>
|
||||
@ -95,7 +95,7 @@ When an `href` prop is passed it will change the element to an anchor(`a`) tag.
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { ButtonBase } from '../../ui/components/component-library';
|
||||
import { ButtonBase } from '../../component-library';
|
||||
|
||||
<ButtonBase href="/metamask">Anchor Element</ButtonBase>;
|
||||
```
|
||||
@ -109,7 +109,7 @@ Use the boolean `disabled` prop to disable button
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { ButtonBase } from '../../ui/components/component-library';
|
||||
import { ButtonBase } from '../../component-library';
|
||||
|
||||
<ButtonBase disabled>Disabled Button</ButtonBase>;
|
||||
```
|
||||
@ -123,7 +123,7 @@ Use the boolean `loading` prop to set loading spinner
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { ButtonBase } from '../../ui/components/component-library';
|
||||
import { ButtonBase } from '../../component-library';
|
||||
|
||||
<ButtonBase loading>Loading Button</ButtonBase>;
|
||||
```
|
||||
@ -137,7 +137,7 @@ Use the `iconName` prop and the `ICON_NAMES` object from `./ui/components/compon
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { ButtonBase } from '../../ui/components/component-library';
|
||||
import { ButtonBase } from '../../component-library';
|
||||
import { ICON_NAMES } from '../icon';
|
||||
|
||||
<ButtonBase icon={ICON_NAMES.ADD_SQUARE}>Button</ButtonBase>;
|
||||
|
@ -34,7 +34,7 @@ Possible sizes include:
|
||||
|
||||
```jsx
|
||||
import { SIZES } from '../../../helpers/constants/design-system';
|
||||
import { ButtonPrimary } from '../../ui/components/component-library';
|
||||
import { ButtonPrimary } from '../../component-library';
|
||||
|
||||
<ButtonPrimary size={SIZES.SM} />
|
||||
<ButtonPrimary size={SIZES.MD} />
|
||||
@ -50,7 +50,7 @@ Use the `danger` boolean prop to change the `ButtonPrimary` to danger color.
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { ButtonPrimary } from '../../ui/components/component-library';
|
||||
import { ButtonPrimary } from '../../component-library';
|
||||
|
||||
<ButtonPrimary>Normal</ButtonPrimary>
|
||||
<ButtonPrimary danger>Danger</ButtonPrimary>
|
||||
|
@ -34,7 +34,7 @@ Possible sizes include:
|
||||
|
||||
```jsx
|
||||
import { SIZES } from '../../../helpers/constants/design-system';
|
||||
import { ButtonSecondary } from '../../ui/components/component-library';
|
||||
import { ButtonSecondary } from '../../component-library';
|
||||
|
||||
<ButtonSecondary size={SIZES.SM} />
|
||||
<ButtonSecondary size={SIZES.MD} />
|
||||
@ -50,8 +50,7 @@ Use the `danger` boolean prop to change the `ButtonSecondary` to danger color.
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { ButtonSecondary } from '../../ui/components/component-library';
|
||||
|
||||
import { ButtonSecondary } from '../../component-library';
|
||||
<ButtonSecondary>Normal</ButtonSecondary>
|
||||
<ButtonSecondary danger>Danger</ButtonSecondary>
|
||||
```
|
||||
|
@ -29,7 +29,7 @@ Optional: `TEXT_VARIANTS` from ./text object can also be used.
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { Text } from '../../ui/components/component-library';
|
||||
import { Text } from '../../component-library';
|
||||
import { TEXT } from '../../../helpers/constants/design-system';
|
||||
|
||||
<Text variant={TEXT.DISPLAY_MD}>display-md</Text>
|
||||
@ -54,7 +54,7 @@ Use the `color` prop and the `COLORS` object from `./ui/helpers/constants/design
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { Text } from '../../ui/components/component-library';
|
||||
import { Text } from '../../component-library';
|
||||
import { COLORS } from '../../../helpers/constants/design-system';
|
||||
|
||||
<Text color={COLORS.TEXT_DEFAULT}>
|
||||
@ -111,7 +111,7 @@ Use the `fontWeight` prop and the `FONT_WEIGHT` object from `./ui/helpers/consta
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { Text } from '../../ui/components/component-library';
|
||||
import { Text } from '../../component-library';
|
||||
import { FONT_WEIGHT } from '../../../helpers/constants/design-system';
|
||||
|
||||
<Text fontWeight={FONT_WEIGHT.NORMAL}>
|
||||
@ -137,7 +137,7 @@ Use the `fontStyle` prop and the `FONT_STYLE` object from `./ui/helpers/constant
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { Text } from '../../ui/components/component-library';
|
||||
import { Text } from '../../component-library';
|
||||
import { FONT_STYLE } from '../../../helpers/constants/design-system';
|
||||
|
||||
<Text fontStyle={FONT_STYLE.NORMAL}>
|
||||
@ -157,7 +157,7 @@ Use the `textTransform` prop and the `TEXT_TRANSFORM` object from `./ui/helpers/
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { Text } from '../../ui/components/component-library';
|
||||
import { Text } from '../../component-library';
|
||||
import { TEXT_TRANSFORM } from '../../../helpers/constants/design-system';
|
||||
|
||||
<Text textAlign={TEXT_TRANSFORM.UPPERCASE}>
|
||||
@ -180,7 +180,7 @@ Use the `textAlign` prop and the `TEXT_ALIGN` object from `./ui/helpers/constant
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { Text } from '../../ui/components/component-library';
|
||||
import { Text } from '../../component-library';
|
||||
import { TEXT_ALIGN } from '../../../helpers/constants/design-system';
|
||||
|
||||
<Text textAlign={TEXT_ALIGN.LEFT}>
|
||||
@ -209,7 +209,7 @@ Use the `overflowWrap` prop and the `OVERFLOW_WRAP` object from `./ui/helpers/co
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { Text } from '../../ui/components/component-library';
|
||||
import { Text } from '../../component-library';
|
||||
import { OVERFLOW_WRAP } from '../../../helpers/constants/design-system';
|
||||
|
||||
<div
|
||||
@ -237,7 +237,7 @@ Use the boolean `ellipsis` prop to change the if the `Text` component to have an
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { Text } from '../../ui/components/component-library';
|
||||
import { Text } from '../../component-library';
|
||||
|
||||
<div
|
||||
style={{
|
||||
@ -260,7 +260,7 @@ Use the `as` prop to change the root html element of the `Text` component
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { Text } from '../../ui/components/component-library';
|
||||
import { Text } from '../../component-library';
|
||||
|
||||
<Text as="dd">dd</Text>
|
||||
<Text as="div">div</Text>
|
||||
@ -308,7 +308,7 @@ Use the `textDirection` prop and the `TEXT_DIRECTIONS` object from `./text.const
|
||||
</Canvas>
|
||||
|
||||
```jsx
|
||||
import { Text, TEXT_DIRECTIONS } from '../../ui/components/component-library';
|
||||
import { Text, TEXT_DIRECTIONS } from '../../component-library';
|
||||
|
||||
<Text textDirection={TEXT_DIRECTIONS.LEFT_TO_RIGHT}>
|
||||
This is left to right (ltr) for English and most languages
|
||||
|
@ -2,7 +2,7 @@ import React, { PureComponent } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import Button from '../../../components/ui/button';
|
||||
import { Tag } from '../../../components/component-library/tag';
|
||||
import { Tag } from '../../../components/component-library';
|
||||
|
||||
import { SUPPORT_REQUEST_LINK } from '../../../helpers/constants/common';
|
||||
import { isBeta } from '../../../helpers/utils/build-types';
|
||||
|
Loading…
x
Reference in New Issue
Block a user