-
-
Notifications
You must be signed in to change notification settings - Fork 9.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #3475 from storybooks/html
Storybook for HTML snippets
- Loading branch information
Showing
134 changed files
with
2,299 additions
and
162 deletions.
There are no files selected for viewing
Validating CODEOWNERS rules …
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 |
|---|---|---|
| @@ -1,19 +1,19 @@ | ||
| ## Addon / Framework Support Table | ||
|
|
||
| | |[React](app/react)|[React Native](app/react-native)|[Vue](app/vue)|[Angular](app/angular)| [Polymer](app/polymer)| [Mithril](app/mithril)| | ||
| | ----------- |:-------:|:-------:|:-------:|:-------:|:-------:|:-------:| | ||
| |[a11y](addons/a11y) |+| | | | | | | ||
| |[actions](addons/actions) |+|+|+|+|+|+| | ||
| |[background](addons/background) |+| | | | |+| | ||
| |[centered](addons/centered) |+| |+| | |+| | ||
| |[events](addons/events) |+| | | | | | | ||
| |[graphql](addons/graphql) |+| | | | | | | ||
| |[info](addons/info) |+| | | | | | | ||
| |[jest](addons/jest) |+| | | | | | | ||
| |[knobs](addons/knobs) |+|+|+|+|+|+| | ||
| |[links](addons/links) |+|+|+|+|+|+| | ||
| |[notes](addons/notes) |+| |+|+|+|+| | ||
| |[options](addons/options) |+|+|+|+|+|+| | ||
| |[storyshots](addons/storyshots) |+|+|+|+| | | | ||
| |[storysource](addons/storysource)|+| |+|+|+|+| | ||
| |[viewport](addons/viewport) |+| |+|+|+|+| | ||
| | |[React](app/react)|[React Native](app/react-native)|[Vue](app/vue)|[Angular](app/angular)| [Polymer](app/polymer)| [Mithril](app/mithril)| [HTML](app/html)| | ||
| | ----------- |:-------:|:-------:|:-------:|:-------:|:-------:|:-------:|:-------:| | ||
| |[a11y](addons/a11y) |+| | | | | |+| | ||
| |[actions](addons/actions) |+|+|+|+|+|+|+| | ||
| |[backgrounds](addons/backgrounds) |+| | | | |+|+| | ||
| |[centered](addons/centered) |+| |+| | |+|+| | ||
| |[events](addons/events) |+| | | | | |+| | ||
| |[graphql](addons/graphql) |+| | | | | | | | ||
| |[info](addons/info) |+| | | | | | | | ||
| |[jest](addons/jest) |+| | | | | |+| | ||
| |[knobs](addons/knobs) |+|+|+|+|+|+|+| | ||
| |[links](addons/links) |+|+|+|+|+|+|+| | ||
| |[notes](addons/notes) |+| |+|+|+|+|+| | ||
| |[options](addons/options) |+|+|+|+|+|+|+| | ||
| |[storyshots](addons/storyshots) |+|+|+|+| | |+| | ||
| |[storysource](addons/storysource)|+| |+|+|+|+|+| | ||
| |[viewport](addons/viewport) |+| |+|+|+|+|+| |
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 @@ | ||
| module.exports = require('./dist/html'); |
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,35 @@ | ||
| import { document, setTimeout } from 'global'; | ||
| import axe from 'axe-core'; | ||
| import addons from '@storybook/addons'; | ||
| import Events from '@storybook/core-events'; | ||
| import { logger } from '@storybook/client-logger'; | ||
|
|
||
| import { CHECK_EVENT_ID, RERUN_EVENT_ID } from './shared'; | ||
|
|
||
| let axeOptions = {}; | ||
|
|
||
| export const configureA11y = (options = {}) => { | ||
| axeOptions = options; | ||
| }; | ||
|
|
||
| const runA11yCheck = () => { | ||
| const channel = addons.getChannel(); | ||
| const wrapper = document.getElementById('root'); | ||
|
|
||
| axe.reset(); | ||
| axe.configure(axeOptions); | ||
| axe.run(wrapper).then(results => channel.emit(CHECK_EVENT_ID, results), logger.error); | ||
| }; | ||
|
|
||
| const a11ySubscription = () => { | ||
| const channel = addons.getChannel(); | ||
| channel.on(RERUN_EVENT_ID, runA11yCheck); | ||
| return () => channel.removeListener(RERUN_EVENT_ID, runA11yCheck); | ||
| }; | ||
|
|
||
| export const checkA11y = story => { | ||
| addons.getChannel().emit(Events.REGISTER_SUBSCRIPTION, a11ySubscription); | ||
| // We need to wait for rendering | ||
| setTimeout(runA11yCheck, 0); | ||
| return story(); | ||
| }; |
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 |
|---|---|---|
| @@ -1,6 +1,7 @@ | ||
| // addons, panels and events get unique names using a prefix | ||
| const ADDON_ID = '@storybook/addon-a11y'; | ||
| const PANEL_ID = `${ADDON_ID}/panel`; | ||
| const EVENT_ID = `${ADDON_ID}/event`; | ||
| const CHECK_EVENT_ID = `${ADDON_ID}/check`; | ||
| const RERUN_EVENT_ID = `${ADDON_ID}/rerun`; | ||
|
|
||
| export { ADDON_ID, PANEL_ID, EVENT_ID }; | ||
| export { ADDON_ID, PANEL_ID, CHECK_EVENT_ID, RERUN_EVENT_ID }; |
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 |
|---|---|---|
| @@ -1,8 +1,15 @@ | ||
| import { action, actions, decorate, configureActions, decorateAction } from './preview'; | ||
| import { | ||
| action, | ||
| actions, | ||
| decorate, | ||
| configureActions, | ||
| decorateAction, | ||
| withActions, | ||
| } from './preview'; | ||
|
|
||
| // addons, panels and events get unique names using a prefix | ||
| export const ADDON_ID = 'storybook/actions'; | ||
| export const PANEL_ID = `${ADDON_ID}/actions-panel`; | ||
| export const EVENT_ID = `${ADDON_ID}/action-event`; | ||
|
|
||
| export { action, actions, decorate, configureActions, decorateAction }; | ||
| export { action, actions, decorate, configureActions, decorateAction, withActions }; |
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,64 @@ | ||
| // Based on http://backbonejs.org/docs/backbone.html#section-164 | ||
| import { document, Element } from 'global'; | ||
| import isEqual from 'lodash.isequal'; | ||
| import addons from '@storybook/addons'; | ||
| import Events from '@storybook/core-events'; | ||
|
|
||
| import actions from './actions'; | ||
|
|
||
| let lastSubscription; | ||
| let lastArgs; | ||
|
|
||
| const delegateEventSplitter = /^(\S+)\s*(.*)$/; | ||
|
|
||
| const isIE = Element != null && !Element.prototype.matches; | ||
| const matchesMethod = isIE ? 'msMatchesSelector' : 'matches'; | ||
|
|
||
| const root = document && document.getElementById('root'); | ||
|
|
||
| const hasMatchInAncestry = (element, selector) => { | ||
| if (element[matchesMethod](selector)) { | ||
| return true; | ||
| } | ||
| const parent = element.parentElement; | ||
| if (!parent) { | ||
| return false; | ||
| } | ||
| return hasMatchInAncestry(parent, selector); | ||
| }; | ||
|
|
||
| const createHandlers = (actionsFn, ...args) => { | ||
| const actionsObject = actionsFn(...args); | ||
| return Object.entries(actionsObject).map(([key, action]) => { | ||
| // eslint-disable-next-line no-unused-vars | ||
| const [_, eventName, selector] = key.match(delegateEventSplitter); | ||
| return { | ||
| eventName, | ||
| handler: e => { | ||
| if (!selector || hasMatchInAncestry(e.target, selector)) { | ||
| action(e); | ||
| } | ||
| }, | ||
| }; | ||
| }); | ||
| }; | ||
|
|
||
| const actionsSubscription = (...args) => { | ||
| if (!isEqual(args, lastArgs)) { | ||
| lastArgs = args; | ||
| const handlers = createHandlers(...args); | ||
| lastSubscription = () => { | ||
| handlers.forEach(({ eventName, handler }) => root.addEventListener(eventName, handler)); | ||
| return () => | ||
| handlers.forEach(({ eventName, handler }) => root.removeEventListener(eventName, handler)); | ||
| }; | ||
| } | ||
| return lastSubscription; | ||
| }; | ||
|
|
||
| export const createDecorator = actionsFn => (...args) => story => { | ||
| addons.getChannel().emit(Events.REGISTER_SUBSCRIPTION, actionsSubscription(actionsFn, ...args)); | ||
| return story(); | ||
| }; | ||
|
|
||
| export default createDecorator(actions); |
File renamed without changes.
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 @@ | ||
| module.exports = require('./dist/html'); |
File renamed without changes.
Oops, something went wrong.