chore: update storybook configuration #418
Conversation
| @@ -101,6 +104,7 @@ | |||
| "rollup-plugin-size-snapshot": "0.12.0", | |||
| "rollup-plugin-typescript2": "0.31.1", | |||
| "styled-components": "5.3.3", | |||
| "tailwindcss": "3.0.19", | |||
There was a problem hiding this comment.
What was the reason for adding tailwindcss and @zendeskgarden/tailwindcss?
There was a problem hiding this comment.
Looks like tailwindcss is the library and @zendeskgarden/tailwindcss is the plugin.
There was a problem hiding this comment.
Maybe for styling storybook with some sane defaults: https://github.com/zendeskgarden/react-containers/pull/418/files#diff-2b5e28aefe329b32c6b4fd8923ed58c50ea800a653d78c14f6c26abcd4b6c0fe
There was a problem hiding this comment.
@Francois-Esquire tailwind is a plugin peer dependency. See https://github.com/zendeskgarden/tailwindcss/blob/1ec2b62bc4bbb6214237c8ad2bf6fb736af949b9/plugin/package.json#L38-L40
There was a problem hiding this comment.
@mtomcal if you haven't yet, please see the PR description.
| node_modules | ||
| utils/storybook/coverage | ||
| *.log | ||
|
|
||
| # Package specific | ||
| packages/**/dist | ||
| package-lock.json | ||
|
|
||
| # Demo specific | ||
| demo/**/* |
There was a problem hiding this comment.
Has there been any changes to add demo folder yet?
There was a problem hiding this comment.
Not yet. TBD per PR description.
| @@ -16,7 +16,7 @@ | |||
| "lint:md": "markdownlint README.md packages/*/src/**/*.md packages/*/src/*.md packages/*/README.md", | |||
| "new": "utils/scripts/new.js", | |||
| "prepare": "yarn build", | |||
| "start": "start-storybook -p 6006", | |||
| "start": "start-storybook --no-version-updates -p 6006", | |||
There was a problem hiding this comment.
I can't find --no-version-updates in their CLI docs. https://storybook.js.org/docs/react/api/cli-options Is this an undocumented flag?
There was a problem hiding this comment.
it's documented with yarn start-storybook --help. Also see storybookjs/storybook#8488
Description
Sets
react-containersup for enhanced storybook usage that is consistent withreact-componentsand the refactor that happened under zendeskgarden/react-components#1265. Note, unlike that former (gigantic ... lessons learned 😬) PR, this isolates configuration updates in prep for futuredemostorybook refactors. My plan is to take those refactors one package at a time.Some of the goodies to highlight here include:
import { useAccordion } from '@zendeskgarden/container-accordion';(see.storybook/babel.config.jsand.tsconfig.jsonfor details)tailwindcssfor rudimentary demo styling 🎉. The storybook demos underreact-containersare intentionally not meant to mirror the high-fidelity design styling ofreact-components. However, there's no need to make demo-life harder on ourselves than necessary.react-components: add-on panel position, alphabetically sorted controls, etcoutlinea bit more visual "punch" (it is sometimes a bit difficult to see the default gray in these un-styled demos)Checklist
yarn start)analyzed via axe and evaluated using VoiceOverincludes new unit tests