1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
metamask-extension/ui/components/ui/truncated-definition-list/truncated-definition-list.stories.js
Nidhi Kumari c5368c152b
Added storybook check to CI (#17092)
* added storybook test runner

* added test runner in ci

* updated test for ci and fixed lint error

* updated lavamoat policy

* updated test command

* updated playwright

* changed command to storybook;ci

* updated command

* updated instance for test-storybook

* updated playwright

* added playwright step

* replaced concurrently with start-server-and-test

* updated the static storybook directory

* replaced first with last

* updated lock file

* replaced first with last

* updated test-storybook with maxworkers

* updated .depchechrc

* updated yml

* removed id from banner base

* replaced broken stories with .stories-to-do.js extesnsion

* updated token allowance story

* removed duplicacies from yarn

* fixed lavamoat

* removed filename comment

* updated links for docs

* fixed file extension for stories

* updated path for stories.json

* updated stories.json path

* yarn updated

* updated stories

* updated yarn

* updated wait on
2023-01-21 00:57:46 +05:30

60 lines
1.4 KiB
JavaScript

import React from 'react';
import TruncatedDefinitionList from './truncated-definition-list';
export default {
title: 'Components/UI/TruncatedDefinitionList',
argTypes: {
title: {
control: 'text',
},
dictionary: {
control: 'object',
},
prefaceKeys: {
control: 'object',
},
},
args: {
title: 'Basic definitions',
},
};
const basic = {
term: 'a word or phrase used to describe a thing or to express a concept, especially in a particular kind of language or branch of study.',
definition:
'a statement of the exact meaning of a word, especially in a dictionary.',
dl: 'HTML tag denoting a definition list',
dt: 'HTML tag denoting a definition list term',
dd: 'HTML tag denoting a definition list definition',
};
const advanced = {
'Network name': 'Ethereum Mainnet',
'Chain ID': '1',
Ticker: 'ETH',
};
const tooltips = {
'Network name': 'The name that is associated with this network',
'Chain ID': 'The numeric value representing the ID of this network',
Ticker: 'The currency symbol of the primary currency for this network',
};
export const DefaultStory = (args) => <TruncatedDefinitionList {...args} />;
DefaultStory.storyName = 'Default';
DefaultStory.args = {
dictionary: basic,
prefaceKeys: ['term', 'definition'],
};
export const WithTooltips = (args) => <TruncatedDefinitionList {...args} />;
WithTooltips.args = {
dictionary: advanced,
tooltips,
prefaceKeys: ['Chain ID'],
};