@tagplus/components 1.2.17 → 2.0.1

package/package.json

@@ -8,7 +8,7 @@
       "email": "bruno@tagplus.com.br"
     }
   ],
-  "version": "1.2.17",
+  "version": "2.0.1",
   "main": "./dist/tp.common.js",
   "directories": {
     "lib": "src/lib"
@@ -19,7 +19,10 @@
     "src"
   ],
   "engines": {
-    "node": ">=10.0"
+    "node": ">=14.0"
+  },
+  "lint-staged": {
+    "*.{js,vue,css}": "yarn lint"
   },
   "jest": {
     "testEnvironment": "node"
@@ -40,43 +43,48 @@
     "install:clear": "yarn install:clean",
     "test": "jest",
     "test:coverage": "jest --collectCoverage",
-    "test:unit": "vue-cli-service test:unit"
+    "test:unit": "vue-cli-service test:unit",
+    "prepare": "husky install"
   },
   "dependencies": {
-    "axios": "^0.27.0",
-    "core-js": "^3.21.1",
+    "@vue/babel-preset-app": "^5.0.8",
+    "axios": "^0.27.2",
+    "core-js": "^3.25.0",
     "element-theme-chalk": "^2.13",
     "element-ui": "2.15.8",
     "js-cookie": "^3.0.1",
-    "vue": "^2.6.14",
+    "vue": "^2.7.10",
     "vue-axios": "^2.1.5",
-    "vue-i18n": "^8.14.0"
+    "vue-i18n": "^8.15.3"
   },
   "devDependencies": {
-    "@babel/core": "^7.18.5",
-    "@babel/eslint-parser": "^7.17.0",
-    "@vue/cli-plugin-babel": "^5.0.3",
-    "@vue/cli-plugin-unit-jest": "^5.0.3",
-    "@vue/cli-service": "^5.0.3",
+    "@babel/core": "^7.18.13",
+    "@babel/eslint-parser": "^7.18.9",
+    "@vue/cli-plugin-babel": "^5.0.8",
+    "@vue/cli-plugin-unit-jest": "^5.0.8",
+    "@vue/cli-service": "^5.0.8",
     "@vue/test-utils": "^1.0.0-beta.31",
     "@vuese/cli": "^2.10.0",
     "babel-jest": "^24.9.0",
-    "babel-plugin-module-resolver": "^3.2.0",
+    "babel-plugin-module-resolver": "^4.1.0",
     "babel-plugin-require-context-hook": "^1.0.0",
-    "eslint": "^8.9.0",
+    "eslint": "^8.23.0",
     "eslint-config-prettier": "^8.4.0",
     "eslint-config-standard": "^17.0.0",
     "eslint-import-resolver-babel-module": "^5.3.1",
     "eslint-plugin-import": "^2.25.2",
-    "eslint-plugin-n": "^15.0.0",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-promise": "^6.0.0",
-    "eslint-plugin-vue": "^9.1.1",
-    "node-sass": "^4.14.1",
-    "nodemon": "^2.0.2",
-    "prettier": "^2.5.1",
-    "sass-loader": "^7.1.0",
-    "vue-template-compiler": "^2.6.10",
-    "webpack": "4.46.0"
+    "eslint-plugin-n": "^15.2.5",
+    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-promise": "^6.0.1",
+    "eslint-plugin-vue": "^9.4.0",
+    "husky": "^8.0.1",
+    "jest": "^27.1.0",
+    "lint-staged": "^13.0.2",
+    "node-sass": "^7.0.1",
+    "nodemon": "^2.0.19",
+    "prettier": "^2.7.1",
+    "sass-loader": "^13.0.2",
+    "vue-template-compiler": "^2.7.10",
+    "webpack": "^5.74.0"
   }
 }

package/src/components/Autosuggest/Autosuggest.vue

@@ -298,6 +298,7 @@ export default {
      */
     formatedValue () {
       let newVal = ''
+
       if (typeof this.value === 'boolean') {
         newVal = ''
       } else if (Array.isArray(this.value)) {
@@ -323,39 +324,47 @@ export default {
       const hasExistingOption = this.options
         .filter(option => !option.created)
         .some(option => option.currentLabel === this.query)
+
       return this.filterable && this.allowCreate && !hasExistingOption
     },
     // Monta a lista com ou sem "Cadastrar Novo Item"
     suggestionsList () {
       if (this.loading) return []
+
       // transformando em Array
       const list =
         typeof this.suggestions === 'object'
           ? Object.values(this.suggestions)
           : this.suggestions
+
       if (this.allowCreate) {
         const createdSuggestion = { created: true }
+
         createdSuggestion[this.valueKey] = this.query !== '' ? this.query : null
         createdSuggestion[this.labelKey] = ''
         list.push(createdSuggestion)
       }
+
       return list
     },
 
     emptyText () {
       if (this.loading) {
         return this.loadingText || this.t('el.select.loading')
-      } else {
-        if (this.remote && this.query === '' && this.options.length === 0) {
-          return this.noDataText || this.$tpI18n.t('autosuggests.sem_dados')
-        }
-        if (this.filterable && this.query && this.options.length > 0 && this.filteredOptionsCount === 0) {
-          return this.noMatchText || this.t('el.select.noMatch')
-        }
-        if (this.options.length === 0) {
-          return this.noDataText || this.$tpI18n.t('autosuggests.sem_dados')
-        }
       }
+
+      if (this.remote && this.query === '' && this.options.length === 0) {
+        return this.noDataText || this.$tpI18n.t('autosuggests.sem_dados')
+      }
+
+      if (this.filterable && this.query && this.options.length > 0 && this.filteredOptionsCount === 0) {
+        return this.noMatchText || this.t('el.select.noMatch')
+      }
+
+      if (this.options.length === 0) {
+        return this.noDataText || this.$tpI18n.t('autosuggests.sem_dados')
+      }
+
       return null
     }
   },
@@ -372,6 +381,7 @@ export default {
           this.selectedLabel = e.target.value
         }
       }
+
       this.onInputChange(e)
     })
   },
@@ -393,6 +403,7 @@ export default {
     this.$nextTick(() => {
       // Componente tooltip -> autosuggest -> input
       const componenteInputInterno = this.$children[1].$refs.input
+
       // Mostra o tooltip só quando
       this.createHandler(componenteInputInterno, 'mouseenter', () => {
         if (this.selectedLabel) {
@@ -425,7 +436,7 @@ export default {
       if (el) {
         el.addEventListener(
           ev,
-          function () {
+          () => {
             func()
           },
           false
@@ -459,6 +470,7 @@ export default {
 
       // Eventos ao limpar
       this.$emit('input', null)
+
       if (typeof this.value === 'undefined') {
         this.$emit('change', null, null)
       } else {
@@ -488,6 +500,7 @@ export default {
           if (this.value[this.labelKey]) {
             initialLabel = this.value[this.labelKey]
           }
+
           value = this.value[this.valueKey]
         }
       } else {
@@ -503,26 +516,32 @@ export default {
       const isUndefined =
         Object.prototype.toString.call(value).toLowerCase() ===
         '[object undefined]'
+
       for (let i = 0; i <= this.cachedOptions.length - 1; i++) {
         const cachedOption = this.cachedOptions[i]
         const isEqual = isObject
           ? getValueByPath(cachedOption.value, this.valueKey) ===
             getValueByPath(value, this.valueKey)
           : cachedOption.value === value
+
         if (isEqual) {
           option = cachedOption
           break
         }
       }
+
       if (option) return option
+
       const label = !isObject && !isNull && !isUndefined ? value : ''
       const newOption = {
         value,
         currentLabel: initialLabel || label
       }
+
       if (this.multiple) {
         newOption.hitState = false
       }
+
       return newOption
     },
     checkDefaultFirstOption () {
@@ -531,6 +550,7 @@ export default {
 
         for (let i = 0; i !== this.options.length; ++i) {
           const option = this.options[i]
+
           if (this.query) {
             // highlight first options that passes the filter
             if (!option.disabled && !option.groupDisabled && option.visible) {
@@ -558,10 +578,12 @@ export default {
         } else {
           this.visible = !this.visible
         }
+
         if (this.doRequest) {
           this.handleQueryChange(this.query)
           this.doRequest = false
         }
+
         (this.$refs.input || this.$refs.reference).focus()
       }
     },
@@ -577,27 +599,33 @@ export default {
      */
     handleQueryChange (val) {
       const _this6 = this
+
       // Correção aqui para forçar primeeira request com createOnLoad = false
       if (
         (!this.doRequest && this.previousQuery === val) ||
         this.isOnComposition
       ) { return }
+
       if (
         this.previousQuery === null &&
         (typeof this.filterMethod === 'function' ||
           typeof this.remoteMethod === 'function')
       ) {
         this.previousQuery = val
+
         return
       }
+
       this.previousQuery = val
-      this.$nextTick(function () {
+      this.$nextTick(() => {
         if (_this6.visible) _this6.broadcast('ElSelectDropdown', 'updatePopper')
       })
       this.hoverIndex = -1
+
       if (this.multiple && this.filterable) {
-        this.$nextTick(function () {
+        this.$nextTick(() => {
           const length = _this6.$refs.input.value.length * 15 + 20
+
           _this6.inputLength = _this6.collapseTags
             ? Math.min(50, length)
             : length
@@ -605,6 +633,7 @@ export default {
           _this6.resetInputHeight()
         })
       }
+
       if (this.remote && typeof this.remoteMethod === 'function') {
         this.hoverIndex = -1
         this.remoteMethod(val)
@@ -616,6 +645,7 @@ export default {
         this.broadcast('ElOption', 'queryChange', val)
         this.broadcast('ElOptionGroup', 'queryChange')
       }
+
       if (
         this.defaultFirstOption &&
         (this.filterable || this.remote) &&
@@ -633,6 +663,7 @@ export default {
           const elInput = document.querySelector(
             '.el-select[data-is-search="true"]:hover input[readonly]'
           )
+
           if (elInput) {
             elInput.readOnly = false
             elInput.blur()
@@ -720,7 +751,6 @@ input.el-input__inner {
       padding-left: 20px;
 
       &::before {
-        content: "";
         position: absolute;
         display: inline-block;
         width: 4px;

package/src/components/Dialog/Dialog.vue

@@ -104,7 +104,10 @@ export default {
       default: true
     },
 
-    width: String,
+    width: {
+      type: String,
+      default: 'auto'
+    },
 
     fullscreen: Boolean,
 
@@ -117,7 +120,12 @@ export default {
       type: String,
       default: '15vh'
     },
-    beforeClose: Function,
+
+    beforeClose: {
+      type: Function,
+      default: () => {}
+    },
+
     center: {
       type: Boolean,
       default: false
@@ -136,12 +144,15 @@ export default {
   computed: {
     style () {
       const style = {}
+
       if (!this.fullscreen) {
         style.marginTop = this.top
+
         if (this.width) {
           style.width = this.width
         }
       }
+
       return style
     }
   },
@@ -160,12 +171,15 @@ export default {
             this.$nextTick(() => {
               this.$refs.dialog.scrollTop = 0
             })
+
             if (this.appendToBody) {
               document.body.appendChild(this.$el)
             }
           } else {
             this.$el.removeEventListener('scroll', this.updatePopper)
+
             if (!this.closed) this.$emit('close')
+
             if (this.destroyOnClose) {
               this.$nextTick(() => {
                 this.key++
@@ -181,6 +195,7 @@ export default {
     if (this.visible) {
       this.rendered = true
       this.open()
+
       if (this.appendToBody) {
         document.body.appendChild(this.$el)
       }
@@ -204,6 +219,7 @@ export default {
     },
     handleWrapperClick () {
       if (!this.closeOnClickModal) return
+
       this.handleClose()
     },
     handleClose () {

package/src/components/Inline/Inline.vue

@@ -97,6 +97,7 @@ export default {
         this.hideInput = true
       } else if (!this.readonly) {
         this.hideInput = status
+
         if (!this.hideInput) {
           this.$nextTick(function () {
             this.$refs.inlineInput.focus()

package/src/components/InputNumber/InputNumber.vue

@@ -92,9 +92,15 @@ export default {
       type: Number,
       default: -Infinity
     },
-    value: {},
+    value: {
+      type: [Number, String],
+      default: null
+    },
     disabled: Boolean,
-    size: String,
+    size: {
+      type: [String, Boolean],
+      default: false
+    },
     controls: {
       type: Boolean,
       default: true
@@ -103,11 +109,21 @@ export default {
       type: String,
       default: ''
     },
-    name: String,
-    label: String,
-    placeholder: String,
+    name: {
+      type: [String, Boolean],
+      default: false
+    },
+    label: {
+      type: [String],
+      default: ''
+    },
+    placeholder: {
+      type: [String, Boolean],
+      default: false
+    },
     precision: {
       type: Number,
+      default: 2,
       validator (val) {
         return val >= 0 && val === parseInt(val, 10)
       }
@@ -148,14 +164,16 @@ export default {
     numPrecision () {
       const { value, step, getPrecision, precision } = this
       const stepPrecision = getPrecision(step)
+
       if (precision !== undefined) {
         if (stepPrecision > precision) {
           console.warn('[Element Warn][InputNumber]precision should not be less than the decimal places of step')
         }
+
         return precision
-      } else {
-        return Math.max(getPrecision(value), stepPrecision)
       }
+
+      return Math.max(getPrecision(value), stepPrecision)
     },
     controlsAtRight () {
       return this.controls && this.controlsPosition === 'right'
@@ -167,7 +185,7 @@ export default {
       return this.size || this._elFormItemSize || (this.$ELEMENT || {}).size
     },
     inputNumberDisabled () {
-      return this.disabled || !!(this.elForm || {}).disabled
+      return this.disabled || Boolean((this.elForm || {}).disabled)
     },
     /**
      * Sobrescrito do element
@@ -178,10 +196,12 @@ export default {
         if (!this.stringDefaultsZero && this.userInput === '') {
           this.currentValue = ''
         }
+
         return this.userInput
       }
 
       let currentValue
+
       if (this.value === '' && !this.stringDefaultsZero) {
         currentValue = ''
       } else {
@@ -192,6 +212,7 @@ export default {
         if (this.stepStrictly) {
           const stepPrecision = this.getPrecision(this.step)
           const precisionFactor = Math.pow(10, stepPrecision)
+
           currentValue =
             (Math.round(currentValue / this.step) *
               precisionFactor *
@@ -205,8 +226,9 @@ export default {
       }
 
       if (this.usarVirgula) {
-        currentValue = (currentValue + '').replace('.', ',')
+        currentValue = (`${currentValue }`).replace('.', ',')
       }
+
       return currentValue
     }
   },
@@ -219,6 +241,7 @@ export default {
       immediate: true,
       handler (value) {
         let newVal
+
         if (value === undefined) {
           newVal = value
         } else if (!this.stringDefaultsZero && value === '') {
@@ -235,6 +258,7 @@ export default {
           if (this.stepStrictly) {
             const stepPrecision = this.getPrecision(this.step)
             const precisionFactor = Math.pow(10, stepPrecision)
+
             newVal = Math.round(newVal / this.step) * precisionFactor * this.step / precisionFactor
           }
 
@@ -242,8 +266,11 @@ export default {
             newVal = this.toPrecision(newVal, this.precision)
           }
         }
+
         if (newVal >= this.max) newVal = this.max
+
         if (newVal <= this.min) newVal = this.min
+
         this.currentValue = newVal
         this.userInput = null
         this.$emit('input', newVal)
@@ -253,6 +280,7 @@ export default {
 
   mounted () {
     const innerInput = this.$refs.input.$refs.input
+
     innerInput.setAttribute('role', 'spinbutton')
     innerInput.setAttribute('aria-valuemax', this.max)
     innerInput.setAttribute('aria-valuemin', this.min)
@@ -262,29 +290,36 @@ export default {
 
   updated () {
     if (!this.$refs || !this.$refs.input) return
+
     const innerInput = this.$refs.input.$refs.input
+
     innerInput.setAttribute('aria-valuenow', this.currentValue)
   },
 
   methods: {
     toPrecision (num, precision) {
       if (precision === undefined) precision = this.numPrecision
+
       return parseFloat(Math.round(num * Math.pow(10, precision)) / Math.pow(10, precision))
     },
     getPrecision (value) {
       if (value === undefined) return 0
+
       const valueString = value.toString()
       const dotPosition = valueString.indexOf('.')
       let precision = 0
+
       if (dotPosition !== -1) {
         precision = valueString.length - dotPosition - 1
       }
+
       return precision
     },
     _increase (val, step) {
       if (typeof val !== 'number' && val !== undefined) return this.currentValue
 
       const precisionFactor = Math.pow(10, this.numPrecision)
+
       // Solve the accuracy problem of JS decimal calculation by converting the value to integer.
       return this.toPrecision((precisionFactor * val + precisionFactor * step) / precisionFactor)
     },
@@ -297,14 +332,18 @@ export default {
     },
     increase () {
       if (this.inputNumberDisabled || this.maxDisabled) return
+
       const value = this.value || 0
       const newVal = this._increase(value, this.step)
+
       this.setCurrentValue(newVal)
     },
     decrease () {
       if (this.inputNumberDisabled || this.minDisabled) return
+
       const value = this.value || 0
       const newVal = this._decrease(value, this.step)
+
       this.setCurrentValue(newVal)
     },
     handleBlur (event) {
@@ -320,6 +359,7 @@ export default {
     handleInput (value) {
       this.userInput = value
       let newVal
+
       if (value === '' && this.stringDefaultsZero) {
         newVal = Number(value.replace(',', '.'))
       } else {
@@ -334,6 +374,7 @@ export default {
      */
     handleInputChange (value) {
       let newVal
+
       if (value === '') {
         // Por padrão converte '' para 0
         if (this.stringDefaultsZero) {
@@ -348,6 +389,7 @@ export default {
       if (!isNaN(newVal) || value === '') {
         this.setCurrentValue(newVal)
       }
+
       this.userInput = null
     },
 
@@ -356,12 +398,17 @@ export default {
      */
     setCurrentValue (newVal) {
       const oldVal = this.currentValue
+
       if (typeof newVal === 'number' && this.precision !== undefined) {
         newVal = this.toPrecision(newVal, this.precision)
       }
+
       if (newVal >= this.max) newVal = this.max
+
       if (newVal <= this.min) newVal = this.min
+
       if (oldVal === newVal && newVal === this.value) return
+
       this.userInput = null
       this.$emit('input', newVal)
       this.$emit('change', newVal, oldVal)