@bildvitta/quasar-ui-asteroid 3.0.0-beta.4 → 3.0.0-beta.7

package/src/components/card/QasCard.vue

@@ -71,7 +71,7 @@ export default {
     },
 
     cardClasses () {
-      return this.formMode ? 'bg-white border-primary no-shadow' : 'box-shadow-1'
+      return this.formMode ? 'bg-white border-primary no-shadow' : 'shadow-14'
     },
 
     gutterClass () {

package/src/components/card/QasCard.yml

@@ -29,8 +29,8 @@ props:
     type: Boolean
 
 slots:
-  header:
-    desc: Slot para acessar área no lugar do "<q-carousel />".
+  actions:
+    desc: Slot para acessar conteúdo de ações como botão.
 
   carousel-header:
     desc: Slot para acessar usar de header do "<q-carousel />".
@@ -38,5 +38,5 @@ slots:
   default:
     desc: Slot para acessar conteúdo dentro do "<q-card-section />".
 
-  actions:
-    desc: Slot para acessar conteúdo de ações como botão.
+  header:
+    desc: Slot para acessar área no lugar do "<q-carousel />".

package/src/components/checkbox-group/QasCheckboxGroup.yml

@@ -4,10 +4,10 @@ meta:
   desc: Componente para gerar dinamicamente checkbox agrupados.
 
 props:
-  options:
-    desc: Opções para gerar os checkbox.
-    default: []
-    type: Array
+  inline:
+    desc: Controla se o componente vai aparece em linha ou em bloco.
+    default: true
+    type: Boolean
 
   model-value:
     desc: Model do componente, usado para v-model.
@@ -16,10 +16,11 @@ props:
     examples: [v-model"value"]
     model: true
 
-  inline:
-    desc: Controla se o componente vai aparece em linha ou em bloco.
-    default: true
-    type: Boolean
+  options:
+    desc: Opções para gerar os checkbox.
+    default: []
+    type: Array
+
 
 events:
   '@update:model-value -> function(value)':

package/src/components/copy/QasCopy.vue

@@ -2,7 +2,7 @@
   <span>
     <slot>{{ text }}</slot>
 
-    <qas-btn class="q-ml-xs" color="grey-5" flat :icon="icon" :loading="isLoading" round :size="size" @click="copy">
+    <qas-btn class="q-ml-xs" color="grey-7" flat :icon="icon" :loading="isLoading" round :size="size" @click="copy">
       <q-tooltip>Copiar</q-tooltip>
     </qas-btn>
   </span>

package/src/components/copy/QasCopy.yml

@@ -9,12 +9,13 @@ props:
     type: String
     default: o_file_copy
 
+  text:
+    desc: Texto a ser copiado.
+    type: String
+
   size:
     desc: Tamanho do botão.
     type: String
     default: xs
     examples: [xs, sm, md, lg, xl]
 
-  text:
-    desc: Texto a ser copiado.
-    type: String

package/src/components/date-time-input/QasDateTimeInput.yml

@@ -25,6 +25,12 @@ props:
     desc: Utilizado para se usar junto da prop "date-only" ou "time-only", caso "gmt" for "true", o model sempre vai ser retornado no padrão ISO 8601, independente ser apenas um campo somente de data ou hora.
     type: Boolean
 
+  model-value:
+    desc: Model do componente, usado para v-model.
+    default: ''
+    type: String
+    model: true
+
   time-mask:
     desc: Máscara do componente de input de hora.
     default: HH:mm
@@ -39,11 +45,6 @@ props:
     default: {}
     type: Object
 
-  model-value:
-    desc: Model do componente, usado para v-model.
-    default: ''
-    type: String
-    model: true
 
 events:
   '@update:model-value -> function (value)':

package/src/components/delete/QasDelete.yml

@@ -4,23 +4,25 @@ meta:
   desc: Componente para C.R.U.D. responsável por deletar (Delete).
 
 props:
-  entity:
-    desc: Entidade da store, por exemplo se tiver que trabalhar com modulo de usuários, teremos o model "users" na store, que vai ser nossa "entity".
-    required: true
-    type: String
-
   custom-id:
     desc: Por padrão, o componente vai pegar o "id" que vem como parâmetro na url, caso queira que o id seja diferente da url, use esta prop.
     type: String
     examples: ['my-custom-id']
 
+  deleting:
+    desc: Model para saber se está deletando.
+    type: Boolean
+    examples: [v-model:deleting="isDeleting"]
+    model: true
+
   dialog-props:
     desc: Props para ser repassada para o componente "QasDialog"
     default: {}
     type: Object
 
-  url:
-    desc: Envia como parâmetro para a action "fetchSingle" do modulo correspondente a "entity".
+  entity:
+    desc: Entidade da store, por exemplo se tiver que trabalhar com modulo de usuários, teremos o model "users" na store, que vai ser nossa "entity".
+    required: true
     type: String
 
   tag:
@@ -29,11 +31,9 @@ props:
     type: String
     examples: [q-item]
 
-  deleting:
-    desc: Model para saber se está deletando.
-    type: Boolean
-    examples: [v-model:deleting="isDeleting"]
-    model: true
+  url:
+    desc: Envia como parâmetro para a action "fetchSingle" do modulo correspondente a "entity".
+    type: String
 
   use-auto-delete-route:
     desc: Controla se sempre que deletar com sucesso um item, remove todas as rotas do histórico de rotas que contenha id do item deletado.
@@ -45,12 +45,12 @@ slots:
     desc: 'Slot para acessar dentro do componente.'
 
 events:
-  '@success -> function()':
-    desc: Dispara quando o componente deleta com sucesso.
-
   '@error -> function(value)':
     desc: Dispara quando acontece algum erro na hora de deletar.
     params:
       value:
         desc: Erro retornado.
         type: Object
+
+  '@success -> function()':
+    desc: Dispara quando o componente deleta com sucesso.

package/src/components/dialog/QasDialog.yml

@@ -15,16 +15,16 @@ props:
     type: [Object, Boolean]
     examples: ["{ label: 'Meu botão de cancelar', onClick: () => alert('fui clicado!') }"]
 
-  card:
-    desc: Objeto contendo as informações para serem exibidas dentro do dialog como "title" e "description".
+  card-props:
+    desc: Props repassadas para o componente "<q-card />".
     default: {}
     type: Object
-    examples: ["{ title: 'Meu título', description: 'Minha descrição' }"]
 
-  card-props:
-    desc: Props repassadas para o componente "<q-card />".
+  card:
+    desc: Objeto contendo as informações para serem exibidas dentro do dialog como "title" e "description".
     default: {}
     type: Object
+    examples: ["{ title: 'Meu título', description: 'Minha descrição' }"]
 
   max-width:
     desc: Tamanho máximo do dialog.
@@ -34,6 +34,12 @@ props:
     desc: Tamanho mínimo do dialog.
     type: String
 
+  model-value:
+    desc: Model do componente, abre ou fecha o dialog.
+    type: Boolean
+    examples: [v-model="value"]
+    model: true
+
   ok:
     desc: Props para o botão de confirmar (ok), pode ser objeto com as propriedades ou um boolean, caso for "false", remove o botão de confirmar.
     default: "{ label: 'Ok', outline: type: this.ok?.type || this.useForm ? 'submit' : 'button' }"
@@ -46,29 +52,24 @@ props:
     default: true
     type: Object
 
-  use-form:
-    desc: Define se a tag onde fica a descrição no dialog vai ser um "<q-form />" ou "<div />".
-    type: Boolean
-
-  model-value:
-    desc: Model do componente, abre ou fecha o dialog.
-    type: Boolean
-    examples: [v-model="value"]
-    model: true
-
   use-close-icon:
     desc: Define se vai ter ou não Ícone de fechar o dialog.
     type: Boolean
 
+  use-form:
+    desc: Define se a tag onde fica a descrição no dialog vai ser um "<q-form />" ou "<div />".
+    type: Boolean
+
 slots:
-  header:
-    desc: Slot para o título.
+
+  actions:
+    desc: Slot para ações (botões por exemplo).
 
   description:
     desc: Slot para descrição.
 
-  actions:
-    desc: Slot para ações (botões por exemplo).
+  header:
+    desc: Slot para o título.
 
 events:
   '@update:model-value -> function (value)':

package/src/components/filters/QasFilters.vue

@@ -16,7 +16,7 @@
 
       <slot v-if="showFilterButton" :filter="filter" name="filter-button">
         <q-btn v-if="useFilterButton" :color="filterButtonColor" flat icon="o_filter_list" :label="filterButtonLabel">
-          <q-menu>
+          <q-menu class="full-width" max-width="240px">
             <div v-if="isFetching" class="q-pa-xl text-center">
               <q-spinner color="grey" size="2em" />
             </div>
@@ -41,7 +41,7 @@
     </div>
 
     <div v-if="useChip && hasActiveFilters" class="q-mt-md">
-      <q-chip v-for="(filterItem, key) in activeFilters" :key="key" color="grey-4" dense removable size="md" text-color="grey-8" @remove="removeFilter(filterItem)">{{ filterItem.label }} = "{{ getChipValue(filterItem.value) }}"</q-chip>
+      <q-chip v-for="(filterItem, key) in activeFilters" :key="key" color="primary" dense removable size="md" text-color="white" @remove="removeFilter(filterItem)">{{ filterItem.label }} = "{{ getChipValue(filterItem.value) }}"</q-chip>
     </div>
 
     <slot :context="mx_context" :filter="filter" :filters="activeFilters" :remove-filter="removeFilter" />
@@ -150,7 +150,7 @@ export default {
     },
 
     filterButtonColor () {
-      return this.hasActiveFilters ? 'primary' : 'grey-8'
+      return this.hasActiveFilters ? 'primary' : 'grey-9'
     },
 
     filterButtonLabel () {

package/src/components/filters/QasFilters.yml

@@ -9,6 +9,19 @@ props:
     required: true
     type: String
 
+  force-refetch:
+    desc: Força refazer o "fetch" mesmo caso já exista dados na store de filters.
+    type: Boolean
+
+  search-placeholder:
+    desc: Placeholder do campo de busca.
+    default: Pesquisar...
+    type: String
+
+  url:
+    desc: Envia como parâmetro para a action "fetchFilters" do modulo correspondente a "entity".
+    type: String
+
   use-badges:
     desc: Habilita ou não os "chips" mostrando os filtros ativos.
     default: true
@@ -19,27 +32,14 @@ props:
     default: true
     type: Boolean
 
-  use-search:
-    desc: Habilita ou não o campo text de busca.
-    default: true
-    type: Boolean
-
   use-search-on-type:
     desc: Habilita ou não o filtro de busca sempre que o usuário digita.
     default: true
     type: Boolean
 
-  search-placeholder:
-    desc: Placeholder do campo de busca.
-    default: Pesquisar...
-    type: String
-
-  url:
-    desc: Envia como parâmetro para a action "fetchFilters" do modulo correspondente a "entity".
-    type: String
-
-  force-refetch:
-    desc: Força refazer o "fetch" mesmo caso já exista dados na store de filters.
+  use-search:
+    desc: Habilita ou não o campo text de busca.
+    default: true
     type: Boolean
 
 slots:

package/src/components/form-generator/QasFormGenerator.yml

@@ -4,27 +4,34 @@ meta:
   desc: Componente para criação de múltiplos campos dinâmicos a partir do componente `QasField`.
 
 props:
+  columns:
+    desc: Colunas do grid de cada campo.
+    default: col-6
+    type: [Array, String, Object]
+    examples: ["{ name: { sm: 6, md: 12 } }", "[{ sm: 6, md: 12 }]"]
+
   error:
     desc: Objeto contendo propriedades contendo a mensagem de erro.
     default: {}
     type: Object
 
-  fields:
-    desc: Lista de field contendo informações necessárias para a criação do campo correspondente.
-    default: {}
-    type: Object
-    examples: ["{ email: { name: 'email', type: 'email', label: 'E-mail' } }"]
-
   fields-props:
     desc: Propriedade para repassar propriedades para cada campo individualmente.
     default: {}
     type: Object
     examples: ["{ name: { dense: true, onClick: () => alert('Estou sendo clicado') } }"]
 
-  order:
-    desc: Altera ordem dos campos.
-    default: []
-    type: Array
+  fields:
+    desc: Lista de field contendo informações necessárias para a criação do campo correspondente.
+    default: {}
+    type: Object
+    examples: ["{ email: { name: 'email', type: 'email', label: 'E-mail' } }"]
+
+  gutter:
+    desc: Espaçamento entre colunas.
+    default: md
+    type: String
+    examples: [xs, sm, md, lg, xl]
 
   model-value:
     desc: Model do componente, usado para o v-model.
@@ -34,17 +41,10 @@ props:
     examples: [v-model="value"]
     model: true
 
-  columns:
-    desc: Colunas do grid de cada campo.
-    default: col-6
-    type: [Array, String, Object]
-    examples: ["{ name: { sm: 6, md: 12 } }", "[{ sm: 6, md: 12 }]"]
-
-  gutter:
-    desc: Espaçamento entre colunas.
-    default: md
-    type: String
-    examples: [xs, sm, md, lg, xl]
+  order:
+    desc: Altera ordem dos campos.
+    default: []
+    type: Array
 
 slots:
   'field-[nome-da-chave]':

package/src/components/form-view/QasFormView.yml

@@ -25,16 +25,65 @@ props:
     type: String
     examples: ['my-custom-id']
 
+  dialog:
+    desc: Este componente pode ser utilizado dentro de um dialog, neste caso o componente pai não pode ser um "QPage" e sim uma "div", esta prop cuida disto.
+    type: Boolean
+
   disable:
     desc: Desabilita o submit.
     type: Boolean
 
+  entity:
+    desc: Entidade da store, por exemplo se tiver que trabalhar com modulo de usuários, teremos o model "users" na store, que vai ser nossa "entity".
+    required: true
+    type: String
+
+  errors:
+    desc: Model de errors, utilizado para recuperar os errors fora do template.
+    default: {}
+    type: Object
+    examples: [v-model:errors="errors"]
+    model: true
+
+  fetching:
+    desc: Model de fetching, utilizado para saber se o componente está fazendo fetching de dados.
+    type: Boolean
+    examples: [v-model:fetching="isFetching"]
+    model: true
+
+  fields:
+    desc: Model de fields, utilizado para recuperar os fields fora do template.
+    default: {}
+    type: Object
+    examples: [v-model:fields="fields"]
+    model: true
+
+  ignore-keys-in-unsaved-changes:
+    desc: Vamos imaginar um cenário onde você precisa alterar valores do v-model por qualquer motivo que seja, mas quando o usuário sair da tela, não pode aparecer o modal perguntando se ele quer sair ou continuar editando, por que o usuário de fato não fez nenhuma alteração nos dados, esta prop serve para você dizer quais keys dentro do v-model você quer ignorar.
+    default: []
+    type: Array
+    examples: ["['isActive']"]
+
+  metadata:
+    desc: Model de metadata, utilizado para recuperar os metadata fora do template.
+    default: {}
+    type: Object
+    examples: [v-model:metadata="metadata"]
+    model: true
+
   mode:
     desc: Existem 3 modos no QasFormView, para criação (create) (equivalente a um método POST no http), e edição que são 2 diferentes, replace (equivalente a um método PUT no http) e update (equivalente a um método PATCH no http).
     default: create
     type: String
     examples: [create, replace, update]
 
+  model-value:
+    desc: Model do componente, controla o payload que será enviado para as actions dos modos create, replace e update.
+    default: {}
+    type: Object
+    examples: [v-model="values"]
+    model: true
+
   read-only:
     desc: Controla o slot de actions.
     type: Boolean
@@ -49,84 +98,49 @@ props:
     default: true
     type: Boolean
 
-  ignore-keys-in-unsaved-changes:
-    desc: Vamos imaginar um cenário onde você precisa alterar valores do v-model por qualquer motivo que seja, mas quando o usuário sair da tela, não pode aparecer o modal perguntando se ele quer sair ou continuar editando, por que o usuário de fato não fez nenhuma alteração nos dados, esta prop serve para você dizer quais keys dentro do v-model você quer ignorar.
-    default: []
-    type: Array
-    examples: ["['isActive']"]
-
   submit-button:
     desc: Rótulo do botão "salvar".
     default: Salvar
     type: String
 
-  model-value:
-    desc: Model do componente, controla o payload que será enviado para as actions dos modos create, replace e update.
-    default: {}
-    type: Object
-    examples: [v-model="values"]
-    model: true
-
   submitting:
     desc: Model que que mostra quando o componente está fazendo um submitting ou não.
     type: Boolean
     examples: [v-model:submitting="isSubmitting"]
     model: true
 
-  entity:
-    desc: Entidade da store, por exemplo se tiver que trabalhar com modulo de usuários, teremos o model "users" na store, que vai ser nossa "entity".
-    required: true
-    type: String
-
-  dialog:
-    desc: Este componente pode ser utilizado dentro de um dialog, neste caso o componente pai não pode ser um "QPage" e sim uma "div", esta prop cuida disto.
-    type: Boolean
-
   url:
     desc: Envia como parâmetro para a action "fetchSingle" do modulo correspondente a "entity".
     type: String
 
-  fields:
-    desc: Model de fields, utilizado para recuperar os fields fora do template.
-    default: {}
-    type: Object
-    examples: [v-model:fields="fields"]
-    model: true
-
-  errors:
-    desc: Model de errors, utilizado para recuperar os errors fora do template.
-    default: {}
-    type: Object
-    examples: [v-model:errors="errors"]
-    model: true
-
-  metadata:
-    desc: Model de metadata, utilizado para recuperar os metadata fora do template.
-    default: {}
-    type: Object
-    examples: [v-model:metadata="metadata"]
-    model: true
-
-  fetching:
-    desc: Model de fetching, utilizado para saber se o componente está fazendo fetching de dados.
-    type: Boolean
-    examples: [v-model:fetching="isFetching"]
-    model: true
-
 slots:
-  header:
-    desc: Slot para acessar o header.
+  actions:
+    desc: Slot para acessar a seção onde ficam os botões de ações (salvar e cancelar).
 
   default:
     desc: Slot para ter o conteúdo principal (dentro do main).
 
-  actions:
-    desc: Slot para acessar a seção onde ficam os botões de ações (salvar e cancelar).
-
   footer:
     desc: Slot para acessar o footer.
 
+  header:
+    desc: Slot para acessar o header.
+
 events:
+  '@fetch-success -> function(value)':
+    desc: Dispara quando a action "fetchSingle" é executada com sucesso.
+    params:
+      value:
+        desc: Retorna todos os dados "cru" respondido pelo fetch.
+        type: Object
+
+  '@fetch-error -> function(value)':
+    desc: Dispara quando a action "fetchSingle" cai em uma exceção.
+    params:
+      value:
+        desc: Retorna todos os dados "cru" respondido na exceção do fetch.
+        type: Object
+
   '@update:model-value -> function(value)':
     desc: Dispara toda vez que o model atualiza.
     params:
@@ -168,17 +182,3 @@ events:
       value:
         desc: Retorna se está ou não fazendo fetching de dados.
         type: Boolean
-
-  '@fetch-success -> function(value)':
-    desc: Dispara quando a action "fetchSingle" é executada com sucesso.
-    params:
-      value:
-        desc: Retorna todos os dados "cru" respondido pelo fetch.
-        type: Object
-
-  '@fetch-error -> function(value)':
-    desc: Dispara quando a action "fetchSingle" cai em uma exceção.
-    params:
-      value:
-        desc: Retorna todos os dados "cru" respondido na exceção do fetch.
-        type: Object

package/src/components/gallery/QasGallery.yml

@@ -22,13 +22,13 @@ props:
     desc: Altura da imagem (fora do dialog).
     type: String
 
-  initial-size:
-    desc: Quantidade de imagens iniciais.
+  images:
+    desc: Imagens a serem exibidas.
     default: 6
     type: Number
 
-  images:
-    desc: Imagens a serem exibidas.
+  initial-size:
+    desc: Quantidade de imagens iniciais.
     default: 6
     type: Number