@bildvitta/quasar-ui-asteroid 2.17.0 → 3.0.0-alpha.3

package/src/components/gallery/QasGallery.stories.js

@@ -1,91 +0,0 @@
-import QasGallery from './QasGallery.vue'
-
-const noSummary = {
-  type: { summary: null }
-}
-
-export default {
-  component: QasGallery,
-  title: 'Components/Gallery',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Gallery component, with list of images and carousel.'
-      }
-    }
-  },
-
-  argTypes: {
-    // Props
-    carouselNextIcon: {
-      description: 'Define the next image icon for carousel.'
-    },
-
-    carouselPreviousIcon: {
-      description: 'Define the previous image icon for carousel.'
-    },
-
-    height: {
-      description: 'Define the height of item.'
-    },
-
-    initialLength: {
-      description: 'Define the initial quantity of items.'
-    },
-
-    items: {
-      description: 'List of items.'
-    },
-
-    loadLength: {
-      description: 'Define the quantity of items to load.'
-    },
-
-    showMoreLabel: {
-      description: 'Text that will show for load more items.'
-    },
-
-    // Slots
-    default: {
-      description: 'Main content.',
-      table: noSummary
-    }
-  }
-}
-
-const Template = (args, { argTypes }) => ({
-  components: { QasGallery },
-  props: Object.keys(argTypes),
-  template:
-  `<qas-box class="q-pa-lg">
-    <qas-gallery :items="images" />
-  </qas-box>`
-})
-
-const images = [
-  'https://cdn.pixabay.com/photo/2016/10/10/12/54/space-1728314_960_720.jpg',
-  'https://cdn.pixabay.com/photo/2011/12/14/12/21/orion-nebula-11107_960_720.jpg',
-  'https://cdn.pixabay.com/photo/2016/10/10/12/54/space-1728314_960_720.jpg',
-  'https://cdn.pixabay.com/photo/2011/12/14/12/21/orion-nebula-11107_960_720.jpg',
-  'https://cdn.pixabay.com/photo/2016/10/10/12/54/space-1728314_960_720.jpg',
-  'https://cdn.pixabay.com/photo/2011/12/14/12/21/orion-nebula-11107_960_720.jpg',
-  'https://cdn.pixabay.com/photo/2016/10/10/12/54/space-1728314_960_720.jpg',
-  'https://cdn.pixabay.com/photo/2011/12/14/12/21/orion-nebula-11107_960_720.jpg',
-  'https://cdn.pixabay.com/photo/2016/10/10/12/54/space-1728314_960_720.jpg',
-  'https://cdn.pixabay.com/photo/2011/12/14/12/21/orion-nebula-11107_960_720.jpg',
-  'https://cdn.pixabay.com/photo/2016/10/10/12/54/space-1728314_960_720.jpg',
-  'https://cdn.pixabay.com/photo/2011/12/14/12/21/orion-nebula-11107_960_720.jpg'
-]
-
-export const Default = Template.bind({})
-Default.args = { images }
-
-Default.parameters = {
-  docs: {
-    source: {
-      code:
-      '<qas-gallery :photos="images" />'
-    }
-  }
-}

package/src/components/grid-generator/QasGridGenerator.stories.js

@@ -1,142 +0,0 @@
-import QasGridGenerator from './QasGridGenerator.vue'
-
-const slotDefaults = {
-  table: {
-    category: 'slots',
-    defaultValue: {
-      detail: JSON.stringify({ field: 'object' }),
-      summary: '{}'
-    }
-  }
-}
-
-export default {
-  component: QasGridGenerator,
-  title: 'Components/GridGenerator',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Generates a grid with header (as `fields`) and content (as `results`).'
-      }
-    }
-  },
-
-  argTypes: {
-    // Props
-    columns: {
-      description: 'Define size of each column.',
-      table: {
-        defaultValue: { summary: '[]' }
-      }
-    },
-
-    contentClass: {
-      description: 'CSS classes for each result value.'
-    },
-
-    emptyResultText: {
-      description: 'Message for fields with empty values.'
-    },
-
-    fields: {
-      description: 'Define header value for each `field`.'
-    },
-
-    gutter: {
-      description: 'Gutter space by Quasar convention. `q-col-gutter-{$gutter}`.'
-    },
-
-    headerClass: {
-      description: 'CSS classes for each header value.'
-    },
-
-    hideEmptyResult: {
-      description: 'Omits cell when result value is empty.'
-    },
-
-    result: {
-      description: 'Define result value for each `field`.'
-    },
-
-    // Slots
-    default: {
-      table: { disable: true }
-    },
-
-    content: {
-      description: 'Content value defaults.',
-      ...slotDefaults
-    },
-
-    'field-[field.name]': {
-      description: 'Each cell inside `fields` is a slot.',
-      ...slotDefaults
-    },
-
-    header: {
-      description: 'Header value defaults.',
-      ...slotDefaults
-    }
-  }
-}
-
-const Template = (args, { argTypes }) => ({
-  components: { QasGridGenerator },
-  props: Object.keys(argTypes),
-  template:
-    '<qas-grid-generator v-bind="$props" />'
-})
-
-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 result = {
-  name: 'John Appleseed',
-  email: 'john.appleseed@example.com',
-  phone: '99999999999',
-  gender: 'Male',
-  document: '99999999999',
-  address: '747 Austen View'
-}
-
-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,
-  result
-}
-
-Default.parameters = {
-  docs: {
-    source: { code: '<qas-grid-generator :field="fields" :result="result" />' }
-  }
-}
-
-export const CustomColumns = Template.bind({})
-CustomColumns.args = {
-  columns,
-  fields,
-  result
-}
-
-CustomColumns.parameters = {
-  docs: {
-    source: { code: `<qas-grid-generator :field="fields" :result="result" :columns="${JSON.stringify(columns)}" />` }
-  }
-}

package/src/components/input/QasInput.stories.js

@@ -1,78 +0,0 @@
-import QasInput from './QasInput.vue'
-
-export default {
-  component: QasInput,
-  title: 'Components/Input',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Extends [QInput](https://quasar.dev/vue-components/input). Can mask raw values by default.'
-      }
-    }
-  },
-
-  argTypes: {
-    // Props
-    value: {
-      description: 'Input text value.',
-      control: { type: null }
-    },
-
-    // Slots
-    default: {
-      description: 'Field main content',
-      table: {
-        type: { summary: null }
-      }
-    }
-  }
-}
-
-const Template = (args, { argTypes }) => ({
-  components: { QasInput },
-  props: Object.keys(argTypes),
-
-  data () {
-    return {
-      text: ''
-    }
-  },
-
-  template:
-    `<div>
-      <qas-input v-bind="$props" v-model="text" />
-      <pre v-if="text">{{ text }}</pre>
-    </div>`
-})
-
-function setTemplate (mask) {
-  const code = mask
-    ? `<qas-input v-model="text" mask="${mask}" />`
-    : '<qas-input v-model="text" />'
-
-  return { docs: { source: { code } } }
-}
-
-export const Default = Template.bind({})
-Default.parameters = setTemplate()
-
-export const PhoneMask = Template.bind({})
-PhoneMask.args = { mask: 'phone' }
-PhoneMask.parameters = setTemplate('phone')
-
-export const DocumentMask = Template.bind({})
-DocumentMask.args = { mask: 'document' }
-DocumentMask.parameters = setTemplate('document')
-
-export const PersonalDocumentMask = Template.bind({})
-PersonalDocumentMask.args = { mask: 'personal-document' }
-PersonalDocumentMask.parameters = setTemplate('personal-document')
-
-export const CompanyDocumentMask = Template.bind({})
-CompanyDocumentMask.args = { mask: 'company-document' }
-CompanyDocumentMask.parameters = setTemplate('company-document')
-
-export const PostalCodeMask = Template.bind({})
-PostalCodeMask.args = { mask: 'postal-code' }
-PostalCodeMask.parameters = setTemplate('postal-code')

package/src/components/label/QasLabel.stories.js

@@ -1,60 +0,0 @@
-import QasLabel from './QasLabel.vue'
-
-export default {
-  component: QasLabel,
-  title: 'Components/Label',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Standardizes the display of labels for a form\'s field.'
-      }
-    }
-  },
-
-  argTypes: {
-    // Events
-    label: {
-      description: 'Text to be displayed.'
-    },
-
-    margin: {
-      description: 'Margin spaces.'
-    },
-
-    quantity: {
-      description: 'Number to be displayed after label, inside parentheses. E.g. Groups (9).'
-    },
-
-    // Slots
-    default: {
-      description: 'Main content, will be replace label prop.',
-      table: {
-        defaultValue: {
-          detail: JSON.stringify({ formattedLabel: 'string' }),
-          summary: '{}'
-        },
-        type: { summary: null }
-      }
-    }
-  }
-}
-
-const Template = (args, { argTypes }) => ({
-  components: { QasLabel },
-  props: Object.keys(argTypes),
-
-  template:
-    '<qas-label v-bind="$props" />'
-})
-
-export const Default = Template.bind({})
-Default.args = {
-  label: 'My label!'
-}
-
-export const Quantity = Template.bind({})
-Quantity.args = {
-  label: 'My label, but with quantity!',
-  quantity: 10
-}

package/src/components/layout/QasLayout.stories.js

@@ -1,104 +0,0 @@
-import QasLayout from './QasLayout.vue'
-
-export default {
-  component: QasLayout,
-  title: 'Components/Layout',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Implementation of [QLayout](https://quasar.dev/layout/layout#introduction) with [QasAppMenu](http://localhost:6006/?path=/docs/components-appmenu--default) and [QasAppBar](http://localhost:6006/?path=/docs/components-appbar--default).'
-      }
-    }
-  },
-
-  argTypes: {
-    // Props
-    appMenuProps: {
-      description: '[QasAppMenu props](http://localhost:6006/?path=/docs/components-appmenu--default).'
-    },
-
-    appBarProps: {
-      description: '[QasAppBar props](http://localhost:6006/?path=/docs/components-appbar--default).'
-    },
-
-    appMenuEvents: {
-      description: '[QasAppMenu events](http://localhost:6006/?path=/docs/components-appmenu--default).'
-    },
-
-    appBarEvents: {
-      description: '[QasAppBar events](http://localhost:6006/?path=/docs/components-appbar--default).'
-    },
-
-    value: {
-      description: 'Model value for toggle drawer.'
-    },
-
-    // Slots
-    'app-bar': {
-      description: 'header slot.'
-    },
-
-    'app-menu': {
-      description: 'left side menu.'
-    },
-
-    default: {
-      description: 'page container with router-view.'
-    },
-
-    // events
-    input: {
-      description: 'input model event for toggle drawer.'
-    }
-  }
-}
-
-const Template = (args, { argTypes }) => ({
-  components: { QasLayout },
-  props: Object.keys(argTypes),
-
-  template: '<qas-layout v-bind="$props" />'
-})
-
-export const Default = Template.bind({})
-
-Default.args = {
-  appMenuProps: {
-    items: [
-      {
-        label: 'Dialog',
-        icon: 'o_home',
-        to: { path: '/dialog-form' }
-      },
-
-      {
-        label: 'Teste expansivo',
-        icon: 'o_edit'
-      }
-    ],
-
-    modules: [
-      {
-        label: 'Modulo de teste',
-        value: 'test',
-        path: 'http://localhost:8080'
-      },
-      {
-        label: 'Segundo modulo de teste',
-        value: 'test-2',
-        path: 'https://google.com'
-      }
-    ]
-  },
-
-  appBarProps: {
-    isAuth: true,
-    title: 'Some title',
-    user: {
-      photo: 'https://www.abc.net.au/cm/lb/6367016/data/alan2c-see-the-person-data.jpg',
-      name: 'Eduardo Lima',
-      email: 'eduardolima@gmail.com'
-    }
-  }
-}

package/src/components/list-items/QasListItems.stories.js

@@ -1,135 +0,0 @@
-import QasListItems from './QasListItems.vue'
-
-const slotDefaults = {
-  defaultValue: {
-    detail: JSON.stringify({
-      item: 'object',
-      index: 'number'
-    }),
-    summary: '{}'
-  },
-
-  type: {
-    summary: null
-  }
-}
-
-export default {
-  component: QasListItems,
-  title: 'Components/ListItems',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Extends [QList and QItem](https://v1.quasar.dev/vue-components/list-and-list-items#qlist-api) from quasar for creating a list of items.'
-      }
-    }
-  },
-
-  argTypes: {
-    // Props
-    iconProps: {
-      description: 'Icon props.'
-    },
-
-    list: {
-      description: 'Array of object.'
-    },
-
-    redirectKey: {
-      control: null,
-      description: 'Item key that will be the value of the redirect.'
-    },
-
-    paramKey: {
-      control: null,
-      description: 'Redirect parameter key.'
-    },
-
-    useIconRedirect: {
-      description: 'Only redirect when clicked on icon.'
-    },
-
-    to: {
-      description: 'Router config like `name`.'
-    },
-
-    // Slots
-
-    item: {
-      description: 'Main item slot.',
-      table: {
-        ...slotDefaults
-      }
-    },
-
-    'item-section-left': {
-      description: 'Left section slot.',
-      table: {
-        ...slotDefaults
-      }
-    },
-
-    'item-section-side': {
-      description: 'Side section slot (used for actions).',
-      table: {
-        ...slotDefaults
-      }
-    }
-  }
-}
-
-function Generate (template) {
-  return (args, { argTypes }) => ({
-    components: { QasListItems },
-    props: Object.keys(argTypes),
-    template
-  })
-}
-
-const args = {
-  list: [
-    {
-      name: 'item 1',
-      email: 'email1@example.com',
-      uuid: 'uuid1'
-    },
-    {
-      name: 'item 2',
-      email: 'email2@example.com',
-      uuid: 'uuid2'
-    },
-    {
-      name: 'item 3',
-      email: 'email3@example.com',
-      uuid: 'uuid3'
-    }
-  ],
-
-  useIconRedirect: true
-}
-
-const itemTemplate = (
-  `
-    <qas-list-items v-bind="$props">
-      <template #item-section-left="{ item, index }">
-        <div>
-          name: {{ item.name }}
-          index: {{ index }}
-        </div>
-      </template>
-    </qas-list-items>
-  `
-)
-
-export const Item = Generate(itemTemplate).bind({})
-
-Item.args = args
-
-Item.parameters = {
-  docs: {
-    source: {
-      code: itemTemplate
-    }
-  }
-}