vxe-pc-ui 0.2.0 → 0.4.0

package/es/switch/index.js

@@ -5,6 +5,6 @@ export const VxeSwitch = Object.assign(VxeSwitchComponent, {
         app.component(VxeSwitchComponent.name, VxeSwitchComponent);
     }
 });
-export const Switch = VxeSwitch;
 dynamicApp.component(VxeSwitchComponent.name, VxeSwitchComponent);
+export const Switch = VxeSwitch;
 export default VxeSwitch;

package/es/switch/style.css

@@ -1,6 +1,6 @@
 .vxe-switch {
   display: inline-block;
-  color: var(--vxe-font-color);
+  color: var(--vxe-ui-font-color);
   vertical-align: middle;
   padding: 0.4em;
   -webkit-user-select: none;

package/es/switch/style.min.css

@@ -1 +1 @@
-.vxe-switch{display:inline-block;color:var(--vxe-font-color);vertical-align:middle;padding:.4em;-webkit-user-select:none;-moz-user-select:none;user-select:none;text-align:center}.vxe-switch.is--animat .vxe-switch--button{transition:border-color .3s,background-color .3s}.vxe-switch.is--animat .vxe-switch--icon{transition:all .3s}.vxe-switch.is--on .vxe-switch--button{padding-right:1.7em;background-color:var(--vxe-ui-switch-open-background-color)}.vxe-switch.is--on .vxe-switch--icon{left:100%;transform:translateX(-1.4em)}.vxe-switch.is--off .vxe-switch--button{padding-left:1.7em;background-color:var(--vxe-ui-switch-close-background-color)}.vxe-switch.is--off .vxe-switch--icon{left:.2em;transform:translateX(0)}.vxe-switch.is--off .vxe-switch--label-on,.vxe-switch.is--on .vxe-switch--label-off{height:0;visibility:hidden;overflow:hidden}.vxe-switch.is--off .vxe-switch--label,.vxe-switch.is--on .vxe-switch--label{opacity:1}.vxe-switch:not(.is--disabled) .vxe-switch--button{cursor:pointer}.vxe-switch:not(.is--disabled) .vxe-switch--button:focus{box-shadow:0 0 .4em 0 var(--vxe-primary-color)}.vxe-switch.is--disabled .vxe-switch--button{cursor:no-drop}.vxe-switch.is--disabled.is--on .vxe-switch--button{background-color:var(--vxe-primary-lighten-color)}.vxe-switch.is--disabled.is--off .vxe-switch--button{background-color:var(--vxe-ui-switch-disabled-background-color)}.vxe-switch .vxe-switch--button{display:block;position:relative;height:1.6em;line-height:1;min-width:3.2em;padding:0 .6em;border-radius:1em;border:0;outline:0}.vxe-switch .vxe-switch--label{opacity:0;display:block;color:var(--vxe-ui-switch-font-color);font-size:.8em}.vxe-switch .vxe-switch--icon{position:absolute;top:.2em;left:0;width:1.2em;height:1.2em;border-radius:50%;background-color:var(--vxe-ui-switch-icon-background-color)}.vxe-switch .vxe-switch--label-icon{margin-right:.25em}.vxe-switch{font-size:var(--vxe-font-size)}.vxe-switch.size--medium{font-size:var(--vxe-font-size-medium)}.vxe-switch.size--small{font-size:var(--vxe-font-size-small)}.vxe-switch.size--mini{font-size:var(--vxe-font-size-mini)}
+.vxe-switch{display:inline-block;color:var(--vxe-ui-font-color);vertical-align:middle;padding:.4em;-webkit-user-select:none;-moz-user-select:none;user-select:none;text-align:center}.vxe-switch.is--animat .vxe-switch--button{transition:border-color .3s,background-color .3s}.vxe-switch.is--animat .vxe-switch--icon{transition:all .3s}.vxe-switch.is--on .vxe-switch--button{padding-right:1.7em;background-color:var(--vxe-ui-switch-open-background-color)}.vxe-switch.is--on .vxe-switch--icon{left:100%;transform:translateX(-1.4em)}.vxe-switch.is--off .vxe-switch--button{padding-left:1.7em;background-color:var(--vxe-ui-switch-close-background-color)}.vxe-switch.is--off .vxe-switch--icon{left:.2em;transform:translateX(0)}.vxe-switch.is--off .vxe-switch--label-on,.vxe-switch.is--on .vxe-switch--label-off{height:0;visibility:hidden;overflow:hidden}.vxe-switch.is--off .vxe-switch--label,.vxe-switch.is--on .vxe-switch--label{opacity:1}.vxe-switch:not(.is--disabled) .vxe-switch--button{cursor:pointer}.vxe-switch:not(.is--disabled) .vxe-switch--button:focus{box-shadow:0 0 .4em 0 var(--vxe-primary-color)}.vxe-switch.is--disabled .vxe-switch--button{cursor:no-drop}.vxe-switch.is--disabled.is--on .vxe-switch--button{background-color:var(--vxe-primary-lighten-color)}.vxe-switch.is--disabled.is--off .vxe-switch--button{background-color:var(--vxe-ui-switch-disabled-background-color)}.vxe-switch .vxe-switch--button{display:block;position:relative;height:1.6em;line-height:1;min-width:3.2em;padding:0 .6em;border-radius:1em;border:0;outline:0}.vxe-switch .vxe-switch--label{opacity:0;display:block;color:var(--vxe-ui-switch-font-color);font-size:.8em}.vxe-switch .vxe-switch--icon{position:absolute;top:.2em;left:0;width:1.2em;height:1.2em;border-radius:50%;background-color:var(--vxe-ui-switch-icon-background-color)}.vxe-switch .vxe-switch--label-icon{margin-right:.25em}.vxe-switch{font-size:var(--vxe-font-size)}.vxe-switch.size--medium{font-size:var(--vxe-font-size-medium)}.vxe-switch.size--small{font-size:var(--vxe-font-size-small)}.vxe-switch.size--mini{font-size:var(--vxe-font-size-mini)}

package/es/tab-pane/index.js

@@ -1,8 +1,10 @@
 import VxeTabPaneComponent from '../tabs/src/tab-pane';
+import { dynamicApp } from '../dynamics';
 const VxeTabPane = Object.assign({}, VxeTabPaneComponent, {
     install(app) {
         app.component(VxeTabPaneComponent.name, VxeTabPaneComponent);
     }
 });
+dynamicApp.component(VxeTabPaneComponent.name, VxeTabPaneComponent);
 export const TabPane = VxeTabPane;
 export default VxeTabPane;

package/es/tabs/index.js

@@ -1,8 +1,10 @@
 import VxeTabsComponent from './src/tabs';
+import { dynamicApp } from '../dynamics';
 const VxeTabs = Object.assign({}, VxeTabsComponent, {
     install(app) {
         app.component(VxeTabsComponent.name, VxeTabsComponent);
     }
 });
+dynamicApp.component(VxeTabsComponent.name, VxeTabsComponent);
 export const Tabs = VxeTabs;
 export default VxeTabs;

package/es/tabs/src/tabs.js

@@ -10,9 +10,14 @@ export default defineComponent({
         destroyOnClose: Boolean,
         type: String
     },
-    emits: [],
+    emits: [
+        'update:modelValue',
+        'click',
+        'change',
+        'load'
+    ],
     setup(props, context) {
-        const { slots } = context;
+        const { slots, emit } = context;
         const xID = XEUtils.uniqueId();
         const refElem = ref();
         const refHeaderElem = ref();
@@ -60,26 +65,49 @@ export default defineComponent({
                 const { type, options } = props;
                 const { staticTabs, activeName } = reactData;
                 const headerWrapperEl = refHeaderElem.value;
-                if (headerWrapperEl && !type) {
+                let lintWidth = 0;
+                let lintLeft = 0;
+                if (headerWrapperEl) {
                     const index = XEUtils.findIndexOf(staticTabs.length ? staticTabs : options, item => item.name === activeName);
                     if (index > -1) {
                         const tabEl = headerWrapperEl.children[index];
                         const tabWidth = tabEl.clientWidth;
-                        const lintWidth = Math.max(4, Math.floor(tabWidth * 0.6));
-                        reactData.lintLeft = tabEl.offsetLeft + Math.floor((tabWidth - lintWidth) / 2);
-                        reactData.lintWidth = lintWidth;
+                        if (type === 'card') {
+                            lintWidth = tabWidth + 1;
+                            lintLeft = tabEl.offsetLeft;
+                        }
+                        else if (type === 'border-card') {
+                            lintWidth = tabWidth + 1;
+                            lintLeft = tabEl.offsetLeft - 1;
+                        }
+                        else if (!type) {
+                            lintWidth = Math.max(4, Math.floor(tabWidth * 0.6));
+                            lintLeft = tabEl.offsetLeft + Math.floor((tabWidth - lintWidth) / 2);
+                        }
                     }
                 }
+                reactData.lintLeft = lintLeft;
+                reactData.lintWidth = lintWidth;
             });
         };
         const clickEvent = (evnt, item) => {
-            const { initNames } = reactData;
+            const { initNames, activeName } = reactData;
             const { name } = item;
+            let isInit = false;
+            const value = name;
             if (!initNames.includes(name)) {
+                isInit = true;
                 initNames.push(name);
             }
             reactData.activeName = name;
-            updateLineStyle();
+            emit('update:modelValue', value);
+            if (name !== activeName) {
+                emit('change', { value, name, $event: evnt });
+            }
+            emit('click', { name, $event: evnt });
+            if (isInit) {
+                emit('load', { name, $event: evnt });
+            }
         };
         const renderTabHeader = (list) => {
             const { type } = props;
@@ -94,6 +122,7 @@ export default defineComponent({
                     const { title, name, slots } = item;
                     const tabSlot = slots ? slots.tab : null;
                     return h('div', {
+                        key: name,
                         class: ['vxe-tab-header--item', {
                                 'is--active': activeName === name
                             }],
@@ -106,15 +135,13 @@ export default defineComponent({
                         }, tabSlot ? callSlot(tabSlot, { name, title }) : `${title}`)
                     ]);
                 })),
-                type
-                    ? null
-                    : h('span', {
-                        class: 'vxe-tabs-header--active-line',
-                        style: {
-                            left: `${lintLeft}px`,
-                            width: `${lintWidth}px`
-                        }
-                    })
+                h('span', {
+                    class: `vxe-tabs-header--active-line-${type || 'default'}`,
+                    style: {
+                        left: `${lintLeft}px`,
+                        width: `${lintWidth}px`
+                    }
+                })
             ]);
         };
         const renderOptionPane = (item) => {
@@ -125,6 +152,7 @@ export default defineComponent({
                 default() {
                     return name && initNames.includes(name)
                         ? h('div', {
+                            key: name,
                             class: ['vxe-tab-pane--item', {
                                     'is--visible': activeName === name
                                 }]
@@ -137,7 +165,7 @@ export default defineComponent({
             const { destroyOnClose } = props;
             const activeOptionTab = computeActiveOptionTab.value;
             if (destroyOnClose) {
-                return activeOptionTab ? renderOptionPane(activeOptionTab) : createCommentVNode();
+                return activeOptionTab ? [renderOptionPane(activeOptionTab)] : createCommentVNode();
             }
             return options.map(renderOptionPane);
         };
@@ -147,6 +175,7 @@ export default defineComponent({
             const defaultSlot = slots ? slots.default : null;
             return name && initNames.includes(name)
                 ? h('div', {
+                    key: name,
                     class: ['vxe-tab-pane--item', {
                             'is--visible': activeName === name
                         }]
@@ -157,7 +186,7 @@ export default defineComponent({
             const { destroyOnClose } = props;
             const activeDefaultTab = computeActiveDefaultTab.value;
             if (destroyOnClose) {
-                return activeDefaultTab ? renderDefaultPane(activeDefaultTab) : createCommentVNode();
+                return activeDefaultTab ? [renderDefaultPane(activeDefaultTab)] : createCommentVNode();
             }
             return staticTabs.map(renderDefaultPane);
         };
@@ -180,6 +209,8 @@ export default defineComponent({
         };
         watch(() => props.modelValue, (val) => {
             reactData.activeName = val;
+        });
+        watch(() => reactData.activeName, () => {
             updateLineStyle();
         });
         onMounted(() => {

package/es/tabs/style.css

@@ -5,13 +5,7 @@
 .vxe-tabs-header {
   position: relative;
 }
-
-.vxe-tabs-header--wrapper {
-  position: relative;
-  display: flex;
-  flex-direction: row;
-}
-.vxe-tabs-header--wrapper::after {
+.vxe-tabs-header::after {
   content: "";
   position: absolute;
   left: 0;
@@ -21,6 +15,12 @@
   background-color: #e4e7ed;
 }
 
+.vxe-tabs-header--wrapper {
+  position: relative;
+  display: flex;
+  flex-direction: row;
+}
+
 .vxe-tab-header--item {
   position: relative;
   padding: 0 16px;
@@ -30,9 +30,14 @@
   color: var(--vxe-ui-font-primary-color);
 }
 
+.vxe-tabs-header--active-line-card,
+.vxe-tabs-header--active-line-border-card,
 .vxe-tab-header--item-name {
   height: 40px;
   line-height: 40px;
+}
+
+.vxe-tab-header--item-name {
   border-bottom: 2px solid transparent;
   transition: color 0.3s ease-in-out;
 }
@@ -45,11 +50,23 @@
   display: block;
 }
 
-.vxe-tabs-header--active-line {
+.vxe-tabs-header--active-line-card,
+.vxe-tabs-header--active-line-border-card {
+  transition: all 0.3s ease-in-out;
+}
+
+.vxe-tabs-header--active-line-default,
+.vxe-tabs-header--active-line-card,
+.vxe-tabs-header--active-line-border-card {
   display: none;
 }
 
-.vxe-tabs--default .vxe-tabs-header--active-line {
+.vxe-tabs-header--active-line-border-card {
+  border-left: 1px solid #e4e7ed;
+  border-right: 1px solid #e4e7ed;
+}
+
+.vxe-tabs--default .vxe-tabs-header--active-line-default {
   display: block;
   position: absolute;
   bottom: -1px;
@@ -61,6 +78,16 @@
   transition: all 0.3s ease-in-out;
 }
 
+.vxe-tabs--card .vxe-tabs-header--active-line-card {
+  display: block;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 4px;
+  border: 1px solid var(--vxe-ui-font-primary-color);
+  pointer-events: none;
+  z-index: 1;
+}
 .vxe-tabs--card .vxe-tabs-header {
   border-top: 1px solid #e4e7ed;
   border-left: 1px solid #e4e7ed;
@@ -75,6 +102,19 @@
   border-right: 1px solid #e4e7ed;
 }
 
+.vxe-tabs--border-card .vxe-tabs-header--wrapper {
+  z-index: 2;
+}
+.vxe-tabs--border-card .vxe-tabs-header--active-line-border-card {
+  display: block;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 4px;
+  background-color: #ffffff;
+  pointer-events: none;
+  z-index: 1;
+}
 .vxe-tabs--border-card .vxe-tab-pane--item {
   border-bottom: 1px solid #e4e7ed;
   border-left: 1px solid #e4e7ed;
@@ -85,29 +125,4 @@
   border-left: 1px solid #e4e7ed;
   border-right: 1px solid #e4e7ed;
   background-color: #f5f7fa;
-}
-.vxe-tabs--border-card .vxe-tab-header--item.is--active {
-  background-color: #ffffff;
-}
-.vxe-tabs--border-card .vxe-tab-header--item.is--active::before {
-  content: "";
-  position: absolute;
-  top: 0;
-  left: -1px;
-  width: calc(100% + 2px);
-  height: 100%;
-  border-left: 1px solid #e4e7ed;
-  border-right: 1px solid #e4e7ed;
-  pointer-events: none;
-}
-.vxe-tabs--border-card .vxe-tab-header--item.is--active::after {
-  content: "";
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  width: 100%;
-  height: 1px;
-  background-color: var(--vxe-ui-layout-background-color);
-  pointer-events: none;
-  z-index: 1;
 }

package/es/tabs/style.min.css

@@ -1 +1 @@
-.vxe-tabs{background-color:var(--vxe-ui-layout-background-color)}.vxe-tabs-header{position:relative}.vxe-tabs-header--wrapper{position:relative;display:flex;flex-direction:row}.vxe-tabs-header--wrapper::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background-color:#e4e7ed}.vxe-tab-header--item{position:relative;padding:0 16px;cursor:pointer}.vxe-tab-header--item.is--active{color:var(--vxe-ui-font-primary-color)}.vxe-tab-header--item-name{height:40px;line-height:40px;border-bottom:2px solid transparent;transition:color .3s ease-in-out}.vxe-tab-pane--item{display:none;padding:var(--vxe-ui-layout-padding-default)}.vxe-tab-pane--item.is--visible{display:block}.vxe-tabs-header--active-line{display:none}.vxe-tabs--default .vxe-tabs-header--active-line{display:block;position:absolute;bottom:-1px;left:0;height:2px;width:4px;background-color:var(--vxe-ui-font-primary-color);z-index:1;transition:all .3s ease-in-out}.vxe-tabs--card .vxe-tabs-header{border-top:1px solid #e4e7ed;border-left:1px solid #e4e7ed}.vxe-tabs--card .vxe-tab-header--item{border-left:1px solid #e4e7ed}.vxe-tabs--card .vxe-tab-header--item:first-child{border-left:0}.vxe-tabs--card .vxe-tab-header--item:last-child{border-right:1px solid #e4e7ed}.vxe-tabs--border-card .vxe-tab-pane--item{border-bottom:1px solid #e4e7ed;border-left:1px solid #e4e7ed;border-right:1px solid #e4e7ed}.vxe-tabs--border-card .vxe-tabs-header{border-top:1px solid #e4e7ed;border-left:1px solid #e4e7ed;border-right:1px solid #e4e7ed;background-color:#f5f7fa}.vxe-tabs--border-card .vxe-tab-header--item.is--active{background-color:#fff}.vxe-tabs--border-card .vxe-tab-header--item.is--active::before{content:"";position:absolute;top:0;left:-1px;width:calc(100% + 2px);height:100%;border-left:1px solid #e4e7ed;border-right:1px solid #e4e7ed;pointer-events:none}.vxe-tabs--border-card .vxe-tab-header--item.is--active::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:1px;background-color:var(--vxe-ui-layout-background-color);pointer-events:none;z-index:1}
+.vxe-tabs{background-color:var(--vxe-ui-layout-background-color)}.vxe-tabs-header{position:relative}.vxe-tabs-header::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background-color:#e4e7ed}.vxe-tabs-header--wrapper{position:relative;display:flex;flex-direction:row}.vxe-tab-header--item{position:relative;padding:0 16px;cursor:pointer}.vxe-tab-header--item.is--active{color:var(--vxe-ui-font-primary-color)}.vxe-tab-header--item-name,.vxe-tabs-header--active-line-border-card,.vxe-tabs-header--active-line-card{height:40px;line-height:40px}.vxe-tab-header--item-name{border-bottom:2px solid transparent;transition:color .3s ease-in-out}.vxe-tab-pane--item{display:none;padding:var(--vxe-ui-layout-padding-default)}.vxe-tab-pane--item.is--visible{display:block}.vxe-tabs-header--active-line-border-card,.vxe-tabs-header--active-line-card{transition:all .3s ease-in-out}.vxe-tabs-header--active-line-border-card,.vxe-tabs-header--active-line-card,.vxe-tabs-header--active-line-default{display:none}.vxe-tabs-header--active-line-border-card{border-left:1px solid #e4e7ed;border-right:1px solid #e4e7ed}.vxe-tabs--default .vxe-tabs-header--active-line-default{display:block;position:absolute;bottom:-1px;left:0;height:2px;width:4px;background-color:var(--vxe-ui-font-primary-color);z-index:1;transition:all .3s ease-in-out}.vxe-tabs--card .vxe-tabs-header--active-line-card{display:block;position:absolute;top:0;left:0;width:4px;border:1px solid var(--vxe-ui-font-primary-color);pointer-events:none;z-index:1}.vxe-tabs--card .vxe-tabs-header{border-top:1px solid #e4e7ed;border-left:1px solid #e4e7ed}.vxe-tabs--card .vxe-tab-header--item{border-left:1px solid #e4e7ed}.vxe-tabs--card .vxe-tab-header--item:first-child{border-left:0}.vxe-tabs--card .vxe-tab-header--item:last-child{border-right:1px solid #e4e7ed}.vxe-tabs--border-card .vxe-tabs-header--wrapper{z-index:2}.vxe-tabs--border-card .vxe-tabs-header--active-line-border-card{display:block;position:absolute;top:0;left:0;width:4px;background-color:#fff;pointer-events:none;z-index:1}.vxe-tabs--border-card .vxe-tab-pane--item{border-bottom:1px solid #e4e7ed;border-left:1px solid #e4e7ed;border-right:1px solid #e4e7ed}.vxe-tabs--border-card .vxe-tabs-header{border-top:1px solid #e4e7ed;border-left:1px solid #e4e7ed;border-right:1px solid #e4e7ed;background-color:#f5f7fa}

package/es/textarea/index.js

@@ -5,6 +5,6 @@ export const VxeTextarea = Object.assign(VxeTextareaComponent, {
         app.component(VxeTextareaComponent.name, VxeTextareaComponent);
     }
 });
-export const Textarea = VxeTextarea;
 dynamicApp.component(VxeTextareaComponent.name, VxeTextareaComponent);
+export const Textarea = VxeTextarea;
 export default VxeTextarea;

package/es/textarea/style.css

@@ -14,7 +14,7 @@
   outline: 0;
   font-size: inherit;
   padding: 0 0.6em;
-  color: var(--vxe-font-color);
+  color: var(--vxe-ui-font-color);
   line-height: inherit;
   border: 1px solid var(--vxe-ui-input-border-color);
   background-color: var(--vxe-ui-textarea-background-color);
@@ -38,7 +38,7 @@
 .vxe-textarea--inner,
 .vxe-textarea--autosize {
   line-height: var(--vxe-ui-textarea-line-height);
-  color: var(--vxe-font-color);
+  color: var(--vxe-ui-font-color);
   font-family: var(--vxe-font-family);
 }
 

package/es/textarea/style.min.css

@@ -1 +1 @@
-.vxe-textarea{position:relative;display:inline-block}.vxe-textarea:not(.def--cols){width:100%}.vxe-textarea:not(.def--cols) .vxe-textarea--inner{width:100%}.vxe-textarea--inner{border-radius:var(--vxe-border-radius);outline:0;font-size:inherit;padding:0 .6em;color:var(--vxe-font-color);line-height:inherit;border:1px solid var(--vxe-ui-input-border-color);background-color:var(--vxe-ui-textarea-background-color);display:block;padding:.3em .6em}.vxe-textarea--inner::-moz-placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner::placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner:focus{border:1px solid var(--vxe-primary-color)}.vxe-textarea--inner[disabled]{cursor:not-allowed;background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-textarea--autosize,.vxe-textarea--inner{line-height:var(--vxe-ui-textarea-line-height);color:var(--vxe-font-color);font-family:var(--vxe-font-family)}.vxe-textarea--autosize{display:block;position:fixed;top:0;left:0;width:100%;margin:0;padding:.3em .6em;word-wrap:break-word;white-space:pre-wrap;z-index:-1;visibility:hidden}.vxe-textarea--count{position:absolute;bottom:.2em;right:1.4em;padding-left:.2em;color:var(--vxe-ui-input-count-color);background-color:var(--vxe-ui-input-count-background-color)}.vxe-textarea--count.is--error{color:var(--vxe-ui-input-count-error-color)}.vxe-textarea,.vxe-textarea--autosize{font-size:var(--vxe-font-size)}.vxe-textarea--autosize.size--medium,.vxe-textarea.size--medium{font-size:var(--vxe-font-size-medium)}.vxe-textarea--autosize.size--small,.vxe-textarea.size--small{font-size:var(--vxe-font-size-small)}.vxe-textarea--autosize.size--mini,.vxe-textarea.size--mini{font-size:var(--vxe-font-size-mini)}.vxe-textarea:not(.is--autosize){min-height:var(--vxe-ui-input-height-default)}.vxe-textarea.size--medium{font-size:var(--vxe-font-size-medium)}.vxe-textarea.size--medium:not(.is--autosize){min-height:var(--vxe-ui-input-height-medium)}.vxe-textarea.size--small:not(.is--autosize){min-height:var(--vxe-ui-input-height-small)}.vxe-textarea.size--mini:not(.is--autosize){min-height:var(--vxe-ui-input-height-mini)}
+.vxe-textarea{position:relative;display:inline-block}.vxe-textarea:not(.def--cols){width:100%}.vxe-textarea:not(.def--cols) .vxe-textarea--inner{width:100%}.vxe-textarea--inner{border-radius:var(--vxe-border-radius);outline:0;font-size:inherit;padding:0 .6em;color:var(--vxe-ui-font-color);line-height:inherit;border:1px solid var(--vxe-ui-input-border-color);background-color:var(--vxe-ui-textarea-background-color);display:block;padding:.3em .6em}.vxe-textarea--inner::-moz-placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner::placeholder{color:var(--vxe-ui-input-placeholder-color)}.vxe-textarea--inner:focus{border:1px solid var(--vxe-primary-color)}.vxe-textarea--inner[disabled]{cursor:not-allowed;background-color:var(--vxe-ui-input-disabled-background-color)}.vxe-textarea--autosize,.vxe-textarea--inner{line-height:var(--vxe-ui-textarea-line-height);color:var(--vxe-ui-font-color);font-family:var(--vxe-font-family)}.vxe-textarea--autosize{display:block;position:fixed;top:0;left:0;width:100%;margin:0;padding:.3em .6em;word-wrap:break-word;white-space:pre-wrap;z-index:-1;visibility:hidden}.vxe-textarea--count{position:absolute;bottom:.2em;right:1.4em;padding-left:.2em;color:var(--vxe-ui-input-count-color);background-color:var(--vxe-ui-input-count-background-color)}.vxe-textarea--count.is--error{color:var(--vxe-ui-input-count-error-color)}.vxe-textarea,.vxe-textarea--autosize{font-size:var(--vxe-font-size)}.vxe-textarea--autosize.size--medium,.vxe-textarea.size--medium{font-size:var(--vxe-font-size-medium)}.vxe-textarea--autosize.size--small,.vxe-textarea.size--small{font-size:var(--vxe-font-size-small)}.vxe-textarea--autosize.size--mini,.vxe-textarea.size--mini{font-size:var(--vxe-font-size-mini)}.vxe-textarea:not(.is--autosize){min-height:var(--vxe-ui-input-height-default)}.vxe-textarea.size--medium{font-size:var(--vxe-font-size-medium)}.vxe-textarea.size--medium:not(.is--autosize){min-height:var(--vxe-ui-input-height-medium)}.vxe-textarea.size--small:not(.is--autosize){min-height:var(--vxe-ui-input-height-small)}.vxe-textarea.size--mini:not(.is--autosize){min-height:var(--vxe-ui-input-height-mini)}

package/es/tooltip/index.js

@@ -1,8 +1,10 @@
 import VxeTooltipComponent from './src/tooltip';
+import { dynamicApp } from '../dynamics';
 const VxeTooltip = Object.assign({}, VxeTooltipComponent, {
     install(app) {
         app.component(VxeTooltipComponent.name, VxeTooltipComponent);
     }
 });
+dynamicApp.component(VxeTooltipComponent.name, VxeTooltipComponent);
 export const Tooltip = VxeTooltip;
 export default VxeTooltip;

package/es/tooltip/src/tooltip.js

@@ -306,19 +306,14 @@ export default defineComponent({
                     onMouseleave: wrapperMouseleaveEvent
                 };
             }
-            return h('div', {
-                ref: refElem,
-                class: ['vxe-table--tooltip-wrapper', `theme--${theme}`, popupClassName ? (XEUtils.isFunction(popupClassName) ? popupClassName({ $tooltip: $xetooltip }) : popupClassName) : '', {
+            return h('div', Object.assign({ ref: refElem, class: ['vxe-table--tooltip-wrapper', `theme--${theme}`, popupClassName ? (XEUtils.isFunction(popupClassName) ? popupClassName({ $tooltip: $xetooltip }) : popupClassName) : '', {
                         [`size--${vSize}`]: vSize,
                         [`placement--${tipStore.placement}`]: tipStore.placement,
                         'is--enterable': enterable,
                         'is--visible': visible,
                         'is--arrow': isArrow,
                         'is--active': tipActive
-                    }],
-                style: tipStore.style,
-                ...ons
-            }, [
+                    }], style: tipStore.style }, ons), [
                 renderContent(),
                 h('div', {
                     class: 'vxe-table--tooltip-arrow',

package/es/ui/src/core.js

@@ -32,7 +32,7 @@ export function setIcon(options) {
 export function getIcon(key) {
     return arguments.length ? XEUtils.get(iconConfigStore, key) : iconConfigStore;
 }
-export const version = "0.2.0";
+export const version = "0.4.0";
 const VxeCore = {
     version,
     setConfig,

package/es/ui/src/globalStore.js

@@ -5,23 +5,19 @@ const globalConfigStore = {
     zIndex: 999,
     emptyCell: '　',
     loadingText: '',
+    resizeInterval: 500,
     i18n: (key) => key,
-    tooltip: {
-        // size: null,
-        trigger: 'hover',
-        theme: 'dark',
-        enterDelay: 500,
-        leaveDelay: 300
-    },
-    pager: {
-    // size: null,
-    // autoHidden: false,
-    // perfect: true,
-    // pageSize: 10,
-    // pagerCount: 7,
-    // pageSizes: [10, 15, 20, 50, 100],
-    // layouts: ['PrevJump', 'PrevPage', 'Jump', 'PageCount', 'NextPage', 'NextJump', 'Sizes', 'Total']
-    },
+    anchor: {},
+    anchorLink: {},
+    breadcrumb: {
+        separator: '/'
+    },
+    breadcrumbItem: {},
+    button: {},
+    buttonGroup: {},
+    checkbox: {},
+    checkboxGroup: {},
+    col: {},
     form: {
         // preventSubmit: false,
         // size: null,
@@ -35,6 +31,10 @@ const globalConfigStore = {
         },
         titleAsterisk: true
     },
+    formDesign: {},
+    formGather: {},
+    formItem: {},
+    icon: {},
     input: {
         // size: null,
         // transfer: false
@@ -48,49 +48,21 @@ const globalConfigStore = {
         digits: 2,
         controls: true
     },
-    textarea: {
-    // size: null,
-    // autosize: {
-    //   minRows: 1,
-    //   maxRows: 10
-    // }
-    },
-    select: {
-        // size: null,
-        // transfer: false,
-        // optionConfig: {
-        //   keyField: '_X_OPTION_KEY'
-        // },
-        multiCharOverflow: 8
-    },
-    button: {
-    // size: null,
-    // transfer: false
-    },
-    buttonGroup: {
-    // size: null
-    },
-    radio: {
-        // size: null,
-        strict: true
-    },
-    radioButton: {
-        // size: null,
-        strict: true
-    },
-    radioGroup: {
+    layoutAside: {},
+    layoutBody: {},
+    layoutContainer: {},
+    layoutFooter: {},
+    layoutHeader: {},
+    listDesign: {},
+    list: {
         // size: null,
-        strict: true
-    },
-    checkbox: {
-    // size: null
-    },
-    checkboxGroup: {
-    // size: null
-    },
-    switch: {
-    // size: null
+        scrollY: {
+            enabled: true,
+            gt: 100
+            // oSize: 0
+        }
     },
+    loading: {},
     modal: {
         // size: null,
         top: 15,
@@ -109,15 +81,41 @@ const globalConfigStore = {
         // storage: false,
         storageKey: 'VXE_MODAL_POSITION'
     },
-    list: {
-        // size: null,
-        scrollY: {
-            enabled: true,
-            gt: 100
-            // oSize: 0
-        }
+    optgroup: {},
+    option: {},
+    pager: {
+    // size: null,
+    // autoHidden: false,
+    // perfect: true,
+    // pageSize: 10,
+    // pagerCount: 7,
+    // pageSizes: [10, 15, 20, 50, 100],
+    // layouts: ['PrevJump', 'PrevPage', 'Jump', 'PageCount', 'NextPage', 'NextJump', 'Sizes', 'Total']
+    },
+    pulldown: {},
+    radio: {
+        strict: true
+    },
+    radioButton: {
+        strict: true
+    },
+    radioGroup: {
+        strict: true
     },
-    breadcrumb: {},
-    formDesign: {}
+    row: {},
+    select: {
+        multiCharOverflow: 8
+    },
+    switch: {},
+    tabPane: {},
+    tabs: {},
+    textarea: {},
+    tooltip: {
+        // size: null,
+        trigger: 'hover',
+        theme: 'dark',
+        enterDelay: 500,
+        leaveDelay: 300
+    }
 };
 export default globalConfigStore;

package/es/ui/src/log.js

@@ -1,6 +1,6 @@
 import { getI18n } from './i18n';
 export function getLog(message, params) {
-    return `[vxe-table v${"0.2.0"}] ${getI18n(message, params)}`;
+    return `[vxe-table v${"0.4.0"}] ${getI18n(message, params)}`;
 }
 function outLog(type) {
     return function (message, params) {