v1.6.0

What's New

• feat(slot): added image named slot for poster overrides by @justinribeiro in #107
• feat(aspect-ratio): add css custom prop for changing aspect ratio of container by @justinribeiro in #108
• feat(frame-shadow): add ability to toggle frame::before shadow by @justinribeiro in #111
• feat(auto-pause): adds autopause attribute for pausing videos off screen by @justinribeiro in #112
• feat(iframe): adds credentialless attribute for COEP by @justinribeiro in #113

What's Fixed

• fix: resolve dead case path, add observe and coverage by @justinribeiro in #95
• fix(101): split warm connection when nocookie in use by @justinribeiro in #106

Full Changelog: v1.5.0...v1.6.0

v1.5.0

What's Changed

• feat(csp): add support for csp style nonce by @justinribeiro in #68
• fix(preload): prevent multiple rules in multi-instance scenario by @justinribeiro in #69
• Document fallback with example styles by @mrwweb in #73
• Improved Accesibility by @ru-ka in #74
• fix: Make the package a valid ES module by @ridem in #76
• Use official youtube logo by @neilitalia in #82

New Contributors

• @mrwweb made their first contribution in #73
• @ru-ka made their first contribution in #74
• @ridem made their first contribution in #76
• @neilitalia made their first contribution in #82

Full Changelog: v1.4.0...v1.5.0

v1.4.0

What's Changed

• feat(core): add YouTube Shorts-style mobile embed interaction by @justinribeiro in #67

Full Changelog: v1.3.2...v1.4.0

v1.3.2

What's Changed

• chore(deps): bump nanoid from 3.1.30 to 3.2.0 by @dependabot in #50
• Add lazy loading to the placeholder image by @slightlyoff in #65
• fix play button cursor type by @neon-dev in #63

New Contributors

• @slightlyoff made their first contribution in #65
• @neon-dev made their first contribution in #63

Full Changelog: v1.3.1...v1.3.2

v1.3.1

What's Changed

• fix(css): placeholder position with different text-align by @anatolykopyl in #44

New Contributors

• @anatolykopyl made their first contribution in #44

Full Changelog: v1.3.0...v1.3.1

v1.3.0

• Adds loading=lazy to image placeholder for more perf with posterloading attr if you'd like to use eager

v1.2.0

Adds:

• playlistid param for use with a youtube playlist id. Note, you must give a videoid as well, otherwise no thumbnail will load (playlists don't serve a thumbnail).

Example:

<lite-youtube videoid="VLrYOji75Vc" playlistid="G5r6j4GptH5JTveoLTVqpp7w2oc27Q9"></lite-youtube>

On interaction, loads the playlist interface.

playlist-support-lite-youtube.mp4

v1.1.0

Adds:

• nocookie param for use youtube-nocookie.com as iframe embed uri
• liteYoutubeIframeLoaded custom event for knowing when iframe is loaded

v1.0.0

Install

This web component is built with ES modules in mind and is
available on NPM:

npm i @justinribeiro/lite-youtube
# or
yarn add @justinribeiro/lite-youtube

Install with CDN

If you want the paste-and-go version, you can simply load it via CDN:

<script type="module" src="https://cdn.jsdelivr.net/npm/@justinribeiro/[email protected]/lite-youtube.js"></script>