@videojs/html 10.0.0-beta.21 → 10.0.0-beta.22

package/cdn/audio-minimal-ui.dev.js

@@ -1,4 +1,4 @@
-import "./compounds-CM_NP-ej.js";
+import "./compounds-DD3MYkSc.js";
 import "./context-0rI_P6jf.js";
-import "./player-xstFHOgW.js";
-import "./minimal-ui-DhxN21v5.js";
+import "./player-BVGWmIbQ.js";
+import "./minimal-ui-CE1sVxKB.js";

package/cdn/audio-minimal-ui.js

@@ -1 +1 @@
-import"./compounds-Vvz-YfXP.js";import"./context-CEFisYD0.js";import"./player-BK35-ndY.js";import"./minimal-ui-CroDYUGf.js";
+import"./compounds-CCgS3IGo.js";import"./context-CEFisYD0.js";import"./player-ChdQN3H5.js";import"./minimal-ui-hC8-_9_F.js";

package/cdn/audio-minimal.dev.js

@@ -1,10 +1,10 @@
-import "./compounds-CM_NP-ej.js";
+import "./compounds-DD3MYkSc.js";
 import { n as createShadowStyle } from "./shadow-styles-DKXFMmyD.js";
-import { n as createTemplate, t as SkinElement } from "./skin-element-CDUkmCtS.js";
+import { n as createTemplate, t as SkinElement } from "./skin-element-D3iVinGP.js";
 import { o as safeDefine } from "./context-0rI_P6jf.js";
-import { t as renderIcon } from "./minimal-BnDnlwbj.js";
-import "./player-xstFHOgW.js";
-import "./minimal-ui-DhxN21v5.js";
+import { t as renderIcon } from "./minimal-AX_y2YBU.js";
+import "./player-BVGWmIbQ.js";
+import "./minimal-ui-CE1sVxKB.js";
 
 //#region inline-css:src/define/audio/minimal-skin.js
 var minimal_skin_default = "/* -------------------------------------------------------------------------- */\n/* Base                                                                       */\n/* -------------------------------------------------------------------------- */\n\nvideo-player {\n  display: contents;\n}\n\n/*\nRequired to override any default video and image styles (such as\nTailwind's CSS reset) and ensure they fill the container as expected.\n*/\nvideo-player video,\nvideo-player [slot=\"poster\"] {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\nvideo-player video::-webkit-media-text-track-container {\n  transition: translate var(--media-caption-track-duration, 0) ease-out;\n  transition-delay: var(--media-caption-track-delay, 0);\n  translate: 0 var(--media-caption-track-y, 0);\n  scale: 0.98;\n  z-index: 1;\n  font-family: inherit;\n}\n\nmedia-tooltip-group {\n  display: contents;\n}\n\n:host {\n  /* `display:grid` fixes a weird issue with Safari when setting aspect-ratio */\n  display: grid;\n  width: 100%;\n}\n\n/* Hide volume popover when volume control is unsupported (e.g., iOS Safari). */\n.media-popover--volume:has(media-volume-slider[data-availability=\"unsupported\"]) {\n  display: none;\n}\n\n/* ==========================================================================\n   Reset\n   ========================================================================== */\n\n.media-minimal-skin *,\n.media-minimal-skin *::before,\n.media-minimal-skin *::after {\n  box-sizing: border-box;\n}\n.media-minimal-skin img,\n.media-minimal-skin video,\n.media-minimal-skin svg {\n  display: block;\n  max-width: 100%;\n}\n.media-minimal-skin button {\n  font: inherit;\n}\n@media (prefers-reduced-motion: no-preference) {\n  .media-minimal-skin {\n    interpolate-size: allow-keywords;\n  }\n}\n\n/* ==========================================================================\n   Root Container\n   ========================================================================== */\n\n.media-minimal-skin {\n  container: media-root / inline-size;\n  position: relative;\n  isolation: isolate;\n  display: block;\n  height: 100%;\n  width: 100%;\n  border-radius: var(--media-border-radius, 0.75rem);\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n\n  &:focus-visible {\n    outline-color: currentColor;\n  }\n  font-family:\n    Inter Variable,\n    Inter,\n    ui-sans-serif,\n    system-ui,\n    sans-serif;\n  line-height: 1.5;\n  letter-spacing: normal;\n  -webkit-font-smoothing: auto;\n  -moz-osx-font-smoothing: auto;\n\n  & > * {\n    font-size: 0.75rem; /* 12px at 100% font size */\n  }\n\n  @container media-root (width > 48rem) {\n    & > * {\n      font-size: 0.875rem; /* 14px at 100% font size */\n    }\n  }\n}\n\n/* ==========================================================================\n   Buffering Indicator\n   ========================================================================== */\n\n.media-minimal-skin .media-buffering-indicator {\n  position: absolute;\n  inset: 0;\n  display: none;\n  align-items: center;\n  justify-content: center;\n  color: oklch(1 0 0);\n  pointer-events: none;\n\n  &[data-visible] {\n    display: flex;\n  }\n}\n\n/* ==========================================================================\n   Error Dialog\n   ========================================================================== */\n\n.media-minimal-skin .media-error:not([data-open]) {\n  display: none;\n}\n\n.media-minimal-skin .media-error__title {\n  font-weight: 600;\n  line-height: 1.25;\n}\n\n.media-minimal-skin .media-error__description {\n  opacity: 0.7;\n  overflow-wrap: anywhere;\n}\n\n.media-minimal-skin .media-error__actions {\n  display: flex;\n  gap: 0.5rem;\n\n  & > * {\n    flex: 1;\n  }\n}\n\n.media-minimal-skin .media-error[data-open] ~ .media-controls * {\n  visibility: hidden;\n}\n\n/* ==========================================================================\n   Controls\n   ========================================================================== */\n\n.media-minimal-skin .media-controls {\n  container: media-controls / inline-size;\n  display: flex;\n  align-items: center;\n  --media-controls-current-shadow-color: oklch(from currentColor 0 0 0 / clamp(0, calc((l - 0.5) * 0.5), 0.15));\n  --media-controls-current-shadow-color-subtle: oklch(\n    from var(--media-controls-current-shadow-color) l c h /\n    calc(alpha * 0.4)\n  );\n  background-color: var(--media-controls-background-color);\n  backdrop-filter: var(--media-controls-backdrop-filter);\n  text-shadow: 0 1px 0 var(--media-controls-current-shadow-color);\n}\n\n/* ==========================================================================\n   Time Controls & Display\n   ========================================================================== */\n\n.media-minimal-skin .media-time-controls {\n  container: media-time-controls / inline-size;\n  display: flex;\n  flex-direction: row-reverse;\n  align-items: center;\n  flex: 1;\n  gap: 0.75rem;\n}\n\n.media-minimal-skin .media-time-group {\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.media-minimal-skin .media-time {\n  font-variant-numeric: tabular-nums;\n}\n\n.media-minimal-skin .media-time--current,\n.media-minimal-skin .media-time-separator {\n  display: none;\n}\n\n@container media-root (width > 42rem) {\n  .media-minimal-skin .media-time-controls {\n    flex-direction: row;\n  }\n\n  .media-minimal-skin .media-time--duration,\n  .media-minimal-skin .media-time-separator {\n    color: oklch(from currentColor l c h / 0.6);\n  }\n\n  .media-minimal-skin .media-time--current,\n  .media-minimal-skin .media-time-separator {\n    display: inline;\n  }\n}\n\n/* ==========================================================================\n   Buttons\n   ========================================================================== */\n\n/* Base button */\n.media-minimal-skin .media-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  padding: 0.5rem 1rem;\n  border: none;\n  border-radius: 0.5rem;\n  outline: 2px solid transparent;\n  outline-offset: -2px;\n  transition-property: background-color, outline-offset, scale;\n  /* Fix weird jumping when clicking on the buttons in Safari. */\n  will-change: scale;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n  cursor: pointer;\n  user-select: none;\n  text-align: center;\n  touch-action: manipulation;\n\n  &:focus-visible {\n    outline-color: currentColor;\n    outline-offset: 2px;\n  }\n\n  &:active {\n    scale: 0.98;\n  }\n\n  &[disabled] {\n    opacity: 0.5;\n    filter: grayscale(1);\n    cursor: not-allowed;\n  }\n\n  &[data-availability=\"unavailable\"] {\n    display: none;\n  }\n}\n\n/* biome-ignore lint/correctness/noUnknownProperty: corner-shape is an emerging CSS spec */\n@supports (corner-shape: squircle) {\n  .media-minimal-skin .media-button {\n    border-radius: 1rem;\n    /* biome-ignore lint/correctness/noUnknownProperty: corner-shape is an emerging CSS spec */\n    corner-shape: squircle;\n  }\n}\n\n/* Primary button variant */\n.media-minimal-skin .media-button--primary {\n  background: oklch(1 0 0);\n  color: oklch(0 0 0);\n  font-weight: 500;\n  text-shadow: none;\n}\n\n/* Subtle button variant */\n.media-minimal-skin .media-button--subtle {\n  background: transparent;\n  color: inherit;\n  text-shadow: inherit;\n\n  &:hover,\n  &:focus-visible,\n  &[aria-expanded=\"true\"] {\n    background: oklch(from currentColor l c h / 0.1);\n  }\n}\n\n/* Icon button variant */\n.media-minimal-skin .media-button--icon {\n  display: grid;\n  width: 2.375rem;\n  padding: 0;\n  aspect-ratio: 1;\n\n  &:active {\n    scale: 0.9;\n  }\n\n  & .media-icon {\n    filter: drop-shadow(0 1px 0 var(--media-controls-current-shadow-color, oklch(0 0 0 / 0.25)));\n  }\n}\n\n/* Seek button */\n.media-minimal-skin .media-button--seek {\n  & .media-icon__label {\n    position: absolute;\n    right: -1px;\n    bottom: -3px;\n    font-size: 10px; /* Hard coded due to size limitations. */\n    font-weight: 480;\n    font-variant-numeric: tabular-nums;\n  }\n\n  &:has(.media-icon--flipped) .media-icon__label {\n    right: unset;\n    left: -1px;\n  }\n}\n\n/* Playback rate button */\n.media-minimal-skin .media-button--playback-rate {\n  padding: 0;\n\n  &::after {\n    content: attr(data-rate) \"\\00D7\";\n    width: 4ch;\n    font-variant-numeric: tabular-nums;\n  }\n}\n\n/* ==========================================================================\n   Button Groups\n   ========================================================================== */\n\n.media-minimal-skin .media-button-group {\n  display: flex;\n  align-items: center;\n  gap: 0.075rem;\n\n  @container media-root (width > 42rem) {\n    gap: 0.125rem;\n  }\n}\n\n/* ==========================================================================\n   Icons\n   ========================================================================== */\n\n.media-minimal-skin .media-icon__container {\n  position: relative;\n}\n.media-minimal-skin .media-icon {\n  display: block;\n  flex-shrink: 0;\n  grid-area: 1 / 1;\n  width: 18px;\n  height: 18px;\n  transition-behavior: allow-discrete;\n  transition-property: display, opacity;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n}\n.media-minimal-skin .media-icon--flipped {\n  scale: -1 1;\n}\n\n/* ==========================================================================\n   Slider\n   ========================================================================== */\n\n.media-minimal-skin .media-slider {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 1;\n  border-radius: calc(infinity * 1px);\n  outline: none;\n  cursor: pointer;\n\n  &[data-orientation=\"horizontal\"] {\n    min-width: 5rem;\n    width: 100%;\n    height: 2rem;\n  }\n\n  &[data-orientation=\"vertical\"] {\n    width: 2rem;\n    height: 4.5rem;\n  }\n}\n\n/* Track */\n.media-minimal-skin .media-slider__track {\n  position: relative;\n  isolation: isolate;\n  overflow: hidden;\n  border-radius: inherit;\n  user-select: none;\n  background-color: oklch(from currentColor l c h / 0.2);\n\n  &[data-orientation=\"horizontal\"] {\n    width: 100%;\n    height: 0.1875rem;\n  }\n\n  &[data-orientation=\"vertical\"] {\n    width: 0.1875rem;\n    height: 100%;\n  }\n}\n\n/* Thumb */\n.media-minimal-skin .media-slider__thumb {\n  position: absolute;\n  translate: -50% -50%;\n  z-index: 10;\n  width: 0.75rem;\n  height: 0.75rem;\n  background-color: currentColor;\n  border-radius: calc(infinity * 1px);\n  box-shadow:\n    0 0 0 1px var(--media-controls-current-shadow-color-subtle, oklch(0 0 0 / 0.1)),\n    0 1px 3px 0 oklch(0 0 0 / 0.15),\n    0 1px 2px -1px oklch(0 0 0 / 0.15);\n  opacity: 0;\n  scale: 0.7;\n  transform-origin: center;\n  transition-property: opacity, scale, outline-offset;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n  user-select: none;\n  outline: 2px solid transparent;\n  outline-offset: -2px;\n\n  &[data-orientation=\"horizontal\"] {\n    top: 50%;\n    left: var(--media-slider-fill);\n  }\n\n  &[data-orientation=\"vertical\"] {\n    left: 50%;\n    top: calc(100% - var(--media-slider-fill));\n  }\n\n  &:focus-visible {\n    outline-color: currentColor;\n    outline-offset: 2px;\n  }\n}\n\n.media-minimal-skin .media-slider:hover .media-slider__thumb,\n.media-minimal-skin .media-slider:focus-within .media-slider__thumb,\n.media-minimal-skin .media-slider__thumb--persistent {\n  opacity: 1;\n  scale: 1;\n}\n\n/* Shared track fills */\n.media-minimal-skin .media-slider__buffer,\n.media-minimal-skin .media-slider__fill {\n  position: absolute;\n  border-radius: inherit;\n  pointer-events: none;\n}\n\n.media-minimal-skin .media-slider__buffer[data-orientation=\"horizontal\"],\n.media-minimal-skin .media-slider__fill[data-orientation=\"horizontal\"] {\n  inset-block: 0;\n  left: 0;\n}\n\n.media-minimal-skin .media-slider__buffer[data-orientation=\"vertical\"],\n.media-minimal-skin .media-slider__fill[data-orientation=\"vertical\"] {\n  inset-inline: 0;\n  bottom: 0;\n}\n\n/* Buffer */\n.media-minimal-skin .media-slider__buffer {\n  background-color: oklch(from currentColor l c h / 0.2);\n  transition-duration: 0.25s;\n  transition-timing-function: ease-out;\n\n  &[data-orientation=\"horizontal\"] {\n    width: var(--media-slider-buffer);\n    transition-property: width;\n  }\n\n  &[data-orientation=\"vertical\"] {\n    height: var(--media-slider-buffer);\n    transition-property: height;\n  }\n}\n\n/* Fill */\n.media-minimal-skin .media-slider__fill {\n  background-color: currentColor;\n\n  &[data-orientation=\"horizontal\"] {\n    width: var(--media-slider-fill);\n  }\n\n  &[data-orientation=\"vertical\"] {\n    height: var(--media-slider-fill);\n  }\n}\n\n/* Dragging — thumb and fill follow the pointer position */\n.media-minimal-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=\"horizontal\"] {\n  left: var(--media-slider-pointer);\n}\n\n.media-minimal-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=\"vertical\"] {\n  top: calc(100% - var(--media-slider-pointer));\n}\n\n.media-minimal-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=\"horizontal\"] {\n  width: var(--media-slider-pointer);\n}\n\n.media-minimal-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=\"vertical\"] {\n  height: var(--media-slider-pointer);\n}\n\n/* ==========================================================================\n   Popups & Animations\n   ========================================================================== */\n\n.media-minimal-skin .media-popover,\n.media-minimal-skin .media-tooltip {\n  margin: 0;\n  border: 0;\n  color: inherit;\n  overflow: visible;\n  transition-property: scale, opacity, filter;\n  transition-duration: var(--media-popup-transition-duration);\n  transition-timing-function: var(--media-popup-transition-timing-function);\n\n  &[data-starting-style],\n  &[data-ending-style] {\n    opacity: 0;\n    scale: 0.5;\n    filter: blur(8px);\n  }\n\n  &[data-instant] {\n    transition-duration: 0ms;\n  }\n\n  &[data-side=\"top\"] {\n    transform-origin: bottom;\n  }\n  &[data-side=\"bottom\"] {\n    transform-origin: top;\n  }\n  &[data-side=\"left\"] {\n    transform-origin: right;\n  }\n  &[data-side=\"right\"] {\n    transform-origin: left;\n  }\n\n  /* Safe area between trigger and popup */\n  &::before {\n    content: \"\";\n    position: absolute;\n    pointer-events: inherit;\n  }\n\n  &[data-side=\"top\"]::before,\n  &[data-side=\"bottom\"]::before {\n    width: 100%;\n    inset-inline: 0;\n  }\n  &[data-side=\"top\"]::before {\n    top: 100%;\n  }\n  &[data-side=\"bottom\"]::before {\n    bottom: 100%;\n  }\n\n  &[data-side=\"left\"]::before,\n  &[data-side=\"right\"]::before {\n    height: 100%;\n    inset-block: 0;\n  }\n  &[data-side=\"left\"]::before {\n    left: 100%;\n  }\n  &[data-side=\"right\"]::before {\n    right: 100%;\n  }\n}\n\n.media-minimal-skin .media-popover {\n  &[data-side=\"top\"]::before,\n  &[data-side=\"bottom\"]::before {\n    height: var(--media-popover-side-offset);\n  }\n  &[data-side=\"left\"]::before,\n  &[data-side=\"right\"]::before {\n    width: var(--media-popover-side-offset);\n  }\n}\n\n.media-minimal-skin .media-tooltip {\n  padding: 0.25rem 0.5rem;\n  border-radius: 0.5rem;\n  background-color: var(--media-tooltip-background-color);\n  backdrop-filter: var(--media-tooltip-backdrop-filter);\n  box-shadow:\n    0 0 0 1px var(--media-tooltip-border-color),\n    0 4px 6px -1px oklch(0 0 0 / 0.1),\n    0 2px 4px -2px oklch(0 0 0 / 0.1);\n  color: var(--media-tooltip-text-color);\n  font-size: 0.75rem; /* 12px at 100% font size */\n  white-space: nowrap;\n\n  &[data-side=\"top\"]::before,\n  &[data-side=\"bottom\"]::before {\n    height: var(--media-tooltip-side-offset);\n  }\n  &[data-side=\"left\"]::before,\n  &[data-side=\"right\"]::before {\n    width: var(--media-tooltip-side-offset);\n  }\n}\n\n.media-minimal-skin .media-popover--volume:has(media-volume-slider[data-availability=\"unsupported\"]) {\n  display: none;\n}\n\n/* ==========================================================================\n   Icon State Visibility for Audio Skins\n\n   Data-attribute-driven visibility rules for multi-state icon buttons.\n   Uses :is() with both element selectors (for HTML custom element wrappers)\n   and class selectors (for React rendered SVG elements).\n   ========================================================================== */\n\n/* --- All icons hidden by default --- */\n\n.media-button--play .media-icon--restart,\n.media-button--play .media-icon--play,\n.media-button--play .media-icon--pause,\n.media-button--mute .media-icon--volume-off,\n.media-button--mute .media-icon--volume-low,\n.media-button--mute .media-icon--volume-high {\n  display: none;\n  opacity: 0;\n}\n\n/* --- Active icon per state --- */\n\n/* Play: ended → restart */\n.media-button--play[data-ended] .media-icon--restart,\n/* Play: paused (not ended) → play */\n.media-button--play:not([data-ended])[data-paused] .media-icon--play,\n/* Play: playing (not paused, not ended) → pause */\n.media-button--play:not([data-paused]):not([data-ended]) .media-icon--pause,\n/* Mute: muted → volume off */\n.media-button--mute[data-muted] .media-icon--volume-off,\n/* Mute: volume low (not muted) → volume low */\n.media-button--mute:not([data-muted])[data-volume-level=\"low\"] .media-icon--volume-low,\n/* Mute: volume high (not muted, not low) → volume high */\n.media-button--mute:not([data-muted]):not([data-volume-level=\"low\"]) .media-icon--volume-high {\n  display: block;\n  opacity: 1;\n}\n\n\n/* ==========================================================================\n  Root\n  ========================================================================== */\n\n.media-minimal-skin--audio {\n  --media-controls-background-color: oklch(1 0 0);\n  --media-controls-backdrop-filter: blur(16px) saturate(1.5);\n  --media-controls-border-color: oklch(0 0 0 / 0.05);\n  --media-controls-text-color: var(--media-color-primary, oklch(0 0 0));\n  --media-error-dialog-transition-duration: 250ms;\n  --media-error-dialog-transition-delay: 100ms;\n  --media-popup-transition-duration: 100ms;\n  --media-popup-transition-timing-function: ease-out;\n  --media-tooltip-background-color: oklch(1 0 0 / 0.1);\n  --media-tooltip-border-color: oklch(0 0 0 / 0.05);\n  --media-tooltip-backdrop-filter: blur(16px) saturate(1.5);\n  --media-tooltip-text-color: currentColor;\n  --media-tooltip-side-offset: 0.75rem;\n  --media-popover-side-offset: 0.75rem;\n\n  @media (prefers-reduced-motion: reduce) {\n    --media-error-dialog-transition-duration: 50ms;\n    --media-error-dialog-transition-delay: 0ms;\n    --media-popup-transition-duration: 0ms;\n  }\n\n  @media (prefers-color-scheme: dark) {\n    --media-controls-background-color: oklch(0 0 0);\n    --media-controls-border-color: oklch(1 0 0 / 0.1);\n    --media-controls-text-color: var(--media-color-primary, oklch(1 0 0));\n  }\n\n  @media (prefers-reduced-transparency: reduce) or (prefers-contrast: more) {\n    --media-tooltip-background-color: oklch(1 0 0);\n  }\n\n  @media (prefers-color-scheme: dark) and ((prefers-reduced-transparency: reduce) or (prefers-contrast: more)) {\n    --media-tooltip-background-color: oklch(0 0 0);\n  }\n}\n\n/* ==========================================================================\n   Error Dialog\n   ========================================================================== */\n\n.media-minimal-skin--audio .media-error__dialog {\n  position: absolute;\n  inset: 0;\n  z-index: 20;\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n  padding-inline: 1.25rem 0.5rem;\n  transition-property: opacity, filter, scale;\n  transition-duration: var(--media-error-dialog-transition-duration);\n  transition-delay: var(--media-error-dialog-transition-delay);\n  transition-timing-function: ease-out;\n  border-radius: calc(infinity * 1px);\n  background-color: oklch(from var(--media-controls-background-color) l c h / 1);\n}\n\n.media-minimal-skin--audio .media-error[data-starting-style] .media-error__dialog,\n.media-minimal-skin--audio .media-error[data-ending-style] .media-error__dialog {\n  opacity: 0;\n  filter: blur(4px);\n  scale: 0.95;\n}\n.media-minimal-skin--audio .media-error[data-ending-style] .media-error__dialog {\n  transition-delay: 0ms;\n}\n\n.media-minimal-skin--audio .media-error__content {\n  flex: 1;\n  display: flex;\n  gap: 0.5rem;\n  align-items: center;\n}\n\n/* ==========================================================================\n  Controls\n  ========================================================================== */\n\n.media-minimal-skin--audio .media-controls {\n  padding: 0.375rem;\n  gap: 0.5rem;\n  color: var(--media-controls-text-color);\n  box-shadow: 0 0 0 1px var(--media-controls-border-color);\n  border-radius: var(--media-border-radius, 1rem);\n}\n\n/* ==========================================================================\n   Popups & Animations\n   ========================================================================== */\n\n.media-minimal-skin--audio .media-popover--volume {\n  background: linear-gradient(to left, var(--media-controls-background-color) 80%, transparent 100%);\n  padding: 0 0 0 4rem;\n}\n\n";

package/cdn/audio-minimal.js

@@ -1,2 +1,2 @@
-import"./compounds-Vvz-YfXP.js";import{n as e}from"./shadow-styles-BYZ6q3Q4.js";import{n as t,t as n}from"./skin-element-BGP23sop.js";import{o as r}from"./context-CEFisYD0.js";import{t as i}from"./minimal-CqBxBoLe.js";import"./player-BK35-ndY.js";import"./minimal-ui-CroDYUGf.js";var a=`video-player{display:contents}video-player video,video-player [slot=poster]{width:100%;height:100%;display:block}video-player video::-webkit-media-text-track-container{transition:translate var(--media-caption-track-duration,0) ease-out;transition-delay:var(--media-caption-track-delay,0);translate:0 var(--media-caption-track-y,0);z-index:1;font-family:inherit;scale:.98}media-tooltip-group{display:contents}:host{width:100%;display:grid}.media-popover--volume:has(media-volume-slider[data-availability=unsupported]){display:none}.media-minimal-skin *,.media-minimal-skin :before,.media-minimal-skin :after{box-sizing:border-box}.media-minimal-skin img,.media-minimal-skin video,.media-minimal-skin svg{max-width:100%;display:block}.media-minimal-skin button{font:inherit}@media (prefers-reduced-motion:no-preference){.media-minimal-skin{interpolate-size:allow-keywords}}.media-minimal-skin{isolation:isolate;border-radius:var(--media-border-radius,.75rem);outline-offset:2px;outline:2px solid #0000;width:100%;height:100%;display:block;position:relative;container:media-root/inline-size;&:focus-visible{outline-color:currentColor}letter-spacing:normal;-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;font-family:Inter Variable,Inter,ui-sans-serif,system-ui,sans-serif;line-height:1.5;&>*{font-size:.75rem}@container media-root (width>48rem){&>*{font-size:.875rem}}}.media-minimal-skin .media-buffering-indicator{color:oklch(100% 0 0);pointer-events:none;justify-content:center;align-items:center;display:none;position:absolute;inset:0;&[data-visible]{display:flex}}.media-minimal-skin .media-error:not([data-open]){display:none}.media-minimal-skin .media-error__title{font-weight:600;line-height:1.25}.media-minimal-skin .media-error__description{opacity:.7;overflow-wrap:anywhere}.media-minimal-skin .media-error__actions{gap:.5rem;display:flex;&>*{flex:1}}.media-minimal-skin .media-error[data-open]~.media-controls *{visibility:hidden}.media-minimal-skin .media-controls{--media-controls-current-shadow-color:oklch(from currentColor 0 0 0 / clamp(0, calc((l - .5) * .5), .15));--media-controls-current-shadow-color-subtle:oklch(from var(--media-controls-current-shadow-color) l c h / calc(alpha * .4));background-color:var(--media-controls-background-color);backdrop-filter:var(--media-controls-backdrop-filter);text-shadow:0 1px 0 var(--media-controls-current-shadow-color);align-items:center;display:flex;container:media-controls/inline-size}.media-minimal-skin .media-time-controls{flex-direction:row-reverse;flex:1;align-items:center;gap:.75rem;display:flex;container:media-time-controls/inline-size}.media-minimal-skin .media-time-group{align-items:center;gap:.25rem;display:flex}.media-minimal-skin .media-time{font-variant-numeric:tabular-nums}.media-minimal-skin .media-time--current,.media-minimal-skin .media-time-separator{display:none}@container media-root (width>42rem){.media-minimal-skin .media-time-controls{flex-direction:row}.media-minimal-skin .media-time--duration,.media-minimal-skin .media-time-separator{color:oklch(from currentColor l c h / .6)}.media-minimal-skin .media-time--current,.media-minimal-skin .media-time-separator{display:inline}}.media-minimal-skin .media-button{outline-offset:-2px;will-change:scale;cursor:pointer;user-select:none;text-align:center;touch-action:manipulation;border:none;border-radius:.5rem;outline:2px solid #0000;flex-shrink:0;justify-content:center;align-items:center;padding:.5rem 1rem;transition-property:background-color,outline-offset,scale;transition-duration:.15s;transition-timing-function:ease-out;display:flex;&:focus-visible{outline-offset:2px;outline-color:currentColor}&:active{scale:.98}&[disabled]{opacity:.5;filter:grayscale();cursor:not-allowed}&[data-availability=unavailable]{display:none}}@supports (corner-shape:squircle){.media-minimal-skin .media-button{corner-shape:squircle;border-radius:1rem}}.media-minimal-skin .media-button--primary{color:oklch(0% 0 0);text-shadow:none;background:oklch(100% 0 0);font-weight:500}.media-minimal-skin .media-button--subtle{color:inherit;text-shadow:inherit;background:0 0;&:hover,&:focus-visible,&[aria-expanded=true]{background:oklch(from currentColor l c h / .1)}}.media-minimal-skin .media-button--icon{aspect-ratio:1;width:2.375rem;padding:0;display:grid;&:active{scale:.9}& .media-icon{filter:drop-shadow(0 1px 0 var(--media-controls-current-shadow-color,oklch(0% 0 0/.25)))}}.media-minimal-skin .media-button--seek{& .media-icon__label{font-variant-numeric:tabular-nums;font-size:10px;font-weight:480;position:absolute;bottom:-3px;right:-1px}&:has(.media-icon--flipped) .media-icon__label{right:unset;left:-1px}}.media-minimal-skin .media-button--playback-rate{padding:0;&:after{content:attr(data-rate) "×";font-variant-numeric:tabular-nums;width:4ch}}.media-minimal-skin .media-button-group{align-items:center;gap:.075rem;display:flex;@container media-root (width>42rem){gap:.125rem}}.media-minimal-skin .media-icon__container{position:relative}.media-minimal-skin .media-icon{transition-behavior:allow-discrete;flex-shrink:0;grid-area:1/1;width:18px;height:18px;transition-property:display,opacity;transition-duration:.15s;transition-timing-function:ease-out;display:block}.media-minimal-skin .media-icon--flipped{scale:-1 1}.media-minimal-skin .media-slider{cursor:pointer;border-radius:3.40282e38px;outline:none;flex:1;justify-content:center;align-items:center;display:flex;position:relative;&[data-orientation=horizontal]{width:100%;min-width:5rem;height:2rem}&[data-orientation=vertical]{width:2rem;height:4.5rem}}.media-minimal-skin .media-slider__track{isolation:isolate;border-radius:inherit;user-select:none;background-color:oklch(from currentColor l c h / .2);position:relative;overflow:hidden;&[data-orientation=horizontal]{width:100%;height:.1875rem}&[data-orientation=vertical]{width:.1875rem;height:100%}}.media-minimal-skin .media-slider__thumb{z-index:10;width:.75rem;height:.75rem;box-shadow:0 0 0 1px var(--media-controls-current-shadow-color-subtle,oklch(0% 0 0/.1)), 0 1px 3px 0 oklch(0% 0 0/.15), 0 1px 2px -1px oklch(0% 0 0/.15);opacity:0;transform-origin:50%;user-select:none;outline-offset:-2px;background-color:currentColor;border-radius:3.40282e38px;outline:2px solid #0000;transition-property:opacity,scale,outline-offset;transition-duration:.15s;transition-timing-function:ease-out;position:absolute;translate:-50% -50%;scale:.7;&[data-orientation=horizontal]{top:50%;left:var(--media-slider-fill)}&[data-orientation=vertical]{left:50%;top:calc(100% - var(--media-slider-fill))}&:focus-visible{outline-offset:2px;outline-color:currentColor}}.media-minimal-skin .media-slider:hover .media-slider__thumb,.media-minimal-skin .media-slider:focus-within .media-slider__thumb,.media-minimal-skin .media-slider__thumb--persistent{opacity:1;scale:1}.media-minimal-skin .media-slider__buffer,.media-minimal-skin .media-slider__fill{border-radius:inherit;pointer-events:none;position:absolute}.media-minimal-skin .media-slider__buffer[data-orientation=horizontal],.media-minimal-skin .media-slider__fill[data-orientation=horizontal]{inset-block:0;left:0}.media-minimal-skin .media-slider__buffer[data-orientation=vertical],.media-minimal-skin .media-slider__fill[data-orientation=vertical]{inset-inline:0;bottom:0}.media-minimal-skin .media-slider__buffer{background-color:oklch(from currentColor l c h / .2);transition-duration:.25s;transition-timing-function:ease-out;&[data-orientation=horizontal]{width:var(--media-slider-buffer);transition-property:width}&[data-orientation=vertical]{height:var(--media-slider-buffer);transition-property:height}}.media-minimal-skin .media-slider__fill{background-color:currentColor;&[data-orientation=horizontal]{width:var(--media-slider-fill)}&[data-orientation=vertical]{height:var(--media-slider-fill)}}.media-minimal-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=horizontal]{left:var(--media-slider-pointer)}.media-minimal-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=vertical]{top:calc(100% - var(--media-slider-pointer))}.media-minimal-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=horizontal]{width:var(--media-slider-pointer)}.media-minimal-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=vertical]{height:var(--media-slider-pointer)}.media-minimal-skin .media-popover,.media-minimal-skin .media-tooltip{color:inherit;transition-property:scale,opacity,filter;transition-duration:var(--media-popup-transition-duration);transition-timing-function:var(--media-popup-transition-timing-function);border:0;margin:0;overflow:visible;&[data-starting-style],&[data-ending-style]{opacity:0;filter:blur(8px);scale:.5}&[data-instant]{transition-duration:0s}&[data-side=top]{transform-origin:bottom}&[data-side=bottom]{transform-origin:top}&[data-side=left]{transform-origin:100%}&[data-side=right]{transform-origin:0}&:before{content:"";pointer-events:inherit;position:absolute}&[data-side=top]:before,&[data-side=bottom]:before{width:100%;inset-inline:0}&[data-side=top]:before{top:100%}&[data-side=bottom]:before{bottom:100%}&[data-side=left]:before,&[data-side=right]:before{height:100%;inset-block:0}&[data-side=left]:before{left:100%}&[data-side=right]:before{right:100%}}.media-minimal-skin .media-popover{&[data-side=top]:before,&[data-side=bottom]:before{height:var(--media-popover-side-offset)}&[data-side=left]:before,&[data-side=right]:before{width:var(--media-popover-side-offset)}}.media-minimal-skin .media-tooltip{background-color:var(--media-tooltip-background-color);backdrop-filter:var(--media-tooltip-backdrop-filter);box-shadow:0 0 0 1px var(--media-tooltip-border-color), 0 4px 6px -1px oklch(0% 0 0/.1), 0 2px 4px -2px oklch(0% 0 0/.1);color:var(--media-tooltip-text-color);white-space:nowrap;border-radius:.5rem;padding:.25rem .5rem;font-size:.75rem;&[data-side=top]:before,&[data-side=bottom]:before{height:var(--media-tooltip-side-offset)}&[data-side=left]:before,&[data-side=right]:before{width:var(--media-tooltip-side-offset)}}.media-minimal-skin .media-popover--volume:has(media-volume-slider[data-availability=unsupported]){display:none}.media-button--play .media-icon--restart,.media-button--play .media-icon--play,.media-button--play .media-icon--pause,.media-button--mute .media-icon--volume-off,.media-button--mute .media-icon--volume-low,.media-button--mute .media-icon--volume-high{opacity:0;display:none}.media-button--play[data-ended] .media-icon--restart,.media-button--play:not([data-ended])[data-paused] .media-icon--play,.media-button--play:not([data-paused]):not([data-ended]) .media-icon--pause,.media-button--mute[data-muted] .media-icon--volume-off,.media-button--mute:not([data-muted])[data-volume-level=low] .media-icon--volume-low,.media-button--mute:not([data-muted]):not([data-volume-level=low]) .media-icon--volume-high{opacity:1;display:block}.media-minimal-skin--audio{--media-controls-background-color:oklch(100% 0 0);--media-controls-backdrop-filter:blur(16px) saturate(1.5);--media-controls-border-color:oklch(0% 0 0/.05);--media-controls-text-color:var(--media-color-primary,oklch(0% 0 0));--media-error-dialog-transition-duration:.25s;--media-error-dialog-transition-delay:.1s;--media-popup-transition-duration:.1s;--media-popup-transition-timing-function:ease-out;--media-tooltip-background-color:oklch(100% 0 0/.1);--media-tooltip-border-color:oklch(0% 0 0/.05);--media-tooltip-backdrop-filter:blur(16px) saturate(1.5);--media-tooltip-text-color:currentColor;--media-tooltip-side-offset:.75rem;--media-popover-side-offset:.75rem;@media (prefers-reduced-motion:reduce){--media-error-dialog-transition-duration:50ms;--media-error-dialog-transition-delay:0s;--media-popup-transition-duration:0s}@media (prefers-color-scheme:dark){--media-controls-background-color:oklch(0% 0 0);--media-controls-border-color:oklch(100% 0 0/.1);--media-controls-text-color:var(--media-color-primary,oklch(100% 0 0))}@media (prefers-reduced-transparency:reduce) or (prefers-contrast:more){--media-tooltip-background-color:oklch(100% 0 0)}@media (prefers-color-scheme:dark) and ((prefers-reduced-transparency:reduce) or (prefers-contrast:more)){--media-tooltip-background-color:oklch(0% 0 0)}}.media-minimal-skin--audio .media-error__dialog{z-index:20;transition-property:opacity,filter,scale;transition-duration:var(--media-error-dialog-transition-duration);transition-delay:var(--media-error-dialog-transition-delay);background-color:oklch(from var(--media-controls-background-color) l c h / 1);border-radius:3.40282e38px;align-items:center;gap:1rem;padding-inline:1.25rem .5rem;transition-timing-function:ease-out;display:flex;position:absolute;inset:0}.media-minimal-skin--audio .media-error[data-starting-style] .media-error__dialog,.media-minimal-skin--audio .media-error[data-ending-style] .media-error__dialog{opacity:0;filter:blur(4px);scale:.95}.media-minimal-skin--audio .media-error[data-ending-style] .media-error__dialog{transition-delay:0s}.media-minimal-skin--audio .media-error__content{flex:1;align-items:center;gap:.5rem;display:flex}.media-minimal-skin--audio .media-controls{color:var(--media-controls-text-color);box-shadow:0 0 0 1px var(--media-controls-border-color);border-radius:var(--media-border-radius,1rem);gap:.5rem;padding:.375rem}.media-minimal-skin--audio .media-popover--volume{background:linear-gradient(to left, var(--media-controls-background-color) 80%, transparent 100%);padding:0 0 0 4rem}`;function o(){return`<media-container class="media-minimal-skin media-minimal-skin--audio"><slot name="media"></slot><slot></slot><media-error-dialog class="media-error"><div class="media-error__dialog"><div class="media-error__content"><media-alert-dialog-title class="media-error__title">Something went wrong.</media-alert-dialog-title><media-alert-dialog-description class="media-error__description"></media-alert-dialog-description></div><div class="media-error__actions"><media-alert-dialog-close class="media-button media-button--subtle">OK</media-alert-dialog-close></div></div></media-error-dialog><div class="media-controls"><media-tooltip-group><div class="media-button-group"><media-play-button commandfor="play-tooltip" class="media-button media-button--subtle media-button--icon media-button--play"> ${i(`restart`,{class:`media-icon media-icon--restart`})} ${i(`play`,{class:`media-icon media-icon--play`})} ${i(`pause`,{class:`media-icon media-icon--pause`})} </media-play-button><media-tooltip id="play-tooltip" side="top" class="media-tooltip"></media-tooltip><media-seek-button commandfor="seek-backward-tooltip" seconds="-10" class="media-button media-button--subtle media-button--icon media-button--seek"> <span class="media-icon__container"> ${i(`seek`,{class:`media-icon media-icon--seek media-icon--flipped`})} <span class="media-icon__label">10</span></span></media-seek-button><media-tooltip id="seek-backward-tooltip" side="top" class="media-tooltip"> Seek backward 10 seconds </media-tooltip><media-seek-button commandfor="seek-forward-tooltip" seconds="10" class="media-button media-button--subtle media-button--icon media-button--seek"> <span class="media-icon__container"> ${i(`seek`,{class:`media-icon media-icon--seek`})} <span class="media-icon__label">10</span></span></media-seek-button><media-tooltip id="seek-forward-tooltip" side="top" class="media-tooltip"> Seek forward 10 seconds </media-tooltip></div><div class="media-time-controls"><media-time-group class="media-time-group"><media-time type="current" class="media-time media-time--current"></media-time><media-time-separator class="media-time-separator"></media-time-separator><media-time type="duration" class="media-time media-time--duration"></media-time></media-time-group><media-time-slider class="media-slider"><media-slider-track class="media-slider__track"><media-slider-fill class="media-slider__fill"></media-slider-fill><media-slider-buffer class="media-slider__buffer"></media-slider-buffer></media-slider-track><media-slider-thumb class="media-slider__thumb"></media-slider-thumb></media-time-slider></div><div class="media-button-group"><media-playback-rate-button commandfor="playback-rate-tooltip" class="media-button media-button--subtle media-button--icon media-button--playback-rate"></media-playback-rate-button><media-tooltip id="playback-rate-tooltip" side="top" class="media-tooltip"> Toggle playback rate </media-tooltip><media-mute-button commandfor="audio-volume-popover" class="media-button media-button--subtle media-button--icon media-button--mute"> ${i(`volume-off`,{class:`media-icon media-icon--volume-off`})} ${i(`volume-low`,{class:`media-icon media-icon--volume-low`})} ${i(`volume-high`,{class:`media-icon media-icon--volume-high`})} </media-mute-button><media-popover id="audio-volume-popover" open-on-hover delay="200" close-delay="100" side="left" class="media-popover media-popover--volume"><media-volume-slider class="media-slider" orientation="horizontal" thumb-alignment="edge"><media-slider-track class="media-slider__track"><media-slider-fill class="media-slider__fill"></media-slider-fill></media-slider-track><media-slider-thumb class="media-slider__thumb media-slider__thumb--persistent"></media-slider-thumb></media-volume-slider></media-popover></div></media-tooltip-group></div></media-container>`}r(class extends n{static{this.tagName=`audio-minimal-skin`}static{this.styles=e(a)}static{this.template=t(o())}});
+import"./compounds-CCgS3IGo.js";import{n as e}from"./shadow-styles-BYZ6q3Q4.js";import{n as t,t as n}from"./skin-element-DM82PPxz.js";import{o as r}from"./context-CEFisYD0.js";import{t as i}from"./minimal-Bc74CFqg.js";import"./player-ChdQN3H5.js";import"./minimal-ui-hC8-_9_F.js";var a=`video-player{display:contents}video-player video,video-player [slot=poster]{width:100%;height:100%;display:block}video-player video::-webkit-media-text-track-container{transition:translate var(--media-caption-track-duration,0) ease-out;transition-delay:var(--media-caption-track-delay,0);translate:0 var(--media-caption-track-y,0);z-index:1;font-family:inherit;scale:.98}media-tooltip-group{display:contents}:host{width:100%;display:grid}.media-popover--volume:has(media-volume-slider[data-availability=unsupported]){display:none}.media-minimal-skin *,.media-minimal-skin :before,.media-minimal-skin :after{box-sizing:border-box}.media-minimal-skin img,.media-minimal-skin video,.media-minimal-skin svg{max-width:100%;display:block}.media-minimal-skin button{font:inherit}@media (prefers-reduced-motion:no-preference){.media-minimal-skin{interpolate-size:allow-keywords}}.media-minimal-skin{isolation:isolate;border-radius:var(--media-border-radius,.75rem);outline-offset:2px;outline:2px solid #0000;width:100%;height:100%;display:block;position:relative;container:media-root/inline-size;&:focus-visible{outline-color:currentColor}letter-spacing:normal;-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;font-family:Inter Variable,Inter,ui-sans-serif,system-ui,sans-serif;line-height:1.5;&>*{font-size:.75rem}@container media-root (width>48rem){&>*{font-size:.875rem}}}.media-minimal-skin .media-buffering-indicator{color:oklch(100% 0 0);pointer-events:none;justify-content:center;align-items:center;display:none;position:absolute;inset:0;&[data-visible]{display:flex}}.media-minimal-skin .media-error:not([data-open]){display:none}.media-minimal-skin .media-error__title{font-weight:600;line-height:1.25}.media-minimal-skin .media-error__description{opacity:.7;overflow-wrap:anywhere}.media-minimal-skin .media-error__actions{gap:.5rem;display:flex;&>*{flex:1}}.media-minimal-skin .media-error[data-open]~.media-controls *{visibility:hidden}.media-minimal-skin .media-controls{--media-controls-current-shadow-color:oklch(from currentColor 0 0 0 / clamp(0, calc((l - .5) * .5), .15));--media-controls-current-shadow-color-subtle:oklch(from var(--media-controls-current-shadow-color) l c h / calc(alpha * .4));background-color:var(--media-controls-background-color);backdrop-filter:var(--media-controls-backdrop-filter);text-shadow:0 1px 0 var(--media-controls-current-shadow-color);align-items:center;display:flex;container:media-controls/inline-size}.media-minimal-skin .media-time-controls{flex-direction:row-reverse;flex:1;align-items:center;gap:.75rem;display:flex;container:media-time-controls/inline-size}.media-minimal-skin .media-time-group{align-items:center;gap:.25rem;display:flex}.media-minimal-skin .media-time{font-variant-numeric:tabular-nums}.media-minimal-skin .media-time--current,.media-minimal-skin .media-time-separator{display:none}@container media-root (width>42rem){.media-minimal-skin .media-time-controls{flex-direction:row}.media-minimal-skin .media-time--duration,.media-minimal-skin .media-time-separator{color:oklch(from currentColor l c h / .6)}.media-minimal-skin .media-time--current,.media-minimal-skin .media-time-separator{display:inline}}.media-minimal-skin .media-button{outline-offset:-2px;will-change:scale;cursor:pointer;user-select:none;text-align:center;touch-action:manipulation;border:none;border-radius:.5rem;outline:2px solid #0000;flex-shrink:0;justify-content:center;align-items:center;padding:.5rem 1rem;transition-property:background-color,outline-offset,scale;transition-duration:.15s;transition-timing-function:ease-out;display:flex;&:focus-visible{outline-offset:2px;outline-color:currentColor}&:active{scale:.98}&[disabled]{opacity:.5;filter:grayscale();cursor:not-allowed}&[data-availability=unavailable]{display:none}}@supports (corner-shape:squircle){.media-minimal-skin .media-button{corner-shape:squircle;border-radius:1rem}}.media-minimal-skin .media-button--primary{color:oklch(0% 0 0);text-shadow:none;background:oklch(100% 0 0);font-weight:500}.media-minimal-skin .media-button--subtle{color:inherit;text-shadow:inherit;background:0 0;&:hover,&:focus-visible,&[aria-expanded=true]{background:oklch(from currentColor l c h / .1)}}.media-minimal-skin .media-button--icon{aspect-ratio:1;width:2.375rem;padding:0;display:grid;&:active{scale:.9}& .media-icon{filter:drop-shadow(0 1px 0 var(--media-controls-current-shadow-color,oklch(0% 0 0/.25)))}}.media-minimal-skin .media-button--seek{& .media-icon__label{font-variant-numeric:tabular-nums;font-size:10px;font-weight:480;position:absolute;bottom:-3px;right:-1px}&:has(.media-icon--flipped) .media-icon__label{right:unset;left:-1px}}.media-minimal-skin .media-button--playback-rate{padding:0;&:after{content:attr(data-rate) "×";font-variant-numeric:tabular-nums;width:4ch}}.media-minimal-skin .media-button-group{align-items:center;gap:.075rem;display:flex;@container media-root (width>42rem){gap:.125rem}}.media-minimal-skin .media-icon__container{position:relative}.media-minimal-skin .media-icon{transition-behavior:allow-discrete;flex-shrink:0;grid-area:1/1;width:18px;height:18px;transition-property:display,opacity;transition-duration:.15s;transition-timing-function:ease-out;display:block}.media-minimal-skin .media-icon--flipped{scale:-1 1}.media-minimal-skin .media-slider{cursor:pointer;border-radius:3.40282e38px;outline:none;flex:1;justify-content:center;align-items:center;display:flex;position:relative;&[data-orientation=horizontal]{width:100%;min-width:5rem;height:2rem}&[data-orientation=vertical]{width:2rem;height:4.5rem}}.media-minimal-skin .media-slider__track{isolation:isolate;border-radius:inherit;user-select:none;background-color:oklch(from currentColor l c h / .2);position:relative;overflow:hidden;&[data-orientation=horizontal]{width:100%;height:.1875rem}&[data-orientation=vertical]{width:.1875rem;height:100%}}.media-minimal-skin .media-slider__thumb{z-index:10;width:.75rem;height:.75rem;box-shadow:0 0 0 1px var(--media-controls-current-shadow-color-subtle,oklch(0% 0 0/.1)), 0 1px 3px 0 oklch(0% 0 0/.15), 0 1px 2px -1px oklch(0% 0 0/.15);opacity:0;transform-origin:50%;user-select:none;outline-offset:-2px;background-color:currentColor;border-radius:3.40282e38px;outline:2px solid #0000;transition-property:opacity,scale,outline-offset;transition-duration:.15s;transition-timing-function:ease-out;position:absolute;translate:-50% -50%;scale:.7;&[data-orientation=horizontal]{top:50%;left:var(--media-slider-fill)}&[data-orientation=vertical]{left:50%;top:calc(100% - var(--media-slider-fill))}&:focus-visible{outline-offset:2px;outline-color:currentColor}}.media-minimal-skin .media-slider:hover .media-slider__thumb,.media-minimal-skin .media-slider:focus-within .media-slider__thumb,.media-minimal-skin .media-slider__thumb--persistent{opacity:1;scale:1}.media-minimal-skin .media-slider__buffer,.media-minimal-skin .media-slider__fill{border-radius:inherit;pointer-events:none;position:absolute}.media-minimal-skin .media-slider__buffer[data-orientation=horizontal],.media-minimal-skin .media-slider__fill[data-orientation=horizontal]{inset-block:0;left:0}.media-minimal-skin .media-slider__buffer[data-orientation=vertical],.media-minimal-skin .media-slider__fill[data-orientation=vertical]{inset-inline:0;bottom:0}.media-minimal-skin .media-slider__buffer{background-color:oklch(from currentColor l c h / .2);transition-duration:.25s;transition-timing-function:ease-out;&[data-orientation=horizontal]{width:var(--media-slider-buffer);transition-property:width}&[data-orientation=vertical]{height:var(--media-slider-buffer);transition-property:height}}.media-minimal-skin .media-slider__fill{background-color:currentColor;&[data-orientation=horizontal]{width:var(--media-slider-fill)}&[data-orientation=vertical]{height:var(--media-slider-fill)}}.media-minimal-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=horizontal]{left:var(--media-slider-pointer)}.media-minimal-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=vertical]{top:calc(100% - var(--media-slider-pointer))}.media-minimal-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=horizontal]{width:var(--media-slider-pointer)}.media-minimal-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=vertical]{height:var(--media-slider-pointer)}.media-minimal-skin .media-popover,.media-minimal-skin .media-tooltip{color:inherit;transition-property:scale,opacity,filter;transition-duration:var(--media-popup-transition-duration);transition-timing-function:var(--media-popup-transition-timing-function);border:0;margin:0;overflow:visible;&[data-starting-style],&[data-ending-style]{opacity:0;filter:blur(8px);scale:.5}&[data-instant]{transition-duration:0s}&[data-side=top]{transform-origin:bottom}&[data-side=bottom]{transform-origin:top}&[data-side=left]{transform-origin:100%}&[data-side=right]{transform-origin:0}&:before{content:"";pointer-events:inherit;position:absolute}&[data-side=top]:before,&[data-side=bottom]:before{width:100%;inset-inline:0}&[data-side=top]:before{top:100%}&[data-side=bottom]:before{bottom:100%}&[data-side=left]:before,&[data-side=right]:before{height:100%;inset-block:0}&[data-side=left]:before{left:100%}&[data-side=right]:before{right:100%}}.media-minimal-skin .media-popover{&[data-side=top]:before,&[data-side=bottom]:before{height:var(--media-popover-side-offset)}&[data-side=left]:before,&[data-side=right]:before{width:var(--media-popover-side-offset)}}.media-minimal-skin .media-tooltip{background-color:var(--media-tooltip-background-color);backdrop-filter:var(--media-tooltip-backdrop-filter);box-shadow:0 0 0 1px var(--media-tooltip-border-color), 0 4px 6px -1px oklch(0% 0 0/.1), 0 2px 4px -2px oklch(0% 0 0/.1);color:var(--media-tooltip-text-color);white-space:nowrap;border-radius:.5rem;padding:.25rem .5rem;font-size:.75rem;&[data-side=top]:before,&[data-side=bottom]:before{height:var(--media-tooltip-side-offset)}&[data-side=left]:before,&[data-side=right]:before{width:var(--media-tooltip-side-offset)}}.media-minimal-skin .media-popover--volume:has(media-volume-slider[data-availability=unsupported]){display:none}.media-button--play .media-icon--restart,.media-button--play .media-icon--play,.media-button--play .media-icon--pause,.media-button--mute .media-icon--volume-off,.media-button--mute .media-icon--volume-low,.media-button--mute .media-icon--volume-high{opacity:0;display:none}.media-button--play[data-ended] .media-icon--restart,.media-button--play:not([data-ended])[data-paused] .media-icon--play,.media-button--play:not([data-paused]):not([data-ended]) .media-icon--pause,.media-button--mute[data-muted] .media-icon--volume-off,.media-button--mute:not([data-muted])[data-volume-level=low] .media-icon--volume-low,.media-button--mute:not([data-muted]):not([data-volume-level=low]) .media-icon--volume-high{opacity:1;display:block}.media-minimal-skin--audio{--media-controls-background-color:oklch(100% 0 0);--media-controls-backdrop-filter:blur(16px) saturate(1.5);--media-controls-border-color:oklch(0% 0 0/.05);--media-controls-text-color:var(--media-color-primary,oklch(0% 0 0));--media-error-dialog-transition-duration:.25s;--media-error-dialog-transition-delay:.1s;--media-popup-transition-duration:.1s;--media-popup-transition-timing-function:ease-out;--media-tooltip-background-color:oklch(100% 0 0/.1);--media-tooltip-border-color:oklch(0% 0 0/.05);--media-tooltip-backdrop-filter:blur(16px) saturate(1.5);--media-tooltip-text-color:currentColor;--media-tooltip-side-offset:.75rem;--media-popover-side-offset:.75rem;@media (prefers-reduced-motion:reduce){--media-error-dialog-transition-duration:50ms;--media-error-dialog-transition-delay:0s;--media-popup-transition-duration:0s}@media (prefers-color-scheme:dark){--media-controls-background-color:oklch(0% 0 0);--media-controls-border-color:oklch(100% 0 0/.1);--media-controls-text-color:var(--media-color-primary,oklch(100% 0 0))}@media (prefers-reduced-transparency:reduce) or (prefers-contrast:more){--media-tooltip-background-color:oklch(100% 0 0)}@media (prefers-color-scheme:dark) and ((prefers-reduced-transparency:reduce) or (prefers-contrast:more)){--media-tooltip-background-color:oklch(0% 0 0)}}.media-minimal-skin--audio .media-error__dialog{z-index:20;transition-property:opacity,filter,scale;transition-duration:var(--media-error-dialog-transition-duration);transition-delay:var(--media-error-dialog-transition-delay);background-color:oklch(from var(--media-controls-background-color) l c h / 1);border-radius:3.40282e38px;align-items:center;gap:1rem;padding-inline:1.25rem .5rem;transition-timing-function:ease-out;display:flex;position:absolute;inset:0}.media-minimal-skin--audio .media-error[data-starting-style] .media-error__dialog,.media-minimal-skin--audio .media-error[data-ending-style] .media-error__dialog{opacity:0;filter:blur(4px);scale:.95}.media-minimal-skin--audio .media-error[data-ending-style] .media-error__dialog{transition-delay:0s}.media-minimal-skin--audio .media-error__content{flex:1;align-items:center;gap:.5rem;display:flex}.media-minimal-skin--audio .media-controls{color:var(--media-controls-text-color);box-shadow:0 0 0 1px var(--media-controls-border-color);border-radius:var(--media-border-radius,1rem);gap:.5rem;padding:.375rem}.media-minimal-skin--audio .media-popover--volume{background:linear-gradient(to left, var(--media-controls-background-color) 80%, transparent 100%);padding:0 0 0 4rem}`;function o(){return`<media-container class="media-minimal-skin media-minimal-skin--audio"><slot name="media"></slot><slot></slot><media-error-dialog class="media-error"><div class="media-error__dialog"><div class="media-error__content"><media-alert-dialog-title class="media-error__title">Something went wrong.</media-alert-dialog-title><media-alert-dialog-description class="media-error__description"></media-alert-dialog-description></div><div class="media-error__actions"><media-alert-dialog-close class="media-button media-button--subtle">OK</media-alert-dialog-close></div></div></media-error-dialog><div class="media-controls"><media-tooltip-group><div class="media-button-group"><media-play-button commandfor="play-tooltip" class="media-button media-button--subtle media-button--icon media-button--play"> ${i(`restart`,{class:`media-icon media-icon--restart`})} ${i(`play`,{class:`media-icon media-icon--play`})} ${i(`pause`,{class:`media-icon media-icon--pause`})} </media-play-button><media-tooltip id="play-tooltip" side="top" class="media-tooltip"></media-tooltip><media-seek-button commandfor="seek-backward-tooltip" seconds="-10" class="media-button media-button--subtle media-button--icon media-button--seek"> <span class="media-icon__container"> ${i(`seek`,{class:`media-icon media-icon--seek media-icon--flipped`})} <span class="media-icon__label">10</span></span></media-seek-button><media-tooltip id="seek-backward-tooltip" side="top" class="media-tooltip"> Seek backward 10 seconds </media-tooltip><media-seek-button commandfor="seek-forward-tooltip" seconds="10" class="media-button media-button--subtle media-button--icon media-button--seek"> <span class="media-icon__container"> ${i(`seek`,{class:`media-icon media-icon--seek`})} <span class="media-icon__label">10</span></span></media-seek-button><media-tooltip id="seek-forward-tooltip" side="top" class="media-tooltip"> Seek forward 10 seconds </media-tooltip></div><div class="media-time-controls"><media-time-group class="media-time-group"><media-time type="current" class="media-time media-time--current"></media-time><media-time-separator class="media-time-separator"></media-time-separator><media-time type="duration" class="media-time media-time--duration"></media-time></media-time-group><media-time-slider class="media-slider"><media-slider-track class="media-slider__track"><media-slider-fill class="media-slider__fill"></media-slider-fill><media-slider-buffer class="media-slider__buffer"></media-slider-buffer></media-slider-track><media-slider-thumb class="media-slider__thumb"></media-slider-thumb></media-time-slider></div><div class="media-button-group"><media-playback-rate-button commandfor="playback-rate-tooltip" class="media-button media-button--subtle media-button--icon media-button--playback-rate"></media-playback-rate-button><media-tooltip id="playback-rate-tooltip" side="top" class="media-tooltip"> Toggle playback rate </media-tooltip><media-mute-button commandfor="audio-volume-popover" class="media-button media-button--subtle media-button--icon media-button--mute"> ${i(`volume-off`,{class:`media-icon media-icon--volume-off`})} ${i(`volume-low`,{class:`media-icon media-icon--volume-low`})} ${i(`volume-high`,{class:`media-icon media-icon--volume-high`})} </media-mute-button><media-popover id="audio-volume-popover" open-on-hover delay="200" close-delay="100" side="left" class="media-popover media-popover--volume"><media-volume-slider class="media-slider" orientation="horizontal" thumb-alignment="edge"><media-slider-track class="media-slider__track"><media-slider-fill class="media-slider__fill"></media-slider-fill></media-slider-track><media-slider-thumb class="media-slider__thumb media-slider__thumb--persistent"></media-slider-thumb></media-volume-slider></media-popover></div></media-tooltip-group></div></media-container>`}r(class extends n{static{this.tagName=`audio-minimal-skin`}static{this.styles=e(a)}static{this.template=t(o())}});
 //# sourceMappingURL=audio-minimal.js.map

package/cdn/audio-ui.dev.js

@@ -1,4 +1,4 @@
-import "./compounds-CM_NP-ej.js";
+import "./compounds-DD3MYkSc.js";
 import "./context-0rI_P6jf.js";
-import "./player-xstFHOgW.js";
-import "./ui-AFHQtrqa.js";
+import "./player-BVGWmIbQ.js";
+import "./ui-CKR6dVbQ.js";

package/cdn/audio-ui.js

@@ -1 +1 @@
-import"./compounds-Vvz-YfXP.js";import"./context-CEFisYD0.js";import"./player-BK35-ndY.js";import"./ui-QHwo6iyo.js";
+import"./compounds-CCgS3IGo.js";import"./context-CEFisYD0.js";import"./player-ChdQN3H5.js";import"./ui-BGvi0TNr.js";

package/cdn/audio.dev.js

@@ -1,10 +1,10 @@
-import { t as renderIcon } from "./default-XHZAb7gP.js";
-import "./compounds-CM_NP-ej.js";
+import { t as renderIcon } from "./default-YzaLyoYg.js";
+import "./compounds-DD3MYkSc.js";
 import { n as createShadowStyle } from "./shadow-styles-DKXFMmyD.js";
-import { n as createTemplate, t as SkinElement } from "./skin-element-CDUkmCtS.js";
+import { n as createTemplate, t as SkinElement } from "./skin-element-D3iVinGP.js";
 import { o as safeDefine } from "./context-0rI_P6jf.js";
-import "./player-xstFHOgW.js";
-import "./ui-AFHQtrqa.js";
+import "./player-BVGWmIbQ.js";
+import "./ui-CKR6dVbQ.js";
 
 //#region inline-css:src/define/audio/skin.js
 var skin_default = "/* -------------------------------------------------------------------------- */\n/* Base                                                                       */\n/* -------------------------------------------------------------------------- */\n\nvideo-player {\n  display: contents;\n}\n\n/*\nRequired to override any default video and image styles (such as\nTailwind's CSS reset) and ensure they fill the container as expected.\n*/\nvideo-player video,\nvideo-player [slot=\"poster\"] {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\nvideo-player video::-webkit-media-text-track-container {\n  transition: translate var(--media-caption-track-duration, 0) ease-out;\n  transition-delay: var(--media-caption-track-delay, 0);\n  translate: 0 var(--media-caption-track-y, 0);\n  scale: 0.98;\n  z-index: 1;\n  font-family: inherit;\n}\n\nmedia-tooltip-group {\n  display: contents;\n}\n\n:host {\n  /* `display:grid` fixes a weird issue with Safari when setting aspect-ratio */\n  display: grid;\n  width: 100%;\n}\n\n/* Hide volume popover when volume control is unsupported (e.g., iOS Safari). */\n.media-popover--volume:has(media-volume-slider[data-availability=\"unsupported\"]) {\n  display: none;\n}\n\n/* ==========================================================================\n   Reset\n   ========================================================================== */\n\n.media-default-skin *,\n.media-default-skin *::before,\n.media-default-skin *::after {\n  box-sizing: border-box;\n}\n.media-default-skin img,\n.media-default-skin video,\n.media-default-skin svg {\n  display: block;\n  max-width: 100%;\n}\n.media-default-skin button {\n  font: inherit;\n}\n@media (prefers-reduced-motion: no-preference) {\n  .media-default-skin {\n    interpolate-size: allow-keywords;\n  }\n}\n\n/* ==========================================================================\n   Root Container\n   ========================================================================== */\n\n.media-default-skin {\n  container: media-root / inline-size;\n  position: relative;\n  isolation: isolate;\n  display: block;\n  height: 100%;\n  width: 100%;\n  border-radius: var(--media-border-radius, 2rem);\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n\n  &:focus-visible {\n    outline-color: currentColor;\n  }\n  font-family:\n    Inter Variable,\n    Inter,\n    ui-sans-serif,\n    system-ui,\n    sans-serif;\n  line-height: 1.5;\n  letter-spacing: normal;\n  -webkit-font-smoothing: auto;\n  -moz-osx-font-smoothing: auto;\n\n  & > * {\n    font-size: 0.75rem; /* 12px at 100% font size */\n  }\n\n  @container media-root (width > 48rem) {\n    & > * {\n      font-size: 0.875rem; /* 14px at 100% font size */\n    }\n  }\n}\n\n/* ==========================================================================\n   Surface (shared glass effect for tooltips, popovers, controls)\n   ========================================================================== */\n\n.media-default-skin .media-surface {\n  background-color: var(--media-surface-background-color);\n  backdrop-filter: var(--media-surface-backdrop-filter);\n  box-shadow:\n    0 0 0 1px var(--media-surface-outer-border-color),\n    0 1px 3px 0 var(--media-surface-shadow-color),\n    0 1px 2px -1px var(--media-surface-shadow-color);\n\n  /* Inner border ring */\n  &::after {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    z-index: 10;\n    border-radius: inherit;\n    box-shadow: inset 0 0 0 1px var(--media-surface-inner-border-color);\n    pointer-events: none;\n  }\n}\n\n/* ==========================================================================\n   Buffering Indicator\n   ========================================================================== */\n\n.media-default-skin .media-buffering-indicator {\n  position: absolute;\n  inset: 0;\n  display: none;\n  align-items: center;\n  justify-content: center;\n  color: oklch(1 0 0);\n  pointer-events: none;\n\n  &[data-visible] {\n    display: flex;\n  }\n\n  .media-surface {\n    padding: 0.25rem;\n    border-radius: 100%;\n  }\n}\n\n/* ==========================================================================\n   Error Dialog\n   ========================================================================== */\n\n.media-default-skin .media-error {\n  outline: none;\n}\n\n.media-default-skin .media-error:not([data-open]) {\n  display: none;\n}\n\n.media-default-skin .media-error__title {\n  font-weight: 600;\n  line-height: 1.25;\n}\n\n.media-default-skin .media-error__description {\n  opacity: 0.7;\n  overflow-wrap: anywhere;\n}\n\n.media-default-skin .media-error__actions {\n  display: flex;\n  gap: 0.5rem;\n\n  & > * {\n    flex: 1;\n  }\n}\n\n.media-default-skin .media-error[data-open] ~ .media-controls * {\n  visibility: hidden;\n}\n\n/* ==========================================================================\n   Controls\n   ========================================================================== */\n\n.media-default-skin .media-controls {\n  container: media-controls / inline-size;\n  display: flex;\n  align-items: center;\n  column-gap: 0.075rem;\n  padding: 0.375rem;\n  border-radius: 1.5rem;\n  --media-controls-current-shadow-color: oklch(from currentColor 0 0 0 / clamp(0, calc((l - 0.5) * 0.5), 0.15));\n  --media-controls-current-shadow-color-subtle: oklch(\n    from var(--media-controls-current-shadow-color) l c h /\n    calc(alpha * 0.4)\n  );\n  text-shadow: 0 1px 0 var(--media-controls-current-shadow-color);\n}\n\n/* ==========================================================================\n   Time Display\n   ========================================================================== */\n\n.media-default-skin .media-time-controls {\n  container: media-time-controls / inline-size;\n  display: flex;\n  align-items: center;\n  flex: 1;\n  gap: 0.75rem;\n  padding-inline: 0.5rem;\n}\n\n.media-default-skin .media-time {\n  font-variant-numeric: tabular-nums;\n}\n\n/* ==========================================================================\n   Buttons\n   ========================================================================== */\n\n/* Base button */\n.media-default-skin .media-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  padding: 0.5rem 1rem;\n  border: none;\n  border-radius: calc(infinity * 1px);\n  outline: 2px solid transparent;\n  outline-offset: -2px;\n  transition-property: background-color, outline-offset, scale;\n  /* Fix weird jumping when clicking on the buttons in Safari. */\n  will-change: scale;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n  cursor: pointer;\n  user-select: none;\n  text-align: center;\n  touch-action: manipulation;\n\n  &:focus-visible {\n    outline-color: currentColor;\n    outline-offset: 2px;\n  }\n\n  &:active {\n    scale: 0.98;\n  }\n\n  &[disabled] {\n    opacity: 0.5;\n    filter: grayscale(1);\n    cursor: not-allowed;\n  }\n\n  &[data-availability=\"unavailable\"] {\n    display: none;\n  }\n}\n\n/* Primary button variant */\n.media-default-skin .media-button--primary {\n  background: oklch(1 0 0);\n  color: oklch(0 0 0);\n  font-weight: 500;\n  text-shadow: none;\n}\n\n/* Subtle button variant */\n.media-default-skin .media-button--subtle {\n  background: transparent;\n  color: inherit;\n  text-shadow: inherit;\n\n  &:hover,\n  &:focus-visible,\n  &[aria-expanded=\"true\"] {\n    background-color: oklch(from currentColor l c h / 0.1);\n    text-decoration: none;\n  }\n}\n\n/* Icon button variant */\n.media-default-skin .media-button--icon {\n  display: grid;\n  width: 2.25rem;\n  padding: 0;\n  aspect-ratio: 1;\n\n  &:active {\n    scale: 0.9;\n  }\n\n  & .media-icon {\n    filter: drop-shadow(0 1px 0 var(--media-controls-current-shadow-color, oklch(0 0 0 / 0.25)));\n  }\n}\n\n/* Seek button */\n.media-default-skin .media-button--seek {\n  & .media-icon__label {\n    position: absolute;\n    right: -1px;\n    bottom: -3px;\n    font-size: 10px;\n    font-weight: 480;\n    font-variant-numeric: tabular-nums;\n  }\n\n  &:has(.media-icon--flipped) .media-icon__label {\n    right: unset;\n    left: -1px;\n  }\n}\n\n/* Playback rate button */\n.media-default-skin .media-button--playback-rate {\n  padding: 0;\n\n  &::after {\n    content: attr(data-rate) \"\\00D7\";\n    width: 4ch;\n    font-variant-numeric: tabular-nums;\n  }\n}\n\n/* ==========================================================================\n   Button Groups\n   ========================================================================== */\n\n.media-default-skin .media-button-group {\n  display: flex;\n  align-items: center;\n  gap: 0.075rem;\n\n  @container media-root (width > 42rem) {\n    gap: 0.125rem;\n  }\n}\n\n/* ==========================================================================\n   Icons\n   ========================================================================== */\n\n.media-default-skin .media-icon__container {\n  position: relative;\n}\n.media-default-skin .media-icon {\n  display: block;\n  flex-shrink: 0;\n  grid-area: 1 / 1;\n  width: 18px;\n  height: 18px;\n  transition-behavior: allow-discrete;\n  transition-property: display, opacity;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n}\n.media-default-skin .media-icon--flipped {\n  scale: -1 1;\n}\n\n/* ==========================================================================\n   Slider\n   ========================================================================== */\n\n.media-default-skin .media-slider {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 1;\n  border-radius: calc(infinity * 1px);\n  outline: none;\n  cursor: pointer;\n\n  &[data-orientation=\"horizontal\"] {\n    min-width: 5rem;\n    width: 100%;\n    height: 2rem;\n  }\n\n  &[data-orientation=\"vertical\"] {\n    width: 2rem;\n    height: 5rem;\n  }\n}\n\n/* Track */\n.media-default-skin .media-slider__track {\n  position: relative;\n  isolation: isolate;\n  overflow: hidden;\n  border-radius: inherit;\n  user-select: none;\n\n  &[data-orientation=\"horizontal\"] {\n    width: 100%;\n    height: 0.25rem;\n  }\n\n  &[data-orientation=\"vertical\"] {\n    width: 0.25rem;\n    height: 100%;\n  }\n}\n\n/* Thumb */\n.media-default-skin .media-slider__thumb {\n  z-index: 10;\n  position: absolute;\n  translate: -50% -50%;\n  width: 0.625rem;\n  height: 0.625rem;\n  background-color: currentColor;\n  border-radius: calc(infinity * 1px);\n  box-shadow:\n    0 0 0 1px var(--media-controls-current-shadow-color-subtle, oklch(0 0 0 / 0.1)),\n    0 1px 3px 0 oklch(0 0 0 / 0.15),\n    0 1px 2px -1px oklch(0 0 0 / 0.15);\n  opacity: 0;\n  transition-property: opacity, height, width, outline-offset;\n  transition-duration: 150ms;\n  transition-timing-function: ease-out;\n  user-select: none;\n  outline: 4px solid transparent;\n  outline-offset: -4px;\n\n  &[data-orientation=\"horizontal\"] {\n    top: 50%;\n    left: var(--media-slider-fill);\n  }\n\n  &[data-orientation=\"vertical\"] {\n    left: 50%;\n    top: calc(100% - var(--media-slider-fill));\n  }\n\n  &:hover,\n  &:focus {\n    outline-color: oklch(from currentColor l c h / 0.25);\n    outline-offset: 0;\n  }\n\n  &::after {\n    content: \"\";\n    position: absolute;\n    inset: -4px;\n    border-radius: inherit;\n    box-shadow: 0 0 0 2px oklch(1 0 0);\n    transition-property: opacity, scale;\n    transition-duration: 150ms;\n    transition-timing-function: ease-out;\n  }\n\n  &:not(:focus-visible)::after {\n    scale: 0.5;\n    opacity: 0;\n  }\n}\n\n.media-default-skin .media-slider:active .media-slider__thumb,\n.media-default-skin .media-slider__thumb--persistent {\n  width: 0.75rem;\n  height: 0.75rem;\n}\n\n.media-default-skin .media-slider:hover .media-slider__thumb,\n.media-default-skin .media-slider__thumb:focus-visible,\n.media-default-skin .media-slider__thumb--persistent {\n  opacity: 1;\n}\n\n/* Shared track fills */\n.media-default-skin .media-slider__buffer,\n.media-default-skin .media-slider__fill {\n  position: absolute;\n  border-radius: inherit;\n  pointer-events: none;\n}\n\n.media-default-skin .media-slider__buffer[data-orientation=\"horizontal\"],\n.media-default-skin .media-slider__fill[data-orientation=\"horizontal\"] {\n  inset-block: 0;\n  left: 0;\n}\n\n.media-default-skin .media-slider__buffer[data-orientation=\"vertical\"],\n.media-default-skin .media-slider__fill[data-orientation=\"vertical\"] {\n  inset-inline: 0;\n  bottom: 0;\n}\n\n/* Buffer */\n.media-default-skin .media-slider__buffer {\n  background-color: oklch(from currentColor l c h / 0.2);\n  transition-duration: 0.25s;\n  transition-timing-function: ease-out;\n\n  &[data-orientation=\"horizontal\"] {\n    width: var(--media-slider-buffer);\n    transition-property: width;\n  }\n\n  &[data-orientation=\"vertical\"] {\n    height: var(--media-slider-buffer);\n    transition-property: height;\n  }\n}\n\n/* Fill */\n.media-default-skin .media-slider__fill {\n  background-color: currentColor;\n\n  &[data-orientation=\"horizontal\"] {\n    width: var(--media-slider-fill);\n  }\n\n  &[data-orientation=\"vertical\"] {\n    height: var(--media-slider-fill);\n  }\n}\n\n/* Dragging — thumb and fill follow the pointer position */\n.media-default-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=\"horizontal\"] {\n  left: var(--media-slider-pointer);\n}\n\n.media-default-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=\"vertical\"] {\n  top: calc(100% - var(--media-slider-pointer));\n}\n\n.media-default-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=\"horizontal\"] {\n  width: var(--media-slider-pointer);\n}\n\n.media-default-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=\"vertical\"] {\n  height: var(--media-slider-pointer);\n}\n\n/* ==========================================================================\n   Popups & Tooltips\n   ========================================================================== */\n\n.media-default-skin .media-popover,\n.media-default-skin .media-tooltip {\n  margin: 0;\n  border: 0;\n  color: inherit;\n  overflow: visible;\n  transition-property: scale, opacity, filter;\n  transition-duration: var(--media-popup-transition-duration);\n  transition-timing-function: var(--media-popup-transition-timing-function);\n\n  &[data-starting-style],\n  &[data-ending-style] {\n    opacity: 0;\n    scale: 0.5;\n    filter: blur(8px);\n  }\n\n  &[data-instant] {\n    transition-duration: 0ms;\n  }\n\n  &[data-side=\"top\"] {\n    transform-origin: bottom;\n  }\n  &[data-side=\"bottom\"] {\n    transform-origin: top;\n  }\n  &[data-side=\"left\"] {\n    transform-origin: right;\n  }\n  &[data-side=\"right\"] {\n    transform-origin: left;\n  }\n\n  /* Safe area between trigger and popup */\n  &::before {\n    content: \"\";\n    position: absolute;\n    pointer-events: inherit;\n  }\n\n  &[data-side=\"top\"]::before,\n  &[data-side=\"bottom\"]::before {\n    width: 100%;\n    inset-inline: 0;\n  }\n  &[data-side=\"top\"]::before {\n    top: 100%;\n  }\n  &[data-side=\"bottom\"]::before {\n    bottom: 100%;\n  }\n\n  &[data-side=\"left\"]::before,\n  &[data-side=\"right\"]::before {\n    height: 100%;\n    inset-block: 0;\n  }\n  &[data-side=\"left\"]::before {\n    left: 100%;\n  }\n  &[data-side=\"right\"]::before {\n    right: 100%;\n  }\n}\n\n.media-default-skin .media-popover {\n  &[data-side=\"top\"]::before,\n  &[data-side=\"bottom\"]::before {\n    height: var(--media-popover-side-offset);\n  }\n  &[data-side=\"left\"]::before,\n  &[data-side=\"right\"]::before {\n    width: var(--media-popover-side-offset);\n  }\n}\n.media-default-skin .media-popover--volume {\n  padding: 0.75rem 0;\n  border-radius: calc(infinity * 1px);\n\n  &:has(media-volume-slider[data-availability=\"unsupported\"]) {\n    display: none;\n  }\n}\n\n.media-default-skin .media-tooltip {\n  padding: 0.25rem 0.625rem;\n  border-radius: calc(infinity * 1px);\n  font-size: 0.75rem;\n  white-space: nowrap;\n\n  &[data-side=\"top\"]::before,\n  &[data-side=\"bottom\"]::before {\n    height: var(--media-tooltip-side-offset);\n  }\n  &[data-side=\"left\"]::before,\n  &[data-side=\"right\"]::before {\n    width: var(--media-tooltip-side-offset);\n  }\n}\n\n/* ==========================================================================\n   Icon State Visibility for Audio Skins\n\n   Data-attribute-driven visibility rules for multi-state icon buttons.\n   Uses :is() with both element selectors (for HTML custom element wrappers)\n   and class selectors (for React rendered SVG elements).\n   ========================================================================== */\n\n/* --- All icons hidden by default --- */\n\n.media-button--play .media-icon--restart,\n.media-button--play .media-icon--play,\n.media-button--play .media-icon--pause,\n.media-button--mute .media-icon--volume-off,\n.media-button--mute .media-icon--volume-low,\n.media-button--mute .media-icon--volume-high {\n  display: none;\n  opacity: 0;\n}\n\n/* --- Active icon per state --- */\n\n/* Play: ended → restart */\n.media-button--play[data-ended] .media-icon--restart,\n/* Play: paused (not ended) → play */\n.media-button--play:not([data-ended])[data-paused] .media-icon--play,\n/* Play: playing (not paused, not ended) → pause */\n.media-button--play:not([data-paused]):not([data-ended]) .media-icon--pause,\n/* Mute: muted → volume off */\n.media-button--mute[data-muted] .media-icon--volume-off,\n/* Mute: volume low (not muted) → volume low */\n.media-button--mute:not([data-muted])[data-volume-level=\"low\"] .media-icon--volume-low,\n/* Mute: volume high (not muted, not low) → volume high */\n.media-button--mute:not([data-muted]):not([data-volume-level=\"low\"]) .media-icon--volume-high {\n  display: block;\n  opacity: 1;\n}\n\n\n/* ==========================================================================\n   Root\n   ========================================================================== */\n\n.media-default-skin--audio {\n  --media-surface-background-color: oklch(1 0 0 / 0.5);\n  --media-surface-inner-border-color: oklch(1 0 0 / 0.1);\n  --media-surface-outer-border-color: oklch(0 0 0 / 0.05);\n  --media-surface-shadow-color: oklch(0 0 0 / 0.15);\n  --media-surface-backdrop-filter: blur(16px) saturate(1.5);\n  --media-text-color: var(--media-color-primary, oklch(0 0 0));\n  --media-error-dialog-transition-duration: 250ms;\n  --media-error-dialog-transition-delay: 100ms;\n  --media-popup-transition-duration: 100ms;\n  --media-popup-transition-timing-function: ease-out;\n  --media-tooltip-side-offset: 0.75rem;\n  --media-popover-side-offset: 0.75rem;\n\n  @media (prefers-reduced-motion: reduce) {\n    --media-error-dialog-transition-duration: 50ms;\n    --media-error-dialog-transition-delay: 0ms;\n    --media-popup-transition-duration: 0ms;\n  }\n\n  @media (prefers-color-scheme: dark) {\n    --media-surface-background-color: oklch(0 0 0 / 0.4);\n    --media-text-color: var(--media-color-primary, oklch(1 0 0));\n  }\n\n  @media (prefers-reduced-transparency: reduce) or (prefers-contrast: more) {\n    --media-surface-background-color: oklch(1 0 0);\n    --media-surface-outer-border-color: oklch(0 0 0 / 0.05);\n  }\n\n  @media (prefers-color-scheme: dark) and ((prefers-reduced-transparency: reduce) or (prefers-contrast: more)) {\n    --media-surface-background-color: oklch(0 0 0);\n    --media-surface-inner-border-color: oklch(1 0 0 / 0.2);\n    --media-surface-outer-border-color: transparent;\n  }\n}\n\n/* ==========================================================================\n   Error Dialog\n   ========================================================================== */\n\n.media-default-skin--audio .media-error__dialog {\n  position: absolute;\n  inset: 0;\n  z-index: 20;\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  padding-inline: 1.25rem 0.125rem;\n  transition-property: opacity, filter;\n  transition-duration: var(--media-error-dialog-transition-duration);\n  transition-delay: var(--media-error-dialog-transition-delay);\n  transition-timing-function: ease-out;\n  border-radius: calc(infinity * 1px);\n  background-color: var(--media-surface-background-color);\n  backdrop-filter: var(--media-surface-backdrop-filter);\n  color: var(--media-text-color);\n}\n\n.media-default-skin .media-error[data-starting-style] .media-error__dialog,\n.media-default-skin .media-error[data-ending-style] .media-error__dialog {\n  opacity: 0;\n  filter: blur(4px);\n}\n.media-default-skin .media-error[data-ending-style] .media-error__dialog {\n  transition-delay: 0ms;\n}\n\n.media-default-skin--audio .media-error__content {\n  flex: 1;\n  display: flex;\n  gap: 0.5rem;\n  align-items: center;\n}\n\n/* ==========================================================================\n  Controls\n  ========================================================================== */\n\n.media-default-skin--audio .media-controls {\n  color: var(--media-text-color);\n}\n\n/* ==========================================================================\n   Sliders\n   ========================================================================== */\n\n.media-default-skin--audio .media-slider__track {\n  background-color: oklch(0 0 0 / 0.1);\n\n  @media (prefers-color-scheme: dark) {\n    background-color: oklch(1 0 0 / 0.2);\n    box-shadow: 0 0 0 1px oklch(0 0 0 / 0.05);\n  }\n}\n\n";

package/cdn/audio.js

@@ -1,2 +1,2 @@
-import{t as e}from"./default-C8KsZ0zK.js";import"./compounds-Vvz-YfXP.js";import{n as t}from"./shadow-styles-BYZ6q3Q4.js";import{n,t as r}from"./skin-element-BGP23sop.js";import{o as i}from"./context-CEFisYD0.js";import"./player-BK35-ndY.js";import"./ui-QHwo6iyo.js";var a=`video-player{display:contents}video-player video,video-player [slot=poster]{width:100%;height:100%;display:block}video-player video::-webkit-media-text-track-container{transition:translate var(--media-caption-track-duration,0) ease-out;transition-delay:var(--media-caption-track-delay,0);translate:0 var(--media-caption-track-y,0);z-index:1;font-family:inherit;scale:.98}media-tooltip-group{display:contents}:host{width:100%;display:grid}.media-popover--volume:has(media-volume-slider[data-availability=unsupported]){display:none}.media-default-skin *,.media-default-skin :before,.media-default-skin :after{box-sizing:border-box}.media-default-skin img,.media-default-skin video,.media-default-skin svg{max-width:100%;display:block}.media-default-skin button{font:inherit}@media (prefers-reduced-motion:no-preference){.media-default-skin{interpolate-size:allow-keywords}}.media-default-skin{isolation:isolate;border-radius:var(--media-border-radius,2rem);outline-offset:2px;outline:2px solid #0000;width:100%;height:100%;display:block;position:relative;container:media-root/inline-size;&:focus-visible{outline-color:currentColor}letter-spacing:normal;-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;font-family:Inter Variable,Inter,ui-sans-serif,system-ui,sans-serif;line-height:1.5;&>*{font-size:.75rem}@container media-root (width>48rem){&>*{font-size:.875rem}}}.media-default-skin .media-surface{background-color:var(--media-surface-background-color);backdrop-filter:var(--media-surface-backdrop-filter);box-shadow:0 0 0 1px var(--media-surface-outer-border-color), 0 1px 3px 0 var(--media-surface-shadow-color), 0 1px 2px -1px var(--media-surface-shadow-color);&:after{content:"";z-index:10;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--media-surface-inner-border-color);pointer-events:none;position:absolute;inset:0}}.media-default-skin .media-buffering-indicator{color:oklch(100% 0 0);pointer-events:none;justify-content:center;align-items:center;display:none;position:absolute;inset:0;&[data-visible]{display:flex}& .media-surface{border-radius:100%;padding:.25rem}}.media-default-skin .media-error{outline:none}.media-default-skin .media-error:not([data-open]){display:none}.media-default-skin .media-error__title{font-weight:600;line-height:1.25}.media-default-skin .media-error__description{opacity:.7;overflow-wrap:anywhere}.media-default-skin .media-error__actions{gap:.5rem;display:flex;&>*{flex:1}}.media-default-skin .media-error[data-open]~.media-controls *{visibility:hidden}.media-default-skin .media-controls{--media-controls-current-shadow-color:oklch(from currentColor 0 0 0 / clamp(0, calc((l - .5) * .5), .15));--media-controls-current-shadow-color-subtle:oklch(from var(--media-controls-current-shadow-color) l c h / calc(alpha * .4));text-shadow:0 1px 0 var(--media-controls-current-shadow-color);border-radius:1.5rem;align-items:center;column-gap:.075rem;padding:.375rem;display:flex;container:media-controls/inline-size}.media-default-skin .media-time-controls{flex:1;align-items:center;gap:.75rem;padding-inline:.5rem;display:flex;container:media-time-controls/inline-size}.media-default-skin .media-time{font-variant-numeric:tabular-nums}.media-default-skin .media-button{outline-offset:-2px;will-change:scale;cursor:pointer;user-select:none;text-align:center;touch-action:manipulation;border:none;border-radius:3.40282e38px;outline:2px solid #0000;flex-shrink:0;justify-content:center;align-items:center;padding:.5rem 1rem;transition-property:background-color,outline-offset,scale;transition-duration:.15s;transition-timing-function:ease-out;display:flex;&:focus-visible{outline-offset:2px;outline-color:currentColor}&:active{scale:.98}&[disabled]{opacity:.5;filter:grayscale();cursor:not-allowed}&[data-availability=unavailable]{display:none}}.media-default-skin .media-button--primary{color:oklch(0% 0 0);text-shadow:none;background:oklch(100% 0 0);font-weight:500}.media-default-skin .media-button--subtle{color:inherit;text-shadow:inherit;background:0 0;&:hover,&:focus-visible,&[aria-expanded=true]{background-color:oklch(from currentColor l c h / .1);text-decoration:none}}.media-default-skin .media-button--icon{aspect-ratio:1;width:2.25rem;padding:0;display:grid;&:active{scale:.9}& .media-icon{filter:drop-shadow(0 1px 0 var(--media-controls-current-shadow-color,oklch(0% 0 0/.25)))}}.media-default-skin .media-button--seek{& .media-icon__label{font-variant-numeric:tabular-nums;font-size:10px;font-weight:480;position:absolute;bottom:-3px;right:-1px}&:has(.media-icon--flipped) .media-icon__label{right:unset;left:-1px}}.media-default-skin .media-button--playback-rate{padding:0;&:after{content:attr(data-rate) "×";font-variant-numeric:tabular-nums;width:4ch}}.media-default-skin .media-button-group{align-items:center;gap:.075rem;display:flex;@container media-root (width>42rem){gap:.125rem}}.media-default-skin .media-icon__container{position:relative}.media-default-skin .media-icon{transition-behavior:allow-discrete;flex-shrink:0;grid-area:1/1;width:18px;height:18px;transition-property:display,opacity;transition-duration:.15s;transition-timing-function:ease-out;display:block}.media-default-skin .media-icon--flipped{scale:-1 1}.media-default-skin .media-slider{cursor:pointer;border-radius:3.40282e38px;outline:none;flex:1;justify-content:center;align-items:center;display:flex;position:relative;&[data-orientation=horizontal]{width:100%;min-width:5rem;height:2rem}&[data-orientation=vertical]{width:2rem;height:5rem}}.media-default-skin .media-slider__track{isolation:isolate;border-radius:inherit;user-select:none;position:relative;overflow:hidden;&[data-orientation=horizontal]{width:100%;height:.25rem}&[data-orientation=vertical]{width:.25rem;height:100%}}.media-default-skin .media-slider__thumb{z-index:10;width:.625rem;height:.625rem;box-shadow:0 0 0 1px var(--media-controls-current-shadow-color-subtle,oklch(0% 0 0/.1)), 0 1px 3px 0 oklch(0% 0 0/.15), 0 1px 2px -1px oklch(0% 0 0/.15);opacity:0;user-select:none;outline-offset:-4px;background-color:currentColor;border-radius:3.40282e38px;outline:4px solid #0000;transition-property:opacity,height,width,outline-offset;transition-duration:.15s;transition-timing-function:ease-out;position:absolute;translate:-50% -50%;&[data-orientation=horizontal]{top:50%;left:var(--media-slider-fill)}&[data-orientation=vertical]{left:50%;top:calc(100% - var(--media-slider-fill))}&:hover,&:focus{outline-color:oklch(from currentColor l c h / .25);outline-offset:0}&:after{content:"";border-radius:inherit;transition-property:opacity,scale;transition-duration:.15s;transition-timing-function:ease-out;position:absolute;inset:-4px;box-shadow:0 0 0 2px oklch(100% 0 0)}&:not(:focus-visible):after{opacity:0;scale:.5}}.media-default-skin .media-slider:active .media-slider__thumb,.media-default-skin .media-slider__thumb--persistent{width:.75rem;height:.75rem}.media-default-skin .media-slider:hover .media-slider__thumb,.media-default-skin .media-slider__thumb:focus-visible,.media-default-skin .media-slider__thumb--persistent{opacity:1}.media-default-skin .media-slider__buffer,.media-default-skin .media-slider__fill{border-radius:inherit;pointer-events:none;position:absolute}.media-default-skin .media-slider__buffer[data-orientation=horizontal],.media-default-skin .media-slider__fill[data-orientation=horizontal]{inset-block:0;left:0}.media-default-skin .media-slider__buffer[data-orientation=vertical],.media-default-skin .media-slider__fill[data-orientation=vertical]{inset-inline:0;bottom:0}.media-default-skin .media-slider__buffer{background-color:oklch(from currentColor l c h / .2);transition-duration:.25s;transition-timing-function:ease-out;&[data-orientation=horizontal]{width:var(--media-slider-buffer);transition-property:width}&[data-orientation=vertical]{height:var(--media-slider-buffer);transition-property:height}}.media-default-skin .media-slider__fill{background-color:currentColor;&[data-orientation=horizontal]{width:var(--media-slider-fill)}&[data-orientation=vertical]{height:var(--media-slider-fill)}}.media-default-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=horizontal]{left:var(--media-slider-pointer)}.media-default-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=vertical]{top:calc(100% - var(--media-slider-pointer))}.media-default-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=horizontal]{width:var(--media-slider-pointer)}.media-default-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=vertical]{height:var(--media-slider-pointer)}.media-default-skin .media-popover,.media-default-skin .media-tooltip{color:inherit;transition-property:scale,opacity,filter;transition-duration:var(--media-popup-transition-duration);transition-timing-function:var(--media-popup-transition-timing-function);border:0;margin:0;overflow:visible;&[data-starting-style],&[data-ending-style]{opacity:0;filter:blur(8px);scale:.5}&[data-instant]{transition-duration:0s}&[data-side=top]{transform-origin:bottom}&[data-side=bottom]{transform-origin:top}&[data-side=left]{transform-origin:100%}&[data-side=right]{transform-origin:0}&:before{content:"";pointer-events:inherit;position:absolute}&[data-side=top]:before,&[data-side=bottom]:before{width:100%;inset-inline:0}&[data-side=top]:before{top:100%}&[data-side=bottom]:before{bottom:100%}&[data-side=left]:before,&[data-side=right]:before{height:100%;inset-block:0}&[data-side=left]:before{left:100%}&[data-side=right]:before{right:100%}}.media-default-skin .media-popover{&[data-side=top]:before,&[data-side=bottom]:before{height:var(--media-popover-side-offset)}&[data-side=left]:before,&[data-side=right]:before{width:var(--media-popover-side-offset)}}.media-default-skin .media-popover--volume{border-radius:3.40282e38px;padding:.75rem 0;&:has(media-volume-slider[data-availability=unsupported]){display:none}}.media-default-skin .media-tooltip{white-space:nowrap;border-radius:3.40282e38px;padding:.25rem .625rem;font-size:.75rem;&[data-side=top]:before,&[data-side=bottom]:before{height:var(--media-tooltip-side-offset)}&[data-side=left]:before,&[data-side=right]:before{width:var(--media-tooltip-side-offset)}}.media-button--play .media-icon--restart,.media-button--play .media-icon--play,.media-button--play .media-icon--pause,.media-button--mute .media-icon--volume-off,.media-button--mute .media-icon--volume-low,.media-button--mute .media-icon--volume-high{opacity:0;display:none}.media-button--play[data-ended] .media-icon--restart,.media-button--play:not([data-ended])[data-paused] .media-icon--play,.media-button--play:not([data-paused]):not([data-ended]) .media-icon--pause,.media-button--mute[data-muted] .media-icon--volume-off,.media-button--mute:not([data-muted])[data-volume-level=low] .media-icon--volume-low,.media-button--mute:not([data-muted]):not([data-volume-level=low]) .media-icon--volume-high{opacity:1;display:block}.media-default-skin--audio{--media-surface-background-color:oklch(100% 0 0/.5);--media-surface-inner-border-color:oklch(100% 0 0/.1);--media-surface-outer-border-color:oklch(0% 0 0/.05);--media-surface-shadow-color:oklch(0% 0 0/.15);--media-surface-backdrop-filter:blur(16px) saturate(1.5);--media-text-color:var(--media-color-primary,oklch(0% 0 0));--media-error-dialog-transition-duration:.25s;--media-error-dialog-transition-delay:.1s;--media-popup-transition-duration:.1s;--media-popup-transition-timing-function:ease-out;--media-tooltip-side-offset:.75rem;--media-popover-side-offset:.75rem;@media (prefers-reduced-motion:reduce){--media-error-dialog-transition-duration:50ms;--media-error-dialog-transition-delay:0s;--media-popup-transition-duration:0s}@media (prefers-color-scheme:dark){--media-surface-background-color:oklch(0% 0 0/.4);--media-text-color:var(--media-color-primary,oklch(100% 0 0))}@media (prefers-reduced-transparency:reduce) or (prefers-contrast:more){--media-surface-background-color:oklch(100% 0 0);--media-surface-outer-border-color:oklch(0% 0 0/.05)}@media (prefers-color-scheme:dark) and ((prefers-reduced-transparency:reduce) or (prefers-contrast:more)){--media-surface-background-color:oklch(0% 0 0);--media-surface-inner-border-color:oklch(100% 0 0/.2);--media-surface-outer-border-color:transparent}}.media-default-skin--audio .media-error__dialog{z-index:20;transition-property:opacity,filter;transition-duration:var(--media-error-dialog-transition-duration);transition-delay:var(--media-error-dialog-transition-delay);background-color:var(--media-surface-background-color);backdrop-filter:var(--media-surface-backdrop-filter);color:var(--media-text-color);border-radius:3.40282e38px;align-items:center;gap:.75rem;padding-inline:1.25rem .125rem;transition-timing-function:ease-out;display:flex;position:absolute;inset:0}.media-default-skin .media-error[data-starting-style] .media-error__dialog,.media-default-skin .media-error[data-ending-style] .media-error__dialog{opacity:0;filter:blur(4px)}.media-default-skin .media-error[data-ending-style] .media-error__dialog{transition-delay:0s}.media-default-skin--audio .media-error__content{flex:1;align-items:center;gap:.5rem;display:flex}.media-default-skin--audio .media-controls{color:var(--media-text-color)}.media-default-skin--audio .media-slider__track{background-color:oklch(0% 0 0/.1);@media (prefers-color-scheme:dark){background-color:oklch(100% 0 0/.2);box-shadow:0 0 0 1px oklch(0% 0 0/.05)}}`;function o(){return`<media-container class="media-default-skin media-default-skin--audio"><slot name="media"></slot><slot></slot><media-error-dialog class="media-error"><div class="media-error__dialog"><div class="media-error__content"><media-alert-dialog-title class="media-error__title">Something went wrong.</media-alert-dialog-title><media-alert-dialog-description class="media-error__description"></media-alert-dialog-description></div><div class="media-error__actions"><media-alert-dialog-close class="media-button media-button--subtle">OK</media-alert-dialog-close></div></div></media-error-dialog><div class="media-surface media-controls"><media-tooltip-group><div class="media-button-group"><media-play-button commandfor="play-tooltip" class="media-button media-button--subtle media-button--icon media-button--play"> ${e(`restart`,{class:`media-icon media-icon--restart`})} ${e(`play`,{class:`media-icon media-icon--play`})} ${e(`pause`,{class:`media-icon media-icon--pause`})} </media-play-button><media-tooltip id="play-tooltip" side="top" class="media-surface media-tooltip"></media-tooltip><media-seek-button commandfor="seek-backward-tooltip" seconds="-10" class="media-button media-button--subtle media-button--icon media-button--seek"> <span class="media-icon__container"> ${e(`seek`,{class:`media-icon media-icon--seek media-icon--flipped`})} <span class="media-icon__label">10</span></span></media-seek-button><media-tooltip id="seek-backward-tooltip" side="top" class="media-surface media-tooltip"> Seek backward 10 seconds </media-tooltip><media-seek-button commandfor="seek-forward-tooltip" seconds="10" class="media-button media-button--subtle media-button--icon media-button--seek"> <span class="media-icon__container"> ${e(`seek`,{class:`media-icon media-icon--seek`})} <span class="media-icon__label">10</span></span></media-seek-button><media-tooltip id="seek-forward-tooltip" side="top" class="media-surface media-tooltip"> Seek forward 10 seconds </media-tooltip></div><div class="media-time-controls"><media-time type="current" class="media-time"></media-time><media-time-slider class="media-slider"><media-slider-track class="media-slider__track"><media-slider-fill class="media-slider__fill"></media-slider-fill><media-slider-buffer class="media-slider__buffer"></media-slider-buffer></media-slider-track><media-slider-thumb class="media-slider__thumb"></media-slider-thumb></media-time-slider><media-time type="duration" class="media-time"></media-time></div><div class="media-button-group"><media-playback-rate-button commandfor="playback-rate-tooltip" class="media-button media-button--subtle media-button--icon media-button--playback-rate"></media-playback-rate-button><media-tooltip id="playback-rate-tooltip" side="top" class="media-surface media-tooltip"> Toggle playback rate </media-tooltip><media-mute-button commandfor="audio-volume-popover" class="media-button media-button--subtle media-button--icon media-button--mute"> ${e(`volume-off`,{class:`media-icon media-icon--volume-off`})} ${e(`volume-low`,{class:`media-icon media-icon--volume-low`})} ${e(`volume-high`,{class:`media-icon media-icon--volume-high`})} </media-mute-button><media-popover id="audio-volume-popover" open-on-hover delay="200" close-delay="100" side="top" class="media-surface media-popover media-popover--volume"><media-volume-slider class="media-slider" orientation="vertical" thumb-alignment="edge"><media-slider-track class="media-slider__track"><media-slider-fill class="media-slider__fill"></media-slider-fill></media-slider-track><media-slider-thumb class="media-slider__thumb media-slider__thumb--persistent"></media-slider-thumb></media-volume-slider></media-popover></div></media-tooltip-group></div><media-hotkey keys="Space" action="togglePaused"></media-hotkey><media-hotkey keys="k" action="togglePaused"></media-hotkey><media-hotkey keys="m" action="toggleMuted"></media-hotkey><media-hotkey keys="ArrowRight" action="seekStep" value="5"></media-hotkey><media-hotkey keys="ArrowLeft" action="seekStep" value="-5"></media-hotkey><media-hotkey keys="l" action="seekStep" value="10"></media-hotkey><media-hotkey keys="j" action="seekStep" value="-10"></media-hotkey><media-hotkey keys="ArrowUp" action="volumeStep" value="0.05"></media-hotkey><media-hotkey keys="ArrowDown" action="volumeStep" value="-0.05"></media-hotkey><media-hotkey keys="0-9" action="seekToPercent"></media-hotkey><media-hotkey keys="Home" action="seekToPercent" value="0"></media-hotkey><media-hotkey keys="End" action="seekToPercent" value="100"></media-hotkey><media-hotkey keys=">" action="speedUp"></media-hotkey><media-hotkey keys="<" action="speedDown"></media-hotkey></media-container>`}i(class extends r{static{this.tagName=`audio-skin`}static{this.styles=t(a)}static{this.template=n(o())}});
+import{t as e}from"./default-Djy9PEXm.js";import"./compounds-CCgS3IGo.js";import{n as t}from"./shadow-styles-BYZ6q3Q4.js";import{n,t as r}from"./skin-element-DM82PPxz.js";import{o as i}from"./context-CEFisYD0.js";import"./player-ChdQN3H5.js";import"./ui-BGvi0TNr.js";var a=`video-player{display:contents}video-player video,video-player [slot=poster]{width:100%;height:100%;display:block}video-player video::-webkit-media-text-track-container{transition:translate var(--media-caption-track-duration,0) ease-out;transition-delay:var(--media-caption-track-delay,0);translate:0 var(--media-caption-track-y,0);z-index:1;font-family:inherit;scale:.98}media-tooltip-group{display:contents}:host{width:100%;display:grid}.media-popover--volume:has(media-volume-slider[data-availability=unsupported]){display:none}.media-default-skin *,.media-default-skin :before,.media-default-skin :after{box-sizing:border-box}.media-default-skin img,.media-default-skin video,.media-default-skin svg{max-width:100%;display:block}.media-default-skin button{font:inherit}@media (prefers-reduced-motion:no-preference){.media-default-skin{interpolate-size:allow-keywords}}.media-default-skin{isolation:isolate;border-radius:var(--media-border-radius,2rem);outline-offset:2px;outline:2px solid #0000;width:100%;height:100%;display:block;position:relative;container:media-root/inline-size;&:focus-visible{outline-color:currentColor}letter-spacing:normal;-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;font-family:Inter Variable,Inter,ui-sans-serif,system-ui,sans-serif;line-height:1.5;&>*{font-size:.75rem}@container media-root (width>48rem){&>*{font-size:.875rem}}}.media-default-skin .media-surface{background-color:var(--media-surface-background-color);backdrop-filter:var(--media-surface-backdrop-filter);box-shadow:0 0 0 1px var(--media-surface-outer-border-color), 0 1px 3px 0 var(--media-surface-shadow-color), 0 1px 2px -1px var(--media-surface-shadow-color);&:after{content:"";z-index:10;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--media-surface-inner-border-color);pointer-events:none;position:absolute;inset:0}}.media-default-skin .media-buffering-indicator{color:oklch(100% 0 0);pointer-events:none;justify-content:center;align-items:center;display:none;position:absolute;inset:0;&[data-visible]{display:flex}& .media-surface{border-radius:100%;padding:.25rem}}.media-default-skin .media-error{outline:none}.media-default-skin .media-error:not([data-open]){display:none}.media-default-skin .media-error__title{font-weight:600;line-height:1.25}.media-default-skin .media-error__description{opacity:.7;overflow-wrap:anywhere}.media-default-skin .media-error__actions{gap:.5rem;display:flex;&>*{flex:1}}.media-default-skin .media-error[data-open]~.media-controls *{visibility:hidden}.media-default-skin .media-controls{--media-controls-current-shadow-color:oklch(from currentColor 0 0 0 / clamp(0, calc((l - .5) * .5), .15));--media-controls-current-shadow-color-subtle:oklch(from var(--media-controls-current-shadow-color) l c h / calc(alpha * .4));text-shadow:0 1px 0 var(--media-controls-current-shadow-color);border-radius:1.5rem;align-items:center;column-gap:.075rem;padding:.375rem;display:flex;container:media-controls/inline-size}.media-default-skin .media-time-controls{flex:1;align-items:center;gap:.75rem;padding-inline:.5rem;display:flex;container:media-time-controls/inline-size}.media-default-skin .media-time{font-variant-numeric:tabular-nums}.media-default-skin .media-button{outline-offset:-2px;will-change:scale;cursor:pointer;user-select:none;text-align:center;touch-action:manipulation;border:none;border-radius:3.40282e38px;outline:2px solid #0000;flex-shrink:0;justify-content:center;align-items:center;padding:.5rem 1rem;transition-property:background-color,outline-offset,scale;transition-duration:.15s;transition-timing-function:ease-out;display:flex;&:focus-visible{outline-offset:2px;outline-color:currentColor}&:active{scale:.98}&[disabled]{opacity:.5;filter:grayscale();cursor:not-allowed}&[data-availability=unavailable]{display:none}}.media-default-skin .media-button--primary{color:oklch(0% 0 0);text-shadow:none;background:oklch(100% 0 0);font-weight:500}.media-default-skin .media-button--subtle{color:inherit;text-shadow:inherit;background:0 0;&:hover,&:focus-visible,&[aria-expanded=true]{background-color:oklch(from currentColor l c h / .1);text-decoration:none}}.media-default-skin .media-button--icon{aspect-ratio:1;width:2.25rem;padding:0;display:grid;&:active{scale:.9}& .media-icon{filter:drop-shadow(0 1px 0 var(--media-controls-current-shadow-color,oklch(0% 0 0/.25)))}}.media-default-skin .media-button--seek{& .media-icon__label{font-variant-numeric:tabular-nums;font-size:10px;font-weight:480;position:absolute;bottom:-3px;right:-1px}&:has(.media-icon--flipped) .media-icon__label{right:unset;left:-1px}}.media-default-skin .media-button--playback-rate{padding:0;&:after{content:attr(data-rate) "×";font-variant-numeric:tabular-nums;width:4ch}}.media-default-skin .media-button-group{align-items:center;gap:.075rem;display:flex;@container media-root (width>42rem){gap:.125rem}}.media-default-skin .media-icon__container{position:relative}.media-default-skin .media-icon{transition-behavior:allow-discrete;flex-shrink:0;grid-area:1/1;width:18px;height:18px;transition-property:display,opacity;transition-duration:.15s;transition-timing-function:ease-out;display:block}.media-default-skin .media-icon--flipped{scale:-1 1}.media-default-skin .media-slider{cursor:pointer;border-radius:3.40282e38px;outline:none;flex:1;justify-content:center;align-items:center;display:flex;position:relative;&[data-orientation=horizontal]{width:100%;min-width:5rem;height:2rem}&[data-orientation=vertical]{width:2rem;height:5rem}}.media-default-skin .media-slider__track{isolation:isolate;border-radius:inherit;user-select:none;position:relative;overflow:hidden;&[data-orientation=horizontal]{width:100%;height:.25rem}&[data-orientation=vertical]{width:.25rem;height:100%}}.media-default-skin .media-slider__thumb{z-index:10;width:.625rem;height:.625rem;box-shadow:0 0 0 1px var(--media-controls-current-shadow-color-subtle,oklch(0% 0 0/.1)), 0 1px 3px 0 oklch(0% 0 0/.15), 0 1px 2px -1px oklch(0% 0 0/.15);opacity:0;user-select:none;outline-offset:-4px;background-color:currentColor;border-radius:3.40282e38px;outline:4px solid #0000;transition-property:opacity,height,width,outline-offset;transition-duration:.15s;transition-timing-function:ease-out;position:absolute;translate:-50% -50%;&[data-orientation=horizontal]{top:50%;left:var(--media-slider-fill)}&[data-orientation=vertical]{left:50%;top:calc(100% - var(--media-slider-fill))}&:hover,&:focus{outline-color:oklch(from currentColor l c h / .25);outline-offset:0}&:after{content:"";border-radius:inherit;transition-property:opacity,scale;transition-duration:.15s;transition-timing-function:ease-out;position:absolute;inset:-4px;box-shadow:0 0 0 2px oklch(100% 0 0)}&:not(:focus-visible):after{opacity:0;scale:.5}}.media-default-skin .media-slider:active .media-slider__thumb,.media-default-skin .media-slider__thumb--persistent{width:.75rem;height:.75rem}.media-default-skin .media-slider:hover .media-slider__thumb,.media-default-skin .media-slider__thumb:focus-visible,.media-default-skin .media-slider__thumb--persistent{opacity:1}.media-default-skin .media-slider__buffer,.media-default-skin .media-slider__fill{border-radius:inherit;pointer-events:none;position:absolute}.media-default-skin .media-slider__buffer[data-orientation=horizontal],.media-default-skin .media-slider__fill[data-orientation=horizontal]{inset-block:0;left:0}.media-default-skin .media-slider__buffer[data-orientation=vertical],.media-default-skin .media-slider__fill[data-orientation=vertical]{inset-inline:0;bottom:0}.media-default-skin .media-slider__buffer{background-color:oklch(from currentColor l c h / .2);transition-duration:.25s;transition-timing-function:ease-out;&[data-orientation=horizontal]{width:var(--media-slider-buffer);transition-property:width}&[data-orientation=vertical]{height:var(--media-slider-buffer);transition-property:height}}.media-default-skin .media-slider__fill{background-color:currentColor;&[data-orientation=horizontal]{width:var(--media-slider-fill)}&[data-orientation=vertical]{height:var(--media-slider-fill)}}.media-default-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=horizontal]{left:var(--media-slider-pointer)}.media-default-skin .media-slider[data-dragging] .media-slider__thumb[data-orientation=vertical]{top:calc(100% - var(--media-slider-pointer))}.media-default-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=horizontal]{width:var(--media-slider-pointer)}.media-default-skin .media-slider[data-dragging] .media-slider__fill[data-orientation=vertical]{height:var(--media-slider-pointer)}.media-default-skin .media-popover,.media-default-skin .media-tooltip{color:inherit;transition-property:scale,opacity,filter;transition-duration:var(--media-popup-transition-duration);transition-timing-function:var(--media-popup-transition-timing-function);border:0;margin:0;overflow:visible;&[data-starting-style],&[data-ending-style]{opacity:0;filter:blur(8px);scale:.5}&[data-instant]{transition-duration:0s}&[data-side=top]{transform-origin:bottom}&[data-side=bottom]{transform-origin:top}&[data-side=left]{transform-origin:100%}&[data-side=right]{transform-origin:0}&:before{content:"";pointer-events:inherit;position:absolute}&[data-side=top]:before,&[data-side=bottom]:before{width:100%;inset-inline:0}&[data-side=top]:before{top:100%}&[data-side=bottom]:before{bottom:100%}&[data-side=left]:before,&[data-side=right]:before{height:100%;inset-block:0}&[data-side=left]:before{left:100%}&[data-side=right]:before{right:100%}}.media-default-skin .media-popover{&[data-side=top]:before,&[data-side=bottom]:before{height:var(--media-popover-side-offset)}&[data-side=left]:before,&[data-side=right]:before{width:var(--media-popover-side-offset)}}.media-default-skin .media-popover--volume{border-radius:3.40282e38px;padding:.75rem 0;&:has(media-volume-slider[data-availability=unsupported]){display:none}}.media-default-skin .media-tooltip{white-space:nowrap;border-radius:3.40282e38px;padding:.25rem .625rem;font-size:.75rem;&[data-side=top]:before,&[data-side=bottom]:before{height:var(--media-tooltip-side-offset)}&[data-side=left]:before,&[data-side=right]:before{width:var(--media-tooltip-side-offset)}}.media-button--play .media-icon--restart,.media-button--play .media-icon--play,.media-button--play .media-icon--pause,.media-button--mute .media-icon--volume-off,.media-button--mute .media-icon--volume-low,.media-button--mute .media-icon--volume-high{opacity:0;display:none}.media-button--play[data-ended] .media-icon--restart,.media-button--play:not([data-ended])[data-paused] .media-icon--play,.media-button--play:not([data-paused]):not([data-ended]) .media-icon--pause,.media-button--mute[data-muted] .media-icon--volume-off,.media-button--mute:not([data-muted])[data-volume-level=low] .media-icon--volume-low,.media-button--mute:not([data-muted]):not([data-volume-level=low]) .media-icon--volume-high{opacity:1;display:block}.media-default-skin--audio{--media-surface-background-color:oklch(100% 0 0/.5);--media-surface-inner-border-color:oklch(100% 0 0/.1);--media-surface-outer-border-color:oklch(0% 0 0/.05);--media-surface-shadow-color:oklch(0% 0 0/.15);--media-surface-backdrop-filter:blur(16px) saturate(1.5);--media-text-color:var(--media-color-primary,oklch(0% 0 0));--media-error-dialog-transition-duration:.25s;--media-error-dialog-transition-delay:.1s;--media-popup-transition-duration:.1s;--media-popup-transition-timing-function:ease-out;--media-tooltip-side-offset:.75rem;--media-popover-side-offset:.75rem;@media (prefers-reduced-motion:reduce){--media-error-dialog-transition-duration:50ms;--media-error-dialog-transition-delay:0s;--media-popup-transition-duration:0s}@media (prefers-color-scheme:dark){--media-surface-background-color:oklch(0% 0 0/.4);--media-text-color:var(--media-color-primary,oklch(100% 0 0))}@media (prefers-reduced-transparency:reduce) or (prefers-contrast:more){--media-surface-background-color:oklch(100% 0 0);--media-surface-outer-border-color:oklch(0% 0 0/.05)}@media (prefers-color-scheme:dark) and ((prefers-reduced-transparency:reduce) or (prefers-contrast:more)){--media-surface-background-color:oklch(0% 0 0);--media-surface-inner-border-color:oklch(100% 0 0/.2);--media-surface-outer-border-color:transparent}}.media-default-skin--audio .media-error__dialog{z-index:20;transition-property:opacity,filter;transition-duration:var(--media-error-dialog-transition-duration);transition-delay:var(--media-error-dialog-transition-delay);background-color:var(--media-surface-background-color);backdrop-filter:var(--media-surface-backdrop-filter);color:var(--media-text-color);border-radius:3.40282e38px;align-items:center;gap:.75rem;padding-inline:1.25rem .125rem;transition-timing-function:ease-out;display:flex;position:absolute;inset:0}.media-default-skin .media-error[data-starting-style] .media-error__dialog,.media-default-skin .media-error[data-ending-style] .media-error__dialog{opacity:0;filter:blur(4px)}.media-default-skin .media-error[data-ending-style] .media-error__dialog{transition-delay:0s}.media-default-skin--audio .media-error__content{flex:1;align-items:center;gap:.5rem;display:flex}.media-default-skin--audio .media-controls{color:var(--media-text-color)}.media-default-skin--audio .media-slider__track{background-color:oklch(0% 0 0/.1);@media (prefers-color-scheme:dark){background-color:oklch(100% 0 0/.2);box-shadow:0 0 0 1px oklch(0% 0 0/.05)}}`;function o(){return`<media-container class="media-default-skin media-default-skin--audio"><slot name="media"></slot><slot></slot><media-error-dialog class="media-error"><div class="media-error__dialog"><div class="media-error__content"><media-alert-dialog-title class="media-error__title">Something went wrong.</media-alert-dialog-title><media-alert-dialog-description class="media-error__description"></media-alert-dialog-description></div><div class="media-error__actions"><media-alert-dialog-close class="media-button media-button--subtle">OK</media-alert-dialog-close></div></div></media-error-dialog><div class="media-surface media-controls"><media-tooltip-group><div class="media-button-group"><media-play-button commandfor="play-tooltip" class="media-button media-button--subtle media-button--icon media-button--play"> ${e(`restart`,{class:`media-icon media-icon--restart`})} ${e(`play`,{class:`media-icon media-icon--play`})} ${e(`pause`,{class:`media-icon media-icon--pause`})} </media-play-button><media-tooltip id="play-tooltip" side="top" class="media-surface media-tooltip"></media-tooltip><media-seek-button commandfor="seek-backward-tooltip" seconds="-10" class="media-button media-button--subtle media-button--icon media-button--seek"> <span class="media-icon__container"> ${e(`seek`,{class:`media-icon media-icon--seek media-icon--flipped`})} <span class="media-icon__label">10</span></span></media-seek-button><media-tooltip id="seek-backward-tooltip" side="top" class="media-surface media-tooltip"> Seek backward 10 seconds </media-tooltip><media-seek-button commandfor="seek-forward-tooltip" seconds="10" class="media-button media-button--subtle media-button--icon media-button--seek"> <span class="media-icon__container"> ${e(`seek`,{class:`media-icon media-icon--seek`})} <span class="media-icon__label">10</span></span></media-seek-button><media-tooltip id="seek-forward-tooltip" side="top" class="media-surface media-tooltip"> Seek forward 10 seconds </media-tooltip></div><div class="media-time-controls"><media-time type="current" class="media-time"></media-time><media-time-slider class="media-slider"><media-slider-track class="media-slider__track"><media-slider-fill class="media-slider__fill"></media-slider-fill><media-slider-buffer class="media-slider__buffer"></media-slider-buffer></media-slider-track><media-slider-thumb class="media-slider__thumb"></media-slider-thumb></media-time-slider><media-time type="duration" class="media-time"></media-time></div><div class="media-button-group"><media-playback-rate-button commandfor="playback-rate-tooltip" class="media-button media-button--subtle media-button--icon media-button--playback-rate"></media-playback-rate-button><media-tooltip id="playback-rate-tooltip" side="top" class="media-surface media-tooltip"> Toggle playback rate </media-tooltip><media-mute-button commandfor="audio-volume-popover" class="media-button media-button--subtle media-button--icon media-button--mute"> ${e(`volume-off`,{class:`media-icon media-icon--volume-off`})} ${e(`volume-low`,{class:`media-icon media-icon--volume-low`})} ${e(`volume-high`,{class:`media-icon media-icon--volume-high`})} </media-mute-button><media-popover id="audio-volume-popover" open-on-hover delay="200" close-delay="100" side="top" class="media-surface media-popover media-popover--volume"><media-volume-slider class="media-slider" orientation="vertical" thumb-alignment="edge"><media-slider-track class="media-slider__track"><media-slider-fill class="media-slider__fill"></media-slider-fill></media-slider-track><media-slider-thumb class="media-slider__thumb media-slider__thumb--persistent"></media-slider-thumb></media-volume-slider></media-popover></div></media-tooltip-group></div><media-hotkey keys="Space" action="togglePaused"></media-hotkey><media-hotkey keys="k" action="togglePaused"></media-hotkey><media-hotkey keys="m" action="toggleMuted"></media-hotkey><media-hotkey keys="ArrowRight" action="seekStep" value="5"></media-hotkey><media-hotkey keys="ArrowLeft" action="seekStep" value="-5"></media-hotkey><media-hotkey keys="l" action="seekStep" value="10"></media-hotkey><media-hotkey keys="j" action="seekStep" value="-10"></media-hotkey><media-hotkey keys="ArrowUp" action="volumeStep" value="0.05"></media-hotkey><media-hotkey keys="ArrowDown" action="volumeStep" value="-0.05"></media-hotkey><media-hotkey keys="0-9" action="seekToPercent"></media-hotkey><media-hotkey keys="Home" action="seekToPercent" value="0"></media-hotkey><media-hotkey keys="End" action="seekToPercent" value="100"></media-hotkey><media-hotkey keys=">" action="speedUp"></media-hotkey><media-hotkey keys="<" action="speedDown"></media-hotkey></media-container>`}i(class extends r{static{this.tagName=`audio-skin`}static{this.styles=t(a)}static{this.template=n(o())}});
 //# sourceMappingURL=audio.js.map

package/cdn/background.dev.js

@@ -1,5 +1,5 @@
 import { n as namedNodeMapToObject, t as MediaAttachMixin } from "./media-attach-mixin-CYoNe7Sh.js";
-import { D as MediaContainerElement, O as MediaElement, a as backgroundFeatures, j as ReactiveElement, t as createPlayer } from "./create-player-Bi6WUwDZ.js";
+import { M as ReactiveElement, O as MediaContainerElement, a as backgroundFeatures, k as MediaElement, t as createPlayer } from "./create-player-BKLw7l1a.js";
 import { r as ensureGlobalStyle } from "./shadow-styles-DKXFMmyD.js";
 import { o as safeDefine } from "./context-0rI_P6jf.js";
 

package/cdn/background.js

@@ -1,2 +1,2 @@
-import{n as e,t}from"./media-attach-mixin-C2wz0Qbd.js";import{D as n,O as r,a as i,j as a,t as o}from"./create-player-CKuX8YI5.js";import{r as s}from"./shadow-styles-BYZ6q3Q4.js";import{o as c}from"./context-CEFisYD0.js";const{ProviderMixin:l}=o({features:i});c(class extends l(r){static{this.tagName=`background-video-player`}}),c(n);var u=`background-video-player{display:contents}background-video-skin{--media-object-fit:cover;object-fit:var(--media-object-fit);width:100%;height:100%;display:block;position:relative}background-video-skin>background-video{object-fit:inherit;width:100%;height:100%;position:absolute;inset:0}background-video-skin>img,background-video-skin>picture{object-fit:inherit;width:100%;height:100%}`;function d(e){return`<media-container><slot name="media"></slot><slot></slot></media-container>`}c(class extends a{static{this.tagName=`background-video-skin`}static{this.shadowRootOptions={mode:`open`}}static{this.getTemplateHTML=d}constructor(){super(),s(`__media-background-styles`,u),this.shadowRoot||(this.attachShadow(this.constructor.shadowRootOptions),this.shadowRoot.innerHTML=d(e(this.attributes)))}});function f(e){return`<style> :host { position: relative; } video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: var(--media-object-fit, inherit); object-position: var(--media-object-position, 50% 50%); } </style><slot></slot><video ${h(e)}></video>`}var p=class extends t(HTMLElement){static{this.shadowRootOptions={mode:`open`}}static{this.getTemplateHTML=f}static get observedAttributes(){return[`src`]}constructor(){if(super(),!this.shadowRoot){this.attachShadow(this.constructor.shadowRootOptions);let t={...e(this.attributes),...!this.hasAttribute(`nomuted`)&&{muted:``},...!this.hasAttribute(`noloop`)&&{loop:``},...!this.hasAttribute(`noautoplay`)&&{autoplay:``},playsinline:``,disableremoteplayback:``,disablepictureinpicture:``};this.shadowRoot.innerHTML=f(t)}this.target.muted=!this.hasAttribute(`nomuted`)}getMediaTarget(){return this.target}attributeChangedCallback(e,t,n){e===`src`&&t!==n&&(this.target.src=n??``)}get target(){return this.querySelector(`:scope > [slot=media]`)??this.querySelector(`video`)??this.shadowRoot?.querySelector(`video`)??null}};const m=[`autoplay`,`controls`,`controlslist`,`crossorigin`,`disablepictureinpicture`,`disableremoteplayback`,`loop`,`muted`,`playsinline`,`preload`];function h(e){let t=``;for(let n in e){if(!m.includes(n))continue;let r=e[n];r===``?t+=` ${n}`:t+=` ${n}="${r}"`}return t}c(class extends p{static{this.tagName=`background-video`}});
+import{n as e,t}from"./media-attach-mixin-C2wz0Qbd.js";import{M as n,O as r,a as i,k as a,t as o}from"./create-player-B-PGzhq2.js";import{r as s}from"./shadow-styles-BYZ6q3Q4.js";import{o as c}from"./context-CEFisYD0.js";const{ProviderMixin:l}=o({features:i});c(class extends l(a){static{this.tagName=`background-video-player`}}),c(r);var u=`background-video-player{display:contents}background-video-skin{--media-object-fit:cover;object-fit:var(--media-object-fit);width:100%;height:100%;display:block;position:relative}background-video-skin>background-video{object-fit:inherit;width:100%;height:100%;position:absolute;inset:0}background-video-skin>img,background-video-skin>picture{object-fit:inherit;width:100%;height:100%}`;function d(e){return`<media-container><slot name="media"></slot><slot></slot></media-container>`}c(class extends n{static{this.tagName=`background-video-skin`}static{this.shadowRootOptions={mode:`open`}}static{this.getTemplateHTML=d}constructor(){super(),s(`__media-background-styles`,u),this.shadowRoot||(this.attachShadow(this.constructor.shadowRootOptions),this.shadowRoot.innerHTML=d(e(this.attributes)))}});function f(e){return`<style> :host { position: relative; } video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: var(--media-object-fit, inherit); object-position: var(--media-object-position, 50% 50%); } </style><slot></slot><video ${h(e)}></video>`}var p=class extends t(HTMLElement){static{this.shadowRootOptions={mode:`open`}}static{this.getTemplateHTML=f}static get observedAttributes(){return[`src`]}constructor(){if(super(),!this.shadowRoot){this.attachShadow(this.constructor.shadowRootOptions);let t={...e(this.attributes),...!this.hasAttribute(`nomuted`)&&{muted:``},...!this.hasAttribute(`noloop`)&&{loop:``},...!this.hasAttribute(`noautoplay`)&&{autoplay:``},playsinline:``,disableremoteplayback:``,disablepictureinpicture:``};this.shadowRoot.innerHTML=f(t)}this.target.muted=!this.hasAttribute(`nomuted`)}getMediaTarget(){return this.target}attributeChangedCallback(e,t,n){e===`src`&&t!==n&&(this.target.src=n??``)}get target(){return this.querySelector(`:scope > [slot=media]`)??this.querySelector(`video`)??this.shadowRoot?.querySelector(`video`)??null}};const m=[`autoplay`,`controls`,`controlslist`,`crossorigin`,`disablepictureinpicture`,`disableremoteplayback`,`loop`,`muted`,`playsinline`,`preload`];function h(e){let t=``;for(let n in e){if(!m.includes(n))continue;let r=e[n];r===``?t+=` ${n}`:t+=` ${n}="${r}"`}return t}c(class extends p{static{this.tagName=`background-video`}});
 //# sourceMappingURL=background.js.map

package/cdn/compounds-CCgS3IGo.js

@@ -0,0 +1,8 @@
+import{A as e,C as t,D as n,E as r,N as i,P as a,S as o,T as s,b as c,c as l,d as u,f as d,g as f,h as p,j as m,k as h,l as g,m as _,n as v,p as y,r as b,s as ee,u as te,v as ne,w as x,x as re,y as ie}from"./create-player-B-PGzhq2.js";import{t as S}from"./listen-DFX-0NbX.js";import{n as ae,t as oe}from"./pick-CERGq1No.js";import{i as C,o as w,r as T,t as se}from"./context-CEFisYD0.js";function ce(e){let t=e.closest(`[dir]`)?.getAttribute(`dir`);return t?t.toLowerCase()===`rtl`:getComputedStyle(e).direction===`rtl`}function E(){return typeof CSS<`u`&&CSS.supports(`anchor-name: --a`)}function le(){return typeof navigator<`u`&&/mac/i.test(navigator.userAgent)}function D(e){try{e?.showPopover?.()}catch{}}function O(e){try{e?.hidePopover?.()}catch{}}function k(e,t){for(let[n,r]of Object.entries(t))if(typeof r==`string`){let t=n.startsWith(`--`)?n:ae(n);e.style.setProperty(t,r)}}function ue(e,t){let n=t.trim();if(!n)return 0;let r=Number.parseFloat(n);if(Number.isNaN(r))return 0;if(/^-?\d*\.?\d+$/.test(n)||n.endsWith(`px`))return r;let i=e.ownerDocument,a=i?.documentElement;if(n.endsWith(`rem`))return r*(a&&Number.parseFloat(getComputedStyle(a).fontSize)||16);if(n.endsWith(`em`))return r*(e instanceof HTMLElement&&Number.parseFloat(getComputedStyle(e).fontSize)||16);if(!i)return r;let o=i.createElement(`div`);o.style.position=`absolute`,o.style.visibility=`hidden`,o.style.pointerEvents=`none`,o.style.inlineSize=n,o.style.blockSize=`0`,o.style.padding=`0`,o.style.border=`0`,o.style.inset=`0`;let s=i.body??i.documentElement;if(!s)return r;s.appendChild(o);let c=o.getBoundingClientRect().width;return o.remove(),Number.isFinite(c)?c:r}function A(e){return{transitionStarting:e===`starting`,transitionEnding:e===`ending`}}var de=class{static defaultProps={open:!1,defaultOpen:!1};setProps(e){}#e=null;#t=void 0;#n=void 0;setInput(e){this.#e=e}setTitleId(e){this.#t=e}setDescriptionId(e){this.#n=e}getState(){let e=this.#e;return{open:e.active,status:e.status,titleId:this.#t,descriptionId:this.#n,...A(e.status)}}getAttrs(e){return{role:`alertdialog`,"aria-modal":`true`,"aria-labelledby":e.titleId,"aria-describedby":e.descriptionId}}};const fe={open:`data-open`,transitionStarting:`data-starting-style`,transitionEnding:`data-ending-style`};function j(e,t){let r={...t};for(let t in e)n(e[t])||(r[t]=e[t]);return r}const pe={target:o,signals:new t,get:o,set:o};function M(e){let t=e.state(pe),n=Object.keys(t),r=n[0];return r?Object.assign(e=>{if(r in e)return oe(e,n)},{displayName:e.name}):Object.assign(()=>void 0,{displayName:e.name})}function me(e,t,n){let r=n?.leading??!1,i=null,a,o=!1;function s(){i=setTimeout(()=>{i=null,o&&(o=!1,e(...a),s())},t)}let c=(...n)=>{if(a=n,r)i===null?(e(...a),s()):o=!0;else{if(i!==null)return;i=setTimeout(()=>{i=null,e(...a)},t)}};return c.cancel=()=>{i!==null&&(clearTimeout(i),i=null),o=!1},c}var he=class{#e=null;setMedia(e){this.#e=e}getState(){let e=this.#e;return{visible:e.controlsVisible,userActive:e.userActive}}};const ge={visible:`data-visible`,userActive:`data-user-active`};var _e=class extends de{setProps(){}},ve=class e{static defaultProps={label:``,disabled:!1};state=c({muted:!1,volumeLevel:`off`,label:``});#e={...e.defaultProps};#t=null;constructor(e){e&&this.setProps(e)}setProps(t){this.#e=j(t,e.defaultProps)}getLabel(e){let{label:t}=this.#e;if(x(t)){let n=t(e);if(n)return n}else if(t)return t;return e.muted?`Unmute`:`Mute`}getAttrs(e){return{"aria-label":this.getLabel(e),"aria-disabled":this.#e.disabled?`true`:void 0}}setMedia(e){this.#t=e}getState(){let e=this.#t;return this.state.patch({muted:e.muted||e.volume===0,volumeLevel:ye(e)}),this.state.patch({label:this.getLabel(this.state.current)}),this.state.current}toggle(e){this.#e.disabled||e.toggleMuted()}};function ye(e){return e.muted||e.volume===0?`off`:e.volume<.5?`low`:e.volume<.75?`medium`:`high`}const be={muted:`data-muted`,volumeLevel:`data-volume-level`};var xe=class e{static defaultProps={label:``,disabled:!1};state=c({paused:!0,ended:!1,started:!1,label:``});#e={...e.defaultProps};#t=null;constructor(e){e&&this.setProps(e)}setProps(t){this.#e=j(t,e.defaultProps)}getLabel(e){let{label:t}=this.#e;if(x(t)){let n=t(e);if(n)return n}else if(t)return t;return e.ended?`Replay`:e.paused?`Play`:`Pause`}getAttrs(e){return{"aria-label":this.getLabel(e),"aria-disabled":this.#e.disabled?`true`:void 0}}setMedia(e){this.#t=e}getState(){let e=this.#t;return this.state.patch({paused:e.paused,ended:e.ended,started:e.started}),this.state.patch({label:this.getLabel(this.state.current)}),this.state.current}async toggle(e){if(!this.#e.disabled){if(e.paused||e.ended)return e.play();e.pause()}}};const Se={paused:`data-paused`,ended:`data-ended`,started:`data-started`};var Ce=class e{static defaultProps={label:``,disabled:!1};state=c({rate:1,label:``});#e={...e.defaultProps};#t=null;constructor(e){e&&this.setProps(e)}setProps(t){this.#e=j(t,e.defaultProps)}getLabel(e){let{label:t}=this.#e;if(x(t)){let n=t(e);if(n)return n}else if(t)return t;return`Playback rate ${e.rate}`}getAttrs(e){return{"aria-label":this.getLabel(e),"aria-disabled":this.#e.disabled?`true`:void 0}}setMedia(e){this.#t=e}getState(){let e=this.#t;return this.state.patch({rate:e.playbackRate}),this.state.patch({label:this.getLabel(this.state.current)}),this.state.current}cycle(e){if(this.#e.disabled)return;let{playbackRates:t,playbackRate:n}=e;if(t.length===0)return;let r=t.indexOf(n),i=r===-1?t.find(e=>e>n)??t[0]:t[(r+1)%t.length];e.setPlaybackRate(i)}};const we={rate:`data-rate`};var N=class e{static defaultProps={side:`top`,align:`center`,modal:!1,closeOnEscape:!0,closeOnOutsideClick:!0,open:!1,defaultOpen:!1,openOnHover:!1,delay:300,closeDelay:0};#e={...e.defaultProps};constructor(e){e&&this.setProps(e)}setProps(t){this.#e=j(t,e.defaultProps)}#t=null;setInput(e){this.#t=e}getState(){let e=this.#t;return{open:e.active,status:e.status,side:this.#e.side,align:this.#e.align,modal:this.#e.modal,...A(e.status)}}getTriggerAttrs(e,t){return{"aria-expanded":e.open?`true`:`false`,"aria-haspopup":`dialog`,"aria-controls":t}}getPopupAttrs(e){return{popover:`manual`,role:`dialog`,"aria-modal":e.modal===!0?`true`:void 0}}};const P={sideOffset:`--media-popover-side-offset`,alignOffset:`--media-popover-align-offset`,anchorWidth:`--media-popover-anchor-width`,anchorHeight:`--media-popover-anchor-height`,availableWidth:`--media-popover-available-width`,availableHeight:`--media-popover-available-height`},Te={open:`data-open`,side:`data-side`,align:`data-align`,transitionStarting:`data-starting-style`,transitionEnding:`data-ending-style`};var Ee=class e{static defaultProps={seconds:30,label:``,disabled:!1};state=c({seeking:!1,direction:`forward`,label:``});#e={...e.defaultProps};#t=null;constructor(e){e&&this.setProps(e)}setProps(t){this.#e=j(t,e.defaultProps)}getLabel(e){let{label:t}=this.#e;if(x(t)){let n=t(e);if(n)return n}else if(t)return t;let n=Math.abs(this.#e.seconds);return e.direction===`backward`?`Seek backward ${n} seconds`:`Seek forward ${n} seconds`}getAttrs(e){return{"aria-label":this.getLabel(e),"aria-disabled":this.#e.disabled?`true`:void 0}}setMedia(e){this.#t=e}getState(){let e=this.#t,t=this.#e.seconds<0?`backward`:`forward`;return this.state.patch({seeking:e.seeking,direction:t}),this.state.patch({label:this.getLabel(this.state.current)}),this.state.current}async seek(e){this.#e.disabled||await e.seek(e.currentTime+this.#e.seconds)}};const De={seeking:`data-seeking`,direction:`data-direction`};function F(e,t,n){return Math.max(t,Math.min(n,e))}function Oe(e,t,n){let r=Math.round((e-n)/t)*t+n,i=`${t}`.indexOf(`.`);return i===-1?r:Number(r.toFixed(`${t}`.length-i-1))}var I=class e{static defaultProps={label:``,step:1,largeStep:10,orientation:`horizontal`,disabled:!1,thumbAlignment:`center`,value:0,min:0,max:100};static defaultInput={pointerPercent:0,dragPercent:0,dragging:!1,pointing:!1,focused:!1};#e={...e.defaultProps};#t={...e.defaultInput};get props(){return this.#e}get input(){return this.#t}constructor(e){e&&this.setProps(e)}setProps(t){this.#e=j(t,e.defaultProps)}setInput(e){this.#t=e}getSliderState(e){let{orientation:t,disabled:n,thumbAlignment:r}=this.#e,{pointerPercent:i,dragging:a,pointing:o,focused:s}=this.#t;return{value:e,fillPercent:this.percentFromValue(e),pointerPercent:i,dragging:a,pointing:o,interactive:a||o||s,orientation:t,disabled:n,thumbAlignment:r}}getLabel(e){let{label:t}=this.#e;if(x(t)){let n=t(e);if(n)return n}else if(t)return t;return``}getAttrs(e){return{role:`slider`,tabIndex:e.disabled?-1:0,autoComplete:`off`,"aria-label":this.getLabel(e),"aria-valuemin":this.#e.min,"aria-valuemax":this.#e.max,"aria-valuenow":e.value,"aria-orientation":e.orientation,"aria-disabled":e.disabled?`true`:void 0}}valueFromPercent(e){let{min:t,max:n,step:r}=this.#e;return Oe(F(t+e/100*(n-t),t,n),r,t)}rawValueFromPercent(e){let{min:t,max:n}=this.#e;return F(t+e/100*(n-t),t,n)}percentFromValue(e){let{min:t,max:n}=this.#e;return n===t?0:(e-t)/(n-t)*100}getStepPercent(){let{step:e,min:t,max:n}=this.#e,r=n-t;return r>0?e/r*100:0}getLargeStepPercent(){let{largeStep:e,min:t,max:n}=this.#e,r=n-t;return r>0?e/r*100:0}adjustPercentForAlignment(e,t,n){if(this.#e.thumbAlignment===`center`||n===0)return e;let r=t/n*100/2,i=r,a=100-r;return i+e/100*(a-i)}};const L={fill:`--media-slider-fill`,pointer:`--media-slider-pointer`,buffer:`--media-slider-buffer`},ke={dragging:`data-dragging`,pointing:`data-pointing`,interactive:`data-interactive`,orientation:`data-orientation`,disabled:`data-disabled`};var Ae=class{findActiveThumbnail(e,t){if(e.length===0)return;let n=0,r=e.length-1,i;for(;n<=r;){let a=n+r>>>1,o=e[a];t>=o.startTime?(i=o,n=a+1):r=a-1}return i}parseConstraints(e){let t=parseFloat(e.minWidth),n=parseFloat(e.maxWidth),r=parseFloat(e.minHeight),i=parseFloat(e.maxHeight);return{minWidth:Number.isFinite(t)?t:0,maxWidth:Number.isFinite(n)?n:1/0,minHeight:Number.isFinite(r)?r:0,maxHeight:Number.isFinite(i)?i:1/0}}calculateScale(e,t,n){let{minWidth:r,maxWidth:i,minHeight:a,maxHeight:o}=n,s=Math.min(i/e,o/t),c=Math.max(r/e,a/t);return Number.isFinite(s)&&s<1?s:Number.isFinite(c)&&c>1?c:1}resize(e,t,n,r){let i=e.width??t,a=e.height??n;if(!i||!a)return;let o=this.calculateScale(i,a,r),s=e.coords?.x??0,c=e.coords?.y??0,l=o===1?0:1;return{scale:o,containerWidth:Math.max(0,Math.floor(i*o)-l*2),containerHeight:Math.max(0,Math.floor(a*o)-l*2),imageWidth:Math.ceil(t*o),imageHeight:Math.ceil(n*o),offsetX:Math.ceil(s*o)+l,offsetY:Math.ceil(c*o)+l}}getState(e,t,n){return{loading:e,error:t,hidden:!e&&!n}}getAttrs(e){return{role:`img`,"aria-hidden":`true`}}};const je={loading:`data-loading`,error:`data-error`,hidden:`data-hidden`};function Me(e,t){let n=e.trim().split(`#`),i=n[0]??``,a=n[1],o=t?new URL(i,t).href:i;if(!a)return{url:o};let s=a.indexOf(`=`);if(s===-1)return{url:o};let c=a.slice(0,s),l=a.slice(s+1).split(`,`).map(Number),u={};for(let e=0;e<c.length;e++){let t=c[e],n=l[e];t&&r(n)&&!Number.isNaN(n)&&(u[t]=n)}let d={url:o};return r(u.w)&&(d.width=u.w),r(u.h)&&(d.height=u.h),r(u.x)&&r(u.y)&&(d.coords={x:u.x,y:u.y}),d}function Ne(e,t){let n=[];for(let r of e){let e=Me(r.text,t),i={url:e.url,startTime:r.startTime,endTime:r.endTime};e.width&&(i.width=e.width),e.height&&(i.height=e.height),e.coords&&(i.coords=e.coords),n.push(i)}return n}const Pe=[{singular:`hour`,plural:`hours`},{singular:`minute`,plural:`minutes`},{singular:`second`,plural:`seconds`}];function Fe(e){return r(e)&&Number.isFinite(e)}function Ie(e,t){return`${e} ${e===1?Pe[t]?.singular:Pe[t]?.plural}`}function Le(e,t){if(!Fe(e))return`0:00`;let n=e<0,r=Math.abs(e),i=Math.floor(r/3600),a=Math.floor(r/60%60),o=Math.floor(r%60),s=t?Math.abs(t):0,c=Math.floor(s/3600),l=Math.floor(s/60%60),u=i>0||c>0,d=u||l>=10,f=u?`${i}:`:``,p=`${d&&a<10?`0`:``}${a}:`,m=o<10?`0${o}`:`${o}`;return`${n?`-`:``}${f}${p}${m}`}function Re(e){if(!Fe(e))return``;let t=e<0,n=Math.abs(e),r=Math.floor(n/3600),i=Math.floor(n/60%60),a=Math.floor(n%60);return n===0?`${Ie(0,2)}${t?` remaining`:``}`:`${[r,i,a].map((e,t)=>e>0?Ie(e,t):null).filter(Boolean).join(`, `)}${t?` remaining`:``}`}function ze(e){if(!Fe(e))return`PT0S`;let t=Math.abs(e),n=Math.floor(t/3600),r=Math.floor(t/60%60),i=Math.floor(t%60),a=`PT`;return n>0&&(a+=`${n}H`),r>0&&(a+=`${r}M`),(i>0||a===`PT`)&&(a+=`${i}S`),a}const Be={current:`Current time`,duration:`Duration`,remaining:`Remaining`};var R=class e{static defaultProps={type:`current`,negativeSign:`-`,label:``};#e={...e.defaultProps};#t=null;constructor(e){e&&this.setProps(e)}setProps(t){this.#e=j(t,e.defaultProps)}setMedia(e){this.#t=e}#n(){let e=this.#t,{type:t}=this.#e;switch(t){case`current`:return e.currentTime;case`duration`:return e.duration;case`remaining`:return e.currentTime-e.duration;default:return 0}}#r(){let e=this.#t,t=this.#n();return Le(Math.abs(t),e.duration)}#i(){let{type:e}=this.#e,t=this.#n();return Re(e===`remaining`?t<0?t:-Math.abs(t):t)}#a(){let e=this.#n();return ze(Math.abs(e))}getLabel(e){let{label:t}=this.#e;if(x(t)){let n=t(e);if(n)return n}else if(t)return t;return Be[this.#e.type]}getAttrs(e){return{"aria-label":this.getLabel(e),"aria-valuetext":e.phrase}}getState(){let e=this.#n();return{type:this.#e.type,seconds:e,negative:this.#e.type===`remaining`&&e<0,text:this.#r(),phrase:this.#i(),datetime:this.#a()}}};const Ve={type:`data-type`};var z=class e extends I{static defaultProps={...I.defaultProps,label:`Seek`,changeThrottle:100};#e={...e.defaultProps};#t=null;constructor(e){super(),e&&this.setProps(e)}setProps(t){this.#e=j(t,e.defaultProps),super.setProps({...t,min:0})}setMedia(e){this.#t=e}getState(){let{duration:e,currentTime:t,seeking:n,buffered:r}=this.#t;super.setProps({...this.#e,min:0,max:e});let i=super.getSliderState(t),a=r.length>0?r[r.length-1][1]:0,o=e>0?a/e*100:0;return{...i,currentTime:t,duration:e,seeking:n,bufferPercent:o}}getLabel(e){return super.getLabel(e)||`Seek`}getAttrs(e){let t=super.getAttrs(e),n=e.dragging?this.rawValueFromPercent(e.pointerPercent):e.value,r=Re(n),i=Re(e.duration),a=i?`${r} of ${i}`:r;return{...t,"aria-valuenow":n,"aria-valuetext":a}}};const He={...ke,seeking:`data-seeking`};var B=class e{static defaultProps={side:`top`,align:`center`,open:!1,defaultOpen:!1,delay:600,closeDelay:0,disableHoverablePopup:!0,disabled:!1};#e={...e.defaultProps};constructor(e){e&&this.setProps(e)}setProps(t){this.#e=j(t,e.defaultProps)}#t=null;setInput(e){this.#t=e}getState(){let e=this.#t;return{open:e.active,status:e.status,side:this.#e.side,align:this.#e.align,...A(e.status)}}getPopupAttrs(e){return{popover:`manual`,role:`presentation`}}};const V={sideOffset:`--media-tooltip-side-offset`,alignOffset:`--media-tooltip-align-offset`,anchorWidth:`--media-tooltip-anchor-width`,anchorHeight:`--media-tooltip-anchor-height`,availableWidth:`--media-tooltip-available-width`,availableHeight:`--media-tooltip-available-height`},Ue={open:`data-open`,side:`data-side`,align:`data-align`,transitionStarting:`data-starting-style`,transitionEnding:`data-ending-style`};var H=class e{static defaultProps={delay:600,closeDelay:0,timeout:400};#e={...e.defaultProps};#t=0;#n=!1;constructor(e){e&&this.setProps(e)}setProps(t){this.#e=j(t,e.defaultProps)}get delay(){return this.#e.delay}get closeDelay(){return this.#e.closeDelay}shouldSkipDelay(){return this.#n?!0:Date.now()-this.#t<this.#e.timeout}notifyOpen(){this.#n=!0}notifyClose(){this.#n=!1,this.#t=Date.now()}},U=class e extends I{static defaultProps={...I.defaultProps,label:`Volume`,wheelStep:5};#e=null;constructor(e){super(),e&&this.setProps(e)}setProps(t){super.setProps(j(t,e.defaultProps))}setMedia(e){this.#e=e}getState(){let e=this.#e,{volume:t,muted:n}=e,r=n||t===0,{dragging:i,dragPercent:a}=this.input,o=t*100,s=i?this.valueFromPercent(a):o,c=super.getSliderState(s);return{...c,fillPercent:r?0:c.fillPercent,volume:t,muted:r,availability:e.volumeAvailability}}getWheelStepPercent(){let e=this.props,t=e.max-e.min;return t>0?e.wheelStep/t*100:0}getLabel(e){return super.getLabel(e)||`Volume`}getAttrs(e){let t=super.getAttrs(e),n=`${Math.round(e.value)} percent${e.muted?`, muted`:``}`;return{...t,"aria-valuetext":n}}};const We={...ke,availability:`data-availability`},Ge=M(ie),Ke=M(ne),qe=M(f),Je=M(p),Ye=M(_),Xe=M(y),Ze=M(d),Qe=M(u);M(te);const $e=M(g),W=M(l),G=M(ee),et={shift:`Shift`,ctrl:`Control`,alt:`Alt`,meta:`Meta`},tt=[`ctrl`,`shift`,`alt`,`meta`];function nt(e){return e.map(e=>{let t=[];for(let n of tt)e.modifiers.has(n)&&t.push(et[n]);return t.push(e.originalKey),t.join(`+`)}).join(` `)}var rt=class{#e;#t=[];#n=0;#r=null;#i=null;#a=new Map;#o=!1;constructor(e){this.#e=e}add(e){let t=at(e.keys),n={parsed:t,options:e,id:this.#n++};this.#t.push(n),this.#s(),e.action&&this.#f(e.action,t),e.target===`document`?this.#l():this.#c();let r=!1;return()=>{if(r)return;r=!0;let i=this.#t.indexOf(n);i!==-1&&this.#t.splice(i,1),e.action&&this.#p(e.action,t),this.#u()}}getAriaKeys(e){let t=this.#a.get(e);if(t?.length)return nt(t)}destroy(){this.#o||(this.#o=!0,this.#r?.abort(),this.#r=null,this.#i?.abort(),this.#i=null,this.#t=[],this.#a.clear())}#s(){this.#t.sort((e,t)=>{let n=t.parsed[0].modifiers.size-e.parsed[0].modifiers.size;return n===0?e.id-t.id:n})}#c(){this.#r||(this.#r=new AbortController,S(this.#e,`keydown`,this.#d,{signal:this.#r.signal}))}#l(){this.#i||(this.#i=new AbortController,S(document,`keydown`,this.#d,{signal:this.#i.signal}))}#u(){let e=this.#t.some(e=>e.options.target!==`document`),t=this.#t.some(e=>e.options.target===`document`);e||(this.#r?.abort(),this.#r=null),t||(this.#i?.abort(),this.#i=null)}#d=e=>{if(e.key===`Unidentified`||a(e))return;let t=i(e);for(let n of this.#t){let{options:r,parsed:i}=n;if(!r.disabled&&!(e.repeat&&r.repeatable===!1)&&r.target===`document`==(e.currentTarget===document)){for(let n of i)if(st(n,e)&&!(t&&n.modifiers.size===0)){e.preventDefault(),r.onActivate(e,n.originalKey);return}}}};#f(e,t){let n=this.#a.get(e);n||(n=[],this.#a.set(e,n)),n.push(...t)}#p(e,t){let n=this.#a.get(e);if(!n)return;let r=n.filter(e=>!t.includes(e));r.length===0?this.#a.delete(e):this.#a.set(e,r)}};const it=new Set([`shift`,`ctrl`,`alt`,`meta`]);function at(e){if(e===`0-9`)return Array.from({length:10},(e,t)=>({modifiers:new Set,key:String(t),originalKey:String(t)}));let t=e.split(`+`),n=t.pop(),r=new Set;for(let e of t){let t=e.toLowerCase();t===`mod`?r.add(le()?`meta`:`ctrl`):it.has(t)&&r.add(t)}return[{modifiers:r,key:n===`Space`?` `:n.toLowerCase(),originalKey:n}]}function ot(e){return e.length===1&&!/[a-z]/i.test(e)}function st(e,t){if(t.key===`Unidentified`||t.key.toLowerCase()!==e.key)return!1;let n=ot(t.key),r=n?t.shiftKey&&e.modifiers.has(`shift`):t.shiftKey,i=n?t.altKey&&e.modifiers.has(`alt`):t.altKey;return!(r!==e.modifiers.has(`shift`)||t.ctrlKey!==e.modifiers.has(`ctrl`)||i!==e.modifiers.has(`alt`)||t.metaKey!==e.modifiers.has(`meta`))}const ct=new WeakMap;function lt(e){return ct.get(e)}function ut(e){let t=ct.get(e);return t||(t=new rt(e),ct.set(e,t)),t}function dt(e,t){return ut(e).add(t)}function ft(e){let{transition:t}=e,n=t.state,r=new AbortController,i=null;function a(){if(r.signal.aborted)return null;let{active:e,status:i}=n.current;return e&&i!==`ending`?null:(i===`ending`&&t.cancel(),t.open())}function o(e){let{active:i,status:a}=n.current;return r.signal.aborted||!i||a===`ending`?null:t.close(e)}function s(){if(c(),typeof document>`u`)return;i=new AbortController;let{signal:t}=i;S(document,`keydown`,l,{signal:t}),e.onDocumentActive?.(t)}function c(){i?.abort(),i=null}function l(t){t.key===`Escape`&&n.current.active&&(e.closeOnEscape?.()??!0)&&e.onEscapeDismiss(t)}let u=n.subscribe(()=>{n.current.active?s():c()});r.signal.addEventListener(`abort`,()=>{u(),t.destroy(),c()});function d(){r.signal.aborted||r.abort()}return{input:n,open:a,close:o,signal:r.signal,destroy:d}}function pt(e){let{onOpenChange:t}=e,n=null,r=null,i=null,a=ft({transition:e.transition,closeOnEscape:e.closeOnEscape,onEscapeDismiss(e){e.stopPropagation(),c()}}),o=a.input;function s(){r=document.activeElement;let i=a.open();i&&(t(!0),requestAnimationFrame(()=>{a.signal.aborted||!o.current.active||n?.focus()}),i.then(()=>{a.signal.aborted||!o.current.active||e.onOpenChangeComplete?.(!0)}))}function c(){let i=a.close(n);i&&(t(!1),i.then(()=>{a.signal.aborted||(r&&=(r.focus(),null),e.onOpenChangeComplete?.(!1))}))}function l(){if(u(),!n)return;i=new AbortController;let{signal:e}=i;S(n,`click`,d,{signal:e})}function u(){i?.abort(),i=null}function d(e){e.target instanceof HTMLButtonElement&&c()}function f(e){n=e,l()}return a.signal.addEventListener(`abort`,()=>{u(),n=null,r=null}),{input:o,open:s,close:c,setElement:f,destroy:a.destroy}}function mt(e){let{onActivate:t,isDisabled:n}=e;return{role:`button`,tabIndex:0,onClick(e){if(n()){e.preventDefault();return}t()},onPointerDown(e){n()&&e.preventDefault()},onMouseDown(e){n()&&e.preventDefault()},onKeyDown(e){if(e.target===e.currentTarget){if(n()){e.key!==`Tab`&&e.preventDefault();return}e.key===`Enter`?(e.preventDefault(),t()):e.key===` `&&e.preventDefault()}},onKeyUp(e){e.target===e.currentTarget&&(n()||e.key===` `&&t())}}}function ht(e){let{onOpenChange:t,closeOnOutsideClick:n}=e,r=null,i=null,a=null,o=new Set,s=ft({transition:e.transition,closeOnEscape:e.closeOnEscape,onEscapeDismiss(e){e.preventDefault(),m(`escape`,e)},onDocumentActive(e){S(document,`pointerdown`,_,{capture:!0,signal:e})}}),c=s.input;function l(){a!==null&&(clearTimeout(a),a=null)}function u(){return globalThis.matchMedia?.(`(hover: hover)`)?.matches??!1}function d(){return u()?globalThis.matchMedia?.(`(pointer: fine)`)?.matches??!1:!1}function f(){return e.openOnHover?.()?u():!0}function p(n,r){let i=s.open();i&&(t(!0,r?{reason:n,event:r}:{reason:n}),i.then(()=>{s.signal.aborted||!c.current.active||e.onOpenChangeComplete?.(!0)}))}function m(n,r){let a=s.close(i);a&&(t(!1,r?{reason:n,event:r}:{reason:n}),a.then(()=>{s.signal.aborted||(O(i),e.onOpenChangeComplete?.(!1))}))}function h(e=`click`){p(e)}function g(e=`click`){m(e)}function _(e){if(!n()||!c.current.active)return;let t=e.composedPath();r&&t.includes(r)||i&&t.includes(i)||m(`outside-click`,e)}s.signal.addEventListener(`abort`,()=>{l(),o.clear(),r=null,i=null});let v={onClick(e){f()&&(c.current.active&&c.current.status!==`ending`?m(`click`,e):p(`click`,e))},onPointerEnter(t){if(!e.openOnHover?.()||!u()||(l(),c.current.active))return;let n=e.delay?.()??300;a=setTimeout(()=>p(`hover`),n)},onPointerLeave(t){if(!e.openOnHover?.()||!u()||(l(),!c.current.active))return;let n=e.closeDelay?.()??0;a=setTimeout(()=>m(`hover`),n)},onFocusIn(t){if(e.openOnHover?.()){if(!d())return;p(`focus`)}},onFocusOut(t){let n=t.relatedTarget;n&&(r?.contains(n)||i?.contains(n))||e.openOnHover?.()&&m(`blur`)}},y={onPointerEnter(t){e.openOnHover?.()&&l()},onPointerLeave(t){if(!e.openOnHover?.()||o.size>0||(l(),!c.current.active))return;let n=e.closeDelay?.()??0;a=setTimeout(()=>m(`hover`),n)},onGotPointerCapture(e){o.add(e.pointerId)},onLostPointerCapture(e){o.delete(e.pointerId)},onFocusOut(e){let t=e.relatedTarget;t&&(r?.contains(t)||i?.contains(t))||m(`blur`)}};function b(e){r=e}function ee(e){!e&&i&&c.current.active&&O(i),i=e,e&&c.current.active&&D(e)}return{input:c,triggerProps:v,popupProps:y,get triggerElement(){return r},setTriggerElement:b,setPopupElement:ee,open:h,close:g,destroy:s.destroy}}const gt={top:`bottom`,bottom:`top`,left:`right`,right:`left`};function K(e,t,n,r,i,a,o=P){return E()?vt(e,t,o):n&&r?{...bt(n,r,t,a??{sideOffset:0,alignOffset:0}),...i?yt(n,i,t.side,o):{},position:`fixed`,inset:`auto`,margin:`0`}:{}}function _t(e){return E()?{anchorName:`--${e}`}:{}}function vt(e,t,n=P){let r=`var(${n.sideOffset}, 0px)`,i=`var(${n.alignOffset}, 0px)`,{side:a,align:o}=t,s={positionAnchor:`--${e}`,position:`fixed`,inset:`auto`,margin:`0`,justifySelf:`normal`,alignSelf:`normal`,marginInlineStart:`0`,marginBlockStart:`0`},c=gt[a];return a===`top`||a===`bottom`?(s[c]=`calc(anchor(${a}) + ${r})`,o===`start`?s.left=`calc(anchor(left) + ${i})`:o===`end`?s.right=`calc(anchor(right) + ${i})`:(s.justifySelf=`anchor-center`,s.marginInlineStart=i)):(s[c]=`calc(anchor(${a}) + ${r})`,o===`start`?s.top=`calc(anchor(top) + ${i})`:o===`end`?s.bottom=`calc(anchor(bottom) + ${i})`:(s.alignSelf=`anchor-center`,s.marginBlockStart=i)),s}function yt(e,t,n,r=P){let i={};return i[r.anchorWidth]=`${e.width}px`,i[r.anchorHeight]=`${e.height}px`,n===`top`||n===`bottom`?(i[r.availableHeight]=n===`top`?`${e.top-t.top}px`:`${t.bottom-e.bottom}px`,i[r.availableWidth]=`${t.width}px`):(i[r.availableWidth]=n===`left`?`${e.left-t.left}px`:`${t.right-e.right}px`,i[r.availableHeight]=`${t.height}px`),i}function bt(e,t,n,r={sideOffset:0,alignOffset:0}){let{side:i,align:a}=n,{sideOffset:o,alignOffset:s}=r,c=0,l=0;return i===`top`?c=e.top-t.height-o:i===`bottom`?c=e.bottom+o:l=i===`left`?e.left-t.width-o:e.right+o,i===`top`||i===`bottom`?l=a===`start`?e.left+s:a===`end`?e.right-t.width+s:e.left+(e.width-t.width)/2+s:c=a===`start`?e.top+s:a===`end`?e.bottom-t.height+s:e.top+(e.height-t.height)/2+s,{top:`${c}px`,left:`${l}px`}}function xt(e,t=P){let n=getComputedStyle(e);return{sideOffset:ue(e,n.getPropertyValue(t.sideOffset)),alignOffset:ue(e,n.getPropertyValue(t.alignOffset))}}function St(e){let t=e.getBoundingClientRect(),n=e.offsetWidth||t.width,r=e.offsetHeight||t.height,i={...t,width:n,height:r,right:t.left+n,bottom:t.top+r};return{...i,toJSON:()=>i}}function q(e,t,n,r){let i;return i=n===`vertical`?1-(e.clientY-t.top)/t.height:r?(t.right-e.clientX)/t.width:(e.clientX-t.left)/t.width,Number.isFinite(i)?F(i*100,0,100):0}function Ct(e){let t=c({pointerPercent:0,dragPercent:0,dragging:!1,pointing:!1,focused:!1}),n=new AbortController,r=e.changeThrottle??0,i=!1,a=!1,o=null,l=null,u=0,d=!1,f=r>0?me(t=>e.onValueChange?.(t),r,{leading:!0}):null;function p(t,n){n&&f?f(t):e.onValueChange?.(t)}function m(){if(s(l))return;let t=l;l=null;try{e.getElement().releasePointerCapture(t)}catch{}}function h(){i?(d||e.onValueCommit?.(u),i=!1,t.patch({dragging:!1,pointing:!1}),e.onDragEnd?.()):t.patch({pointing:!1}),d=!1,g()}function g(){f?.cancel(),l=null,o=null}let _={onPointerDown(n){if(e.isDisabled())return;n.stopPropagation(),n.preventDefault();let r=e.getElement();o=r.getBoundingClientRect(),a=e.isRTL(),d=!1,m(),l=n.pointerId,r.setPointerCapture(n.pointerId);let s=q(n,o,e.getOrientation(),a);i=!0,u=s,t.patch({pointing:!0,dragging:!0,pointerPercent:s,dragPercent:s}),e.onDragStart?.(),e.onValueChange?.(s),e.getThumbElement?.()?.focus({preventScroll:!0,focusVisible:!1})},onPointerMove(n){if(e.isDisabled())return;if(!s(l)){if(n.pointerType!==`touch`&&n.buttons===0){h();return}let r=q(n,o,e.getOrientation(),a);u=r,t.patch({dragPercent:r,pointerPercent:r}),p(r,!0);return}let r=q(n,e.getElement().getBoundingClientRect(),e.getOrientation(),e.isRTL());t.patch({pointing:!0,pointerPercent:r})},onPointerUp(t){if(e.isDisabled()||(t.stopPropagation(),s(l)))return;let n=q(t,o,e.getOrientation(),a);f?.cancel(),e.onValueChange?.(n),e.onValueCommit?.(n),d=!0},onPointerLeave(){s(l)&&t.patch({pointing:!1})},onLostPointerCapture(){h()}},v={onKeyDown(n){if(e.isDisabled()){n.key!==`Tab`&&n.preventDefault();return}let r=e.getStepPercent(),i=e.getLargeStepPercent(),a=Oe(e.getPercent(),r,0),o=e.isRTL()?-1:1,s=n.shiftKey?i:r,c=null;switch(n.key){case`ArrowRight`:c=a+s*o;break;case`ArrowLeft`:c=a-s*o;break;case`ArrowUp`:c=a+s;break;case`ArrowDown`:c=a-s;break;case`PageUp`:c=a+i;break;case`PageDown`:c=a-i;break;case`Home`:c=0;break;case`End`:c=100;break;default:!n.metaKey&&!n.ctrlKey&&!n.altKey&&n.key>=`0`&&n.key<=`9`&&(c=Number(n.key)*10);break}c!==null&&(n.preventDefault(),c=F(c,0,100),t.patch({pointerPercent:c,dragPercent:c}),e.onValueChange?.(c),e.onValueCommit?.(c))},onFocus(){t.patch({focused:!0})},onBlur(){t.patch({focused:!1})}};function y(t){if(!e.adjustPercent||t.thumbAlignment!==`edge`)return t;let n=e.getElement(),r=e.getThumbElement?.();if(!r)return t;let i=t.orientation===`horizontal`,a=i?r.offsetWidth:r.offsetHeight,o=i?n.offsetWidth:n.offsetHeight;return{...t,fillPercent:e.adjustPercent(t.fillPercent,a,o),pointerPercent:e.adjustPercent(t.pointerPercent,a,o)}}let b=null;return e.onResize&&(b=new ResizeObserver(()=>e.onResize()),b.observe(e.getElement())),{input:t,rootProps:_,rootStyle:{touchAction:`none`,userSelect:`none`},thumbProps:v,adjustForAlignment:y,destroy(){n.signal.aborted||(n.abort(),b?.disconnect(),m(),g())}}}function wt(e){return{[L.fill]:`${e.fillPercent.toFixed(3)}%`,[L.pointer]:`${e.pointerPercent.toFixed(3)}%`}}function Tt(e){return{...wt(e),[L.buffer]:`${e.bufferPercent.toFixed(3)}%`}}function Et(e,t){let n=e/2;return{position:`absolute`,left:t===`visible`?`calc(var(${L.pointer}) - ${n}px)`:`min(max(0px, calc(var(${L.pointer}) - ${n}px)), calc(100% - ${e}px))`,width:`max-content`,pointerEvents:`none`}}function Dt(e){let{getContainer:t,getImg:n,onStateChange:r}=e,i=new Ae,a=new AbortController,o=a.signal,s=!1,c=!1,l=0,u=0,d=``,f=!1,p=null;function m(){let e=n();e&&(l=e.naturalWidth,u=e.naturalHeight),s=!1,c=!1,r()}function h(){s=!1,c=!0,r()}function g(e){S(e,`load`,m,{signal:o}),S(e,`error`,h,{signal:o})}function _(){if(!f){let e=n();e&&(g(e),f=!0)}if(!p){let e=t();e&&(p=new ResizeObserver(r),p.observe(e))}}function v(e){_();let t=e??``;t!==d&&(d=t,t?(s=!0,c=!1):(s=!1,c=!1,l=0,u=0))}function y(){_();let e=n();e?.complete&&d&&(e.naturalWidth>0?(l=e.naturalWidth,u=e.naturalHeight,s=!1,c=!1):(s=!1,c=!0),r())}function b(){a.abort(),p?.disconnect(),p=null}return{get loading(){return s},get error(){return c},get naturalWidth(){return l},get naturalHeight(){return u},readConstraints(){let e=t();return e?i.parseConstraints(getComputedStyle(e)):{minWidth:0,maxWidth:1/0,minHeight:0,maxHeight:1/0}},updateSrc:v,connect:y,destroy:b}}const Ot={hover:`hover`,focus:`focus`,escape:`escape`,blur:`blur`};function kt(e){let t={transition:e.transition,onOpenChange(t,n){let r=Ot[n.reason];if(!r)return;let i=e.group?.();t?i?.notifyOpen():i?.notifyClose();let a=n.event?{reason:r,event:n.event}:{reason:r};e.onOpenChange(t,a)},closeOnEscape:()=>!0,closeOnOutsideClick:()=>!1,openOnHover:()=>!0,delay:()=>{let t=e.group?.();return t?.shouldSkipDelay()?0:e.delay?.()??t?.delay??600},closeDelay:()=>{let t=e.group?.();return e.closeDelay?.()??t?.closeDelay??0}};e.onOpenChangeComplete&&(t.onOpenChangeComplete=e.onOpenChangeComplete);let n=ht(t),r=!1,{onClick:i,...a}=n.triggerProps,o={...a,onPointerDown(){r=!0},onPointerEnter(t){e.disabled?.()||t.pointerType!==`touch`&&a.onPointerEnter(t)},onFocusIn(t){if(!e.disabled?.()){if(r){r=!1;return}a.onFocusIn(t)}}},s={...n.popupProps,onPointerEnter(t){e.disableHoverablePopup?.()||n.popupProps.onPointerEnter(t)}};return{...n,triggerProps:o,popupProps:s,get triggerElement(){return n.triggerElement},open:()=>n.open(`hover`),close:()=>n.close(`hover`)}}function At(){let e=c({active:!1,status:`idle`}),t=!1,n=0,r=0;function i(){return cancelAnimationFrame(n),cancelAnimationFrame(r),n=0,r=0,e.patch({active:!0,status:`starting`}),new Promise(i=>{n=requestAnimationFrame(()=>{n=0,r=requestAnimationFrame(()=>{if(r=0,t||!e.current.active)return i();e.patch({status:`idle`}),i()})})})}function a(i){return cancelAnimationFrame(n),cancelAnimationFrame(r),n=0,r=0,e.patch({status:`ending`}),new Promise(a=>{n=requestAnimationFrame(()=>{n=0,r=requestAnimationFrame(()=>{if(r=0,t)return a();jt(i).finally(()=>{if(t||e.current.status!==`ending`)return a();e.patch({active:!1,status:`idle`}),a()})})})})}function o(){cancelAnimationFrame(n),cancelAnimationFrame(r),n=0,r=0,e.current.status!==`idle`&&e.patch({status:`idle`})}return{state:e,open:i,close:a,cancel:o,destroy(){t||(t=!0,o())}}}function jt(e){if(!e)return Promise.resolve();let t=e.getAnimations?.()??[];return t.length===0?Promise.resolve():Promise.all(t.map(e=>e.finished)).then(re,re)}function Mt(e){return{onWheel(t){if(e.isDisabled())return;let n=Math.sign(t.deltaY);if(n===0)return;t.preventDefault();let r=e.getStepPercent(),i=F(e.getPercent()-n*r,0,100);e.onValueChange?.(i)}}}function J(e,t,r){let i=r?.signal;for(let[r,a]of Object.entries(t))x(a)&&r.startsWith(`on`)?S(e,r.slice(2).toLowerCase(),a,i?{signal:i}:void 0):n(a)||a===!1?e.removeAttribute(r):a===!0?e.setAttribute(r,``):e.setAttribute(r,String(a))}function Y(e,t,n){for(let r in t){if(n&&!(r in n))continue;let i=n?.[r]??Nt(r),a=t[r];a===!0?e.setAttribute(i,``):a?e.setAttribute(i,String(a)):e.removeAttribute(i)}}function Nt(e){return`data-${e.toLowerCase()}`}var Pt=class{#e;#t;constructor(e,t){this.#e=t,this.#t=new m(e,{context:se,subscribe:!0}),e.addController(this)}get value(){let e=this.#t.value?.container;if(e)return lt(e)?.getAriaKeys(this.#e)}hostConnected(){}hostDisconnected(){}},X=class extends h{constructor(...e){super(...e),this.disabled=!1,this.label=``,this.hotkeyAction=void 0}static{this.properties={label:{type:String},disabled:{type:Boolean}}}get $state(){return this.core.state}#e=null;#t=null;connectedCallback(){if(super.connectedCallback(),this.destroyed)return;this.hotkeyAction&&!this.#t&&(this.#t=new Pt(this,this.hotkeyAction)),this.#e=new AbortController;let e=mt({onActivate:()=>this.activate(this.mediaState.value),isDisabled:()=>this.disabled||!this.mediaState.value});J(this,e,{signal:this.#e.signal})}disconnectedCallback(){super.disconnectedCallback(),this.#e?.abort(),this.#e=null}getLabel(){return this.core.state.current.label||void 0}willUpdate(e){super.willUpdate(e),this.core.setProps?.(this)}update(e){super.update(e);let t=this.mediaState.value;if(!t)return;this.core.setMedia(t);let n=this.core.getState();J(this,{...this.core.getAttrs?.(n),"aria-keyshortcuts":this.#t?.value}),Y(this,n,this.stateAttrMap)}},Ft=class extends X{constructor(...e){super(...e),this.core=new ve,this.stateAttrMap=be,this.mediaState=new v(this,T,G),this.hotkeyAction=`toggleMuted`}static{this.tagName=`media-mute-button`}activate(e){this.core.toggle(e)}},It=class extends X{constructor(...e){super(...e),this.core=new xe,this.stateAttrMap=Se,this.mediaState=new v(this,T,Ze),this.hotkeyAction=`togglePaused`}static{this.tagName=`media-play-button`}activate(e){this.core.toggle(e)}},Lt=class extends X{constructor(...e){super(...e),this.core=new Ce,this.stateAttrMap=we,this.mediaState=new v(this,T,Qe)}static{this.tagName=`media-playback-rate-button`}activate(e){this.core.cycle(e)}},Rt=class{#e;#t=null;#n=0;#r=null;#i=null;constructor(e){this.#e=e,e.addController(this)}findTrigger(){return this.#e.id?this.#e.getRootNode().querySelector(`[commandfor="${this.#e.id}"]`):null}sync(e){if(E()||!e||this.#t&&this.#i===e)return;this.cleanup(),this.#t=new AbortController,this.#i=e;let{signal:t}=this.#t,n=()=>{cancelAnimationFrame(this.#n),this.#n=requestAnimationFrame(()=>{t.aborted||this.#e.requestUpdate()})};window.addEventListener(`scroll`,n,{capture:!0,passive:!0,signal:t}),window.addEventListener(`resize`,n,{signal:t}),typeof ResizeObserver==`function`&&(this.#r=new ResizeObserver(()=>{n()}),this.#r.observe(e),this.#r.observe(this.#e)),n()}cleanup(){this.#t?.abort(),this.#t=null,this.#i=null,cancelAnimationFrame(this.#n),this.#n=0,this.#r?.disconnect(),this.#r=null}hostDisconnected(){this.cleanup()}hostDestroyed(){this.cleanup()}},zt=class extends h{constructor(...e){super(...e),this.open=N.defaultProps.open,this.defaultOpen=N.defaultProps.defaultOpen,this.side=N.defaultProps.side,this.align=N.defaultProps.align,this.modal=N.defaultProps.modal,this.closeOnEscape=N.defaultProps.closeOnEscape,this.closeOnOutsideClick=N.defaultProps.closeOnOutsideClick,this.openOnHover=N.defaultProps.openOnHover,this.delay=N.defaultProps.delay,this.closeDelay=N.defaultProps.closeDelay}static{this.tagName=`media-popover`}static{this.properties={open:{type:Boolean},defaultOpen:{type:Boolean,attribute:`default-open`},side:{type:String},align:{type:String},modal:{type:Boolean},closeOnEscape:{type:Boolean,attribute:`close-on-escape`},closeOnOutsideClick:{type:Boolean,attribute:`close-on-outside-click`},openOnHover:{type:Boolean,attribute:`open-on-hover`},delay:{type:Number},closeDelay:{type:Number,attribute:`close-delay`}}}#e=new N;#t=new Rt(this);#n=null;#r=null;#i=null;#a=null;#o=null;connectedCallback(){super.connectedCallback(),!this.destroyed&&(this.#i=new AbortController,this.#n=ht({transition:At(),onOpenChange:(e,t)=>{this.open=e,this.dispatchEvent(new CustomEvent(`open-change`,{detail:{open:e,...t}}))},closeOnEscape:()=>this.closeOnEscape,closeOnOutsideClick:()=>this.closeOnOutsideClick,openOnHover:()=>this.openOnHover,delay:()=>this.delay,closeDelay:()=>this.closeDelay}),this.#n.setPopupElement(this),J(this,this.#n.popupProps,{signal:this.#i.signal}),this.#r?this.#r.track(this.#n.input):this.#r=new b(this,this.#n.input))}firstUpdated(e){super.firstUpdated(e),this.defaultOpen&&!this.open&&this.#n?.open()}disconnectedCallback(){super.disconnectedCallback(),this.#i?.abort(),this.#i=null}destroyCallback(){this.#c(),this.#n?.destroy(),super.destroyCallback()}willUpdate(e){if(super.willUpdate(e),this.#e.setProps(this),this.#n&&e.has(`open`)){let{active:e}=this.#n.input.current;this.open!==e&&(this.open?this.#n.open():this.#n.close())}}update(e){if(super.update(e),!this.#n)return;let t=this.#t.findTrigger();this.#s(t);let n=this.#n.input.current;this.#e.setInput(n);let r=this.#e.getState();if(J(this,this.#e.getPopupAttrs(r)),Y(this,r,Te),r.open?D(this):O(this),this.#o&&(J(this.#o,this.#e.getTriggerAttrs(r,this.id)),k(this.#o,_t(this.id))),!r.open){this.#t.cleanup();return}let i={side:r.side,align:r.align};if(E())k(this,K(this.id,i));else{let e=this.#o?.getBoundingClientRect(),t=St(this),n=document.documentElement.getBoundingClientRect(),r=xt(this);k(this,K(this.id,i,e,t,n,r))}this.#t.sync(this.#o)}#s(e){e!==this.#o&&(this.#t.cleanup(),this.#c(),this.#o=e,this.#n?.setTriggerElement(e),e&&this.#n&&(this.#a=new AbortController,J(e,this.#n.triggerProps,{signal:this.#a.signal})))}#c(){this.#o&&(J(this.#o,{"aria-expanded":void 0,"aria-haspopup":void 0,"aria-controls":void 0}),this.#o.style.removeProperty(`anchor-name`)),this.#a?.abort(),this.#a=null,this.#o=null}},Bt=class extends X{constructor(...e){super(...e),this.seconds=Ee.defaultProps.seconds,this.core=new Ee,this.stateAttrMap=De,this.mediaState=new v(this,T,W)}static{this.tagName=`media-seek-button`}static{this.properties={...X.properties,seconds:{type:Number}}}activate(e){this.core.seek(e)}};const Vt=C(Symbol(`@videojs/tooltip-group`));function Ht(e){return`$state`in e}var Ut=class extends h{constructor(...e){super(...e),this.open=B.defaultProps.open,this.defaultOpen=B.defaultProps.defaultOpen,this.side=B.defaultProps.side,this.align=B.defaultProps.align,this.delay=B.defaultProps.delay,this.closeDelay=B.defaultProps.closeDelay,this.disableHoverablePopup=B.defaultProps.disableHoverablePopup,this.disabled=B.defaultProps.disabled}static{this.tagName=`media-tooltip`}static{this.properties={open:{type:Boolean},defaultOpen:{type:Boolean,attribute:`default-open`},side:{type:String},align:{type:String},delay:{type:Number},closeDelay:{type:Number,attribute:`close-delay`},disableHoverablePopup:{type:Boolean,attribute:`disable-hoverable-popup`},disabled:{type:Boolean}}}#e=new B;#t=new m(this,{context:Vt});#n=new Rt(this);#r=null;#i=null;#a=null;#o=null;#s=null;connectedCallback(){super.connectedCallback(),!this.destroyed&&(this.#a=new AbortController,this.#r=kt({transition:At(),onOpenChange:(e,t)=>{this.open=e,this.dispatchEvent(new CustomEvent(`open-change`,{detail:{open:e,...t}}))},delay:()=>this.delay,closeDelay:()=>this.closeDelay,disableHoverablePopup:()=>this.disableHoverablePopup,disabled:()=>this.disabled,group:()=>this.#t.value}),this.#r.setPopupElement(this),J(this,this.#r.popupProps,{signal:this.#a.signal}),this.#i?this.#i.track(this.#r.input):this.#i=new b(this,this.#r.input))}firstUpdated(e){super.firstUpdated(e),this.defaultOpen&&!this.open&&this.#r?.open()}disconnectedCallback(){super.disconnectedCallback(),this.#u(),this.#r?.destroy(),this.#r=null,this.#a?.abort(),this.#a=null}willUpdate(e){if(super.willUpdate(e),this.#e.setProps(this),this.#r&&e.has(`open`)){let{active:e}=this.#r.input.current;this.open!==e&&(this.open?this.#r.open():this.#r.close())}}update(e){if(super.update(e),!this.#r)return;let t=this.#n.findTrigger();this.#c(t);let n=this.#r.input.current;this.#e.setInput(n);let r=this.#e.getState();if(J(this,this.#e.getPopupAttrs(r)),Y(this,r,Ue),r.open?D(this):O(this),this.#s&&k(this.#s,_t(this.id)),!r.open){this.#n.cleanup();return}let i={side:r.side,align:r.align};if(E())k(this,K(this.id,i,void 0,void 0,void 0,void 0,V));else{let e=this.#s?.getBoundingClientRect(),t=St(this),n=document.documentElement.getBoundingClientRect(),r=xt(this,V);k(this,K(this.id,i,e,t,n,r,V))}this.#n.sync(this.#s)}#c(e){e!==this.#s&&(this.#n.cleanup(),this.#u(),this.#s=e,this.#r?.setTriggerElement(e),e&&this.#r&&(this.#o=new AbortController,J(e,this.#r.triggerProps,{signal:this.#o.signal}),Ht(e)&&(this.#l(e),e.$state.subscribe(()=>this.#l(e),{signal:this.#o.signal}))))}#l(e){this.textContent=e.getLabel()??``}#u(){this.#s&&this.#s.style.removeProperty(`anchor-name`),this.#o?.abort(),this.#o=null,this.#s=null}},Wt=class extends h{constructor(...e){super(...e),this.delay=H.defaultProps.delay,this.closeDelay=H.defaultProps.closeDelay,this.timeout=H.defaultProps.timeout}static{this.tagName=`media-tooltip-group`}static{this.properties={delay:{type:Number},closeDelay:{type:Number,attribute:`close-delay`},timeout:{type:Number}}}#e=new H;#t=new e(this,{context:Vt,initialValue:this.#e});update(e){super.update(e),this.#e.setProps(this),this.#t.setValue(this.#e)}};const Z=C(Symbol(`@videojs/alert-dialog`));var Gt=class extends h{constructor(...e){super(...e),this.disabled=!1}static{this.tagName=`media-alert-dialog-close`}static{this.properties={disabled:{type:Boolean}}}#e=new m(this,{context:Z,subscribe:!0});#t=null;connectedCallback(){super.connectedCallback(),this.#t=new AbortController;let e=mt({onActivate:()=>this.#e.value?.close(),isDisabled:()=>this.disabled});J(this,e,{signal:this.#t.signal})}disconnectedCallback(){super.disconnectedCallback(),this.#t?.abort(),this.#t=null}update(e){super.update(e);let t=this.#e.value;t&&Y(this,t.state,t.stateAttrMap)}},Q=class extends h{update(e){super.update(e);let t=this.consumer.value;t&&Y(this,t.state,t.stateAttrMap)}},Kt=class extends Q{constructor(...e){super(...e),this.consumer=new m(this,{context:Z,subscribe:!0})}static{this.tagName=`media-alert-dialog-description`}update(e){super.update(e);let t=this.consumer.value?.state.descriptionId;t&&(this.id=t)}},qt=class extends Q{constructor(...e){super(...e),this.consumer=new m(this,{context:Z,subscribe:!0})}static{this.tagName=`media-alert-dialog-title`}update(e){super.update(e);let t=this.consumer.value?.state.titleId;t&&(this.id=t)}};const Jt=C(Symbol(`@videojs/controls`));var Yt=class extends h{static{this.tagName=`media-controls`}#e=new he;#t=new v(this,T,qe);#n=new e(this,{context:Jt});connectedCallback(){super.connectedCallback()}update(e){super.update(e);let t=this.#t.value;if(!t)return;this.#e.setMedia(t);let n=this.#e.getState();Y(this,n,ge),this.#n.setValue({state:n,stateAttrMap:ge})}},Xt=class extends Q{constructor(...e){super(...e),this.consumer=new m(this,{context:Jt,subscribe:!0})}static{this.tagName=`media-controls-group`}connectedCallback(){super.connectedCallback(),(this.hasAttribute(`aria-label`)||this.hasAttribute(`aria-labelledby`))&&this.setAttribute(`role`,`group`)}};let Zt=0;var Qt=class extends h{static{this.tagName=`media-error-dialog`}#e=new _e;#t=new e(this,{context:Z});#n=`vjs-error-dialog-title-${Zt++}`;#r=`vjs-error-dialog-desc-${Zt++}`;#i=new v(this,T,Je);#a=null;#o=null;#s=null;constructor(){super(),this.#e.setTitleId(this.#n),this.#e.setDescriptionId(this.#r)}connectedCallback(){super.connectedCallback(),!this.destroyed&&(this.#a=pt({transition:At(),onOpenChange:e=>{e||this.#i.value?.dismissError()}}),this.#a.setElement(this),this.#o?this.#o.track(this.#a.input):this.#o=new b(this,this.#a.input))}disconnectedCallback(){super.disconnectedCallback(),this.#a?.destroy(),this.#a=null}willUpdate(e){if(super.willUpdate(e),!this.#a)return;let t=this.#i.value,n=!!t?.error,{active:r}=this.#a.input.current;t?.error&&(this.#s=t.error.message?.trim()||null);let i=this.querySelector(`media-alert-dialog-description`);i&&(i.textContent=this.#s??`An error occurred. Please try again.`),n&&!r?this.#a.open():!n&&r&&this.#a.close()}update(e){if(super.update(e),!this.#a)return;let t=this.#a.input.current;this.#e.setInput(t);let n=this.#e.getState();J(this,this.#e.getAttrs(n)),Y(this,n,fe),this.#t.setValue({state:n,stateAttrMap:fe,close:()=>this.#a?.close()})}};const $=C(Symbol(`@videojs/slider`));var $t=class extends Q{constructor(...e){super(...e),this.consumer=new m(this,{context:$,subscribe:!0})}static{this.tagName=`media-slider-buffer`}},en=class extends Q{constructor(...e){super(...e),this.consumer=new m(this,{context:$,subscribe:!0})}static{this.tagName=`media-slider-fill`}},tn=class extends h{constructor(...e){super(...e),this.overflow=`clamp`}static{this.tagName=`media-slider-preview`}static{this.properties={overflow:{type:String}}}#e=new m(this,{context:$,subscribe:!0});#t=null;#n=0;connectedCallback(){super.connectedCallback(),this.#t=new ResizeObserver(([e])=>{this.#n=e.contentRect.width,this.#r()}),this.#t.observe(this)}disconnectedCallback(){super.disconnectedCallback(),this.#t?.disconnect(),this.#t=null}#r(){k(this,Et(this.#n,this.overflow))}update(e){super.update(e);let t=this.#e.value;t&&Y(this,t.state,t.stateAttrMap),this.#r()}},nn=class extends h{static{this.tagName=`media-slider-thumb`}#e=new m(this,{context:$,subscribe:!0});#t=null;#n=!1;connectedCallback(){super.connectedCallback(),this.#t=new AbortController,this.#n=!1}disconnectedCallback(){super.disconnectedCallback(),this.#t?.abort(),this.#t=null,this.#n=!1}update(e){super.update(e);let t=this.#e.value;t&&(!this.#n&&this.#t&&(J(this,t.thumbProps,{signal:this.#t.signal}),this.#n=!0),J(this,t.thumbAttrs),Y(this,t.state,t.stateAttrMap))}},rn=class extends h{static{this.tagName=`media-thumbnail`}static{this.properties={time:{type:Number},crossOrigin:{type:String,attribute:`crossorigin`},loading:{type:String},fetchPriority:{type:String,attribute:`fetchpriority`}}}#e=new Ae;#t=document.createElement(`img`);#n=new v(this,T,$e);#r=[];#i;#a;#o=null;constructor(){super(),this.time=0;let e=this.attachShadow({mode:`open`}),t=document.createElement(`style`);t.textContent=`:host {
+  display: inline-block;
+  overflow: hidden;
+}
+img {
+  display: block;
+}`,e.appendChild(t),this.#t.alt=``,this.#t.setAttribute(`part`,`img`),this.#t.setAttribute(`aria-hidden`,`true`),this.#t.setAttribute(`decoding`,`async`),e.appendChild(this.#t)}get thumbnails(){return this.#i}set thumbnails(e){this.#i=e,this.requestUpdate()}connectedCallback(){super.connectedCallback(),!this.destroyed&&(this.#o=Dt({getContainer:()=>this,getImg:()=>this.#t,onStateChange:()=>this.requestUpdate()}))}disconnectedCallback(){super.disconnectedCallback()}destroyCallback(){this.#o?.destroy(),super.destroyCallback()}update(e){if(super.update(e),this.#i)this.#r=this.#i;else{let e=this.#n.value;e!==this.#a&&(this.#a=e,this.#r=e&&e.thumbnailCues.length>0?Ne(e.thumbnailCues,e.thumbnailTrackSrc??void 0):[])}let t=this.#e.findActiveThumbnail(this.#r,this.time);if(J(this.#t,{crossorigin:this.crossOrigin||void 0,loading:this.loading,fetchpriority:this.fetchPriority}),this.#o?.updateSrc(t?.url),!t){this.#t.removeAttribute(`src`),this.#c();let e=this.#e.getState(!1,!1,void 0);J(this,this.#e.getAttrs(e)),Y(this,e,je);return}this.#t.getAttribute(`src`)!==t.url&&(this.#t.src=t.url);let n=this.#o,r=this.#e.getState(n?.loading??!1,n?.error??!1,t);if(J(this,this.#e.getAttrs(r)),Y(this,r,je),n?.naturalWidth&&n.naturalHeight){let e=n.readConstraints(),r=this.#e.resize(t,n.naturalWidth,n.naturalHeight,e);r&&this.#s(r)}}#s(e){this.style.width=`${e.containerWidth}px`,this.style.height=`${e.containerHeight}px`;let t=this.#t.style;t.width=`${e.imageWidth}px`,t.height=`${e.imageHeight}px`,t.maxWidth=`none`,t.transform=e.offsetX||e.offsetY?`translate(-${e.offsetX}px, -${e.offsetY}px)`:``}#c(){this.style.width=``,this.style.height=``;let e=this.#t.style;e.width=``,e.height=``,e.maxWidth=``,e.transform=``}},an=class extends rn{static{this.tagName=`media-slider-thumbnail`}#e=new m(this,{context:$,subscribe:!0});update(e){let t=this.#e.value;t&&(this.time=t.pointerValue),super.update(e)}},on=class extends Q{constructor(...e){super(...e),this.consumer=new m(this,{context:$,subscribe:!0})}static{this.tagName=`media-slider-track`}},sn=class extends h{constructor(...e){super(...e),this.type=`current`}static{this.tagName=`media-slider-value`}static{this.properties={type:{type:String}}}#e=new m(this,{context:$,subscribe:!0});connectedCallback(){super.connectedCallback(),this.setAttribute(`aria-live`,`off`)}update(e){super.update(e);let t=this.#e.value;if(!t)return;let n=this.type===`pointer`?t.pointerValue:t.state.value;this.textContent=t.formatValue?t.formatValue(n,this.type):String(Math.round(n)),Y(this,t.state,t.stateAttrMap)}},cn=class extends h{constructor(...e){super(...e),this.type=R.defaultProps.type,this.negativeSign=R.defaultProps.negativeSign,this.label=R.defaultProps.label}static{this.tagName=`media-time`}static{this.properties={type:{type:String},negativeSign:{type:String,attribute:`negative-sign`},label:{type:String}}}#e=new R;#t=new v(this,T,W);#n=document.createElement(`span`);#r=document.createTextNode(``);connectedCallback(){super.connectedCallback(),this.#n.parentNode||(this.#n.setAttribute(`aria-hidden`,`true`),this.#n.hidden=!0,this.appendChild(this.#n),this.appendChild(this.#r))}willUpdate(e){super.willUpdate(e),this.#e.setProps(this)}update(e){super.update(e);let t=this.#t.value;if(!t)return;this.#e.setMedia(t);let n=this.#e.getState();this.#n.hidden=!n.negative,this.#n.textContent=n.negative?this.negativeSign:``,this.#r.textContent=n.text,J(this,this.#e.getAttrs(n)),Y(this,n,Ve)}},ln=class extends h{static{this.tagName=`media-time-group`}},un=class extends h{static{this.tagName=`media-time-separator`}connectedCallback(){super.connectedCallback(),this.setAttribute(`aria-hidden`,`true`),this.textContent?.trim()||(this.textContent=`/`)}},dn=class extends h{constructor(...e){super(...e),this.label=z.defaultProps.label,this.changeThrottle=z.defaultProps.changeThrottle,this.step=z.defaultProps.step,this.largeStep=z.defaultProps.largeStep,this.orientation=z.defaultProps.orientation,this.disabled=z.defaultProps.disabled,this.thumbAlignment=z.defaultProps.thumbAlignment}static{this.tagName=`media-time-slider`}static{this.properties={label:{type:String},changeThrottle:{type:Number,attribute:`change-throttle`},step:{type:Number},largeStep:{type:Number,attribute:`large-step`},orientation:{type:String},disabled:{type:Boolean},thumbAlignment:{type:String,attribute:`thumb-alignment`}}}#e=new z;#t=new e(this,{context:$});#n=new v(this,T,W);#r=new v(this,T,Ge);#i=null;#a=null;connectedCallback(){if(super.connectedCallback(),this.destroyed)return;this.#a=new AbortController;let e=this.#a.signal;this.#i=Ct({getElement:()=>this,getThumbElement:()=>this.querySelector(`media-slider-thumb`),getOrientation:()=>this.orientation,isRTL:()=>ce(this),isDisabled:()=>this.disabled||!this.#n.value,getPercent:()=>{let e=this.#n.value;return e?this.#e.percentFromValue(e.currentTime):0},getStepPercent:()=>this.#e.getStepPercent(),getLargeStepPercent:()=>this.#e.getLargeStepPercent(),onValueCommit:e=>{let t=this.#n.value;t&&t.seek(this.#e.rawValueFromPercent(e))},changeThrottle:this.changeThrottle,onDragStart:()=>{this.dispatchEvent(new CustomEvent(`drag-start`,{bubbles:!0}))},onDragEnd:()=>{this.dispatchEvent(new CustomEvent(`drag-end`,{bubbles:!0}))},adjustPercent:(e,t,n)=>this.#e.adjustPercentForAlignment(e,t,n),onResize:()=>this.requestUpdate()}),J(this,this.#i.rootProps,{signal:e}),k(this,this.#i.rootStyle),this.#i.input.subscribe(()=>this.requestUpdate(),{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this.#a?.abort(),this.#a=null}destroyCallback(){this.#i?.destroy(),super.destroyCallback()}willUpdate(e){super.willUpdate(e),this.#e.setProps(this)}update(e){if(super.update(e),!this.#i)return;let t=this.#n.value,n=this.#r.value;if(!t)return;this.#e.setInput(this.#i.input.current);let r={...t,...n??{buffered:[],seekable:[]}};this.#e.setMedia(r);let i=this.#e.getState(),a=Tt(this.#i.adjustForAlignment(i));k(this,a),Y(this,i,He),this.#t.setValue({state:i,stateAttrMap:He,pointerValue:this.#e.valueFromPercent(i.pointerPercent),thumbAttrs:this.#e.getAttrs(i),thumbProps:this.#i.thumbProps,formatValue:e=>Le(e,i.duration)})}},fn=class extends h{constructor(...e){super(...e),this.label=U.defaultProps.label,this.step=U.defaultProps.step,this.largeStep=U.defaultProps.largeStep,this.wheelStep=U.defaultProps.wheelStep,this.orientation=U.defaultProps.orientation,this.disabled=U.defaultProps.disabled,this.thumbAlignment=U.defaultProps.thumbAlignment}static{this.tagName=`media-volume-slider`}static{this.properties={label:{type:String},step:{type:Number},largeStep:{type:Number,attribute:`large-step`},wheelStep:{type:Number,attribute:`wheel-step`},orientation:{type:String},disabled:{type:Boolean},thumbAlignment:{type:String,attribute:`thumb-alignment`}}}#e=new U;#t=new e(this,{context:$});#n=new v(this,T,G);#r=null;#i=null;connectedCallback(){if(super.connectedCallback(),this.destroyed)return;this.#i=new AbortController;let e=this.#i.signal,t=()=>this.disabled||!this.#n.value,n=()=>(this.#n.value?.volume??0)*100,r=()=>this.#e.getStepPercent(),i=e=>this.#a(e);this.#r=Ct({getElement:()=>this,getThumbElement:()=>this.querySelector(`media-slider-thumb`),getOrientation:()=>this.orientation,isRTL:()=>ce(this),isDisabled:t,getPercent:n,getStepPercent:r,getLargeStepPercent:()=>this.#e.getLargeStepPercent(),onValueChange:i,onValueCommit:i,onDragStart:()=>{this.dispatchEvent(new CustomEvent(`drag-start`,{bubbles:!0}))},onDragEnd:()=>{this.dispatchEvent(new CustomEvent(`drag-end`,{bubbles:!0}))},adjustPercent:(e,t,n)=>this.#e.adjustPercentForAlignment(e,t,n),onResize:()=>this.requestUpdate()});let a=Mt({isDisabled:t,getPercent:n,getStepPercent:()=>this.#e.getWheelStepPercent(),onValueChange:i});J(this,this.#r.rootProps,{signal:e}),J(this,a,{signal:e}),k(this,this.#r.rootStyle),this.#r.input.subscribe(()=>this.requestUpdate(),{signal:e})}disconnectedCallback(){super.disconnectedCallback(),this.#i?.abort(),this.#i=null}destroyCallback(){this.#r?.destroy(),super.destroyCallback()}willUpdate(e){super.willUpdate(e),this.#e.setProps(this)}update(e){if(super.update(e),!this.#r)return;let t=this.#n.value;if(!t)return;this.#e.setInput(this.#r.input.current),this.#e.setMedia(t);let n=this.#e.getState(),r=wt(this.#r.adjustForAlignment(n));k(this,r),Y(this,n,We),this.#t.setValue({state:n,stateAttrMap:We,pointerValue:this.#e.valueFromPercent(n.pointerPercent),thumbAttrs:this.#e.getAttrs(n),thumbProps:this.#r.thumbProps,formatValue:e=>`${Math.round(e)}%`})}#a(e){this.#n.value?.setVolume(this.#e.valueFromPercent(e)/100)}};function pn(){w(Yt),w(Xt)}function mn(){w(Qt),w(Gt),w(Kt),w(qt)}function hn(){w(en),w(tn),w(nn),w(on),w(sn)}function gn(){w(cn),w(ln),w(un)}function _n(){w(dn),hn(),w($t),w(an)}function vn(){w(fn),hn()}export{G as C,W as S,Ye as _,vn as a,Qe as b,Bt as c,It as d,Ft as f,Ke as g,dt as h,_n as i,zt as l,Y as m,mn as n,Wt as o,X as p,gn as r,Ut as s,pn as t,Lt as u,Xe as v,j as w,$e as x,Ze as y};
+//# sourceMappingURL=compounds-CCgS3IGo.js.map