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 with enums (#19242)

Browse Source
This commit is contained in:
Dhruv 2023-06-05 21:25:20 +05:30 committed by GitHub
parent 5c5de03846
commit 61e952bad0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 23 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ui/components/component-library/avatar-base/avatar-base.stories.tsx
View File

@ -1,4 +1,4 @@
import { ComponentMeta } from '@storybook/react'; import { Meta } from '@storybook/react';
import React from 'react'; import React from 'react';
import { import {
AlignItems, AlignItems,
@ -92,7 +92,7 @@ export default {
borderColor: BorderColor.borderDefault, borderColor: BorderColor.borderDefault,
children: 'B', children: 'B',
}, },
} as ComponentMeta<typeof AvatarBase>; } as Meta<typeof AvatarBase>;
export const DefaultStory = (args: AvatarBaseProps) => <AvatarBase {...args} />; export const DefaultStory = (args: AvatarBaseProps) => <AvatarBase {...args} />;

42
ui/components/component-library/text/text.stories.tsx
View File

@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { ComponentStory, ComponentMeta } from '@storybook/react'; import { StoryFn, Meta } from '@storybook/react';
import { import {
DISPLAY, Display,
BackgroundColor, BackgroundColor,
BorderColor, BorderColor,
FontWeight, FontWeight,
@ -10,8 +10,8 @@ import {
TextAlign, TextAlign,
OverflowWrap, OverflowWrap,
TextTransform, TextTransform,
FRACTIONS, BlockSize,
FLEX_DIRECTION, FlexDirection,
TextVariant, TextVariant,
Color, Color,
} from '../../../helpers/constants/design-system'; } from '../../../helpers/constants/design-system';
@ -30,7 +30,7 @@ export default {
page: README, page: README,
}, },
}, },
} as ComponentMeta<typeof Text>; } as Meta<typeof Text>;
function renderBackgroundColor(color) { function renderBackgroundColor(color) {
let bgColor; let bgColor;
@ -70,7 +70,7 @@ function renderBackgroundColor(color) {
return bgColor; return bgColor;
} }
const Template: ComponentStory<typeof Text> = (args) => ( const Template: StoryFn<typeof Text> = (args) => (
<Text {...args}>{args.children}</Text> <Text {...args}>{args.children}</Text>
); );
@ -92,7 +92,7 @@ export const Variant = (args) => (
</> </>
); );
export const ColorStory: ComponentStory<typeof Text> = (args) => { export const ColorStory: StoryFn<typeof Text> = (args) => {
// Index of last valid color in TextColor array // Index of last valid color in TextColor array
return ( return (
<> <>
@ -113,7 +113,7 @@ export const ColorStory: ComponentStory<typeof Text> = (args) => {
}; };
ColorStory.storyName = 'Color'; ColorStory.storyName = 'Color';
export const FontWeightStory: ComponentStory<typeof Text> = (args) => ( export const FontWeightStory: StoryFn<typeof Text> = (args) => (
<> <>
{Object.values(FontWeight).map((weight) => ( {Object.values(FontWeight).map((weight) => (
<Text {...args} fontWeight={weight} key={weight}> <Text {...args} fontWeight={weight} key={weight}>
@ -125,7 +125,7 @@ export const FontWeightStory: ComponentStory<typeof Text> = (args) => (
FontWeightStory.storyName = 'Font Weight'; FontWeightStory.storyName = 'Font Weight';
export const FontStyleStory: ComponentStory<typeof Text> = (args) => ( export const FontStyleStory: StoryFn<typeof Text> = (args) => (
<> <>
{Object.values(FontStyle).map((style) => ( {Object.values(FontStyle).map((style) => (
<Text {...args} fontStyle={style} key={style}> <Text {...args} fontStyle={style} key={style}>
@ -137,7 +137,7 @@ export const FontStyleStory: ComponentStory<typeof Text> = (args) => (
FontStyleStory.storyName = 'Font Style'; FontStyleStory.storyName = 'Font Style';
export const TextTransformStory: ComponentStory<typeof Text> = (args) => ( export const TextTransformStory: StoryFn<typeof Text> = (args) => (
<> <>
{Object.values(TextTransform).map((transform) => ( {Object.values(TextTransform).map((transform) => (
<Text {...args} textTransform={transform} key={transform}> <Text {...args} textTransform={transform} key={transform}>
@ -149,7 +149,7 @@ export const TextTransformStory: ComponentStory<typeof Text> = (args) => (
TextTransformStory.storyName = 'Text Transform'; TextTransformStory.storyName = 'Text Transform';
export const TextAlignStory: ComponentStory<typeof Text> = (args) => ( export const TextAlignStory: StoryFn<typeof Text> = (args) => (
<> <>
{Object.values(TextAlign).map((align) => ( {Object.values(TextAlign).map((align) => (
<Text {...args} textAlign={align} key={align}> <Text {...args} textAlign={align} key={align}>
@ -161,10 +161,10 @@ export const TextAlignStory: ComponentStory<typeof Text> = (args) => (
TextAlignStory.storyName = 'Text Align'; TextAlignStory.storyName = 'Text Align';
export const OverflowWrapStory: ComponentStory<typeof Text> = (args) => ( export const OverflowWrapStory: StoryFn<typeof Text> = (args) => (
<Box <Box
borderColor={BorderColor.warningDefault} borderColor={BorderColor.warningDefault}
display={DISPLAY.BLOCK} display={Display.Block}
style={{ width: 200 }} style={{ width: 200 }}
> >
<Text {...args} overflowWrap={OverflowWrap.Normal}> <Text {...args} overflowWrap={OverflowWrap.Normal}>
@ -178,11 +178,11 @@ export const OverflowWrapStory: ComponentStory<typeof Text> = (args) => (
OverflowWrapStory.storyName = 'Overflow Wrap'; OverflowWrapStory.storyName = 'Overflow Wrap';
export const Ellipsis: ComponentStory<typeof Text> = (args) => ( export const Ellipsis: StoryFn<typeof Text> = (args) => (
<Box <Box
borderColor={BorderColor.primaryDefault} borderColor={BorderColor.primaryDefault}
display={DISPLAY.BLOCK} display={Display.Block}
width={FRACTIONS.ONE_THIRD} width={BlockSize.OneThird}
> >
<Text {...args} ellipsis> <Text {...args} ellipsis>
Ellipsis: 0x39013f961c378f02c2b82a6e1d31e9812786fd9d Ellipsis: 0x39013f961c378f02c2b82a6e1d31e9812786fd9d
@ -193,7 +193,7 @@ export const Ellipsis: ComponentStory<typeof Text> = (args) => (
</Box> </Box>
); );
export const As: ComponentStory<typeof Text> = (args) => ( export const As: StoryFn<typeof Text> = (args) => (
<> <>
{Object.keys(ValidTag).map((tag) => { {Object.keys(ValidTag).map((tag) => {
if (ValidTag[tag] === ValidTag.Input) { if (ValidTag[tag] === ValidTag.Input) {
@ -217,11 +217,11 @@ export const As: ComponentStory<typeof Text> = (args) => (
</> </>
); );
export const TextDirectionStory: ComponentStory<typeof Text> = (args) => ( export const TextDirectionStory: StoryFn<typeof Text> = (args) => (
<Box <Box
style={{ maxWidth: 300 }} style={{ maxWidth: 300 }}
display={DISPLAY.FLEX} display={Display.Flex}
flexDirection={FLEX_DIRECTION.COLUMN} flexDirection={FlexDirection.Column}
gap={4} gap={4}
> >
<Text {...args} textDirection={TextDirection.LeftToRight}> <Text {...args} textDirection={TextDirection.LeftToRight}>
@ -237,7 +237,7 @@ export const TextDirectionStory: ComponentStory<typeof Text> = (args) => (
</Box> </Box>
); );
export const Strong: ComponentStory<typeof Text> = (args) => ( export const Strong: StoryFn<typeof Text> = (args) => (
<> <>
<Text {...args} as="strong"> <Text {...args} as="strong">
This is an as="strong" demo. This is an as="strong" demo.