{"_id":"@apexpath/canvas-editor","_rev":"6-dd5edd8d1d35b02cfcb2a99a2862d452","name":"@apexpath/canvas-editor","dist-tags":{"latest":"1.0.6"},"versions":{"1.0.1":{"name":"@apexpath/canvas-editor","version":"1.0.1","keywords":["canvas","editor","react","konva","design","drawing","graphics","text-effects","multi-page","component-library"],"author":{"name":"Canvas Editor Contributors"},"license":"MIT","_id":"@apexpath/canvas-editor@1.0.1","maintainers":[{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"}],"homepage":"https://github.com/Prahladkumar11/canvas-editor#readme","bugs":{"url":"https://github.com/Prahladkumar11/canvas-editor/issues"},"dist":{"shasum":"4747e8ba29e79b9f2edef06d3f6df842352bd2e5","tarball":"https://registry.npmjs.org/@apexpath/canvas-editor/-/canvas-editor-1.0.1.tgz","fileCount":6,"integrity":"sha512-ZpPTvf0pxajrEPXIFclQvG2gHewqrfg+WYRETY5plSKLyYMwnCmrFc4ZoSWR+oTkuNLpnz1PmGJ/DkFrsISPtw==","signatures":[{"sig":"MEUCIQDg9g5E6afyxfBi2dv/EouMQLYYvUHpd0a4eNC0SzCmzQIgOVvQPj1CrBT1RPn0fZxHku3cXxX+zq77g9F1Nc3FQr4=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2408527},"main":"./dist/canvas-editor.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/canvas-editor.mjs","exports":{".":{"import":"./dist/canvas-editor.mjs","require":"./dist/canvas-editor.cjs"},"./styles":"./dist/canvas-editor.css"},"gitHead":"7b312a136430e8ce0025eb83bbaaee191a093fcb","scripts":{"dev":"vite --port=3001 --host=0.0.0.0","lint":"tsc --noEmit","build":"vite build","clean":"rm -rf dist","preview":"vite preview","build:lib":"cross-env LIB_BUILD=true vite build","build:watch":"cross-env LIB_BUILD=true vite build --watch","prepublishonly":"npm run build:lib && npm run lint"},"_npmUser":{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"},"repository":{"url":"git+https://github.com/Prahladkumar11/canvas-editor.git","type":"git"},"_npmVersion":"11.4.2","description":"Powerful React/Konva canvas editor with floating toolbars, multi-page support, and text effects","directories":{},"_nodeVersion":"22.17.0","dependencies":{"clsx":"^2.1.1","uuid":"^13.0.0","jszip":"^3.10.1","konva":"^10.2.0","motion":"^12.23.24","date-fns":"^4.1.0","recharts":"^3.8.0","use-image":"^1.1.4","react-konva":"^19.2.3","lucide-react":"^0.546.0","webfontloader":"^1.6.28","@iconify/react":"^6.0.2","@radix-ui/react-popover":"^1.1.15"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^6.2.0","react":"^19.0.0","cross-env":"^7.0.3","react-dom":"^19.0.0","typescript":"~5.8.2","@types/node":"^22.14.0","@types/uuid":"^10.0.0","@types/jszip":"^3.4.0","vite-plugin-dts":"^4.5.4","@types/webfontloader":"^1.6.38","@vitejs/plugin-react":"^5.0.4"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/canvas-editor_1.0.1_1773811127858_0.8399104427433985","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@apexpath/canvas-editor","version":"1.0.2","keywords":["canvas","editor","react","konva","design","drawing","graphics","text-effects","multi-page","component-library"],"author":{"name":"Canvas Editor Contributors"},"license":"MIT","_id":"@apexpath/canvas-editor@1.0.2","maintainers":[{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"}],"homepage":"https://github.com/Prahladkumar11/canvas-editor#readme","bugs":{"url":"https://github.com/Prahladkumar11/canvas-editor/issues"},"dist":{"shasum":"f64579c5175f93c166dd571ba673711b05749c15","tarball":"https://registry.npmjs.org/@apexpath/canvas-editor/-/canvas-editor-1.0.2.tgz","fileCount":5,"integrity":"sha512-4plWuCJFkxnw5KgpHvZDHag7JSsq/WWfvG9jIVOFBEYkWB0FgMocHXDUnrPMqCJxo6ub8NGig5IObiNCcBBL6w==","signatures":[{"sig":"MEYCIQCnSgM1HHOyTuvAdL0iKPu3JBXQXkC7fkz26FR/9/xPZgIhAOAE5MaHr1P1/4T3zKmwhmroNCMHMwVWINNmuPqsGOBi","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2138411},"main":"./dist/canvas-editor.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/canvas-editor.mjs","exports":{".":{"import":"./dist/canvas-editor.mjs","require":"./dist/canvas-editor.cjs"},"./styles":"./dist/canvas-editor.css"},"gitHead":"42e570c8a508179c092feded3432f7b3325596c4","scripts":{"dev":"vite --port=3001 --host=0.0.0.0","lint":"tsc --noEmit","build":"vite build","clean":"rm -rf dist","preview":"vite preview","build:lib":"cross-env LIB_BUILD=true vite build","build:watch":"cross-env LIB_BUILD=true vite build --watch","prepublishonly":"npm run build:lib && npm run lint"},"_npmUser":{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"},"repository":{"url":"git+https://github.com/Prahladkumar11/canvas-editor.git","type":"git"},"_npmVersion":"11.4.2","description":"Powerful React/Konva canvas editor with floating toolbars, multi-page support, and text effects","directories":{},"_nodeVersion":"22.17.0","dependencies":{"clsx":"^2.1.1","uuid":"^13.0.0","jszip":"^3.10.1","konva":"^10.2.0","motion":"^12.23.24","date-fns":"^4.1.0","recharts":"^3.8.0","use-image":"^1.1.4","react-konva":"^19.2.3","lucide-react":"^0.546.0","webfontloader":"^1.6.28","@iconify/react":"^6.0.2","@radix-ui/react-popover":"^1.1.15"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^6.2.0","react":"^19.0.0","cross-env":"^7.0.3","react-dom":"^19.0.0","typescript":"~5.8.2","@types/node":"^22.14.0","@types/uuid":"^10.0.0","@types/jszip":"^3.4.0","vite-plugin-dts":"^4.5.4","@types/webfontloader":"^1.6.38","@vitejs/plugin-react":"^5.0.4"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/canvas-editor_1.0.2_1773842252225_0.22677188390234293","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@apexpath/canvas-editor","version":"1.0.3","keywords":["canvas","editor","react","konva","design","drawing","graphics","text-effects","multi-page","component-library"],"author":{"name":"Canvas Editor Contributors"},"license":"MIT","_id":"@apexpath/canvas-editor@1.0.3","maintainers":[{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"}],"homepage":"https://github.com/Prahladkumar11/canvas-editor#readme","bugs":{"url":"https://github.com/Prahladkumar11/canvas-editor/issues"},"dist":{"shasum":"7db7155d55f4ae9355048cfa71c69aa5b0764b1b","tarball":"https://registry.npmjs.org/@apexpath/canvas-editor/-/canvas-editor-1.0.3.tgz","fileCount":5,"integrity":"sha512-Y5tUZaUrMHcuE2fROiqQaVRAxI75+eskLWzvrDISHx9OPqZLioYIPl5CNYetl3jn006FJmnY5M9YT4cfqxAcRg==","signatures":[{"sig":"MEYCIQCl22hRUwRFj2xY+CFtduEVnoV7z6Wp3EImT/onyCEgowIhAOu8tNEIh0GaptjjMNxjUVMr5pY5yFDq2GV0DVovG9DW","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2138448},"main":"./dist/canvas-editor.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/canvas-editor.mjs","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/canvas-editor.mjs","require":"./dist/canvas-editor.cjs"},"./styles":"./dist/canvas-editor.css"},"gitHead":"42e570c8a508179c092feded3432f7b3325596c4","scripts":{"dev":"vite --port=3001 --host=0.0.0.0","lint":"tsc --noEmit","build":"vite build","clean":"rm -rf dist","preview":"vite preview","build:lib":"cross-env LIB_BUILD=true vite build","build:watch":"cross-env LIB_BUILD=true vite build --watch","prepublishonly":"npm run build:lib && npm run lint"},"_npmUser":{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"},"repository":{"url":"git+https://github.com/Prahladkumar11/canvas-editor.git","type":"git"},"_npmVersion":"11.4.2","description":"Powerful React/Konva canvas editor with floating toolbars, multi-page support, and text effects","directories":{},"_nodeVersion":"22.17.0","dependencies":{"clsx":"^2.1.1","uuid":"^13.0.0","jszip":"^3.10.1","konva":"^10.2.0","motion":"^12.23.24","date-fns":"^4.1.0","recharts":"^3.8.0","use-image":"^1.1.4","react-konva":"^19.2.3","lucide-react":"^0.546.0","webfontloader":"^1.6.28","@iconify/react":"^6.0.2","@radix-ui/react-popover":"^1.1.15"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^6.2.0","react":"^19.0.0","cross-env":"^7.0.3","react-dom":"^19.0.0","typescript":"~5.8.2","@types/node":"^22.14.0","@types/uuid":"^10.0.0","@types/jszip":"^3.4.0","vite-plugin-dts":"^4.5.4","@types/webfontloader":"^1.6.38","@vitejs/plugin-react":"^5.0.4"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/canvas-editor_1.0.3_1773902153396_0.26389147830354087","host":"s3://npm-registry-packages-npm-production"}},"1.0.4":{"name":"@apexpath/canvas-editor","version":"1.0.4","keywords":["canvas","editor","react","konva","design","drawing","graphics","text-effects","multi-page","component-library"],"author":{"name":"Canvas Editor Contributors"},"license":"MIT","_id":"@apexpath/canvas-editor@1.0.4","maintainers":[{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"}],"homepage":"https://github.com/Prahladkumar11/canvas-editor#readme","bugs":{"url":"https://github.com/Prahladkumar11/canvas-editor/issues"},"dist":{"shasum":"2defe4e7c5a7a67608cf70af13e4bf798acceebf","tarball":"https://registry.npmjs.org/@apexpath/canvas-editor/-/canvas-editor-1.0.4.tgz","fileCount":6,"integrity":"sha512-n3fmTYEABb2VVbI8/CWOfx4Q0+xb3cIcLH7AFVlpL3VBDXYKx7qt+wvLc7fPbqSZ9GnrpBV54xjYducWYPnl+A==","signatures":[{"sig":"MEUCIQC74gVljC+Tjd1EjtlRoe6QWxaZRgbWQPEvolpd/eIBGQIgNojk2spjR4WnrVscpAE8dvUnUB0TmcfCaSjAmDrKl0Q=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2151625},"main":"./dist/canvas-editor.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/canvas-editor.mjs","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/canvas-editor.mjs","require":"./dist/canvas-editor.cjs"},"./styles":"./dist/canvas-editor.css"},"gitHead":"42e570c8a508179c092feded3432f7b3325596c4","scripts":{"dev":"vite --port=3001 --host=0.0.0.0","lint":"tsc --noEmit","build":"vite build","clean":"rm -rf dist","preview":"vite preview","build:lib":"cross-env LIB_BUILD=true vite build","build:watch":"cross-env LIB_BUILD=true vite build --watch","prepublishonly":"npm run build:lib && npm run lint"},"_npmUser":{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"},"repository":{"url":"git+https://github.com/Prahladkumar11/canvas-editor.git","type":"git"},"_npmVersion":"11.4.2","description":"Powerful React/Konva canvas editor with floating toolbars, multi-page support, and text effects","directories":{},"_nodeVersion":"22.17.0","dependencies":{"clsx":"^2.1.1","uuid":"^13.0.0","jszip":"^3.10.1","konva":"^10.2.0","motion":"^12.23.24","date-fns":"^4.1.0","recharts":"^3.8.0","use-image":"^1.1.4","react-konva":"^19.2.3","lucide-react":"^0.546.0","webfontloader":"^1.6.28","@iconify/react":"^6.0.2","@radix-ui/react-popover":"^1.1.15"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^6.2.0","react":"^19.0.0","cross-env":"^7.0.3","react-dom":"^19.0.0","typescript":"~5.8.2","@types/node":"^22.14.0","@types/uuid":"^10.0.0","@types/jszip":"^3.4.0","vite-plugin-dts":"^4.5.4","@types/webfontloader":"^1.6.38","@vitejs/plugin-react":"^5.0.4"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/canvas-editor_1.0.4_1773902884275_0.24988338657426867","host":"s3://npm-registry-packages-npm-production"}},"1.0.5":{"name":"@apexpath/canvas-editor","version":"1.0.5","keywords":["canvas","editor","react","konva","design","drawing","graphics","text-effects","multi-page","component-library"],"author":{"name":"Canvas Editor Contributors"},"license":"MIT","_id":"@apexpath/canvas-editor@1.0.5","maintainers":[{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"}],"homepage":"https://github.com/Prahladkumar11/canvas-editor#readme","bugs":{"url":"https://github.com/Prahladkumar11/canvas-editor/issues"},"dist":{"shasum":"4168a8a833c211f93628dbd2454163d0dfbe4e0a","tarball":"https://registry.npmjs.org/@apexpath/canvas-editor/-/canvas-editor-1.0.5.tgz","fileCount":6,"integrity":"sha512-/Kr+ubZPMnutZGb4ElK1QrjysAwASDm6pLUDhLlEe45otwQWVWfkV+gUIEadTtp2lw+sv3lVa1AaYn3JgRvIVg==","signatures":[{"sig":"MEUCIAuVUxLjxBRxxljPXpSDq278zD6KzZjH/Y+0kzJKZmzOAiEA2YRcW2oomhahCqm32iqYqVZG0Fjjpu6wB0MenFLUivQ=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2156727},"main":"./dist/canvas-editor.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/canvas-editor.mjs","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/canvas-editor.mjs","require":"./dist/canvas-editor.cjs"},"./styles":"./dist/canvas-editor.css"},"gitHead":"e50813aa68d0b26cd786b7d17d26c743a89d6bf7","scripts":{"dev":"vite --port=3001 --host=0.0.0.0","lint":"tsc --noEmit","build":"vite build","clean":"rm -rf dist","preview":"vite preview","build:lib":"cross-env LIB_BUILD=true vite build","build:watch":"cross-env LIB_BUILD=true vite build --watch","prepublishonly":"npm run build:lib && npm run lint"},"_npmUser":{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"},"repository":{"url":"git+https://github.com/Prahladkumar11/canvas-editor.git","type":"git"},"_npmVersion":"11.4.2","description":"Powerful React/Konva canvas editor with floating toolbars, multi-page support, and text effects","directories":{},"_nodeVersion":"22.17.0","dependencies":{"clsx":"^2.1.1","uuid":"^13.0.0","jszip":"^3.10.1","konva":"^10.2.0","motion":"^12.23.24","date-fns":"^4.1.0","recharts":"^3.8.0","use-image":"^1.1.4","react-konva":"^19.2.3","lucide-react":"^0.546.0","webfontloader":"^1.6.28","@iconify/react":"^6.0.2","@radix-ui/react-popover":"^1.1.15"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^6.2.0","react":"^19.0.0","cross-env":"^7.0.3","react-dom":"^19.0.0","typescript":"~5.8.2","@types/node":"^22.14.0","@types/uuid":"^10.0.0","@types/jszip":"^3.4.0","vite-plugin-dts":"^4.5.4","@types/webfontloader":"^1.6.38","@vitejs/plugin-react":"^5.0.4"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/canvas-editor_1.0.5_1774011202404_0.6657456376671713","host":"s3://npm-registry-packages-npm-production"}},"1.0.6":{"name":"@apexpath/canvas-editor","version":"1.0.6","type":"module","description":"Powerful React/Konva canvas editor with floating toolbars, multi-page support, and text effects","main":"./dist/canvas-editor.cjs","module":"./dist/canvas-editor.mjs","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/canvas-editor.mjs","require":"./dist/canvas-editor.cjs"},"./styles":"./dist/canvas-editor.css"},"scripts":{"dev":"vite --port=3001 --host=0.0.0.0","build":"vite build","build:lib":"cross-env LIB_BUILD=true vite build","build:watch":"cross-env LIB_BUILD=true vite build --watch","preview":"vite preview","clean":"rm -rf dist","lint":"tsc --noEmit","prepublishonly":"npm run build:lib && npm run lint"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"dependencies":{"@iconify/react":"^6.0.2","@radix-ui/react-popover":"^1.1.15","clsx":"^2.1.1","date-fns":"^4.1.0","jszip":"^3.10.1","konva":"^10.2.0","lucide-react":"^0.546.0","motion":"^12.23.24","react-konva":"^19.2.3","recharts":"^3.8.0","use-image":"^1.1.4","uuid":"^13.0.0","webfontloader":"^1.6.28"},"devDependencies":{"@types/jszip":"^3.4.0","@types/node":"^22.14.0","@types/uuid":"^10.0.0","@types/webfontloader":"^1.6.38","@vitejs/plugin-react":"^5.0.4","cross-env":"^7.0.3","react":"^19.0.0","react-dom":"^19.0.0","typescript":"~5.8.2","vite":"^6.2.0","vite-plugin-dts":"^4.5.4"},"keywords":["canvas","editor","react","konva","design","drawing","graphics","text-effects","multi-page","component-library"],"author":{"name":"Canvas Editor Contributors"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/Prahladkumar11/canvas-editor.git"},"_id":"@apexpath/canvas-editor@1.0.6","gitHead":"b3719c2d93181e2f65a34371f9f9b76695d10814","bugs":{"url":"https://github.com/Prahladkumar11/canvas-editor/issues"},"homepage":"https://github.com/Prahladkumar11/canvas-editor#readme","_nodeVersion":"22.14.0","_npmVersion":"11.5.2","dist":{"integrity":"sha512-0CjStfDUMqB97NYAueLQSc8g6zxgKJYmL8p10RF81Msk76MLkbdZusQxKqKq5qz+9Ad0aujigJog6wpMxsAdGg==","shasum":"22891631f2571fcdcd9d1c17f51bff46c413044f","tarball":"https://registry.npmjs.org/@apexpath/canvas-editor/-/canvas-editor-1.0.6.tgz","fileCount":6,"unpackedSize":2221835,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIBnhzi+GDHz7hexYoxyHdD8pnoAtS7clzCkxgsqfcSm3AiAs6xXZYv1PiYQpztXt1PxeRU9B6hRbyGe6o5FOboliAA=="}]},"_npmUser":{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"},"directories":{},"maintainers":[{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/canvas-editor_1.0.6_1776855643183_0.19618136766468353"},"_hasShrinkwrap":false}},"time":{"created":"2026-03-18T05:18:47.794Z","modified":"2026-04-22T11:00:43.491Z","1.0.1":"2026-03-18T05:18:48.037Z","1.0.2":"2026-03-18T13:57:32.388Z","1.0.3":"2026-03-19T06:35:53.563Z","1.0.4":"2026-03-19T06:48:04.500Z","1.0.5":"2026-03-20T12:53:22.568Z","1.0.6":"2026-04-22T11:00:43.390Z"},"bugs":{"url":"https://github.com/Prahladkumar11/canvas-editor/issues"},"author":{"name":"Canvas Editor Contributors"},"license":"MIT","homepage":"https://github.com/Prahladkumar11/canvas-editor#readme","keywords":["canvas","editor","react","konva","design","drawing","graphics","text-effects","multi-page","component-library"],"repository":{"type":"git","url":"git+https://github.com/Prahladkumar11/canvas-editor.git"},"description":"Powerful React/Konva canvas editor with floating toolbars, multi-page support, and text effects","maintainers":[{"name":"munnabhakta","email":"munna.bhakta1001@gmail.com"}],"readme":"# @apexpath/canvas-editor\r\n\r\nReact + Konva canvas editor component library with multi-page workflows, floating toolbars, text effects, role-based access, and optional Unsplash search.\r\n\r\nVersion: 1.0.1  \r\nLicense: MIT\r\n\r\n## What's New\r\n\r\n- Package identity updated to `@apexpath/canvas-editor`.\r\n- Public `CanvasEditorApp` props include branding support (`companyName`, `companyLogo`) and navigation callback (`onBack`).\r\n- `designStateId` persistence is now deterministic:\r\n  - If `initialState` is provided, it is loaded and written to local storage for that design key.\r\n  - If `initialState` is not provided, editor attempts to restore from local storage.\r\n- `triggerSave()` returns export-safe state and clears local storage cache for that design key.\r\n- Style entry is exported as `@apexpath/canvas-editor/styles`.\r\n\r\n## Features\r\n\r\n- Text, shape, and image tools\r\n- Text effects (`original`, `shadow`, `highlight`, `glitch`, `echo`)\r\n- Multi-page editing (`sides` and `pages` modes)\r\n- Multiple printable areas per page\r\n- Object layering and visibility controls\r\n- Role-based access (`admin` and `custom`)\r\n- Floating object toolbars\r\n- Optional Unsplash image search\r\n- Dynamic Google Font loading\r\n\r\n## Installation\r\n\r\n```bash\r\nnpm install @apexpath/canvas-editor\r\n```\r\n\r\nPeer dependencies:\r\n\r\n- `react` `^18 || ^19`\r\n- `react-dom` `^18 || ^19`\r\n\r\n## Required CSS\r\n\r\nImport styles once in your app entry:\r\n\r\n```tsx\r\nimport '@apexpath/canvas-editor/styles';\r\n```\r\n\r\n## Quick Start\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport { CanvasEditorApp } from '@apexpath/canvas-editor';\r\nimport '@apexpath/canvas-editor/styles';\r\n\r\nexport default function MyDesignScreen() {\r\n  return (\r\n    <CanvasEditorApp\r\n      designStateId=\"design-001\"\r\n      userRole=\"admin\"\r\n      companyName=\"ApexPath\"\r\n      unsplashApiKey={import.meta.env.VITE_UNSPLASH_ACCESS_KEY}\r\n      onChange={(state) => {\r\n        console.log('Changed:', state);\r\n      }}\r\n      onSave={(state) => {\r\n        // Persist to your backend\r\n        console.log('Save payload:', state);\r\n      }}\r\n    />\r\n  );\r\n}\r\n```\r\n\r\n## CanvasEditorApp Props\r\n\r\n| Prop | Type | Description |\r\n| --- | --- | --- |\r\n| `designStateId` | `string` | Optional key used for localStorage persistence (`canvas-editor:design:<id>`). |\r\n| `userRole` | `'admin' \\| 'custom'` | Actual signed-in role for capability control. Defaults to `admin`. |\r\n| `unsplashApiKey` | `string` | Enables Unsplash search in graphics/background panels. |\r\n| `companyName` | `string` | Branding title shown in top bar. Defaults to `CanvasPro`. |\r\n| `companyLogo` | `string` | Optional logo URL for top bar branding. |\r\n| `materialColors` | `MaterialColorOption[]` | Optional palette/material options consumed by left panel. |\r\n| `initialState` | `Partial<CanvasState> \\| CanvasState` | Seed state. Missing fields are normalized with defaults. |\r\n| `onSave` | `(state: CanvasState) => void` | Called when internal save is triggered. Receives export-safe state. |\r\n| `onChange` | `(state: CanvasState) => void` | Called on every editor state change. |\r\n| `onBack` | `() => void` | Optional callback for top bar back action. |\r\n\r\n## Custom Layout\r\n\r\nFor full layout control, compose the provider and parts:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  CanvasEditorProvider,\r\n  CanvasSurface,\r\n  LeftPanel,\r\n  RightPanel,\r\n} from '@apexpath/canvas-editor';\r\nimport '@apexpath/canvas-editor/styles';\r\n\r\nexport default function CustomEditor() {\r\n  return (\r\n    <CanvasEditorProvider userRole=\"admin\">\r\n      <div style={{ display: 'flex', height: '100vh', width: '100vw' }}>\r\n        <LeftPanel />\r\n        <CanvasSurface />\r\n        <RightPanel />\r\n      </div>\r\n    </CanvasEditorProvider>\r\n  );\r\n}\r\n```\r\n\r\n## useCanvasEditor Hook\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport { useCanvasEditor } from '@apexpath/canvas-editor';\r\n\r\nexport function AddTextButton() {\r\n  const { dispatch, triggerSave } = useCanvasEditor();\r\n\r\n  const addText = () => {\r\n    dispatch({\r\n      type: 'ADD_OBJECT',\r\n      payload: {\r\n        type: 'text',\r\n        name: 'Headline',\r\n        text: 'Hello Canvas',\r\n        x: 100,\r\n        y: 100,\r\n        fontSize: 32,\r\n        fontFamily: 'Poppins',\r\n      },\r\n    });\r\n  };\r\n\r\n  return (\r\n    <div>\r\n      <button onClick={addText}>Add Text</button>\r\n      <button onClick={triggerSave}>Save</button>\r\n    </div>\r\n  );\r\n}\r\n```\r\n\r\n## Action Types (Reducer)\r\n\r\nCommon actions:\r\n\r\n- `SET_USER_ROLE`, `SET_ROLE`\r\n- `SET_TOOL`, `SET_ZOOM`, `SET_PAN`, `SET_CANVAS_SIZE`\r\n- `ADD_OBJECT`, `UPDATE_OBJECT`, `DELETE_OBJECTS`, `DUPLICATE_OBJECTS`\r\n- `MOVE_OBJECT_UP`, `MOVE_OBJECT_DOWN`, `MOVE_OBJECT_TO_FRONT`, `MOVE_OBJECT_TO_BACK`\r\n- `SET_PAGE_MODE`, `ADD_PAGE`, `DELETE_PAGE`, `SET_CURRENT_PAGE`, `SET_SIDE_ENABLED`\r\n- `SET_BACKGROUND_IMAGE`, `SET_BACKGROUND_IMAGES_BY_SIDE`, `SET_BACKGROUND_COLOR`\r\n- `TOGGLE_EDIT_PRINTABLE_AREA`, `ADD_PRINTABLE_AREA`, `DELETE_PRINTABLE_AREA`, `SET_ACTIVE_PRINTABLE_AREA`, `UPDATE_PRINTABLE_AREA`\r\n- `UPDATE_SETTINGS`, `LOAD_STATE`\r\n\r\n## Public Exports\r\n\r\nMain exports from the package root:\r\n\r\n- `CanvasEditorApp`\r\n- `CanvasEditorProvider`, `useCanvasEditor`\r\n- Main components: `CanvasSurface`, `LeftPanel`, `RightPanel`, `SecondaryPanel`, `ProductSidePanel`\r\n- Floating toolbar components: `FloatingObjectToolbar`, `ShapeToolbar`, `TextToolbar`, `IconToolbar`, `ImageToolbar`\r\n- Secondary panels: `BackgroundPanel`, `GraphicsPanel`, `LayersPanel`, `MaterialPanel`, `MorePanel`, `ObjectsPanel`, `TextPanel`, `UploadsPanel`\r\n- Font utilities: `ensureFontLoaded`, `isGoogleFontFamily`, `TEXT_FONT_OPTIONS`, `GOOGLE_FONT_FAMILIES`, `SYSTEM_FONT_FAMILIES`\r\n- Feature utility: `hasFeatureAccess`\r\n- Unsplash utilities: `setUnsplashApiKey`, `hasUnsplashApiKey`\r\n- Iconify re-exports from `@iconify/react`\r\n\r\n## TypeScript Types\r\n\r\nThe package exports:\r\n\r\n- `CanvasEditorAppProps`\r\n- `CanvasState`, `CanvasObject`, `Page`, `PrintableArea`\r\n- `CanvasAction`, `CanvasEditorContextType`\r\n- `Role`, `ToolType`, `PageMode`\r\n- `CanvasSettings`, `UploadedAsset`, `FeatureKey`\r\n\r\n## Build and Publish (Maintainers)\r\n\r\n```bash\r\nnpm run build:lib\r\nnpm run lint\r\nnpm publish --access public\r\n```\r\n\r\n## License\r\n\r\nMIT\r\n","readmeFilename":"README.md"}