GitHub/storybook
1
0
Fork 0
mirror of https://github.com/storybookjs/storybook.git synced 2025-04-04 13:21:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

Render an HTMLElement in your story

Browse Source 
Action addon works
This commit is contained in:
Léon Rodenburg 2017-11-03 15:18:43 +01:00
parent 3aa959b499
commit 8d6b9abd09
4 changed files with 27 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app/polymer/src/client/preview/render.js
View File

@ -43,7 +43,12 @@ export function renderMain(data, storyStore) {
});
return;
}
rootElement.innerHTML = component;
if (typeof component === 'string') {
rootElement.innerHTML = component;
} else {
rootElement.innerHTML = '';
rootElement.appendChild(component);
}
}
export default function renderPreview({ reduxStore, storyStore }) {

3
examples/polymer-cli/package.json
View File

@ -7,9 +7,10 @@
},
"dependencies": {
"@polymer/polymer": "^2.2.0",
"@storybook/polymer": "file:../../app/polymer",
"@storybook/addon-actions": "file:../../addons/actions",
"@storybook/polymer": "file:../../app/polymer",
"@webcomponents/webcomponentsjs": "^1.0.17",
"global": "^4.3.2",
"polymer-cli": "1.5.2",
"polymer-webpack-loader": "^2.0.0",
"webpack": "^3.8.1"

14
examples/polymer-cli/src/stories/index.js
View File

@ -1,5 +1,6 @@
import { storiesOf } from '@storybook/polymer';
// import { action } from '@storybook/addon-actions';
import { action } from '@storybook/addon-actions';
import { document } from 'global';
import '../playground-button.html';
import './storybook-welcome-to-polymer.html';
@ -8,7 +9,10 @@ storiesOf('Welcome', module).add(
() => '<storybook-welcome-to-polymer></storybook-welcome-to-polymer>'
);
storiesOf('<playground-button>', module).add(
'default mode',
() => '<playground-button></playground-button>'
);
storiesOf('<playground-button>', module)
.add('default mode', () => '<playground-button></playground-button>')
.add('with actions', () => {
const el = document.createElement('playground-button');
el.addEventListener('click', action('Button clicked'));
return el;
});

11
examples/polymer-cli/yarn.lock
View File

@ -18,6 +18,15 @@
version "0.0.3"
resolved "https://registry.yarnpkg.com/@polymer/test-fixture/-/test-fixture-0.0.3.tgz#4443752697d4d9293bbc412ea0b5e4d341f149d9"
"@storybook/addon-actions@file:../../addons/actions":
version "3.3.0-alpha.2"
dependencies:
"@storybook/addons" "^3.3.0-alpha.2"
deep-equal "^1.0.1"
prop-types "^15.6.0"
react-inspector "^2.2.1"
uuid "^3.1.0"
"@storybook/addons@^3.3.0-alpha.2":
version "3.3.0-alpha.2"
resolved "https://registry.yarnpkg.com/@storybook/addons/-/addons-3.3.0-alpha.2.tgz#836a664e84104972c718c446e68a993dbd497fcc"
@ -7286,7 +7295,7 @@ react-icons@^2.2.5:
dependencies:
react-icon-base "2.1.0"
react-inspector@^2.2.0:
react-inspector@^2.2.0, react-inspector@^2.2.1:
version "2.2.1"
resolved "https://registry.yarnpkg.com/react-inspector/-/react-inspector-2.2.1.tgz#c24f9a0131960b8e63c8392254d34df0717aabdf"
dependencies: