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

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

@@ -1,130 +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: 'Key to define the id redirect.'
-    },
-
-    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
-    }
-  }
-}

package/src/components/list-view/QasListView.stories.js

@@ -1,168 +0,0 @@
-import Vuex from 'vuex'
-import VueRouter from 'vue-router'
-
-import users from '../../mocks/storeModule'
-
-import QasDebugger from '../debugger/QasDebugger'
-import QasListView from './QasListView.vue'
-
-const defaultFilterValues = JSON.stringify({
-  entity: 'string',
-  errors: 'object',
-  fields: 'object',
-  metadata: 'object'
-})
-
-const slotDefaults = {
-  defaultValue: {
-    detail: JSON.stringify({
-      errors: 'object',
-      fields: 'object',
-      metadata: 'object'
-    }),
-
-    summary: '{}'
-  },
-
-  type: { summary: null }
-}
-
-export default {
-  component: QasListView,
-  title: 'Components/ListView',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'List of entity rows.'
-      }
-    }
-  },
-
-  argTypes: {
-    // Props
-    dialog: {
-      description: 'Use when the component is inside a dialog.'
-    },
-
-    disableRefresh: {
-      description: 'Disables [QPullToRefresh](https://quasar.dev/vue-components/pull-to-refresh). Usually used in conjunction with sortable.'
-    },
-
-    entity: {
-      control: null,
-      description: '[VuexStoreModule](https://github.com/bildvitta/vuex-store-module) entity.'
-    },
-
-    filtersProps: {
-      description: 'Controls filters props from [QasFilters](https://asteroid.nave.dev/?path=/docs/components-filters--default)'
-    },
-
-    noFilter: {
-      description: 'Hide filters.'
-    },
-
-    url: {
-      control: null,
-      description: 'Ignore entity and specify another endpoint.'
-    },
-
-    // Events
-    'fetch-error': {
-      description: 'Fires when occur an error fetching value.',
-      table: {
-        defaultValue: {
-          detail: JSON.stringify({ error: 'object' }),
-          summary: '{}'
-        }
-      }
-    },
-
-    'fetch-success': {
-      description: 'Fires when successfully get the value.',
-      table: {
-        defaultValue: {
-          detail: JSON.stringify({ response: 'object' }),
-          summary: '{}'
-        }
-      }
-    },
-
-    // Slots
-    default: {
-      description: 'Main content.',
-      table: slotDefaults
-    },
-
-    filter: {
-      description: 'Replace `QasFilter` component.',
-      table: {
-        defaultValue: {
-          detail: defaultFilterValues,
-          summary: '{}'
-        },
-
-        type: { summary: null }
-      }
-    },
-
-    footer: {
-      description: 'Page\'s footer content.',
-      table: {
-        type: { summary: null }
-      }
-    },
-
-    header: {
-      description: 'Page\'s header content.',
-      table: slotDefaults
-    },
-
-    'empty-results': {
-      description: 'Main content when has no results.',
-      table: {
-        defaultValue: {
-          detail: JSON.stringify({
-            fields: 'object',
-            metadata: 'object'
-          }),
-
-          summary: '{}'
-        },
-
-        type: { summary: null }
-      },
-
-      type: { summary: null }
-    }
-  }
-}
-
-const Template = (args, { argTypes }) => ({
-  components: { QasDebugger, QasListView },
-  props: Object.keys(argTypes),
-
-  router: new VueRouter(),
-
-  store: new Vuex.Store({
-    modules: { users }
-  }),
-
-  template:
-    `<q-layout>
-      <q-page-container>
-        <qas-list-view v-bind="$props">
-          <template v-slot="{ results, fields }">
-            Results: <qas-debugger :inspect="[results]" />
-            Fields: <qas-debugger :inspect="[fields]" />
-          </template>
-        </qas-list-view>
-      </q-page-container>
-    </q-layout>`
-})
-
-export const Default = Template.bind({})
-
-Default.args = {
-  entity: 'users'
-}

package/src/components/map/QasMap.stories.js

@@ -1,75 +0,0 @@
-import QasMap from './QasMap.vue'
-
-export default {
-  component: QasMap,
-  title: 'Components/Map',
-
-  parameters: {
-    docs: {
-      description: {
-        component: `Map component. This component's library needs to be initialized at boot of your system like the example:
-          
-          import * as VueGoogleMaps from 'gmap-vue'
-          export default function ({ Vue }) {
-            Vue.use(VueGoogleMaps, {
-              load: {
-                key: 'AIzaSyDl00zRKG51WWBIJa8yVXqX7jFD5xyqe24',
-                libraries: 'places'
-              }
-            })
-          }`
-      }
-    }
-  },
-
-  argTypes: {
-    // Props
-    centerPosition: {
-      description: 'Define the coordinate to centralize the position.'
-    },
-
-    hasSearch: {
-      description: 'Show the search input.'
-    },
-
-    markers: {
-      description: 'The list of objects that define and create the main markers in the map.'
-    },
-
-    showPopup: {
-      description: 'Shows the popup message on top of the marker.'
-    },
-
-    zoom: {
-      description: 'Define the initial zoom.'
-    }
-  }
-}
-
-const Template = (args, { argTypes }) => ({
-  components: { QasMap },
-  props: Object.keys(argTypes),
-  template:
-  '<qas-map :center-position="$_position()" has-search :markers="$_createMarkers(values)" show-popup />'
-})
-
-const marker = {
-  position: { lat: -21.17663, lng: -47.820839 },
-  title: 'Teste do componente QasMap',
-  description: 'Ribeirão Preto',
-  draggable: true
-}
-
-export const Default = Template.bind({})
-Default.args = {
-  marker
-}
-
-Default.parameters = {
-  docs: {
-    source: {
-      code:
-      '<qas-map :center-position="{lat: -21.17663, lng: -47.820839 }" has-search :markers="$_createMarker(marker, true)" show-info-window  />'
-    }
-  }
-}

package/src/components/nested-fields/QasNestedFields.stories.js

@@ -1,255 +0,0 @@
-import QasNestedFields from './QasNestedFields.vue'
-
-export default {
-  component: QasNestedFields,
-  title: 'Components/NestedFields',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Component for nested fields.'
-      }
-    }
-  },
-
-  argTypes: {
-    // Props
-    addInputLabel: {
-      description: 'Label of add input.'
-    },
-
-    btnDestroyProps: {
-      description: 'Props of destroy btn (not from inline actions).'
-    },
-
-    btnDuplicateProps: {
-      description: 'Props of duplicate btn (not from inline actions).'
-    },
-
-    destroyKey: {
-      description: 'Key identifier to destroy the field.'
-    },
-
-    errors: {
-      description: 'Each field error.'
-    },
-
-    field: {
-      description: 'Nested fields'
-    },
-
-    fieldsEvents: {
-      description: 'Defines each field events.'
-    },
-
-    fieldsProps: {
-      description: 'Defines each field prop.'
-    },
-
-    formColumns: {
-      description: 'Grid col class of each field.'
-    },
-
-    formGutter: {
-      description: 'Gutter of form fields.'
-    },
-
-    rowLabel: {
-      description: 'Defines a text of row title.'
-    },
-
-    rowObject: {
-      description: 'Defines the default value to each field.'
-    },
-
-    useAnimation: {
-      description: 'Enable animation when add and destroy a field.'
-    },
-
-    useDestroyAlways: {
-      description: 'Enable always destroy btn.'
-    },
-
-    useDuplicate: {
-      description: 'Enable duplicate btn.'
-    },
-
-    useIndexLabel: {
-      description: 'Enable rows enumeration.'
-    },
-
-    useInlineActions: {
-      description: 'Enable inline actions.'
-    },
-
-    useSingleLabel: {
-      description: 'Enable only one label on component.'
-    },
-
-    value: {
-      description: 'Model value.',
-      control: { type: Array }
-    },
-
-    // events
-    input: {
-      description: 'Fires when model changes. Is also used by `v-model`.',
-      table: {
-        defaultValue: { summary: JSON.stringify({ value: 'array' }) }
-      }
-    },
-
-    // Slots
-    'add-input': {
-      description: 'slot for change add input',
-      table: {
-        category: 'slots',
-        defaultValue: {
-          summary: JSON.stringify({
-            add: 'function'
-          })
-        },
-        type: { summary: null }
-      }
-    },
-
-    'custom-fields': {
-      description: 'If need to use some custom component you can use this slot and update the model with updateValue function.',
-      table: {
-        category: 'slots',
-        defaultValue: {
-          summary: JSON.stringify({
-            index: 'number',
-            modelValue: 'object',
-            updateValue: 'function'
-          })
-        },
-        type: { summary: null }
-      }
-    },
-
-    'field-[field.name]': {
-      description: 'Each field inside `fields` is a slot.',
-      table: {
-        category: 'slots',
-        defaultValue: { summary: JSON.stringify({ field: 'object' }) },
-        type: { summary: null }
-      }
-    }
-  }
-}
-
-function templateGenerator (template) {
-  return (args, { argTypes }) => ({
-    components: { QasNestedFields },
-    props: Object.keys(argTypes),
-
-    data () {
-      return {
-        values: []
-      }
-    },
-
-    template
-  })
-}
-
-const Template = templateGenerator(
-  `<div>
-    <qas-nested-fields v-bind="$props" v-model="values" />
-    <pre>{{ values }}</pre>
-  </div>`
-)
-
-const defaults = {
-  field: {
-    name: 'nested',
-    type: 'nested',
-    label: 'Meu nested',
-    children: {
-      name: {
-        name: 'name',
-        type: 'text',
-        label: 'Nome'
-      },
-      email: {
-        name: 'email',
-        type: 'email',
-        label: 'E-mail'
-      },
-      cities: {
-        name: 'cities',
-        type: 'select',
-        label: 'cities',
-        multiple: true,
-        options: [
-          { label: 'City 1', value: 1 },
-          { label: 'City 2', value: 2 },
-          { label: 'City 3', value: 3 }
-        ]
-      }
-    }
-  },
-
-  btnDestroyProps: {
-    label: 'Remover',
-    icon: 'o_cancel',
-    flat: true,
-    hideMobileLabel: true,
-    dense: true
-  },
-
-  btnDuplicateProps: {
-    label: 'Duplicar',
-    icon: 'o_content_copy',
-    flat: true,
-    hideMobileLabel: true,
-    dense: true
-  }
-}
-
-export const Default = Template.bind({})
-Default.args = {
-  ...defaults
-}
-
-export const Error = Template.bind({})
-Error.args = {
-  ...defaults,
-  errors: [
-    {
-      name: 'name is required',
-      email: 'email is required',
-      cities: 'cities is required'
-    }
-  ]
-}
-
-const customFieldsTemplate = (
-  `<div>
-    <qas-nested-fields v-bind="$props" v-model="values">
-      <template v-slot:custom-fields="{ updateValue, index, modelValue }">
-        <q-select v-model="modelValue.colors" :options="['blue', 'green', 'black', 'white']" @input="updateValue(modelValue, index)" />
-      </template>
-    </qas-nested-fields>
-    <pre>{{ values }}</pre>
-  </div>`
-)
-
-export const CustomFields = templateGenerator(customFieldsTemplate)
-
-CustomFields.args = {
-  ...defaults,
-  rowObject: {
-    name: '',
-    email: '',
-    cities: [],
-    colors: ''
-  }
-}
-
-CustomFields.parameters = {
-  docs: {
-    source: { code: customFieldsTemplate }
-  }
-}

package/src/components/page-header/QasPageHeader.stories.js

@@ -1,61 +0,0 @@
-import QasPageHeader from './QasPageHeader.vue'
-import QasBtn from '../btn/QasBtn.vue'
-
-export default {
-  component: QasPageHeader,
-  title: 'Components/PageHeader',
-
-  parameters: {
-    docs: {
-      description: {
-        component: 'Page header structure with breadcrumbs, using [QToolbar](https://quasar.dev/vue-components/toolbar) and [QBreadcrumbs](https://quasar.dev/vue-components/breadcrumbs).'
-      }
-    }
-  },
-
-  argTypes: {
-    // Props
-    breadcrumbs: {
-      description: 'Breadcrumbs structure.'
-    },
-
-    noBreadcrumbs: {
-      description: 'Disable breadcrumbs.'
-    },
-
-    root: {
-      description: 'Breadcrumbs root route.'
-    },
-
-    title: {
-      description: 'Header title.'
-    },
-
-    // Slots
-    default: {
-      description: 'Main slot inside [QToolbar](https://quasar.dev/vue-components/toolbar).',
-      table: {
-        type: { summary: null }
-      }
-    }
-  }
-}
-
-const Template = (args, { argTypes }) => ({
-  components: { QasBtn, QasPageHeader },
-  props: Object.keys(argTypes),
-
-  template:
-    `<div>
-      <qas-page-header v-bind="$props">
-        <qas-btn label="This is my default template!" />
-      </qas-page-header>
-    </div>`
-})
-
-export const Default = Template.bind({})
-
-Default.args = {
-  root: { label: 'Home', route: '/' },
-  title: 'Asteroid'
-}