1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 01:47:00 +01:00

Replacing Deprecated Constants (#19333)

This commit is contained in:
rohit kerkar 2023-06-01 22:03:11 +05:30 committed by GitHub
parent 33cd2c7c18
commit ee9f7949f9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 17 additions and 17 deletions

View File

@ -87,7 +87,7 @@ An example of a form using the `FormTextField` component.
```jsx
import React, { useState, useEffect } from 'react';
import {
DISPLAY,
Display,
TextColor,
AlignItems,
TextVariant,
@ -225,7 +225,7 @@ return (
error={Boolean(submitted === FORM_STATE.ERROR && errors.chainId)}
helpText={submitted === FORM_STATE.ERROR ? errors.chainId : null}
/>
<Box display={DISPLAY.FLEX} alignItems={AlignItems.center} gap={1}>
<Box display={Display.Flex} alignItems={AlignItems.center} gap={1}>
<ButtonPrimary type="submit">Submit</ButtonPrimary>
</Box>
</Box>
@ -256,7 +256,7 @@ There will be times when you will want to use a custom `Label` or `HelpText`. Th
```jsx
import {
Size,
DISPLAY,
Display,
IconColor,
AlignItems,
JustifyContent,
@ -279,11 +279,11 @@ import {
FormTextField component
</Text>
<Box
display={DISPLAY.FLEX}
display={Display.Flex}
justifyContent={JustifyContent.spaceBetween}
alignItems={AlignItems.flexEnd}
>
<Box display={DISPLAY.FLEX} alignItems={AlignItems.center}>
<Box display={Display.Flex} alignItems={AlignItems.center}>
{/**
* If you need a custom label
* or require adding some form of customization
@ -314,7 +314,7 @@ import {
type={TEXT_FIELD_TYPES.NUMBER}
/>
<Box
display={DISPLAY.FLEX}
display={Display.Flex}
alignItems={AlignItems.flexStart}
justifyContent={JustifyContent.spaceBetween}
marginTop={1}

View File

@ -3,9 +3,9 @@ import PropTypes from 'prop-types';
import classnames from 'classnames';
import {
DISPLAY,
FLEX_DIRECTION,
SEVERITIES,
Display,
FlexDirection,
Severity,
Size,
} from '../../../helpers/constants/design-system';
@ -52,8 +52,8 @@ export const FormTextField = ({
{ 'mm-form-text-field--disabled': disabled },
className,
)}
display={DISPLAY.FLEX}
flexDirection={FLEX_DIRECTION.COLUMN}
display={Display.Flex}
flexDirection={FlexDirection.Column}
{...props}
>
{label && (
@ -102,7 +102,7 @@ export const FormTextField = ({
/>
{helpText && (
<HelpText
severity={error && SEVERITIES.DANGER}
severity={error && Severity.Danger}
marginTop={1}
{...helpTextProps}
className={classnames(

View File

@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
import { useArgs } from '@storybook/client-api';
import {
DISPLAY,
Display,
AlignItems,
TextVariant,
JustifyContent,
@ -369,7 +369,7 @@ export const FormExample = () => {
error={Boolean(submitted === FORM_STATE.ERROR && errors.chainId)}
helpText={submitted === FORM_STATE.ERROR ? errors.chainId : null}
/>
<Box display={DISPLAY.FLEX} alignItems={AlignItems.center} gap={1}>
<Box display={Display.Flex} alignItems={AlignItems.center} gap={1}>
<ButtonPrimary type="submit">Submit</ButtonPrimary>
</Box>
</Box>
@ -396,11 +396,11 @@ export const CustomLabelOrHelpText = () => (
FormTextField component
</Text>
<Box
display={DISPLAY.FLEX}
display={Display.Flex}
justifyContent={JustifyContent.spaceBetween}
alignItems={AlignItems.flexEnd}
>
<Box display={DISPLAY.FLEX} alignItems={AlignItems.center}>
<Box display={Display.Flex} alignItems={AlignItems.center}>
{/* If you need a custom label
or require adding some form of customization
import the Label component separately */}
@ -427,7 +427,7 @@ export const CustomLabelOrHelpText = () => (
type={TEXT_FIELD_TYPES.NUMBER}
/>
<Box
display={DISPLAY.FLEX}
display={Display.Flex}
alignItems={AlignItems.flexStart}
justifyContent={JustifyContent.spaceBetween}
>