{"_id":"@closerclick/closer-click-install","_rev":"2-92c5e6d36e5f38e133ee5bb8791e010b","name":"@closerclick/closer-click-install","dist-tags":{"latest":"0.1.1"},"versions":{"0.1.0":{"name":"@closerclick/closer-click-install","version":"0.1.0","keywords":["closer-click","web-component","custom-element","install","pwa","beforeinstallprompt","add-to-home-screen","ios","cross-app"],"author":{"name":"seyacat"},"license":"MIT","_id":"@closerclick/closer-click-install@0.1.0","maintainers":[{"name":"mycloserclick","email":"admin@closer.click"}],"homepage":"https://github.com/closerclick/closer-click-install#readme","bugs":{"url":"https://github.com/closerclick/closer-click-install/issues"},"dist":{"shasum":"989e01441e75e84c740e385c3dab1b5ca0e3ad60","tarball":"https://registry.npmjs.org/@closerclick/closer-click-install/-/closer-click-install-0.1.0.tgz","fileCount":7,"integrity":"sha512-S/TlPC9Geh/qxf0D2xpjvrApXAJohNncuGZkkXjdVcAiHcY9j9Ib7DzUEd1uSbrL/iis1fQNcj3pjK3JKSZFrg==","signatures":[{"sig":"MEUCIBv54yNZOuy9ada4c7T/WSYjMseJE8fUriHl9qOwg4XaAiEAkMF44xRswuydZT21sQuA2bP5wUeao541Bupn/5xQp7U=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":27157},"main":"src/index.js","type":"module","types":"src/index.d.ts","module":"src/index.js","exports":{".":{"types":"./src/index.d.ts","import":"./src/index.js"},"./vue":{"types":"./src/vue.d.ts","import":"./src/vue.js"}},"scripts":{"test":"node test/smoke.mjs"},"_npmUser":{"name":"mycloserclick","email":"admin@closer.click"},"repository":{"url":"git+https://github.com/closerclick/closer-click-install.git","type":"git"},"_npmVersion":"11.12.1","description":"Botón de \"Instalar app\" (PWA) unificado del ecosistema Closer Click: Web Component <closer-click-install> que captura beforeinstallprompt temprano, maneja iOS con un modal de instrucciones (sin alert) y se oculta si ya está instalada. Vue o vanilla. Sin J","directories":{},"_nodeVersion":"25.9.0","_hasShrinkwrap":false,"peerDependencies":{"vue":">=3.3.0"},"peerDependenciesMeta":{"vue":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/closer-click-install_0.1.0_1780595542531_0.32524083554875816","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@closerclick/closer-click-install","version":"0.1.1","description":"Botón de \"Instalar app\" (PWA) unificado del ecosistema Closer Click: Web Component <closer-click-install> que captura beforeinstallprompt temprano, maneja iOS con un modal de instrucciones (sin alert) y se oculta si ya está instalada. Vue o vanilla. Sin J","type":"module","main":"src/index.js","module":"src/index.js","types":"src/index.d.ts","exports":{".":{"types":"./src/index.d.ts","import":"./src/index.js"},"./vue":{"types":"./src/vue.d.ts","import":"./src/vue.js"}},"scripts":{"test":"node test/smoke.mjs"},"peerDependencies":{"vue":">=3.3.0"},"peerDependenciesMeta":{"vue":{"optional":true}},"keywords":["closer-click","web-component","custom-element","install","pwa","beforeinstallprompt","add-to-home-screen","ios","cross-app"],"author":{"name":"seyacat"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/closerclick/closer-click-install.git"},"_id":"@closerclick/closer-click-install@0.1.1","bugs":{"url":"https://github.com/closerclick/closer-click-install/issues"},"homepage":"https://github.com/closerclick/closer-click-install#readme","_nodeVersion":"25.9.0","_npmVersion":"11.12.1","dist":{"integrity":"sha512-2EQpyeYkUflxhyvTDBVzetPcRjE/V5DQ99PTPC0VuH8qXLLPfVzNiPP0uywkBgEZffpC4yT8huv5oW3xRV6sAQ==","shasum":"f2ac096e6ca3c9638f20c6a6ec831ab89896b43c","tarball":"https://registry.npmjs.org/@closerclick/closer-click-install/-/closer-click-install-0.1.1.tgz","fileCount":7,"unpackedSize":27165,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCICS0WY88G7/UGQ/vCF/sHXfdqUGPR8zmkOWvCCVu7bisAiEA2n3L/VrIS9Unwe9SvLSp14ye2MTwA3OOHbM/7ec7VaI="}]},"_npmUser":{"name":"mycloserclick","email":"admin@closer.click"},"directories":{},"maintainers":[{"name":"mycloserclick","email":"admin@closer.click"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/closer-click-install_0.1.1_1780599626733_0.9078894608491153"},"_hasShrinkwrap":false}},"time":{"created":"2026-06-04T17:52:22.373Z","modified":"2026-06-04T19:00:27.023Z","0.1.0":"2026-06-04T17:52:22.678Z","0.1.1":"2026-06-04T19:00:26.886Z"},"bugs":{"url":"https://github.com/closerclick/closer-click-install/issues"},"author":{"name":"seyacat"},"license":"MIT","homepage":"https://github.com/closerclick/closer-click-install#readme","keywords":["closer-click","web-component","custom-element","install","pwa","beforeinstallprompt","add-to-home-screen","ios","cross-app"],"repository":{"type":"git","url":"git+https://github.com/closerclick/closer-click-install.git"},"description":"Botón de \"Instalar app\" (PWA) unificado del ecosistema Closer Click: Web Component <closer-click-install> que captura beforeinstallprompt temprano, maneja iOS con un modal de instrucciones (sin alert) y se oculta si ya está instalada. Vue o vanilla. Sin J","maintainers":[{"name":"mycloserclick","email":"admin@closer.click"}],"readme":"# @closerclick/closer-click-install\n\nBotón de **\"Instalar app\"** (PWA) unificado para todo el ecosistema\n[Closer Click](https://closer.click).\n\nResuelve la fragmentación de tener el mismo flujo `beforeinstallprompt` copiado a\nmano en cada app (Vue y vanilla), donde cada copia divergió y arrastra los mismos\nbugs sutiles. Un solo Web Component, testeado, igual en todas las apps.\n\nSin JS de terceros, sin cookies, autohosteado (Shadow DOM). Bilingüe es/en.\n\n## Por qué un paquete y no copiar el snippet\n\nEl botón es trivial; lo que **no** lo es —y por eso se centraliza— son tres\ndetalles que casi todas las copias hacían mal:\n\n1. **`beforeinstallprompt` se dispara muy pronto**, a veces antes de montar el\n   componente. Si lo escuchás en `onMounted` lo perdés y el botón nunca aparece.\n   Aquí se captura a nivel de módulo, en el `import`.\n2. **iOS/Safari no soporta `beforeinstallprompt`** ni API de instalación: la\n   única vía es *Compartir → Añadir a pantalla de inicio*. Sin esto, en iPhone la\n   app simplemente no se puede instalar. Lo resolvemos con un **modal de\n   instrucciones propio** (no `alert()`, prohibido en el ecosistema).\n3. **No reaparecer** cuando la app ya corre instalada (`display-mode: standalone`)\n   ni tras `appinstalled`.\n\n## Uso — Web Component (recomendado)\n\n```js\n// Vue: importa el paquete una vez (p. ej. en main.js) y usa el tag.\nimport '@closerclick/closer-click-install'\n```\n\n```html\n<header class=\"topbar\">\n  <closer-click-install></closer-click-install>\n</header>\n```\n\n```html\n<!-- vanilla -->\n<script type=\"module\" src=\".../@closerclick/closer-click-install/src/index.js\"></script>\n<closer-click-install lang=\"es\"></closer-click-install>\n```\n\nEl elemento se **oculta solo** (no ocupa espacio) cuando no hay forma de instalar\no la app ya está instalada. En Chromium muestra el botón cuando llega el prompt y\nlo dispara al hacer click. En iOS muestra el botón siempre (hasta que se instale)\ny al hacer click abre el modal con las instrucciones de *Compartir*.\n\n### Atributos\n\n| Atributo | Valores | Default |\n|---|---|---|\n| `lang` | `es` \\| `en` | `<html lang>` / navegador |\n| `label` | texto del botón | `Instalar` / `Install` |\n| `icon` | `false` para ocultar el icono | icono visible |\n\n### Estilo (custom properties)\n\n`--cc-install-color`, `--cc-install-bg`, `--cc-install-bg-hover`,\n`--cc-install-radius`, `--cc-install-pad`, `--cc-install-gap`,\n`--cc-install-font-size`, `--cc-install-icon`, `--cc-install-focus`,\n`--cc-install-accent` (acento del modal), `--cc-install-modal-bg`,\n`--cc-install-modal-color`.\n\nParts: `button`, `icon`, `label`, `modal`, `modal-card`.\n\n### Eventos\n\n- `cc-install` — cancelable, antes de actuar (`preventDefault()` para hacer lo tuyo).\n- `cc-install-result` — `detail.outcome`: `accepted` \\| `dismissed` \\| `instructions` \\| `installed`.\n\n## Uso programático\n\nPara apps que quieren su propio botón con la lógica compartida:\n\n```js\nimport { canInstall, promptInstall, onInstallStateChange, isIOS } from '@closerclick/closer-click-install'\n\nconst unsub = onInstallStateChange(() => { miBoton.hidden = !canInstall() })\nmiBoton.onclick = async () => {\n  const outcome = await promptInstall() // 'accepted' | 'dismissed' | 'instructions' | 'installed'\n  if (outcome === 'instructions') mostrarMisInstrucciones() // iOS / navegador sin soporte\n}\n```\n\nAPI: `isAppInstalled()`, `isIOS()`, `canInstall()`, `hasNativePrompt()`,\n`promptInstall()`, `onInstallStateChange(fn) → unsub`.\n\n### Composable Vue 3\n\n```js\nimport { useInstall } from '@closerclick/closer-click-install/vue'\nconst { canInstall, isInstalled, install } = useInstall()\n```\n```html\n<button v-if=\"canInstall\" @click=\"install\">Instalar</button>\n```\n\n> Para el botón ya hecho (con modal iOS incluido) usá el Web Component; el\n> composable es solo para botones a medida.\n\n## Test\n\n```sh\nnpm test   # Playwright contra Chromium: prompt nativo, appinstalled y rama iOS\n```\n\n## Licencia\n\nMIT\n","readmeFilename":"README.md"}