{"id":15462914,"url":"https://github.com/valpackett/indieweb-components","last_synced_at":"2025-12-12T03:40:10.031Z","repository":{"id":35463274,"uuid":"39731149","full_name":"valpackett/indieweb-components","owner":"valpackett","description":"VanillaJS-based Web Components for the IndieWeb","archived":false,"fork":false,"pushed_at":"2017-05-27T17:00:59.000Z","size":277,"stargazers_count":13,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-11T21:43:45.365Z","etag":null,"topics":["fragmention","indie-action","indieweb","web-components"],"latest_commit_sha":null,"homepage":"https://myfreeweb.github.io/indieweb-components","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"isc","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/valpackett.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"COPYING","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-07-26T15:53:07.000Z","updated_at":"2023-08-15T18:34:53.000Z","dependencies_parsed_at":"2022-08-31T09:20:42.851Z","dependency_job_id":null,"html_url":"https://github.com/valpackett/indieweb-components","commit_stats":null,"previous_names":["myfreeweb/indieweb-components"],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valpackett%2Findieweb-components","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valpackett%2Findieweb-components/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valpackett%2Findieweb-components/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valpackett%2Findieweb-components/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/valpackett","download_url":"https://codeload.github.com/valpackett/indieweb-components/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250222275,"owners_count":21394847,"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":["fragmention","indie-action","indieweb","web-components"],"created_at":"2024-10-02T00:06:00.729Z","updated_at":"2025-12-12T03:40:10.002Z","avatar_url":"https://github.com/valpackett.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# indieweb-components\n\nSome [Web Components] for [IndieWeb] sites.\n\n[Web Components]: https://www.webcomponents.org\n[IndieWeb]: https://indieweb.org\n\n## [DEMO PAGE](https://myfreeweb.github.io/indieweb-components)\n\n## Installation\n\nUse npm or bower.\n\n```sh\n$ bower install --save indieweb-components webcomponents/webcomponentsjs#v1\n# or\n$ npm i indieweb-components @webcomponents/webcomponentsjs\n```\n\nLoad the polyfill:\n\n```html\n\u003cscript src=\"bower_components/webcomponentsjs/webcomponents-loader.js\"\u003e\u003c/script\u003e\n\u003c!-- or --\u003e\n\u003cscript src=\"node_modules/webcomponentsjs/webcomponents-loader.js\"\u003e\u003c/script\u003e\n```\n\nAnd use `\u003clink rel=\"import\"\u003e` for the components you want.\n\n(Alternatively, load only the Custom Elements polyfill and load the JS files, skipping HTML imports. Mind the findAndReplaceDOMText dependency in `fragmention-target`.)\n\n## Elements\n\n### indie-action\n\nAn implementation of the `indie-action` tag from [webactions](https://indieweb.org/webactions).\n\nFor users who have configured their posting tools with the [indie-config](http://indieweb.org/indie-config) protocol, the first `a` tag inside of the `indie-action` element will have its `href` replaced with the URL of the matching action.\n\nThe string `{url}` will be replaced in the `href` with the contents of the `with` attribute, resolved against the current domain.\nThe `indie-action` element also gets the `indie-configured` attribute when the config is loaded, so you can style the link differently from the fallback link using a selector like `[indie-configured] a`.\n\nThe config is loaded lazily now, when the user first clicks an indie-action link.\n\n```html\n\u003clink rel=\"import\" href=\"bower_components/indieweb-components/indie-action.html\"\u003e\n\n\u003cindie-action do=\"reply\" with=\"https://unrelenting.technology/notes/2015-07-03-12-48-01\"\u003e\n  \u003ca href=\"https://twitter.com/intent/reply?tweet_id=616951543720493057\"\u003eReply\u003c/a\u003e\n\u003c/indie-action\u003e\n```\n\nRequires Custom Elements, Custom Events and postMessage.  \nNo Shadow DOM -- the lite version of the [Web Components polyfill] is enough!\n\n### fragmention-target\n\nA custom element for displaying [fragmentions](https://indieweb.org/fragmention).\n\nIn addition to marking the element that contains the linked text with the `fragmention` attribute, it is also able to wrap the exact linked text in a `fragmention-exact` tag.\nTo enable this functionality, add the `exact` attribute.\n\n```html\n\u003clink rel=\"import\" href=\"bower_components/indieweb-components/fragmention-target.html\"\u003e\n\n\u003cstyle\u003e\n  [fragmention] { background: #F4BF75; }\n  fragmention-exact { background: #AB759F; }\n\u003c/style\u003e\n\n\u003cfragmention-target exact\u003e\n  \u003cp\u003eIntuitive share generate open-source intuitive 24/365 aggregate monetize peer-to-peer--matrix 24/365 transition rich-clientAPIs morph empower interactive. Syndicate action-items vertical; plug-and-play engage recontextualize, \"syndicate virtual data-driven e-markets, integrate synergies design extend,\" impactful productize standards-compliant sticky.\u003c/p\u003e\n  \u003cp\u003eExperiences clicks-and-mortar integrate experiences real-time functionalities capture--supply-chains long-tail niches semantic blogospheres evolve portals scalable e-commerce leverage bleeding-edge?\u003c/p\u003e\n  \u003cp\u003eExtensible target grow ecologies leading-edge create, frictionless next-generation A-list incubate. Vertical: reinvent seize interactive compelling post; syndicate granular systems drive impactful tag evolve strategize seamless.\u003c/p\u003e\n  \u003cp\u003eCultivate--compelling integrateAJAX-enabled grow monetize synergies, rich innovative extend. Innovative; incentivize dynamic capture transition relationships, semantic create sticky, \"facilitate optimize; share semantic impactful recontextualize e-services: next-generation bandwidth,\" leading-edge.\u003c/p\u003e\n\u003c/fragmention-target\u003e\n```\n\nRequires Custom Elements.  \nNo Shadow DOM -- the lite version of the [Web Components polyfill] is enough!\n\n## Contributing\n\nPlease feel free to submit pull requests!\nBugfixes and simple non-breaking improvements will be accepted without any questions :-)\n\nBy participating in this project you agree to follow the [Contributor Code of Conduct](http://contributor-covenant.org/version/1/4/).\n\n## License\n\nCopyright 2015-2017 Greg V \u003cgreg@unrelenting.technology\u003e  \nAvailable under the ISC license, see the `COPYING` file\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvalpackett%2Findieweb-components","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvalpackett%2Findieweb-components","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvalpackett%2Findieweb-components/lists"}