-
Notifications
You must be signed in to change notification settings - Fork 901
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(storybook): Add storybook support (#8360)
Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com>
- Loading branch information
1 parent
bce98d8
commit c72e224
Showing
6 changed files
with
3,483 additions
and
97 deletions.
There are no files selected for viewing
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,20 @@ | ||
{ | ||
"presets": [ | ||
[ | ||
"@babel/preset-env", | ||
{ | ||
"corejs": 3, | ||
"useBuiltIns": "usage", | ||
"shippedProposals": true, | ||
"targets": { | ||
"browsers": [ | ||
"last 2 Chrome versions", | ||
"last 2 Edge versions", | ||
"last 2 Firefox versions", | ||
"last 2 Safari versions" | ||
] | ||
} | ||
} | ||
] | ||
] | ||
} |
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,26 @@ | ||
const deckWebpackConfigurer = require('../webpack.config'); | ||
|
||
module.exports = { | ||
addons: ['@storybook/preset-typescript'], | ||
stories: ['../app/scripts/modules/core/src/presentation/**/*.stories.[tj]sx'], | ||
webpackFinal: async config => { | ||
const deckWebpackConfig = deckWebpackConfigurer({}, {}); | ||
|
||
config.resolve = { | ||
...config.resolve, | ||
alias: deckWebpackConfig.resolve.alias, | ||
extensions: deckWebpackConfig.resolve.extensions, | ||
modules: deckWebpackConfig.resolve.modules, | ||
}; | ||
|
||
config.module.rules = deckWebpackConfig.module.rules.map(rule => { | ||
// There are some issues with thread-loader and storybook, so disabling it until it gets fixed. | ||
rule.use = (rule.use || []).filter(({ loader }) => loader !== 'thread-loader'); | ||
return rule; | ||
}); | ||
|
||
config.watch = true; | ||
|
||
return config; | ||
}, | ||
}; |
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
26 changes: 26 additions & 0 deletions
26
app/scripts/modules/core/src/presentation/modal/Modal.stories.tsx
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,26 @@ | ||
import React from 'react'; | ||
import { Button } from '@storybook/react/demo'; | ||
|
||
import { Modal, ModalBody, ModalHeader, showModal } from './index'; | ||
|
||
export default { component: Modal, title: 'Modal' }; | ||
|
||
const ModalWithoutFooterComponent = () => { | ||
return ( | ||
<> | ||
<ModalHeader>Modal</ModalHeader> | ||
<ModalBody> | ||
<div className="flex-container-h middle center" style={{ width: '100%', height: '100%' }}> | ||
<span className="heading-1">Simple modal without footer</span> | ||
</div> | ||
</ModalBody> | ||
</> | ||
); | ||
}; | ||
export const ModalWithoutFooter = () => { | ||
return ( | ||
<div className="sp-margin-xl"> | ||
<Button onClick={() => showModal(ModalWithoutFooterComponent)}>Show Modal</Button> | ||
</div> | ||
); | ||
}; |
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
Oops, something went wrong.