@burh/nuxt-core 1.0.20 → 1.0.21

package/components/argon-core/BaseProgress.vue

@@ -1,121 +1,121 @@
-<template>
-  <div class="wrapper">
-    <div :class="`progress-${type}`" v-if="showLabel">
-      <div class="progress-label">
-        <slot name="label">
-          <span>{{label}}</span>
-        </slot>
-      </div>
-      <div class="progress-percentage">
-        <slot>
-          <span>{{value}}%</span>
-        </slot>
-      </div>
-    </div>
-    <div class="progress"
-         :class="[{[`progress-${size}`]: size}, progressClasses]"
-         :style="`height: ${height}px;`">
-      <div class="progress-bar"
-           :class="computedClasses"
-           role="progressbar"
-           :aria-valuenow="value"
-           aria-valuemin="0"
-           aria-valuemax="100"
-           :style="`width: ${value}%;`">
-      </div>
-      <!-- <span v-if="star" :style="`left:${star}%;`" class="star-progress bg-secondary"><font-awesome-icon :icon="['fas', 'star']"/></span> -->
-    </div>
-  </div>
-</template>
-<script>
-  export default {
-    name: "base-progress",
-    props: {
-      star: {
-        type: Boolean,
-        default: false
-      },
-      striped: {
-        type: Boolean,
-        description: "Whether progress is striped"
-      },
-      animated: {
-        type: Boolean,
-        description:
-          "Whether progress is animated (works only with `striped` prop together)"
-      },
-      label: {
-        type: String,
-        description: "Progress label (shown on the left above progress)"
-      },
-      height: {
-        type: Number,
-        default: 3,
-        description: "Progress line height"
-      },
-      type: {
-        type: String,
-        default: "default",
-        description: "Progress type (e.g danger, primary etc)"
-      },
-      showLabel: {
-        type: Boolean,
-        default: false
-      },
-      progressClasses: {
-        type: [Array, String],
-        default: '',
-        description: 'Progress css classes'
-      },
-      size: {
-        type: String,
-        default: ''
-      },
-      value: {
-        type: Number,
-        default: 0,
-        validator: value => {
-          return value >= 0 && value <= 100;
-        },
-        description: "Progress value"
-      }
-    },
-    computed: {
-      computedClasses() {
-        return [
-          { "progress-bar-striped": this.striped },
-          { "progress-bar-animated": this.animated },
-          { [`bg-${this.type}`]: this.type }
-        ];
-      }
-    }
-  };
-</script>
-<style>
-.progress-bar::after {
-  font-family: "Font Awesome 5 Free";
-  font-weight: 900;
-  line-height: 29px;
-  content:'\f005';
-  width:30px;
-  height:30px;
-  border-radius: 100%;
-  background: #FDDF00 !important;
-  color: #fff;
-  align-self: flex-end;
-  position: absolute;
-  margin-left: 10px;
-}
-.progress-bar {
-  background: linear-gradient(to left, #8965e0, #1DA1F1);
-}
-.star-progress {
-  height: 25px;
-  width: 25px;
-  border-radius: 1000px;
-  text-align: center;
-  color: #fff;
-  line-height: 24px;
-  position: absolute;
-}
-</style>
+<template>
+  <div class="wrapper">
+    <div :class="`progress-${type}`" v-if="showLabel">
+      <div class="progress-label">
+        <slot name="label">
+          <span>{{label}}</span>
+        </slot>
+      </div>
+      <div class="progress-percentage">
+        <slot>
+          <span>{{value}}%</span>
+        </slot>
+      </div>
+    </div>
+    <div class="progress"
+         :class="[{[`progress-${size}`]: size}, progressClasses]"
+         :style="`height: ${height}px;`">
+      <div class="progress-bar"
+           :class="computedClasses"
+           role="progressbar"
+           :aria-valuenow="value"
+           aria-valuemin="0"
+           aria-valuemax="100"
+           :style="`width: ${value}%;`">
+      </div>
+      <!-- <span v-if="star" :style="`left:${star}%;`" class="star-progress bg-secondary"><font-awesome-icon :icon="['fas', 'star']"/></span> -->
+    </div>
+  </div>
+</template>
+<script>
+  export default {
+    name: "base-progress",
+    props: {
+      star: {
+        type: Boolean,
+        default: false
+      },
+      striped: {
+        type: Boolean,
+        description: "Whether progress is striped"
+      },
+      animated: {
+        type: Boolean,
+        description:
+          "Whether progress is animated (works only with `striped` prop together)"
+      },
+      label: {
+        type: String,
+        description: "Progress label (shown on the left above progress)"
+      },
+      height: {
+        type: Number,
+        default: 3,
+        description: "Progress line height"
+      },
+      type: {
+        type: String,
+        default: "default",
+        description: "Progress type (e.g danger, primary etc)"
+      },
+      showLabel: {
+        type: Boolean,
+        default: false
+      },
+      progressClasses: {
+        type: [Array, String],
+        default: '',
+        description: 'Progress css classes'
+      },
+      size: {
+        type: String,
+        default: ''
+      },
+      value: {
+        type: Number,
+        default: 0,
+        validator: value => {
+          return value >= 0 && value <= 100;
+        },
+        description: "Progress value"
+      }
+    },
+    computed: {
+      computedClasses() {
+        return [
+          { "progress-bar-striped": this.striped },
+          { "progress-bar-animated": this.animated },
+          { [`bg-${this.type}`]: this.type }
+        ];
+      }
+    }
+  };
+</script>
+<style>
+.progress-bar::after {
+  font-family: "Font Awesome 5 Free";
+  font-weight: 900;
+  line-height: 29px;
+  content:'\f005';
+  width:30px;
+  height:30px;
+  border-radius: 100%;
+  background: #FDDF00 !important;
+  color: #fff;
+  align-self: flex-end;
+  position: absolute;
+  margin-left: 10px;
+}
+.progress-bar {
+  background: linear-gradient(to left, #8965e0, #1DA1F1);
+}
+.star-progress {
+  height: 25px;
+  width: 25px;
+  border-radius: 1000px;
+  text-align: center;
+  color: #fff;
+  line-height: 24px;
+  position: absolute;
+}
+</style>

package/components/argon-core/BaseSlider.vue

@@ -1,96 +1,96 @@
-<template>
-  <div class="slider" :disabled="disabled"></div>
-</template>
-<script>
-import noUiSlider from 'nouislider';
-
-export default {
-  name: 'base-slider',
-  props: {
-    value: {
-      type: [String, Array, Number],
-      description: 'slider value'
-    },
-    disabled: {
-      type: Boolean,
-      default: false,
-      description: 'whether the slider is disabled'
-    },
-    start: {
-      type: [Number, Array],
-      default: 0,
-      description:
-        '[noUi Slider start](https://refreshless.com/nouislider/slider-options/#section-start)'
-    },
-    connect: {
-      type: [Boolean, Array],
-      default: () => [true, false],
-      description:
-        '[noUi Slider connect](https://refreshless.com/nouislider/slider-options/#section-connect)'
-    },
-    range: {
-      type: Object,
-      default: () => {
-        return {
-          min: 0,
-          max: 100
-        };
-      },
-      description:
-        '[noUi Slider range](https://refreshless.com/nouislider/slider-values/#section-range)'
-    },
-    options: {
-      type: Object,
-      default: () => {
-        return {};
-      },
-      description:
-        '[noUi Slider options](https://refreshless.com/nouislider/slider-options/)'
-    }
-  },
-  data() {
-    return {
-      slider: null
-    };
-  },
-  methods: {
-    createSlider() {
-      noUiSlider.create(this.$el, {
-        start: this.value || this.start,
-        connect: Array.isArray(this.value) ? true : this.connect,
-        range: this.range,
-        ...this.options
-      });
-      const slider = this.$el.noUiSlider;
-      slider.on('slide', () => {
-        let value = slider.get();
-        if (value !== this.value) {
-          this.$emit('input', value);
-        }
-      });
-    }
-  },
-  mounted() {
-    this.createSlider();
-  },
-  watch: {
-    value(newValue, oldValue) {
-      const slider = this.$el.noUiSlider;
-      const sliderValue = slider.get();
-      if (newValue !== oldValue && sliderValue !== newValue) {
-        if (Array.isArray(sliderValue) && Array.isArray(newValue)) {
-          if (
-            oldValue.length === newValue.length &&
-            oldValue.every((v, i) => v === newValue[i])
-          ) {
-            slider.set(newValue);
-          }
-        } else {
-          slider.set(newValue);
-        }
-      }
-    }
-  }
-};
-</script>
-<style></style>
+<template>
+  <div class="slider" :disabled="disabled"></div>
+</template>
+<script>
+import noUiSlider from 'nouislider';
+
+export default {
+  name: 'base-slider',
+  props: {
+    value: {
+      type: [String, Array, Number],
+      description: 'slider value'
+    },
+    disabled: {
+      type: Boolean,
+      default: false,
+      description: 'whether the slider is disabled'
+    },
+    start: {
+      type: [Number, Array],
+      default: 0,
+      description:
+        '[noUi Slider start](https://refreshless.com/nouislider/slider-options/#section-start)'
+    },
+    connect: {
+      type: [Boolean, Array],
+      default: () => [true, false],
+      description:
+        '[noUi Slider connect](https://refreshless.com/nouislider/slider-options/#section-connect)'
+    },
+    range: {
+      type: Object,
+      default: () => {
+        return {
+          min: 0,
+          max: 100
+        };
+      },
+      description:
+        '[noUi Slider range](https://refreshless.com/nouislider/slider-values/#section-range)'
+    },
+    options: {
+      type: Object,
+      default: () => {
+        return {};
+      },
+      description:
+        '[noUi Slider options](https://refreshless.com/nouislider/slider-options/)'
+    }
+  },
+  data() {
+    return {
+      slider: null
+    };
+  },
+  methods: {
+    createSlider() {
+      noUiSlider.create(this.$el, {
+        start: this.value || this.start,
+        connect: Array.isArray(this.value) ? true : this.connect,
+        range: this.range,
+        ...this.options
+      });
+      const slider = this.$el.noUiSlider;
+      slider.on('slide', () => {
+        let value = slider.get();
+        if (value !== this.value) {
+          this.$emit('input', value);
+        }
+      });
+    }
+  },
+  mounted() {
+    this.createSlider();
+  },
+  watch: {
+    value(newValue, oldValue) {
+      const slider = this.$el.noUiSlider;
+      const sliderValue = slider.get();
+      if (newValue !== oldValue && sliderValue !== newValue) {
+        if (Array.isArray(sliderValue) && Array.isArray(newValue)) {
+          if (
+            oldValue.length === newValue.length &&
+            oldValue.every((v, i) => v === newValue[i])
+          ) {
+            slider.set(newValue);
+          }
+        } else {
+          slider.set(newValue);
+        }
+      }
+    }
+  }
+};
+</script>
+<style></style>

package/components/argon-core/BaseSwitch.vue

@@ -1,46 +1,46 @@
-<template>
-  <label class="custom-toggle" :class="switchClass">
-    <input type="checkbox" v-model="model">
-    <span class="custom-toggle-slider rounded-circle" :data-label-off="offText" :data-label-on="onText"></span>
-  </label>
-</template>
-<script>
-  export default {
-    name: 'base-switch',
-    props: {
-      value: [Array, Boolean],
-      type: String,
-      onText: {
-        type: String,
-        default: 'Sim'
-      },
-      offText: {
-        type: String,
-        default: 'Não'
-      }
-    },
-    computed: {
-      switchClass() {
-        let baseClass = 'custom-toggle-';
-        if (this.type) {
-          return baseClass + this.type
-        }
-        return ''
-      },
-      model: {
-        get() {
-          return this.value;
-        },
-        set(value) {
-          this.$emit('input', value);
-        }
-      }
-    },
-    methods: {
-      triggerToggle() {
-        this.model = !this.model;
-      }
-    }
-  };
-</script>
-<style></style>
+<template>
+  <label class="custom-toggle" :class="switchClass">
+    <input type="checkbox" v-model="model">
+    <span class="custom-toggle-slider rounded-circle" :data-label-off="offText" :data-label-on="onText"></span>
+  </label>
+</template>
+<script>
+  export default {
+    name: 'base-switch',
+    props: {
+      value: [Array, Boolean],
+      type: String,
+      onText: {
+        type: String,
+        default: 'Sim'
+      },
+      offText: {
+        type: String,
+        default: 'Não'
+      }
+    },
+    computed: {
+      switchClass() {
+        let baseClass = 'custom-toggle-';
+        if (this.type) {
+          return baseClass + this.type
+        }
+        return ''
+      },
+      model: {
+        get() {
+          return this.value;
+        },
+        set(value) {
+          this.$emit('input', value);
+        }
+      }
+    },
+    methods: {
+      triggerToggle() {
+        this.model = !this.model;
+      }
+    }
+  };
+</script>
+<style></style>

package/components/argon-core/BaseTable.vue

@@ -1,70 +1,70 @@
-<template>
-  <table class="table tablesorter" :class="tableClass">
-    <thead :class="theadClasses">
-      <tr>
-        <slot name="columns" :columns="columns">
-          <th v-for="column in columns" :key="column">{{ column }}</th>
-        </slot>
-      </tr>
-    </thead>
-    <tbody :class="tbodyClasses">
-      <tr v-for="(item, index) in data" :key="index">
-        <slot :row="item" :index="index">
-          <td
-            v-for="(column, index) in columns"
-            :key="index"
-            v-if="hasValue(item, column)"
-          >
-            {{ itemValue(item, column) }}
-          </td>
-        </slot>
-      </tr>
-    </tbody>
-  </table>
-</template>
-<script>
-export default {
-  name: 'base-table',
-  props: {
-    columns: {
-      type: Array,
-      default: () => [],
-      description: 'Table columns'
-    },
-    data: {
-      type: Array,
-      default: () => [],
-      description: 'Table data'
-    },
-    type: {
-      type: String, // striped | hover
-      default: '',
-      description: 'Whether table is striped or hover type'
-    },
-    theadClasses: {
-      type: String,
-      default: '',
-      description: '<thead> css classes'
-    },
-    tbodyClasses: {
-      type: String,
-      default: '',
-      description: '<tbody> css classes'
-    }
-  },
-  computed: {
-    tableClass() {
-      return this.type && `table-${this.type}`;
-    }
-  },
-  methods: {
-    hasValue(item, column) {
-      return item[column.toLowerCase()] !== 'undefined';
-    },
-    itemValue(item, column) {
-      return item[column.toLowerCase()];
-    }
-  }
-};
-</script>
-<style></style>
+<template>
+  <table class="table tablesorter" :class="tableClass">
+    <thead :class="theadClasses">
+      <tr>
+        <slot name="columns" :columns="columns">
+          <th v-for="column in columns" :key="column">{{ column }}</th>
+        </slot>
+      </tr>
+    </thead>
+    <tbody :class="tbodyClasses">
+      <tr v-for="(item, index) in data" :key="index">
+        <slot :row="item" :index="index">
+          <td
+            v-for="(column, index) in columns"
+            :key="index"
+            v-if="hasValue(item, column)"
+          >
+            {{ itemValue(item, column) }}
+          </td>
+        </slot>
+      </tr>
+    </tbody>
+  </table>
+</template>
+<script>
+export default {
+  name: 'base-table',
+  props: {
+    columns: {
+      type: Array,
+      default: () => [],
+      description: 'Table columns'
+    },
+    data: {
+      type: Array,
+      default: () => [],
+      description: 'Table data'
+    },
+    type: {
+      type: String, // striped | hover
+      default: '',
+      description: 'Whether table is striped or hover type'
+    },
+    theadClasses: {
+      type: String,
+      default: '',
+      description: '<thead> css classes'
+    },
+    tbodyClasses: {
+      type: String,
+      default: '',
+      description: '<tbody> css classes'
+    }
+  },
+  computed: {
+    tableClass() {
+      return this.type && `table-${this.type}`;
+    }
+  },
+  methods: {
+    hasValue(item, column) {
+      return item[column.toLowerCase()] !== 'undefined';
+    },
+    itemValue(item, column) {
+      return item[column.toLowerCase()];
+    }
+  }
+};
+</script>
+<style></style>