{"_id":"@arthur5005/dnd-kit-ember","_rev":"2-46138367c4d6ecd776ea1fec31758c43","name":"@arthur5005/dnd-kit-ember","dist-tags":{"latest":"0.1.2"},"versions":{"0.1.1":{"name":"@arthur5005/dnd-kit-ember","version":"0.1.1","keywords":["ember-addon"],"author":"","license":"MIT","_id":"@arthur5005/dnd-kit-ember@0.1.1","maintainers":[{"name":"arthur.goldsmith","email":"arthur5005@gmail.com"}],"dist":{"shasum":"d0597a7428f43627be940b9e0124514263038c22","tarball":"https://registry.npmjs.org/@arthur5005/dnd-kit-ember/-/dnd-kit-ember-0.1.1.tgz","fileCount":33,"integrity":"sha512-6pRHcfUvjvHc99F8Skppd87LGQtThHG8PeHrS/3djgmtKeK/2Mwom3hhnK9dRsAqp6LrGnzQE8nn8ehzeUyIEQ==","signatures":[{"sig":"MEQCIFteP9azFOSzsuYcsukyL/f6z6hV+ed/cUc3HJpgo7mbAiBZVIFkQuqO44ad6IcPHhN0W1S+pEBRoLatda97rhxQ6g==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":78364},"ember":{"edition":"octane"},"exports":{".":{"types":"./declarations/index.d.ts","default":"./dist/index.js"},"./*":{"types":"./declarations/*.d.ts","default":"./dist/*.js"},"./*.css":"./dist/*.css","./addon-main.js":"./addon-main.cjs"},"gitHead":"0499fd9095ce591badde2d021e565de6b8ab7f53","imports":{"#src/*":"./src/*"},"scripts":{"lint":"concurrently \"pnpm:lint:*(!fix)\" --names \"lint:\" --prefixColors auto","test":"vite build --mode=development --out-dir dist-tests && testem --file testem.cjs ci --port 0","build":"rollup --config","start":"vite dev","format":"prettier . --cache --write","lint:js":"eslint . --cache","prepack":"rollup --config","release":"release-it","lint:fix":"concurrently \"pnpm:lint:*:fix\" --names \"fix:\" --prefixColors auto && pnpm run format","lint:hbs":"ember-template-lint . --no-error-on-unmatched-pattern","lint:types":"ember-tsc --noEmit","lint:format":"prettier . --cache --check","lint:js:fix":"eslint . --fix","lint:hbs:fix":"ember-template-lint . --fix --no-error-on-unmatched-pattern","lint:publish":"pnpm build && publint run --level error"},"_npmUser":{"name":"arthur.goldsmith","email":"arthur5005@gmail.com"},"repository":"","_npmVersion":"11.4.2","description":"Ember addon for drag and drop powered by @dnd-kit/dom","directories":{},"ember-addon":{"main":"addon-main.cjs","type":"addon","version":2},"_nodeVersion":"22.17.0","dependencies":{"@dnd-kit/dom":"^0.2.3","@dnd-kit/state":"^0.2.3","ember-modifier":"^4.2.2","@dnd-kit/helpers":"^0.2.3","@dnd-kit/abstract":"^0.2.3","@dnd-kit/geometry":"^0.2.3","decorator-transforms":"^2.2.2","@embroider/addon-shim":"^1.8.9"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^7.1.9","qunit":"^2.24.1","eslint":"^9.17.0","rollup":"^4.22.5","testem":"^3.15.1","globals":"^16.1.0","publint":"^0.3.16","prettier":"^3.4.2","qunit-dom":"^3.4.0","@eslint/js":"^9.17.0","release-it":"^19.2.4","typescript":"~5.8.3","@babel/core":"^7.25.2","ember-qunit":"^9.0.2","@types/qunit":"^2.19.12","concurrently":"^9.0.1","ember-source":"^6.7.0","@babel/runtime":"^7.25.6","@embroider/core":"^4.1.0","@embroider/vite":"^1.1.5","@glint/template":"^1.6.1","eslint-plugin-n":"^17.15.1","@glint/ember-tsc":"^1.0.3","ember-page-title":"^9.0.3","@embroider/compat":"^4.1.0","@embroider/macros":"^1.18.0","tracked-built-ins":"^4.1.0","typescript-eslint":"^8.19.1","@glimmer/component":"^2.0.0","@ember/app-tsconfig":"^1.0.0","@ember/test-helpers":"^5.2.1","@ember/test-waiters":"^4.1.1","ember-template-lint":"^7.9.0","eslint-plugin-ember":"^12.3.3","@babel/eslint-parser":"^7.25.1","@embroider/addon-dev":"^8.1.0","@rollup/plugin-babel":"^6.0.4","eslint-plugin-import":"^2.31.0","@glint/tsserver-plugin":"^2.0.0","eslint-config-prettier":"^10.1.5","@ember/library-tsconfig":"^1.0.0","ember-strict-application-resolver":"^0.1.0","@babel/plugin-transform-typescript":"^7.25.2","prettier-plugin-ember-template-tag":"^2.0.4","babel-plugin-ember-template-compilation":"^4.0.0"},"_npmOperationalInternal":{"tmp":"tmp/dnd-kit-ember_0.1.1_1769925424808_0.7374899092074385","host":"s3://npm-registry-packages-npm-production"}},"0.1.2":{"name":"@arthur5005/dnd-kit-ember","version":"0.1.2","packageManager":"pnpm@10.11.1","description":"Ember addon for drag and drop powered by @dnd-kit/dom","keywords":["ember-addon"],"repository":"","license":"MIT","publishConfig":{"access":"public"},"author":"","imports":{"#src/*":"./src/*"},"exports":{".":{"types":"./declarations/index.d.ts","default":"./dist/index.js"},"./addon-main.js":"./addon-main.cjs","./*.css":"./dist/*.css","./*":{"types":"./declarations/*.d.ts","default":"./dist/*.js"}},"scripts":{"build":"rollup --config","format":"prettier . --cache --write","lint":"concurrently \"pnpm:lint:*(!fix)\" --names \"lint:\" --prefixColors auto","lint:fix":"concurrently \"pnpm:lint:*:fix\" --names \"fix:\" --prefixColors auto && pnpm run format","lint:format":"prettier . --cache --check","lint:hbs":"ember-template-lint . --no-error-on-unmatched-pattern","lint:hbs:fix":"ember-template-lint . --fix --no-error-on-unmatched-pattern","lint:js":"eslint . --cache","lint:js:fix":"eslint . --fix","lint:publish":"pnpm build && publint run --level error","lint:types":"ember-tsc --noEmit","prepack":"rollup --config","start":"vite dev","test":"vite build --mode=development --out-dir dist-tests && testem --file testem.cjs ci --port 0","release":"release-it"},"dependencies":{"@dnd-kit/abstract":"^0.2.3","@dnd-kit/dom":"^0.2.3","@dnd-kit/geometry":"^0.2.3","@dnd-kit/helpers":"^0.2.3","@dnd-kit/state":"^0.2.3","@embroider/addon-shim":"^1.8.9","decorator-transforms":"^2.2.2","ember-modifier":"^4.2.2"},"devDependencies":{"@babel/core":"^7.25.2","@babel/eslint-parser":"^7.25.1","@babel/plugin-transform-typescript":"^7.25.2","@babel/runtime":"^7.25.6","@ember/app-tsconfig":"^1.0.0","@ember/library-tsconfig":"^1.0.0","@ember/test-helpers":"^5.2.1","@ember/test-waiters":"^4.1.1","@embroider/addon-dev":"^8.1.0","@embroider/compat":"^4.1.0","@embroider/core":"^4.1.0","@embroider/macros":"^1.18.0","@embroider/vite":"^1.1.5","@eslint/js":"^9.17.0","@glimmer/component":"^2.0.0","@glint/ember-tsc":"^1.0.3","@glint/template":"^1.6.1","@glint/tsserver-plugin":"^2.0.0","@rollup/plugin-babel":"^6.0.4","@types/qunit":"^2.19.12","babel-plugin-ember-template-compilation":"^4.0.0","concurrently":"^9.0.1","ember-page-title":"^9.0.3","ember-qunit":"^9.0.2","ember-source":"^6.7.0","ember-strict-application-resolver":"^0.1.0","ember-template-lint":"^7.9.0","eslint":"^9.17.0","eslint-config-prettier":"^10.1.5","eslint-plugin-ember":"^12.3.3","eslint-plugin-import":"^2.31.0","eslint-plugin-n":"^17.15.1","globals":"^16.1.0","prettier":"^3.4.2","prettier-plugin-ember-template-tag":"^2.0.4","publint":"^0.3.16","qunit":"^2.24.1","qunit-dom":"^3.4.0","release-it":"^19.2.4","rollup":"^4.22.5","testem":"^3.15.1","tracked-built-ins":"^4.1.0","typescript":"~5.8.3","typescript-eslint":"^8.19.1","vite":"^7.1.9"},"ember":{"edition":"octane"},"ember-addon":{"version":2,"type":"addon","main":"addon-main.cjs"},"_id":"@arthur5005/dnd-kit-ember@0.1.2","gitHead":"c9d2fa7a9536bcf8badca0beb5c1a277229c5e8d","_nodeVersion":"22.17.0","_npmVersion":"11.4.2","dist":{"integrity":"sha512-+5BP35FmZtraqgUboMOfm6wAuMTcFt0WFHz9syyPP98K0HwiS7Vvw3mNIu4gk3+5dZtyi005QD/xzoILZjN8JQ==","shasum":"4fddecd776517e009be38882b1394d41f577d945","tarball":"https://registry.npmjs.org/@arthur5005/dnd-kit-ember/-/dnd-kit-ember-0.1.2.tgz","fileCount":33,"unpackedSize":79481,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIHqsQYZ3FtwQ0+bZmx9Uxj6DjF510G2N4KI+VaXjjy0sAiAV9LU3O77HWzQPDsSl8Ipx+Ypsk1lnC/eKPiL4Rb/R/g=="}]},"_npmUser":{"name":"arthur.goldsmith","email":"arthur5005@gmail.com"},"directories":{},"maintainers":[{"name":"arthur.goldsmith","email":"arthur5005@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/dnd-kit-ember_0.1.2_1769926804214_0.062386111645042375"},"_hasShrinkwrap":false}},"time":{"created":"2026-02-01T05:57:04.753Z","modified":"2026-02-01T06:20:04.478Z","0.1.1":"2026-02-01T05:57:04.954Z","0.1.2":"2026-02-01T06:20:04.354Z"},"license":"MIT","keywords":["ember-addon"],"description":"Ember addon for drag and drop powered by @dnd-kit/dom","maintainers":[{"name":"arthur.goldsmith","email":"arthur5005@gmail.com"}],"readme":"# dnd-kit-ember\n\nAn Ember addon providing drag and drop functionality powered by [@dnd-kit/dom](https://next.dndkit.com/overview).\n\n**[Live Demo](https://arthur5005.github.io/dnd-kit-ember/)**\n\n> **Early Development Warning**: This is an experimental addon with no tests. It is intended as an exploration for replacing [ember-sortable](https://github.com/adopted-ember-addons/ember-sortable). The API is subject to change. Use at your own risk.\n\n## Installation\n\n```bash\npnpm add @arthur5005/dnd-kit-ember\n```\n\n## Requirements\n\n- **Ember 5.0+**\n- **GJS/GTS only** - This addon only supports strict mode templates (`.gjs`/`.gts` files)\n- **Embroider** - This is a v2 addon and requires an Embroider-compatible build pipeline\n\n## Usage\n\n### Draggable and Droppable\n\n```gts\nimport DragDrop from '@arthur5005/dnd-kit-ember/components/drag-drop';\nimport type { DragDropEvents } from '@arthur5005/dnd-kit-ember';\n\nfunction handleDragEnd(event: Parameters<DragDropEvents['dragend']>[0]) {\n  if (event.canceled) return;\n\n  const sourceId = event.operation.source?.id;\n  const targetId = event.operation.target?.id;\n  // Handle the drop\n}\n\n<template>\n  <DragDrop @onDragEnd={{handleDragEnd}} as |dd|>\n    <div {{dd.draggable id=\"item-1\"}}>\n      Drag me\n    </div>\n\n    <div {{dd.droppable id=\"drop-zone\"}}>\n      Drop here\n    </div>\n  </DragDrop>\n</template>\n```\n\n### Type-Restricted Drop Zones\n\n```gts\n<template>\n  <DragDrop @onDragEnd={{handleDragEnd}} as |dd|>\n    <div {{dd.draggable id=\"circle-1\" type=\"circle\"}}>Circle</div>\n    <div {{dd.draggable id=\"square-1\" type=\"square\"}}>Square</div>\n\n    <div {{dd.droppable id=\"circles-only\" accept=\"circle\"}}>\n      Only accepts circles\n    </div>\n  </DragDrop>\n</template>\n```\n\n### Sortable List\n\nThe `sortable` modifier combines draggable and droppable behavior for reorderable lists.\n\n> **Note**: dnd-kit's sortable is an **optimistic sorter** - items visually reorder as you drag over them. You must handle `@onDragStart`, `@onDragOver`, and `@onDragEnd` to maintain state and support cancellation (e.g., pressing Escape).\n\n```gts\nimport { tracked } from '@glimmer/tracking';\nimport DragDrop from '@arthur5005/dnd-kit-ember/components/drag-drop';\nimport { move } from '@dnd-kit/helpers';\nimport type { DragDropEvents } from '@arthur5005/dnd-kit-ember';\n\nclass State {\n  @tracked items = ['Item 1', 'Item 2', 'Item 3', 'Item 4'];\n  @tracked snapshot: string[] = [];\n}\n\nconst state = new State();\n\nfunction handleDragStart() {\n  // Save snapshot for cancellation\n  state.snapshot = [...state.items];\n}\n\nfunction handleDragOver(event: Parameters<DragDropEvents['dragover']>[0]) {\n  // Optimistically reorder items as we drag\n  state.items = move(state.items, event);\n}\n\nfunction handleDragEnd(event: Parameters<DragDropEvents['dragend']>[0]) {\n  if (event.canceled) {\n    // Restore snapshot if cancelled (e.g., Escape key)\n    state.items = [...state.snapshot];\n  }\n}\n\n<template>\n  <DragDrop\n    @onDragStart={{handleDragStart}}\n    @onDragOver={{handleDragOver}}\n    @onDragEnd={{handleDragEnd}}\n    as |dd|\n  >\n    <ul>\n      {{#each state.items as |item index|}}\n        <li {{dd.sortable id=item index=index}}>\n          {{item}}\n        </li>\n      {{/each}}\n    </ul>\n  </DragDrop>\n</template>\n```\n\n### Sortable with Drag Handles\n\n```gts\n<template>\n  <DragDrop\n    @onDragStart={{handleDragStart}}\n    @onDragOver={{handleDragOver}}\n    @onDragEnd={{handleDragEnd}}\n    as |dd|\n  >\n    <ul>\n      {{#each state.items as |item index|}}\n        <li {{dd.sortable id=item index=index}}>\n          <span {{dd.handle}}>⠿</span>\n          {{item}}\n        </li>\n      {{/each}}\n    </ul>\n  </DragDrop>\n</template>\n```\n\n## API\n\n### DragDrop Component\n\nThe main component that sets up the drag and drop context.\n\n| Argument | Type | Description |\n|----------|------|-------------|\n| `@sensors` | `Sensor[]` | Custom sensors for drag detection |\n| `@plugins` | `Plugin[]` | DnD Kit plugins |\n| `@modifiers` | `Modifier[]` | DnD Kit modifiers |\n| `@onBeforeDragStart` | `function` | Called before drag starts |\n| `@onDragStart` | `function` | Called when drag starts |\n| `@onDragMove` | `function` | Called on drag movement |\n| `@onDragOver` | `function` | Called when dragging over a droppable |\n| `@onDragEnd` | `function` | Called when drag ends |\n| `@onCollision` | `function` | Called on collision detection |\n\n**Yielded modifiers:**\n- `draggable` - Makes an element draggable (required: `id`)\n- `droppable` - Makes an element a drop target (required: `id`)\n- `sortable` - Combines draggable/droppable for sortable lists (required: `id`, `index`)\n- `handle` - Designates a drag handle within a draggable or sortable\n\nEach modifier accepts additional options from dnd-kit. See the [dnd-kit documentation](https://next.dndkit.com/overview) for the full list of available options.\n\n## Learn More\n\nFor detailed documentation on dnd-kit's features, sensors, plugins, and modifiers, see the [dnd-kit documentation](https://next.dndkit.com/overview).\n\n## License\n\nMIT\n","readmeFilename":"README.md"}