Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/juicy/enlighted-link
Custom element to use HTML Imports inside Shadow DOM
https://github.com/juicy/enlighted-link
Last synced: 11 days ago
JSON representation
Custom element to use HTML Imports inside Shadow DOM
- Host: GitHub
- URL: https://github.com/juicy/enlighted-link
- Owner: Juicy
- License: mit
- Created: 2018-04-24T17:25:25.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2020-03-29T12:35:04.000Z (over 4 years ago)
- Last Synced: 2024-04-14T00:29:54.735Z (7 months ago)
- Language: HTML
- Homepage: https://juicy.github.io/enlighted-link/
- Size: 22.5 KB
- Stars: 0
- Watchers: 5
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
# <enlighted-link>
> Custom element to enlighten your ``s from Shadow DOM to the Light.
By current spec [HTML Imports do not work in Shadow DOM](https://github.com/w3c/webcomponents/issues/628). That makes it hard to import definitions of custom elements that you use in a shadow root. This element allows you to do that. You could import your dependencies exactly where and when you need them.
## Demo
[Check it live!](http://Juicy.github.io/enlighted-link)
## Install
Install the component using [Bower](http://bower.io/):
```sh
$ bower install enlighted-link --save
```
Or [download as ZIP](https://github.com/Juicy/enlighted-link/archive/master.zip).
## Usage
1. Import polyfill:
```html
```
2. Import custom element:
```html
```
3. Start using it!
```html
#shadow-root
#/shadow-root
```
## Options
The element forwards [`link` element's content attributes](https://dev.w3.org/html5/spec-preview/the-link-element.html), to the eventually created `` in light DOM.
- href
- rel
- media
- hreflang
- type
- sizes
- title
## Properties
Property | Options | Default | Description
--- | --- | --- | ---
`link` | *HTMLLinkElement* | | The reference to created `` element. `null` if not yet created. Please note, that `link` element can be disconnected from document tree when `` is disconnected.
## Events
The element forwards following events from created ``:
- `load`,
- `error`
## [Contributing and Development](CONTRIBUTING.md)
## History
For detailed changelog, check [Releases](https://github.com/Juicy/enlighted-link/releases).
## License
MIT