// eslint-disable-next-line no-console const log = () => console.log('Welcome to storybook!'); export default { name: 'welcome', props: { showApp: { type: Function, default: log, }, }, data() { return { main: { padding: 15, lineHeight: 1.4, fontFamily: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif', backgroundColor: '#ffffff', }, logo: { width: 200, }, link: { color: '#1474f3', textDecoration: 'none', borderBottom: '1px solid #1474f3', paddingBottom: 2, }, code: { fontSize: 15, fontWeight: 600, padding: '2px 5px', border: '1px solid #eae9e9', borderRadius: 4, backgroundColor: '#f3f2f2', color: '#3a3a3a', }, note: { opacity: 0.5, }, }; }, template: `

Welcome to STORYBOOK

This is a UI component dev environment for your app.

We've added some basic stories inside the
src/stories
directory.
A story is a single state of one or more UI components. You can have as many stories as you want.
(Basically a story is like a visual test case.)

See these sample
stories
for a component called
Button .

Just like that, you can add your own components as stories.
You can also edit those components and see changes right away.
(Try editing the Button component located at src/stories/Button.js.)

This is just one thing you can do with Storybook.
Have a look at the
Storybook
repo for more information.

NOTE:
Have a look at the
.storybook/webpack.config.js
to add webpack loaders and plugins you are using in this project.

`, methods: { onClick(event) { event.preventDefault(); this.showApp(); }, }, };

custom-checkbox