{"_id":"njx-ui","_rev":"13-b2176a0cdfd5555212f59d1ecce0e9ef","name":"njx-ui","dist-tags":{"latest":"1.2.0"},"versions":{"1.0.0":{"name":"njx-ui","version":"1.0.0","keywords":["css","ui-library","css-framework","dark-theme","themes","css-variables","zero-dependencies","tailwind-alternative","bulma-compatible","frontend","web","components","design-system"],"author":{"name":"njbSaab"},"license":"MIT","_id":"njx-ui@1.0.0","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"homepage":"https://njbSaab.github.io/njx-ui-libe","bugs":{"url":"https://github.com/njbSaab/njx-ui-libe/issues"},"dist":{"shasum":"1b41dcb7fb4e9ea80b2692d4d73ad13447505e94","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.0.0.tgz","fileCount":33,"integrity":"sha512-+nxXSLahtbue3+6l8iqFzdP7rUYIu1DEfdmp6ZbS9kYYG8a+v+/NDqvgkekwckMiGD6EFg2OTZviIZxj/iWB5g==","signatures":[{"sig":"MEQCIFwi7IL9IFWYSHDlAGvD0h007It2bb688fuHoR/pMpZSAiAJvfmonUs9r4+RdbF3drZgMj+NP6622T/aQsdmNCjkCQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":648306},"main":"css/style.css","style":"css/style.css","gitHead":"60989cc6da6454636aaf2a5e1cc18b663d0f268d","scripts":{"build":"npm run minify && npm run header","header":"node -e \"const fs=require('fs');const f='css/style.min.css';const h='/* njX UI v'+require('./package.json').version+' | MIT License | github.com/njbSaab/njx-ui-libe */\\n';fs.writeFileSync(f,h+fs.readFileSync(f,'utf8'));\"","minify":"lightningcss --minify --bundle css/style.css -o css/style.min.css"},"_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"repository":{"url":"git+https://github.com/njbSaab/njx-ui-libe.git","type":"git"},"_npmVersion":"10.9.4","description":"Lightweight CSS component library — 25+ components, 9 themes, zero dependencies. ~40KB.","directories":{},"_nodeVersion":"22.22.0","_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"tmp":"tmp/njx-ui_1.0.0_1774718052789_0.20546469405978574","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"njx-ui","version":"1.0.1","keywords":["css","ui-library","css-framework","dark-theme","themes","css-variables","zero-dependencies","tailwind-alternative","bulma-compatible","frontend","web","components","design-system"],"author":{"name":"njbSaab"},"license":"MIT","_id":"njx-ui@1.0.1","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"homepage":"https://njbSaab.github.io/njx-css-ui","bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"dist":{"shasum":"86f56a944f83a786d8d618074ce1c317fef293f0","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.0.1.tgz","fileCount":33,"integrity":"sha512-QWrVau3yXbKhIxbxn6L1KFyDx6BG+mDfRdJdwEQ4rB1cVpR3b8mPiNXvrVmFxltodpNLwsUsc6zdFAjhLK3QEA==","signatures":[{"sig":"MEUCIQDmH98KFA7n4PRNNlA8mrkW/f8Ktx3BT15hbQ4n2sX7KQIgQ0VKf7NfKH3hMLP/Vbu+askzyoQFemF832SBVBSnNew=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":648298},"main":"css/style.css","style":"css/style.css","gitHead":"24607f17c7d5d22ab6519bd6cf0d8175b1939746","scripts":{"build":"npm run minify && npm run header","header":"node -e \"const fs=require('fs');const f='css/style.min.css';const h='/* njX UI v'+require('./package.json').version+' | MIT License | github.com/njbSaab/njx-css-ui */\\n';fs.writeFileSync(f,h+fs.readFileSync(f,'utf8'));\"","minify":"lightningcss --minify --bundle css/style.css -o css/style.min.css"},"_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"_npmVersion":"10.9.4","description":"Lightweight CSS component library — 25+ components, 9 themes, zero dependencies. ~40KB.","directories":{},"_nodeVersion":"22.22.0","_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"tmp":"tmp/njx-ui_1.0.1_1774720907372_0.13803060930535893","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"njx-ui","version":"1.0.2","keywords":["css","ui-library","css-framework","dark-theme","themes","css-variables","zero-dependencies","tailwind-alternative","bulma-compatible","frontend","web","components","design-system"],"author":{"name":"njbSaab"},"license":"MIT","_id":"njx-ui@1.0.2","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"homepage":"https://njbSaab.github.io/njx-css-ui","bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"dist":{"shasum":"87da7c6881b327c7ca2af9305d61b6d5d8205777","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.0.2.tgz","fileCount":33,"integrity":"sha512-oYDktXqUEUx61+TrgBLGZuh0jBXLWUjMJa2bSkQVJ7aAk8MxP4/6iCCqlg7w/7yZ1UF3bJmn/qKw5VSHLKYUbA==","signatures":[{"sig":"MEQCIGE8dWJvjoQiEQaMqBJkTREEy5UjG/hBDufFcRTHMGilAiA08cxbmJ7SAWmvN+ArgBBn1ghZQe2En3bCcsw6YyLGtw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":650137},"main":"css/style.css","style":"css/style.css","gitHead":"02d89710a9fe45db2fee82a4384ffb25fe28ad3d","scripts":{"build":"npm run minify && npm run header","header":"node -e \"const fs=require('fs');const f='css/style.min.css';const h='/* njX UI v'+require('./package.json').version+' | MIT License | github.com/njbSaab/njx-css-ui */\\n';fs.writeFileSync(f,h+fs.readFileSync(f,'utf8'));\"","minify":"lightningcss --minify --bundle css/style.css -o css/style.min.css"},"_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"_npmVersion":"10.9.4","description":"Lightweight CSS component library — 25+ components, 9 themes, zero dependencies. ~40KB.","directories":{},"_nodeVersion":"22.22.0","_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"tmp":"tmp/njx-ui_1.0.2_1774722161233_0.8163013978425182","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"njx-ui","version":"1.0.3","keywords":["css","ui-library","css-framework","dark-theme","themes","css-variables","zero-dependencies","tailwind-alternative","bulma-compatible","frontend","web","components","design-system"],"author":{"name":"njbSaab"},"license":"MIT","_id":"njx-ui@1.0.3","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"homepage":"https://njbSaab.github.io/njx-css-ui","bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"dist":{"shasum":"e2525baabd2f560c0c93b9d5809ce34a41fa0f32","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.0.3.tgz","fileCount":34,"integrity":"sha512-MFbh3gZSzDMAcQVI8lT2ZxOAB8OGHClJXFQq3JRr5JWADAKuu7qfvc0KdU35A+Ff2dsojt1WRJnyie/az6gQOw==","signatures":[{"sig":"MEQCIHyHxGEDIKTalhRNgwE2iD4prt3GXWXmuSbUQGv4cKmOAiBflCfJbBY9q4DOtSA9WWx7HJT2pI18tKg3r6TZuuNQ9w==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":651010},"main":"css/style.css","style":"css/style.css","gitHead":"535340806548162b80d126c9e23b0217ac049c24","scripts":{"build":"npm run minify && npm run header","header":"node -e \"const fs=require('fs');const f='css/style.min.css';const h='/* njX UI v'+require('./package.json').version+' | MIT License | github.com/njbSaab/njx-css-ui */\\n';fs.writeFileSync(f,h+fs.readFileSync(f,'utf8'));\"","minify":"lightningcss --minify --bundle css/style.css -o css/style.min.css"},"_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"_npmVersion":"10.9.4","description":"Lightweight CSS component library — 25+ components, 9 themes, zero dependencies. ~40KB.","directories":{},"_nodeVersion":"22.22.0","_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"tmp":"tmp/njx-ui_1.0.3_1774798825343_0.5235500658687025","host":"s3://npm-registry-packages-npm-production"}},"1.0.4":{"name":"njx-ui","version":"1.0.4","keywords":["css","ui-library","css-framework","dark-theme","themes","css-variables","zero-dependencies","tailwind-alternative","bulma-compatible","frontend","web","components","design-system"],"author":{"name":"njbSaab"},"license":"MIT","_id":"njx-ui@1.0.4","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"homepage":"https://njbSaab.github.io/njx-css-ui","bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"dist":{"shasum":"2606d96ff94e5d0cdafe1fe90278a0b4ed0920ae","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.0.4.tgz","fileCount":36,"integrity":"sha512-XkRA2SngZTBjQ3kEw8HNSr9T1QvEmLYeyvQza4Kk33rtnqEzhSg6Qbc+Fwmn5n0bs+NPd+HAG577pWnP+fVsWg==","signatures":[{"sig":"MEYCIQDY/nvQYYhzdbry2Ov7eBSXgDSxHzaZZtrX8qgezxy0hQIhAJMYJeo0HaP0jhea+in0A8701ADLvJKzFTa8lqPERdLp","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":668844},"main":"css/style.css","style":"css/style.css","gitHead":"bfdc18c0a0046b627a60dbca9132120e8928709e","scripts":{"build":"npm run minify && npm run header","header":"node -e \"const fs=require('fs');const f='css/style.min.css';const h='/* njX UI v'+require('./package.json').version+' | MIT License | github.com/njbSaab/njx-css-ui */\\n';fs.writeFileSync(f,h+fs.readFileSync(f,'utf8'));\"","minify":"lightningcss --minify --bundle css/style.css -o css/style.min.css"},"_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"_npmVersion":"10.9.4","description":"Lightweight CSS component library — 25+ components, 9 themes, zero dependencies. ~40KB.","directories":{},"_nodeVersion":"22.22.0","_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"tmp":"tmp/njx-ui_1.0.4_1774894585725_0.7128450631731702","host":"s3://npm-registry-packages-npm-production"}},"1.0.5":{"name":"njx-ui","version":"1.0.5","keywords":["css","ui-library","css-framework","dark-theme","themes","css-variables","zero-dependencies","tailwind-alternative","bulma-compatible","frontend","web","components","design-system"],"author":{"name":"njbSaab"},"license":"MIT","_id":"njx-ui@1.0.5","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"homepage":"https://njbSaab.github.io/njx-css-ui","bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"dist":{"shasum":"a32b308ef042efbd87d40bea24142847c42d6673","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.0.5.tgz","fileCount":36,"integrity":"sha512-0BUNXC70ja+X2Hk9i3AVDpPzyqMVCyW7x4kRakzkG7/a03TSs0UcwPcWGiHc2Dosj9uJ+Ke8y/F4bRdWc6zExg==","signatures":[{"sig":"MEUCIQCFMnfIB9EsemJbw6dwFfVmYj20E5euxhb+T+p6FZX+PwIgPoYBAbx5R3X8izsF4PItOpeuwfu8mv+n2bJXizmR0Ig=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":659176},"main":"css/style.css","style":"css/style.css","gitHead":"0be2e767e99da40e8699fcf959c072dcf7e39f2c","scripts":{"build":"npm run minify && npm run header && npm run sync-version","header":"node -e \"const fs=require('fs');const f='css/style.min.css';const h='/* njX UI v'+require('./package.json').version+' | MIT License | github.com/njbSaab/njx-css-ui */\\n';fs.writeFileSync(f,h+fs.readFileSync(f,'utf8'));\"","minify":"lightningcss --minify --bundle css/style.css -o css/style.min.css","sync-version":"node scripts/sync-version.js"},"_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"_npmVersion":"10.9.4","description":"Lightweight CSS component library — 25+ components, 9 themes, zero dependencies. ~40KB.","directories":{},"_nodeVersion":"22.22.0","_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"tmp":"tmp/njx-ui_1.0.5_1774980264407_0.6956225050887228","host":"s3://npm-registry-packages-npm-production"}},"1.1.0":{"name":"njx-ui","version":"1.1.0","keywords":["css","ui-library","css-framework","dark-theme","themes","css-variables","zero-dependencies","tailwind-alternative","bulma-compatible","frontend","web","components","design-system"],"author":{"name":"njbSaab"},"license":"MIT","_id":"njx-ui@1.1.0","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"homepage":"https://njbSaab.github.io/njx-css-ui","bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"dist":{"shasum":"60b898ff2bd20aef18cf35b51416d36bf788c176","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.1.0.tgz","fileCount":41,"integrity":"sha512-PhbOKyKK1Ye8Gfpho8mN83K+7p1PHs+OYEicFjzEx5dTfoPQ0rgdyZBVAEOzPGjcq6vm3XrQVFoYvXQC3T2owA==","signatures":[{"sig":"MEUCIAeRBuT7QjvVIPYoj/ukn2Unrb35aax8fESRfFRQjk5GAiEApFKl7TBnHyk4kFGlXFsiO0idA+kIRUa844ML+pUF2UE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":861770},"main":"css/style.css","type":"module","style":"css/style.min.css","engines":{"node":">=22.12.0"},"gitHead":"31024c0a5cec4b0f0d301a883ea5bbf8aac92a5a","scripts":{"dev":"npm run prebuild && astro dev","astro":"astro","build":"astro build","preview":"astro preview","prebuild":"npm run css:build && mkdir -p ./public/scripts ./public/styles && cp ./src/scripts/lib-docs.js ./public/scripts/lib-docs.js && cp ./src/styles/lib-docs.css ./public/styles/lib-docs.css && node -e \"const fs=require('fs');const css=fs.readFileSync('./public/css/classless.css','utf8');fs.writeFileSync('./public/css/classless-scoped.css','@scope (.cl-scope){\\n'+css+'\\n}');\"","css:build":"npm run css:minify && npm run css:classless && npm run css:header","sync:meta":"node ./src/scripts/sync-library-meta.mjs","css:header":"node -e \"const fs=require('fs');const m=fs.readFileSync('./src/lib/meta.ts','utf8').match(/LIB_VERSION\\s*=\\s*'([^']+)'/);const v=m?m[1]:'1.0.5';const f='public/css/style.min.css';const h='/* njX UI v'+v+' | MIT License | github.com/njbSaab/njx-css-ui */\\n';fs.writeFileSync(f,h+fs.readFileSync(f,'utf8'));\"","css:minify":"node scripts/build-style.cjs","css:classless":"node scripts/build-classless.cjs"},"_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"_npmVersion":"10.9.4","description":"Lightweight CSS component library — 30+ components, 9 themes, zero dependencies. ~59KB.","directories":{},"_nodeVersion":"22.22.0","dependencies":{"astro":"^6.1.7"},"_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"tmp":"tmp/njx-ui_1.1.0_1777321783729_0.9605368351436965","host":"s3://npm-registry-packages-npm-production"}},"1.1.1":{"name":"njx-ui","version":"1.1.1","keywords":["css","ui-library","css-framework","dark-theme","themes","css-variables","zero-dependencies","tailwind-alternative","bulma-compatible","frontend","web","components","design-system"],"author":{"name":"njbSaab"},"license":"MIT","_id":"njx-ui@1.1.1","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"homepage":"https://njxui.dev","bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"dist":{"shasum":"eee6c9fdd329d4762cbc92cf9ec2f9deae9adbd9","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.1.1.tgz","fileCount":41,"integrity":"sha512-XAjYarPAs5ElMnZcST7qoqT2vGd4ueXI1/UOgcMgxsgl7fMVDJIOSrWzgwVS7/Q1hZ1GFj4Bx/WNHKX6cvq42Q==","signatures":[{"sig":"MEUCIQCR4Q7pXnIkcvyCKUPNNeJknuZyB26ir+zC5riWvrXTJAIgPe9MmTtsQUmbAofQiOActWqiheSLZcSBhIy7ur1IyEQ=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":861749},"main":"css/style.css","type":"module","style":"css/style.min.css","engines":{"node":">=22.12.0"},"gitHead":"6b84bb7deaab1f8938684a72b451b2f992025819","scripts":{"dev":"npm run prebuild && astro dev","astro":"astro","build":"astro build","preview":"astro preview","prebuild":"npm run css:build && mkdir -p ./public/scripts ./public/styles && cp ./src/scripts/lib-docs.js ./public/scripts/lib-docs.js && cp ./src/styles/lib-docs.css ./public/styles/lib-docs.css && node -e \"const fs=require('fs');const css=fs.readFileSync('./public/css/classless.css','utf8');fs.writeFileSync('./public/css/classless-scoped.css','@scope (.cl-scope){\\n'+css+'\\n}');\"","css:build":"npm run css:minify && npm run css:classless && npm run css:header","sync:meta":"node ./src/scripts/sync-library-meta.mjs","css:header":"node -e \"const fs=require('fs');const m=fs.readFileSync('./src/lib/meta.ts','utf8').match(/LIB_VERSION\\s*=\\s*'([^']+)'/);const v=m?m[1]:'1.0.5';const f='public/css/style.min.css';const h='/* njX UI v'+v+' | MIT License | github.com/njbSaab/njx-css-ui */\\n';fs.writeFileSync(f,h+fs.readFileSync(f,'utf8'));\"","css:minify":"node scripts/build-style.cjs","css:classless":"node scripts/build-classless.cjs"},"_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"_npmVersion":"10.9.4","description":"Lightweight CSS component library — 30+ components, 9 themes, zero dependencies. ~59KB.","directories":{},"_nodeVersion":"22.22.0","dependencies":{"astro":"^6.1.7"},"_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"tmp":"tmp/njx-ui_1.1.1_1777322718804_0.16480786482741583","host":"s3://npm-registry-packages-npm-production"}},"1.1.2":{"name":"njx-ui","version":"1.1.2","keywords":["css","ui-library","css-framework","dark-theme","themes","css-variables","zero-dependencies","tailwind-alternative","bulma-compatible","frontend","web","components","design-system"],"author":{"name":"njbSaab"},"license":"MIT","_id":"njx-ui@1.1.2","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"homepage":"https://njxui.dev","bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"dist":{"shasum":"0485155b6d8ede91197c1cb8df2938c0c8a04c03","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.1.2.tgz","fileCount":41,"integrity":"sha512-ruE1SNv8S7ts0gW12SEVstLfDa130vX/0LkfI0hWr4sZosB8ccz+qAoaCUcyAikb7lzgRI2q+EB3KdwSj8E16w==","signatures":[{"sig":"MEQCIDDzZnqHSNEbFAdfs0NtfQhM5KhwY/AKXOOecqKTbb7HAiB9stI3KDAOxnR5hNq+ESGe+5hXq7tQ3Skx1IX2XHozIg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":875827},"main":"css/style.css","type":"module","style":"css/style.min.css","engines":{"node":">=22.12.0"},"gitHead":"39fb68d902aff6ce4707db1c14b3a5abd84ea134","scripts":{"dev":"npm run prebuild && astro dev","astro":"astro","build":"astro build","preview":"astro preview","prebuild":"npm run css:build && mkdir -p ./public/scripts ./public/styles && cp ./src/scripts/lib-docs.js ./public/scripts/lib-docs.js && cp ./src/styles/lib-docs.css ./public/styles/lib-docs.css && node -e \"const fs=require('fs');const css=fs.readFileSync('./public/css/classless.css','utf8');fs.writeFileSync('./public/css/classless-scoped.css','@scope (.cl-scope){\\n'+css+'\\n}');\"","css:build":"npm run css:minify && npm run css:classless && npm run css:header","sync:meta":"node ./src/scripts/sync-library-meta.mjs","css:header":"node scripts/add-style-header.cjs","css:minify":"node scripts/build-style.cjs","css:classless":"node scripts/build-classless.cjs"},"_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"_npmVersion":"10.9.4","description":"Lightweight CSS component library — 30+ components, 9 themes, zero dependencies. ~59KB.","directories":{},"_nodeVersion":"22.22.0","dependencies":{"astro":"^6.1.7"},"_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"tmp":"tmp/njx-ui_1.1.2_1777459955988_0.8410318292683463","host":"s3://npm-registry-packages-npm-production"}},"1.1.3":{"name":"njx-ui","version":"1.1.3","keywords":["css","ui-library","css-framework","dark-theme","themes","css-variables","zero-dependencies","tailwind-alternative","bulma-compatible","frontend","web","components","design-system"],"author":{"name":"njbSaab"},"license":"MIT","_id":"njx-ui@1.1.3","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"homepage":"https://njxui.dev","bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"dist":{"shasum":"a3b605f152949ee660ad1e113bb9e1650e22bc21","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.1.3.tgz","fileCount":41,"integrity":"sha512-8YtU8Dh1MqjpZUlxO5DpXrHo05NhzEG8hNyCOwb6GFt/2PYa2nPGHf93FwKzvTjzx75CYDouK/q4jeHM6TMAuA==","signatures":[{"sig":"MEUCIQCTJihPlXVzmtcGGEZ8HKt0w+vAgInqGnfaOirUj5GhbgIgbMYknmad7fReV1LdRpSKcvE3sdVcX/WD6aGgX5mMFNc=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":887728},"main":"css/style.css","type":"module","style":"css/style.min.css","engines":{"node":">=22.12.0"},"gitHead":"2b2b605f3e5575370ed351d49f4672c3368b4777","scripts":{"dev":"npm run prebuild && astro dev","astro":"astro","build":"astro build","preview":"astro preview","prebuild":"npm run css:build && mkdir -p ./public/scripts ./public/styles && cp ./src/scripts/lib-docs.js ./public/scripts/lib-docs.js && cp ./src/styles/lib-docs.css ./public/styles/lib-docs.css && node -e \"const fs=require('fs');const css=fs.readFileSync('./public/css/classless.css','utf8');fs.writeFileSync('./public/css/classless-scoped.css','@scope (.cl-scope){\\n'+css+'\\n}');\"","css:build":"npm run css:minify && npm run css:classless && npm run css:header","sync:meta":"node ./src/scripts/sync-library-meta.mjs","css:header":"node scripts/add-style-header.cjs","css:minify":"node scripts/build-style.cjs","css:classless":"node scripts/build-classless.cjs"},"_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"_npmVersion":"10.9.4","description":"Lightweight CSS component library — 30+ components, 9 themes, zero dependencies, classless components ~59KB.","directories":{},"_nodeVersion":"22.22.0","dependencies":{"astro":"^6.1.7"},"_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"tmp":"tmp/njx-ui_1.1.3_1777532933935_0.2736325982864205","host":"s3://npm-registry-packages-npm-production"}},"1.1.4":{"name":"njx-ui","version":"1.1.4","keywords":["css","ui-library","css-framework","dark-theme","themes","css-variables","zero-dependencies","tailwind-alternative","bulma-compatible","frontend","web","components","design-system"],"author":{"name":"njbSaab"},"license":"MIT","_id":"njx-ui@1.1.4","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"homepage":"https://njxui.dev","bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"dist":{"shasum":"3fb26f40235048918aa1fbc7bc3899108e95e855","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.1.4.tgz","fileCount":41,"integrity":"sha512-6ScGRctCaZ7SUfTF456LM01xSDt6hWJ1Ba8mMW4zZxtkVFQreKelmTaI9PhQXw/0dV22mDZWp6wSEdkfAG+pkA==","signatures":[{"sig":"MEQCIER+FR3kPYsX3kegNVxfzwKjNkWH9LsnVXM6OyLA5o5IAiBeW28Ob7LlR6FKnJvX9P5cGPkEmqLXibo76YP1Iowhbg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":900183},"main":"css/style.css","type":"module","style":"css/style.min.css","engines":{"node":">=22.12.0"},"gitHead":"47884c422695a575f1255765e734fdc4edbb78cd","scripts":{"dev":"npm run prebuild && astro dev","astro":"astro","build":"astro build","preview":"astro preview","prebuild":"npm run css:build && mkdir -p ./public/scripts ./public/styles && cp ./src/scripts/lib-docs.js ./public/scripts/lib-docs.js && cp ./src/styles/lib-docs.css ./public/styles/lib-docs.css && node -e \"const fs=require('fs');const css=fs.readFileSync('./public/css/classless.css','utf8');fs.writeFileSync('./public/css/classless-scoped.css','@scope (.cl-scope){\\n'+css+'\\n}');\"","css:build":"npm run css:minify && npm run css:classless && npm run css:header","sync:meta":"node ./src/scripts/sync-library-meta.mjs","css:header":"node scripts/add-style-header.cjs","css:minify":"node scripts/build-style.cjs","css:classless":"node scripts/build-classless.cjs"},"_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"_npmVersion":"10.9.4","description":"Lightweight CSS component library — 30+ components, 9 themes, zero dependencies, classless components ~49KB.","directories":{},"_nodeVersion":"22.22.0","dependencies":{"astro":"^6.1.7"},"_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"tmp":"tmp/njx-ui_1.1.4_1777559508221_0.323685100555158","host":"s3://npm-registry-packages-npm-production"}},"1.1.5":{"name":"njx-ui","version":"1.1.5","keywords":["css","css-framework","ui-library","components","themes","dark-theme","css-variables","design-system","zero-dependencies","no-build","landing-page","astro","alpinejs","classless-css","tailwind-alternative","bulma-compatible","frontend","web"],"author":{"name":"njbSaab"},"license":"MIT","_id":"njx-ui@1.1.5","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"homepage":"https://njxui.dev","bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"dist":{"shasum":"6cf45a5787068a75b241242677ea46c52f1ae75a","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.1.5.tgz","fileCount":43,"integrity":"sha512-RKFDumd5nEvNY/t9dvxjbS/1p3L3bFocuijY259OmO4z4vQSUyrom+lUiR+7IMWHMNdYgS9075V9WO71Y89iqQ==","signatures":[{"sig":"MEQCICxuHSH12ilquXYFgZyuDnW7QF4UpF8QeB7aKJ8lo0UlAiBHNK1b+/etOA6lbIxYKCKffztvDW4PO3jbzZYw54bYEg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":912649},"main":"css/style.css","type":"module","style":"css/style.min.css","engines":{"node":">=22.12.0"},"exports":{".":"./css/style.css","./js/*":"./js/*","./css/*":"./css/*","./package.json":"./package.json"},"gitHead":"7aaed7ee05deb880b12c419f9bcec0552f85760b","scripts":{"dev":"npm run prebuild && astro dev","astro":"astro","build":"astro build","preview":"astro preview","prebuild":"npm run sync:meta && npm run css:build && mkdir -p ./public/scripts ./public/styles && cp ./src/scripts/lib-docs.js ./public/scripts/lib-docs.js && cp ./src/scripts/njx-site.js ./public/scripts/njx-site.js && cp ./src/styles/docs-shell.css ./public/styles/docs-shell.css && cp ./src/styles/docs-sections.css ./public/styles/docs-sections.css && cp ./src/styles/site-shared.css ./public/styles/site-shared.css && node scripts/build-demo-css.cjs && node -e \"const fs=require('fs');const css=fs.readFileSync('./public/css/classless.css','utf8');fs.writeFileSync('./public/css/classless-scoped.css','@scope (.cl-scope){\\n'+css+'\\n}');\"","css:build":"npm run css:minify && npm run css:classless && npm run css:header","sync:meta":"node ./src/scripts/sync-library-meta.mjs","css:header":"node scripts/add-style-header.cjs","css:minify":"node scripts/build-style.cjs","css:classless":"node scripts/build-classless.cjs"},"_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"_npmVersion":"10.9.7","description":"Lightweight CSS component library — 30+ components, 9 themes, zero dependencies, classless components ~49KB.","directories":{},"_nodeVersion":"22.22.2","dependencies":{"astro":"^6.1.7","@astrojs/sitemap":"^3.7.3"},"_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"tmp":"tmp/njx-ui_1.1.5_1788432202855_0.912366360212562","host":"s3://npm-registry-packages-npm-production"}},"1.2.0":{"_id":"njx-ui@1.2.0","bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"dist":{"shasum":"b7508002a0a930ee58291aa998a61d327498a17f","tarball":"https://registry.npmjs.org/njx-ui/-/njx-ui-1.2.0.tgz","fileCount":45,"integrity":"sha512-b5SJ1Xb+xuw63AzKUXDqegrzKgg0ZFo+phYcK//Q7Iger8ms/5NKrLQEKFcHWbTeoPgCKCex/Hnb7u1Exgk2sA==","signatures":[{"sig":"MEQCIH0SUb3JZ7banCFnVcgNn0U4QotM3WBhXsp5Z6hDtu9HAiAvr1X/qBVZVXZpjJbDkvN/v/RD7EzL6bfrdPwETm5kWA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQDUPgGt231QySBYDB6iL1SP/TG196ys1CaCrfFRH/15ywIhALa3xHuyQ3bccrvPQ5Yx6LkVUPSVP4IrY5ROxBHQu1Ye"}],"unpackedSize":929193},"main":"css/style.css","name":"njx-ui","type":"module","style":"css/style.min.css","author":{"name":"njbSaab"},"engines":{"node":">=22.12.0"},"exports":{".":"./css/style.css","./js/*":"./js/*","./css/*":"./css/*","./package.json":"./package.json"},"gitHead":"d0020263363b17b9e92dd8d0abf4acf9920fb781","license":"MIT","scripts":{"dev":"npm run prebuild && astro dev","astro":"astro","build":"astro build","preview":"astro preview","prebuild":"npm run sync:meta && npm run css:build && mkdir -p ./public/scripts ./public/styles && cp ./src/scripts/lib-docs.js ./public/scripts/lib-docs.js && cp ./src/scripts/njx-site.js ./public/scripts/njx-site.js && cp ./src/styles/docs-shell.css ./public/styles/docs-shell.css && cp ./src/styles/docs-sections.css ./public/styles/docs-sections.css && cp ./src/styles/site-shared.css ./public/styles/site-shared.css && node scripts/build-demo-css.cjs && node -e \"const fs=require('fs');const css=fs.readFileSync('./public/css/classless.css','utf8');fs.writeFileSync('./public/css/classless-scoped.css','@scope (.cl-scope){\\n'+css+'\\n}');\"","css:build":"npm run css:minify && npm run css:classless && npm run css:header","sync:meta":"node ./src/scripts/sync-library-meta.mjs","css:header":"node scripts/add-style-header.cjs","css:minify":"node scripts/build-style.cjs","examples:zip":"node scripts/build-starter-zip.cjs","css:classless":"node scripts/build-classless.cjs"},"version":"1.2.0","_npmUser":{"name":"njsaab","email":"sdr.expert@gmail.com"},"homepage":"https://njxui.dev","keywords":["css","css-framework","ui-library","components","themes","dark-theme","css-variables","design-system","zero-dependencies","no-build","landing-page","astro","alpinejs","classless-css","tailwind-alternative","bulma-compatible","frontend","web"],"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"_npmVersion":"10.9.7","description":"Lightweight CSS component library — 30+ components, 9 themes, zero dependencies, classless components ~49KB.","directories":{},"maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"_nodeVersion":"22.22.2","dependencies":{"astro":"^6.1.7","@astrojs/sitemap":"^3.7.3"},"_hasShrinkwrap":false,"devDependencies":{"lightningcss-cli":"^1.32.0"},"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/njx-ui_1.2.0_1788512392017_0.7387124600386759"}}},"time":{"created":"2026-03-28T17:14:12.688Z","modified":"2026-09-04T08:59:52.263Z","1.0.0":"2026-03-28T17:14:12.941Z","1.0.1":"2026-03-28T18:01:47.547Z","1.0.2":"2026-03-28T18:22:41.378Z","1.0.3":"2026-03-29T15:40:25.499Z","1.0.4":"2026-03-30T18:16:25.887Z","1.0.5":"2026-03-31T18:04:24.580Z","1.1.0":"2026-04-27T20:29:43.934Z","1.1.1":"2026-04-27T20:45:18.982Z","1.1.2":"2026-04-29T10:52:36.208Z","1.1.3":"2026-04-30T07:08:54.073Z","1.1.4":"2026-04-30T14:31:48.451Z","1.1.5":"2026-09-03T10:43:22.999Z","1.2.0":"2026-09-04T08:59:52.118Z"},"bugs":{"url":"https://github.com/njbSaab/njx-css-ui/issues"},"author":{"name":"njbSaab"},"license":"MIT","homepage":"https://njxui.dev","keywords":["css","css-framework","ui-library","components","themes","dark-theme","css-variables","design-system","zero-dependencies","no-build","landing-page","astro","alpinejs","classless-css","tailwind-alternative","bulma-compatible","frontend","web"],"repository":{"url":"git+https://github.com/njbSaab/njx-css-ui.git","type":"git"},"description":"Lightweight CSS component library — 30+ components, 9 themes, zero dependencies, classless components ~49KB.","maintainers":[{"name":"njsaab","email":"sdr.expert@gmail.com"}],"readme":"# njX UI\n\n**njX UI** (npm: [`njx-ui`](https://www.npmjs.com/package/njx-ui)) is a zero-dependency CSS component library for landing pages, docs and prototypes: **9 themes, 30+ components, Tailwind-style utilities** — 308 KB minified, **44 KB gzip over the wire**, no build step. Plays great with [Astro](#use-with-astro-) and [Alpine.js](#alpinejs--the-ui-kit-alpine-was-missing-).\n\nOne link — everything works:\n\n```html\n<link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/njx-ui@1/css/style.min.css\">\n<!-- optional interactivity helpers (modals, toasts, sidebar…) -->\n<script src=\"https://cdn.jsdelivr.net/npm/njx-ui@1/js/njx.js\"></script>\n```\n\nDocs & live demo: **[njxui.dev](https://njxui.dev)**\n\n<div align=\"center\">\n\n![njX UI — library overview](img/gif/overview-1.gif)\n\n[![npm](https://img.shields.io/npm/v/njx-ui?color=cb3837&logo=npm)](https://www.npmjs.com/package/njx-ui)\n[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](LICENSE)\n[![CSS](https://img.shields.io/badge/CSS-Pure-1572B6?logo=css3&logoColor=white)](css/style.css)\n[![JS](https://img.shields.io/badge/JS-Vanilla-F7DF1E?logo=javascript&logoColor=black)](js/njx.js)\n[![Themes](https://img.shields.io/badge/themes-9-blueviolet)](#1-9-themes--one-attribute)\n[![Components](https://img.shields.io/badge/components-30+-orange)](#components)\n\n[How to use from GitHub](GITHUB.md) · [Contributing](CONTRIBUTING.md) · [Documentation](css/CSS-DOCS.en.md)\n\n</div>\n\n---\n\n## Quick Start\n\nChoose the method that fits your project:\n\n---\n\n### Option 1 — CDN (jsDelivr via npm)\n\nNo install. Just add to your HTML:\n\n```html\n<!DOCTYPE html>\n<html data-theme=\"dark\">\n<head>\n  <!-- Major version — always current v1.x (recommended) -->\n  <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/njx-ui@1/css/style.min.css\">\n  <script src=\"https://cdn.jsdelivr.net/npm/njx-ui@1/js/njx.js\"></script>\n\n  <!-- Or pinned to an exact version — never changes -->\n  <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/njx-ui@1.2.0/css/style.min.css\">\n</head>\n<body>\n  <button class=\"btn btn-primary\">Primary</button>\n  <div class=\"card mt-4\">Card</div>\n</body>\n</html>\n```\n\n> jsDelivr may cache for 5–10 minutes after a new publish. If it doesn't load yet — wait a moment.\n\n---\n\n### Option 2 — CDN (jsDelivr via GitHub)\n\nWorks immediately after `git push`, without publishing to npm:\n\n```html\n<!-- Always latest from main branch -->\n<link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/gh/njbSaab/njx-ui@main/css/style.min.css\">\n<script src=\"https://cdn.jsdelivr.net/gh/njbSaab/njx-ui@main/js/njx.js\"></script>\n\n<!-- Pinned to a specific tag -->\n<link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/gh/njbSaab/njx-ui@v1.2.0/css/style.min.css\">\n```\n\n---\n\n### Option 3 — unpkg\n\n```html\n<link rel=\"stylesheet\" href=\"https://unpkg.com/njx-ui/css/style.min.css\">\n<script src=\"https://unpkg.com/njx-ui/js/njx.js\"></script>\n```\n\n---\n\n### Option 4 — npm install\n\n```bash\nnpm install njx-ui\n```\n\nThen in your HTML:\n\n```html\n<link rel=\"stylesheet\" href=\"node_modules/njx-ui/css/style.min.css\">\n```\n\nOr in a bundler / Astro / Vite project:\n\n```js\nimport 'njx-ui/css/style.min.css';\n```\n\nVerify installed files:\n\n```bash\nls node_modules/njx-ui/css/\n# → style.css  style.min.css  _base.css  _buttons.css  ...\n```\n\n---\n\n### Option 5 — Download\n\nDownload `css/style.min.css` and `js/njx.js` from the [releases](https://github.com/njbSaab/njx-css-ui/releases) and link locally:\n\n```html\n<link rel=\"stylesheet\" href=\"css/style.min.css\">\n<script src=\"js/njx.js\"></script>\n```\n\n---\n\n### Verify CDN in browser\n\nOpen this URL to see all files available in the package:\n\n```\nhttps://cdn.jsdelivr.net/npm/njx-ui/\n```\n\n---\n\n## Use with Astro 🚀\n\nnjX UI is zero-JS by default — a natural fit for Astro. The whole setup is one install and one import (no integration to register). The njX UI docs site itself is built with Astro.\n\n```bash\nnpm install njx-ui   # pnpm add / yarn add / bun add\n```\n\n```astro\n---\n// src/layouts/Layout.astro\nimport 'njx-ui/css/style.min.css';\n---\n<html lang=\"en\" data-theme=\"dark\">\n  <body><slot /></body>\n</html>\n```\n\nComponent classes now work in every `.astro` file, Markdown page and framework island:\n\n```astro\n<button class=\"btn btn-primary\">Hello njX</button>\n<div class=\"card-glow\">\n  <h2 class=\"text-gradient-primary\">Works.</h2>\n</div>\n```\n\n**Theme without flash (FOUC):** restore the saved theme before first paint with an inline script in `<head>`:\n\n```html\n<script is:inline>\n  const t = localStorage.getItem('theme');\n  if (t) document.documentElement.dataset.theme = t;\n</script>\n```\n\n**Using `<ClientRouter />` (view transitions)?** njx.js initializes on `DOMContentLoaded`, so re-init carousels after navigation — or use Alpine.js, whose state lives in the markup and survives swaps:\n\n```html\n<script src=\"https://cdn.jsdelivr.net/npm/njx-ui@1/js/njx.js\"></script>\n<script>document.addEventListener('astro:page-load', () => initCarousels());</script>\n```\n\n---\n\n## Alpine.js — the UI kit Alpine was missing 🏔\n\nEvery interactive njX component works by toggling a single state class (`.is-open`, `.is-active`, `.open`). njx.js is one way to toggle it — **Alpine.js is another**: keep the same markup and drive the class from `x-data`. No njX JavaScript required.\n\n```html\n<link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/njx-ui@1/css/style.min.css\">\n<script defer src=\"https://cdn.jsdelivr.net/npm/alpinejs@3/dist/cdn.min.js\"></script>\n```\n\n```html\n<!-- Accordion: same .is-open class njx.js would toggle -->\n<div class=\"collapse\" x-data=\"{ open: false }\" :class=\"{ 'is-open': open }\">\n  <div class=\"collapse-header\" @click=\"open = !open\">\n    Title <span class=\"collapse-icon\"></span>\n  </div>\n  <div class=\"collapse-body\">Content</div>\n</div>\n\n<!-- Dropdown with outside-click close -->\n<div class=\"dropdown\" x-data=\"{ open: false }\"\n     :class=\"{ 'is-open': open }\" @click.outside=\"open = false\">\n  <button class=\"btn btn-ghost btn-sm\" @click=\"open = !open\">Menu</button>\n  <div class=\"dropdown-menu\">\n    <a href=\"#\" class=\"dropdown-item\" @click=\"open = false\">Item</a>\n  </div>\n</div>\n```\n\nReady-made recipes for tabs, modal (Escape + backdrop close), toast stack and a dark/light theme toggle: **[njxui.dev/documentation#alpine](https://njxui.dev/documentation#alpine)** — plus live demos with an Alpine.js tab in the code windows on the components page.\n\n---\n\n## Classless — now a separate project\n\nThe classless stylesheet (`classless.min.css`, ~7 KB gzip — styles plain semantic HTML with zero class names) has grown into its own product: **[classless.njxui.dev](https://classless.njxui.dev)**. The file still ships in this package for compatibility:\n\n```html\n<link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/njx-ui@1/css/classless.min.css\">\n```\n\nReference → [classless.md](classless.md)\n\n---\n\n## Why njX?\n\n### 1. 9 themes — one attribute\n\nNo extra CSS. No JS setup. Just set `data-theme` on `<html>` and every component updates instantly.\n\n```html\n<html data-theme=\"dark\">    <!-- default -->\n<html data-theme=\"light\">\n<html data-theme=\"red\">\n<html data-theme=\"blue\">\n<html data-theme=\"green\">\n<html data-theme=\"cyan\">\n<html data-theme=\"yellow\">\n<html data-theme=\"pink\">\n<html data-theme=\"purple\">\n```\n\nSwitch at runtime:\n```js\ndocument.documentElement.setAttribute('data-theme', 'purple')\n```\n\n---\n\n### 2. Tailwind-style utility classes — no Tailwind required\n\nSpacing, flexbox, typography, display, positioning — all available as single-purpose classes. No build step, no config, no `node_modules`.\n\n<div align=\"center\">\n\n![njX UI — utility classes](img/gif/utils.gif)\n\n</div>\n\n```html\n<!-- Layout -->\n<div class=\"flex items-center justify-between gap-4\">...</div>\n<div class=\"flex-col-center mt-8 mb-4\">...</div>\n<div class=\"w-full max-w-lg mx-auto\">...</div>\n\n<!-- Typography -->\n<p class=\"text-sm text-muted font-bold\">...</p>\n<h1 class=\"text-gradient-primary\">Gradient heading</h1>\n\n<!-- Spacing -->\n<div class=\"mt-4 mb-2 px-6 py-3\">...</div>\n\n<!-- Display -->\n<div class=\"d-none\">Hidden</div>\n<div class=\"d-flex items-center gap-2\">...</div>\n```\n\n**Responsive prefixes** — `sm:`, `md:`, `lg:`, `xl:` work out of the box:\n\n```html\n<div class=\"flex md:block lg:hidden\">...</div>\n<p class=\"text-base lg:text-xl\">...</p>\n```\n\nBreakpoints: `sm` (≤ 640px) · `md` (≤ 768px) · `lg` (≤ 1024px) · `xl` (≤ 1280px)\n\n#### Full utility reference\n\n**Display**\n\n| Class | CSS |\n|---|---|\n| `d-block` | `display: block` |\n| `d-inline` | `display: inline` |\n| `d-inline-block` | `display: inline-block` |\n| `d-flex` / `flex` | `display: flex` |\n| `d-grid` | `display: grid` |\n| `d-none` / `hidden` | `display: none` |\n| `visible` / `invisible` | `visibility: visible/hidden` |\n\n**Flexbox**\n\n| Class | CSS |\n|---|---|\n| `flex-row` / `flex-col` | `flex-direction` |\n| `flex-wrap` / `flex-nowrap` | `flex-wrap` |\n| `flex-grow` / `flex-shrink` / `flex-none` | flex sizing |\n| `items-start/center/end/stretch/baseline` | `align-items` |\n| `justify-start/center/end/between/around/evenly` | `justify-content` |\n| `flex-center` | `display:flex` + center both axes |\n| `flex-center-between` | `display:flex` + center + space-between |\n| `flex-col-center` | `flex-col` + center both axes |\n| `gap-0…gap-20` | `gap: var(--space-N)` |\n\n**Spacing** — margin & padding scale: `0 1 2 3 4 5 6 8 10 12 16 20`\n\n| Pattern | Classes |\n|---|---|\n| Margin all | `m-0`, `m-auto` |\n| Margin axis | `mx-auto`, `my-auto` |\n| Margin side | `mt-N`, `mb-N`, `ml-N`, `mr-N` |\n| Margin named | `mt-sm/md/lg/xl`, `mb-sm/md/lg/xl`, `mx-sm/md/lg/xl` |\n| Padding all | `p-0…p-20` |\n| Padding axis | `px-N`, `py-N` |\n| Padding side | `pt-N`, `pb-N`, `pl-N`, `pr-N` |\n| Padding named | `pt-sm/md/lg/xl`, `px-sm/md/lg/xl`, `py-sm/md/lg/xl` |\n\n**Sizing**\n\n| Class | CSS |\n|---|---|\n| `w-full` / `w-auto` | `width: 100% / auto` |\n| `w-screen` | `width: 100vw` |\n| `w-fit` | `width: fit-content` |\n| `w-min` / `w-max` | `width: min/max-content` |\n| `max-w-xs…max-w-full` | `max-width` presets |\n| `h-full` / `h-screen` / `h-auto` | `height` |\n| `min-h-screen` | `min-height: 100vh` |\n\n**Position**\n\n| Class | CSS |\n|---|---|\n| `relative` / `absolute` / `fixed` / `sticky` | `position` |\n| `inset-0` | `top/right/bottom/left: 0` |\n| `top-0` / `bottom-0` / `left-0` / `right-0` | edges |\n| `z-0…z-50`, `z-auto` | `z-index` |\n| `transform-center` | `translate(-50%, -50%)` |\n| `transform-x-center` / `transform-y-center` | single-axis centering |\n\n**Typography**\n\n| Class | CSS |\n|---|---|\n| `text-xs/sm/base/lg/xl/2xl…6xl` | `font-size` |\n| `font-thin/light/normal/medium/semibold/bold/extrabold/black` | `font-weight` |\n| `text-left/center/right/justify` | `text-align` |\n| `text-uppercase/lowercase/capitalize` | `text-transform` |\n| `italic` / `not-italic` | `font-style` |\n| `underline` / `line-through` / `no-underline` | `text-decoration` |\n| `truncate` | single-line ellipsis |\n| `line-clamp-2` / `line-clamp-3` | multi-line clamp |\n| `text-nowrap` / `text-wrap` / `text-balance` / `text-pretty` | wrapping |\n| `text-muted` / `text-main` / `text-light` | theme text colors |\n| `text-primary/success/warning/danger/error` | semantic colors |\n| `text-white` / `text-black` | absolute colors |\n\n**Backgrounds & Borders**\n\n| Class | CSS |\n|---|---|\n| `bg-light` / `bg-dark` / `bg-grey` / `bg-shadow` | background presets |\n| `bd-primary` / `bd-error` / `bd-success` / `bd-grey` | 1px solid borders |\n\n**Overflow & Misc**\n\n| Class | CSS |\n|---|---|\n| `overflow-hidden` / `overflow-auto` / `overflow-scroll` | `overflow` |\n| `overflow-x-auto` / `overflow-y-auto` | single axis |\n| `rounded` / `rounded-full` | border-radius |\n| `opacity-0/50/100` | `opacity` |\n| `cursor-pointer` / `cursor-default` / `cursor-not-allowed` | cursor |\n| `pointer-events-none` / `pointer-events-auto` | events |\n| `select-none` / `select-all` / `select-text` | user-select |\n| `sr-only` | visually hidden, screen-reader accessible |\n| `transition` / `transition-fast` / `transition-slow` / `transition-none` | transition presets |\n\n---\n\n### 3. 30+ modern pure CSS components\n\nNo framework. No dependencies. Every component is plain CSS — ready to paste into any project.\n\n| Category | Components |\n|---|---|\n| **UI** | Buttons (5 variants, 4 sizes), Cards (6 variants), Tags / Badges, Table |\n| **Forms** | Input, Textarea, Select, Checkbox, Radio, File Upload |\n| **Navigation** | Navbar, Breadcrumb, Tabs, Links |\n| **Overlays** | Modal, Dropdown |\n| **Feedback** | Notifications, Toast, Progress |\n| **Layout** | Grid (12-col flex + CSS Grid), Sections |\n| **Motion** | Hover FX (30+), Animations, Gradients (15+), Text Gradients |\n| **Interactive** | Accordion / Collapse, Carousel / Slider |\n\n---\n\n## Comparison\n\nnjX UI isn't a framework you learn — it's a toolkit you drop in to ship a landing fast. Honest numbers vs what you might otherwise reach for:\n\n| | Pico CSS | Water.css | Bulma | Tailwind CSS | **njX UI** (`njx-ui`) |\n|---|:---:|:---:|:---:|:---:|:---:|\n| Size (gzip) | **~10 KB** | **~3 KB** | ~30 KB | varies (JIT) | 44 KB |\n| Build step required | No | No | No | **Yes** | **No** |\n| Built-in themes | 2 + palettes | 2 (auto) | ❌ | ❌ (DIY) | **9** |\n| Theme switch | attribute | prefers-color-scheme | — | class + config | **1 attribute** |\n| Component classes (`.btn`, `.card`…) | ❌ (classless) | ❌ (classless) | ✅ | ❌ (utilities) | **✅ 30+** |\n| Classless mode | ✅ | ✅ | ❌ | ❌ | **✅ separate 7 KB file** |\n| Utility classes | ❌ | ❌ | partial | ✅ full | ✅ Tailwind-style subset |\n| Responsive prefixes | ❌ | ❌ | ❌ | ✅ | ✅ `sm:/md:/lg:/xl:` |\n| Hover FX / gradients / animations | ❌ | ❌ | ❌ | DIY | **✅ built in** |\n| Fluid typography (`clamp()`) | ❌ | ❌ | ❌ | v4 | ✅ |\n| Bulma-compatible classes | ❌ | ❌ | — | ❌ | ✅ core |\n| Ecosystem & community | large | large | huge | huge | **young** — growing |\n\n**Where njX UI loses:** it's bigger than Pico/Water (44 KB gzip vs 3–10 KB — you're getting components + utilities + 9 themes for that) and it's a young project without a large plugin ecosystem. **Where it wins:** it's the only one that ships themed components, Tailwind-style utilities *and* a classless mode in one zero-build package. Think *DaisyUI vibes, but without the Tailwind dependency*.\n\n---\n\n## Components\n### Buttons\n\n<div align=\"center\">\n\n![njX UI — Buttons](img/gif/buttons.gif)\n\n</div>\n\n```html\n<button class=\"btn btn-primary\">Primary</button>\n<button class=\"btn btn-accent\">Accent</button>\n<button class=\"btn btn-outline\">Outline</button>\n<button class=\"btn btn-ghost\">Ghost</button>\n<button class=\"btn btn-gradient\">Gradient</button>\n\n<!-- Sizes -->\n<button class=\"btn btn-primary btn-xs\">XS</button>\n<button class=\"btn btn-primary btn-sm\">SM</button>\n<button class=\"btn btn-primary btn-lg\">LG</button>\n<button class=\"btn btn-primary btn-xl\">XL</button>\n```\n\n### Cards\n```html\n<div class=\"card\">Default card</div>\n<div class=\"card-glass\">Glassmorphism</div>\n<div class=\"card-glow\">Glow card</div>\n<div class=\"card-gradient\">Gradient card</div>\n<div class=\"card-bordered-primary\">Bordered</div>\n<div class=\"card-dark\">Dark card</div>\n```\n\n### Grid\n```html\n<!-- 12-column flex grid -->\n<div class=\"row\">\n  <div class=\"col-4\">4 cols</div>\n  <div class=\"col-8\">8 cols</div>\n</div>\n\n<!-- CSS Grid -->\n<div class=\"grid-col-3\">\n  <div>1</div><div>2</div><div>3</div>\n</div>\n```\n\n### Modal\n\n<div align=\"center\">\n\n![njX UI — Modals & Popups](img/gif/popup.gif)\n\n</div>\n\n```html\n<button class=\"btn btn-primary\" onclick=\"openModal('my-modal')\">Open</button>\n\n<div id=\"my-modal\" class=\"lib-modal-overlay\" onclick=\"if(event.target===this)closeModal(this)\">\n  <div class=\"lib-modal\">\n    <h3>Title</h3>\n    <p>Content</p>\n    <button onclick=\"closeModal(document.getElementById('my-modal'))\">Close</button>\n  </div>\n</div>\n```\n\n### Accordion\n```html\n<div class=\"accordion\">\n  <div class=\"collapse\">\n    <div class=\"collapse-header\" onclick=\"accordionToggle(this)\">\n      <span>Question</span>\n      <span class=\"collapse-icon\">▾</span>\n    </div>\n    <div class=\"collapse-body\">Answer content here.</div>\n  </div>\n</div>\n```\n\n### Sidebar & Navigation\n\n<div align=\"center\">\n\n![njX UI — Sidebar](img/gif/sidebar.gif)\n\n</div>\n\n```html\n<div class=\"sidebar sidebar-left\" id=\"my-sidebar\">\n  <div class=\"sidebar-header\">Menu</div>\n  <nav class=\"sidebar-nav\">\n    <a class=\"sidebar-link active\" href=\"#\">Dashboard</a>\n    <a class=\"sidebar-link\" href=\"#\">Settings</a>\n  </nav>\n</div>\n<div class=\"sidebar-overlay\" onclick=\"closeSidebar('my-sidebar')\"></div>\n```\n\n### Toast notifications\n```html\n<div id=\"lib-toast-container\"></div>\n\n<script>\nshowToast('Saved!', 'success')\nshowToast('Error occurred', 'error')\nshowToast('Info message', 'primary')\n</script>\n```\n\n### Hover Effects & Animations\n\n<div align=\"center\">\n\n![njX UI — Animations & Hover Effects](img/gif/anim.gif)\n\n</div>\n\n```html\n<div class=\"hover-scale\">Scale on hover</div>\n<div class=\"hover-lift\">Lift on hover</div>\n<div class=\"hover-glow\">Glow on hover</div>\n\n<div class=\"animate-float\">Floating</div>\n<div class=\"animate-fade-in\">Fade in</div>\n<div class=\"animate-fade-up\">Fade up</div>\n<div class=\"animate-pulse\">Pulse</div>\n```\n\n### Social Cards & Skeleton Loaders\n\n<div align=\"center\">\n\n![njX UI — Social & Skeleton](img/gif/relese-social-skeleton.gif)\n\n</div>\n\n```html\n<!-- Skeleton loader -->\n<div class=\"skeleton-user\">\n  <span class=\"skeleton skeleton-circle\" style=\"width:44px;height:44px\"></span>\n  <div class=\"skeleton-user-info\">\n    <span class=\"skeleton skeleton-md skeleton-2/3\"></span>\n    <span class=\"skeleton skeleton-sm skeleton-1/2\"></span>\n  </div>\n</div>\n\n<!-- Social card -->\n<div class=\"card social-card\">\n  <div class=\"social-card-header\">...</div>\n</div>\n```\n\n### Gradients & Text Effects\n```html\n<div class=\"gradient-primary\">Blue gradient bg</div>\n<div class=\"gradient-sunset\">Sunset gradient bg</div>\n<div class=\"gradient-fire\">Fire gradient bg</div>\n\n<h1 class=\"text-gradient-primary\">Gradient heading</h1>\n<h1 class=\"text-gradient-accent\">Accent gradient</h1>\n```\n\n---\n\n## Design Tokens\n\nOne file (`_base.css`) — one source of truth. Override anything:\n\n```css\n:root {\n  --color-primary: #ff6b35;  /* everything turns orange */\n  --font-sans: \"Inter\", sans-serif;\n  --radius-md: 8px;\n}\n```\n\nColor shades, spacing scale, fluid typography, shadows, z-index — all in variables. See [CSS-DOCS.en.md](css/CSS-DOCS.en.md).\n\n---\n\n## Bulma Compatibility\n\nMigrating from Bulma? Core class names work out of the box:\n\n```html\n<button class=\"button is-primary is-rounded\">Button</button>\n<div class=\"card\">\n  <div class=\"card-header\"><p class=\"card-header-title\">Title</p></div>\n  <div class=\"card-content\">Content</div>\n</div>\n```\n\n---\n\n## Build\n\nBundle all files into a single minified CSS:\n\n```bash\nnpx lightningcss --bundle --minify css/style.css -o css/style.min.css\n```\n\n---\n\n## License\n\n[MIT](LICENSE) — free for personal and commercial use.\n\n---\n\n## Documentation & Guides\n\n| File | Description |\n|---|---|\n| [GITHUB.md](GITHUB.md) | How to use from GitHub — CDN, download, clone, fork |\n| [CONTRIBUTING.md](CONTRIBUTING.md) | How to add components, utilities, and submit PRs |\n| [css/CSS-DOCS.en.md](css/CSS-DOCS.en.md) | Full CSS reference — all classes and variables |\n| [classless.md](classless.md) | Classless mode — all elements, variants, and tokens |\n\n---\n\n<div align=\"center\">\n\n**njX UI** · npm [`njx-ui`](https://www.npmjs.com/package/njx-ui) · [njxui.dev](https://njxui.dev) · Made by [njbSaab](https://github.com/njbSaab)\n\n</div>\n","readmeFilename":"README.md"}