{"id":13659579,"url":"https://github.com/oskarkrawczyk/heyoffline","last_synced_at":"2025-12-12T03:32:32.081Z","repository":{"id":2470552,"uuid":"3443085","full_name":"oskarkrawczyk/heyoffline","owner":"oskarkrawczyk","description":"Warn your users when their network goes down. Make sure they don't lose anything.","archived":false,"fork":false,"pushed_at":"2022-12-06T05:47:16.000Z","size":573,"stargazers_count":1127,"open_issues_count":14,"forks_count":66,"subscribers_count":42,"default_branch":"master","last_synced_at":"2025-05-10T17:02:44.262Z","etag":null,"topics":["javascript","offline","vanilla"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/oskarkrawczyk.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2012-02-14T19:27:36.000Z","updated_at":"2025-04-22T10:02:55.000Z","dependencies_parsed_at":"2022-08-25T02:51:51.619Z","dependency_job_id":null,"html_url":"https://github.com/oskarkrawczyk/heyoffline","commit_stats":null,"previous_names":["oskarkrawczyk/heyoffline.js"],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oskarkrawczyk%2Fheyoffline","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oskarkrawczyk%2Fheyoffline/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oskarkrawczyk%2Fheyoffline/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oskarkrawczyk%2Fheyoffline/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/oskarkrawczyk","download_url":"https://codeload.github.com/oskarkrawczyk/heyoffline/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254459077,"owners_count":22074604,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["javascript","offline","vanilla"],"created_at":"2024-08-02T05:01:10.278Z","updated_at":"2025-12-12T03:32:27.039Z","avatar_url":"https://github.com/oskarkrawczyk.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# 🔌 Heyoffline\nNotify your users when their network goes down. Make sure they don't lose anything.\n\n## Features\n\n- Notify on general network outage\n- Notify only when users have unsaved form field states\n- Default, pretty generic, good looking styles\n\n![](https://user-images.githubusercontent.com/34213/83430658-520d1600-a436-11ea-89da-0b6035fdf818.gif)\n\n## Setup\n\n\n### Module\nNPM: [`heyoffline`](https://www.npmjs.com/package/heyoffline)\n\n```javascript\nimport Heyoffline from \"./dist/heyoffline.esm.js\"\nnew Heyoffline()\n```\n\n### Browser\nUNPKG: [`https://unpkg.com/heyoffline@latest/dist/heyoffline.umd.js`](https://unpkg.com/heyoffline@latest/dist/heyoffline.umd.js)\n\n```html\n\u003cscript src=\"dist/heyoffline.umd.js\"\u003e\u003c/script\u003e\n```\n\n```javascript\nnew Heyoffline({\n  monitorFields: true,\n  fields: \".monitoredFields\"\n});\n```\n\n## Options\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003cth class=\"name\"\u003eName\u003c/th\u003e\n    \u003cth class=\"type\"\u003eType\u003c/th\u003e\n    \u003cth class=\"default\"\u003eDefault\u003c/th\u003e\n    \u003cth class=\"desc\"\u003eDescription\u003c/th\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd\u003emonitorFields\u003c/td\u003e\n    \u003ctd\u003eboolean\u003c/td\u003e\n    \u003ctd\u003efalse\u003c/td\u003e\n    \u003ctd class=\"desc\"\u003eIf this option is enabled, message on network error will be shown only if a input/textarea/select/etc on the page was modified\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd\u003eprefix\u003c/td\u003e\n    \u003ctd\u003estring\u003c/td\u003e\n    \u003ctd\u003eheyoffline\u003c/td\u003e\n    \u003ctd class=\"desc\"\u003eClass prefix for generated elements\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd\u003enoStyles\u003c/td\u003e\n    \u003ctd\u003eboolean\u003c/td\u003e\n    \u003ctd\u003efalse\u003c/td\u003e\n    \u003ctd class=\"desc\"\u003eDon't use the default CSS (generated by JS)\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd\u003edisableDimiss\u003c/td\u003e\n    \u003ctd\u003eboolean\u003c/td\u003e\n    \u003ctd\u003efalse\u003c/td\u003e\n    \u003ctd class=\"desc\"\u003eBy default the user can dismiss the warning. With this option you can hide the dismiss button.\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd\u003efields\u003c/td\u003e\n    \u003ctd\u003estring\u003c/td\u003e\n    \u003ctd\u003e\u003ccode\u003e\"input, select, textarea, *[contenteditable]\"\u003c/code\u003e\u003c/td\u003e\n    \u003ctd class=\"desc\"\u003eField elements that will be monitored for changes - see \u003ccode\u003emonitorFields\u003c/code\u003e option.\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd\u003etext.offline.title\u003c/td\u003e\n    \u003ctd\u003estring\u003c/td\u003e\n    \u003ctd\u003eYou're currently offline\u003c/td\u003e\n    \u003ctd class=\"desc\"\u003eHeading of the modal window\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd\u003etext.offline.content\u003c/td\u003e\n    \u003ctd\u003estring\u003c/td\u003e\n    \u003ctd\u003eWait until your network comes back before continuing.\u003c/td\u003e\n    \u003ctd class=\"desc\"\u003eBody message of the modal window\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd\u003etext.offline.button\u003c/td\u003e\n    \u003ctd\u003estring\u003c/td\u003e\n    \u003ctd\u003eDismiss\u003c/td\u003e\n    \u003ctd class=\"desc\"\u003eDismissal button of the modal window\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd\u003etext.offline.icon\u003c/td\u003e\n    \u003ctd\u003estring\u003c/td\u003e\n    \u003ctd\u003eSVG icon\u003c/td\u003e\n    \u003ctd class=\"desc\"\u003eModal icon\u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\n## Events\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003cth class=\"name\"\u003eName\u003c/th\u003e\n    \u003cth class=\"type\"\u003eProvides\u003c/th\u003e\n    \u003cth class=\"desc\"\u003eDescription\u003c/th\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd\u003eonOnline\u003c/td\u003e\n    \u003ctd\u003e\u003c/td\u003e\n    \u003ctd\u003eFires then the network becomes available\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd\u003eonOffline\u003c/td\u003e\n    \u003ctd\u003e\u003c/td\u003e\n    \u003ctd\u003eFires when the network disappears\u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\n## Requirements\n**Heyoffline** is **framework-agnostic** vanilla JS.\n\n## Source code\nAll efforts have been made to keep the source as clean and readable as possible.\n\n## Requirements\nHeyoffline.js is released under an MIT License, so do with it what you will.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foskarkrawczyk%2Fheyoffline","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Foskarkrawczyk%2Fheyoffline","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foskarkrawczyk%2Fheyoffline/lists"}