{"_id":"@akpandey-dev/mutadom","_rev":"2-8e5411ddc3219a6c5c96a943634002f9","name":"@akpandey-dev/mutadom","dist-tags":{"latest":"0.0.2"},"versions":{"0.0.1":{"name":"@akpandey-dev/mutadom","version":"0.0.1","keywords":["dom","javascript","ui","library","mutation","styling","animation"],"author":{"name":"AK Pandey"},"license":"MIT","_id":"@akpandey-dev/mutadom@0.0.1","maintainers":[{"name":"akpandey-dev","email":"akpandey.npm@outlook.com"}],"homepage":"https://github.com/akpandey-dev/mutadom","bugs":{"url":"https://github.com/akpandey-dev/mutadom/issues"},"dist":{"shasum":"07754728225e016ed2ed9ace9c3c90ead70fc10e","tarball":"https://registry.npmjs.org/@akpandey-dev/mutadom/-/mutadom-0.0.1.tgz","fileCount":4,"integrity":"sha512-5alrs0sWxD0Ov+OfE/BdSViLFC5yvUgKTfzNFfhtWby3C5RkiLRz8OQO1LGxQMxKzqPLVLsp9dJYeabbaEBJcw==","signatures":[{"sig":"MEUCIQCu9KQNk/FtNXsKQom/UqtPS9GqqXYG3Rt5FCWIYKsI6gIgKuiALu0d+/Iarcr9nMRjKt2tMcU4ZqN3c/TWqnTRo5Q=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":7846},"main":"src/index.js","type":"module","exports":{".":"./src/index.js"},"gitHead":"83cc7fc71fedf8488aad65266392df4447bc6fb6","_npmUser":{"name":"akpandey-dev","email":"akpandey.npm@outlook.com"},"repository":{"url":"git+https://github.com/akpandey-dev/mutadom.git","type":"git"},"_npmVersion":"10.9.3","description":"Chainable DOM creation and mutation library","directories":{},"_nodeVersion":"22.20.0","_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/mutadom_0.0.1_1775125159675_0.813377989509412","host":"s3://npm-registry-packages-npm-production"}},"0.0.2":{"name":"@akpandey-dev/mutadom","version":"0.0.2","description":"Chainable DOM creation and mutation library","main":"src/index.js","type":"module","exports":{".":"./src/index.js"},"keywords":["dom","javascript","ui","library","mutation","styling","dom","dom-manipulation","vanilla-js","lightweight","ui-library","no-framework","chainable","animation"],"author":{"name":"AK Pandey"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/akpandey-dev/mutadom.git"},"homepage":"https://github.com/akpandey-dev/mutadom","gitHead":"ba6089d259a3f7b16c523037a08e73d0c4f96187","_id":"@akpandey-dev/mutadom@0.0.2","bugs":{"url":"https://github.com/akpandey-dev/mutadom/issues"},"_nodeVersion":"22.20.0","_npmVersion":"11.12.1","dist":{"integrity":"sha512-ShsIWdUpk40AH5L9MP3OQmNcyT8peU16N3YXmVjkX06K3LohgfNCf+7Ung9xWqxB1PlpQYKWDSHI03cRzXZNrg==","shasum":"2616319a54ae215ad53b265102426f799b68db3f","tarball":"https://registry.npmjs.org/@akpandey-dev/mutadom/-/mutadom-0.0.2.tgz","fileCount":4,"unpackedSize":9455,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIGkFKDU6gB58kwD1LYjER3OyWgM1TJ3STbLuZA21lG2uAiEA4hLBmlGKRR8ocXvNPMlpDr+H2TkgfpwcmKCWH31jmoo="}]},"_npmUser":{"name":"akpandey-dev","email":"akpandey.npm@outlook.com"},"directories":{},"maintainers":[{"name":"akpandey-dev","email":"akpandey.npm@outlook.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/mutadom_0.0.2_1777104595112_0.8737313995353564"},"_hasShrinkwrap":false}},"time":{"created":"2026-04-02T10:19:19.586Z","modified":"2026-04-25T08:09:55.471Z","0.0.1":"2026-04-02T10:19:19.808Z","0.0.2":"2026-04-25T08:09:55.361Z"},"bugs":{"url":"https://github.com/akpandey-dev/mutadom/issues"},"author":{"name":"AK Pandey"},"license":"MIT","homepage":"https://github.com/akpandey-dev/mutadom","keywords":["dom","javascript","ui","library","mutation","styling","dom","dom-manipulation","vanilla-js","lightweight","ui-library","no-framework","chainable","animation"],"repository":{"type":"git","url":"git+https://github.com/akpandey-dev/mutadom.git"},"description":"Chainable DOM creation and mutation library","maintainers":[{"name":"akpandey-dev","email":"akpandey.npm@outlook.com"}],"readme":"# Mutadom\r\n\r\nA lightweight, chainable DOM creation and mutation library.\r\n\r\nNo frameworks. No JSX. Just pure JavaScript with control.\r\n\r\n---\r\n\r\n## Why mutadom?\r\n\r\nCreating and managing DOM elements in vanilla JS gets messy fast.\r\n\r\n**mutadom** gives you:\r\n- Clean element creation\r\n- Chainable API\r\n- Style & attribute control\r\n- Built-in events, transitions, and animations\r\n- Simple, readable code\r\n\r\n---\r\n\r\n## Install\r\n\r\n```bash\r\nnpm install @akpandey-dev/mutadom\r\n```\r\n\r\n## Usage\r\n\r\n1. Using with Node / Bundlers (Recommended)\r\n\r\nWorks with tools like Vite, Webpack, Parcel, etc.\r\n\r\n```javascript\r\nimport { create, appendTag } from '@akpandey-dev/mutadom';\r\n\r\nconst el = create('h1', 'Hello Mutadom!');\r\nappendTag(el, document.body);\r\n```\r\n\r\n2. Using in Browser (via CDN)\r\n\r\n\r\nUse directly in browser without installing:\r\n\r\n```html\r\n<script type=\"module\">\r\nimport { create, appendTag } from 'https://cdn.jsdelivr.net/npm/@akpandey-dev/mutadom/src/index.js';\r\n\r\nconst el = create('h1', 'Hello from CDN 🚀');\r\nappendTag(el, document.body);\r\n</script>\r\n```\r\n\r\n3. Using Locally (without bundler)\r\n\r\nIf installed via npm,\r\nthen in HTML:\r\n\r\n```html\r\n<script type=\"module\">\r\nimport { create, appendTag } from './node_modules/@akpandey-dev/mutadom/src/index.js';\r\n\r\nconst el = create('h1', 'Local usage');\r\nappendTag(el, document.body);\r\n</script>\r\n```\r\n\r\n⚠️ Important\r\n\r\nBrowsers do not support package names like:\r\n\r\nimport { create } from '@akpandey-dev/mutadom'; // won't work directly\r\n\r\nUse a bundler or CDN instead.\r\n\r\n\r\n## Example\r\n\r\n```javascript\r\nconst el = create('button', 'Click Me')\r\n  .modifier('style', {\r\n    backgroundColor: 'red',\r\n    color: 'white'\r\n  })\r\n  .modifier('event', {\r\n    click: () => alert('Hello from mutadom!')\r\n  });\r\n\r\nappendTag(el, document.body);\r\n```\r\n\r\n> For a live example, check `examples/demo.html`. The file will not work locally, either serve it using `npx serve .` on localhost first, or visit GitHub pages of this repository.\r\n\r\n\r\n## Core API\r\n\r\n### `create(tag, content, attrs)`\r\n\r\n***Create an element.***\r\n\r\n```javascript\r\ncreate('div', 'Hello World', { class: 'box' });\r\n```\r\n\r\nSupports:\r\n\r\n- **string content**\r\n- **nested arrays**\r\n- **DOM nodes**\r\n\r\n### `.modifier(type, obj)`\r\n\r\n***Enhance elements with chainable modifiers.***\r\n\r\n```javascript\r\n// Style\r\nel.modifier('style', {\r\n  color: 'red',\r\n  backgroundColor: 'black'\r\n});\r\n// Attributes\r\nel.modifier('attr', {\r\n  id: 'main',\r\n  disabled: true\r\n});\r\n// Events\r\nel.modifier('event', {\r\n  click: () => console.log('clicked')\r\n});\r\n// Animation\r\nel.modifier('animation', {\r\n  name: 'fadeIn',\r\n  duration: 300\r\n});\r\n// Transition\r\nel.modifier('transition', {\r\n  property: 'all',\r\n  values: { transform: 'scale(1.2)' },\r\n  duration: 300\r\n});\r\n```\r\n\r\n### `appendTag(child, parent)`\r\n\r\n***Append element to DOM.***\r\n\r\n```javascript\r\nappendTag(el, document.body);\r\n```\r\n\r\nOr using selector:\r\n\r\n```javascript\r\nappendTag(el, '#app');\r\n```\r\n\r\n## Example (Real Usage)\r\n\r\n```javascript\r\nconst card = create('div', [\r\n  ['h2', 'mutadom'],\r\n  ['p', 'Build UI without frameworks']\r\n])\r\n.modifier('style', {\r\n  padding: '20px',\r\n  backgroundColor: '#111',\r\n  color: '#fff'\r\n});\r\n\r\nappendTag(card, document.body);\r\n```\r\n## Philosophy\r\n\r\nmutadom is built for:\r\n\r\n- developers who like control\r\n- beginners who want simplicity\r\n- people tired of heavy frameworks\r\n\r\n## ⚠️ Notes\r\n\r\n- Designed for browser environments\r\n- No dependencies\r\n- Lightweight and fast\r\n\r\n## Future Plans\r\n\r\n- Module support (ESM)\r\n- Better composition patterns\r\n- Utility helpers\r\n\r\n## License\r\n\r\n> **MIT**","readmeFilename":"README.md"}