@raxium/vue 0.1.2 → 0.1.3

package/dist/components/spin/SpinProvider.d.ts

@@ -1,7 +1,7 @@
 import type { SlotsType, VNode } from 'vue';
 import type { SpinRenderProps } from '.';
 /**
- * TODO: rslib无法解析<script setup lang="tsx">的组件, 会解析为虚拟请求(?vue), 导致解析链断掉
+ * rslib无法解析<script setup lang="tsx">的组件, 会解析为虚拟请求(?vue), 导致解析链断掉
  * 继续使用bundle:false, 需要直接解析tsx文件
  */
 type Slots = {

package/dist/components/spin/SpinProvider.js

@@ -1,6 +1,7 @@
 import { computed, createVNode, defineComponent, isVNode, provide } from "vue";
 import { ark } from "@ark-ui/vue/factory";
 import { clsx } from "@raxium/themes/utils";
+import { isEmptyVNode } from "../../utils/index.js";
 import { LoaderCircle } from "lucide-vue-next";
 function _isSlot(s) {
     return 'function' == typeof s || '[object Object]' === Object.prototype.toString.call(s) && !isVNode(s);
@@ -12,7 +13,7 @@ const SpinProvider = defineComponent({
         function renderIcon(props) {
             const icon = slots?.icon?.(props);
             const crafts = computed(()=>props.theme?.crafts?.tvSpin?.());
-            if (icon) return createVNode(ark.span, {
+            if (!isEmptyVNode(icon)) return createVNode(ark.span, {
                 class: crafts.value?.icon({
                     class: clsx(props.class),
                     ...props.theme

package/dist/utils/__test__/vnode.test.js

@@ -0,0 +1,191 @@
+import { describe, expect, it, vi } from "vitest";
+import { Comment, Fragment, Text, createCommentVNode, createTextVNode, defineComponent, h } from "vue";
+import { checkContextVNodePosition, excludeVNodesByName, excludeVNodesByNames, findVNodeByName, findVNodesByName, hasChildVNodeByName, isEmptyVNode, someVNode } from "../vnode.js";
+function cmp(name) {
+    return defineComponent({
+        name,
+        setup: ()=>()=>null
+    });
+}
+describe('someVNode', ()=>{
+    it('returns false for undefined / empty', ()=>{
+        expect(someVNode(void 0, ()=>true)).toBe(false);
+        expect(someVNode([], ()=>true)).toBe(false);
+    });
+    it('matches direct vnode', ()=>{
+        const n = h('div');
+        expect(someVNode(n, (v)=>'div' === v.type)).toBe(true);
+        expect(someVNode(n, (v)=>'span' === v.type)).toBe(false);
+    });
+    it('recurses into array children (e.g. Fragment)', ()=>{
+        const inner = h('span');
+        const frag = h(Fragment, null, [
+            inner
+        ]);
+        expect(someVNode(frag, (v)=>'span' === v.type)).toBe(true);
+    });
+});
+describe('findVNodeByName', ()=>{
+    it('finds component by name with camelCase normalization', ()=>{
+        const C = cmp('MyWidget');
+        const nodes = [
+            h('div'),
+            h(C)
+        ];
+        expect(findVNodeByName(nodes, 'my-widget')).toBeDefined();
+        expect(findVNodeByName(nodes, 'MyWidget')).toBeDefined();
+        expect(findVNodeByName(nodes, 'my-widget').type.name).toBe('MyWidget');
+    });
+    it('returns undefined when missing or nodes empty', ()=>{
+        expect(findVNodeByName(void 0, 'x')).toBeUndefined();
+        expect(findVNodeByName([], 'x')).toBeUndefined();
+        expect(findVNodeByName([
+            h('div')
+        ], 'Missing')).toBeUndefined();
+    });
+    it('walks Fragment children', ()=>{
+        const Inner = cmp('InnerNode');
+        const frag = h(Fragment, null, [
+            h(Inner)
+        ]);
+        expect(findVNodeByName([
+            frag
+        ], 'InnerNode')).toBeDefined();
+    });
+});
+describe('findVNodesByName', ()=>{
+    it('collects all matches', ()=>{
+        const A = cmp('Dup');
+        const nodes = [
+            h(A),
+            h('p'),
+            h(A)
+        ];
+        const found = findVNodesByName(nodes, 'Dup');
+        expect(found).toHaveLength(2);
+    });
+});
+describe('excludeVNodesByName / excludeVNodesByNames', ()=>{
+    it('excludes one name', ()=>{
+        const A = cmp('Keep');
+        const B = cmp('Drop');
+        const out = excludeVNodesByName([
+            h(A),
+            h(B),
+            h('i')
+        ], 'Drop');
+        expect(out).toHaveLength(2);
+        expect(out.some((v)=>v.type?.name === 'Drop')).toBe(false);
+    });
+    it('excludes multiple names', ()=>{
+        const A = cmp('A1');
+        const B = cmp('A2');
+        const out = excludeVNodesByNames([
+            h(A),
+            h(B),
+            h('span')
+        ], [
+            'A1',
+            'A2'
+        ]);
+        expect(out).toHaveLength(1);
+        expect(out[0].type).toBe('span');
+    });
+    it('returns [] for empty input', ()=>{
+        expect(excludeVNodesByName(void 0, 'x')).toEqual([]);
+    });
+});
+describe('hasChildVNodeByName', ()=>{
+    it('matches root component name', ()=>{
+        const C = cmp('RootX');
+        expect(hasChildVNodeByName(h(C), 'root-x')).toBe(true);
+    });
+    it('matches nested component in children array', ()=>{
+        const Inner = cmp('Nested');
+        const root = h('div', [
+            h(Inner)
+        ]);
+        expect(hasChildVNodeByName(root, 'Nested')).toBe(true);
+    });
+    it('returns false when absent', ()=>{
+        expect(hasChildVNodeByName(void 0, 'x')).toBe(false);
+        expect(hasChildVNodeByName(h('div'), 'None')).toBe(false);
+    });
+    it('handles vnode array at root', ()=>{
+        const Inner = cmp('InArray');
+        expect(hasChildVNodeByName([
+            h('div'),
+            h(Inner)
+        ], 'InArray')).toBe(true);
+    });
+});
+describe('checkContextVNodePosition', ()=>{
+    it('warns when single child name equals context', ()=>{
+        const warn = vi.spyOn(console, 'warn').mockImplementation(()=>{});
+        const C = cmp('ContextHost');
+        checkContextVNodePosition([
+            h(C)
+        ], 'ContextHost', 'Parent');
+        expect(warn).toHaveBeenCalledTimes(1);
+        warn.mockRestore();
+    });
+    it('does not warn when multiple nodes', ()=>{
+        const warn = vi.spyOn(console, 'warn').mockImplementation(()=>{});
+        const C = cmp('ContextHost');
+        checkContextVNodePosition([
+            h(C),
+            h('div')
+        ], 'ContextHost', 'Parent');
+        expect(warn).not.toHaveBeenCalled();
+        warn.mockRestore();
+    });
+});
+describe('isEmptyVNode', ()=>{
+    it('treats null / undefined as empty', ()=>{
+        expect(isEmptyVNode(null)).toBe(true);
+        expect(isEmptyVNode(void 0)).toBe(true);
+    });
+    it('treats Comment as empty', ()=>{
+        const v = createCommentVNode('x');
+        expect(v.type).toBe(Comment);
+        expect(isEmptyVNode(v)).toBe(true);
+    });
+    it('treats blank Text as empty', ()=>{
+        expect(isEmptyVNode(createTextVNode(''))).toBe(true);
+        expect(isEmptyVNode(createTextVNode('   '))).toBe(true);
+    });
+    it('treats non-blank Text as non-empty', ()=>{
+        expect(isEmptyVNode(createTextVNode('a'))).toBe(false);
+    });
+    it('treats empty Fragment as empty', ()=>{
+        expect(isEmptyVNode(h(Fragment, null, []))).toBe(true);
+        expect(isEmptyVNode(h(Fragment, null, null))).toBe(true);
+    });
+    it('treats Fragment with only empty children as empty', ()=>{
+        expect(isEmptyVNode(h(Fragment, null, [
+            createCommentVNode(),
+            createTextVNode('')
+        ]))).toBe(true);
+    });
+    it('treats element / component as non-empty', ()=>{
+        expect(isEmptyVNode(h('div'))).toBe(false);
+        expect(isEmptyVNode(h(cmp('X')))).toBe(false);
+    });
+    it('requires every item in array to be empty', ()=>{
+        expect(isEmptyVNode([
+            createCommentVNode(),
+            createTextVNode('')
+        ])).toBe(true);
+        expect(isEmptyVNode([
+            createCommentVNode(),
+            h('span')
+        ])).toBe(false);
+    });
+    it('treats non-VNode object as empty (compat)', ()=>{
+        expect(isEmptyVNode({})).toBe(true);
+    });
+    it('compares Text type symbol', ()=>{
+        const tv = createTextVNode('hi');
+        expect(tv.type).toBe(Text);
+    });
+});

package/dist/utils/vnode.d.ts

@@ -6,3 +6,4 @@ export declare function excludeVNodesByName(node: VNode | VNode[] | undefined, n
 export declare function excludeVNodesByNames(nodes: VNode[] | undefined, name: string[]): VNode[];
 export declare function hasChildVNodeByName(node: VNode | VNode[] | undefined, name: string): boolean;
 export declare function checkContextVNodePosition(nodes: VNode[] | undefined, contextName: string, componentName?: string): void;
+export declare function isEmptyVNode(node: VNode | VNode[] | null | undefined): boolean;

package/dist/utils/vnode.js

@@ -1,5 +1,5 @@
 import { camelCase, isEmpty } from "es-toolkit/compat";
-import { isVNode } from "vue";
+import { Comment, Fragment, Text, isVNode } from "vue";
 function someVNode(children, pred) {
     const arr = Array.isArray(children) ? children : null != children ? [
         children
@@ -83,4 +83,23 @@ function checkContextVNodePosition(nodes, contextName, componentName) {
         _srcName === _targetName && console.warn(`\<${contextName}\> can not be a direct child of \<${componentName}\>, it may cause unexpected style behavior, consider lift it up or use it closer to where you want to use it `);
     }
 }
-export { checkContextVNodePosition, excludeVNodesByName, excludeVNodesByNames, findVNodeByName, findVNodesByName, hasChildVNodeByName, someVNode };
+function isEmptyVNode(node) {
+    if (!node) return true;
+    const nodes = Array.isArray(node) ? node : [
+        node
+    ];
+    if (0 === nodes.length) return true;
+    return nodes.every((n)=>{
+        if (!n) return true;
+        if (!isVNode(n)) return true;
+        if (n.type === Comment) return true;
+        if (n.type === Text) return '' === String(n.children ?? '').trim();
+        if (n.type === Fragment) {
+            const ch = n.children;
+            if (null == ch || '' === ch) return true;
+            if (Array.isArray(ch)) return ch.every((c)=>isEmptyVNode(c));
+        }
+        return false;
+    });
+}
+export { checkContextVNodePosition, excludeVNodesByName, excludeVNodesByNames, findVNodeByName, findVNodesByName, hasChildVNodeByName, isEmptyVNode, someVNode };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@raxium/vue",
   "type": "module",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "Vue core components for Raxium, based on Ark UI",
   "author": {
     "name": "Hwacc",
@@ -67,8 +67,8 @@
     "es-toolkit": "^1.44.0",
     "lucide-vue-next": "^0.577.0",
     "vue-component-type-helpers": "^3.2.1",
-    "@raxium/shared": "0.1.1",
-    "@raxium/themes": "0.1.2"
+    "@raxium/themes": "0.1.3",
+    "@raxium/shared": "0.1.1"
   },
   "devDependencies": {
     "@ark-ui/vue": "^5.34.1",
@@ -86,15 +86,16 @@
     "rsbuild-plugin-unplugin-vue": "^0.2.0",
     "tailwind-merge": "^3.5.0",
     "tsc-alias": "^1.8.16",
+    "vitest": "^4.1.1",
     "vue-tsc": "^3.2.4",
-    "@raxium/shared": "0.1.1",
-    "@raxium/themes": "0.1.2"
+    "@raxium/themes": "0.1.3",
+    "@raxium/shared": "0.1.1"
   },
   "publishConfig": {
     "access": "public"
   },
   "scripts": {
     "build": "rslib build --tsconfig ./tsconfig.build.json && vue-tsc --project tsconfig.build.json && tsc-alias --project tsconfig.build.json",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "vitest run"
   }
 }