Skip to content

Commit

Permalink
chore(product-components): update the storybook to 8.5.4
Browse files Browse the repository at this point in the history
  • Loading branch information
@vojtatranta
vojtatranta committed Feb 11, 2025
1 parent b2de51f commit 6247ba3
Show file tree
Hide file tree
Showing 6 changed files with 252 additions and 2,509 deletions.
53 changes: 48 additions & 5 deletions packages/product-components/.storybook/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,22 +9,65 @@ function getAbsolutePath(value) {
}

module.exports = {
stories: ['../src/**/*.stories.*'],
stories: ['../src/**/*.@(mdx|stories.*)'],
logLevel: 'debug',

addons: [
getAbsolutePath('@storybook/addon-links'),
getAbsolutePath('@storybook/addon-controls'),
getAbsolutePath('@storybook/addon-viewport'),
getAbsolutePath('@storybook/addon-actions'),
],

staticDirs: ['../public', { from: '../../suite-data/files', to: '/static' }],

framework: {
name: getAbsolutePath('@storybook/react-webpack5'),
name: getAbsolutePath('@storybook/nextjs'),
options: {},
},
babel: options => {
options.presets.push('@babel/preset-typescript');

return options;
typescript: {
check: false, // Disable type checking
reactDocgen: 'react-docgen-typescript',
reactDocgenTypescriptOptions: {
shouldExtractLiteralValuesFromEnum: true,
propFilter: prop => (prop.parent ? !/node_modules/.test(prop.parent.fileName) : true),
skipChildrenPropWithoutDoc: false,
},
},

webpackFinal: config => {
// Add TypeScript support
config.module.rules.push({
test: /\.tsx?$/,
use: [
{
loader: require.resolve('babel-loader'),
options: {
presets: [
'@babel/preset-env',
['@babel/preset-react', { runtime: 'automatic' }],
'@babel/preset-typescript',
],
},
},
],
});

// NOTE: remove the previous loaders from handling the svgs
const imageRule = config.module.rules.find(rule => rule?.['test']?.test('.svg'));
if (imageRule) {
imageRule['exclude'] = /\.svg$/;
}

// Configure SVG files to match the main project's webpack config
config.module.rules.push({
test: /\.(gif|jpe?g|png|svg)$/,
type: 'asset/resource',
});

return config;
},

docs: {},
};
25 changes: 25 additions & 0 deletions packages/product-components/.storybook/preview.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import React from 'react';

import { StoryWrapper } from '@trezor/components';

export const decorators = [
(Story, context) => {
const story = () => React.createElement(Story, null);

return context?.parameters?.noWrapper
? story()
: React.createElement(StoryWrapper, null, story());
},
];

export const parameters = {
options: {
showPanel: true,
showInfo: true,
panelPosition: 'right',
},
theme: {
base: 'light',
},
};
export const tags = ['autodocs'];
22 changes: 0 additions & 22 deletions packages/product-components/.storybook/preview.jsx
View file

This file was deleted.

23 changes: 13 additions & 10 deletions packages/product-components/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,18 +36,21 @@
"zxcvbn": "^4.4.2"
},
"devDependencies": {
"@storybook/addon-actions": "^7.6.13",
"@storybook/addon-controls": "^7.6.13",
"@storybook/addon-links": "^7.6.13",
"@storybook/addon-viewport": "^7.6.13",
"@storybook/addons": "^7.6.13",
"@storybook/client-api": "^7.6.13",
"@storybook/react": "^7.6.13",
"@storybook/react-webpack5": "^7.6.13",
"@storybook/theming": "^7.6.13",
"@storybook/addon-actions": "^8.5.4",
"@storybook/addon-controls": "^8.5.4",
"@storybook/addon-links": "^8.5.4",
"@storybook/addon-viewport": "^8.5.4",
"@storybook/addon-webpack5-compiler-babel": "^3.0.5",
"@storybook/addons": "^7.6.17",
"@storybook/client-api": "^7.6.17",
"@storybook/nextjs": "^8.5.4",
"@storybook/react": "^8.5.4",
"@storybook/test": "^8.5.4",
"@storybook/theming": "^8.5.4",
"@trezor/eslint": "workspace:*",
"@types/react": "18.2.79",
"storybook": "^7.6.13",
"file-loader": "^6.2.0",
"storybook": "^8.5.4",
"stylelint": "^16.2.1",
"typescript-styled-plugin": "^0.18.3"
}
Expand Down
94 changes: 63 additions & 31 deletions packages/product-components/src/components/CoinLogo/coins.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,38 +12,70 @@ export type LegacyNetworkSymbol =
| 'vtc'
| 'btg';

// Import SVGs
import ada from '../../images/coins/ada.svg';
import arb from '../../images/coins/arb.svg';
import base from '../../images/coins/base.svg';
import bch from '../../images/coins/bch.svg';
import bsc from '../../images/coins/bsc.svg';
import btc from '../../images/coins/btc.svg';
import btc_test from '../../images/coins/btc_test.svg';
import btg from '../../images/coins/btg.svg';
import dash from '../../images/coins/dash.svg';
import dgb from '../../images/coins/dgb.svg';
import doge from '../../images/coins/doge.svg';
import dsol from '../../images/coins/dsol.svg';
import eos from '../../images/coins/eos.svg';
import etc from '../../images/coins/etc.svg';
import eth from '../../images/coins/eth.svg';
import ltc from '../../images/coins/ltc.svg';
import nem from '../../images/coins/nem.svg';
import nmc from '../../images/coins/nmc.svg';
import op from '../../images/coins/op.svg';
import pol from '../../images/coins/pol.svg';
import sol from '../../images/coins/sol.svg';
import tada from '../../images/coins/tada.svg';
import thol from '../../images/coins/thol.svg';
import tsep from '../../images/coins/tsep.svg';
import txrp from '../../images/coins/txrp.svg';
import vtc from '../../images/coins/vtc.svg';
import xlm from '../../images/coins/xlm.svg';
import xrp from '../../images/coins/xrp.svg';
import xtz from '../../images/coins/xtz.svg';
import zec from '../../images/coins/zec.svg';

export const COINS: Record<NetworkSymbol | LegacyNetworkSymbol, string> = {
ada: require('../../images/coins/ada.svg'),
arb: require('../../images/coins/arb.svg'),
base: require('../../images/coins/base.svg'),
bch: require('../../images/coins/bch.svg'),
bsc: require('../../images/coins/bsc.svg'),
btc: require('../../images/coins/btc.svg'),
btg: require('../../images/coins/btg.svg'),
dash: require('../../images/coins/dash.svg'),
dgb: require('../../images/coins/dgb.svg'),
doge: require('../../images/coins/doge.svg'),
dsol: require('../../images/coins/dsol.svg'),
eos: require('../../images/coins/eos.svg'),
etc: require('../../images/coins/etc.svg'),
eth: require('../../images/coins/eth.svg'),
ltc: require('../../images/coins/ltc.svg'),
op: require('../../images/coins/op.svg'),
pol: require('../../images/coins/pol.svg'),
nem: require('../../images/coins/nem.svg'),
nmc: require('../../images/coins/nmc.svg'),
regtest: require('../../images/coins/btc_test.svg'),
sol: require('../../images/coins/sol.svg'),
tada: require('../../images/coins/tada.svg'),
test: require('../../images/coins/btc_test.svg'),
thol: require('../../images/coins/thol.svg'),
tsep: require('../../images/coins/tsep.svg'),
txrp: require('../../images/coins/txrp.svg'),
vtc: require('../../images/coins/vtc.svg'),
xlm: require('../../images/coins/xlm.svg'),
xrp: require('../../images/coins/xrp.svg'),
xtz: require('../../images/coins/xtz.svg'),
zec: require('../../images/coins/zec.svg'),
ada,
arb,
base,
bch,
bsc,
btc,
btg,
dash,
dgb,
doge,
dsol,
eos,
etc,
eth,
ltc,
op,
pol,
nem,
nmc,
regtest: btc_test,
sol,
tada,
test: btc_test,
thol,
tsep,
txrp,
vtc,
xlm,
xrp,
xtz,
zec,
};

export const isCoinSymbol = (
Expand Down
Loading

0 comments on commit 6247ba3

Please sign in to comment.