renusify 1.4.0 → 1.4.1

package/components/form/check-input.vue

@@ -20,8 +20,9 @@
              :rounded="$attrs.tile===undefined||$attrs.tile===false"
              :loading="loading" @click.prevent="check()" class="elevation-none mx-1">
         {{ $t('check', 'renusify') }}
-        <r-icon class="color-success-text" v-if="pass!==null && pass!==false" v-html="$r.icons.check" exact width="20" height="20"></r-icon>
-        <r-icon class="color-error-text" v-if=" pass===false" v-html="$r.icons.close" width="20" height="20"></r-icon>
+        <r-icon v-if="pass!==null && pass!==false" class="color-success-text" exact height="20" width="20"
+                v-html="$r.icons.check"></r-icon>
+        <r-icon v-if=" pass===false" class="color-error-text" height="20" width="20" v-html="$r.icons.close"></r-icon>
       </r-btn>
     </div>
   </r-input>

package/components/form/group-input.vue

@@ -9,7 +9,8 @@
           <slot :item="item" :index="i" :disableDel="disDel">
             <div v-if="template" class="d-flex flex-wrap pt-5 v-start">
               <template v-for="(v,k) in item" :key="i+'-'+k">
-                <component v-if="template[k]&&template[k]['type']" :is="template[k]['type']" v-model="item[k]" :label="t(k)"
+                <component :is="template[k]['type']" v-if="template[k]&&template[k]['type']" v-model="item[k]"
+                           :label="t(k)"
                            class="flex-grow-0 me-1" v-bind="template[k]['props']"></component>
               </template>
             </div>

package/components/form/input.vue

@@ -3,7 +3,7 @@
       :class="{
         [`${$r.prefix}input-container`]:true,
         [c_color]:c_color&&!isDisabled,
-        'color-error-text':hasError||validations.length>0,
+        'color-error-text':hasError&&genMessages.length>0,
         'hide-detail':c_hide,
         'input-focused':active,
         'input-disabled':isDisabled,

package/components/form/json/JsonView.vue

@@ -45,7 +45,7 @@ export default {
     disableAdd: Boolean,
     disableDel: Boolean,
     tile: Boolean,
-    translate:Boolean
+    translate: Boolean
   },
   emits: ['update:modelValue'],
   data() {
@@ -59,8 +59,8 @@ export default {
     }
   },
   methods: {
-    t(key){
-      if(this.translate){
+    t(key) {
+      if (this.translate) {
         return this.$t(key)
       }
       return key

package/components/form/json/index.vue

@@ -38,17 +38,17 @@
                             :translate="translate"
                             @update:model-value="info.value=null"
                             firstSelect></r-select-input>
-          </div>
-          <r-text-input v-if="info.type==='text'"
-                        :tile="tile"
-                        :label="valueLabel||$t('value','renusify')"
-                        v-model="info.value"></r-text-input>
+        </div>
+        <r-text-input v-if="info.type==='text'"
+                      :tile="tile"
+                      :label="valueLabel||$t('value','renusify')"
+                      v-model="info.value"></r-text-input>
         <r-number-input v-else-if="info.type==='number'"
                         :tile="tile"
-                        :label="valueLabel||$t('value','renusify')" v-model="info.value"></r-number-input>
+                        v-model="info.value" :label="valueLabel||$t('value','renusify')"></r-number-input>
         <r-switch-input v-else-if="info.type==='boolean'"
                         :tile="tile"
-                        :label="valueLabel||$t('value','renusify')" v-model="info.value"></r-switch-input>
+                        v-model="info.value" :label="valueLabel||$t('value','renusify')"></r-switch-input>
         <r-btn @click.prevent="add" class="ms-1 color-success" rounded>{{ $t('add', 'renusify') }}</r-btn>
       </div>
     </div>
@@ -163,8 +163,8 @@ export default {
         d.push(Object.assign({}, {}, this.template))
         this.$emit('update:modelValue', d)
       } else {
-        if(this.valueType){
-          this.info.type=this.valueType
+        if (this.valueType) {
+          this.info.type = this.valueType
         }
         this.show = true
       }

package/components/form/rating.vue

@@ -45,12 +45,13 @@ export default {
 </script>
 <style lang="scss">
 @import "../../style/include";
+
 $btn-sizes: (
-        'x-small': 20,
-        'small': 25,
-        'default': 30,
-        'large': 35,
-        'x-large': 40
+    'x-small': 20,
+    'small': 25,
+    'default': 30,
+    'large': 35,
+    'x-large': 40
 ) !default;
 .#{$prefix}rating {
   max-width: 100%;
@@ -60,11 +61,12 @@ $btn-sizes: (
 
   @each $name, $size in $btn-sizes {
     &.size-#{$name} {
-      .#{$prefix}btn{
+      .#{$prefix}btn {
         height: #{$size}px;
         width: #{$size}px
       }
-      .#{$prefix}icon{
+
+      .#{$prefix}icon {
         height: #{$size - 4px};
         width: #{$size - 4px}
       }

package/components/img/index.vue

@@ -14,11 +14,11 @@
         }"
     >{{ alt }}
     </div>
-    <img v-if="load &&!isSvg" ref="img" :src="link" :alt="alt" draggable="false" :width="size.width>0?size.width:'auto'"
-         :height="size.height>0?size.height:'auto'"
-         :style="{'height':size.height>0?undefined:'auto',
+    <img v-if="load &&!isSvg" ref="img" :alt="alt" :height="size.height>0?size.height:'auto'" :src="link" :style="{'height':size.height>0?undefined:'auto',
          'width':size.width>0?undefined:'auto'
-         }"/>
+         }"
+         :width="size.width>0?size.width:'auto'"
+         draggable="false"/>
     <svg-img v-else-if="load &&isSvg&&link" :link="link" :size="size">
     </svg-img>
   </div>
@@ -119,21 +119,21 @@ export default {
       if (this.height) {
         res["height"] = this.height
       }
-      let wPH=this.wPH
-      if(!wPH){
-        const ls=this.src.split('/')
-        if(ls.length>0){
-          const p=ls[ls.length-1].split('_')
-          if(p.length===3){
-            const p0=parseInt(p[0])
-            const p1=parseInt(p[1])
-            if(p0&&p1){
-              wPH=p0/p1
+      let wPH = this.wPH
+      if (!wPH) {
+        const ls = this.src.split('/')
+        if (ls.length > 0) {
+          const p = ls[ls.length - 1].split('_')
+          if (p.length === 3) {
+            const p0 = parseInt(p[0])
+            const p1 = parseInt(p[1])
+            if (p0 && p1) {
+              wPH = p0 / p1
             }
           }
         }
       }
-      if(wPH) {
+      if (wPH) {
         if (res['width'] !== 0 && res['height'] === 0) {
           res['height'] = res['width'] / wPH
         }
@@ -141,7 +141,7 @@ export default {
           res['width'] = res['height'] * wPH
         }
       }
-      if (res['width'] !== 0||res['height']!== 0) {
+      if (res['width'] !== 0 || res['height'] !== 0) {
         return this.size = res
       }
 
@@ -152,7 +152,7 @@ export default {
         let w = parseFloat((parseFloat(cs.getPropertyValue('width')) - paddingX - borderX).toFixed(2));
         return this.size = {
           width: w,
-          height: wPH?w / wPH:0
+          height: wPH ? w / wPH : 0
         }
       }
       return false
@@ -160,7 +160,7 @@ export default {
     },
     activate() {
       this.getSize()
-      if (this.size.width !== 0||this.size.height) {
+      if (this.size.width !== 0 || this.size.height) {
         this.load = true
       } else {
         clearTimeout(this.time_id)

package/directive/animate/style.scss

@@ -1,15 +1,18 @@
 @import '../../style/include';
 
-.r-directive-animate{
-  transition-timing-function: map_get($transition,'swing');
-   transition-property: opacity,transform;
-  &.fade{
+.r-directive-animate {
+  transition-timing-function: map_get($transition, 'swing');
+  transition-property: opacity, transform;
+
+  &.fade {
     opacity: 0;
-    &.animate{
+
+    &.animate {
       opacity: 1;
     }
   }
-  &.scaleIn{
+
+  &.scaleIn {
     transform: scale(.5);
     &.animate{
      transform:translateZ(0) scale(1);

package/directive/sortable/index.js

@@ -1,5 +1,5 @@
 import './style.scss'
-import {keys, ifHas, cleanArray} from '../../tools/helper'
+import {cleanArray, ifHas, keys} from '../../tools/helper'
 
 let scopeObj;
 

package/directive/sortable/style.scss

@@ -2,15 +2,18 @@
 
 .r-directive-sortable {
   position: relative;
-  .dragable{
-    .grab{
+
+  .dragable {
+    .grab {
       cursor: grab;
     }
-    &.grab{
+
+    &.grab {
       cursor: grab;
     }
   }
-  .sortable-holder{
+
+  .sortable-holder {
     background-color: rgba(20, 200, 255, 0.5);
   }
   .on-drag {

package/directive/title/style.scss

@@ -9,7 +9,7 @@
   position: fixed;
   border-radius: map-get($borders, 'sm');
   font-size: 14px;
-  font-family: fontOne;
+  font-family: inherit;
   transform: translateX(-50%);
   z-index: 50;
   opacity: 0;

package/index.js

@@ -107,14 +107,14 @@ export default {
         // renusify helper
         app.config.globalProperties.$helper = helper
         // renusify translate
-        app.config.globalProperties.$translate = new Translate(app.config.globalProperties.$r,app.config.globalProperties.$storage)
-        app.config.globalProperties.$dateTime = new DateTime(app.config.globalProperties.$r,app.config.globalProperties.$r.langs)
+        app.config.globalProperties.$translate = new Translate(app.config.globalProperties.$r, app.config.globalProperties.$storage)
+        app.config.globalProperties.$dateTime = new DateTime(app.config.globalProperties.$r, app.config.globalProperties.$r.langs)
         app.config.globalProperties.$t = (key, package_name = null, lang = null) => app.config.globalProperties.$translate.get(key, package_name, lang)
         app.config.globalProperties.$d = (value, key = 'long', local = null) => app.config.globalProperties.$dateTime.formatLocal(value, key, local)
-        const c=new Currency(app.config.globalProperties.$r)
+        const c = new Currency(app.config.globalProperties.$r)
         app.config.globalProperties.$n = (value) => c.formatLocal(value)
         // renusify validation
-        const v=new valid(app.config.globalProperties.$t)
+        const v = new valid(app.config.globalProperties.$t)
         app.config.globalProperties.$v = (names) => v.checkType(names)
 
         // install components

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "renusify",
-  "version": "1.4.0",
+  "version": "1.4.1",
   "description": "Vue3 Framework",
   "keywords": [
     "vuejs",

package/plugins/trans/Currency.js

@@ -1,13 +1,14 @@
 export default class Currency {
-  constructor($r) {
-    this.$r=$r
-  }
-  formatLocal (value) {
-    try {
-          return new Intl.NumberFormat(this.$r.lang).format(value);
-    }catch (e) {
-      console.error(e)
-      return value
+    constructor($r) {
+        this.$r = $r
+    }
+
+    formatLocal(value) {
+        try {
+            return new Intl.NumberFormat(this.$r.lang).format(value);
+        } catch (e) {
+            console.error(e)
+            return value
+        }
     }
-  }
 }

package/plugins/trans/DateTime.js

@@ -1,6 +1,6 @@
 export default class DateTime {
-    constructor($r,langs) {
-        this.$r=$r
+    constructor($r, langs) {
+        this.$r = $r
         this.format = {
             narrow: {
                 weekday: 'narrow'

package/plugins/trans/Translate.js

@@ -1,9 +1,9 @@
 import Axios from 'axios';
 
 export default class Translate {
-  constructor($r,$storage) {
-    this.$r=$r
-    this.$storage=$storage
+  constructor($r, $storage) {
+    this.$r = $r
+    this.$storage = $storage
     this._count = 0;
     this._failed_messages = {};
     this._messages = {};
@@ -57,7 +57,7 @@ export default class Translate {
       key = key[0]
       if (!variable) {
         console.error(
-          'object key must have variables. key:' + key + ' variable:' + variable
+            'object key must have variables. key:' + key + ' variable:' + variable
         )
         this._failed_messages[key] = true
         return key
@@ -66,7 +66,7 @@ export default class Translate {
 
     if (package_name && typeof package_name !== 'string') {
       console.error(
-        'package name must be string. key:' + key + ' package_name:' + package_name
+          'package name must be string. key:' + key + ' package_name:' + package_name
       )
       this._failed_messages[key] = true
       return key
@@ -138,24 +138,24 @@ export default class Translate {
       locale = this.$storage.get("lang");
     }
     Axios.get(`/translate/${pack}/${locale}`).then(
-      res => {
-        if (res.data.length !== 0) {
-          const lang = {};
-          const lng = res.data.length
-          for (let i = 0; i < lng; i++) {
-            lang[res.data[i].key] = res.data[i][locale];
+        res => {
+          if (res.data.length !== 0) {
+            const lang = {};
+            const lng = res.data.length
+            for (let i = 0; i < lng; i++) {
+              lang[res.data[i].key] = res.data[i][locale];
+            }
+            this.local = locale;
+            this.setMessages(lang);
+          } else {
+            this.local = locale;
+            this.setMessages({});
           }
-          this.local = locale;
-          this.setMessages(lang);
-        } else {
-          this.local = locale;
-          this.setMessages({});
+          this.$r.store['langs_loaded'][pack] = true;
+        },
+        () => {
+          this.$r.store['langs_loaded'][pack] = true;
         }
-        this.$r.store['langs_loaded'][pack] = true;
-      },
-      () => {
-        this.$r.store['langs_loaded'][pack] = true;
-      }
     );
   }
 }

package/plugins/validation/Validate.js

@@ -1,22 +1,23 @@
 export default class Validate {
-  constructor($t) {
-    this.$t=$t
-  }
-  required() {
-    let msg = this.$t('required_error','renusify');
-    return (v) => !!(v !== undefined && v !== null && v !== '') || msg
-  }
+    constructor($t) {
+        this.$t = $t
+    }
 
-  requiredArray() {
-    return (v) => (v !== undefined && v !== null && v.length > 0) || this.$t('required_error','renusify');
-  }
+    required() {
+        let msg = this.$t('required_error', 'renusify');
+        return (v) => !!(v !== undefined && v !== null && v !== '') || msg
+    }
+
+    requiredArray() {
+        return (v) => (v !== undefined && v !== null && v.length > 0) || this.$t('required_error', 'renusify');
+    }
 
-  email() {
-    return (v) => (v && v.length > 0 ? /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) : true) || this.$t('validate_email','renusify');
+    email() {
+        return (v) => (v && v.length > 0 ? /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) : true) || this.$t('validate_email', 'renusify');
   }
 
   url() {
-    return (v) => (v && v.length > 0 ? /^((https?|ftp|smtp):\/\/)?(www.)?[a-z0-9]+\.[a-z]+(\/[a-zA-Z0-9#]+\/?)*$/.test(v) : true) || this.$t('validate_url','renusify');
+      return (v) => (v && v.length > 0 ? /^((https?|ftp|smtp):\/\/)?(www.)?[a-z0-9]+\.[a-z]+(\/[a-zA-Z0-9#]+\/?)*$/.test(v) : true) || this.$t('validate_url', 'renusify');
   }
 
   match(val) {
@@ -24,49 +25,49 @@ export default class Validate {
       if (v == val) {
         return true
       } else {
-        return this.$t(['validate_match', [val]],'renusify');
+          return this.$t(['validate_match', [val]], 'renusify');
       }
     }
   }
 
   phone() {
-    return (v) => (v && v.length > 0 ? /^[+]?[(]?[0-9]{3}[)]?[-\s.]?[0-9]{3}[-\s.]?[0-9]{4}$/.test(v) : true) || this.$t('validate_phone','renusify');
+      return (v) => (v && v.length > 0 ? /^[+]?[(]?[0-9]{3}[)]?[-\s.]?[0-9]{3}[-\s.]?[0-9]{4}$/.test(v) : true) || this.$t('validate_phone', 'renusify');
   }
 
   number() {
-    return (v) => (v && v.length > 0 ? /^([0-9.])*$/.test(v) : true) || this.$t('numeric_error','renusify');
+      return (v) => (v && v.length > 0 ? /^([0-9.])*$/.test(v) : true) || this.$t('numeric_error', 'renusify');
   }
 
   english() {
-    return (v) => (v && v.length > 0 ? /^([0-9a-zA-Z])*$/.test(v) : true) || this.$t('english_error','renusify');
+      return (v) => (v && v.length > 0 ? /^([0-9a-zA-Z])*$/.test(v) : true) || this.$t('english_error', 'renusify');
   }
 
   min_len(num) {
-    return v => (v && v.length > 0 ? v.length >= parseInt(num)?true: this.$t(['min_len_error', [num,v.length]],'renusify') : true)
+      return v => (v && v.length > 0 ? v.length >= parseInt(num) ? true : this.$t(['min_len_error', [num, v.length]], 'renusify') : true)
   }
 
   max_len(num) {
-    return v => (v && v.length > 0 ? v.length <= parseInt(num)?true: this.$t(['max_len_error', [num,v.length]],'renusify') : true)
+      return v => (v && v.length > 0 ? v.length <= parseInt(num) ? true : this.$t(['max_len_error', [num, v.length]], 'renusify') : true)
   }
 
   len(num) {
-    return v => (v && v.length > 0 ? v.length === parseInt(num)?true: this.$t(['len_error', [num,v.length]],'renusify') : true) || msg
+      return v => (v && v.length > 0 ? v.length === parseInt(num) ? true : this.$t(['len_error', [num, v.length]], 'renusify') : true) || msg
   }
 
   min(num) {
-    return v => (v ? parseFloat(v) >= parseFloat(num)?true: this.$t(['min_error', [num,parseFloat(v)]],'renusify') : true)
+      return v => (v ? parseFloat(v) >= parseFloat(num) ? true : this.$t(['min_error', [num, parseFloat(v)]], 'renusify') : true)
   }
 
   max(num) {
-    return v => (v ? parseFloat(v) <= parseFloat(num)?true: this.$t(['max_error', [num,parseFloat(v)]],'renusify') : true)
+      return v => (v ? parseFloat(v) <= parseFloat(num) ? true : this.$t(['max_error', [num, parseFloat(v)]], 'renusify') : true)
   }
 
   eq(num) {
-    return v => (v ? parseFloat(v) === parseFloat(num) : true) || this.$t(['validate_eq', [num]],'renusify');
+      return v => (v ? parseFloat(v) === parseFloat(num) : true) || this.$t(['validate_eq', [num]], 'renusify');
   }
 
   notDefined(name) {
-    return v => this.$t(['validate_notDefined', [name]],'renusify');
+      return v => this.$t(['validate_notDefined', [name]], 'renusify');
   }
 
   checkType(names) {

package/tools/helper.js

@@ -35,9 +35,9 @@ export function copy(text, msg = null) {
     }
 
     navigator.clipboard.writeText(text).then(function () {
-        Toast.show(msg ||'copy_text_to_clipboard', {type: 'success'});
+        Toast.show(msg || 'text copied.', {type: 'success'});
     }, function () {
-        Toast.show(msg ||'text_not_copied', {type: 'error'});
+        Toast.show('text not copied.', {type: 'error'});
     })
 }