@bildvitta/quasar-ui-asteroid 3.17.0-beta.21 → 3.17.0-beta.22

package/src/components/search-box/QasSearchBox.yml

@@ -1,154 +1,154 @@
-type: component
-
-meta:
-  desc: Componente para pesquisa utilizando Fuse.js.
-
-props:
-  empty-list-height:
-    desc: Define altura do box quando a lista está vazia.
-    default: 100px
-    type: String
-
-  entity:
-    desc: Entidade enviada para a action "fetchFieldOptions" (usar somente quando "useLazyLoading" estiver habilitada).
-    default: ''
-    type: String
-    examples: [users]
-
-  fetching:
-    desc: Usado para saber quando o componente está fazendo fetching (usar somente quando "useLazyLoading" estiver habilitada).
-    default: false
-    type: Boolean
-    model: true
-    examples: [v-model:fetching="isFetching"]
-
-  fuse-options:
-    desc: Opções do Fuse.js (https://fusejs.io/api/options.html).
-    debugger: true
-    type: Object
-    examples: ["{ keys: ['label'] }"]
-    default:
-      ignoreLocation: true
-      threshold: 0.4
-
-  height:
-    desc: Define altura do box quando a lista não está vazia.
-    default: 300px
-    type: String
-
-  lazy-loading-props:
-    desc: Propriedades para o lazy loading (usar somente quando "useLazyLoading" estiver habilitada).
-    type: Object
-    debugger: true
-    default:
-      decamelizeFieldName: true
-      url: ''
-      params:
-        limit: 48
-
-  list:
-    desc: Lista onde ocorrerá a busca sendo array de objetos (usar somente quando "useLazyLoading" **NÃO** estiver habilitada).
-    default: []
-    type: String
-
-  model-value:
-    desc: Model do campo de pesquisa.
-    type: String
-    examples: [v-model="search"]
-    model: true
-
-  name:
-    desc: Nome do campo a ser enviado para a action "fetchFieldOptions" (usar somente quando "useLazyLoading" estiver habilitada).
-    type: String
-    examples: [cities]
-
-  outlined:
-    desc: Define se a área que contém o resultado da pesquisa terá o estilo de borda arredondada com fundo branco (semelhante a um input).
-    default: false
-    type: Boolean
-
-  placeholder:
-    desc: Placeholder do campo de pesquisa.
-    default: Pesquisar
-    type: String
-
-  results:
-    desc: Model que retorna o resultado filtrado.
-    default: []
-    type: Array
-    examples: [v-model:results="results"]
-    model: true
-
-  use-empty-slot:
-    desc: Controla o slot "empty-result".
-    default: true
-    type: Boolean
-
-  use-lazy-loading:
-    desc: Controla a busca pela store "fetchFieldOptions".
-    default: false
-    type: Boolean
-
-slots:
-  after-search:
-    desc: Acesso ao conteúdo após o input de pesquisa e antes do resultados (slot default).
-
-  default:
-    desc: Acesso ao conteúdo principal, só existe caso a busca retorne algum resultado.
-
-  empty-result:
-    desc: Acesso ao conteúdo quando a busca não retorne resultado e a prop "useEmptySlot" seja "true".
-
-  loading:
-    desc: Acesso ao conteúdo do loading que contém o "<q-spinner-dots />"..
-
-events:
-  '@empty-result -> function ()':
-    desc: Dispara toda vez que a pesquisa não retorna resultado.
-
-  '@update:model-value -> function (value)':
-    desc: Dispara toda vez que o campo de busca é alterado, também utilizado para v-model
-    params:
-      value:
-        desc: Novo valor do v-model
-        type: String
-
-  '@update:results -> function (value)':
-    desc: Dispara toda vez que o campo de busca é alterado e acontece um novo filtro, também utilizado para v-model:results
-    params:
-      value:
-        desc: Novo valor do v-model:results
-        default: []
-        type: Array
-
-  '@update:fetching -> function (value)':
-    desc: Dispara toda vez que o campo de busca faz o fetch do lazy loading
-    params:
-      value:
-        desc: Novo valor do v-model:fetching
-        default: false
-        type: Boolean
-
-  '@update:selectedOptions -> function (value)':
-    desc: Dispara toda vez que a lista de opções selecionadas é atualizada.
-    params:
-      value:
-        desc: Array com as opções selecionadas (label e value)
-        default: []
-        type: Array
-
-  '@fetch-options-success -> function (value)':
-    desc: Dispara toda vez que o campo de busca faz o fetch do lazy loading com sucesso.
-    params:
-      value:
-        desc: Valor retornado pela action "fetchFieldOptions"
-        default: {}
-        type: Object
-
-  '@fetch-options-error -> function (value)':
-    desc: Dispara toda vez que o campo de busca faz o fetch do lazy loading e cai em uma exceção.
-    params:
-      value:
-        desc: Valor retornado pela action "fetchFieldOptions"
-        default: {}
-        type: Object
+type: component
+
+meta:
+  desc: Componente para pesquisa utilizando Fuse.js.
+
+props:
+  empty-list-height:
+    desc: Define altura do box quando a lista está vazia.
+    default: 100px
+    type: String
+
+  entity:
+    desc: Entidade enviada para a action "fetchFieldOptions" (usar somente quando "useLazyLoading" estiver habilitada).
+    default: ''
+    type: String
+    examples: [users]
+
+  fetching:
+    desc: Usado para saber quando o componente está fazendo fetching (usar somente quando "useLazyLoading" estiver habilitada).
+    default: false
+    type: Boolean
+    model: true
+    examples: [v-model:fetching="isFetching"]
+
+  fuse-options:
+    desc: Opções do Fuse.js (https://fusejs.io/api/options.html).
+    debugger: true
+    type: Object
+    examples: ["{ keys: ['label'] }"]
+    default:
+      ignoreLocation: true
+      threshold: 0.4
+
+  height:
+    desc: Define altura do box quando a lista não está vazia.
+    default: 300px
+    type: String
+
+  lazy-loading-props:
+    desc: Propriedades para o lazy loading (usar somente quando "useLazyLoading" estiver habilitada).
+    type: Object
+    debugger: true
+    default:
+      decamelizeFieldName: true
+      url: ''
+      params:
+        limit: 48
+
+  list:
+    desc: Lista onde ocorrerá a busca sendo array de objetos (usar somente quando "useLazyLoading" **NÃO** estiver habilitada).
+    default: []
+    type: String
+
+  model-value:
+    desc: Model do campo de pesquisa.
+    type: String
+    examples: [v-model="search"]
+    model: true
+
+  name:
+    desc: Nome do campo a ser enviado para a action "fetchFieldOptions" (usar somente quando "useLazyLoading" estiver habilitada).
+    type: String
+    examples: [cities]
+
+  outlined:
+    desc: Define se a área que contém o resultado da pesquisa terá o estilo de borda arredondada com fundo branco (semelhante a um input).
+    default: false
+    type: Boolean
+
+  placeholder:
+    desc: Placeholder do campo de pesquisa.
+    default: Pesquisar
+    type: String
+
+  results:
+    desc: Model que retorna o resultado filtrado.
+    default: []
+    type: Array
+    examples: [v-model:results="results"]
+    model: true
+
+  use-empty-slot:
+    desc: Controla o slot "empty-result".
+    default: true
+    type: Boolean
+
+  use-lazy-loading:
+    desc: Controla a busca pela store "fetchFieldOptions".
+    default: false
+    type: Boolean
+
+slots:
+  after-search:
+    desc: Acesso ao conteúdo após o input de pesquisa e antes do resultados (slot default).
+
+  default:
+    desc: Acesso ao conteúdo principal, só existe caso a busca retorne algum resultado.
+
+  empty-result:
+    desc: Acesso ao conteúdo quando a busca não retorne resultado e a prop "useEmptySlot" seja "true".
+
+  loading:
+    desc: Acesso ao conteúdo do loading que contém o "<q-spinner-dots />"..
+
+events:
+  '@empty-result -> function ()':
+    desc: Dispara toda vez que a pesquisa não retorna resultado.
+
+  '@update:model-value -> function (value)':
+    desc: Dispara toda vez que o campo de busca é alterado, também utilizado para v-model
+    params:
+      value:
+        desc: Novo valor do v-model
+        type: String
+
+  '@update:results -> function (value)':
+    desc: Dispara toda vez que o campo de busca é alterado e acontece um novo filtro, também utilizado para v-model:results
+    params:
+      value:
+        desc: Novo valor do v-model:results
+        default: []
+        type: Array
+
+  '@update:fetching -> function (value)':
+    desc: Dispara toda vez que o campo de busca faz o fetch do lazy loading
+    params:
+      value:
+        desc: Novo valor do v-model:fetching
+        default: false
+        type: Boolean
+
+  '@update:selectedOptions -> function (value)':
+    desc: Dispara toda vez que a lista de opções selecionadas é atualizada.
+    params:
+      value:
+        desc: Array com as opções selecionadas (label e value)
+        default: []
+        type: Array
+
+  '@fetch-options-success -> function (value)':
+    desc: Dispara toda vez que o campo de busca faz o fetch do lazy loading com sucesso.
+    params:
+      value:
+        desc: Valor retornado pela action "fetchFieldOptions"
+        default: {}
+        type: Object
+
+  '@fetch-options-error -> function (value)':
+    desc: Dispara toda vez que o campo de busca faz o fetch do lazy loading e cai em uma exceção.
+    params:
+      value:
+        desc: Valor retornado pela action "fetchFieldOptions"
+        default: {}
+        type: Object

package/src/components/search-input/QasSearchInput.vue

@@ -1,106 +1,106 @@
-<template>
-  <component :is="component" class="qas-search-input" :class="containerClasses" :use-spacing="false">
-    <qas-input ref="input" v-model="model" class="qas-search-input__input" v-bind="$attrs" data-cy="search-input" :debounce="debounce" dense hide-bottom-space input-class="ellipsis text-grey-8" inputmode="search" outlined type="search">
-      <template #prepend>
-        <q-icon v-if="useSearchOnType" color="grey-8" name="sym_r_search" />
-
-        <qas-btn v-else color="grey-10" icon="sym_r_search" variant="tertiary" @click="$emit('filter')" />
-      </template>
-
-      <template #append>
-        <qas-btn v-if="hasSearch" color="grey-10" icon="sym_r_clear" variant="tertiary" @click="clear" />
-
-        <slot name="after-clear" />
-      </template>
-    </qas-input>
-  </component>
-</template>
-
-<script>
-export default {
-  name: 'QasSearchInput',
-
-  inject: {
-    isBox: { default: false },
-    isDialog: { default: false }
-  },
-
-  inheritAttrs: false,
-
-  props: {
-    modelValue: {
-      default: '',
-      type: String
-    },
-
-    useDebounce: {
-      default: true,
-      type: Boolean
-    },
-
-    useSearchOnType: {
-      default: true,
-      type: Boolean
-    }
-  },
-
-  emits: [
-    'clear',
-    'filter',
-    'update:modelValue'
-  ],
-
-  computed: {
-    component () {
-      return this.isBoxOrDialog ? 'div' : 'qas-box'
-    },
-
-    containerClasses () {
-      return {
-        bordered: this.isBoxOrDialog
-      }
-    },
-
-    isBoxOrDialog () {
-      return this.isBox || this.isDialog
-    },
-
-    debounce () {
-      return this.useDebounce ? '1200' : ''
-    },
-
-    hasSearch () {
-      return !!this.model.length
-    },
-
-    input () {
-      return this.$refs.input
-    },
-
-    model: {
-      get () {
-        return this.modelValue
-      },
-
-      set (value) {
-        this.$emit('update:modelValue', value)
-      }
-    }
-  },
-
-  methods: {
-    clear () {
-      this.$emit('clear', this.modelValue)
-      this.$emit('update:modelValue', '')
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-.qas-search-input {
-  .qas-search-input__input .q-field__control:before {
-    border: 0;
-  }
-}
-</style>
+<template>
+  <component :is="component" class="qas-search-input" :class="containerClasses" :use-spacing="false">
+    <qas-input ref="input" v-model="model" class="qas-search-input__input" v-bind="$attrs" data-cy="search-input" :debounce="debounce" dense hide-bottom-space input-class="ellipsis text-grey-8" inputmode="search" outlined type="search">
+      <template #prepend>
+        <q-icon v-if="useSearchOnType" color="grey-8" name="sym_r_search" />
+
+        <qas-btn v-else color="grey-10" icon="sym_r_search" variant="tertiary" @click="$emit('filter')" />
+      </template>
+
+      <template #append>
+        <qas-btn v-if="hasSearch" color="grey-10" icon="sym_r_clear" variant="tertiary" @click="clear" />
+
+        <slot name="after-clear" />
+      </template>
+    </qas-input>
+  </component>
+</template>
+
+<script>
+export default {
+  name: 'QasSearchInput',
+
+  inject: {
+    isBox: { default: false },
+    isDialog: { default: false }
+  },
+
+  inheritAttrs: false,
+
+  props: {
+    modelValue: {
+      default: '',
+      type: String
+    },
+
+    useDebounce: {
+      default: true,
+      type: Boolean
+    },
+
+    useSearchOnType: {
+      default: true,
+      type: Boolean
+    }
+  },
+
+  emits: [
+    'clear',
+    'filter',
+    'update:modelValue'
+  ],
+
+  computed: {
+    component () {
+      return this.isBoxOrDialog ? 'div' : 'qas-box'
+    },
+
+    containerClasses () {
+      return {
+        bordered: this.isBoxOrDialog
+      }
+    },
+
+    isBoxOrDialog () {
+      return this.isBox || this.isDialog
+    },
+
+    debounce () {
+      return this.useDebounce ? '1200' : ''
+    },
+
+    hasSearch () {
+      return !!this.model.length
+    },
+
+    input () {
+      return this.$refs.input
+    },
+
+    model: {
+      get () {
+        return this.modelValue
+      },
+
+      set (value) {
+        this.$emit('update:modelValue', value)
+      }
+    }
+  },
+
+  methods: {
+    clear () {
+      this.$emit('clear', this.modelValue)
+      this.$emit('update:modelValue', '')
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.qas-search-input {
+  .qas-search-input__input .q-field__control:before {
+    border: 0;
+  }
+}
+</style>

package/src/components/search-input/QasSearchInput.yml

@@ -1,48 +1,48 @@
-type: component
-
-meta:
-  desc: Componente de input para pesquisa / filtros.
-
-props:
-  model-value:
-    desc: Model do componente, utilizado para v-model.
-    default: ''
-    type: String
-    model: true
-
-  use-debounce:
-    desc: Controla debounce.
-    default: true
-    type: Boolean
-
-  use-search-on-type:
-    desc: Controla se vai habilitar o botão de pesquisa ao clicar.
-    default: true
-    type: Boolean
-
-slots:
-  after-clear:
-    desc: Slot para acessar área após o botão de limpar pesquisa.
-
-events:
-  '@update:clear -> function(oldValue)':
-    desc: Dispara quando é clicado no botão de limpar pesquisa.
-    params:
-      oldValue:
-        desc: Valor do model antes de ser limpo.
-        type: String
-
-  '@update:filter -> function()':
-    desc: Dispara quando a prop "useSearchOnType" for "false" e é clicado no botão de pesquisar.
-
-  '@update:model-value -> function(value)':
-    desc: Dispara quando o model-value altera, também usado para v-model.
-    params:
-      value:
-        desc: Novo valor do model.
-        type: String
-
-selectors:
-  search-input:
-    desc: Seletor do campo de pesquisa.
-    examples: ['data-cy="search-input"']
+type: component
+
+meta:
+  desc: Componente de input para pesquisa / filtros.
+
+props:
+  model-value:
+    desc: Model do componente, utilizado para v-model.
+    default: ''
+    type: String
+    model: true
+
+  use-debounce:
+    desc: Controla debounce.
+    default: true
+    type: Boolean
+
+  use-search-on-type:
+    desc: Controla se vai habilitar o botão de pesquisa ao clicar.
+    default: true
+    type: Boolean
+
+slots:
+  after-clear:
+    desc: Slot para acessar área após o botão de limpar pesquisa.
+
+events:
+  '@update:clear -> function(oldValue)':
+    desc: Dispara quando é clicado no botão de limpar pesquisa.
+    params:
+      oldValue:
+        desc: Valor do model antes de ser limpo.
+        type: String
+
+  '@update:filter -> function()':
+    desc: Dispara quando a prop "useSearchOnType" for "false" e é clicado no botão de pesquisar.
+
+  '@update:model-value -> function(value)':
+    desc: Dispara quando o model-value altera, também usado para v-model.
+    params:
+      value:
+        desc: Novo valor do model.
+        type: String
+
+selectors:
+  search-input:
+    desc: Seletor do campo de pesquisa.
+    examples: ['data-cy="search-input"']