{"_id":"@anil-labs/google-places-autocomplete-element","name":"@anil-labs/google-places-autocomplete-element","dist-tags":{"latest":"0.2.0"},"versions":{"0.2.0":{"name":"@anil-labs/google-places-autocomplete-element","version":"0.2.0","type":"module","description":"Framework-free custom element for address autocomplete, built on Google's Places API (New).","license":"MIT","author":"Er. Anil Kumar Thakur <anilkumarthakur60@gmail.com>","repository":{"type":"git","url":"git+https://github.com/anilkumarthakur60/google-places-autocomplete.git","directory":"packages/element"},"homepage":"https://github.com/anilkumarthakur60/google-places-autocomplete/tree/main/packages/element#readme","bugs":"https://github.com/anilkumarthakur60/google-places-autocomplete/issues","sideEffects":false,"main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","unpkg":"./dist/index.global.js","jsdelivr":"./dist/index.global.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"}},"dependencies":{"@anil-labs/google-places-autocomplete-core":"^0.2.0"},"devDependencies":{"jsdom":"^29.0.2","tsup":"^8.5.1","typescript":"~6.0.0","vitest":"^4.1.10"},"publishConfig":{"access":"public"},"engines":{"node":">=20"},"scripts":{"clean":"rm -rf dist","build":"tsup && node scripts/check-dist.mjs && node scripts/check-cdn.mjs","dev":"tsup --watch","test":"vitest run","test:watch":"vitest","typecheck":"tsc --noEmit","lint":"eslint ."},"_nodeVersion":"24.18.0","_id":"@anil-labs/google-places-autocomplete-element@0.2.0","dist":{"integrity":"sha512-r0yCZRMDjQDEti9b2c1X/8FsQ/WvdHNY8EuaUnx34CD/FPcZ6PRjmdTpmJQAMe7GieLpxGGEvbwki9+geqZKMg==","shasum":"1fe800965b92b7c935bbcab01a61528a735a8f1b","tarball":"https://registry.npmjs.org/@anil-labs/google-places-autocomplete-element/-/google-places-autocomplete-element-0.2.0.tgz","fileCount":11,"unpackedSize":152555,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCICzI5Zq0wwUaaVXkWHtvYFtpqUzjcwKCo8MhkxqgUGAgAiEAqBatHX76r8JwTJy7cqd3I5GAq4WeAeQcAIu1DjZWrJc="}]},"_npmUser":{"name":"anilkumarthakur","email":"anilkumarthakur60@gmail.com"},"directories":{},"maintainers":[{"name":"anilkumarthakur","email":"anilkumarthakur60@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/google-places-autocomplete-element_0.2.0_1785342371858_0.8483854428303346"},"_hasShrinkwrap":false}},"time":{"created":"2026-07-29T16:26:11.614Z","0.2.0":"2026-07-29T16:26:11.998Z","modified":"2026-07-29T16:26:12.305Z"},"maintainers":[{"name":"anilkumarthakur","email":"anilkumarthakur60@gmail.com"}],"description":"Framework-free custom element for address autocomplete, built on Google's Places API (New).","homepage":"https://github.com/anilkumarthakur60/google-places-autocomplete/tree/main/packages/element#readme","repository":{"type":"git","url":"git+https://github.com/anilkumarthakur60/google-places-autocomplete.git","directory":"packages/element"},"author":"Er. Anil Kumar Thakur <anilkumarthakur60@gmail.com>","bugs":"https://github.com/anilkumarthakur60/google-places-autocomplete/issues","license":"MIT","readme":"# @anil-labs/google-places-autocomplete-element\n\nFramework-free `<gpa-autocomplete>` custom element for address autocomplete, built on Google's Places API (New). Works in any framework — or none. Self-injects its stylesheet, so there's no separate CSS import.\n\n## Via a CDN — no build step\n\nThe package ships a standalone bundle (engine + styles baked in) that auto-registers `<gpa-autocomplete>`. One script tag, zero setup:\n\n```html\n<script src=\"https://unpkg.com/@anil-labs/google-places-autocomplete-element\"></script>\n\n<gpa-autocomplete api-key=\"YOUR_API_KEY\" placeholder=\"Search for an address…\"></gpa-autocomplete>\n\n<script>\n  document.querySelector('gpa-autocomplete').addEventListener('select', (event) => {\n    console.log(event.detail.place.formattedAddress)\n  })\n</script>\n```\n\nPin a version in production (`.../@anil-labs/google-places-autocomplete-element@x.y.z`). The engine is bundled in, so don't also load `-core` separately.\n\n## With a bundler\n\n```sh\nnpm install @anil-labs/google-places-autocomplete-element\n```\n\n```html\n<script type=\"module\">\n  import { defineGooglePlacesAutocompleteElement } from '@anil-labs/google-places-autocomplete-element'\n\n  defineGooglePlacesAutocompleteElement('gpa-autocomplete')\n\n  // Configure BEFORE inserting into the document (see the warning below).\n  const el = document.createElement('gpa-autocomplete')\n  el.setAttribute('api-key', 'YOUR_API_KEY')\n  el.setAttribute('placeholder', 'Search for an address…')\n  el.addEventListener('select', (event) => console.log(event.detail.place.formattedAddress))\n  el.addEventListener('gpaerror', (event) => console.error(event.detail.error))\n  document.body.append(el)\n</script>\n```\n\n> **Configure before connecting.** `customElements.define()` synchronously upgrades any matching tag already parsed into the document — building the element from a script and setting `api-key` *after* appending it may connect it first. Set attributes before `append()` (as above), or declare the tag with its attributes directly in HTML (as in the CDN example).\n\nFull documentation: [Web Component guide](https://anilkumarthakur60.github.io/google-places-autocomplete/guide/frameworks/web-component) · [getting started](https://anilkumarthakur60.github.io/google-places-autocomplete/guide/getting-started) (Google Cloud setup) · [API reference](https://anilkumarthakur60.github.io/google-places-autocomplete/api/core).\n\n## Attributes\n\n`api-key`, `debounce-ms`, `min-length`, `language-code`, `region-code` (read once at first connection), plus `value` and `placeholder` (live-updatable at any time).\n\n## Events\n\n`select` (`detail: { place, suggestion }`), `gpaerror` (`detail: { error }` — named to avoid ambiguity with the DOM's built-in `error` event).\n\n## SSR-safe\n\nSafe to import during server-side rendering (Next.js/Nuxt/SvelteKit) — the module doesn't reference `HTMLElement`/`customElements` at load time, only when actually connected in a browser.\n\n## License\n\nMIT © Er. Anil Kumar Thakur\n","readmeFilename":"","_rev":"1-aed03609270cbdf5c1af20d626f4626a"}