@theoplayer/web-ui 1.7.0 → 1.7.2

package/CHANGELOG.md

@@ -10,6 +10,15 @@
 > -   🏠 Internal
 > -   💅 Polish
 
+## v1.7.2 (2024-03-18)
+
+-   🚀 Added `<theoplayer-slot-container>`. ([#55](https://github.com/THEOplayer/web-ui/pull/55))
+
+## v1.7.1 (2024-02-15)
+
+-   💅 Export `version` in public API. ([#53](https://github.com/THEOplayer/web-ui/pull/53))
+-   💅 Allow importing `@theoplayer/web-ui/package.json`. ([#53](https://github.com/THEOplayer/web-ui/pull/53))
+
 ## v1.7.0 (2024-02-15)
 
 -   🚀 Added support for loading in Node for static site generation (SSG) or server-side rendering (SSR). ([#50](https://github.com/THEOplayer/web-ui/pull/50))

package/README.md

@@ -1,5 +1,10 @@
 # THEOplayer Open Video UI for Web
 
+[![NPM version](https://img.shields.io/npm/v/%40theoplayer%2Fweb-ui)](https://www.npmjs.com/package/@theoplayer/web-ui)
+[![Build status](https://github.com/THEOplayer/web-ui/workflows/CI/badge.svg)](https://github.com/THEOplayer/web-ui/actions/workflows/ci.yml)
+[![API docs](https://img.shields.io/badge/api%20docs-orange.svg)](https://theoplayer.github.io/web-ui/api/)
+[![GitHub issues](https://img.shields.io/github/issues/THEOplayer/web-ui)](https://github.com/THEOplayer/web-ui/issues)
+
 A component library for building a world-class video player experience powered by
 the [THEOplayer Web SDK](https://www.theoplayer.com/product/theoplayer).
 
@@ -7,9 +12,6 @@ the [THEOplayer Web SDK](https://www.theoplayer.com/product/theoplayer).
 -   Built using [Web Components](https://developer.mozilla.org/en-US/docs/Web/Web_Components), so works great with (or without) any app framework.
 -   Easy to customize: use HTML to lay out your controls, and CSS to style them.
 
-> [!NOTE]  
-> This project is under active development. While we believe it's ready for use in production, not all features are available in this first release. If you find a problem or have an idea for a new feature, don't hesitate to [open an issue](https://github.com/THEOplayer/web-ui/issues)!
-
 | ![Screenshot on desktop](https://raw.githubusercontent.com/THEOplayer/web-ui/v1.0.0/docs/assets/screenshot-desktop.png) | ![Screenshot on mobile](https://raw.githubusercontent.com/THEOplayer/web-ui/v1.0.0/docs/assets/screenshot-mobile.png) |
 | :---------------------------------------------------------------------------------------------------------------------: | :-------------------------------------------------------------------------------------------------------------------: |
 |                                                         Desktop                                                         |                                                        Mobile                                                         |

package/dist/THEOplayerUI.d.ts

@@ -1,5 +1,5 @@
 /*!
- * THEOplayer Open Video UI for Web (v1.7.0)
+ * THEOplayer Open Video UI for Web (v1.7.2)
  * License: MIT
  */
 import { ChromelessPlayer, VideoQuality, THEOplayerError, MediaTrack, TextTrack, TextTracksList, EdgeStyle, VendorCast, CastState, PlayerConfiguration, SourceDescription } from 'theoplayer/chromeless';
@@ -1623,6 +1623,30 @@ declare global {
     }
 }
 
+/**
+ * `<theoplayer-slot-container>` - A container that can be assigned to a slot,
+ * and behaves as if all its children are directly assigned to that slot.
+ *
+ * This behaves approximately like a regular `<div>` with style `display: contents`,
+ * but receives some special treatment from e.g. {@link MenuGroup | `<theoplayer-menu-group>`}
+ * which normally expects its {@link Menu | menu}s to be slotted in as direct children.
+ * Those menus can also be children of a `<theoplayer-slot-container>` instead.
+ *
+ * This is an internal component, used mainly by Open Video UI for React.
+ * You shouldn't need this under normal circumstances.
+ *
+ * @group Components
+ * @internal
+ */
+declare class SlotContainer extends HTMLElement {
+    constructor();
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-slot-container': SlotContainer;
+    }
+}
+
 declare const AdDisplay_base: {
     new (): HTMLElement;
     prototype: HTMLElement;
@@ -1745,9 +1769,9 @@ declare const READY_EVENT: "theoplayerready";
  * ## Usage
  *
  * 1. Create a `<theoplayer-default-ui>` element.
- * 1. Set its `configuration` attribute or property to a valid player configuration.
- * 1. Set its `source` attribute or property to a valid stream source.
- * 1. Optionally, customize the player using CSS custom properties and/or extra controls.
+ * 2. Set its `configuration` attribute or property to a valid player configuration.
+ * 3. Set its `source` attribute or property to a valid stream source.
+ * 4. Optionally, customize the player using CSS custom properties and/or extra controls.
  *
  * ## Customization
  *
@@ -1911,10 +1935,10 @@ declare function registerExtension(extension: Extension): void;
  * ## Usage
  *
  * 1. Create a `<theoplayer-ui>` element.
- * 1. Place your UI elements as children of the `<theoplayer-ui>`.
+ * 2. Place your UI elements as children of the `<theoplayer-ui>`.
  *    Set their `slot` attribute to one of the defined slots (see below) to place them in the layout.
- * 1. Set its `configuration` attribute or property to a valid player configuration.
- * 1. Set its `source` attribute or property to a valid stream source.
+ * 3. Set its `configuration` attribute or property to a valid player configuration.
+ * 4. Set its `source` attribute or property to a valid stream source.
  *
  * ## Customization
  *
@@ -2135,5 +2159,10 @@ declare global {
     }
 }
 
-export { ActiveQualityDisplay, AdClickThroughButton, AdCountdown, AdDisplay, AdSkipButton, AirPlayButton, Attribute, Button, ButtonOptions, CastButton, ChromecastButton, ChromecastDisplay, CloseMenuButton, ColorStops, Constructor, ControlBar, DefaultUI, DeviceType, DurationDisplay, ErrorDisplay, Extension, ExtensionSlot, FullscreenButton, GestureReceiver, LanguageMenu, LanguageMenuButton, LinkButton, LiveButton, LoadingIndicator, MediaTrackRadioButton, Menu, MenuButton, MenuGroup, MenuGroupOptions, MenuOptions, MuteButton, PlayButton, PlaybackRateDisplay, PlaybackRateMenu, PlaybackRateMenuButton, PlaybackRateRadioGroup, PreviewThumbnail, PreviewTimeDisplay, QualityRadioButton, QualityRadioGroup, RadioButton, RadioGroup, Range, RangeOptions, SeekButton, SettingsMenu, SettingsMenuButton, StateReceiverElement, StateReceiverMixin, StateReceiverPropertyMap, StreamType, TextTrackOffRadioButton, TextTrackRadioButton, TextTrackStyleDisplay, TextTrackStyleMap, TextTrackStyleMenu, TextTrackStyleOption, TextTrackStyleRadioGroup, TextTrackStyleResetButton, TimeDisplay, TimeRange, TrackRadioGroup, TrackType, UIContainer, VolumeLevel, VolumeRange, buttonTemplate, linkButtonTemplate, menuGroupTemplate, menuTemplate, rangeTemplate, registerExtension };
+/**
+ * The version of Open Video UI for Web.
+ */
+declare const version: string;
+
+export { ActiveQualityDisplay, AdClickThroughButton, AdCountdown, AdDisplay, AdSkipButton, AirPlayButton, Attribute, Button, ButtonOptions, CastButton, ChromecastButton, ChromecastDisplay, CloseMenuButton, ColorStops, Constructor, ControlBar, DefaultUI, DeviceType, DurationDisplay, ErrorDisplay, Extension, ExtensionSlot, FullscreenButton, GestureReceiver, LanguageMenu, LanguageMenuButton, LinkButton, LiveButton, LoadingIndicator, MediaTrackRadioButton, Menu, MenuButton, MenuGroup, MenuGroupOptions, MenuOptions, MuteButton, PlayButton, PlaybackRateDisplay, PlaybackRateMenu, PlaybackRateMenuButton, PlaybackRateRadioGroup, PreviewThumbnail, PreviewTimeDisplay, QualityRadioButton, QualityRadioGroup, RadioButton, RadioGroup, Range, RangeOptions, SeekButton, SettingsMenu, SettingsMenuButton, SlotContainer, StateReceiverElement, StateReceiverMixin, StateReceiverPropertyMap, StreamType, TextTrackOffRadioButton, TextTrackRadioButton, TextTrackStyleDisplay, TextTrackStyleMap, TextTrackStyleMenu, TextTrackStyleOption, TextTrackStyleRadioGroup, TextTrackStyleResetButton, TimeDisplay, TimeRange, TrackRadioGroup, TrackType, UIContainer, VolumeLevel, VolumeRange, buttonTemplate, linkButtonTemplate, menuGroupTemplate, menuTemplate, rangeTemplate, registerExtension, version };
 export as namespace THEOplayerUI;