{"_id":"@composy/compress-vue","name":"@composy/compress-vue","dist-tags":{"latest":"0.0.1"},"versions":{"0.0.1":{"name":"@composy/compress-vue","version":"0.0.1","description":"Vue components for @composy/compress-core","keywords":["compress","vue","vue3","vue2","component"],"author":{"name":"LDesign Team"},"license":"MIT","type":"module","sideEffects":["*.vue","*.tsx","*.jsx","dist/*","es/**/style/**","esm/**/style/**"],"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"},"./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","./index.min.css":"./dist/index.min.css","./style/index.css":"./es/style/index.css","./style/index.less":"./esm/style/index.less","./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","postbuild":"node --experimental-strip-types ../../../../scripts/index.ts workspace:ensure-package-outputs --cwd .. --target vue","dev":"ldesign-builder build --watch","type-check":"vue-tsc --noEmit -p tsconfig.json","lint":"eslint . --cache","lint:check":"eslint . --cache --max-warnings 0","lint:fix":"eslint . --cache --fix","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/compress-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/compress-vue@0.0.1","_nodeVersion":"23.11.1","_npmVersion":"10.9.2","dist":{"integrity":"sha512-xuq46kK6FL1bu8+317jPeBOO3JqjrjWKZaBIIGX+zefgDezL4PB4G4eHFKmAPpdk4hnIV8w4TEw6Nt1OuI8vyw==","shasum":"d05e2123dd322db04ddd1d67e426f6db5014ffac","tarball":"https://registry.npmjs.org/@composy/compress-vue/-/compress-vue-0.0.1.tgz","fileCount":125,"unpackedSize":445814,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIHXNEsuvb7Fdy1r+0hhUj1hwhapv2b0d/xa1xT3fA8+EAiBoo3EZj+YeC9brFktQgnbraJZv0VaEExugm8w69qQdOw=="}]},"_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/compress-vue_0.0.1_1786949045672_0.3366160951351944"},"_hasShrinkwrap":false}},"time":{"created":"2026-08-17T06:44:05.531Z","0.0.1":"2026-08-17T06:44:05.827Z","modified":"2026-08-17T06:44:06.183Z"},"maintainers":[{"name":"swimly","email":"979741120@qq.com"}],"description":"Vue components for @composy/compress-core","keywords":["compress","vue","vue3","vue2","component"],"author":{"name":"LDesign Team"},"license":"MIT","readme":"# @composy/compress-vue\n\nVue adapter for `@composy/compress-core`.\n\n## Features\n\n- `CompressUpload` drag-and-drop upload component\n- `useCompress()` composable with progress, batch errors and cancellation\n- Native Vue plugin and engine plugin integration\n- Shared `Compressor` injection through typed Vue injection keys\n- All visible classes use the `ldesign-` prefix\n- Component CSS variables use `--ldesign-compress-*`\n- Color values reference `packages/color` variables such as `--color-primary-default`\n- Size, spacing, radius, typography, motion and shadow values reference `packages/size` variables such as `--size-spacing-md`\n- Engine-style build outputs: `dist`, `es`, `esm`, and `lib`\n\n## Usage\n\n```vue\n<script setup lang=\"ts\">\nimport { CompressUpload } from '@composy/compress-vue';\n\nfunction handleCompress(result) {\n  console.log(result.outputName, result.savedRatio);\n}\n</script>\n\n<template>\n  <CompressUpload\n    :options=\"{ quality: 0.72, maxWidth: 1600, mimeType: 'image/webp' }\"\n    :max-count=\"12\"\n    @compress=\"handleCompress\"\n  />\n</template>\n```\n\n## Composable\n\n```ts\nimport { useCompress } from '@composy/compress-vue';\n\nconst {\n  compress,\n  compressBatch,\n  compressing,\n  progress,\n  results,\n  batchErrors,\n  cancel,\n} = useCompress({ quality: 0.75 });\n```\n\n## Plugin\n\n```ts\nimport { createApp } from 'vue';\nimport { createCompressPlugin } from '@composy/compress-vue';\n\napp.use(createCompressPlugin({\n  componentName: 'LCompressUpload',\n  defaultOptions: { quality: 0.8 },\n}));\n```\n\n## Styling Contract\n\nThe upload component uses BEM-style class names:\n\n- `ldesign-compress-upload`\n- `ldesign-compress-upload__dropzone`\n- `ldesign-compress-upload__toolbar`\n- `ldesign-compress-upload__item`\n- `ldesign-compress-upload__button`\n\nComponent variables are scoped on `.ldesign-compress-upload`, for example:\n\n- `--ldesign-compress-color-primary: var(--color-primary-default)`\n- `--ldesign-compress-color-bg: var(--color-gray-50)`\n- `--ldesign-compress-spacing-md: var(--size-spacing-md)`\n- `--ldesign-compress-radius-md: var(--size-radius-md)`\n- `--ldesign-compress-button-height: var(--size-comp-size-m)`\n\nConsumers should load the global LDesign color and size variable styles before rendering the component.\n\n## Build Outputs\n\nThe package uses `@composy/builder` and emits:\n\n- `dist/index.js`\n- `dist/index.min.js`\n- `dist/index.css`\n- `dist/index.min.css`\n- `es/index.js`\n- `esm/index.js`\n- `lib/index.cjs`\n- Type declarations in `es`, `esm`, and `lib`\n\n## Commands\n\n```bash\npnpm --dir libraries/compress/packages/vue run type-check\npnpm --dir libraries/compress/packages/vue run build\n```\n\nIn this repository, `vue-tsc@3.x` is required for the current TypeScript and Node runtime.\n","readmeFilename":"README.md","_rev":"1-eeb8f7573416465eddf28ad7ddeb2ad8"}