-
Notifications
You must be signed in to change notification settings - Fork 216
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: Upgrade Storybook to v6.1.3 (#897)
* fix(badge): Remove trailing slash from count badge story * refactor: Remove hierarchy separator from stories * fix: Add new line between JSX tags for welcome docs * refactor: Rename card mdx story to have the correct suffix * refactor: Remove hierarchy separator from stories * chore: Upgrade storybook * chore: Update card story imports to the new names * refactor: Adopt new storybook config format * chore: Rename doc stories now that mdx requires .stories suffix * fix: Tweak how static members are defined * build: Add babel config back into storybook * fix: Resolve type export warnings * refactor: Rename card mdx story to have the correct suffix * fix: Resolve browserslist warning * chore: Upgrade to storybook@6.0.28 * feat: Re-add travis filter for storybook webpack config * build: Generate stories.json file on master merge * build: Add babel config to make IE11 happy * build: Remove unecessary babel config (dupes) * fix: Also convert mdx github links * fix: Upgrade cypress-storybook (causing IE compat issue) * chore: Update publish-canary.js * refactor: Update stories to remove files referencing the same "kind" https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#deprecated-support-for-duplicate-kinds * fix: Upgrade cypress-storybook for IE Compat * fix: Use generics instead of overloading to prevent TS error * ci: Try to fix cache warning * fix: Enforce story preview body margin for snapshot review * Revert "refactor: Update stories to remove files referencing the same "kind"" This reverts commit 220c4f7. * fix: Update withSnapshotsEnabled helper * fix: Update stories to prevent duplicate kind warning * fix: Fix spacing differences in preview body * chore: Remove unnecessary comments * chore: Revert change to cypress dep after rebase error * fix: Fix duplicate kind warning without putting theme stories in folder * chore: Upgrade storybook to 6.1.3 * docs: Update documentation using storybook APIs * fix: De-dupe yarn.lock to fix popper type error * chore: Rename story file to make contents clearer * fix: Remove max-buffer from canary script added in merge Co-authored-by: Lynn Chyi <14299381+lychyi@users.noreply.github.com>
- Loading branch information
Showing
195 changed files
with
4,304 additions
and
3,118 deletions.
There are no files selected for viewing
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,66 @@ | ||
const path = require('path'); | ||
const DocgenPlugin = require('./docgen-plugin'); | ||
|
||
const modulesPath = path.resolve(__dirname, '../modules'); | ||
|
||
module.exports = { | ||
stories: [ | ||
'./stories/*.stories.mdx', | ||
'../modules/**/*.stories.mdx', | ||
'../modules/**/stories*.@(js|jsx|ts|tsx)', | ||
], | ||
addons: [ | ||
{ | ||
name: '@storybook/addon-essentials', | ||
options: { | ||
actions: false, // Disabled because actions is SLOW | ||
}, | ||
}, | ||
'storybook-readme', | ||
'@storybook/addon-knobs', | ||
'@storybook/addon-storysource', | ||
'@storybook/preset-scss', | ||
], | ||
webpackFinal: async config => { | ||
// Convert mdx links to point to github | ||
config.module.rules.push({ | ||
test: /\.mdx?$/, | ||
include: [path.resolve(__dirname, '..')], | ||
exclude: [/node_modules/], | ||
use: [ | ||
{ | ||
loader: path.resolve(__dirname, 'webpack-loader-redirect-mdx-to-github'), | ||
}, | ||
], | ||
}); | ||
|
||
// Load the source code of story files to display in docs. | ||
config.module.rules.push({ | ||
test: /stories.*\.tsx?$/, | ||
include: [modulesPath], | ||
loaders: [ | ||
{ | ||
loader: require.resolve('@storybook/source-loader'), | ||
options: {parser: 'typescript'}, | ||
}, | ||
], | ||
enforce: 'pre', | ||
}); | ||
|
||
config.plugins.push(new DocgenPlugin()); | ||
|
||
// Remove progress updates to reduce log lines in Travis | ||
// See: https://github.com/storybookjs/storybook/issues/2029 | ||
if (process.env.TRAVIS) { | ||
config.plugins = config.plugins.filter( | ||
plugin => plugin.constructor.name !== 'ProgressPlugin' | ||
); | ||
} | ||
|
||
return config; | ||
}, | ||
babel: async options => ({ | ||
...options, | ||
plugins: [...options.plugins, '@babel/plugin-transform-modules-commonjs'], | ||
}), | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
import {addons} from '@storybook/addons'; | ||
import theme from './theme'; | ||
|
||
addons.setConfig({ | ||
theme, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,48 @@ | ||
import {DocsPage, DocsContainer} from '@storybook/addon-docs/blocks'; | ||
import 'cypress-storybook/react'; | ||
|
||
import {CanvasProviderDecorator, FontsDecorator} from '../utils/storybook'; | ||
import theme from './theme'; | ||
|
||
/** If the string contains a phrase, prefix it. This is useful for making ordering sections */ | ||
const prefix = (phrase, prefix) => (/** @type {string} */ value) => { | ||
const index = value.indexOf(phrase); | ||
return index > -1 ? value.substr(0, index) + prefix + value.substr(index) : value; | ||
}; | ||
const pipe = (...fns) => value => fns.reduce((result, fn) => fn(result), value); | ||
|
||
function storySort(a, b) { | ||
const prefixFn = pipe( | ||
prefix('welcome-', '0'), | ||
prefix('getting-started', 'a'), | ||
prefix('tokens-', '1'), | ||
prefix('components-', '2'), | ||
prefix('labs-', '3'), | ||
prefix('default', 'aa'), | ||
prefix('visual-testing', 'zz') | ||
); | ||
|
||
const left = prefixFn(a[0]); | ||
const right = prefixFn(b[0]); | ||
|
||
return left === right ? 0 : left.localeCompare(right); | ||
} | ||
|
||
export const decorators = [FontsDecorator, CanvasProviderDecorator]; | ||
|
||
export const parameters = { | ||
options: { | ||
storySort, | ||
}, | ||
docs: { | ||
theme, | ||
container: DocsContainer, | ||
page: DocsPage, | ||
}, | ||
readme: { | ||
codeTheme: 'github', | ||
}, | ||
chromatic: { | ||
disable: true, | ||
}, | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
import {themes, create} from '@storybook/theming'; | ||
import {commonColors, typeColors, fontFamily} from '../modules/core/react'; | ||
|
||
export default create({ | ||
...themes.light, // Overrides a user's preferred color scheme (e.g. Dark Mode), will need to flesh this out later when CK is compatible with a dark mode | ||
brandTitle: 'Canvas Kit', | ||
mainTextColor: typeColors.body, | ||
mainTextFace: fontFamily, | ||
mainBackground: commonColors.backgroundAlt, | ||
}); |
Oops, something went wrong.