{"_id":"@composy/clipboard-vue","name":"@composy/clipboard-vue","dist-tags":{"latest":"0.0.1"},"versions":{"0.0.1":{"name":"@composy/clipboard-vue","version":"0.0.1","description":"Vue components for @composy/clipboard-core","keywords":["clipboard","vue","vue3","vue2","component"],"author":{"name":"LDesign Team"},"license":"MIT","type":"module","sideEffects":false,"exports":{".":{"types":"./es/index.d.ts","import":"./es/index.js","require":"./lib/index.cjs","default":"./es/index.js"},"./components":{"types":"./es/components/index.d.ts","import":"./es/components/index.js","require":"./lib/components/index.cjs","default":"./es/components/index.js"},"./components/*":{"types":"./es/components/*.d.ts","import":"./es/components/*.js","require":"./lib/components/*.cjs","default":"./es/components/*.js"},"./composables":{"types":"./es/composables/index.d.ts","import":"./es/composables/index.js","require":"./lib/composables/index.cjs","default":"./es/composables/index.js"},"./composables/*":{"types":"./es/composables/*.d.ts","import":"./es/composables/*.js","require":"./lib/composables/*.cjs","default":"./es/composables/*.js"},"./directives":{"types":"./es/directives/index.d.ts","import":"./es/directives/index.js","require":"./lib/directives/index.cjs","default":"./es/directives/index.js"},"./directives/*":{"types":"./es/directives/*.d.ts","import":"./es/directives/*.js","require":"./lib/directives/*.cjs","default":"./es/directives/*.js"},"./plugins":{"types":"./es/plugins/index.d.ts","import":"./es/plugins/index.js","require":"./lib/plugins/index.cjs","default":"./es/plugins/index.js"},"./plugins/*":{"types":"./es/plugins/*.d.ts","import":"./es/plugins/*.js","require":"./lib/plugins/*.cjs","default":"./es/plugins/*.js"},"./types":{"types":"./es/types/index.d.ts","import":"./es/types/index.js","require":"./lib/types/index.cjs","default":"./es/types/index.js"},"./types/*":{"types":"./es/types/*.d.ts","import":"./es/types/*.js","require":"./lib/types/*.cjs","default":"./es/types/*.js"},"./index.css":"./dist/index.css","./style.css":"./dist/style.css","./package.json":"./package.json"},"main":"./lib/index.cjs","module":"./es/index.js","types":"./es/index.d.ts","unpkg":"./dist/index.min.js","jsdelivr":"./dist/index.min.js","scripts":{"build":"ldesign-builder build && node --experimental-strip-types ../../../../scripts/index.ts workspace:ensure-package-outputs --cwd .. --target vue","dev":"vite build --watch","lint":"eslint . --cache","lint:check":"eslint . --cache --max-warnings 0","lint:fix":"eslint . --cache --fix","type-check":"vue-tsc -p tsconfig.json --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/clipboard-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/index.css","typings":"./es/index.d.ts","browser":"./dist/index.js","_id":"@composy/clipboard-vue@0.0.1","_nodeVersion":"23.11.1","_npmVersion":"10.9.2","dist":{"integrity":"sha512-KRQXV6eDpN+Ji4LkzHPkyXZUdDvPTZRYVT6DKXQItv6SRM7wJVOiXpC33oW380z1f6JYs5+xI3BxXax2DOKPUA==","shasum":"b6593dfc8bf77590edb864c3dc98c77627659f54","tarball":"https://registry.npmjs.org/@composy/clipboard-vue/-/clipboard-vue-0.0.1.tgz","fileCount":147,"unpackedSize":397322,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQDtA7QZ16IBk+m9tCIOrPj+TVpBDwop3FerznWLjv7swgIhAKrfiyRIKmDIqMEerSg3JJ69MVUiK/JnTPAI27y4haai"}]},"_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/clipboard-vue_0.0.1_1786949027292_0.0456260638613295"},"_hasShrinkwrap":false}},"time":{"created":"2026-08-17T06:43:47.102Z","0.0.1":"2026-08-17T06:43:47.437Z","modified":"2026-08-17T06:43:47.709Z"},"maintainers":[{"name":"swimly","email":"979741120@qq.com"}],"description":"Vue components for @composy/clipboard-core","keywords":["clipboard","vue","vue3","vue2","component"],"author":{"name":"LDesign Team"},"license":"MIT","readme":"# @composy/clipboard-vue\n\n`@composy/clipboard-core` 的 Vue 适配包，提供组件、组合式函数、指令和插件。\n\n## 功能特性\n\n- `<Clipboard>` 组件：容器级 copy/paste 监听、slot 方法暴露、状态和可访问反馈。\n- `useClipboard()`：响应式封装核心实例，提供复制、读取、状态、历史记录和错误状态。\n- `v-clipboard` 指令：点击复制文本、HTML、富文本、JSON、URL，支持 `.cut`。\n- `ClipboardVuePlugin`：注册全局组件、指令、`provide/inject` 和 `$clipboard`。\n- `createClipboardEnginePlugin()`：适配 `@composy/engine-vue` 插件上下文。\n- 可见 class 全部以 `ldesign-clipboard` 开头，样式复用 core 的 CSS var/token 规范。\n\n## 安装\n\n```bash\npnpm add @composy/clipboard-core @composy/clipboard-vue\n```\n\n样式：\n\n```ts\nimport '@composy/clipboard-vue/index.css';\n```\n\n使用前应加载 LDesign `styles/color.css` 与 `styles/size.css`，否则 `--color-*`、`--size-*` 上游 token 可能未定义。\n\n## 组件\n\n```vue\n<script setup lang=\"ts\">\nimport { Clipboard } from '@composy/clipboard-vue';\n\nfunction handleCopy(data) {\n  console.log(data.formats);\n}\n</script>\n\n<template>\n  <Clipboard\n    value=\"Hello LDesign\"\n    copy-on-click\n    @copy=\"handleCopy\"\n  >\n    <button class=\"ldesign-clipboard__trigger\">\n      Copy\n    </button>\n  </Clipboard>\n</template>\n```\n\nslot 会暴露 `copy`、`copyText`、`copyHtml`、`read`、`status`、`feedback`。\n\n## 组合式函数\n\n```ts\nimport { useClipboard } from '@composy/clipboard-vue';\n\nconst {\n  copyText,\n  copyHtml,\n  copyJson,\n  read,\n  status,\n  history,\n  lastError,\n} = useClipboard();\n\nawait copyText('Hello');\nawait copyJson({ ok: true }, 2);\nconst data = await read();\n```\n\n传入容器 ref 后，容器变更会同步到核心实例：\n\n```ts\nconst container = ref<HTMLElement | null>(null);\nconst clipboard = useClipboard({ container });\n```\n\n## 指令\n\n```vue\n<button v-clipboard=\"'Hello'\">Copy text</button>\n<button v-clipboard:html=\"'<b>Hello</b>'\">Copy HTML</button>\n<button v-clipboard:json=\"{ ok: true }\">Copy JSON</button>\n<button v-clipboard:url=\"'https://ldesign.longrise.com'\">Copy URL</button>\n```\n\n复制成功会触发 `clipboard-success`，失败触发 `clipboard-error`：\n\n```ts\nel.addEventListener('clipboard-success', (event) => {\n  console.log(event.detail.value, event.detail.format);\n});\n```\n\n## 插件\n\n```ts\nimport { createApp } from 'vue';\nimport { ClipboardVuePlugin } from '@composy/clipboard-vue';\n\ncreateApp(App).use(ClipboardVuePlugin, {\n  componentName: 'LClipboard',\n  directiveName: 'clipboard',\n});\n```\n\n## 构建产物\n\n`pnpm --filter @composy/clipboard-vue build` 会生成：\n\n- `dist/index.js`、`dist/index.min.js`、`dist/index.css`\n- `es/**`\n- `esm/**`\n- `lib/**`\n\n## 开发命令\n\n```bash\npnpm --filter @composy/clipboard-vue type-check\npnpm --filter @composy/clipboard-vue build\n```\n\n当前工作区若尚未刷新 `node_modules`，`type-check` 可能仍解析到旧 `vue-tsc@1.8.x`。可在安装刷新后使用脚本，或临时使用工作区已有的 `vue-tsc@3.2.8` 直接校验。\n\n## License\n\nMIT\n","readmeFilename":"README.md","_rev":"1-f03af3023423765623da5385609737fc"}