evui 3.3.36 → 3.3.39

package/src/components/pagination/pageButton.vue

@@ -1,30 +1,30 @@
-<template>
-  <span
-    :class="{
-      'is-current': page.isCurrent,
-      'is-disabled': disabled || page.disabled,
-      [page.class]: true
-    }"
-    v-bind="$attrs"
-    :aria-current="page.isCurrent"
-  >
-    <slot>{{ page.number }}</slot>
-  </span>
-</template>
-
-<script>
-
-export default {
-  name: 'PageButton',
-  props: {
-    page: {
-      type: Object,
-      required: true,
-    },
-    disabled: {
-      type: Boolean,
-      default: false,
-    },
-  },
-};
-</script>
+<template>
+  <span
+    :class="{
+      'is-current': page.isCurrent,
+      'is-disabled': disabled || page.disabled,
+      [page.class]: true
+    }"
+    v-bind="$attrs"
+    :aria-current="page.isCurrent"
+  >
+    <slot>{{ page.number }}</slot>
+  </span>
+</template>
+
+<script>
+
+export default {
+  name: 'PageButton',
+  props: {
+    page: {
+      type: Object,
+      required: true,
+    },
+    disabled: {
+      type: Boolean,
+      default: false,
+    },
+  },
+};
+</script>

package/src/components/progress/Progress.vue

@@ -1,139 +1,139 @@
-<template>
-  <div class="ev-progress">
-    <div
-      class="ev-progress-wrapper"
-      :style="wrapperStyle"
-    >
-      <div
-        class="ev-progress-inner"
-        :style="innerStyle"
-      >
-        <div
-          v-if="innerText"
-          class="ev-progress-inner-text"
-        >
-          {{ innerText }}
-        </div>
-      </div>
-    </div>
-    <div
-      v-if="$slots.default"
-      class="ev-progress-label"
-    >
-      <slot />
-    </div>
-  </div>
-</template>
-
-<script>
-import { computed } from 'vue';
-
-export default {
-  name: 'EvProgress',
-  props: {
-    modelValue: {
-      type: Number,
-      default: 0,
-      validator: val => (val >= 0 && val <= 100),
-    },
-    color: {
-      type: [String, Array],
-      default: '#409EFF',
-    },
-    strokeWidth: {
-      type: Number,
-      default: 6,
-    },
-    innerText: {
-      type: String,
-      default: '',
-    },
-  },
-  emits: {
-  },
-  setup(props) {
-    const wrapperStyle = computed(() => ({
-      height: `${props.strokeWidth}px`,
-    }));
-    const innerStyle = computed(() => {
-      if (Array.isArray(props.color)) {
-        const sortedColorList = [...props.color].sort((curr, next) => curr.value - next.value);
-        let color = sortedColorList[0].color;
-        if (!props.modelValue) {
-          return {
-            width: `${props.modelValue}%`,
-            'background-color': color,
-          };
-        }
-        for (let i = 0; i < sortedColorList.length; i++) {
-          const prevValue = i === 0 ? 0 : sortedColorList[i - 1].value;
-          const currValue = sortedColorList[i].value;
-          if (props.modelValue > prevValue && props.modelValue <= currValue) {
-            color = sortedColorList[i].color;
-            break;
-          }
-        }
-        return {
-          width: `${props.modelValue}%`,
-          'background-color': color,
-        };
-      }
-      return {
-        width: `${props.modelValue}%`,
-        'background-color': props.color,
-      };
-    });
-
-    return {
-      wrapperStyle,
-      innerStyle,
-    };
-  },
-};
-</script>
-
-<style lang="scss">
-@import '../../style/index.scss';
-
-.ev-progress {
-  display: flex;
-  position: relative;
-  width: 100%;
-  box-sizing: border-box;
-  user-select: none;
-
-  &-wrapper {
-    position: relative;
-    height: 6px;
-    border-radius: 100px;
-    background-color: #EBEEF5;
-    overflow: hidden;
-    flex: 1;
-    align-self: center;
-  }
-
-  &-inner {
-    position: absolute;
-    top: 0;
-    left: 0;
-    height: 100%;
-    border-radius: 100px;
-    text-align: right;
-    white-space: nowrap;
-    transition: width .6s ease;
-  }
-
-  &-inner-text {
-    display: inline-block;
-    margin: 0 5px;
-    color: #FFFFFF;
-    font-size: 12px;
-  }
-
-  &-label {
-    min-width: 55px;
-    text-align: right;
-    margin-left: 10px;
-  }
-}
-</style>
+<template>
+  <div class="ev-progress">
+    <div
+      class="ev-progress-wrapper"
+      :style="wrapperStyle"
+    >
+      <div
+        class="ev-progress-inner"
+        :style="innerStyle"
+      >
+        <div
+          v-if="innerText"
+          class="ev-progress-inner-text"
+        >
+          {{ innerText }}
+        </div>
+      </div>
+    </div>
+    <div
+      v-if="$slots.default"
+      class="ev-progress-label"
+    >
+      <slot />
+    </div>
+  </div>
+</template>
+
+<script>
+import { computed } from 'vue';
+
+export default {
+  name: 'EvProgress',
+  props: {
+    modelValue: {
+      type: Number,
+      default: 0,
+      validator: val => (val >= 0 && val <= 100),
+    },
+    color: {
+      type: [String, Array],
+      default: '#409EFF',
+    },
+    strokeWidth: {
+      type: Number,
+      default: 6,
+    },
+    innerText: {
+      type: String,
+      default: '',
+    },
+  },
+  emits: {
+  },
+  setup(props) {
+    const wrapperStyle = computed(() => ({
+      height: `${props.strokeWidth}px`,
+    }));
+    const innerStyle = computed(() => {
+      if (Array.isArray(props.color)) {
+        const sortedColorList = [...props.color].sort((curr, next) => curr.value - next.value);
+        let color = sortedColorList[0].color;
+        if (!props.modelValue) {
+          return {
+            width: `${props.modelValue}%`,
+            'background-color': color,
+          };
+        }
+        for (let i = 0; i < sortedColorList.length; i++) {
+          const prevValue = i === 0 ? 0 : sortedColorList[i - 1].value;
+          const currValue = sortedColorList[i].value;
+          if (props.modelValue > prevValue && props.modelValue <= currValue) {
+            color = sortedColorList[i].color;
+            break;
+          }
+        }
+        return {
+          width: `${props.modelValue}%`,
+          'background-color': color,
+        };
+      }
+      return {
+        width: `${props.modelValue}%`,
+        'background-color': props.color,
+      };
+    });
+
+    return {
+      wrapperStyle,
+      innerStyle,
+    };
+  },
+};
+</script>
+
+<style lang="scss">
+@import '../../style/index.scss';
+
+.ev-progress {
+  display: flex;
+  position: relative;
+  width: 100%;
+  box-sizing: border-box;
+  user-select: none;
+
+  &-wrapper {
+    position: relative;
+    height: 6px;
+    border-radius: 100px;
+    background-color: #EBEEF5;
+    overflow: hidden;
+    flex: 1;
+    align-self: center;
+  }
+
+  &-inner {
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 100%;
+    border-radius: 100px;
+    text-align: right;
+    white-space: nowrap;
+    transition: width .6s ease;
+  }
+
+  &-inner-text {
+    display: inline-block;
+    margin: 0 5px;
+    color: #FFFFFF;
+    font-size: 12px;
+  }
+
+  &-label {
+    min-width: 55px;
+    text-align: right;
+    margin-left: 10px;
+  }
+}
+</style>

package/src/components/progress/index.js

@@ -1,7 +1,7 @@
-import EvProgress from './Progress';
-
-EvProgress.install = (app) => {
-  app.component(EvProgress.name, EvProgress);
-};
-
-export default EvProgress;
+import EvProgress from './Progress';
+
+EvProgress.install = (app) => {
+  app.component(EvProgress.name, EvProgress);
+};
+
+export default EvProgress;

package/src/components/radio/Radio.vue

@@ -1,159 +1,159 @@
-<template>
-  <label
-    class="ev-radio"
-    :class="[
-      {
-        disabled,
-        checked,
-      },
-      size,
-    ]"
-  >
-    <input
-      v-model="mv"
-      type="radio"
-      class="ev-radio-input"
-      :value="label"
-      :disabled="disabled"
-      @change.stop="changeMv"
-    >
-    <span class="ev-radio-label">
-      <template v-if="$slots.default">
-        <slot />
-      </template>
-      <template v-else>
-        {{ label }}
-      </template>
-    </span>
-  </label>
-</template>
-
-<script>
-import { computed, inject, nextTick } from 'vue';
-
-export default {
-  name: 'EvRadio',
-  props: {
-    modelValue: {
-      type: [String, Number, Symbol, Boolean],
-      default: null,
-    },
-    label: {
-      type: [String, Number, Symbol, Boolean],
-      default: null,
-    },
-    disabled: {
-      type: Boolean,
-      default: false,
-    },
-    size: {
-      type: String,
-      default: '',
-    },
-  },
-  emits: {
-    'update:modelValue': null,
-    change: null,
-  },
-  setup(props, { emit }) {
-    const mv = inject(
-      'EvRadioGroupMv',
-      computed({
-        get: () => props.modelValue,
-        set: val => emit('update:modelValue', val),
-      }),
-    );
-
-    const changeMv = inject(
-      'EvRadioGroupChange',
-      async (e) => {
-        await nextTick();
-        emit('change', mv.value, e);
-      },
-    );
-
-    const checked = computed(() => mv.value === props.label);
-
-    return {
-      mv,
-      checked,
-      changeMv,
-    };
-  },
-};
-</script>
-
-<style lang="scss">
-@import '../../style/index.scss';
-
-.ev-radio {
-  $button-size-default: 18px;
-  display: inline-block;
-  position: relative;
-  padding: 0 5px;
-  margin-right: 30px;
-  user-select: none;
-  line-height: $button-size-default;
-  cursor: pointer;
-  &-label {
-    padding-left: 5px;
-  }
-  &-input {
-    cursor: pointer;
-  }
-}
-
-@include state('disabled') {
-  .ev-radio-label {
-    @include evThemify() {
-      color: evThemed('disabled');
-    }
-  }
-  .ev-radio-input,
-  .ev-radio-label {
-    cursor: not-allowed !important;
-  }
-}
-@include state('type-button') {
-  .ev-radio {
-    display: inline-block;
-    padding: 0;
-    margin: 0;
-    text-align: center;
-
-    @include evThemify() {
-      border: 1px solid evThemed('border-base');
-      border-left: 0;
-    }
-    &:first-child {
-      border-radius: $default-radius 0 0 $default-radius;
-
-      @include evThemify() {
-        border-left: 1px solid evThemed('border-base');
-      }
-    }
-    &:last-child {
-      border-radius: 0 $default-radius $default-radius 0;
-    }
-    &.checked {
-      color: $color-white;
-
-      @include evThemify() {
-        background-color: evThemed('primary');
-      }
-    }
-    &.disabled.checked {
-      @include evThemify() {
-        background-color: rgba(evThemed('border-base'), 0.5);
-      }
-    }
-  }
-  .ev-radio-input {
-    @include visible-hide();
-  }
-  .ev-radio-label {
-    display: inline-block;
-    padding: 7px 12px;
-  }
-}
-</style>
+<template>
+  <label
+    class="ev-radio"
+    :class="[
+      {
+        disabled,
+        checked,
+      },
+      size,
+    ]"
+  >
+    <input
+      v-model="mv"
+      type="radio"
+      class="ev-radio-input"
+      :value="label"
+      :disabled="disabled"
+      @change.stop="changeMv"
+    >
+    <span class="ev-radio-label">
+      <template v-if="$slots.default">
+        <slot />
+      </template>
+      <template v-else>
+        {{ label }}
+      </template>
+    </span>
+  </label>
+</template>
+
+<script>
+import { computed, inject, nextTick } from 'vue';
+
+export default {
+  name: 'EvRadio',
+  props: {
+    modelValue: {
+      type: [String, Number, Symbol, Boolean],
+      default: null,
+    },
+    label: {
+      type: [String, Number, Symbol, Boolean],
+      default: null,
+    },
+    disabled: {
+      type: Boolean,
+      default: false,
+    },
+    size: {
+      type: String,
+      default: '',
+    },
+  },
+  emits: {
+    'update:modelValue': null,
+    change: null,
+  },
+  setup(props, { emit }) {
+    const mv = inject(
+      'EvRadioGroupMv',
+      computed({
+        get: () => props.modelValue,
+        set: val => emit('update:modelValue', val),
+      }),
+    );
+
+    const changeMv = inject(
+      'EvRadioGroupChange',
+      async (e) => {
+        await nextTick();
+        emit('change', mv.value, e);
+      },
+    );
+
+    const checked = computed(() => mv.value === props.label);
+
+    return {
+      mv,
+      checked,
+      changeMv,
+    };
+  },
+};
+</script>
+
+<style lang="scss">
+@import '../../style/index.scss';
+
+.ev-radio {
+  $button-size-default: 18px;
+  display: inline-block;
+  position: relative;
+  padding: 0 5px;
+  margin-right: 30px;
+  user-select: none;
+  line-height: $button-size-default;
+  cursor: pointer;
+  &-label {
+    padding-left: 5px;
+  }
+  &-input {
+    cursor: pointer;
+  }
+}
+
+@include state('disabled') {
+  .ev-radio-label {
+    @include evThemify() {
+      color: evThemed('disabled');
+    }
+  }
+  .ev-radio-input,
+  .ev-radio-label {
+    cursor: not-allowed !important;
+  }
+}
+@include state('type-button') {
+  .ev-radio {
+    display: inline-block;
+    padding: 0;
+    margin: 0;
+    text-align: center;
+
+    @include evThemify() {
+      border: 1px solid evThemed('border-base');
+      border-left: 0;
+    }
+    &:first-child {
+      border-radius: $default-radius 0 0 $default-radius;
+
+      @include evThemify() {
+        border-left: 1px solid evThemed('border-base');
+      }
+    }
+    &:last-child {
+      border-radius: 0 $default-radius $default-radius 0;
+    }
+    &.checked {
+      color: $color-white;
+
+      @include evThemify() {
+        background-color: evThemed('primary');
+      }
+    }
+    &.disabled.checked {
+      @include evThemify() {
+        background-color: rgba(evThemed('border-base'), 0.5);
+      }
+    }
+  }
+  .ev-radio-input {
+    @include visible-hide();
+  }
+  .ev-radio-label {
+    display: inline-block;
+    padding: 7px 12px;
+  }
+}
+</style>

package/src/components/radio/index.js

@@ -1,7 +1,7 @@
-import EvRadio from './Radio';
-
-EvRadio.install = (app) => {
-  app.component(EvRadio.name, EvRadio);
-};
-
-export default EvRadio;
+import EvRadio from './Radio';
+
+EvRadio.install = (app) => {
+  app.component(EvRadio.name, EvRadio);
+};
+
+export default EvRadio;