vdesign-ui 0.1.20 → 0.1.21

package/dist/components/list/style.less

@@ -1,292 +0,0 @@
-@title-prefix-cls: vd-list;
-
-.@{title-prefix-cls} {
-
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    background-color: var(--bg-color-1);
-
-    &--right {
-        display: flex;
-        align-items: center;
-    }
-
-    &-content {
-        display: flex;
-        align-items: center;
-    }
-
-    &-content-common {
-        flex-direction: column;
-        align-items: flex-start;
-    }
-
-    // &-inner__title{
-    //     color: var(--color-title-head);
-    // }
-
-    &__subtext {
-        margin-block-start: calc(var(--spacing-title-subtitle-margin_top) * 1px);
-        color: var(--color-title-text);
-    }
-
-    &-arrow {
-        // color:var(--color-title-icon_arrow);
-        display: flex;
-        margin-inline-start: calc(var(--spacing-list-info_icon-margin_y) * 1px);
-
-        .vd-iconfont {
-            font-size: calc(var(--icon-small) * 1px);
-            color: var(--text-color-h2);
-        }
-    }
-
-    &__multext {
-        font-size: calc(var(--en-single-f-c-s-fontSize) * 1px);
-        font-weight: var(--en-single-f-c-s-fontWeight);
-        color: var(--text-color-h1);
-    }
-
-    &-xs {
-        padding-block-start: calc(var(--spacing-list-info_s-padding_top) * 1px);
-        padding-block-end: calc(var(--spacing-list-info_s-padding_bottom) * 1px);
-        // &__icon--left{
-        //     margin-inline-end: calc(var(--spacing-title-primary_icon-margin_y) * 1px);
-        //     font-size: calc(var(--icon-title-primary) * 1px);  
-        // }
-
-        &__icon--right {
-            font-size: 16px;
-            color: var(--text-color-h2);
-        }
-
-        &__title {
-            margin-inline-end: calc(var(--spacing-list-info_icon-margin_y) * 1px);
-            color: var(--text-color-h2);
-            font-size: calc(var(--en-single-f-c-r-fontSize) * 1px);
-            font-weight: var(--en-single-f-c-r-fontWeight);
-        }
-
-        &__text--right {
-            font-size: calc(var(--en-single-f-c-r-fontSize) * 1px);
-            font-weight: var(--en-single-f-c-r-fontWeight);
-            color: var(--text-color-h1);
-        }
-
-        // &__subtext{
-        //     font-size: calc(var(--en-single-f-c-r-fontSize) * 1px);
-        //     font-weight: var(--en-single-f-c-r-fontWeight);
-        // }
-    }
-
-    &-s {
-        padding-block-start: calc(var(--spacing-list-info_m-padding_top) * 1px);
-        padding-block-end: calc(var(--spacing-list-info_m-padding_bottom) * 1px);
-
-        // &__icon--left{
-        //     margin-inline-end: calc(var(--spacing-title-secondary_icon-margin_y) * 1px);
-        //     font-size: calc(var(--icon-title-secondary) * 1px);
-        // }
-
-        &__icon--right {
-            font-size: 16px;
-            color: var(--text-color-h2);
-        }
-
-        &__title {
-            margin-inline-end: calc(var(--spacing-list-info_icon-margin_y) * 1px);
-            color: var(--text-color-h1);
-            font-size: calc(var(--en-single-f-c-r-fontSize) * 1px);
-            font-weight: var(--en-single-f-c-r-fontWeight);
-        }
-
-        &__text--right {
-            font-size: calc(var(--en-single-f-c-s-fontSize) * 1px);
-            font-weight: var(--en-single-f-c-s-fontWeight);
-            color: var(--text-color-h1);
-        }
-
-        // &__subtext{
-        //     font-size: calc(var(--en-single-f-b-r-fontSize) * 1px);
-        //     font-weight: var(--en-single-f-b-r-fontWeight);
-        // }
-    }
-
-    &-m {
-        padding-block-start: calc(var(--spacing-list-info_l-padding_top) * 1px);
-        padding-block-end: calc(var(--spacing-list-info_l-padding_bottom) * 1px);
-
-        // &__icon--left{
-        //     margin-inline-end: calc(var(--spacing-title-tertiary_icon-margin_y) * 1px);
-        //     font-size: calc(var(--icon-title-tertiary) * 1px);
-        // }
-
-        &__icon--right {
-            // margin-inline-start: calc(var(--spacing-title-tertiary_icon-margin_y) * 1px);
-            font-size: 16px;
-            color: var(--text-color-h2);
-        }
-
-        &__title {
-            margin-inline-end: calc(var(--spacing-list-info_icon-margin_y) * 1px);
-            color: var(--text-color-h2);
-            font-size: calc(var(--en-single-f-c-r-fontSize) * 1px);
-            font-weight: var(--en-single-f-c-r-fontWeight);
-        }
-
-        &__text--right {
-            font-size: calc(var(--en-single-f-d-r-fontSize) * 1px);
-            font-weight: var(--en-single-f-d-r-fontWeight);
-            color: var(--text-color-h1);
-        }
-
-        // &__subtext{
-        //     font-size: calc(var(--en-single-f-b-r-fontSize) * 1px);
-        //     font-weight: var(--en-single-f-b-r-fontSize);
-        // }
-    }
-
-    &-l {
-        height: calc(var(--height-super-large) * 1px);
-
-        // &__icon--left{
-        //     margin-inline-end: calc(var(--spacing-title-quaternary_icon-margin_y) * 1px);
-        //     font-size: calc(var(--icon-title-quaternary) * 1px);
-        // }
-
-        &__icon--right {
-            font-size: 16px;
-            color: var(--text-color-h2);
-        }
-
-        &__title {
-            margin-inline-end: calc(var(--spacing-list-info_icon-margin_y) * 1px);
-            color: var(--text-color-h1);
-            font-size: calc(var(--en-single-f-c-r-fontSize) * 1px);
-            font-weight: var(--en-single-f-c-r-fontWeight);
-        }
-
-        &__text--right {
-            text-align: end;
-            font-size: calc(var(--en-single-f-d-s-fontSize) * 1px);
-            font-weight: var(--en-single-f-d-s-fontWeight);
-            color: var(--text-color-h1);
-        }
-
-        // &__subtext{
-        //     font-size: calc(var(--en-single-f-a-r-fontSize) * 1px);
-        //     font-weight: var(--en-single-f-a-r-fontSize);
-        // }
-    }
-
-    &-common {
-        padding-block-start: calc(var(--spacing-list-common-padding_x) * 1px);
-        padding-block-end: calc(var(--spacing-list-common-padding_x) * 1px);
-        padding-inline-start: calc(var(--spacing-list-common-padding_y) * 1px);
-        padding-inline-end: calc(var(--spacing-list-common-padding_y) * 1px);
-
-
-        &--left {
-            display: flex;
-            align-items: center;
-        }
-
-
-        &__icon--leftcus {
-            margin-inline-end: calc(var(--spacing-list-common_icon-margin_right) * 1px);
-            font-size: calc(var(--icon-large) * 1px);
-            color: var(--text-color-h2);
-        }
-
-        // &__icon--left{
-        //     margin-inline-end: calc(var(--spacing-title-quaternary_icon-margin_y) * 1px);
-        //     font-size: calc(var(--icon-title-quaternary) * 1px);
-        // }
-
-        // &__icon--right{
-        //     margin-inline-start: calc(var(--spacing-title-quaternary_icon-margin_y) * 1px);
-        //     font-size: calc(var(--icon-title-quaternary) * 1px);
-        // }
-
-        &__title {
-            // word-break: break-all;
-            // text-overflow: ellipsis;
-            // display: -webkit-box;
-            // -webkit-box-orient: vertical;
-            // -webkit-line-clamp: 2; /* 超出几行省略 */
-            // overflow: hidden;
-            color: var(--color-list-title);
-            font-size: calc(var(--en-single-f-d-s-fontSize) * 1px);
-            font-weight: var(--en-single-f-d-s-fontWeight);
-        }
-
-        &__text--right {
-            text-align: end;
-            margin-inline-start: calc(var(--spacing-list-common_describe-margin_xy) * 1px);
-            font-size: calc(var(--en-single-f-c-r-fontSize) * 1px);
-            font-weight: var(--en-single-f-c-r-fontWeight);
-            color: var(--color-list-text);
-
-        }
-
-        &__subtext {
-            line-height: 21px;
-            color: var(--color-list-text);
-            font-size: calc(var(--en-single-f-c-r-fontSize) * 1px);
-            font-weight: var(--en-single-f-c-r-fontWeight);
-        }
-
-        &__badge {
-            margin-inline-start: calc(var(--spacing-list-common_badge-margin_left) * 1px);
-        }
-    }
-
-
-    &-check {
-        padding-block-start: calc(var(--spacing-list-common-padding_x) * 1px);
-        padding-block-end: calc(var(--spacing-list-common-padding_x) * 1px);
-
-        &--active {
-
-            .@{title-prefix-cls}-check__select {
-                margin-inline-start: calc(var(--spacing-list-check-margin_left) * 1px);
-
-                .vd-iconfont {
-                    transform: scaleX(1) !important;
-                    direction: ltr;
-                    font-size: calc(var(--icon-list-check) * 1px);
-                }
-            }
-
-            .@{title-prefix-cls}-check__title {
-                font-size: calc(var(--en-multi-f-d-s-fontSize) * 1px);
-                font-weight: var(--en-multi-f-d-s-fontWeight);
-            }
-        }
-
-        &__title {
-            color: var(--color-list-title);
-            font-size: calc(var(--en-multi-f-d-r-fontSize) * 1px);
-            font-weight: var(--en-multi-f-d-r-fontWeight);
-        }
-
-        &__icon--leftcus {
-            margin-inline-end: calc(var(--spacing-list-check_icon-margin_right) * 1px);
-            font-size: calc(var(--icon-large) * 1px);
-            color: var(--text-color-h2);
-        }
-    }
-
-    &__icon--extra {
-        font-size: 16px;
-        margin-inline-end: calc(var(--spacing-list-info_icon-margin_y) * 1px);
-        color: var(--text-color-h2);
-    }
-
-    &__switch {
-        display: flex;
-        margin-inline-start: calc(var(--spacing-list-common_switch-margin_left) * 1px);
-    }
-}

package/dist/components/loading/index.js

@@ -1,7 +0,0 @@
-import Loading from './index.vue';
-import './style.less';
-Loading.install = function(Vue) {
-    Vue.component(Loading.name, Loading)
-}
-
-export default Loading;

package/dist/components/loading/index.vue

@@ -1,53 +0,0 @@
-<template>
-  <div class="vd-loading-wrapper">
-
-    <div class="vd-loading" v-if="loading">
-      <slot>
-        <img src="./loading.png" alt="">
-      </slot>
-      <span class="vd-loading__text" v-if="text">{{ text }}</span>
-    </div>
-    <div class="vd-refresh" :class="refreshClasses" v-else>
-      <img src="./refresh.png" alt="">
-    </div>
-  </div>
-</template> 
-
-<script>
-export default {
-    name:'vd-loading',
-    props:{
-      text:{
-        type: String,
-        default:''
-      },
-      loading:{
-        type: Boolean,
-        default:true
-      },
-      size:{
-        type: String,
-        default:'large'
-      }
-    },
-    computed:{
-      refreshClasses() {
-        return [
-          'vd-refresh',
-          {
-            [`vd-refresh--${this.size}`]:this.size
-          }
-        ]
-      }
-    },
-    methods:{
-    },
-    mounted(){
-    
-    }
-}
-</script>
-
-<style lang="less">
-@import './style.less';
-</style>

package/dist/components/loading/style.less

@@ -1,48 +0,0 @@
-
-.vd-loading{
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    transform: translate(-50%, -50%);
-    margin-block-start: -16px;
-    display: flex;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    width: fit-content;
-    min-height: calc(var(--height-loading-small) * 1px);
-    min-width: calc(var(--width-loading-small) * 1px);
-    max-width: calc(var(--width-loading-large) * 1px);
-    background-color: var(--color-loading-bg);
-    border-radius: calc(var(--radius-loading-size) * 1px);
-    padding: calc(var(--spacing-loading-padding_x) * 1px) calc(var(--spacing-loading-padding_y) * 1px);
-    &__text{
-        margin-block-start: calc(var(--spacing-loading-icon-margin_bottom) * 1px);
-        font-size: calc(var(--en-single-f-c-r-fontSize) * 1px);
-        font-weight: var(--en-single-f-c-r-fontWeight);
-        color: var(--color-loading-text);
-    }
-
-    img{
-        margin: 0 auto;
-        width: calc(var(--icon-loading-size) * 1px);
-    }
-}
-
-
-.vd-refresh{
-
-    position: absolute;
-    left: 50%;
-    transform: translateX(-50%);
-
-    &--large{
-        width: calc(var(--icon-loading-refres_large) * 1px);
-    }
-    
-    &--small{
-        width: calc(var(--icon-loading-refres_small ) * 1px);
-    }
-
-}
-

package/dist/components/mixins/clickoutside.js

@@ -1,81 +0,0 @@
-import Vue from 'vue';
-import { on } from './dom';
-// 定义一个空数组 nodeList，用于存储绑定了该指令的元素。
-const nodeList = [];
-//定义一个常量 ctx，用于标识特殊属性名。
-const ctx = '@@clickoutsideContext';
-// 定义一个变量 startClick，用于存储点击开始时的事件对象。
-let startClick;
-// 定义一个变量 seed，用作节点标识的种子。
-let seed = 0;
-// 在文档上添加一个 mousedown 事件监听器，用于记录点击开始时的事件对象。
-!Vue.prototype.$isServer && on(document, 'mousedown', e => (startClick = e));
-// 添加一个 mouseup 事件监听器。当鼠标放开时，
-!Vue.prototype.$isServer && on(document, 'mouseup', e => {
-  // 遍历 nodeList 数组中的每个元素，并执行它们的 documentHandler 函数。
-  nodeList.forEach(node => node[ctx].documentHandler(e, startClick));
-});
-// 创建一个处理文档点击事件的函数。
-// 该函数返回一个闭包函数，用于检查点击事件是否发生在绑定的元素外部，并执行相应的回调函数。
-function createDocumentHandler(el, binding, vnode) {
-  return function (mouseup = {}, mousedown = {}) {
-    if (!vnode ||
-      !vnode.context ||
-      !mouseup.target ||
-      !mousedown.target ||
-      el.contains(mouseup.target) ||
-      el.contains(mousedown.target) ||
-      el === mouseup.target ||
-      (vnode.context.popperElm &&
-        (vnode.context.popperElm.contains(mouseup.target) ||
-          vnode.context.popperElm.contains(mousedown.target)))) return;
-
-    if (binding.expression &&
-      el[ctx].methodName &&
-      vnode.context[el[ctx].methodName]) {
-      vnode.context[el[ctx].methodName]();
-    } else {
-      el[ctx].bindingFn && el[ctx].bindingFn();
-    }
-  };
-}
-
-/**
- * v-clickoutside
- * @desc 点击元素外面才会触发的事件
- * @example
- * ```vue
- * <div v-element-clickoutside="handleClose">
- * ```
- */
-export default {
-  // 将元素添加到 nodeList 数组中，并为该元素添加一个包含事件处理函数的特殊属性。
-  bind(el, binding, vnode) {
-    nodeList.push(el);
-    const id = seed++;
-    el[ctx] = {
-      id,
-      documentHandler: createDocumentHandler(el, binding, vnode),
-      methodName: binding.expression,
-      bindingFn: binding.value
-    };
-  },
-  // 当指令所在组件的 VNode 更新时调用，更新元素的事件处理函数和绑定方法。
-  update(el, binding, vnode) {
-    el[ctx].documentHandler = createDocumentHandler(el, binding, vnode);
-    el[ctx].methodName = binding.expression;
-    el[ctx].bindingFn = binding.value;
-  },
-  // 从 nodeList 中移除对应的元素，并删除特殊属性。
-  unbind(el) {
-    let len = nodeList.length;
-
-    for (let i = 0; i < len; i++) {
-      if (nodeList[i][ctx].id === el[ctx].id) {
-        nodeList.splice(i, 1);
-        break;
-      }
-    }
-    delete el[ctx];
-  }
-};

package/dist/components/mixins/dom.js

@@ -1,41 +0,0 @@
-/* istanbul ignore next */
-
-import Vue from 'vue';
-
-const isServer = Vue.prototype.$isServer;
-/* istanbul ignore next */
-export const on = (function () {
-  // 添加事件监听器
-  if (!isServer && document.addEventListener) {
-    return function (element, event, handler) {
-      if (element && event && handler) {
-        element.addEventListener(event, handler, false);
-      }
-    };
-  } else {
-    // IE8 及其以下版本没有 addEventListener 方法
-    return function (element, event, handler) {
-      if (element && event && handler) {
-        element.attachEvent('on' + event, handler);
-      }
-    };
-  }
-})();
-
-/* istanbul ignore next */
-export const off = (function () {
-  // 移除事件监听器
-  if (!isServer && document.removeEventListener) {
-    return function (element, event, handler) {
-      if (element && event) {
-        element.removeEventListener(event, handler, false);
-      }
-    };
-  } else {
-    return function (element, event, handler) {
-      if (element && event) {
-        element.detachEvent('on' + event, handler);
-      }
-    };
-  }
-})();

package/dist/components/mixins/languageMixin.js

@@ -1,38 +0,0 @@
-// src/mixins/languageMixin.js
-export default {
-  data() {
-    return {
-      language: document.documentElement.lang || 'en' // 初始语言
-    }
-  },
-  mounted() {
-    this.updateLanguage();
-    this.setupLanguageObserver();
-  },
-  methods: {
-    updateLanguage() {
-      this.language = document.documentElement.lang || 'en';
-    },
-    setupLanguageObserver() {
-      const observer = new MutationObserver(() => {
-        this.updateLanguage();
-      });
-
-      observer.observe(document.documentElement, {
-        attributes: true,
-        attributeFilter: ['lang']
-      });
-
-      // 在组件销毁时断开观察者
-      this.$once('hook:beforeDestroy', () => {
-        observer.disconnect();
-      });
-    }
-  },
-  watch: {
-    // language(newLang) {
-    //   // 当 language 变化时执行的操作
-    //   console.log('Language changed to:', newLang);
-    // }
-  }
-}

package/dist/components/mixins/outlineConfigPlugin.js

@@ -1,40 +0,0 @@
-// outlineConfigPlugin.js
-
-// __debug=1&__debug_vdesign_token=1
-const OutlineConfig = {
-    install(Vue,  options = {}) {
-      const outlineConfig = Vue.observable({
-        outlineEnabled:  options.outlineEnabled ||false,
-      });
-  
-      Vue.prototype.$outlineConfig = outlineConfig;
-  
-      Vue.mixin({
-        created() {
-          this.$outlineConfig.outlineEnabled = this.shouldEnableOutline()
-
-          this.$watch('$outlineConfig.outlineEnabled', (newValue) => {
-            document.documentElement.style.setProperty('--outline-visible', newValue ? '1px' : '0');
-          }, { immediate: true });
-        },
-        methods:{
-          shouldEnableOutline() {
-            // 获取URL的查询参数部分
-            const searchParams = new URLSearchParams(window.location.search);
-            // 对于哈希模式，也解析哈希中的查询字符串
-            const hashParams = window.location.hash.split('?')[1] ? new URLSearchParams(window.location.hash.split('?')[1]) : null;
-          
-            // 检查查询参数或哈希中的参数
-            const debug = searchParams.has('__debug') || (hashParams && hashParams.has('__debug')) ? searchParams.get('__debug') === '1' || (hashParams && hashParams.get('__debug') === '1') : false;
-            const vdesignToken = searchParams.has('__debug_vdesign_token') || (hashParams && hashParams.has('__debug_vdesign_token')) ? searchParams.get('__debug_vdesign_token') === '1' || (hashParams && hashParams.get('__debug_vdesign_token') === '1') : false;
-          
-            return debug && vdesignToken;
-          }
-        }
-      });
-    }
-};
-  
-
-
-export default OutlineConfig;

package/dist/components/mixins/router-link.js

@@ -1,23 +0,0 @@
-/**
- * add Vue-Router support
- */
-
-export default {
-    props: {
-      url: String,
-      replace: Boolean,
-      to: [String, Object]
-    },
-  
-    methods: {
-      routerLink() {
-        const { to, url, $router, replace } = this;
-        if (to && $router) {
-          $router[replace ? 'replace' : 'push'](to);
-        } else if (url) {
-          replace ? location.replace(url) : location.href = url;
-        }
-      }
-    }
-  };
-  

package/dist/components/mixins/themeMixin.js

@@ -1,29 +0,0 @@
-export const themeMixin = {
-    data() {
-        return {
-            theme: document.documentElement.getAttribute('theme') || 'light'  // 初始化主题
-        };
-    },
-    mounted() {
-        this.observeThemeChanges();  // 组件挂载时开始监视主题变化
-    },
-    methods: {
-        observeThemeChanges() {
-            // 创建一个 MutationObserver 实例
-            const observer = new MutationObserver((mutations) => {
-                mutations.forEach((mutation) => {
-                    // 检查变化的属性是否为 'theme'
-                    if (mutation.attributeName === 'theme') {
-                        // 更新组件的主题
-                        this.theme = document.documentElement.getAttribute('theme') || 'light';
-                    }
-                });
-            });
-
-            // 配置观察器，监视 html 元素的属性变化
-            observer.observe(document.documentElement, {
-                attributes: true  // 仅监视属性变化
-            });
-        }
-    }
-};

package/dist/components/noticebar/index.js

@@ -1,8 +0,0 @@
-import Noticebar from './index.vue';
-import './style.less';
-
-Noticebar.install = function (Vue) {
-  Vue.component(Noticebar.name, Noticebar);
-};
-
-export default Noticebar;