@vtj/ui 0.0.6 → 0.4.0

package/lib/style.css

@@ -1 +1 @@
-.x-test-suit{width:100%;height:100%;border:1px solid #ccc}.x-test-suit__header{padding:5px 10px;background-color:#efefef}.x-test-suit__body{padding:10px}
+div::-webkit-scrollbar{z-index:11;width:6px}div::-webkit-scrollbar:horizontal{height:6px}div::-webkit-scrollbar-thumb{border-radius:5px;width:6px;background:var(--el-text-color-disabled)}div::-webkit-scrollbar-corner{background:var(--el-fill-color-blank)}div::-webkit-scrollbar-track{background:var(--el-fill-color-blank)}div::-webkit-scrollbar-track-piece{background:var(--el-fill-color-blank);width:6px}body.is-dragging,body.is-resizing{user-select:none}body.is-dragging iframe,body.is-resizing iframe{user-select:none;pointer-events:none}:root{--el-x-block-background: #fafafa;--el-x-block-padding: 10px;--el-x-block-radius: 4px;--el-x-block-border: 1px solid #e4e7ed;--el-x-block-split: 10px}.x-block{flex-shrink:0}.x-block.is-flex{display:flex}.x-block.is-background{background-color:var(--el-x-block-background)}.x-block.is-split-column>.x-block+.x-block{margin-top:10px}.x-block.is-split-row>.x-block+.x-block{margin-left:10px}.x-block.is-padding{padding:var(--el-x-block-padding);box-sizing:border-box}.x-block.is-radius{border-radius:var(--el-x-block-radius)}.x-block.is-border{border:var(--el-x-block-border)}.x-block.is-fit{width:100%;height:100%}.x-block.is-row{flex-direction:row}.x-block.is-column{flex-direction:column}.x-block.is-row-reverse{flex-direction:row-reverse}.x-block.is-column-reverse{flex-direction:column-reverse}.x-block.is-overflow-auto{overflow:auto}.x-block.is-overflow-hidden{overflow:hidden}.x-block.is-overflow-visible{overflow:visible}.x-block.is-grow{flex-grow:1}.x-block.is-grow-height{height:1px}.x-block.is-grow-width{width:1px}.x-block.is-shrink{flex-shrink:1}.x-block.is-wrap{flex-wrap:wrap}.x-block.is-nowrap{flex-wrap:nowrap}.x-block.is-wrap-reverse{flex-wrap:wrap-reverse}.x-block.is-justify-center{justify-content:center}.x-block.is-justify-start{justify-content:flex-start}.x-block.is-justify-end{justify-content:flex-end}.x-block.is-justify-between{justify-content:space-between}.x-block.is-justify-around{justify-content:space-around}.x-block.is-align-baseline{align-items:baseline}.x-block.is-align-center{align-items:center}.x-block.is-align-start{align-items:flex-start}.x-block.is-align-end{align-items:flex-end}:root{--el-x-page-background: #ffffff}.x-page{background-color:var(--el-x-page-background)}.x-page *{box-sizing:border-box}.x-icon{line-height:1}.x-icon.is-pointer{cursor:pointer}.x-icon.is-pointer:hover{opacity:.7}.x-icon img{width:100%;height:100%;transform:translateY(1px)}.x-icon+.x-icon{margin-left:10px}:root{--el-x-text-color: var(--el-text-color-regular);--el-x-text-color-primary: var(--el-text-color-primary);--el-x-text-font-size: var(--el-font-size-base)}.x-text{line-height:1.5;padding:0;margin:0;font-size:var(--el-x-text-font-size);color:var(--el-x-text-color);font-family:var(--el-font-family)}.x-text+.x-text{margin-top:.5em}.x-text.is-indent{text-indent:2em}.x-text.is-secondary{color:var(--el-text-color-secondary)}.x-text.is-type-h1{font-weight:700;font-size:var(--el-font-size-extra-large);color:var(--el-x-text-color-primary)}.x-text.is-type-h2{font-weight:700;font-size:var(--el-font-size-large);color:var(--el-x-text-color-primary)}.x-text.is-type-h3{font-weight:700;font-size:var(--el-font-size-medium);color:var(--el-x-text-color-primary)}.x-text.is-type-h4{font-weight:700;font-size:var(--el-font-size-base);color:var(--el-x-text-color-primary)}.x-text.is-type-h5{font-weight:700;font-size:var(--el-font-size-small);color:var(--el-x-text-color-primary)}.x-text.is-type-h6{font-weight:700;font-size:var(--el-font-size-extra-small);color:var(--el-x-text-color-primary)}.x-text.is-type-strong{font-weight:700}.x-text.is-type-ol,.x-text.is-type-ul{margin-left:3em}.x-text.is-type-li+.x-text.is-type-li{margin-top:0}.x-text.is-placeholder{color:var(--el-text-color-placeholder)}.x-text.is-disabled{color:var(--el-text-color-disabled)}:root{--el-x-tool-hover: rgba(0, 0, 0, .1);--el-x-tool-color: var(--el-text-color-regular);--el-x-tool-hover-radius: 4px;--el-x-tool-hover-padding: 5px}.x-tool{display:inline-block;vertical-align:middle}.x-tool+.x-tool{margin-left:5px}.x-tool__trigger{outline:none!important;line-height:1}.x-tool__trigger.is-icon{padding:var(--el-x-tool-hover-padding);border-radius:var(--el-x-tool-hover-radius);cursor:pointer;color:var(--el-x-tool-color);line-height:0}.x-tool__trigger.is-icon:hover{background-color:var(--el-x-tool-hover);opacity:.9}.x-tool__trigger.is-disabled{opacity:.5;cursor:not-allowed}.x-tool__inner{display:inline-flex;align-content:center;align-items:center}.x-tool__inner>.x-icon+span{margin-left:5px}.x-tool__label{line-height:1}.x-tool__menu{display:flex;flex-direction:row;justify-content:space-between;padding:2px 8px!important}.x-tool__menu.el-dropdown-menu__item--divided{margin:0}.x-tool__menu.is-active{background-color:var(--el-dropdown-menuItem-hover-fill);color:var(--el-dropdown-menuItem-hover-color)}.x-tool__item{flex-grow:1}.x-tool__close{margin-left:10px;transform:translate(5px);padding:2px;font-size:16px;cursor:pointer}.x-tool__close:hover{background-color:#0000001a;border-radius:100%;color:#000c}:root{--el-x-panel-padding-small: 5px}.x-panel{background-color:#fff}.x-panel__header{--el-x-block-padding: 8px 10px}.x-panel__title{display:flex;justify-content:flex-start;align-items:center;line-height:1;white-space:nowrap;text-overflow:ellipsis}.x-panel__icon{margin-right:5px}.x-panel.is-small{--el-x-block-padding: var(--el-x-panel-padding-small);--el-x-tool-hover-padding: 3px}.x-panel.is-small>.x-panel__header{--el-x-block-padding: var(--el-x-panel-padding-small)}.x-panel.is-shadow-always,.x-panel.is-shadow-hover:hover{box-shadow:var(--el-box-shadow-lighter)}.x-toolbar__divider+.x-toolbar__divider{display:none}.x-toolbar__divider:first-child{display:none}:root{--el-x-dialog-newpearl-color: #0068c8}.x-dialog{border-top-width:0!important;position:absolute;pointer-events:initial;overflow:hidden}.x-dialog>.x-panel__header{color:#303133;--el-x-tool-color: #303133;border-bottom:1px solid #f2f6fc}.x-dialog>.x-panel__header>.x-toolbar{font-size:12px}.x-dialog>.x-panel__header>.x-toolbar>.x-tool__trigger{line-height:1}.x-dialog>.x-panel__body{height:1px}.x-dialog>.x-panel__footer{border-top:1px solid #f2f6fc}.x-dialog.is-theme-newpearl{--el-x-block-border: 2px solid var(--el-x-dialog-newpearl-color);--el-x-block-background: var(--el-x-dialog-newpearl-color)}.x-dialog.is-theme-newpearl>.x-panel__header{color:#fff;--el-x-tool-color: #ffffff;border-bottom:1px solid var(--el-x-dialog-newpearl-color)}.x-dialog.is-draggable>.x-panel__header{cursor:move}.x-dialog.is-maximized{width:100%!important;height:100%!important;left:0!important;top:0!important}.x-dialog.is-resizing iframe,.x-dialog.is-dragging iframe{pointer-events:none}.x-dialog__wrapper{position:absolute;width:100vw;height:100vh;left:0;top:0;z-index:1000;pointer-events:none;overflow:hidden}.x-dialog__modal{pointer-events:initial;position:absolute;width:100vw;height:100vh;left:0;top:0;background-color:#0000000d}.x-dialog__frame{width:100%;height:100%;border:none}.x-dialog__main{width:100%;height:100%}.x-dialog__action{overflow:hidden;white-space:nowrap}:root{--el-x-wrapper-background: #ffffff;--el-x-wrapper-fixed-background: rgba(255, 255, 255, .5)}.x-wrapper{position:relative}.x-wrapper__fixed{position:absolute;z-index:1;left:0;width:100%;background-color:var(--el-x-wrapper-fixed-background);backdrop-filter:saturate(50%) blur(5px);-webkit-backdrop-filter:saturate(50%) blur(5px)}.x-wrapper__fixed.is-fixed-top{top:0}.x-wrapper__fixed.is-fixed-bottom{bottom:0}.x-wrapper__fixed.is-fixed-none{position:static}.x-wrapper__body{width:100%;height:100%;background-color:var(--el-x-wrapper-background)}.x-wrapper__body.is-fixed-none{height:auto}.x-container.is-split-border{border-right:none;border-bottom:none}.x-container.is-fit .x-container__row{height:100%}.x-container__col.is-split{border:var(--el-x-block-border);border-left:none;border-top:none}.x-field__error{--el-x-tool-hover-padding: 3px;--el-x-tool-color: #f56c6c;position:absolute;right:0;width:18px;height:18px;font-size:12px;transition:none}.x-field.is-has-extra .el-form-item__content{flex-wrap:nowrap}.x-field .el-select,.x-field .el-date-editor,.x-field .el-cascader{width:100%}.x-form{color:var(--el-x-form-color)}.x-form .el-form--inline .el-form-item{margin-right:0}.x-form .el-form-item--small{margin-bottom:10px}.x-help__inner{padding:10px}:root{--el-x-cron-color: #333}.x-cron{color:var(--el-x-cron-color)}

package/package.json

@@ -1,55 +1,46 @@
 {
   "name": "@vtj/ui",
   "private": false,
-  "version": "0.0.6",
+  "version": "0.4.0",
   "type": "module",
   "scripts": {
+    "setup": "pnpm install --registry=https://registry.npmmirror.com",
     "dev": "cross-env ENV_TYPE=dev vite",
-    "build": "vue-tsc --noEmit && cross-env ENV_TYPE=prod vite build && npm run build:cdn",
-    "build:cdn": "vue-tsc --noEmit && cross-env ENV_TYPE=prod CDN=true vite build",
-    "preview": "vite preview",
-    "deploy:major": "npm run build && npm version major && npm publish --access public",
-    "deploy:minor": "npm run build && npm version minor && npm publish --access public",
-    "deploy:patch": "npm run build && npm version patch && npm publish --access public"
+    "build": "vue-tsc --noEmit && vite build && pnpm run build:cdn",
+    "build:cdn": "vue-tsc --noEmit && cross-env CDN=true vite build",
+    "build:dts": "rimraf ./types && vue-tsc --declaration --emitDeclarationOnly",
+    "test:unit": "vitest --environment jsdom",
+    "coverage": "vitest run --coverage --environment jsdom"
+  },
+  "engines": {
+    "node": ">=16.0.0"
   },
   "dependencies": {
-    "@vtj/utils": "^0.0.6",
-    "echarts": "^5.3.3",
-    "element-plus": "^2.2.14"
+    "@vtj/deps": "0.3.8",
+    "@vtj/icons": "0.0.3",
+    "@vtj/utils": "0.3.8"
   },
   "devDependencies": {
-    "@babel/types": "^7.18.10",
-    "@types/lodash-es": "^4.17.6",
-    "@types/node": "^18.7.8",
-    "@vitejs/plugin-legacy": "^2.0.1",
-    "@vitejs/plugin-vue": "^3.0.3",
-    "@vitejs/plugin-vue-jsx": "^2.0.0",
-    "cross-env": "^7.0.3",
-    "rollup-plugin-external-globals": "^0.6.1",
-    "sass": "^1.54.5",
-    "typescript": "^4.7.4",
-    "unplugin-element-plus": "^0.4.1",
-    "vite": "^3.0.7",
-    "vite-plugin-dts": "^1.4.1",
-    "vue": "^3.2.37",
-    "vue-router": "^4.1.3",
-    "vue-tsc": "^0.39.5",
-    "@vueuse/core": "^9.1.0"
+    "@vtj/cli": "0.3.7"
   },
   "files": [
     "lib",
     "types",
-    "src"
+    "cdn"
   ],
-  "main": "lib/index.umd.js",
-  "module": "lib/index.es.js",
+  "main": "lib/index.js",
+  "module": "lib/index.js",
   "types": "types/index.d.ts",
   "exports": {
     "./lib/style.css": "./lib/style.css",
     ".": {
       "types": "./types/index.d.ts",
-      "import": "./lib/index.es.js",
-      "require": "./lib/index.cjs.js"
+      "import": "./lib/index.js",
+      "require": "./lib/index.js"
     }
-  }
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "gitHead": "117025d35e5a9660bc17d158c32bfd638e0eeac8"
 }

package/types/components/block/Block.vue.d.ts

@@ -0,0 +1,143 @@
+import { BlockWrap, BlockOverflow } from '../..';
+import { DefineComponent, PropType, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes } from 'vue';
+import { BlockDirection } from './block';
+declare const _default: __VLS_WithTemplateSlots<DefineComponent<{
+    flex: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    width: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    height: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    direction: {
+        type: PropType<BlockDirection>;
+        default: string;
+    };
+    grow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    shrink: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    wrap: {
+        type: PropType<BlockWrap>;
+        default: string;
+    };
+    justify: {
+        type: StringConstructor;
+        default: string;
+    };
+    align: {
+        type: StringConstructor;
+        default: string;
+    };
+    border: {
+        type: BooleanConstructor;
+    };
+    radius: {
+        type: BooleanConstructor;
+    };
+    background: {
+        type: BooleanConstructor;
+    };
+    split: {
+        type: BooleanConstructor;
+    };
+    fit: {
+        type: BooleanConstructor;
+    };
+    overflow: {
+        type: PropType<BlockOverflow>;
+        default: string;
+    };
+    padding: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
+    flex: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    width: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    height: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    direction: {
+        type: PropType<BlockDirection>;
+        default: string;
+    };
+    grow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    shrink: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    wrap: {
+        type: PropType<BlockWrap>;
+        default: string;
+    };
+    justify: {
+        type: StringConstructor;
+        default: string;
+    };
+    align: {
+        type: StringConstructor;
+        default: string;
+    };
+    border: {
+        type: BooleanConstructor;
+    };
+    radius: {
+        type: BooleanConstructor;
+    };
+    background: {
+        type: BooleanConstructor;
+    };
+    split: {
+        type: BooleanConstructor;
+    };
+    fit: {
+        type: BooleanConstructor;
+    };
+    overflow: {
+        type: PropType<BlockOverflow>;
+        default: string;
+    };
+    padding: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>>, {
+    wrap: BlockWrap;
+    flex: boolean;
+    direction: BlockDirection;
+    grow: boolean;
+    shrink: boolean;
+    justify: string;
+    align: string;
+    border: boolean;
+    radius: boolean;
+    background: boolean;
+    split: boolean;
+    fit: boolean;
+    overflow: BlockOverflow;
+    padding: boolean;
+}, {}>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/types/components/block/block.d.ts

@@ -0,0 +1,68 @@
+import { ExtractPropTypes, PropType } from 'vue';
+import type Block from './Block.vue';
+export type BlockDirection = 'column' | 'row' | 'column-reverse' | 'row-reverse';
+export type BlockWrap = 'initial' | 'wrap' | 'nowrap' | 'wrap-reverse';
+export type BlockJustifyContent = 'center' | 'around' | 'between' | 'start' | 'end';
+export type BlockAlignItems = 'center' | 'stretch' | 'start' | 'end';
+export type BlockOverflow = 'auto' | 'hidden' | 'visible' | 'scroll';
+export declare const blockProps: {
+    flex: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    width: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    height: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    direction: {
+        type: PropType<BlockDirection>;
+        default: string;
+    };
+    grow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    shrink: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    wrap: {
+        type: PropType<BlockWrap>;
+        default: string;
+    };
+    justify: {
+        type: StringConstructor;
+        default: string;
+    };
+    align: {
+        type: StringConstructor;
+        default: string;
+    };
+    border: {
+        type: BooleanConstructor;
+    };
+    radius: {
+        type: BooleanConstructor;
+    };
+    background: {
+        type: BooleanConstructor;
+    };
+    split: {
+        type: BooleanConstructor;
+    };
+    fit: {
+        type: BooleanConstructor;
+    };
+    overflow: {
+        type: PropType<BlockOverflow>;
+        default: string;
+    };
+    padding: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+};
+export type BlockProps = Partial<ExtractPropTypes<typeof blockProps>>;
+export type BlockInstance = InstanceType<typeof Block>;

package/types/components/block/index.d.ts

@@ -0,0 +1,319 @@
+import { BlockWrap, BlockDirection, BlockOverflow } from './block';
+import { ComponentInternalInstance, VNodeRef, VNode, RendererNode, RendererElement, Slot, ComponentPublicInstance, ComponentOptionsBase, ExtractPropTypes, PropType, ComponentOptionsMixin, DebuggerEvent, nextTick, WatchOptions, WatchStopHandle, ShallowUnwrapRef, ComponentCustomProperties, VNodeProps, AllowedComponentProps, ComponentCustomProps } from 'vue';
+import { WithInstall } from '../../utils';
+import Block from './Block.vue';
+export declare const XBlock: WithInstall<{
+    new (...args: any[]): {
+        $: ComponentInternalInstance;
+        $data: {};
+        $props: {
+            wrap?: BlockWrap | undefined;
+            flex?: boolean | undefined;
+            direction?: BlockDirection | undefined;
+            grow?: boolean | undefined;
+            shrink?: boolean | undefined;
+            justify?: string | undefined;
+            align?: string | undefined;
+            border?: boolean | undefined;
+            radius?: boolean | undefined;
+            background?: boolean | undefined;
+            split?: boolean | undefined;
+            fit?: boolean | undefined;
+            overflow?: BlockOverflow | undefined;
+            padding?: boolean | undefined;
+            readonly width?: string | number | undefined;
+            readonly height?: string | number | undefined;
+            key?: string | number | symbol | undefined;
+            ref?: VNodeRef | undefined;
+            ref_for?: boolean | undefined;
+            ref_key?: string | undefined;
+            onVnodeBeforeMount?: ((vnode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeMounted?: ((vnode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeBeforeUpdate?: ((vnode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeUpdated?: ((vnode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeBeforeUnmount?: ((vnode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeUnmounted?: ((vnode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: VNode<RendererNode, RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            class?: unknown;
+            style?: unknown;
+        };
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: Slot<any> | undefined;
+        }>;
+        $root: ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null;
+        $parent: ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null;
+        $emit: (event: string, ...args: any[]) => void;
+        $el: any;
+        $options: ComponentOptionsBase<Readonly<ExtractPropTypes<{
+            flex: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            width: {
+                type: (StringConstructor | NumberConstructor)[];
+            };
+            height: {
+                type: (StringConstructor | NumberConstructor)[];
+            };
+            direction: {
+                type: PropType<BlockDirection>;
+                default: string;
+            };
+            grow: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            shrink: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            wrap: {
+                type: PropType<BlockWrap>;
+                default: string;
+            };
+            justify: {
+                type: StringConstructor;
+                default: string;
+            };
+            align: {
+                type: StringConstructor;
+                default: string;
+            };
+            border: {
+                type: BooleanConstructor;
+            };
+            radius: {
+                type: BooleanConstructor;
+            };
+            background: {
+                type: BooleanConstructor;
+            };
+            split: {
+                type: BooleanConstructor;
+            };
+            fit: {
+                type: BooleanConstructor;
+            };
+            overflow: {
+                type: PropType<BlockOverflow>;
+                default: string;
+            };
+            padding: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, {
+            wrap: BlockWrap;
+            flex: boolean;
+            direction: BlockDirection;
+            grow: boolean;
+            shrink: boolean;
+            justify: string;
+            align: string;
+            border: boolean;
+            radius: boolean;
+            background: boolean;
+            split: boolean;
+            fit: boolean;
+            overflow: BlockOverflow;
+            padding: boolean;
+        }, {}, string, {}> & {
+            beforeCreate?: ((() => void) | (() => void)[]) | undefined;
+            created?: ((() => void) | (() => void)[]) | undefined;
+            beforeMount?: ((() => void) | (() => void)[]) | undefined;
+            mounted?: ((() => void) | (() => void)[]) | undefined;
+            beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
+            updated?: ((() => void) | (() => void)[]) | undefined;
+            activated?: ((() => void) | (() => void)[]) | undefined;
+            deactivated?: ((() => void) | (() => void)[]) | undefined;
+            beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
+            beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
+            destroyed?: ((() => void) | (() => void)[]) | undefined;
+            unmounted?: ((() => void) | (() => void)[]) | undefined;
+            renderTracked?: (((e: DebuggerEvent) => void) | ((e: DebuggerEvent) => void)[]) | undefined;
+            renderTriggered?: (((e: DebuggerEvent) => void) | ((e: DebuggerEvent) => void)[]) | undefined;
+            errorCaptured?: (((err: unknown, instance: ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null, info: string) => boolean | void) | ((err: unknown, instance: ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null, info: string) => boolean | void)[]) | undefined;
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof nextTick;
+        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: WatchOptions<boolean> | undefined): WatchStopHandle;
+    } & Readonly<ExtractPropTypes<{
+        flex: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        width: {
+            type: (StringConstructor | NumberConstructor)[];
+        };
+        height: {
+            type: (StringConstructor | NumberConstructor)[];
+        };
+        direction: {
+            type: PropType<BlockDirection>;
+            default: string;
+        };
+        grow: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        shrink: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        wrap: {
+            type: PropType<BlockWrap>;
+            default: string;
+        };
+        justify: {
+            type: StringConstructor;
+            default: string;
+        };
+        align: {
+            type: StringConstructor;
+            default: string;
+        };
+        border: {
+            type: BooleanConstructor;
+        };
+        radius: {
+            type: BooleanConstructor;
+        };
+        background: {
+            type: BooleanConstructor;
+        };
+        split: {
+            type: BooleanConstructor;
+        };
+        fit: {
+            type: BooleanConstructor;
+        };
+        overflow: {
+            type: PropType<BlockOverflow>;
+            default: string;
+        };
+        padding: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & ShallowUnwrapRef<{}> & {} & ComponentCustomProperties & {};
+    __isFragment?: undefined;
+    __isTeleport?: undefined;
+    __isSuspense?: undefined;
+} & ComponentOptionsBase<Readonly<ExtractPropTypes<{
+    flex: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    width: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    height: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    direction: {
+        type: PropType<BlockDirection>;
+        default: string;
+    };
+    grow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    shrink: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    wrap: {
+        type: PropType<BlockWrap>;
+        default: string;
+    };
+    justify: {
+        type: StringConstructor;
+        default: string;
+    };
+    align: {
+        type: StringConstructor;
+        default: string;
+    };
+    border: {
+        type: BooleanConstructor;
+    };
+    radius: {
+        type: BooleanConstructor;
+    };
+    background: {
+        type: BooleanConstructor;
+    };
+    split: {
+        type: BooleanConstructor;
+    };
+    fit: {
+        type: BooleanConstructor;
+    };
+    overflow: {
+        type: PropType<BlockOverflow>;
+        default: string;
+    };
+    padding: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, {
+    wrap: BlockWrap;
+    flex: boolean;
+    direction: BlockDirection;
+    grow: boolean;
+    shrink: boolean;
+    justify: string;
+    align: string;
+    border: boolean;
+    radius: boolean;
+    background: boolean;
+    split: boolean;
+    fit: boolean;
+    overflow: BlockOverflow;
+    padding: boolean;
+}, {}, string, {}> & VNodeProps & AllowedComponentProps & ComponentCustomProps & (new () => {
+    $slots: {
+        default?(_: {}): any;
+    };
+})> & Record<string, any>;
+export default XBlock;
+export { Block };
+export * from './block';

package/types/components/config/Config.d.ts

@@ -0,0 +1,26 @@
+import { DefineComponent, VNode, RendererNode, RendererElement, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, App, ExtractPropTypes, InjectionKey, Ref } from 'vue';
+import { configProps } from './props';
+export { configProps };
+export type ConfigProps = ExtractPropTypes<typeof configProps>;
+export type ConfigContext = Partial<ConfigProps>;
+export declare const configContextKey: InjectionKey<Ref<ConfigContext>>;
+export declare function provideConfig(config: ConfigContext | Ref<ConfigContext>, app?: App): Ref<Partial<ConfigProps> | {
+    elementTag?: string | undefined;
+}>;
+declare const Config: DefineComponent<{
+    elementTag: {
+        type: StringConstructor;
+        default: string;
+    };
+}, () => VNode<RendererNode, RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
+    elementTag: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    elementTag: string;
+}, {}>;
+export type ConfigInstance = InstanceType<typeof Config>;
+export default Config;

package/types/components/config/index.d.ts

@@ -0,0 +1,19 @@
+import { DefineComponent, VNode, RendererNode, RendererElement, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes } from 'vue';
+import { WithInstall } from '../../utils';
+export declare const XConfig: WithInstall<DefineComponent<{
+    elementTag: {
+        type: StringConstructor;
+        default: string;
+    };
+}, () => VNode<RendererNode, RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
+    elementTag: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    elementTag: string;
+}, {}>> & Record<string, any>;
+export default XConfig;
+export * from './Config';

package/types/components/config/props.d.ts

@@ -0,0 +1,6 @@
+export declare const configProps: {
+    elementTag: {
+        type: StringConstructor;
+        default: string;
+    };
+};