{"_id":"@composy/room-designer-vue","name":"@composy/room-designer-vue","dist-tags":{"latest":"0.0.1"},"versions":{"0.0.1":{"name":"@composy/room-designer-vue","version":"0.0.1","description":"Vue components and composables for @composy/room-designer-core","keywords":["room-designer","vue","vue3","component","ldesign"],"author":{"name":"LDesign Team"},"license":"MIT","type":"module","sideEffects":false,"main":"./lib/index.cjs","module":"./es/index.js","types":"./es/index.d.ts","typings":"./es/index.d.ts","browser":"./dist/index.js","unpkg":"./dist/index.min.js","jsdelivr":"./dist/index.min.js","exports":{".":{"types":"./es/index.d.ts","import":"./es/index.js","require":"./lib/index.cjs","default":"./es/index.js"},"./composables/*":{"types":"./es/composables/*.d.ts","import":"./es/composables/*.js","require":"./lib/composables/*.cjs","default":"./es/composables/*.js"},"./plugins/*":{"types":"./es/plugins/*.d.ts","import":"./es/plugins/*.js","require":"./lib/plugins/*.cjs","default":"./es/plugins/*.js"},"./package.json":"./package.json"},"scripts":{"build":"ldesign-builder build","dev":"vite build --watch","lint":"eslint . --cache","lint:check":"eslint . --cache --max-warnings 0","lint:fix":"eslint . --cache --fix","type-check":"tsc --noEmit","test":"ltesting run:unit","test:coverage":"ltesting run:unit --coverage","test:watch":"ltesting run:unit --watch","test:run":"ltesting run:unit","test:changed":"ltesting run:unit --changed","test:failed":"ltesting run:unit --failed","test:ui":"ltesting dashboard"},"dependencies":{"@composy/room-designer-core":"^0.0.1","vue-demi":"^0.14.10"},"peerDependencies":{"vue":"^2.7.0 || ^3.5.32"},"devDependencies":{"@antfu/eslint-config":"9.1.0","@composy/builder":"^0.0.1","@composy/testing":"^0.0.1","@vue/test-utils":"^2.4.11","eslint":"10.7.0","fast-check":"^4.9.0","jsdom":"29.1.1","typescript":"5.9.3","vite":"^8.1.4","vue":"3.5.39","vue-tsc":"^3.3.7"},"publishConfig":{"registry":"http://npm.longrise.cn:6286/"},"style":"./dist/style.css","_id":"@composy/room-designer-vue@0.0.1","_nodeVersion":"23.11.1","_npmVersion":"10.9.2","dist":{"integrity":"sha512-6jKAtojScJ2gTbD3WqXSuHL4u1oOycZJl8ZNz5fy0HjbfHch172avt0iJeIxYVLpIqI6ctQJlFJBZw0khy9QBA==","shasum":"7cae13f61a6cd8f1d07e788220ca15270374d149","tarball":"https://registry.npmjs.org/@composy/room-designer-vue/-/room-designer-vue-0.0.1.tgz","fileCount":62,"unpackedSize":198209,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIGu5E8EZF9GsH6Cc1SKBFN6Zu7WuuwMXAD0H7ZUOyUvjAiEA752ZjaFZPCoaOu53qwyzeVlp9lssgKeC//G43MQ/ICc="}]},"_npmUser":{"name":"swimly","email":"979741120@qq.com"},"directories":{},"maintainers":[{"name":"swimly","email":"979741120@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/room-designer-vue_0.0.1_1786949276484_0.9151567108036927"},"_hasShrinkwrap":false}},"time":{"created":"2026-08-17T06:47:56.272Z","0.0.1":"2026-08-17T06:47:56.622Z","modified":"2026-08-17T06:47:56.874Z"},"maintainers":[{"name":"swimly","email":"979741120@qq.com"}],"description":"Vue components and composables for @composy/room-designer-core","keywords":["room-designer","vue","vue3","component","ldesign"],"author":{"name":"LDesign Team"},"license":"MIT","readme":"# @composy/room-designer-vue\n\nVue 3 组件和 Composable 封装，用于 `@composy/room-designer-core`\n\n## 安装\n\n```bash\npnpm add @composy/room-designer-vue\n```\n\n## 组件使用\n\n```vue\n<template>\n  <RoomDesigner\n    v-model=\"floor\"\n    theme=\"light\"\n    mode=\"edit\"\n    :show-labels=\"true\"\n    @change=\"onChange\"\n    @select=\"onSelect\"\n    @zoom=\"onZoom\"\n  />\n</template>\n\n<script setup lang=\"ts\">\nimport { ref } from 'vue'\nimport { RoomDesigner } from '@composy/room-designer-vue'\nimport type { Floor, SelectionInfo } from '@composy/room-designer-core'\n\nconst floor = ref<Floor>({\n  name: '会议室',\n  width: 800,\n  height: 600,\n  rooms: [],\n  seats: [],\n  devices: [],\n  zones: [],\n  furniture: [],\n})\n\nconst onChange = (f: Floor) => console.log('变化:', f)\nconst onSelect = (sel: SelectionInfo | null) => console.log('选中:', sel)\nconst onZoom = (zoom: number) => console.log('缩放:', zoom)\n</script>\n```\n\n## Composable 使用\n\n```vue\n<script setup lang=\"ts\">\nimport { useRoomDesigner } from '@composy/room-designer-vue'\n\nconst {\n  instance,\n  floor,\n  selection,\n  create,\n  addRoom,\n  addSeat,\n  undo,\n  redo,\n  canUndo,\n  canRedo,\n  exportPNG,\n  exportSVG,\n  download,\n  setMinimapEnabled,\n  setTheme,\n  setMode,\n  destroy,\n} = useRoomDesigner()\n\n// 在 onMounted 中创建实例\nonMounted(() => {\n  create(containerRef.value, {\n    theme: 'light',\n    onChange: (f) => console.log(f),\n  })\n\n  // 添加房间\n  addRoom({ name: '会议室', x: 100, y: 100, width: 400, height: 300 })\n\n  // 启用小地图\n  setMinimapEnabled(true)\n})\n</script>\n```\n\n## Vue 插件\n\n```typescript\nimport { createApp } from 'vue'\nimport { RoomDesignerPlugin } from '@composy/room-designer-vue'\n\nconst app = createApp(App)\napp.use(RoomDesignerPlugin)\n\n// 自定义组件名\napp.use(RoomDesignerPlugin, { name: 'SpaceDesigner' })\n```\n\n## Props\n\n| Prop | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `modelValue` | `Floor` | - | v-model 绑定的楼层数据 |\n| `mode` | `'edit' \\| 'view'` | `'edit'` | 编辑模式 |\n| `theme` | `'light' \\| 'dark'` | `'light'` | 主题 |\n| `width` | `number` | - | Canvas 宽度 |\n| `height` | `number` | - | Canvas 高度 |\n| `grid` | `Partial<GridConfig>` | - | 网格配置 |\n| `zoom` | `number` | `1` | 初始缩放 |\n| `showLabels` | `boolean` | `true` | 显示标注 |\n| `showDimensions` | `boolean` | `false` | 显示尺寸 |\n\n## Events\n\n| 事件 | 参数 | 说明 |\n|------|------|------|\n| `update:modelValue` | `Floor` | 楼层数据变化 |\n| `change` | `Floor` | 楼层数据变化 |\n| `select` | `SelectionInfo \\| null` | 选中项变化 |\n| `zoom` | `number` | 缩放变化 |\n| `error` | `Error` | 错误 |\n\n## Expose\n\n组件通过 `ref` 暴露以下方法：\n\n| 方法 | 说明 |\n|------|------|\n| `addRoom(room)` | 添加房间 |\n| `removeRoom(id)` | 删除房间 |\n| `addSeat(seat)` | 添加座位 |\n| `removeSeat(id)` | 删除座位 |\n| `addDevice(device)` | 添加设备 |\n| `removeDevice(id)` | 删除设备 |\n| `addZone(zone)` | 添加区域 |\n| `removeZone(id)` | 删除区域 |\n| `addFurniture(furniture)` | 添加家具 |\n| `removeFurniture(id)` | 删除家具 |\n| `applyTemplate(type, opts?)` | 应用模板 |\n| `setTheme(theme)` | 设置主题 |\n| `setMode(mode)` | 设置编辑模式 |\n| `setZoom(zoom)` | 设置缩放 |\n| `fitView()` | 适应画布 |\n| `resetView()` | 重置视图 |\n| `getSelection()` | 获取选中项 |\n| `clearSelection()` | 清除选中 |\n| `undo()` | 撤销 |\n| `redo()` | 重做 |\n| `canUndo()` | 是否可撤销 |\n| `canRedo()` | 是否可重做 |\n| `exportPNG(options?)` | 导出 PNG |\n| `exportSVG(options?)` | 导出 SVG |\n| `download(filename, format, options?)` | 下载文件 |\n| `setMinimapEnabled(enabled)` | 启用/禁用小地图 |\n\n## 依赖\n\n- `@composy/room-designer-core` — 核心库\n- `vue-demi` — Vue 2/3 兼容层\n- `vue` ^2.7.0 || ^3.5.32 (peerDependency)\n\n## 许可证\n\nMIT License\n","readmeFilename":"README.md","_rev":"1-428b00bae0fffcbbfa2538672f5517b9"}