import { storiesOf } from '@storybook/vue';
import itfPdfViewer from './PdfViewer';
import itfForm from '../form/Form.vue';
import itfLabel from '../form/Label.vue';
import itfDatePicker from '../datepicker/DatePicker.vue';
import itfDateRangePicker from '../datepicker/DateRangePicker.vue';
import itfApp from '../app/App.vue';

storiesOf('PDF viewer', module)
  .add('Simple', () => ({
    components: {
      itfApp,
      itfPdfViewer,
      itfForm,
      itfLabel,
      itfDatePicker,
      itfDateRangePicker,
    },
    data() {
      return {
        file: 'https://mozilla.github.io/pdf.js/web/compressed.tracemonkey-pldi-09.pdf'
      }
    },
    methods: {
    },
    template: `<div>
      <p>You need wrap whole application with this tag</p>

      <h2>Usage</h2>

  <pre>

    &lt;itf-datepicker>&lt;/itf-datepicker>

    &lt;button @click="$showSuccess('Success')">Show success&lt;/button>
    &lt;button @click="$showError('Error')">Show error&lt;/button>
    &lt;button @click="$try(() => { throw new Error('Invalid function'); })">Try function with error&lt;/button>
  </pre>

      <h2>Example</h2>

      <itf-pdf-viewer style="height: 400px;" :pdf="file" />
    </div>`,
  }));
