forked from storybookjs/storybook
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
94 changed files
with
7,190 additions
and
49 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
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)| [HTML](app/html)| [Marko](app/marko)| [Svelte](app/svelte)| | ||
| | ----------- |:-------:|:-------:|:-------:|:-------:|:-------:|:-------:|:-------:|:-------:|:-------:| | ||
| |[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) |+| |+|+|+|+|+|+|+| | ||
| ## Addon / Framework Support Table | ||
|
|
||
| | | [React](app/react)|[React Native](app/react-native)|[Vue](app/vue)|[Angular](app/angular)| [Polymer](app/polymer)| [Mithril](app/mithril)| [HTML](app/html)| [Marko](app/marko)| [Svelte](app/svelte)| [Riot](app/riot)| | ||
| | ----------- |:-------:|:-------:|:-------:|:-------:|:-------:|:-------:|:-------:|:-------:|:-------:|:-------:| | ||
| |[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
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,2 @@ | ||
| src | ||
| .babelrc |
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 @@ | ||
| # Storybook for Riot <sup>alpha</sup> | ||
|
|
||
| * * * | ||
|
|
||
| Storybook for Riot is a UI development environment for the components written with riot.js. | ||
| With it, you can visualize different states of your UI components and develop them interactively. | ||
|
|
||
|  | ||
|
|
||
| Storybook runs outside of your app. | ||
| So you can develop UI components in isolation without worrying about app specific dependencies and requirements. | ||
|
|
||
| ## Getting Started | ||
|
|
||
| ```sh | ||
| npm i -g @storybook/cli | ||
| cd my-app | ||
| getstorybook --riot | ||
| ``` | ||
|
|
||
| For more information visit: [storybook.js.org](https://storybook.js.org) | ||
|
|
||
| * * * | ||
|
|
||
| Storybook also comes with a lot of [addons](https://storybook.js.org/addons/introduction) and a great API to customize as you wish. | ||
| You can also build a [static version](https://storybook.js.org/basics/exporting-storybook) of your storybook and deploy it anywhere you want. |
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,4 @@ | ||
| #!/usr/bin/env node | ||
|
|
||
| process.env.NODE_ENV = process.env.NODE_ENV || 'production'; | ||
| require('../dist/server/build'); |
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,3 @@ | ||
| #!/usr/bin/env node | ||
|
|
||
| require('../dist/server'); |
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,53 @@ | ||
| { | ||
| "name": "@storybook/riot", | ||
| "version": "4.0.0-alpha.18", | ||
| "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.", | ||
| "homepage": "https://github.com/storybooks/storybook/tree/master/app/riot", | ||
| "bugs": { | ||
| "url": "https://github.com/storybooks/storybook/issues" | ||
| }, | ||
| "repository": { | ||
| "type": "git", | ||
| "url": "https://github.com/storybooks/storybook.git" | ||
| }, | ||
| "license": "MIT", | ||
| "main": "dist/client/index.js", | ||
| "bin": { | ||
| "build-storybook": "./bin/build.js", | ||
| "start-storybook": "./bin/index.js", | ||
| "storybook-server": "./bin/index.js" | ||
| }, | ||
| "scripts": { | ||
| "prepare": "node ../../scripts/prepare.js" | ||
| }, | ||
| "dependencies": { | ||
| "@babel/runtime": "^7.0.0-rc.2", | ||
| "@storybook/core": "4.0.0-alpha.18", | ||
| "common-tags": "^1.8.0", | ||
| "global": "^4.3.2", | ||
| "moment": "^2.22.2", | ||
| "riot": "^3.11.1", | ||
| "riot-hot-reload": "^1.0.0", | ||
| "riot-tag-loader": "^2.1.0", | ||
| "raw-loader": "^0.5.1", | ||
| "riot-compiler": "^3.5.1", | ||
| "react": "^16.4.2", | ||
| "react-dom": "^16.4.2" | ||
| }, | ||
| "devDependencies": { | ||
| "cross-env": "^5.2.0", | ||
| "@babel/preset-flow": "^7.0.0-rc.2", | ||
| "@babel/preset-react": "^7.0.0-rc.2", | ||
| "@babel/runtime": "^7.0.0-rc.2", | ||
| "@babel/preset-env": "^7.0.0-rc.2", | ||
| "@babel/plugin-transform-runtime": "^7.0.0-rc.2", | ||
| "@babel/plugin-transform-modules-commonjs": "^7.0.0-rc.2" | ||
| }, | ||
| "peerDependencies": { | ||
| "babel-core": "^7.0.0 || ^8.0.0 || ^8.0.0-beta.6", | ||
| "riot": "^3.0.0 || ^4.0.0", | ||
| "riot-compiler": "^3.5.1 || ^4.0.0", | ||
| "riot-hot-reload": "^1.0.0", | ||
| "riot-tag-loader": "^2.0.0 || ^3.0.0" | ||
| } | ||
| } |
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,9 @@ | ||
| export { | ||
| storiesOf, | ||
| setAddon, | ||
| addDecorator, | ||
| addParameters, | ||
| configure, | ||
| getStorybook, | ||
| forceReRender, | ||
| } from './preview'; |
4 changes: 4 additions & 0 deletions
4
app/riot/src/client/preview/__snapshots__/render-riot.test.js.snap
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,4 @@ | ||
| // Jest Snapshot v1, https://goo.gl/fbAQLP | ||
|
|
||
| exports[`render a riot element can nest several tags 1`] = `"<matriochka><div><tag1><div>Inside tag1:<ul><li><tag2><div>Inside tag2:<ul><li><tag3><div>Inside tag3:<ul><li><tag4><div>Inside tag4:<ul><li><tag5><div>Inside tag5:<ul><li>Content</li></ul></div></tag5></li></ul></div></tag4></li></ul></div></tag3></li></ul></div></tag2></li></ul></div></tag1></div></matriochka>"`; | ||
|
|
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,3 @@ | ||
| import { window } from 'global'; | ||
|
|
||
| window.STORYBOOK_ENV = 'riot'; |
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,18 @@ | ||
| import { start } from '@storybook/core/client'; | ||
|
|
||
| import './globals'; | ||
| import render from './render'; | ||
|
|
||
| const { clientApi, configApi, forceReRender } = start(render); | ||
|
|
||
| export const { | ||
| storiesOf, | ||
| setAddon, | ||
| addDecorator, | ||
| addParameters, | ||
| clearDecorators, | ||
| getStorybook, | ||
| } = clientApi; | ||
|
|
||
| export const { configure } = configApi; | ||
| export { forceReRender }; |
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,84 @@ | ||
| import { document } from 'global'; | ||
|
|
||
| const alreadyCompiledMarker = "var riot = require('riot')"; | ||
|
|
||
| export function guessRootName(stringified) { | ||
| const whiteSpaceLocation = stringified.indexOf(' ', stringified.indexOf('<') + 1); | ||
| const firstWhitespace = whiteSpaceLocation === -1 ? stringified.length : whiteSpaceLocation; | ||
| const supposedName = stringified.trim().match(/^<[^ >]+\/>$/) | ||
| ? stringified.trim().replace(/[<>/]/g, '') | ||
| : stringified.substring( | ||
| stringified.indexOf('<') + 1, | ||
| Math.min(firstWhitespace, stringified.indexOf('>')) | ||
| ); | ||
| const matchingBuiltInTag = document.createElement(supposedName).constructor.name; | ||
| return matchingBuiltInTag === 'HTMLUnknownElement' ? supposedName : 'root'; | ||
| } | ||
|
|
||
| function compileText(compiler, code, rootName) { | ||
| const sourceCodeEndOfHtml = (code.indexOf(/<(?:style|script)/) + 1 || code.length + 1) - 1; | ||
| const sourceCodeReformatted = | ||
| code.substring(0, sourceCodeEndOfHtml).replace(/[\n\r\s]+/g, ' ') + | ||
| code.substring(sourceCodeEndOfHtml + 1); | ||
| const sourceCode = | ||
| rootName === 'root' ? `<root>${sourceCodeReformatted}</root>` : sourceCodeReformatted; | ||
| return compiler | ||
| .compile(sourceCode, {}) | ||
| .replace(alreadyCompiledMarker, '') | ||
| .trim(); | ||
| } | ||
|
|
||
| const getRidOfRiotNoise = compiled => | ||
| compiled.replace(/riot\.tag2/g, 'tag2').replace(alreadyCompiledMarker, ''); | ||
|
|
||
| export function renderStringified( | ||
| { tags, template = `<${(tags[0] || []).boundAs || guessRootName(tags[0] || '')}/>` }, | ||
| { unregister, tag2, mount, compiler } // eslint-disable-line no-unused-vars | ||
| ) { | ||
| unregister('root'); | ||
| tags.forEach(oneTag => { | ||
| const rootName = oneTag.boundAs || guessRootName(oneTag); | ||
| const { content } = oneTag || {}; | ||
| const code = content ? content.trim() : oneTag || ''; | ||
| const compiled = | ||
| code.indexOf(alreadyCompiledMarker) !== -1 ? code : compileText(compiler, code, rootName); | ||
| unregister(rootName); | ||
| eval(getRidOfRiotNoise(`${compiled}`)); // eslint-disable-line no-eval | ||
| }); | ||
| const sourceCode = `<root>${template}</root>`; | ||
| if (template !== '<root/>') eval(getRidOfRiotNoise(`${compiler.compile(sourceCode, {})}`)); // eslint-disable-line no-eval | ||
| mount('*'); | ||
| } | ||
|
|
||
| // eslint-disable-next-line no-unused-vars | ||
| export function renderRaw(sourceCode, { unregister, mount, compiler, tag2 }) { | ||
| unregister('root'); | ||
| // eslint-disable-next-line no-eval | ||
| eval( | ||
| getRidOfRiotNoise( | ||
| `${compiler.compile(sourceCode.replace(alreadyCompiledMarker, '').trim(), {})}` | ||
| ) | ||
| ); | ||
| mount('root', /tag2\s*\(\s*'([^']+)'/.exec(sourceCode)[1], {}); | ||
| } | ||
|
|
||
| export function renderCompiledObject(component, { rootElement }) { | ||
| if (component.length) rootElement.appendChild(component[0].__.root); // eslint-disable-line no-underscore-dangle | ||
| } | ||
|
|
||
| export function render(component, context) { | ||
| const { tags } = component || {}; | ||
| if (typeof component === 'string') { | ||
| renderRaw(component, context); | ||
| return true; | ||
| } | ||
| if (Array.isArray(tags)) { | ||
| renderStringified(component, context); | ||
| return true; | ||
| } | ||
| if (component && Array.isArray(component)) { | ||
| renderCompiledObject(component, context); | ||
| return true; | ||
| } | ||
| return false; | ||
| } |
Oops, something went wrong.