{"_id":"@amonratcha/minimal-spinner","name":"@amonratcha/minimal-spinner","dist-tags":{"latest":"0.0.1"},"versions":{"0.0.1":{"name":"@amonratcha/minimal-spinner","version":"0.0.1","description":"A small, zero-dependency CLI spinner for Node.js","main":"dist/index.js","types":"dist/index.d.ts","scripts":{"build":"tsc -p tsconfig.json","prepare":"npm run build","test":"echo \"No tests specified\" && exit 0","lint":"echo \"No linter configured\""},"repository":{"type":"git","url":"git+https://github.com/ash-alt-max/spinner.git"},"keywords":["spinner","cli","terminal","progress"],"author":{"name":"Ash-alt-max"},"license":"MIT","devDependencies":{"@types/node":"^24.10.1","typescript":"^5.5.0"},"bugs":{"url":"https://github.com/ash-alt-max/spinner/issues"},"homepage":"https://github.com/ash-alt-max/spinner#readme","_id":"@amonratcha/minimal-spinner@0.0.1","_nodeVersion":"18.14.2","_npmVersion":"9.5.0","dist":{"integrity":"sha512-j5ThoOqthpPCuyQ8uP9DhaQLISpZr6bWEmkZTBHSo06Xwgygye+WX2Yg6kGGlJ/AKcdeTsV+ey5osvppiBB6eA==","shasum":"73b8176b46addcd0c035462174e643a9a06c0f9d","tarball":"https://registry.npmjs.org/@amonratcha/minimal-spinner/-/minimal-spinner-0.0.1.tgz","fileCount":5,"unpackedSize":14433,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIGZ0tVN05uxgZng4R5G7GmouzdKfB7dwMD+Z1xoGVRxKAiBeyUJj2itzwySwUgl1ciguCd8fUfFYwsmnZo/dGiLMRw=="}]},"_npmUser":{"name":"amonratcha","email":"anonataszx@outlook.co.th"},"directories":{},"maintainers":[{"name":"amonratcha","email":"anonataszx@outlook.co.th"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/minimal-spinner_0.0.1_1763451449834_0.5542838011657558"},"_hasShrinkwrap":false}},"time":{"created":"2025-11-18T07:37:29.766Z","0.0.1":"2025-11-18T07:37:30.066Z","modified":"2025-11-18T07:37:30.362Z"},"maintainers":[{"name":"amonratcha","email":"anonataszx@outlook.co.th"}],"description":"A small, zero-dependency CLI spinner for Node.js","homepage":"https://github.com/ash-alt-max/spinner#readme","keywords":["spinner","cli","terminal","progress"],"repository":{"type":"git","url":"git+https://github.com/ash-alt-max/spinner.git"},"author":{"name":"Ash-alt-max"},"bugs":{"url":"https://github.com/ash-alt-max/spinner/issues"},"license":"MIT","readme":"# @ash-alt-max/spinner\r\n\r\nA tiny, zero-dependency spinner library for Node.js and browsers. This package provides:\r\n- A CLI (Node) spinner (Node/TTY).\r\n- A browser/DOM spinner (for web apps).\r\n- A small API for start/stop/update/succeed/fail that works in both environments.\r\n\r\n> Note: For Angular and other frontend frameworks, use the browser bundle (ESM) or import the browser entry path.\r\n\r\n---\r\n\r\n## Install\r\n\r\n```bash\r\n# npm\r\nnpm install @ash-alt-max/spinner\r\n\r\n# or yarn\r\nyarn add @ash-alt-max/spinner\r\n```\r\n\r\n---\r\n\r\n## Quick usage — Browser (vanilla JS)\r\n\r\nThis library ships a browser-friendly ES module (e.g. `dist/browser.js`). If your package.json `exports` / `browser` field points to it, you can simply:\r\n\r\n```html\r\n<script type=\"module\">\r\nimport Spinner from '/node_modules/@ash-alt-max/spinner/dist/browser.js';\r\n\r\nconst area = document.getElementById('demo-area');\r\nconst s = new Spinner({ container: area, text: 'Loading...', interval: 100 });\r\n\r\ns.start();\r\nsetTimeout(() => s.succeed('Done!'), 2000);\r\n</script>\r\n```\r\n\r\nIf you bundle your app (Vite/Rollup/webpack), you can import:\r\n```js\r\nimport Spinner from '@ash-alt-max/spinner/dist/browser.js';\r\n// or, if package exports are configured:\r\n// import Spinner from '@ash-alt-max/spinner';\r\n```\r\n\r\n---\r\n\r\n## Quick usage — Node (CLI)\r\n\r\nThe Node spinner is designed for TTY (terminal). Example:\r\n\r\n```js\r\n// CommonJS\r\nconst Spinner = require('@ash-alt-max/spinner').default;\r\n\r\nconst s = new Spinner({ text: 'Processing...', interval: 80 });\r\ns.start();\r\n\r\nsetTimeout(() => s.succeed('Completed'), 2000);\r\n```\r\n\r\nIf you use TypeScript / ESM:\r\n```ts\r\nimport Spinner from '@ash-alt-max/spinner';\r\nconst s = new Spinner({ text: 'Processing...' });\r\ns.start();\r\n```\r\n\r\n---\r\n\r\n## Using in Angular\r\n\r\n1. Install the package (see Install section).\r\n2. Use the browser build inside a component (ensure client-side only; guard for SSR).\r\n\r\nExample component (TypeScript):\r\n\r\n```ts\r\n// src/app/spinner-demo/spinner-demo.component.ts\r\nimport { Component, ElementRef, OnDestroy, OnInit, ViewChild } from '@angular/core';\r\n// Import browser bundle path; change if your package exports browser entry\r\nimport Spinner from '@ash-alt-max/spinner/dist/browser.js';\r\n\r\n@Component({\r\n  selector: 'app-spinner-demo',\r\n  templateUrl: './spinner-demo.component.html',\r\n})\r\nexport class SpinnerDemoComponent implements OnInit, OnDestroy {\r\n  @ViewChild('spinnerHost', { static: true }) host!: ElementRef<HTMLDivElement>;\r\n  private spinner!: any;\r\n\r\n  ngOnInit(): void {\r\n    this.spinner = new Spinner({\r\n      container: this.host.nativeElement,\r\n      text: 'Loading...',\r\n      interval: 100\r\n    });\r\n  }\r\n\r\n  start(): void { this.spinner.start(); }\r\n  stop(): void { this.spinner.stop(); }\r\n  succeed(): void { this.spinner.succeed('Completed'); }\r\n  fail(): void { this.spinner.fail('Failed'); }\r\n  updateText(t: string): void { this.spinner.update(t); }\r\n\r\n  ngOnDestroy(): void {\r\n    this.spinner?.stop(true);\r\n  }\r\n}\r\n```\r\n\r\nTemplate:\r\n\r\n```html\r\n<!-- src/app/spinner-demo/spinner-demo.component.html -->\r\n<div #spinnerHost></div>\r\n<button (click)=\"start()\">Start</button>\r\n<button (click)=\"stop()\">Stop</button>\r\n<button (click)=\"succeed()\">Succeed</button>\r\n<button (click)=\"fail()\">Fail</button>\r\n```\r\n\r\nImportant: If your Angular app uses Server-Side Rendering (Angular Universal), ensure you only construct/start the spinner on the client. Use `isPlatformBrowser` or ngIf to prevent server execution.\r\n\r\n---\r\n\r\n## API\r\n\r\nConstructor options:\r\n- frames?: string[] — custom frames\r\n- interval?: number — ms between frames (default: 80)\r\n- text?: string — initial text\r\n- container?: HTMLElement — browser DOM container (browser build)\r\n- stream?: NodeJS.WriteStream — stdout or custom stream (Node build)\r\n- hideCursor?: boolean — (Node) hide cursor while spinning\r\n\r\nInstance methods:\r\n- start(text?: string): this\r\n- stop(clear = true): this\r\n- succeed(text?: string): this\r\n- fail(text?: string): this\r\n- update(text: string): this\r\n- isSpinning(): boolean\r\n\r\n---\r\n\r\n## Build (author)\r\n\r\nIf you maintain this package locally and want to produce a browser bundle:\r\n\r\nUsing esbuild (example):\r\n```bash\r\n# install dev deps\r\nnpm install -D esbuild\r\n\r\n# build browser bundle (ESM)\r\nnpx esbuild src/browser.ts --bundle --format=esm --target=es2017 --outfile=dist/browser.js\r\n```\r\n\r\nSuggested package.json snippets:\r\n```json\r\n{\r\n  \"main\": \"dist/index.cjs.js\",\r\n  \"module\": \"dist/index.esm.js\",\r\n  \"browser\": \"dist/browser.js\",\r\n  \"types\": \"dist/index.d.ts\",\r\n  \"exports\": {\r\n    \".\": {\r\n      \"import\": \"./dist/index.esm.js\",\r\n      \"require\": \"./dist/index.cjs.js\",\r\n      \"default\": \"./dist/browser.js\"\r\n    }\r\n  },\r\n  \"scripts\": {\r\n    \"build\": \"tsc -p tsconfig.json && npm run build:browser\",\r\n    \"build:browser\": \"esbuild src/browser.ts --bundle --format=esm --target=es2017 --outfile=dist/browser.js\",\r\n    \"prepare\": \"npm run build\"\r\n  }\r\n}\r\n```\r\n\r\nWhen `browser` / `exports` are set, bundlers and frameworks will prefer the browser entry for frontend builds.\r\n\r\n---\r\n\r\n## Examples\r\n\r\n- examples/index.html — demo for the browser spinner\r\n- examples/run.js — demo for Node (uses compiled `dist/index.js`)\r\n\r\nRun the browser demo locally:\r\n```bash\r\n# start a simple static server in the project root\r\nnpx serve examples\r\n# or\r\npython -m http.server --directory examples 8000\r\n# then open http://localhost:5000/examples/index.html (port depends on tool)\r\n```\r\n\r\n---\r\n\r\n## Testing\r\n\r\nWe use Vitest for unit tests (running against source TypeScript):\r\n```bash\r\nnpm install\r\nnpm test          # runs vitest --run\r\nnpm run test:watch\r\n```\r\n\r\n---\r\n\r\n## Notes, SSR and compatibility\r\n\r\n- The Node spinner requires a TTY (stdout.isTTY). When used in non-TTY environments, it falls back to printing a single-line message.\r\n- The browser build manipulates the DOM and must only be used in client-side contexts.\r\n- Provide type declarations (`.d.ts`) so TypeScript consumers (including Angular) get typing support.\r\n\r\n---\r\n\r\n## Contributing\r\n\r\nPRs welcome — please add tests and keep the bundle small. See LICENSE for licensing.\r\n\r\n---\r\n\r\n## License\r\n\r\nMIT","readmeFilename":"README.md","_rev":"1-036d8946bdb4c5ed6333abefe5767d2f"}