m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

Replacing Deprecated Constants (#19333)

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
ui/components/component-library/form-text-field/README.mdx
View File

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

12
ui/components/component-library/form-text-field/form-text-field.js
View File

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

10
ui/components/component-library/form-text-field/form-text-field.stories.js
View File

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