{"_id":"@burnmark-io/designer-vue","_rev":"5-e7387a2866401c35c8b8901b4a26a0f1","name":"@burnmark-io/designer-vue","dist-tags":{"latest":"0.5.1"},"versions":{"0.0.1":{"name":"@burnmark-io/designer-vue","version":"0.0.1","keywords":["label","designer","vue","vue3","composable","thermal","printer","barcode"],"author":{"name":"Mannes Brak"},"license":"MIT","_id":"@burnmark-io/designer-vue@0.0.1","maintainers":[{"name":"bankersman","email":"broodje@warmvle.es"}],"homepage":"https://burnmark-io.github.io/designer-core/","bugs":{"url":"https://github.com/burnmark-io/designer-core/issues"},"dist":{"shasum":"decaf0266d1180385e817f801c64faada717e07c","tarball":"https://registry.npmjs.org/@burnmark-io/designer-vue/-/designer-vue-0.0.1.tgz","fileCount":7,"integrity":"sha512-9LgRy+hwrWYcKmag5h+xyBDMXNPTXHTq8em8jzOdWo0joPnoJaQxuZsg1Mdg64kachu2gnM91LlGe4kX4HZL6Q==","signatures":[{"sig":"MEYCIQDIs/TMR68ooVYArl58kSmaR5tiqxT20Shoy0MyPC2iiQIhAKeVuxwX3MRxsiTIHDyfdUgaycimR8VSAsz6yiFQi1Rl","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":27380},"type":"module","_from":"file:burnmark-io-designer-vue-0.0.1.tgz","types":"./src/index.ts","engines":{"node":">=24.0.0"},"exports":{".":{"types":"./src/index.ts","import":"./dist/index.js"}},"funding":[{"url":"https://github.com/sponsors/mannes","type":"github"},{"url":"https://ko-fi.com/mannes","type":"ko-fi"}],"scripts":{"test":"vitest run","build":"tsc -p tsconfig.build.json","typecheck":"tsc -p tsconfig.json --noEmit","test:coverage":"vitest run --coverage"},"_npmUser":{"name":"bankersman","email":"broodje@warmvle.es"},"_resolved":"/tmp/b4b82aafdb986c590016450504082fc9/burnmark-io-designer-vue-0.0.1.tgz","_integrity":"sha512-9LgRy+hwrWYcKmag5h+xyBDMXNPTXHTq8em8jzOdWo0joPnoJaQxuZsg1Mdg64kachu2gnM91LlGe4kX4HZL6Q==","repository":{"url":"git+https://github.com/burnmark-io/designer-core.git","type":"git","directory":"packages/vue"},"_npmVersion":"11.9.0","description":"Vue 3 composable for the burnmark label design engine","directories":{},"sideEffects":false,"_nodeVersion":"24.14.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.4.0","vitest":"^2.0.0","happy-dom":"^15.0.0","typescript":"~5.5.0","@types/node":"^22.0.0","@vue/test-utils":"^2.4.0","@mbtech-nl/tsconfig":"^1.0.0","@vitest/coverage-v8":"^2.0.0","@burnmark-io/designer-core":"0.0.1"},"peerDependencies":{"vue":">=3.3.0","@burnmark-io/designer-core":"0.0.1"},"_npmOperationalInternal":{"tmp":"tmp/designer-vue_0.0.1_1776993794764_0.8454418921434113","host":"s3://npm-registry-packages-npm-production"}},"0.1.0":{"name":"@burnmark-io/designer-vue","version":"0.1.0","keywords":["label","designer","vue","vue3","composable","thermal","printer","barcode"],"author":{"name":"Mannes Brak"},"license":"MIT","_id":"@burnmark-io/designer-vue@0.1.0","maintainers":[{"name":"bankersman","email":"broodje@warmvle.es"}],"homepage":"https://burnmark-io.github.io/designer-core/","bugs":{"url":"https://github.com/burnmark-io/designer-core/issues"},"dist":{"shasum":"6cabcce0abd46dd1f83c2d7ff39300c90a208c53","tarball":"https://registry.npmjs.org/@burnmark-io/designer-vue/-/designer-vue-0.1.0.tgz","fileCount":7,"integrity":"sha512-yU3F1cE6Hs5n/uKslbupJcGDyUa4QslZqz4kdVpbAVpt5QDxt25rGlA3NwTOaMLcDCfAjq5DrSYiK/2hs+UrpQ==","signatures":[{"sig":"MEQCIF+ZD5LTyja6hcQ50zEXHoRcfEvxfYL57lRYnaZKuPLtAiBD3ziRooqLhkWke/M+ulOAgzaFxQ+HSK5WAkoblzkavw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@burnmark-io%2fdesigner-vue@0.1.0","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":26018},"type":"module","_from":"file:burnmark-io-designer-vue-0.1.0.tgz","types":"./src/index.ts","engines":{"node":">=24.0.0"},"exports":{".":{"types":"./src/index.ts","import":"./dist/index.js"}},"funding":[{"url":"https://github.com/sponsors/mannes","type":"github"},{"url":"https://ko-fi.com/mannes","type":"ko-fi"}],"scripts":{"test":"vitest run","build":"tsc -p tsconfig.build.json","typecheck":"tsc -p tsconfig.json --noEmit","test:coverage":"vitest run --coverage"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:7f0c66ea-2a38-4746-af1b-d6f9e0151309"}},"_resolved":"/tmp/792e0f680d87c2ca4a9a2ed0324c68c6/burnmark-io-designer-vue-0.1.0.tgz","_integrity":"sha512-yU3F1cE6Hs5n/uKslbupJcGDyUa4QslZqz4kdVpbAVpt5QDxt25rGlA3NwTOaMLcDCfAjq5DrSYiK/2hs+UrpQ==","repository":{"url":"git+https://github.com/burnmark-io/designer-core.git","type":"git","directory":"packages/vue"},"_npmVersion":"11.11.0","description":"Vue 3 composable for the burnmark label design engine","directories":{},"sideEffects":false,"_nodeVersion":"24.14.1","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.4.0","vitest":"^2.0.0","happy-dom":"^15.0.0","typescript":"~5.5.0","@types/node":"^22.0.0","@vue/test-utils":"^2.4.0","@mbtech-nl/tsconfig":"^1.0.0","@vitest/coverage-v8":"^2.0.0","@burnmark-io/designer-core":"0.1.0"},"peerDependencies":{"vue":">=3.3.0","@burnmark-io/designer-core":"0.1.0"},"_npmOperationalInternal":{"tmp":"tmp/designer-vue_0.1.0_1777075576257_0.10510718798241436","host":"s3://npm-registry-packages-npm-production"}},"0.2.0":{"name":"@burnmark-io/designer-vue","version":"0.2.0","keywords":["label","designer","vue","vue3","composable","thermal","printer","barcode"],"author":{"name":"Mannes Brak"},"license":"MIT","_id":"@burnmark-io/designer-vue@0.2.0","maintainers":[{"name":"bankersman","email":"broodje@warmvle.es"}],"homepage":"https://burnmark-io.github.io/designer-core/","bugs":{"url":"https://github.com/burnmark-io/designer-core/issues"},"dist":{"shasum":"f86b9fa3a3127fc3a4895848699303775b8fc4c9","tarball":"https://registry.npmjs.org/@burnmark-io/designer-vue/-/designer-vue-0.2.0.tgz","fileCount":7,"integrity":"sha512-WG+eQuUaNxp5tJTeMrd54HLIxhCl0DxqTJ1V7z8+5y23miajfXIeKX5I5F0w5APvXgkUlklnbCpHs36iyf9YMw==","signatures":[{"sig":"MEQCIFxklwPM4AhIW2WELpvLwWp5/EcHXnSGTXx5E9vY5YosAiAh0V/Ev8c2vps65oXvg70sXoa/kifP/DXjRnvwypcEMA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@burnmark-io%2fdesigner-vue@0.2.0","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":29376},"type":"module","_from":"file:burnmark-io-designer-vue-0.2.0.tgz","types":"./src/index.ts","engines":{"node":">=24.0.0"},"exports":{".":{"types":"./src/index.ts","import":"./dist/index.js"}},"funding":[{"url":"https://github.com/sponsors/mannes","type":"github"},{"url":"https://ko-fi.com/mannes","type":"ko-fi"}],"scripts":{"test":"vitest run","build":"tsc -p tsconfig.build.json","typecheck":"tsc -p tsconfig.json --noEmit","test:coverage":"vitest run --coverage"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:7f0c66ea-2a38-4746-af1b-d6f9e0151309"}},"_resolved":"/tmp/e2671a9cdb458d1cd0f07b0f7e32a88e/burnmark-io-designer-vue-0.2.0.tgz","_integrity":"sha512-WG+eQuUaNxp5tJTeMrd54HLIxhCl0DxqTJ1V7z8+5y23miajfXIeKX5I5F0w5APvXgkUlklnbCpHs36iyf9YMw==","repository":{"url":"git+https://github.com/burnmark-io/designer-core.git","type":"git","directory":"packages/vue"},"_npmVersion":"11.11.0","description":"Vue 3 composable for the burnmark label design engine","directories":{},"sideEffects":false,"_nodeVersion":"24.14.1","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.4.0","vitest":"^2.0.0","happy-dom":"^15.0.0","typescript":"~5.5.0","@types/node":"^22.0.0","@vue/test-utils":"^2.4.0","@mbtech-nl/tsconfig":"^1.0.1","@vitest/coverage-v8":"^2.0.0","@burnmark-io/designer-core":"0.2.0"},"peerDependencies":{"vue":">=3.3.0","@burnmark-io/designer-core":"0.2.0"},"_npmOperationalInternal":{"tmp":"tmp/designer-vue_0.2.0_1777318553153_0.4815969194913978","host":"s3://npm-registry-packages-npm-production"}},"0.5.0":{"name":"@burnmark-io/designer-vue","version":"0.5.0","keywords":["label","designer","vue","vue3","composable","thermal","printer","barcode"],"author":{"name":"Mannes Brak"},"license":"MIT","_id":"@burnmark-io/designer-vue@0.5.0","maintainers":[{"name":"bankersman","email":"broodje@warmvle.es"}],"homepage":"https://burnmark-io.github.io/designer-core/","bugs":{"url":"https://github.com/burnmark-io/designer-core/issues"},"dist":{"shasum":"69c4f2740bbcd5086ad8035c87ea85471eef97d2","tarball":"https://registry.npmjs.org/@burnmark-io/designer-vue/-/designer-vue-0.5.0.tgz","fileCount":7,"integrity":"sha512-czn9gRvYwzyNoLI9WyUGD/8Scc8cNulx/33PhwS8xjX8U9HLYJ53AzVClNkQeScf3K935Tz1MybnXZgcCLD3xg==","signatures":[{"sig":"MEYCIQCpiiQGB/+zL8SGCvaxDvLuyg4Yw43EkDvhRSzTmt8O0wIhAICzRsJWSAtBg3qsZTk8zoH8SqrKoNc5kn3ySazNKCkz","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@burnmark-io%2fdesigner-vue@0.5.0","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":29382},"type":"module","_from":"file:burnmark-io-designer-vue-0.5.0.tgz","types":"./dist/index.d.ts","engines":{"node":">=24.0.0"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"}},"funding":[{"url":"https://github.com/sponsors/mannes","type":"github"},{"url":"https://ko-fi.com/mannes","type":"ko-fi"}],"scripts":{"test":"vitest run","build":"tsc -p tsconfig.build.json","typecheck":"tsc -p tsconfig.json --noEmit","test:coverage":"vitest run --coverage"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:7f0c66ea-2a38-4746-af1b-d6f9e0151309"}},"_resolved":"/tmp/41a9f8333888a00efd864d4c4154328e/burnmark-io-designer-vue-0.5.0.tgz","_integrity":"sha512-czn9gRvYwzyNoLI9WyUGD/8Scc8cNulx/33PhwS8xjX8U9HLYJ53AzVClNkQeScf3K935Tz1MybnXZgcCLD3xg==","repository":{"url":"git+https://github.com/burnmark-io/designer-core.git","type":"git","directory":"packages/vue"},"_npmVersion":"11.11.0","description":"Vue 3 composable for the burnmark label design engine","directories":{},"sideEffects":false,"_nodeVersion":"24.14.1","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.4.0","vitest":"^2.0.0","happy-dom":"^15.0.0","typescript":"~5.5.0","@types/node":"^22.0.0","@vue/test-utils":"^2.4.0","@mbtech-nl/tsconfig":"^1.0.1","@vitest/coverage-v8":"^2.0.0","@burnmark-io/designer-core":"0.5.0"},"peerDependencies":{"vue":">=3.3.0","@burnmark-io/designer-core":"0.5.0"},"_npmOperationalInternal":{"tmp":"tmp/designer-vue_0.5.0_1777837874559_0.5210110017878975","host":"s3://npm-registry-packages-npm-production"}},"0.5.1":{"name":"@burnmark-io/designer-vue","version":"0.5.1","description":"Vue 3 composable for the burnmark label design engine","type":"module","author":{"name":"Mannes Brak"},"license":"MIT","homepage":"https://burnmark-io.github.io/designer-core/","repository":{"type":"git","url":"git+https://github.com/burnmark-io/designer-core.git","directory":"packages/vue"},"bugs":{"url":"https://github.com/burnmark-io/designer-core/issues"},"funding":[{"type":"github","url":"https://github.com/sponsors/mannes"},{"type":"ko-fi","url":"https://ko-fi.com/mannes"}],"keywords":["label","designer","vue","vue3","composable","thermal","printer","barcode"],"engines":{"node":">=24.0.0"},"publishConfig":{"access":"public"},"sideEffects":false,"types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"}},"peerDependencies":{"vue":">=3.3.0","@burnmark-io/designer-core":"0.5.1"},"devDependencies":{"@mbtech-nl/tsconfig":"^1.0.1","@types/node":"^22.0.0","@vitest/coverage-v8":"^2.0.0","@vue/test-utils":"^2.4.0","happy-dom":"^15.0.0","typescript":"~5.5.0","vitest":"^2.0.0","vue":"^3.4.0","@burnmark-io/designer-core":"0.5.1"},"scripts":{"build":"tsc -p tsconfig.build.json","typecheck":"tsc -p tsconfig.json --noEmit","test":"vitest run","test:coverage":"vitest run --coverage"},"_id":"@burnmark-io/designer-vue@0.5.1","_integrity":"sha512-CwpJl0Sg2LVZbB6FB7pauVw7wRBn/sphHWLWrAw/pLChEUdK3jBcLBB7EavedWjoeL6dX4zP/Lhh5Nn3KamsBA==","_resolved":"/tmp/9e4894a6656ba7e35acb13bf76ef3f0b/burnmark-io-designer-vue-0.5.1.tgz","_from":"file:burnmark-io-designer-vue-0.5.1.tgz","_nodeVersion":"24.14.1","_npmVersion":"11.11.0","dist":{"integrity":"sha512-CwpJl0Sg2LVZbB6FB7pauVw7wRBn/sphHWLWrAw/pLChEUdK3jBcLBB7EavedWjoeL6dX4zP/Lhh5Nn3KamsBA==","shasum":"82be1477e4cf9c89b27694d4f902963b3b49aa7d","tarball":"https://registry.npmjs.org/@burnmark-io/designer-vue/-/designer-vue-0.5.1.tgz","fileCount":7,"unpackedSize":29382,"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@burnmark-io%2fdesigner-vue@0.5.1","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIB8ndOlulRdq7Q5K9b5YK++Xmv3r3HnfOP+kG+RGCZL4AiBSWL+e3ewFcD71jUkbCNTJGkgTUS0o8vV4w7Wu8NRiXQ=="}]},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:7f0c66ea-2a38-4746-af1b-d6f9e0151309"}},"directories":{},"maintainers":[{"name":"bankersman","email":"broodje@warmvle.es"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/designer-vue_0.5.1_1777910503341_0.2078140260439345"},"_hasShrinkwrap":false}},"time":{"created":"2026-04-24T01:23:14.648Z","modified":"2026-05-04T16:01:43.794Z","0.0.1":"2026-04-24T01:23:14.891Z","0.1.0":"2026-04-25T00:06:16.403Z","0.2.0":"2026-04-27T19:35:53.294Z","0.5.0":"2026-05-03T19:51:14.757Z","0.5.1":"2026-05-04T16:01:43.495Z"},"bugs":{"url":"https://github.com/burnmark-io/designer-core/issues"},"author":{"name":"Mannes Brak"},"license":"MIT","homepage":"https://burnmark-io.github.io/designer-core/","keywords":["label","designer","vue","vue3","composable","thermal","printer","barcode"],"repository":{"type":"git","url":"git+https://github.com/burnmark-io/designer-core.git","directory":"packages/vue"},"description":"Vue 3 composable for the burnmark label design engine","maintainers":[{"name":"bankersman","email":"broodje@warmvle.es"}],"readme":"# @burnmark-io/designer-vue\n\nVue 3 composable for [`@burnmark-io/designer-core`](https://burnmark-io.github.io/designer-core/) — the headless label design engine behind [burnmark.io](https://burnmark.io).\n\nWraps a `LabelDesigner` instance in reactive state, manages a debounced render loop with stale-result cancellation, exposes selection state, and re-exports the core actions.\n\n## Install\n\n```sh\npnpm add @burnmark-io/designer-vue @burnmark-io/designer-core vue\n```\n\n`vue` (>=3.3) and `@burnmark-io/designer-core` are peer dependencies.\n\n## Quick start\n\n```vue\n<script setup lang=\"ts\">\nimport { useLabelDesigner } from '@burnmark-io/designer-vue';\n\nconst { document, bitmap, isRendering, canUndo, canRedo, add, undo, redo } = useLabelDesigner({\n  canvas: { widthDots: 696, heightDots: 0, dpi: 300 },\n});\n\nfunction addHello() {\n  add({\n    type: 'text',\n    x: 10,\n    y: 10,\n    width: 200,\n    height: 40,\n    rotation: 0,\n    opacity: 1,\n    locked: false,\n    visible: true,\n    color: '#000000',\n    content: 'Hello',\n    fontFamily: 'Burnmark Sans',\n    fontSize: 20,\n    fontWeight: 'normal',\n    fontStyle: 'normal',\n    textAlign: 'left',\n    verticalAlign: 'top',\n    letterSpacing: 0,\n    lineHeight: 1.2,\n    invert: false,\n    wrap: false,\n    autoHeight: false,\n  });\n}\n</script>\n\n<template>\n  <button @click=\"addHello\">Add text</button>\n  <button :disabled=\"!canUndo\" @click=\"undo\">Undo</button>\n  <button :disabled=\"!canRedo\" @click=\"redo\">Redo</button>\n  <p v-if=\"isRendering\">rendering…</p>\n  <p>{{ document.objects.length }} objects</p>\n</template>\n```\n\n## What you get back\n\n| name                  | type                                           | description                                             |\n| --------------------- | ---------------------------------------------- | ------------------------------------------------------- |\n| `designer`            | `LabelDesigner`                                | Raw instance — escape hatch                             |\n| `document`            | `ShallowRef<LabelDocument>`                    | Reactive document. Updates on every core `change` event |\n| `canUndo` / `canRedo` | `Ref<boolean>`                                 | History state                                           |\n| `bitmap`              | `ShallowRef<LabelBitmap \\| null>`              | Latest render (debounced 200ms)                         |\n| `planes`              | `ShallowRef<Map<string, LabelBitmap> \\| null>` | Multi-plane render when `capabilities` set              |\n| `isRendering`         | `Ref<boolean>`                                 | True while a render is in flight                        |\n| `renderWarning`       | `ShallowRef<RenderWarning \\| null>`            | Non-fatal warning from the core render pipeline         |\n| `renderError`         | `ShallowRef<Error \\| null>`                    | Render failure                                          |\n| `selection`           | `Ref<string[]>`                                | Selected object IDs — auto-pruned on remove             |\n| `select` / `deselect` | `(ids) => void` / `() => void`                 | Selection actions                                       |\n\nPlus the full designer action surface: `add`, `update`, `remove`, `reorder`, `get`, `getAll`, `setCanvas`, `undo`, `redo`, `clearHistory`, `loadDocument`, `newDocument`, `toJSON`, `fromJSON`, `getPlaceholders`, `applyVariables`, `render` (force immediate), `exportPng`, `exportPdf`, `exportSheet`, `exportBundled`.\n\n## Options\n\n```ts\nuseLabelDesigner({\n  canvas?: Partial<CanvasConfig>;            // when binding constructs the designer\n  name?: string;\n  designer?: LabelDesigner;                  // wrap an externally-owned instance\n  capabilities?: PrinterCapabilities;        // switches render to multi-plane mode\n  renderDebounceMs?: number;                 // default 200\n  renderOnMount?: boolean;                   // default true — initial bitmap without user action\n  maxHistoryDepth?: number;\n  assetLoader?: AssetLoader;\n});\n```\n\n## Notes\n\n- `document` is a `shallowRef`. Core mutates the document in place — the composable replaces the ref on every `change` event to force reactivity. Do not deeply watch the document object tree; watch `document` itself.\n- Renders are debounced and cancellable. If a newer change arrives while a render is in flight, the stale result is discarded via a generation counter.\n- `exportBundled()` returns `{ blob, missing }` — the list of asset keys the bundler could not resolve, mirroring the core contract.\n- All event listeners and pending timers are cleaned up via `onScopeDispose`, which fires on component unmount or manual `effectScope().stop()`.\n\n## License\n\nMIT\n","readmeFilename":"README.md"}