@bildvitta/quasar-ui-asteroid 2.12.4 → 3.0.0-alpha.1

package/src/components/dialog/QasDialog.stories.js

@@ -1,139 +0,0 @@
-import QasDialog from './QasDialog.vue'
-import QasBtn from '../btn/QasBtn.vue'
-
-const noSummary = {
-  type: { summary: null }
-}
-
-export default {
-  component: QasDialog,
-  title: 'Components/Dialog',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Extends [QDialog](https://quasar.dev/vue-components/dialog).'
-      }
-    }
-  },
-
-  argTypes: {
-    // Props
-    btnActions: {
-      description: 'Props of QasBtnActions component.'
-    },
-
-    cancel: {
-      description: '[QBtn](https://quasar.dev/vue-components/button) props and events for "Cancel" button. Use `props` and `events` keys to configure the component, or use `false` to hide the button.',
-      table: {
-        defaultValue: {
-          detail: JSON.stringify({ props: { label: 'Cancel', outline: true } }),
-          summary: '{}'
-        }
-      }
-    },
-
-    card: {
-      description: 'Content of [QCard](https://quasar.dev/vue-components/card), mast have key <strong>title</strong> and <strong>description</strong>'
-    },
-
-    cardProps: {
-      description: 'Props of [QCard](https://quasar.dev/vue-components/card) component.'
-    },
-
-    maxWidth: {
-      description: 'Max width of QCard.',
-      table: {
-        defaultValue: { summary: '600px' }
-      }
-    },
-
-    minWidth: {
-      description: 'Min width of QCard.',
-      table: {
-        defaultValue: { summary: '400px' }
-      }
-    },
-
-    ok: {
-      description: '[QBtn](https://quasar.dev/vue-components/button) props and events for "Ok" button. Use `props` and `events` keys to configure the component, or use `false` to hide the button.',
-      table: {
-        defaultValue: {
-          detail: JSON.stringify({ props: { label: 'Ok' } }),
-          summary: '{}'
-        }
-      }
-    },
-
-    persistent: {
-      description: 'User cannot dismiss [QDialog](https://quasar.dev/vue-components/dialog) if clicking outside of it or hitting ESC key. Also, an app route change won\'t dismiss it.'
-    },
-
-    value: {
-      description: 'Model value to toggle the visibility of the dialog.',
-      table: {
-        control: { summary: null },
-        defaultValue: { summary: true }
-      }
-    },
-
-    useForm: {
-      description: 'Generate form and trigger validate based input rules'
-    },
-
-    // Events
-    input: {
-      description: 'Fires when toggles the dialog\'s visibility.'
-    },
-
-    // Slots
-    actions: {
-      description: 'Actions slot.',
-      table: noSummary
-    },
-
-    description: {
-      description: 'Description slot.',
-      table: noSummary
-    },
-
-    header: {
-      description: 'Header slot',
-      table: noSummary
-    }
-  }
-}
-
-const Template = (args, { argTypes }) => ({
-  components: { QasBtn, QasDialog },
-  props: Object.keys(argTypes),
-
-  data () {
-    return {
-      dialog: false
-    }
-  },
-
-  template:
-    `<div>
-      <qas-btn label="Open dialog!" @click="dialog = !dialog"/>
-      <qas-dialog v-bind="$props" v-model="dialog" />
-    </div>`
-})
-
-export const Default = Template.bind({})
-
-Default.args = {
-  cancel: {
-    props: { label: 'Cancel', outline: true }
-  },
-
-  card: {
-    description: 'This is a description.',
-    title: 'This is a title.'
-  },
-
-  ok: {
-    props: { label: 'Ok, thanks!' }
-  }
-}

package/src/components/dialog-router/QasDialogRouter.stories.js

@@ -1,38 +0,0 @@
-import VueRouter from 'vue-router'
-
-import QasBtn from '../btn/QasBtn.vue'
-import QasDialogRouter from './QasDialogRouter.vue'
-
-export default {
-  component: QasDialogRouter,
-  title: 'Components/DialogRouter',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Open an Vue component (like a page) inside [QDialog](https://quasar.dev/vue-components/dialog).'
-      }
-    }
-  },
-
-  argTypes: {
-    hide: {
-      description: 'Controls dialog\'s visibility.'
-    }
-  }
-}
-
-// TODO: Fazer um mock de componente na rota para o exemplo funcionar.
-const Template = (args, { argTypes }) => ({
-  components: { QasBtn, QasDialogRouter },
-  props: Object.keys(argTypes),
-  router: new VueRouter(),
-  template:
-    `<div>
-      <qas-btn label="Open dialog" @click="$refs.dialog.show('')" />
-      <qas-dialog-router ref="dialog" v-bind="$props" />
-    </div>`
-})
-
-export const Default = Template.bind({})
-Default.args = {}

package/src/components/field/QasField.stories.js

@@ -1,181 +0,0 @@
-import QasField from './QasField.vue'
-
-export default {
-  component: QasField,
-  title: 'Components/Field',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Wildcard form field component based on their types. Used by `QasFormGenerator`.'
-      }
-    }
-  },
-
-  argTypes: {
-    // Props
-    error: {
-      description: 'Error messages.'
-    },
-
-    field: {
-      description: 'An object with props to be bypassed to matched field component.'
-    },
-
-    // Events
-    input: {
-      description: 'Fires when model changes. Is also used by `v-model`.',
-      table: {
-        defaultValue: { summary: null }
-      }
-    }
-  }
-}
-
-function templateGenerator (model) {
-  return (args, { argTypes }) => ({
-    components: { QasField },
-    props: Object.keys(argTypes),
-
-    data () {
-      return {
-        model
-      }
-    },
-
-    template: '<qas-field v-model="model" v-bind="$props" />'
-  })
-}
-
-const Template = templateGenerator('')
-const NumberTemplate = templateGenerator(0)
-const CheckboxTemplate = templateGenerator([])
-const DecimalInputTemplate = templateGenerator(0)
-
-export const Default = Template.bind({})
-Default.args = {
-  field: { label: 'Name', type: 'text' }
-}
-
-export const Textarea = Template.bind({})
-Textarea.args = {
-  field: { label: 'Textarea', type: 'textarea' }
-}
-
-// Email
-export const Email = Template.bind({})
-
-Email.args = {
-  field: { label: 'E-mail', type: 'email' }
-}
-
-// Password
-export const Password = Template.bind({})
-
-Password.args = {
-  field: { label: 'Password', type: 'password', pattern: /(?=^.{8,}$)((?=.*\d)|(?=.*\W+))(?![.\n])(?=.*[A-Z])(?=.*[a-z]).*$/ }
-}
-
-// Number
-export const Number = NumberTemplate.bind({})
-
-Number.args = {
-  field: { label: 'Number', type: 'number' }
-}
-
-// Decimal
-export const Decimal = DecimalInputTemplate.bind({})
-
-Decimal.args = {
-  field: { label: 'Decimal', type: 'decimal' }
-}
-
-// Percent
-export const Percent = DecimalInputTemplate.bind({})
-
-Percent.args = {
-  field: { label: 'Percent', type: 'percent' }
-}
-
-// Money
-export const Money = DecimalInputTemplate.bind({})
-
-Money.args = {
-  field: { label: 'Money', type: 'money' }
-}
-
-// Date Time
-export const DateTime = Template.bind({})
-
-DateTime.args = {
-  field: { label: 'Datetime', type: 'datetime' }
-}
-
-// Date
-export const Date = Template.bind({})
-
-Date.args = {
-  field: { label: 'Date', type: 'date' }
-}
-
-// Time
-export const Time = Template.bind({})
-
-Time.args = {
-  field: { label: 'Time', type: 'time' }
-}
-
-// Boolean
-export const Boolean = Template.bind({})
-
-Boolean.args = {
-  field: { label: 'Boolean', default: true, type: 'boolean' }
-}
-
-// Checkbox
-export const Checkbox = CheckboxTemplate.bind({})
-
-Checkbox.args = {
-  field: { name: 'Checkbox', label: 'Checkbox', type: 'checkbox', options: [{ label: 'Example1', value: 'Example1' }, { label: 'Example2', value: 'Example2' }] }
-}
-
-// Radio
-export const Radio = Template.bind({})
-
-Radio.args = {
-  field: {
-    options: [{ label: 'Example1', value: 'Example1' }, { label: 'Example2', value: 'Example2' }],
-    type: 'radio'
-  }
-}
-
-// Select
-export const Select = Template.bind({})
-
-Select.args = {
-  field: {
-    options: [{ label: 'Example1', value: 'Example1' }, { label: 'Example2', value: 'Example2' }, { label: 'Example3', value: 'Example3' }, { label: 'Example4', value: 'Example4' }],
-    type: 'select'
-  }
-}
-
-// Upload
-export const Upload = Template.bind({})
-
-Upload.args = {
-  field: { entity: 'posts/image', label: 'Image', type: 'upload' }
-}
-
-// Editor
-export const Editor = Template.bind({})
-
-Editor.args = {
-  field: { name: 'Editor', type: 'editor', value: '' }
-}
-
-// Hidden
-export const Hidden = Template.bind({})
-
-Hidden.args = {
-  field: { label: 'Hidden', type: 'hidden' }
-}

package/src/components/filters/QasFilters.stories.js

@@ -1,121 +0,0 @@
-import Vuex from 'vuex'
-import VueRouter from 'vue-router'
-
-import users from '../../mocks/storeModule'
-
-import QasFilters from './QasFilters.vue'
-
-const noSummary = {
-  type: { summary: null }
-}
-
-export default {
-  component: QasFilters,
-  title: 'Components/Filters',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Generates fields to be used as filters. Used by `QasListView`.'
-      }
-    }
-  },
-
-  argTypes: {
-    badges: {
-      description: 'Show current filters as badges.'
-    },
-
-    entity: {
-      control: null,
-      description: '[VuexStoreModule](https://github.com/bildvitta/vuex-store-module) entity.'
-    },
-
-    noFilterButton: {
-      description: 'Hides filter button.'
-    },
-
-    noSearch: {
-      description: 'Hides search field.'
-    },
-
-    searchOnType: {
-      description: 'Search on type.'
-    },
-
-    searchPlaceholder: {
-      description: 'Search field placeholder.'
-    },
-
-    url: {
-      control: null,
-      description: 'Ignore entity and specify another endpoint.'
-    },
-
-    // Events
-    'fetch-error': {
-      description: 'Fires when occur an error fetching value.',
-      table: {
-        defaultValue: { summary: JSON.stringify({ error: 'object' }) }
-      }
-    },
-
-    'fetch-success': {
-      description: 'Fires when successfully get the value.',
-      table: {
-        defaultValue: { summary: JSON.stringify({ response: 'object' }) }
-      }
-    },
-
-    // Slots
-    default: {
-      description: 'Bottom content.',
-      table: {
-        ...noSummary,
-        defaultValue: {
-          summary: JSON.stringify({
-            context: 'object',
-            filter: 'function',
-            filters: 'object',
-            removeFilter: 'function'
-          })
-        }
-      }
-    },
-
-    'filter-button': {
-      description: 'Filter button content.',
-      table: {
-        defaultValue: { summary: JSON.stringify({ filter: 'function' }) },
-        ...noSummary
-      }
-    },
-
-    search: {
-      description: 'Search input content.',
-      table: {
-        defaultValue: { summary: JSON.stringify({ filter: 'function' }) },
-        ...noSummary
-      }
-    }
-  }
-}
-
-const Template = (args, { argTypes }) => ({
-  components: { QasFilters },
-  props: Object.keys(argTypes),
-
-  router: new VueRouter(),
-
-  store: new Vuex.Store({
-    modules: { users }
-  }),
-
-  template: '<qas-filters v-bind="$props" />'
-})
-
-export const Default = Template.bind({})
-
-Default.args = {
-  entity: 'users'
-}

package/src/components/form-generator/QasFormGenerator.stories.js

@@ -1,115 +0,0 @@
-import QasFormGenerator from './QasFormGenerator.vue'
-
-const slotDefaults = {
-  table: {
-    category: 'slots',
-    defaultValue: { summary: JSON.stringify({ field: 'object' }) },
-    type: { summary: null }
-  }
-}
-
-export default {
-  component: QasFormGenerator,
-  title: 'Components/FormGenerator',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Generates form fields like a magic!'
-      }
-    }
-  },
-
-  argTypes: {
-    columns: {
-      description: 'Define size of each field column.',
-      table: {
-        defaultValue: { summary: '[] || {}' }
-      }
-    },
-
-    errors: {
-      description: 'Each field error.'
-    },
-
-    fields: {
-      description: 'Fields to be dynamic generated.'
-    },
-
-    fieldsEvents: {
-      description: 'Defines each field events.'
-    },
-
-    fieldsProps: {
-      description: 'Defines each field prop.'
-    },
-
-    gutter: {
-      description: 'Gutter space by Quasar convention. `q-col-gutter-{$gutter}`.'
-    },
-
-    value: {
-      description: 'Model value.'
-    },
-
-    // Events
-    input: {
-      description: 'Fires when model changes. Is also used by `v-model`.',
-      table: {
-        defaultValue: { summary: JSON.stringify({ value: 'object' }) }
-      }
-    },
-
-    // slot
-    default: {
-      table: { disable: true }
-    },
-
-    'field-[field.name]': {
-      description: 'Each field inside `fields` is a slot.',
-      ...slotDefaults
-    }
-  }
-}
-
-const Template = (args, { argTypes }) => ({
-  components: { QasFormGenerator },
-  props: Object.keys(argTypes),
-
-  data () {
-    return {
-      values: {}
-    }
-  },
-
-  template:
-    `<div>
-      <qas-form-generator v-model="values" v-bind="$props" />
-      <pre>{{ values }}</pre>
-    </div>`
-})
-
-const fields = {
-  name: { name: 'name', label: 'Full name', type: 'text' },
-  email: { name: 'email', label: 'E-mail', type: 'email' },
-  phone: { name: 'phone', label: 'Phone', type: 'text', mask: 'phone' },
-  gender: { name: 'gender', label: 'Gender', type: 'text' },
-  document: { name: 'document', label: 'Document', type: 'text', mask: 'document' },
-  address: { name: 'address', label: 'Address', type: 'text' }
-}
-
-const columns = {
-  name: { col: 12, sm: 6 },
-  email: { col: 12, sm: 6 },
-  phone: { col: 12, sm: 6 },
-  gender: { col: 12, sm: 6 },
-  document: { col: 12 },
-  address: { col: 12 }
-}
-
-export const Default = Template.bind({})
-
-Default.args = {
-  columns,
-  fields
-}