All files / vue-storybook/src/stories/modals index.js

0% Statements 0/6
100% Branches 0/0
0% Functions 0/2
0% Lines 0/6
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36                                                                       
import { storiesOf } from '@storybook/vue';
import { Modal, ButtonItem } from '../../components';
 
storiesOf('General|Modals', module)
  .add('Default', () => ({
    components: { Modal, ButtonItem },
    addons: {
      info: {
        propTables: ['modal'],
      },
    },
    template: `<div>
                <button-item text="Show Modal" @click="showModal"></button-item>
 
                <modal title="Example Modal" ref="modal">
                  <div slot="info">
                    Additional information would go here
                  </div>
                  
                  <div slot="body" class="p-3">
                    The important information would be here
                  </div>
                  
                  <div slot="additional-buttons">
                    <button-item text="Save" icon_type="solid" icon="save"></button-item>
                  </div>
                </modal>
              </div>`,
    methods: {
      showModal() {
        const { modal } = this.$refs;
        modal.show();
      },
    },
  }));