@raxium/vue-addons-virtual 0.1.1

package/dist/virtual.ai.js

@@ -0,0 +1,13 @@
+var virtual_ai_namespaceObject = JSON.parse('{"schemaVersion":"2.0.0","docId":"rark.vue.addons.virtual","component":{"name":"Virtual","framework":"vue","package":"@raxium/vue-addons-virtual","importPath":"@raxium/vue-addons-virtual","exportName":"VirtualList","category":"addon","description":"addons 里的独立虚拟滚动组件集，用于长列表、动态高度列表和二维网格的按需渲染。由 VirtualList、VirtualListItem、VirtualGrid、VirtualGridItem、VirtualInfiniteLoading 组合而成，基于 @tanstack/vue-virtual 封装。VirtualList 为主导出；VirtualGrid 为并列容器；VirtualListItem、VirtualGridItem、VirtualInfiniteLoading 为子组件。当前不提供 theme 配置，支持 ui 样式覆盖。","basePrimitive":{"library":"@tanstack/vue-virtual","primitive":"useVirtualizer","nativeElement":"div"},"passThrough":{"htmlAttributes":["aria-*","data-*","class"],"notes":"组件基于 @tanstack/vue-virtual 封装，VirtualList/VirtualGrid 部分透传 VirtualizerOptions；enabled、count、getScrollElement 由组件内部控制。"},"capabilities":["ui-override","virtual-list","virtual-grid","infinite-loading"],"subComponents":["VirtualListItem","VirtualGrid","VirtualGridItem","VirtualInfiniteLoading"]},"contracts":{"props":[{"name":"dataSource","required":true,"requiredSource":"type","typeText":"Array<T>","typeSchema":{"type":"array"},"default":null,"defaultKind":"implicit-undefined","nullable":false,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"列表数据源。"},{"name":"estimateSize","required":false,"requiredSource":"type","typeText":"(index: number) => number","typeSchema":{"type":"function"},"default":"() => 30","defaultKind":"explicit-runtime","nullable":false,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"列表项估算高度/宽度（横向时为宽度）。"},{"name":"overscan","required":false,"requiredSource":"type","typeText":"number","typeSchema":{"type":"number"},"default":1,"defaultKind":"explicit-runtime","nullable":false,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"额外渲染缓冲项数量。"},{"name":"horizontal","required":false,"requiredSource":"type","typeText":"boolean","typeSchema":{"type":"boolean"},"default":false,"defaultKind":"explicit-runtime","nullable":false,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"是否横向虚拟滚动。"},{"name":"unstyled","required":false,"requiredSource":"type","typeText":"boolean","typeSchema":{"type":"boolean"},"default":null,"defaultKind":"implicit-undefined","nullable":true,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"组件声明了该参数；当前实现中未见样式分支逻辑，建议优先通过 class/ui 覆盖。"}],"events":[],"slots":[{"name":"default","slotPropsSchema":{"type":"object","properties":{},"additionalProperties":false},"renderWhen":[{"expr":"always"}],"fallback":null,"description":"列表内容槽，通常放 VirtualListItem，可额外放 VirtualInfiniteLoading。"}],"themeConfiguration":{"fields":[],"notes":"Virtual 不支持 theme 配置。使用 class 与 ui.* 覆盖局部样式。"},"uiConfiguration":{"fields":[{"name":"ui.root","typeText":"HTMLAttributes[\'class\']","typeSchema":{"anyOf":[{"type":"string"},{"type":"array"},{"type":"object"}]},"default":null,"defaultKind":"implicit-undefined","description":"列表根容器样式。"},{"name":"ui.scroll","typeText":"HTMLAttributes[\'class\']","typeSchema":{"anyOf":[{"type":"string"},{"type":"array"},{"type":"object"}]},"default":null,"defaultKind":"implicit-undefined","description":"列表滚动区域样式。"}]}},"cssImport":{"required":true,"importPath":"@raxium/vue-addons-virtual/index.css","sourcePath":"packages/vue/addons/components/virtual/src/index.css","description":"包含 rui-virtual-list、rui-virtual-grid、rui-virtual-infinite 的基础样式与状态样式，并提供基于 data-scope/data-part 的结构化覆盖点。","usage":"import \'@raxium/vue-addons-virtual/index.css\'"},"subComponents":{"VirtualListItem":{"props":[{"name":"data","required":false,"requiredSource":"type","typeText":"T","typeSchema":{"type":"object"},"default":null,"defaultKind":"implicit-undefined","nullable":true,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"当前列表项数据。"},{"name":"index","required":false,"requiredSource":"type","typeText":"number","typeSchema":{"type":"number"},"default":null,"defaultKind":"implicit-undefined","nullable":true,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"当前项索引。"},{"name":"dynamic","required":false,"requiredSource":"type","typeText":"boolean","typeSchema":{"type":"boolean"},"default":null,"defaultKind":"implicit-undefined","nullable":true,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"开启后在节点变化时触发 measureElement，用于动态高度列表。"}],"slots":[{"name":"default","slotPropsSchema":{"type":"object","properties":{"data":{},"index":{"type":"number"}}},"renderWhen":[{"expr":"always"}],"fallback":null,"description":"参数为 { data: T, index?: number }。"}],"events":[],"themeConfiguration":{"fields":[]},"uiConfiguration":{"fields":[]}},"VirtualGrid":{"props":[{"name":"dataSource","required":true,"requiredSource":"type","typeText":"Array<T>","typeSchema":{"type":"array"},"default":null,"defaultKind":"implicit-undefined","nullable":false,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"网格数据源。"},{"name":"row","required":false,"requiredSource":"type","typeText":"number","typeSchema":{"type":"number"},"default":null,"defaultKind":"implicit-undefined","nullable":true,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"行数维度控制。"},{"name":"column","required":false,"requiredSource":"type","typeText":"number","typeSchema":{"type":"number"},"default":null,"defaultKind":"implicit-undefined","nullable":true,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"列数维度控制。"},{"name":"gap","required":false,"requiredSource":"type","typeText":"[number, number]","typeSchema":{"type":"array","items":{"type":"number"},"minItems":2,"maxItems":2},"default":"[0, 0]","defaultKind":"explicit-runtime","nullable":false,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"行间距与列间距。"}],"slots":[{"name":"default","slotPropsSchema":{"type":"object","properties":{},"additionalProperties":false},"renderWhen":[{"expr":"always"}],"fallback":null,"description":"网格内容槽，通常放 VirtualGridItem，可额外放 VirtualInfiniteLoading。"}],"events":[],"themeConfiguration":{"fields":[]},"uiConfiguration":{"fields":[{"name":"ui.root","typeText":"HTMLAttributes[\'class\']","typeSchema":{"anyOf":[{"type":"string"},{"type":"array"},{"type":"object"}]},"default":null,"defaultKind":"implicit-undefined","description":"网格根容器样式。"},{"name":"ui.scroll","typeText":"HTMLAttributes[\'class\']","typeSchema":{"anyOf":[{"type":"string"},{"type":"array"},{"type":"object"}]},"default":null,"defaultKind":"implicit-undefined","description":"网格滚动区域样式。"}]}},"VirtualGridItem":{"props":[{"name":"data","required":false,"requiredSource":"type","typeText":"T","typeSchema":{"type":"object"},"default":null,"defaultKind":"implicit-undefined","nullable":true,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"当前网格项数据。"},{"name":"index","required":false,"requiredSource":"type","typeText":"number","typeSchema":{"type":"number"},"default":null,"defaultKind":"implicit-undefined","nullable":true,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"当前项线性索引。"},{"name":"rowIndex","required":false,"requiredSource":"type","typeText":"number","typeSchema":{"type":"number"},"default":null,"defaultKind":"implicit-undefined","nullable":true,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"行索引。"},{"name":"colIndex","required":false,"requiredSource":"type","typeText":"number","typeSchema":{"type":"number"},"default":null,"defaultKind":"implicit-undefined","nullable":true,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"列索引。"}],"slots":[{"name":"default","slotPropsSchema":{"type":"object","properties":{"data":{},"index":{"type":"number"},"rowIndex":{"type":"number"},"colIndex":{"type":"number"}}},"renderWhen":[{"expr":"always"}],"fallback":null,"description":"参数为 { data: T, index?: number, rowIndex?: number, colIndex?: number }。"}],"events":[],"themeConfiguration":{"fields":[]},"uiConfiguration":{"fields":[]}},"VirtualInfiniteLoading":{"props":[{"name":"enableFirstLoad","required":false,"requiredSource":"type","typeText":"boolean","typeSchema":{"type":"boolean"},"default":true,"defaultKind":"explicit-runtime","nullable":false,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"挂载后是否立即触发一次加载。"},{"name":"enableRetry","required":false,"requiredSource":"type","typeText":"boolean","typeSchema":{"type":"boolean"},"default":true,"defaultKind":"explicit-runtime","nullable":false,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"错误状态是否展示重试按钮。"},{"name":"size","required":false,"requiredSource":"type","typeText":"\'xs\' | \'sm\' | \'base\' | \'lg\'","typeSchema":{"enum":["xs","sm","base","lg"]},"default":"base","defaultKind":"explicit-runtime","nullable":false,"passthrough":false,"deprecated":false,"dependsOn":[],"conflictsWith":[],"description":"状态块尺寸。"}],"slots":[{"name":"loading","slotPropsSchema":{"type":"object","properties":{},"additionalProperties":false},"renderWhen":[{"expr":"state === LOADING"}],"fallback":null,"description":"加载态内容。"},{"name":"spinner","slotPropsSchema":{"type":"object","properties":{},"additionalProperties":false},"renderWhen":[{"expr":"state === LOADING"}],"fallback":"LoaderCircle","description":"加载图标。"},{"name":"complete","slotPropsSchema":{"type":"object","properties":{},"additionalProperties":false},"renderWhen":[{"expr":"state === COMPLETE"}],"fallback":"No more results!","description":"加载完成态内容。"},{"name":"error","slotPropsSchema":{"type":"object","properties":{"retry":{"type":"function"}}},"renderWhen":[{"expr":"state === ERROR"}],"fallback":null,"description":"错误态内容，参数为 { retry: () => void }。"}],"events":[{"name":"infinite","payload":{"typeText":"{ loading: () => void; loaded: () => void; complete: () => void; error: () => void }","typeSchema":{"type":"object","properties":{"loading":{"type":"function"},"loaded":{"type":"function"},"complete":{"type":"function"},"error":{"type":"function"}}}},"emitWhen":[{"expr":"mounted && enableFirstLoad && state === IDLE","kind":"runtime-hook"},{"expr":"IntersectionObserver.intersect && state === LOADING","kind":"runtime-hook"}],"notEmitWhen":[],"order":["loading","loaded","complete","error"],"description":"首次加载或命中观察点时触发；业务侧通过回调切换加载状态。"}],"themeConfiguration":{"fields":[]},"uiConfiguration":{"fields":[{"name":"ui.root","typeText":"HTMLAttributes[\'class\']","typeSchema":{"anyOf":[{"type":"string"},{"type":"array"},{"type":"object"}]},"default":null,"defaultKind":"implicit-undefined","description":"无限加载根节点样式。"},{"name":"ui.loading","typeText":"HTMLAttributes[\'class\']","typeSchema":{"anyOf":[{"type":"string"},{"type":"array"},{"type":"object"}]},"default":null,"defaultKind":"implicit-undefined","description":"加载态样式。"},{"name":"ui.spinner","typeText":"HTMLAttributes[\'class\']","typeSchema":{"anyOf":[{"type":"string"},{"type":"array"},{"type":"object"}]},"default":null,"defaultKind":"implicit-undefined","description":"加载图标样式。"},{"name":"ui.complete","typeText":"HTMLAttributes[\'class\']","typeSchema":{"anyOf":[{"type":"string"},{"type":"array"},{"type":"object"}]},"default":null,"defaultKind":"implicit-undefined","description":"完成态样式。"},{"name":"ui.error","typeText":"HTMLAttributes[\'class\']","typeSchema":{"anyOf":[{"type":"string"},{"type":"array"},{"type":"object"}]},"default":null,"defaultKind":"implicit-undefined","description":"错误态样式。"}]}}},"behaviorModel":{"stateVars":{"infiniteState":"LOADING_STATE (idle | loading | loaded | complete | error)"},"derived":{"virtualizedRows":"rowVirtualizer.getVirtualItems()","virtualizedColumns":"columnVirtualizer.getVirtualItems()","virtualizedItems":"virtualizer.getVirtualItems()"},"transitions":[{"on":"VirtualInfiniteLoading.mounted","guard":"enableFirstLoad && state === IDLE","effects":["emit:infinite"]},{"on":"IntersectionObserver.intersect","guard":"state === LOADING","effects":["emit:infinite"]},{"on":"stateHandler.loading()","guard":"always","effects":["state = LOADING"]},{"on":"stateHandler.loaded()","guard":"always","effects":["state = LOADED"]},{"on":"stateHandler.complete()","guard":"always","effects":["state = COMPLETE"]},{"on":"stateHandler.error()","guard":"always","effects":["state = ERROR"]}]},"examples":[{"id":"basic-list","mcp":{"server":"raxium","tool":"get-example","args":{"framework":"vue","componentName":"addons/components/virtual"},"exampleId":"basic-list"},"description":"基础列表虚拟滚动"},{"id":"basic-grid","mcp":{"server":"raxium","tool":"get-example","args":{"framework":"vue","componentName":"addons/components/virtual"},"exampleId":"basic-grid"},"description":"基础网格虚拟滚动"},{"id":"dynamic-list","mcp":{"server":"raxium","tool":"get-example","args":{"framework":"vue","componentName":"addons/components/virtual"},"exampleId":"dynamic-list"},"description":"动态高度与无限加载"}],"generationHints":{"preferredUsageOrder":["VirtualList + VirtualListItem","VirtualGrid + VirtualGridItem","VirtualInfiniteLoading"],"safeDefaults":{"estimateSize":"() => 30","overscan":1,"horizontal":false},"a11yChecklist":["长列表需确保 aria-setsize 与 aria-posinset 正确（组件已内置）。","无限加载重试按钮需具备可聚焦与键盘可操作。"],"codegenTemplates":{"minimalList":"<VirtualList :data-source=\\"items\\">\\n  <VirtualListItem v-slot=\\"{ data }\\">{{ data.name }}</VirtualListItem>\\n</VirtualList>","minimalGrid":"<VirtualGrid :data-source=\\"items\\" :row=\\"3\\" :column=\\"4\\">\\n  <VirtualGridItem v-slot=\\"{ data }\\">{{ data }}</VirtualGridItem>\\n</VirtualGrid>","withInfinite":"<VirtualList :data-source=\\"items\\">\\n  <VirtualListItem v-slot=\\"{ data }\\">{{ data.name }}</VirtualListItem>\\n  <VirtualInfiniteLoading @infinite=\\"handleLoad\\" />\\n</VirtualList>","dynamicList":"<VirtualList :data-source=\\"items\\">\\n  <VirtualListItem v-slot=\\"{ data }\\" :dynamic=\\"true\\">{{ data.name }}</VirtualListItem>\\n</VirtualList>"},"antiPatterns":["使用 Virtual 组件但未引入 index.css — 导致 rui-virtual-list/rui-virtual-grid/rui-virtual-infinite 等结构样式缺失，布局错乱","<VirtualListItem v-slot=\\"{ data }\\">{{ data.name }}</VirtualListItem> — 动态高度列表未设置 dynamic，导致滚动跳动","handleLoad({ complete }) { complete() } — 数据未真正结束时过早调用 complete()，导致无法继续加载"]},"provenance":{"sources":[{"path":"./virtual.doc.mdx","kind":"doc"},{"path":"./props.ts","kind":"type"},{"path":"./VirtualListImpl.vue","kind":"runtime"},{"path":"./VirtualGridImpl.vue","kind":"runtime"},{"path":"./VirtualListItem.vue","kind":"runtime"},{"path":"./VirtualGridItem.vue","kind":"runtime"},{"path":"./VirtualInfiniteLoading.vue","kind":"runtime"},{"path":"./virtual.stories.ts","kind":"story"}],"precedence":["runtime","type","doc"],"fieldSourceMap":{"contracts.props.estimateSize.default":"runtime","contracts.props.overscan.default":"runtime","subComponents.VirtualGrid.props.gap.default":"runtime","subComponents.VirtualInfiniteLoading.props.enableFirstLoad.default":"runtime","subComponents.VirtualInfiniteLoading.props.enableRetry.default":"runtime","subComponents.VirtualInfiniteLoading.props.size.default":"runtime","subComponents.VirtualInfiniteLoading.events.infinite.order":"runtime","component.subComponents":"doc","cssImport":"doc","generationHints.safeDefaults":"doc","generationHints.antiPatterns":"doc"}}}');
+var behaviorModel = virtual_ai_namespaceObject.behaviorModel;
+var component = virtual_ai_namespaceObject.component;
+var contracts = virtual_ai_namespaceObject.contracts;
+var cssImport = virtual_ai_namespaceObject.cssImport;
+var docId = virtual_ai_namespaceObject.docId;
+var examples = virtual_ai_namespaceObject.examples;
+var generationHints = virtual_ai_namespaceObject.generationHints;
+var provenance = virtual_ai_namespaceObject.provenance;
+var schemaVersion = virtual_ai_namespaceObject.schemaVersion;
+var subComponents = virtual_ai_namespaceObject.subComponents;
+export default virtual_ai_namespaceObject;
+export { behaviorModel, component, contracts, cssImport, docId, examples, generationHints, provenance, schemaVersion, subComponents };

package/package.json

@@ -0,0 +1,55 @@
+{
+  "name": "@raxium/vue-addons-virtual",
+  "type": "module",
+  "version": "0.1.1",
+  "description": "Virtual components for Raxium",
+  "author": {
+    "name": "Hwacc",
+    "email": "mshcccck@gmail.com",
+    "url": "https://github.com/raxium-ui/raxium-ui"
+  },
+  "license": "MIT",
+  "keywords": [
+    "raxium",
+    "vue",
+    "addons",
+    "virtual"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./index.css": "./dist/index.css"
+  },
+  "module": "./dist/index.js",
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "vue": "^3.5.27"
+  },
+  "dependencies": {
+    "@tanstack/vue-virtual": "^3.13.19",
+    "es-toolkit": "^1.44.0",
+    "lucide-vue-next": "^0.575.0",
+    "@raxium/themes": "0.1.1",
+    "@raxium/vue-addons-shared": "0.1.1"
+  },
+  "devDependencies": {
+    "@rsbuild/plugin-babel": "^1.0.6",
+    "@rsbuild/plugin-vue-jsx": "^1.1.2",
+    "@rslib/core": "0.20.0",
+    "rsbuild-plugin-unplugin-vue": "^0.2.0",
+    "tsc-alias": "^1.8.16",
+    "vue-tsc": "^3.2.5"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "copy:css": "bun -e \"import { mkdir } from 'node:fs/promises'; await mkdir('./dist', { recursive: true }); await Bun.write('./dist/index.css', Bun.file('./src/index.css'));\"",
+    "build": "rslib build --tsconfig ./tsconfig.build.json && vue-tsc --project tsconfig.build.json && tsc-alias --project tsconfig.build.json && bun run copy:css",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  }
+}