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

package/src/components/sortable/QasSortable.vue

@@ -1,151 +1,151 @@
-<template>
-  <component :is="tag" ref="sortableItems">
-    <slot />
-  </component>
-</template>
-
-<script>
-import { Loading, extend } from 'quasar'
-import Sortable from 'sortablejs'
-import { getAction } from '@bildvitta/store-adapter'
-
-import { NotifyError } from '../../plugins'
-
-export default {
-  name: 'QasSortable',
-
-  props: {
-    entity: {
-      default: '',
-      type: String
-    },
-
-    sortableOptions: {
-      default: () => ({ animation: 500 }),
-      type: Object
-    },
-
-    tag: {
-      default: 'div',
-      type: String
-    },
-
-    url: {
-      default: '',
-      type: String
-    },
-
-    modelValue: {
-      default: () => [],
-      type: Array
-    },
-
-    useSaveOnSort: {
-      type: Boolean,
-      default: true
-    }
-  },
-
-  emits: [
-    'update:modelValue',
-    'sort',
-    'success',
-    'error'
-  ],
-
-  data () {
-    return {
-      sortable: null,
-      sortedList: null
-    }
-  },
-
-  computed: {
-    identifiers () {
-      return this.sortedList.map(({ id }) => id)
-    }
-  },
-
-  watch: {
-    sortableOptions (value) {
-      this.sortable.options = { ...this.sortable.options, ...value }
-    },
-
-    modelValue: {
-      handler (newValues) {
-        this.sortedList = newValues
-      },
-
-      deep: true
-    }
-  },
-
-  created () {
-    this.setSortedValue()
-  },
-
-  async mounted () {
-    this.sortable = new Sortable(this.$refs.sortableItems, {
-      ...this.sortableOptions,
-
-      onUpdate: event => {
-        this.updateOrder(event)
-        this.$emit('sort', event)
-      }
-    })
-  },
-
-  unmounted () {
-    this.sortable.destroy()
-  },
-
-  methods: {
-    setError (error) {
-      const { response } = error
-      const exception = response?.data?.exception || error.message
-
-      NotifyError('Ops! Erro ao salvar ordenação.', exception)
-    },
-
-    // TODO precisa testar este método quando tivermos uma API para teste.
-    async replace () {
-      Loading.show()
-
-      try {
-        const response = await getAction.call(this, {
-          entity: this.entity,
-          key: 'replace',
-          payload: {
-            payload: { order: this.identifiers },
-            url: this.url || `${this.entity}/sort`
-          }
-        })
-
-        this.$emit('success', response)
-      } catch (error) {
-        this.setError(error)
-        this.$emit('error', error)
-      } finally {
-        Loading.hide()
-      }
-    },
-
-    updateOrder ({ newIndex, oldIndex }) {
-      const deleted = this.sortedList.splice(oldIndex, 1)
-      this.sortedList.splice(newIndex, 0, deleted[0])
-
-      this.updateModel()
-
-      this.useSaveOnSort && this.replace()
-    },
-
-    setSortedValue () {
-      this.sortedList = extend(true, [], this.modelValue)
-    },
-
-    updateModel () {
-      this.$emit('update:modelValue', this.sortedList)
-    }
-  }
-}
-</script>
+<template>
+  <component :is="tag" ref="sortableItems">
+    <slot />
+  </component>
+</template>
+
+<script>
+import { Loading, extend } from 'quasar'
+import Sortable from 'sortablejs'
+import { getAction } from '@bildvitta/store-adapter'
+
+import { NotifyError } from '../../plugins'
+
+export default {
+  name: 'QasSortable',
+
+  props: {
+    entity: {
+      default: '',
+      type: String
+    },
+
+    sortableOptions: {
+      default: () => ({ animation: 500 }),
+      type: Object
+    },
+
+    tag: {
+      default: 'div',
+      type: String
+    },
+
+    url: {
+      default: '',
+      type: String
+    },
+
+    modelValue: {
+      default: () => [],
+      type: Array
+    },
+
+    useSaveOnSort: {
+      type: Boolean,
+      default: true
+    }
+  },
+
+  emits: [
+    'update:modelValue',
+    'sort',
+    'success',
+    'error'
+  ],
+
+  data () {
+    return {
+      sortable: null,
+      sortedList: null
+    }
+  },
+
+  computed: {
+    identifiers () {
+      return this.sortedList.map(({ id }) => id)
+    }
+  },
+
+  watch: {
+    sortableOptions (value) {
+      this.sortable.options = { ...this.sortable.options, ...value }
+    },
+
+    modelValue: {
+      handler (newValues) {
+        this.sortedList = newValues
+      },
+
+      deep: true
+    }
+  },
+
+  created () {
+    this.setSortedValue()
+  },
+
+  async mounted () {
+    this.sortable = new Sortable(this.$refs.sortableItems, {
+      ...this.sortableOptions,
+
+      onUpdate: event => {
+        this.updateOrder(event)
+        this.$emit('sort', event)
+      }
+    })
+  },
+
+  unmounted () {
+    this.sortable.destroy()
+  },
+
+  methods: {
+    setError (error) {
+      const { response } = error
+      const exception = response?.data?.exception || error.message
+
+      NotifyError('Ops! Erro ao salvar ordenação.', exception)
+    },
+
+    // TODO precisa testar este método quando tivermos uma API para teste.
+    async replace () {
+      Loading.show()
+
+      try {
+        const response = await getAction.call(this, {
+          entity: this.entity,
+          key: 'replace',
+          payload: {
+            payload: { order: this.identifiers },
+            url: this.url || `${this.entity}/sort`
+          }
+        })
+
+        this.$emit('success', response)
+      } catch (error) {
+        this.setError(error)
+        this.$emit('error', error)
+      } finally {
+        Loading.hide()
+      }
+    },
+
+    updateOrder ({ newIndex, oldIndex }) {
+      const deleted = this.sortedList.splice(oldIndex, 1)
+      this.sortedList.splice(newIndex, 0, deleted[0])
+
+      this.updateModel()
+
+      this.useSaveOnSort && this.replace()
+    },
+
+    setSortedValue () {
+      this.sortedList = extend(true, [], this.modelValue)
+    },
+
+    updateModel () {
+      this.$emit('update:modelValue', this.sortedList)
+    }
+  }
+}
+</script>

package/src/components/sortable/QasSortable.yml

@@ -1,65 +1,65 @@
-type: component
-
-meta:
-  desc: Componente para reordenar items em uma lista e salvar após isto.
-
-props:
-  entity:
-    desc: Entidade da store que para salvar os items após reordenar a lista.
-    required: true
-    type: String
-
-  sortable-options:
-    desc: Opções do "sortablejs" (https://github.com/SortableJS/Sortable#options).
-    default: { animation: 500 }
-    type: Object
-
-  model-value:
-    desc: Model do componente onde será fornecido a lista, e ele será responsável pela ordenação.
-    default: []
-    type: Array
-    examples: [v-model="fields"]
-    model: true
-
-  tag:
-    desc: Tag do componente pai.
-    default: div
-    type: String
-
-  url:
-    desc: Parâmetro enviado para a action "replace".
-    type: String
-
-  use-save-on-sort:
-    desc: Controla se deve bater a API para salvar após fazer uma ordenação.
-    type: Boolean
-    default: true
-
-slots:
-  default:
-    desc: Slot para adicionar os items que serão reordenados.
-
-events:
-  '@error -> function(value)':
-    desc: Dispara toda vez que acontece algum erro ao salvar a nova ordenação.
-    params:
-      value:
-        desc: fields.
-        type: Object
-
-  '@sort -> function(value)':
-    desc: Dispara toda vez que acontece uma nova ordenação.
-
-  '@success -> function(value)':
-    desc: Dispara toda vez que salva com sucesso a nova ordenação.
-    params:
-      value:
-        desc: fields.
-        type: Object
-
-  '@update:model-value -> function(values)':
-    desc: Dispara quando o model-value altera, após acontecer uma ordenação.
-    params:
-      values:
-        desc: Novo valor do model.
-        type: Array
+type: component
+
+meta:
+  desc: Componente para reordenar items em uma lista e salvar após isto.
+
+props:
+  entity:
+    desc: Entidade da store que para salvar os items após reordenar a lista.
+    required: true
+    type: String
+
+  sortable-options:
+    desc: Opções do "sortablejs" (https://github.com/SortableJS/Sortable#options).
+    default: { animation: 500 }
+    type: Object
+
+  model-value:
+    desc: Model do componente onde será fornecido a lista, e ele será responsável pela ordenação.
+    default: []
+    type: Array
+    examples: [v-model="fields"]
+    model: true
+
+  tag:
+    desc: Tag do componente pai.
+    default: div
+    type: String
+
+  url:
+    desc: Parâmetro enviado para a action "replace".
+    type: String
+
+  use-save-on-sort:
+    desc: Controla se deve bater a API para salvar após fazer uma ordenação.
+    type: Boolean
+    default: true
+
+slots:
+  default:
+    desc: Slot para adicionar os items que serão reordenados.
+
+events:
+  '@error -> function(value)':
+    desc: Dispara toda vez que acontece algum erro ao salvar a nova ordenação.
+    params:
+      value:
+        desc: fields.
+        type: Object
+
+  '@sort -> function(value)':
+    desc: Dispara toda vez que acontece uma nova ordenação.
+
+  '@success -> function(value)':
+    desc: Dispara toda vez que salva com sucesso a nova ordenação.
+    params:
+      value:
+        desc: fields.
+        type: Object
+
+  '@update:model-value -> function(values)':
+    desc: Dispara quando o model-value altera, após acontecer uma ordenação.
+    params:
+      values:
+        desc: Novo valor do model.
+        type: Array

package/src/components/status/QasStatus.test.js

@@ -1,11 +1,11 @@
-import { describe, it, expect } from 'vitest'
-import { mount } from '@vue/test-utils'
-import QasStatus from './QasStatus.vue'
-
-describe('QasStatus', () => {
-  it('should render', () => {
-    const wrapper = mount(QasStatus)
-
-    expect(wrapper.exists()).toBeTruthy()
-  })
-})
+import { describe, it, expect } from 'vitest'
+import { mount } from '@vue/test-utils'
+import QasStatus from './QasStatus.vue'
+
+describe('QasStatus', () => {
+  it('should render', () => {
+    const wrapper = mount(QasStatus)
+
+    expect(wrapper.exists()).toBeTruthy()
+  })
+})

package/src/components/status/QasStatus.vue

@@ -1,29 +1,29 @@
-<template>
-  <div aria-live="polite" class="qas-status" :class="backgroundClass" role="status" />
-</template>
-
-<script setup>
-import { computed } from 'vue'
-
-defineOptions({
-  name: 'QasStatus',
-  inheritAttrs: false
-})
-
-const props = defineProps({
-  color: {
-    type: String,
-    default: 'light-blue-2'
-  }
-})
-
-const backgroundClass = computed(() => `bg-${props.color}`)
-</script>
-
-<style lang="scss">
-.qas-status {
-  border-radius: 100%;
-  height: 16px;
-  width: 16px;
-}
-</style>
+<template>
+  <div aria-live="polite" class="qas-status" :class="backgroundClass" role="status" />
+</template>
+
+<script setup>
+import { computed } from 'vue'
+
+defineOptions({
+  name: 'QasStatus',
+  inheritAttrs: false
+})
+
+const props = defineProps({
+  color: {
+    type: String,
+    default: 'light-blue-2'
+  }
+})
+
+const backgroundClass = computed(() => `bg-${props.color}`)
+</script>
+
+<style lang="scss">
+.qas-status {
+  border-radius: 100%;
+  height: 16px;
+  width: 16px;
+}
+</style>

package/src/components/status/QasStatus.yml

@@ -1,10 +1,10 @@
-type: component
-
-meta:
-  desc: Componente que gera um status circular com a cor do status.
-
-props:
-  color:
-    desc: cor dos status.
-    default: light-blue-2
-    type: String
+type: component
+
+meta:
+  desc: Componente que gera um status circular com a cor do status.
+
+props:
+  color:
+    desc: cor dos status.
+    default: light-blue-2
+    type: String