{"_id":"@axt_ayakoto/html-number-countup","_rev":"2-774cc03bdcce7a6dd30b2565b2f5b3f3","name":"@axt_ayakoto/html-number-countup","dist-tags":{"latest":"0.2.0"},"versions":{"0.1.0":{"name":"@axt_ayakoto/html-number-countup","version":"0.1.0","keywords":[],"author":"","license":"MIT","_id":"@axt_ayakoto/html-number-countup@0.1.0","maintainers":[{"name":"ayasaka_koto","email":"axt_ayakoto@protonmail.com"}],"homepage":"https://github.com/AXT-AyaKoto/html-number-countup#readme","bugs":{"url":"https://github.com/AXT-AyaKoto/html-number-countup/issues"},"dist":{"shasum":"388360fde50e43481a5ed6e52e3f30bedafe73cf","tarball":"https://registry.npmjs.org/@axt_ayakoto/html-number-countup/-/html-number-countup-0.1.0.tgz","fileCount":6,"integrity":"sha512-PpRo3hl6KdeYGQwdv2kE5NMR8qeXZqyW+jcN7vblYHvG5fkElWUDGNbvxtAs+cGN2JTMdWHpWAUe4K14i1XLBQ==","signatures":[{"sig":"MEQCIFPVT5josqvyRj2C5FOrxVuc1MfTxrHeTRNA4KE/B3N8AiA4RGYoJ/0ZwlYLmq7mnE5GZMyBgmYevguvDKryiFKDVQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2466},"main":"dist/index.js","type":"module","types":"./dist/index.d.ts","gitHead":"ad6724a435b1ac36e86957d0507d25cf90e1ade6","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"npm run build:js && npm run build:css","build:js":"tsup src/index.ts --format esm --out-dir dist --dts --clean","build:css":"cpy \"src/*.css\" dist/ --flat"},"_npmUser":{"name":"ayasaka_koto","email":"axt_ayakoto@protonmail.com"},"repository":{"url":"git+https://github.com/AXT-AyaKoto/html-number-countup.git","type":"git"},"_npmVersion":"11.6.2","description":"「0からNまでカウントアップする数値テキストのHTML要素」を作るためのアニメーションライブラリ","directories":{},"_nodeVersion":"22.19.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"8.5.1","cpy-cli":"6.0.0","typescript":"5.9.3"},"_npmOperationalInternal":{"tmp":"tmp/html-number-countup_0.1.0_1767769192163_0.3503517284256408","host":"s3://npm-registry-packages-npm-production"}},"0.2.0":{"name":"@axt_ayakoto/html-number-countup","version":"0.2.0","description":"「カウントアップする数値テキストのHTML要素」を作るためのアニメーションライブラリ","main":"dist/index.js","scripts":{"build:js":"tsup src/index.ts --format esm --out-dir dist --dts --clean","build:css":"cpy \"src/*.css\" dist/ --flat","build":"npm run build:js && npm run build:css","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/AXT-AyaKoto/html-number-countup.git"},"keywords":[],"author":"","license":"MIT","type":"module","bugs":{"url":"https://github.com/AXT-AyaKoto/html-number-countup/issues"},"homepage":"https://github.com/AXT-AyaKoto/html-number-countup#readme","devDependencies":{"cpy-cli":"6.0.0","tsup":"8.5.1","typescript":"5.9.3"},"gitHead":"c37a86786cd4b316aab73e804268fe4e848f3e78","types":"./dist/index.d.ts","_id":"@axt_ayakoto/html-number-countup@0.2.0","_nodeVersion":"22.19.0","_npmVersion":"11.6.2","dist":{"integrity":"sha512-L94iUFq7GvzsI377M1pbezQFpUxC0zktBGIriWEWt6sQAGnWpJHHry/EKhYehM6+I5kfQQIsurUKE0OVRU6xpQ==","shasum":"96c47f8763aafb9b3a73951db3c2f61f18d29106","tarball":"https://registry.npmjs.org/@axt_ayakoto/html-number-countup/-/html-number-countup-0.2.0.tgz","fileCount":6,"unpackedSize":10196,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEMCHzwIrgj1zSG972bETYbMsJpXpf8wOEC18ZvcJFUltyYCICFc0vgI4viTvL6rzB2KUlGMPmjqPf8CRZFnalDFIGB3"}]},"_npmUser":{"name":"ayasaka_koto","email":"axt_ayakoto@protonmail.com"},"directories":{},"maintainers":[{"name":"ayasaka_koto","email":"axt_ayakoto@protonmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/html-number-countup_0.2.0_1767772839175_0.7805404079407217"},"_hasShrinkwrap":false}},"time":{"created":"2026-01-07T06:59:52.056Z","modified":"2026-01-07T08:00:39.531Z","0.1.0":"2026-01-07T06:59:52.311Z","0.2.0":"2026-01-07T08:00:39.321Z"},"bugs":{"url":"https://github.com/AXT-AyaKoto/html-number-countup/issues"},"license":"MIT","homepage":"https://github.com/AXT-AyaKoto/html-number-countup#readme","keywords":[],"repository":{"type":"git","url":"git+https://github.com/AXT-AyaKoto/html-number-countup.git"},"description":"「カウントアップする数値テキストのHTML要素」を作るためのアニメーションライブラリ","maintainers":[{"name":"ayasaka_koto","email":"axt_ayakoto@protonmail.com"}],"readme":"# html-number-countup\n\nHTML要素に対して、初めて画面に表示されたときに0からその数値までカウントアップするアニメーションを付与します。\n\n## Usage\n\n### JavaScriptモジュールのインポート\n\n静的HTMLファイルでは、例えば以下のようにJavaScriptモジュールをインポートします。\n\n```html\n\n```\n\nまた、npmなどのパッケージマネージャーを使用している場合は、以下のようにインポートが可能です。\n\n```js\nimport { init } from '@axt_ayakoto/html-number-countup';\n```\n\n### CSSのインポート\n\n(現時点でCSSは特に必要ありません。)\n\n### 簡易利用: クラス・data属性による使用\n\nHTML要素に対して、以下のようにCSSクラス名と`data-html-number-countup`属性を指定します。\n\n```html\n\n```\n\nこれにより、ページ読み込み時に自動的にカウントアップアニメーションが予約されます。\n\nなお、`data-html-number-countup`属性には、以下のオプションをJSON形式で指定できます。\n\n- `duration`: アニメーションの継続時間をミリ秒単位で指定します。\n - 省略可能で、デフォルトは`1000`(1秒)です。\n- `start`: カウントアップを開始する数値を指定します。\n - 省略可能で、デフォルトは`0`です。\n- `end`: カウントアップを終了する数値を指定します。\n - 省略はできません。\n- `separator`: 数値を3桁ごとに区切るための文字列を指定します。\n - 省略可能で、デフォルトは`\"\"`(区切りなし)です。\n- `decimalDigits`: 小数点以下の桁数を指定します。\n - 省略可能で、デフォルトは`0`です。\n - `0`のときは整数として、`1`以上のときはその桁数まで小数点以下を表示する形でカウントアップします。\n\n### カスタム利用: `init()`関数による使用\n\n`init()`関数を使用して、任意のHTML要素に対してカウントアップアニメーションを予約することもできます。\n\n```js\nimport { init } from '@axt_ayakoto/html-number-countup';\nconst element = document.getElementById('countup-target');\ninit(element, { start: 0, end: 1000, duration: 2000, separator: \",\", decimalDigits: 2 });\n```\n\n## Notes\n\n- どのようにスクロールしても画面全体に表示されることがない要素(大きさが画面サイズを超えている要素など)に対しては、カウントアップアニメーションは発動しません。\n- アニメーションは一度だけ発動します。要素が画面外にスクロールアウトして再度スクロールインしても、再度アニメーションは発動しません。\n- `end`オプションは必須です。指定しない場合、コンソールにエラーメッセージが表示され、アニメーションは発動しません。\n- `end`オプションに数値以外の値を指定した場合、コンソールにエラーメッセージが表示され、アニメーションは発動しません。\n\n## Development\n\n### Build, Publish\n\n`package.json`のバージョンを更新した後、以下のコマンドを実行してビルドおよび公開を行います。\n\n```bash\nnpm run build\nnpm publish --access public\n```\n\n## License\n\ncopyright (c) 2026- Ayasaka-Koto.\nThis library is licensed under the MIT License.\n","readmeFilename":"README.md"}