diff --git a/src/atoms/label/Label.stories.js b/src/atoms/label/Label.stories.js
index 6f641f2af..80cd4d8d7 100644
--- a/src/atoms/label/Label.stories.js
+++ b/src/atoms/label/Label.stories.js
@@ -1,56 +1,53 @@
-import { storiesOf } from '@storybook/vue'
import { select, text } from '@storybook/addon-knobs'
-import generateVueInfoTable from '@utils/helpers/generate-vue-info-table.js'
import getClassKnobsConfig from '@utils/helpers/get-class-knobs-config.js'
import selectorsConfig from './Label.selectors.json'
import ALabel from './Label.vue'
-const info = `
-
Check Knobs tab to edit component properties dynamically.
- ${generateVueInfoTable(selectorsConfig, 'BEM modifiers')}
-`
-
const classKnobsConfig = getClassKnobsConfig(selectorsConfig)
-storiesOf('Atoms/Label', module)
- .addParameters({ info })
- .add('Default', () => ({
- components: { ALabel },
- props: {
- classKnobs: {
- default: select('BEM Modifier', classKnobsConfig)
- },
- textKnobs: {
- default: text('Text', 'Label')
- }
+export default {
+ title: 'Atoms/Label',
+ component: ALabel
+}
+
+export const Default = () => ({
+ components: { ALabel },
+ props: {
+ classKnobs: {
+ default: select('BEM Modifier', classKnobsConfig)
+ },
+ textKnobs: {
+ default: text('Text', 'Label')
+ }
+ },
+ template: `
+
+ {{ textKnobs }}
+
+ `
+})
+
+export const CustomTag = () => ({
+ components: { ALabel },
+ props: {
+ classKnobs: {
+ default: select('BEM Modifier', classKnobsConfig)
},
- template: `
-
- {{ textKnobs }}
-
- `
- }))
- .add('Custom tag', () => ({
- components: { ALabel },
- props: {
- classKnobs: {
- default: select('BEM Modifier', classKnobsConfig)
- },
- textKnobs: {
- default: text('Text', 'Custom tag label')
- },
- tagKnob: {
- default: text('Html tag', 'span')
- }
+ textKnobs: {
+ default: text('Text', 'Custom tag label')
},
- template: `
-
- {{ textKnobs }}
-
- `
- }))
+ tagKnob: {
+ default: text('Html tag', 'span')
+ }
+ },
+ template: `
+
+ {{ textKnobs }}
+
+ `
+})