npm - @videojs/react - Versions diffs - 10.0.0-beta.27 → 10.0.0-beta.29 - Mend

@videojs/react 10.0.0-beta.27 → 10.0.0-beta.29

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (865) hide show

package/dist/default/ui/seek-indicator/seek-indicator-root.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { renderElement } from "../../utils/use-render.js";
 import { useInputIndicatorRoot } from "../input-indicator/use-input-indicator-root.js";
 import { SeekIndicatorProvider } from "./context.js";

package/dist/default/ui/seek-indicator/seek-indicator-root.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"seek-indicator-root.js","names":[],"sources":["../../../../src/ui/seek-indicator/seek-indicator-root.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ { SeekIndicatorCore, SeekIndicatorDataAttrs } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useInputIndicatorRoot } from '../input-indicator/use-input-indicator-root';\nimport { SeekIndicatorProvider } from './context';\n\nexport interface SeekIndicatorRootProps\n extends UIComponentProps<'div', SeekIndicatorCore.State>,\n SeekIndicatorCore.Props {}\n\nexport const SeekIndicatorRoot = forwardRef(function SeekIndicatorRoot(\n componentProps: SeekIndicatorRootProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const { render, className, style, closeDelay, ...elementProps } = componentProps;\n const { elementRef, present, state } = useInputIndicatorRoot(() => new SeekIndicatorCore(), { closeDelay });\n\n if (!present) return null;\n\n return (\n <SeekIndicatorProvider value={{ state }}>\n {renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: SeekIndicatorDataAttrs,\n ref: [forwardedRef, elementRef],\n props: [elementProps],\n }\n )}\n </SeekIndicatorProvider>\n );\n});\n\nexport namespace SeekIndicatorRoot {\n export type Props = SeekIndicatorRootProps;\n export type State = SeekIndicatorCore.State;\n}\n"],"mappings":"~~;;;;;;;;AAeA~~,MAAa,oBAAoB,WAAW,SAAS,kBACnD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,YAAY,GAAG,iBAAiB;CAClE,MAAM,EAAE,YAAY,SAAS,UAAU,4BAA4B,IAAI,kBAAkB,GAAG,EAAE,WAAW,CAAC;CAE1G,IAAI,CAAC,SAAS,OAAO;CAErB,OACE,oBAAC,uBAAD;EAAuB,OAAO,EAAE,MAAM;EACnC,UAAA,cACC,OACA;GAAE;GAAQ;GAAW;EAAM,GAC3B;GACE;GACA,cAAc;GACd,KAAK,CAAC,cAAc,UAAU;GAC9B,OAAO,CAAC,YAAY;EACtB,CACF;CACqB,CAAA;AAE3B,CAAC"}
1	+ {"version":3,"file":"seek-indicator-root.js","names":[],"sources":["../../../../src/ui/seek-indicator/seek-indicator-root.tsx"],"sourcesContent":["import { SeekIndicatorCore, SeekIndicatorDataAttrs } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useInputIndicatorRoot } from '../input-indicator/use-input-indicator-root';\nimport { SeekIndicatorProvider } from './context';\n\nexport interface SeekIndicatorRootProps\n extends UIComponentProps<'div', SeekIndicatorCore.State>,\n SeekIndicatorCore.Props {}\n\nexport const SeekIndicatorRoot = forwardRef(function SeekIndicatorRoot(\n componentProps: SeekIndicatorRootProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const { render, className, style, closeDelay, ...elementProps } = componentProps;\n const { elementRef, present, state } = useInputIndicatorRoot(() => new SeekIndicatorCore(), { closeDelay });\n\n if (!present) return null;\n\n return (\n <SeekIndicatorProvider value={{ state }}>\n {renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: SeekIndicatorDataAttrs,\n ref: [forwardedRef, elementRef],\n props: [elementProps],\n }\n )}\n </SeekIndicatorProvider>\n );\n});\n\nexport namespace SeekIndicatorRoot {\n export type Props = SeekIndicatorRootProps;\n export type State = SeekIndicatorCore.State;\n}\n"],"mappings":";;;;;;;AAaA,MAAa,oBAAoB,WAAW,SAAS,kBACnD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,YAAY,GAAG,iBAAiB;CAClE,MAAM,EAAE,YAAY,SAAS,UAAU,4BAA4B,IAAI,kBAAkB,GAAG,EAAE,WAAW,CAAC;CAE1G,IAAI,CAAC,SAAS,OAAO;CAErB,OACE,oBAAC,uBAAD;EAAuB,OAAO,EAAE,MAAM;EACnC,UAAA,cACC,OACA;GAAE;GAAQ;GAAW;EAAM,GAC3B;GACE;GACA,cAAc;GACd,KAAK,CAAC,cAAc,UAAU;GAC9B,OAAO,CAAC,YAAY;EACtB,CACF;CACqB,CAAA;AAE3B,CAAC"}

package/dist/default/ui/seek-indicator/seek-indicator-value.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { renderElement } from "../../utils/use-render.js";
 import { useSeekIndicatorContext } from "./context.js";
 import { forwardRef } from "react";

package/dist/default/ui/seek-indicator/seek-indicator-value.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"seek-indicator-value.js","names":[],"sources":["../../../../src/ui/seek-indicator/seek-indicator-value.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ { getSeekIndicatorDisplayValue, type SeekIndicatorCore } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useSeekIndicatorContext } from './context';\n\nexport interface SeekIndicatorValueProps extends UIComponentProps<'div', SeekIndicatorCore.State> {}\n\nexport const SeekIndicatorValue = forwardRef(function SeekIndicatorValue(\n componentProps: SeekIndicatorValueProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const { render, className, style, ...elementProps } = componentProps;\n const { state } = useSeekIndicatorContext();\n\n return renderElement(\n 'div',\n { render, className, style },\n {\n state,\n ref: forwardedRef,\n props: [{ children: getSeekIndicatorDisplayValue(state) }, elementProps],\n }\n );\n});\n\nexport namespace SeekIndicatorValue {\n export type Props = SeekIndicatorValueProps;\n}\n"],"mappings":"~~;;;;;;AAYA~~,MAAa,qBAAqB,WAAW,SAAS,mBACpD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CACtD,MAAM,EAAE,UAAU,wBAAwB;CAE1C,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,KAAK;EACL,OAAO,CAAC,EAAE,UAAU,6BAA6B,KAAK,EAAE,GAAG,YAAY;CACzE,CACF;AACF,CAAC"}
1	+ {"version":3,"file":"seek-indicator-value.js","names":[],"sources":["../../../../src/ui/seek-indicator/seek-indicator-value.tsx"],"sourcesContent":["import { getSeekIndicatorDisplayValue, type SeekIndicatorCore } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useSeekIndicatorContext } from './context';\n\nexport interface SeekIndicatorValueProps extends UIComponentProps<'div', SeekIndicatorCore.State> {}\n\nexport const SeekIndicatorValue = forwardRef(function SeekIndicatorValue(\n componentProps: SeekIndicatorValueProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const { render, className, style, ...elementProps } = componentProps;\n const { state } = useSeekIndicatorContext();\n\n return renderElement(\n 'div',\n { render, className, style },\n {\n state,\n ref: forwardedRef,\n props: [{ children: getSeekIndicatorDisplayValue(state) }, elementProps],\n }\n );\n});\n\nexport namespace SeekIndicatorValue {\n export type Props = SeekIndicatorValueProps;\n}\n"],"mappings":";;;;;AAUA,MAAa,qBAAqB,WAAW,SAAS,mBACpD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CACtD,MAAM,EAAE,UAAU,wBAAwB;CAE1C,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,KAAK;EACL,OAAO,CAAC,EAAE,UAAU,6BAA6B,KAAK,EAAE,GAAG,YAAY;CACzE,CACF;AACF,CAAC"}

package/dist/default/ui/slider/context.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { createContext, useContext, useSyncExternalStore } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/ui/slider/context.tsx

package/dist/default/ui/slider/context.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/slider/context.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ type { SliderInput, SliderState, StateAttrMap } from '@videojs/core';\nimport type { SliderThumbProps } from '@videojs/core/dom';\nimport type { State } from '@videojs/store';\nimport type { ProviderProps, RefCallback } from 'react';\nimport { createContext, useContext, useSyncExternalStore } from 'react';\n\nexport interface SliderContextValue {\n state: SliderState;\n /** Pointer position converted to the value domain (not 0–100 percent). */\n pointerValue: number;\n input?: State<SliderInput> \| undefined;\n getPointerValue?: ((percent: number) => number) \| undefined;\n thumbRef: RefCallback<HTMLElement>;\n thumbProps: SliderThumbProps;\n stateAttrMap: StateAttrMap<SliderState>;\n getAttrs: (state: SliderState) => object;\n formatValue?: ((value: number, type: 'current' \| 'pointer') => string) \| undefined;\n}\n\nconst SliderContext = createContext<SliderContextValue \| null>(null);\n\ntype SliderProviderProps = ProviderProps<SliderContextValue>;\n\nexport function SliderProvider({ value, children }: SliderProviderProps) {\n return <SliderContext.Provider value={value}>{children}</SliderContext.Provider>;\n}\n\nexport function useSliderContext(): SliderContextValue {\n const ctx = useContext(SliderContext);\n if (!ctx) throw new Error('Slider compound components must be used within a Slider.Root');\n return ctx;\n}\n\nexport function useSliderPointerValue(enabled = true): number {\n const context = useSliderContext();\n const percent = useSyncExternalStore(\n (onChange) => context.input?.subscribe(onChange) ?? (() => {}),\n () => (enabled ? (context.input?.current.pointerPercent ?? null) : null),\n () => (enabled ? (context.input?.current.pointerPercent ?? null) : null)\n );\n return percent === null ? context.pointerValue : (context.getPointerValue?.(percent) ?? context.pointerValue);\n}\n"],"mappings":"~~;;;;AAqBA~~,MAAM,gBAAgB,cAAyC,IAAI;AAInE,SAAgB,eAAe,EAAE,OAAO,YAAiC;CACvE,OAAO,oBAAC,cAAc,UAAf;EAA+B;EAAQ;CAAiC,CAAA;AACjF;AAEA,SAAgB,mBAAuC;CACrD,MAAM,MAAM,WAAW,aAAa;CACpC,IAAI,CAAC,KAAK,MAAM,IAAI,MAAM,8DAA8D;CACxF,OAAO;AACT;AAEA,SAAgB,sBAAsB,UAAU,MAAc;CAC5D,MAAM,UAAU,iBAAiB;CACjC,MAAM,UAAU,sBACb,aAAa,QAAQ,OAAO,UAAU,QAAQ,YAAY,CAAC,UACrD,UAAW,QAAQ,OAAO,QAAQ,kBAAkB,OAAQ,YAC5D,UAAW,QAAQ,OAAO,QAAQ,kBAAkB,OAAQ,IACrE;CACA,OAAO,YAAY,OAAO,QAAQ,eAAgB,QAAQ,kBAAkB,OAAO,KAAK,QAAQ;AAClG"}
1	+ {"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/slider/context.tsx"],"sourcesContent":["import type { SliderInput, SliderState, StateAttrMap } from '@videojs/core';\nimport type { SliderThumbProps } from '@videojs/core/dom';\nimport type { State } from '@videojs/store';\nimport type { ProviderProps, RefCallback } from 'react';\nimport { createContext, useContext, useSyncExternalStore } from 'react';\n\nexport interface SliderContextValue {\n state: SliderState;\n /** Pointer position converted to the value domain (not 0–100 percent). */\n pointerValue: number;\n input?: State<SliderInput> \| undefined;\n getPointerValue?: ((percent: number) => number) \| undefined;\n thumbRef: RefCallback<HTMLElement>;\n thumbProps: SliderThumbProps;\n stateAttrMap: StateAttrMap<SliderState>;\n getAttrs: (state: SliderState) => object;\n formatValue?: ((value: number, type: 'current' \| 'pointer') => string) \| undefined;\n}\n\nconst SliderContext = createContext<SliderContextValue \| null>(null);\n\ntype SliderProviderProps = ProviderProps<SliderContextValue>;\n\nexport function SliderProvider({ value, children }: SliderProviderProps) {\n return <SliderContext.Provider value={value}>{children}</SliderContext.Provider>;\n}\n\nexport function useSliderContext(): SliderContextValue {\n const ctx = useContext(SliderContext);\n if (!ctx) throw new Error('Slider compound components must be used within a Slider.Root');\n return ctx;\n}\n\nexport function useSliderPointerValue(enabled = true): number {\n const context = useSliderContext();\n const percent = useSyncExternalStore(\n (onChange) => context.input?.subscribe(onChange) ?? (() => {}),\n () => (enabled ? (context.input?.current.pointerPercent ?? null) : null),\n () => (enabled ? (context.input?.current.pointerPercent ?? null) : null)\n );\n return percent === null ? context.pointerValue : (context.getPointerValue?.(percent) ?? context.pointerValue);\n}\n"],"mappings":";;;AAmBA,MAAM,gBAAgB,cAAyC,IAAI;AAInE,SAAgB,eAAe,EAAE,OAAO,YAAiC;CACvE,OAAO,oBAAC,cAAc,UAAf;EAA+B;EAAQ;CAAiC,CAAA;AACjF;AAEA,SAAgB,mBAAuC;CACrD,MAAM,MAAM,WAAW,aAAa;CACpC,IAAI,CAAC,KAAK,MAAM,IAAI,MAAM,8DAA8D;CACxF,OAAO;AACT;AAEA,SAAgB,sBAAsB,UAAU,MAAc;CAC5D,MAAM,UAAU,iBAAiB;CACjC,MAAM,UAAU,sBACb,aAAa,QAAQ,OAAO,UAAU,QAAQ,YAAY,CAAC,UACrD,UAAW,QAAQ,OAAO,QAAQ,kBAAkB,OAAQ,YAC5D,UAAW,QAAQ,OAAO,QAAQ,kBAAkB,OAAQ,IACrE;CACA,OAAO,YAAY,OAAO,QAAQ,eAAgB,QAAQ,kBAAkB,OAAO,KAAK,QAAQ;AAClG"}

package/dist/default/ui/slider/slider-buffer.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { createContextPart } from "../create-context-part.js";
 import { useSliderContext } from "./context.js";
 //#region src/ui/slider/slider-buffer.tsx

package/dist/default/ui/slider/slider-buffer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider-buffer.js","names":[],"sources":["../../../../src/ui/slider/slider-buffer.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ type { SliderState } from '@videojs/core';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createContextPart } from '../create-context-part';\nimport { useSliderContext } from './context';\n\nexport interface SliderBufferProps extends UIComponentProps<'div', SliderState> {}\n\n/** Displays the buffered range on the slider track. */\nexport const SliderBuffer = createContextPart<SliderBufferProps, SliderState>({\n displayName: 'SliderBuffer',\n tag: 'div',\n useContext: useSliderContext,\n});\n\nexport namespace SliderBuffer {\n export type Props = SliderBufferProps;\n}\n"],"mappings":"~~;;;;;AAWA~~,MAAa,eAAe,kBAAkD;CAC5E,aAAa;CACb,KAAK;CACL,YAAY;AACd,CAAC"}
1	+ {"version":3,"file":"slider-buffer.js","names":[],"sources":["../../../../src/ui/slider/slider-buffer.tsx"],"sourcesContent":["import type { SliderState } from '@videojs/core';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createContextPart } from '../create-context-part';\nimport { useSliderContext } from './context';\n\nexport interface SliderBufferProps extends UIComponentProps<'div', SliderState> {}\n\n/** Displays the buffered range on the slider track. */\nexport const SliderBuffer = createContextPart<SliderBufferProps, SliderState>({\n displayName: 'SliderBuffer',\n tag: 'div',\n useContext: useSliderContext,\n});\n\nexport namespace SliderBuffer {\n export type Props = SliderBufferProps;\n}\n"],"mappings":";;;;AASA,MAAa,eAAe,kBAAkD;CAC5E,aAAa;CACb,KAAK;CACL,YAAY;AACd,CAAC"}

package/dist/default/ui/slider/slider-fill.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { createContextPart } from "../create-context-part.js";
 import { useSliderContext } from "./context.js";
 //#region src/ui/slider/slider-fill.tsx

package/dist/default/ui/slider/slider-fill.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider-fill.js","names":[],"sources":["../../../../src/ui/slider/slider-fill.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ type { SliderState } from '@videojs/core';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createContextPart } from '../create-context-part';\nimport { useSliderContext } from './context';\n\nexport interface SliderFillProps extends UIComponentProps<'div', SliderState> {}\n\n/** Displays the filled portion from start to the current value. */\nexport const SliderFill = createContextPart<SliderFillProps, SliderState>({\n displayName: 'SliderFill',\n tag: 'div',\n useContext: useSliderContext,\n});\n\nexport namespace SliderFill {\n export type Props = SliderFillProps;\n}\n"],"mappings":"~~;;;;;AAWA~~,MAAa,aAAa,kBAAgD;CACxE,aAAa;CACb,KAAK;CACL,YAAY;AACd,CAAC"}
1	+ {"version":3,"file":"slider-fill.js","names":[],"sources":["../../../../src/ui/slider/slider-fill.tsx"],"sourcesContent":["import type { SliderState } from '@videojs/core';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createContextPart } from '../create-context-part';\nimport { useSliderContext } from './context';\n\nexport interface SliderFillProps extends UIComponentProps<'div', SliderState> {}\n\n/** Displays the filled portion from start to the current value. */\nexport const SliderFill = createContextPart<SliderFillProps, SliderState>({\n displayName: 'SliderFill',\n tag: 'div',\n useContext: useSliderContext,\n});\n\nexport namespace SliderFill {\n export type Props = SliderFillProps;\n}\n"],"mappings":";;;;AASA,MAAa,aAAa,kBAAgD;CACxE,aAAa;CACb,KAAK;CACL,YAAY;AACd,CAAC"}

package/dist/default/ui/slider/slider-preview.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { renderElement } from "../../utils/use-render.js";
 import { useSliderContext } from "./context.js";
 import { getSliderPreviewStyle } from "@videojs/core/dom";

package/dist/default/ui/slider/slider-preview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider-preview.js","names":[],"sources":["../../../../src/ui/slider/slider-preview.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ type { ~~SliderState~~ } ~~from~~ ~~'@videojs/core';\nimport~~ ~~type { SliderPreviewOverflow~~ } from '@videojs/core~~/dom~~';\nimport { getSliderPreviewStyle } from '@videojs/core/dom';\nimport { observeResize } from '@videojs/utils/dom';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef, useEffect, useRef, useState } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useSliderContext } from './context';\n\nexport interface SliderPreviewProps extends UIComponentProps<'div', SliderState> {\n /** How the preview handles the slider boundaries. `'clamp'` keeps the preview within bounds, `'visible'` allows it to extend beyond the edges. /\n overflow?: SliderPreviewOverflow \| undefined;\n}\n\n/* Positioning container for preview content that tracks the pointer along the slider. */\nexport const SliderPreview = forwardRef(function SliderPreview(\n componentProps: SliderPreviewProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const { render, className, style, overflow = 'clamp', ...elementProps } = componentProps;\n\n const context = useSliderContext();\n const { state } = context;\n\n const measureRef = useRef<HTMLDivElement>(null);\n const [width, setWidth] = useState(0);\n\n useEffect(() => {\n const el = measureRef.current;\n if (!el) return;\n\n return observeResize(el, ([entry]) => {\n setWidth(entry!.contentRect.width);\n });\n }, []);\n\n const positionStyle = getSliderPreviewStyle(width, overflow);\n\n return renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: context.stateAttrMap,\n ref: [forwardedRef, measureRef],\n props: [{ style: positionStyle }, elementProps],\n }\n );\n});\n\nexport namespace SliderPreview {\n export type Props = SliderPreviewProps;\n}\n"],"mappings":"~~;;;;;;;;AAmBA~~,MAAa,gBAAgB,WAAW,SAAS,cAC/C,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,WAAW,SAAS,GAAG,iBAAiB;CAE1E,MAAM,UAAU,iBAAiB;CACjC,MAAM,EAAE,UAAU;CAElB,MAAM,aAAa,OAAuB,IAAI;CAC9C,MAAM,CAAC,OAAO,YAAY,SAAS,CAAC;CAEpC,gBAAgB;EACd,MAAM,KAAK,WAAW;EACtB,IAAI,CAAC,IAAI;EAET,OAAO,cAAc,KAAK,CAAC,WAAW;GACpC,SAAS,MAAO,YAAY,KAAK;EACnC,CAAC;CACH,GAAG,CAAC,CAAC;CAEL,MAAM,gBAAgB,sBAAsB,OAAO,QAAQ;CAE3D,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,cAAc,QAAQ;EACtB,KAAK,CAAC,cAAc,UAAU;EAC9B,OAAO,CAAC,EAAE,OAAO,cAAc,GAAG,YAAY;CAChD,CACF;AACF,CAAC"}
1	+ {"version":3,"file":"slider-preview.js","names":[],"sources":["../../../../src/ui/slider/slider-preview.tsx"],"sourcesContent":["import type { SliderPreviewProps as CoreSliderPreviewProps, SliderState } from '@videojs/core';\nimport { getSliderPreviewStyle } from '@videojs/core/dom';\nimport { observeResize } from '@videojs/utils/dom';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef, useEffect, useRef, useState } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useSliderContext } from './context';\n\nexport interface SliderPreviewProps extends CoreSliderPreviewProps, UIComponentProps<'div', SliderState> {}\n\n/** Positioning container for preview content that tracks the pointer along the slider. */\nexport const SliderPreview = forwardRef(function SliderPreview(\n componentProps: SliderPreviewProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const { render, className, style, overflow = 'clamp', ...elementProps } = componentProps;\n\n const context = useSliderContext();\n const { state } = context;\n\n const measureRef = useRef<HTMLDivElement>(null);\n const [width, setWidth] = useState(0);\n\n useEffect(() => {\n const el = measureRef.current;\n if (!el) return;\n\n return observeResize(el, ([entry]) => {\n setWidth(entry!.contentRect.width);\n });\n }, []);\n\n const positionStyle = getSliderPreviewStyle(width, overflow);\n\n return renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: context.stateAttrMap,\n ref: [forwardedRef, measureRef],\n props: [{ style: positionStyle }, elementProps],\n }\n );\n});\n\nexport namespace SliderPreview {\n export type Props = SliderPreviewProps;\n}\n"],"mappings":";;;;;;;AAaA,MAAa,gBAAgB,WAAW,SAAS,cAC/C,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,WAAW,SAAS,GAAG,iBAAiB;CAE1E,MAAM,UAAU,iBAAiB;CACjC,MAAM,EAAE,UAAU;CAElB,MAAM,aAAa,OAAuB,IAAI;CAC9C,MAAM,CAAC,OAAO,YAAY,SAAS,CAAC;CAEpC,gBAAgB;EACd,MAAM,KAAK,WAAW;EACtB,IAAI,CAAC,IAAI;EAET,OAAO,cAAc,KAAK,CAAC,WAAW;GACpC,SAAS,MAAO,YAAY,KAAK;EACnC,CAAC;CACH,GAAG,CAAC,CAAC;CAEL,MAAM,gBAAgB,sBAAsB,OAAO,QAAQ;CAE3D,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,cAAc,QAAQ;EACtB,KAAK,CAAC,cAAc,UAAU;EAC9B,OAAO,CAAC,EAAE,OAAO,cAAc,GAAG,YAAY;CAChD,CACF;AACF,CAAC"}

package/dist/default/ui/slider/slider-root.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { useTranslator } from "../../i18n/context.js";
 import { renderElement } from "../../utils/use-render.js";
 import { useSlider } from "../hooks/use-slider.js";

package/dist/default/ui/slider/slider-root.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider-root.js","names":[],"sources":["../../../../src/ui/slider/slider-root.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ { SliderCore, SliderDataAttrs } from '@videojs/core';\nimport { getSliderCSSVars } from '@videojs/core/dom';\nimport { translateText } from '@videojs/core/i18n';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef, useState } from 'react';\nimport { useTranslator } from '../../i18n/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useSlider } from '../hooks/use-slider';\nimport { SliderProvider } from './context';\n\nexport interface SliderRootProps extends UIComponentProps<'div', SliderCore.State>, SliderCore.Props {\n onValueChange?: ((value: number) => void) \| undefined;\n onValueCommit?: ((value: number) => void) \| undefined;\n onDragStart?: (() => void) \| undefined;\n onDragEnd?: (() => void) \| undefined;\n}\n\nexport const SliderRoot = forwardRef(function SliderRoot(\n componentProps: SliderRootProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const {\n render,\n className,\n style,\n label,\n min,\n max,\n step,\n largeStep,\n orientation,\n disabled,\n thumbAlignment,\n value = 0,\n onValueChange,\n onValueCommit,\n onDragStart,\n onDragEnd,\n ...elementProps\n } = componentProps;\n\n const [core] = useState(() => new SliderCore());\n const translator = useTranslator();\n core.setProps({ label, min, max, step, largeStep, orientation, disabled, thumbAlignment });\n\n const {\n state,\n input,\n cssVars,\n rootRef,\n thumbRef: sliderThumbRef,\n rootProps,\n rootStyle,\n thumbProps,\n } = useSlider({\n computeState: (input) => {\n core.setInput(input);\n return core.getSliderState(value);\n },\n getPercent: () => core.percentFromValue(value),\n getStepPercent: () => core.getStepPercent(),\n getLargeStepPercent: () => core.getLargeStepPercent(),\n orientation,\n disabled,\n adjustPercent: (rawPercent, thumbSize, trackSize) =>\n core.adjustPercentForAlignment(rawPercent, thumbSize, trackSize),\n getCSSVars: getSliderCSSVars,\n onValueChange: (percent) => onValueChange?.(core.valueFromPercent(percent)),\n onValueCommit: (percent) => onValueCommit?.(core.valueFromPercent(percent)),\n onDragStart,\n onDragEnd,\n });\n\n return (\n <SliderProvider\n value={{\n state,\n pointerValue: core.valueFromPercent(state.pointerPercent),\n input,\n getPointerValue: (percent) => core.valueFromPercent(percent),\n thumbRef: sliderThumbRef,\n thumbProps,\n stateAttrMap: SliderDataAttrs,\n getAttrs: (sliderState) => {\n const attrs = core.getAttrs(sliderState);\n return { ...attrs, 'aria-label': translateText(attrs['aria-label'], translator) };\n },\n formatValue: undefined,\n }}\n >\n {renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: SliderDataAttrs,\n ref: [forwardedRef, rootRef],\n props: [{ style: { ...cssVars, ...rootStyle } }, rootProps, elementProps],\n }\n )}\n </SliderProvider>\n );\n});\n\nexport namespace SliderRoot {\n export type Props = SliderRootProps;\n export type State = SliderCore.State;\n}\n"],"mappings":"~~;;;;;;;;;;;AAoBA~~,MAAa,aAAa,WAAW,SAAS,WAC5C,gBACA,cACA;CACA,MAAM,EACJ,QACA,WACA,OACA,OACA,KACA,KACA,MACA,WACA,aACA,UACA,gBACA,QAAQ,GACR,eACA,eACA,aACA,WACA,GAAG,iBACD;CAEJ,MAAM,CAAC,QAAQ,eAAe,IAAI,WAAW,CAAC;CAC9C,MAAM,aAAa,cAAc;CACjC,KAAK,SAAS;EAAE;EAAO;EAAK;EAAK;EAAM;EAAW;EAAa;EAAU;CAAe,CAAC;CAEzF,MAAM,EACJ,OACA,OACA,SACA,SACA,UAAU,gBACV,WACA,WACA,eACE,UAAU;EACZ,eAAe,UAAU;GACvB,KAAK,SAAS,KAAK;GACnB,OAAO,KAAK,eAAe,KAAK;EAClC;EACA,kBAAkB,KAAK,iBAAiB,KAAK;EAC7C,sBAAsB,KAAK,eAAe;EAC1C,2BAA2B,KAAK,oBAAoB;EACpD;EACA;EACA,gBAAgB,YAAY,WAAW,cACrC,KAAK,0BAA0B,YAAY,WAAW,SAAS;EACjE,YAAY;EACZ,gBAAgB,YAAY,gBAAgB,KAAK,iBAAiB,OAAO,CAAC;EAC1E,gBAAgB,YAAY,gBAAgB,KAAK,iBAAiB,OAAO,CAAC;EAC1E;EACA;CACF,CAAC;CAED,OACE,oBAAC,gBAAD;EACE,OAAO;GACL;GACA,cAAc,KAAK,iBAAiB,MAAM,cAAc;GACxD;GACA,kBAAkB,YAAY,KAAK,iBAAiB,OAAO;GAC3D,UAAU;GACV;GACA,cAAc;GACd,WAAW,gBAAgB;IACzB,MAAM,QAAQ,KAAK,SAAS,WAAW;IACvC,OAAO;KAAE,GAAG;KAAO,cAAc,cAAc,MAAM,eAAe,UAAU;IAAE;GAClF;GACA,aAAa,KAAA;EACf;EAEC,UAAA,cACC,OACA;GAAE;GAAQ;GAAW;EAAM,GAC3B;GACE;GACA,cAAc;GACd,KAAK,CAAC,cAAc,OAAO;GAC3B,OAAO;IAAC,EAAE,OAAO;KAAE,GAAG;KAAS,GAAG;IAAU,EAAE;IAAG;IAAW;GAAY;EAC1E,CACF;CACc,CAAA;AAEpB,CAAC"}
1	+ {"version":3,"file":"slider-root.js","names":[],"sources":["../../../../src/ui/slider/slider-root.tsx"],"sourcesContent":["import { SliderCore, SliderDataAttrs } from '@videojs/core';\nimport { getSliderCSSVars } from '@videojs/core/dom';\nimport { translateText } from '@videojs/core/i18n';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef, useState } from 'react';\nimport { useTranslator } from '../../i18n/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useSlider } from '../hooks/use-slider';\nimport { SliderProvider } from './context';\n\nexport interface SliderRootProps extends UIComponentProps<'div', SliderCore.State>, SliderCore.Props {\n onValueChange?: ((value: number) => void) \| undefined;\n onValueCommit?: ((value: number) => void) \| undefined;\n onDragStart?: (() => void) \| undefined;\n onDragEnd?: (() => void) \| undefined;\n}\n\nexport const SliderRoot = forwardRef(function SliderRoot(\n componentProps: SliderRootProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const {\n render,\n className,\n style,\n label,\n min,\n max,\n step,\n largeStep,\n orientation,\n disabled,\n thumbAlignment,\n value = 0,\n onValueChange,\n onValueCommit,\n onDragStart,\n onDragEnd,\n ...elementProps\n } = componentProps;\n\n const [core] = useState(() => new SliderCore());\n const translator = useTranslator();\n core.setProps({ label, min, max, step, largeStep, orientation, disabled, thumbAlignment });\n\n const {\n state,\n input,\n cssVars,\n rootRef,\n thumbRef: sliderThumbRef,\n rootProps,\n rootStyle,\n thumbProps,\n } = useSlider({\n computeState: (input) => {\n core.setInput(input);\n return core.getSliderState(value);\n },\n getPercent: () => core.percentFromValue(value),\n getStepPercent: () => core.getStepPercent(),\n getLargeStepPercent: () => core.getLargeStepPercent(),\n orientation,\n disabled,\n adjustPercent: (rawPercent, thumbSize, trackSize) =>\n core.adjustPercentForAlignment(rawPercent, thumbSize, trackSize),\n getCSSVars: getSliderCSSVars,\n onValueChange: (percent) => onValueChange?.(core.valueFromPercent(percent)),\n onValueCommit: (percent) => onValueCommit?.(core.valueFromPercent(percent)),\n onDragStart,\n onDragEnd,\n });\n\n return (\n <SliderProvider\n value={{\n state,\n pointerValue: core.valueFromPercent(state.pointerPercent),\n input,\n getPointerValue: (percent) => core.valueFromPercent(percent),\n thumbRef: sliderThumbRef,\n thumbProps,\n stateAttrMap: SliderDataAttrs,\n getAttrs: (sliderState) => {\n const attrs = core.getAttrs(sliderState);\n return { ...attrs, 'aria-label': translateText(attrs['aria-label'], translator) };\n },\n formatValue: undefined,\n }}\n >\n {renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: SliderDataAttrs,\n ref: [forwardedRef, rootRef],\n props: [{ style: { ...cssVars, ...rootStyle } }, rootProps, elementProps],\n }\n )}\n </SliderProvider>\n );\n});\n\nexport namespace SliderRoot {\n export type Props = SliderRootProps;\n export type State = SliderCore.State;\n}\n"],"mappings":";;;;;;;;;;AAkBA,MAAa,aAAa,WAAW,SAAS,WAC5C,gBACA,cACA;CACA,MAAM,EACJ,QACA,WACA,OACA,OACA,KACA,KACA,MACA,WACA,aACA,UACA,gBACA,QAAQ,GACR,eACA,eACA,aACA,WACA,GAAG,iBACD;CAEJ,MAAM,CAAC,QAAQ,eAAe,IAAI,WAAW,CAAC;CAC9C,MAAM,aAAa,cAAc;CACjC,KAAK,SAAS;EAAE;EAAO;EAAK;EAAK;EAAM;EAAW;EAAa;EAAU;CAAe,CAAC;CAEzF,MAAM,EACJ,OACA,OACA,SACA,SACA,UAAU,gBACV,WACA,WACA,eACE,UAAU;EACZ,eAAe,UAAU;GACvB,KAAK,SAAS,KAAK;GACnB,OAAO,KAAK,eAAe,KAAK;EAClC;EACA,kBAAkB,KAAK,iBAAiB,KAAK;EAC7C,sBAAsB,KAAK,eAAe;EAC1C,2BAA2B,KAAK,oBAAoB;EACpD;EACA;EACA,gBAAgB,YAAY,WAAW,cACrC,KAAK,0BAA0B,YAAY,WAAW,SAAS;EACjE,YAAY;EACZ,gBAAgB,YAAY,gBAAgB,KAAK,iBAAiB,OAAO,CAAC;EAC1E,gBAAgB,YAAY,gBAAgB,KAAK,iBAAiB,OAAO,CAAC;EAC1E;EACA;CACF,CAAC;CAED,OACE,oBAAC,gBAAD;EACE,OAAO;GACL;GACA,cAAc,KAAK,iBAAiB,MAAM,cAAc;GACxD;GACA,kBAAkB,YAAY,KAAK,iBAAiB,OAAO;GAC3D,UAAU;GACV;GACA,cAAc;GACd,WAAW,gBAAgB;IACzB,MAAM,QAAQ,KAAK,SAAS,WAAW;IACvC,OAAO;KAAE,GAAG;KAAO,cAAc,cAAc,MAAM,eAAe,UAAU;IAAE;GAClF;GACA,aAAa,KAAA;EACf;EAEC,UAAA,cACC,OACA;GAAE;GAAQ;GAAW;EAAM,GAC3B;GACE;GACA,cAAc;GACd,KAAK,CAAC,cAAc,OAAO;GAC3B,OAAO;IAAC,EAAE,OAAO;KAAE,GAAG;KAAS,GAAG;IAAU,EAAE;IAAG;IAAW;GAAY;EAC1E,CACF;CACc,CAAA;AAEpB,CAAC"}

package/dist/default/ui/slider/slider-thumb.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { renderElement } from "../../utils/use-render.js";
 import { useSliderContext } from "./context.js";
 import { forwardRef } from "react";

package/dist/default/ui/slider/slider-thumb.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider-thumb.js","names":[],"sources":["../../../../src/ui/slider/slider-thumb.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ type { SliderState } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useSliderContext } from './context';\n\nexport interface SliderThumbProps extends UIComponentProps<'div', SliderState> {}\n\n/** Draggable handle for setting the slider value. Receives focus and handles keyboard interaction. */\nexport const SliderThumb = forwardRef(function SliderThumb(\n componentProps: SliderThumbProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const { render, className, style, ...elementProps } = componentProps;\n\n const context = useSliderContext();\n const { state, thumbRef, thumbProps, getAttrs } = context;\n const attrs = getAttrs(state);\n\n return renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: context.stateAttrMap,\n ref: [forwardedRef, thumbRef],\n props: [attrs, thumbProps, elementProps],\n }\n );\n});\n\nexport namespace SliderThumb {\n export type Props = SliderThumbProps;\n}\n"],"mappings":"~~;;;;;;AAaA~~,MAAa,cAAc,WAAW,SAAS,YAC7C,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CAEtD,MAAM,UAAU,iBAAiB;CACjC,MAAM,EAAE,OAAO,UAAU,YAAY,aAAa;CAClD,MAAM,QAAQ,SAAS,KAAK;CAE5B,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,cAAc,QAAQ;EACtB,KAAK,CAAC,cAAc,QAAQ;EAC5B,OAAO;GAAC;GAAO;GAAY;EAAY;CACzC,CACF;AACF,CAAC"}
1	+ {"version":3,"file":"slider-thumb.js","names":[],"sources":["../../../../src/ui/slider/slider-thumb.tsx"],"sourcesContent":["import type { SliderState } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useSliderContext } from './context';\n\nexport interface SliderThumbProps extends UIComponentProps<'div', SliderState> {}\n\n/** Draggable handle for setting the slider value. Receives focus and handles keyboard interaction. */\nexport const SliderThumb = forwardRef(function SliderThumb(\n componentProps: SliderThumbProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const { render, className, style, ...elementProps } = componentProps;\n\n const context = useSliderContext();\n const { state, thumbRef, thumbProps, getAttrs } = context;\n const attrs = getAttrs(state);\n\n return renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: context.stateAttrMap,\n ref: [forwardedRef, thumbRef],\n props: [attrs, thumbProps, elementProps],\n }\n );\n});\n\nexport namespace SliderThumb {\n export type Props = SliderThumbProps;\n}\n"],"mappings":";;;;;AAWA,MAAa,cAAc,WAAW,SAAS,YAC7C,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CAEtD,MAAM,UAAU,iBAAiB;CACjC,MAAM,EAAE,OAAO,UAAU,YAAY,aAAa;CAClD,MAAM,QAAQ,SAAS,KAAK;CAE5B,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,cAAc,QAAQ;EACtB,KAAK,CAAC,cAAc,QAAQ;EAC5B,OAAO;GAAC;GAAO;GAAY;EAAY;CACzC,CACF;AACF,CAAC"}

package/dist/default/ui/slider/slider-thumbnail.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { useSliderPointerValue } from "./context.js";
 import { Thumbnail } from "../thumbnail/thumbnail.js";
 import { forwardRef } from "react";

package/dist/default/ui/slider/slider-thumbnail.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider-thumbnail.js","names":[],"sources":["../../../../src/ui/slider/slider-thumbnail.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ type { ThumbnailCore } from '@videojs/core';\nimport { forwardRef } from 'react';\n\nimport { Thumbnail, type ThumbnailProps } from '../thumbnail/thumbnail';\nimport { useSliderPointerValue } from './context';\n\nexport interface SliderThumbnailProps extends Omit<ThumbnailProps, 'time'> {}\n\nexport const SliderThumbnail = forwardRef<HTMLDivElement, SliderThumbnailProps>(\n function SliderThumbnail(componentProps, forwardedRef) {\n const pointerValue = useSliderPointerValue();\n return <Thumbnail ref={forwardedRef} {...componentProps} time={pointerValue} />;\n }\n);\n\nexport namespace SliderThumbnail {\n export type Props = SliderThumbnailProps;\n export type State = ThumbnailCore.State;\n}\n"],"mappings":"~~;;;;;;AAUA~~,MAAa,kBAAkB,WAC7B,SAAS,gBAAgB,gBAAgB,cAAc;CACrD,MAAM,eAAe,sBAAsB;CAC3C,OAAO,oBAAC,WAAD;EAAW,KAAK;EAAc,GAAI;EAAgB,MAAM;CAAe,CAAA;AAChF,CACF"}
1	+ {"version":3,"file":"slider-thumbnail.js","names":[],"sources":["../../../../src/ui/slider/slider-thumbnail.tsx"],"sourcesContent":["import type { ThumbnailCore } from '@videojs/core';\nimport { forwardRef } from 'react';\n\nimport { Thumbnail, type ThumbnailProps } from '../thumbnail/thumbnail';\nimport { useSliderPointerValue } from './context';\n\nexport interface SliderThumbnailProps extends Omit<ThumbnailProps, 'time'> {}\n\nexport const SliderThumbnail = forwardRef<HTMLDivElement, SliderThumbnailProps>(\n function SliderThumbnail(componentProps, forwardedRef) {\n const pointerValue = useSliderPointerValue();\n return <Thumbnail ref={forwardedRef} {...componentProps} time={pointerValue} />;\n }\n);\n\nexport namespace SliderThumbnail {\n export type Props = SliderThumbnailProps;\n export type State = ThumbnailCore.State;\n}\n"],"mappings":";;;;;AAQA,MAAa,kBAAkB,WAC7B,SAAS,gBAAgB,gBAAgB,cAAc;CACrD,MAAM,eAAe,sBAAsB;CAC3C,OAAO,oBAAC,WAAD;EAAW,KAAK;EAAc,GAAI;EAAgB,MAAM;CAAe,CAAA;AAChF,CACF"}

package/dist/default/ui/slider/slider-track.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { createContextPart } from "../create-context-part.js";
 import { useSliderContext } from "./context.js";
 //#region src/ui/slider/slider-track.tsx

package/dist/default/ui/slider/slider-track.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider-track.js","names":[],"sources":["../../../../src/ui/slider/slider-track.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ type { SliderState } from '@videojs/core';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createContextPart } from '../create-context-part';\nimport { useSliderContext } from './context';\n\nexport interface SliderTrackProps extends UIComponentProps<'div', SliderState> {}\n\n/** Contains the slider's visual track and interactive hit zone. */\nexport const SliderTrack = createContextPart<SliderTrackProps, SliderState>({\n displayName: 'SliderTrack',\n tag: 'div',\n useContext: useSliderContext,\n});\n\nexport namespace SliderTrack {\n export type Props = SliderTrackProps;\n}\n"],"mappings":"~~;;;;;AAWA~~,MAAa,cAAc,kBAAiD;CAC1E,aAAa;CACb,KAAK;CACL,YAAY;AACd,CAAC"}
1	+ {"version":3,"file":"slider-track.js","names":[],"sources":["../../../../src/ui/slider/slider-track.tsx"],"sourcesContent":["import type { SliderState } from '@videojs/core';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createContextPart } from '../create-context-part';\nimport { useSliderContext } from './context';\n\nexport interface SliderTrackProps extends UIComponentProps<'div', SliderState> {}\n\n/** Contains the slider's visual track and interactive hit zone. */\nexport const SliderTrack = createContextPart<SliderTrackProps, SliderState>({\n displayName: 'SliderTrack',\n tag: 'div',\n useContext: useSliderContext,\n});\n\nexport namespace SliderTrack {\n export type Props = SliderTrackProps;\n}\n"],"mappings":";;;;AASA,MAAa,cAAc,kBAAiD;CAC1E,aAAa;CACb,KAAK;CACL,YAAY;AACd,CAAC"}

package/dist/default/ui/slider/slider-value.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { renderElement } from "../../utils/use-render.js";
 import { useSliderContext, useSliderPointerValue } from "./context.js";
 import { forwardRef } from "react";

package/dist/default/ui/slider/slider-value.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider-value.js","names":[],"sources":["../../../../src/ui/slider/slider-value.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ type { SliderState } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useSliderContext, useSliderPointerValue } from './context';\n\nexport interface SliderValueProps extends UIComponentProps<'output', SliderState> {\n /** Which slider value to display: the current position or the pointer position. /\n type?: 'current' \| 'pointer' \| undefined;\n /* Custom formatter for the displayed value. Overrides the root's `formatValue`. /\n format?: ((value: number) => string) \| undefined;\n}\n\n/* Displays a formatted text representation of the slider value. Renders an `<output>` element. */\nexport const SliderValue = forwardRef(function SliderValue(\n componentProps: SliderValueProps,\n forwardedRef: ForwardedRef<HTMLOutputElement>\n) {\n const { render, className, style, type = 'current', format, ...elementProps } = componentProps;\n\n const context = useSliderContext();\n const { state, formatValue } = context;\n const pointerValue = useSliderPointerValue(type === 'pointer');\n\n const rawValue = type === 'pointer' ? pointerValue : state.value;\n\n const text = format ? format(rawValue) : formatValue ? formatValue(rawValue, type) : String(Math.round(rawValue));\n\n return renderElement(\n 'output',\n { render, className, style },\n {\n state,\n stateAttrMap: context.stateAttrMap,\n ref: forwardedRef,\n props: [{ 'aria-live': 'off', children: text }, elementProps],\n }\n );\n});\n\nexport namespace SliderValue {\n export type Props = SliderValueProps;\n}\n"],"mappings":"~~;;;;;;AAkBA~~,MAAa,cAAc,WAAW,SAAS,YAC7C,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,OAAO,WAAW,QAAQ,GAAG,iBAAiB;CAEhF,MAAM,UAAU,iBAAiB;CACjC,MAAM,EAAE,OAAO,gBAAgB;CAC/B,MAAM,eAAe,sBAAsB,SAAS,SAAS;CAE7D,MAAM,WAAW,SAAS,YAAY,eAAe,MAAM;CAE3D,MAAM,OAAO,SAAS,OAAO,QAAQ,IAAI,cAAc,YAAY,UAAU,IAAI,IAAI,OAAO,KAAK,MAAM,QAAQ,CAAC;CAEhH,OAAO,cACL,UACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,cAAc,QAAQ;EACtB,KAAK;EACL,OAAO,CAAC;GAAE,aAAa;GAAO,UAAU;EAAK,GAAG,YAAY;CAC9D,CACF;AACF,CAAC"}
1	+ {"version":3,"file":"slider-value.js","names":[],"sources":["../../../../src/ui/slider/slider-value.tsx"],"sourcesContent":["import type { SliderState } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useSliderContext, useSliderPointerValue } from './context';\n\nexport interface SliderValueProps extends UIComponentProps<'output', SliderState> {\n /** Which slider value to display: the current position or the pointer position. /\n type?: 'current' \| 'pointer' \| undefined;\n /* Custom formatter for the displayed value. Overrides the root's `formatValue`. /\n format?: ((value: number) => string) \| undefined;\n}\n\n/* Displays a formatted text representation of the slider value. Renders an `<output>` element. */\nexport const SliderValue = forwardRef(function SliderValue(\n componentProps: SliderValueProps,\n forwardedRef: ForwardedRef<HTMLOutputElement>\n) {\n const { render, className, style, type = 'current', format, ...elementProps } = componentProps;\n\n const context = useSliderContext();\n const { state, formatValue } = context;\n const pointerValue = useSliderPointerValue(type === 'pointer');\n\n const rawValue = type === 'pointer' ? pointerValue : state.value;\n\n const text = format ? format(rawValue) : formatValue ? formatValue(rawValue, type) : String(Math.round(rawValue));\n\n return renderElement(\n 'output',\n { render, className, style },\n {\n state,\n stateAttrMap: context.stateAttrMap,\n ref: forwardedRef,\n props: [{ 'aria-live': 'off', children: text }, elementProps],\n }\n );\n});\n\nexport namespace SliderValue {\n export type Props = SliderValueProps;\n}\n"],"mappings":";;;;;AAgBA,MAAa,cAAc,WAAW,SAAS,YAC7C,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,OAAO,WAAW,QAAQ,GAAG,iBAAiB;CAEhF,MAAM,UAAU,iBAAiB;CACjC,MAAM,EAAE,OAAO,gBAAgB;CAC/B,MAAM,eAAe,sBAAsB,SAAS,SAAS;CAE7D,MAAM,WAAW,SAAS,YAAY,eAAe,MAAM;CAE3D,MAAM,OAAO,SAAS,OAAO,QAAQ,IAAI,cAAc,YAAY,UAAU,IAAI,IAAI,OAAO,KAAK,MAAM,QAAQ,CAAC;CAEhH,OAAO,cACL,UACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,cAAc,QAAQ;EACtB,KAAK;EACL,OAAO,CAAC;GAAE,aAAa;GAAO,UAAU;EAAK,GAAG,YAAY;CAC9D,CACF;AACF,CAAC"}

package/dist/default/ui/status-announcer/status-announcer.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { useLocale, useTranslator } from "../../i18n/context.js";
 import { useContainer, usePlayer } from "../../player/context.js";
 import { useDestroy } from "../../utils/use-destroy.js";

package/dist/default/ui/status-announcer/status-announcer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"status-announcer.js","names":[],"sources":["../../../../src/ui/status-announcer/status-announcer.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ { createStatusAnnouncerLabels, StatusAnnouncerCore } from '@videojs/core';\nimport { shouldAnnounceStatusChange, subscribeToStatusAnnouncer } from '@videojs/core/dom';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef, useEffect, useState, useSyncExternalStore } from 'react';\nimport { useLocale, useTranslator } from '../../i18n/context';\nimport { useContainer, usePlayer } from '../../player/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { useDestroy } from '../../utils/use-destroy';\nimport { renderElement } from '../../utils/use-render';\n\nexport interface StatusAnnouncerProps\n extends UIComponentProps<'div', StatusAnnouncerCore.State>,\n Pick<StatusAnnouncerCore.Props, 'closeDelay' \| 'labels'> {}\n\nexport const StatusAnnouncer = forwardRef(function StatusAnnouncer(\n componentProps: StatusAnnouncerProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const { render, className, style, closeDelay, labels, ...elementProps } = componentProps;\n const translator = useTranslator();\n const locale = useLocale();\n const [core] = useState(() => new StatusAnnouncerCore());\n const store = usePlayer();\n const container = useContainer();\n useDestroy(core);\n core.setProps({\n closeDelay,\n labels: {\n ...createStatusAnnouncerLabels(translator, locale),\n ...labels,\n },\n shouldAnnounce: () => shouldAnnounceStatusChange(container),\n });\n\n useEffect(() => subscribeToStatusAnnouncer(store, core), [core, store]);\n\n const state = useSyncExternalStore(\n (callback) => core.state.subscribe(callback),\n () => core.state.current,\n () => core.state.current\n );\n\n return renderElement(\n 'div',\n { render, className, style },\n {\n state,\n ref: forwardedRef,\n props: [\n elementProps,\n {\n role: 'status',\n children: (\n <span key={state.generation} data-status-announcer-content=\"\">\n {state.label ?? ''}\n </span>\n ),\n },\n ],\n }\n );\n});\n\nexport namespace StatusAnnouncer {\n export type Props = StatusAnnouncerProps;\n export type State = StatusAnnouncerCore.State;\n}\n"],"mappings":"~~;;;;;;;;;;AAgBA~~,MAAa,kBAAkB,WAAW,SAAS,gBACjD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,YAAY,QAAQ,GAAG,iBAAiB;CAC1E,MAAM,aAAa,cAAc;CACjC,MAAM,SAAS,UAAU;CACzB,MAAM,CAAC,QAAQ,eAAe,IAAI,oBAAoB,CAAC;CACvD,MAAM,QAAQ,UAAU;CACxB,MAAM,YAAY,aAAa;CAC/B,WAAW,IAAI;CACf,KAAK,SAAS;EACZ;EACA,QAAQ;GACN,GAAG,4BAA4B,YAAY,MAAM;GACjD,GAAG;EACL;EACA,sBAAsB,2BAA2B,SAAS;CAC5D,CAAC;CAED,gBAAgB,2BAA2B,OAAO,IAAI,GAAG,CAAC,MAAM,KAAK,CAAC;CAEtE,MAAM,QAAQ,sBACX,aAAa,KAAK,MAAM,UAAU,QAAQ,SACrC,KAAK,MAAM,eACX,KAAK,MAAM,OACnB;CAEA,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,KAAK;EACL,OAAO,CACL,cACA;GACE,MAAM;GACN,UACE,oBAAC,QAAD;IAA6B,iCAA8B;IACxD,UAAA,MAAM,SAAS;GACZ,GAFK,MAAM,UAEX;EAEV,CACF;CACF,CACF;AACF,CAAC"}
1	+ {"version":3,"file":"status-announcer.js","names":[],"sources":["../../../../src/ui/status-announcer/status-announcer.tsx"],"sourcesContent":["import { createStatusAnnouncerLabels, StatusAnnouncerCore } from '@videojs/core';\nimport { shouldAnnounceStatusChange, subscribeToStatusAnnouncer } from '@videojs/core/dom';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef, useEffect, useState, useSyncExternalStore } from 'react';\nimport { useLocale, useTranslator } from '../../i18n/context';\nimport { useContainer, usePlayer } from '../../player/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { useDestroy } from '../../utils/use-destroy';\nimport { renderElement } from '../../utils/use-render';\n\nexport interface StatusAnnouncerProps\n extends UIComponentProps<'div', StatusAnnouncerCore.State>,\n Pick<StatusAnnouncerCore.Props, 'closeDelay' \| 'labels'> {}\n\nexport const StatusAnnouncer = forwardRef(function StatusAnnouncer(\n componentProps: StatusAnnouncerProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const { render, className, style, closeDelay, labels, ...elementProps } = componentProps;\n const translator = useTranslator();\n const locale = useLocale();\n const [core] = useState(() => new StatusAnnouncerCore());\n const store = usePlayer();\n const container = useContainer();\n useDestroy(core);\n core.setProps({\n closeDelay,\n labels: {\n ...createStatusAnnouncerLabels(translator, locale),\n ...labels,\n },\n shouldAnnounce: () => shouldAnnounceStatusChange(container),\n });\n\n useEffect(() => subscribeToStatusAnnouncer(store, core), [core, store]);\n\n const state = useSyncExternalStore(\n (callback) => core.state.subscribe(callback),\n () => core.state.current,\n () => core.state.current\n );\n\n return renderElement(\n 'div',\n { render, className, style },\n {\n state,\n ref: forwardedRef,\n props: [\n elementProps,\n {\n role: 'status',\n children: (\n <span key={state.generation} data-status-announcer-content=\"\">\n {state.label ?? ''}\n </span>\n ),\n },\n ],\n }\n );\n});\n\nexport namespace StatusAnnouncer {\n export type Props = StatusAnnouncerProps;\n export type State = StatusAnnouncerCore.State;\n}\n"],"mappings":";;;;;;;;;AAcA,MAAa,kBAAkB,WAAW,SAAS,gBACjD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,YAAY,QAAQ,GAAG,iBAAiB;CAC1E,MAAM,aAAa,cAAc;CACjC,MAAM,SAAS,UAAU;CACzB,MAAM,CAAC,QAAQ,eAAe,IAAI,oBAAoB,CAAC;CACvD,MAAM,QAAQ,UAAU;CACxB,MAAM,YAAY,aAAa;CAC/B,WAAW,IAAI;CACf,KAAK,SAAS;EACZ;EACA,QAAQ;GACN,GAAG,4BAA4B,YAAY,MAAM;GACjD,GAAG;EACL;EACA,sBAAsB,2BAA2B,SAAS;CAC5D,CAAC;CAED,gBAAgB,2BAA2B,OAAO,IAAI,GAAG,CAAC,MAAM,KAAK,CAAC;CAEtE,MAAM,QAAQ,sBACX,aAAa,KAAK,MAAM,UAAU,QAAQ,SACrC,KAAK,MAAM,eACX,KAAK,MAAM,OACnB;CAEA,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,KAAK;EACL,OAAO,CACL,cACA;GACE,MAAM;GACN,UACE,oBAAC,QAAD;IAA6B,iCAA8B;IACxD,UAAA,MAAM,SAAS;GACZ,GAFK,MAAM,UAEX;EAEV,CACF;CACF,CACF;AACF,CAAC"}

package/dist/default/ui/status-indicator/context.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { createContext, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/ui/status-indicator/context.tsx

package/dist/default/ui/status-indicator/context.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/status-indicator/context.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ type { StatusIndicatorCore } from '@videojs/core';\nimport { createContext, type ProviderProps, useContext } from 'react';\n\nexport interface StatusIndicatorContextValue {\n state: StatusIndicatorCore.State;\n}\n\nconst StatusIndicatorContext = createContext<StatusIndicatorContextValue \| null>(null);\n\nexport function StatusIndicatorProvider({ value, children }: ProviderProps<StatusIndicatorContextValue>) {\n return <StatusIndicatorContext.Provider value={value}>{children}</StatusIndicatorContext.Provider>;\n}\n\nexport function useStatusIndicatorContext(): StatusIndicatorContextValue {\n const ctx = useContext(StatusIndicatorContext);\n if (!ctx) throw new Error('StatusIndicator child compounds must be used within a StatusIndicator.Root');\n return ctx;\n}\n"],"mappings":"~~;;;;AASA~~,MAAM,yBAAyB,cAAkD,IAAI;AAErF,SAAgB,wBAAwB,EAAE,OAAO,YAAwD;CACvG,OAAO,oBAAC,uBAAuB,UAAxB;EAAwC;EAAQ;CAA0C,CAAA;AACnG;AAEA,SAAgB,4BAAyD;CACvE,MAAM,MAAM,WAAW,sBAAsB;CAC7C,IAAI,CAAC,KAAK,MAAM,IAAI,MAAM,4EAA4E;CACtG,OAAO;AACT"}
1	+ {"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/status-indicator/context.tsx"],"sourcesContent":["import type { StatusIndicatorCore } from '@videojs/core';\nimport { createContext, type ProviderProps, useContext } from 'react';\n\nexport interface StatusIndicatorContextValue {\n state: StatusIndicatorCore.State;\n}\n\nconst StatusIndicatorContext = createContext<StatusIndicatorContextValue \| null>(null);\n\nexport function StatusIndicatorProvider({ value, children }: ProviderProps<StatusIndicatorContextValue>) {\n return <StatusIndicatorContext.Provider value={value}>{children}</StatusIndicatorContext.Provider>;\n}\n\nexport function useStatusIndicatorContext(): StatusIndicatorContextValue {\n const ctx = useContext(StatusIndicatorContext);\n if (!ctx) throw new Error('StatusIndicator child compounds must be used within a StatusIndicator.Root');\n return ctx;\n}\n"],"mappings":";;;AAOA,MAAM,yBAAyB,cAAkD,IAAI;AAErF,SAAgB,wBAAwB,EAAE,OAAO,YAAwD;CACvG,OAAO,oBAAC,uBAAuB,UAAxB;EAAwC;EAAQ;CAA0C,CAAA;AACnG;AAEA,SAAgB,4BAAyD;CACvE,MAAM,MAAM,WAAW,sBAAsB;CAC7C,IAAI,CAAC,KAAK,MAAM,IAAI,MAAM,4EAA4E;CACtG,OAAO;AACT"}

package/dist/default/ui/status-indicator/status-indicator-root.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { useTranslator } from "../../i18n/context.js";
 import { renderElement } from "../../utils/use-render.js";
 import { useInputIndicatorRoot } from "../input-indicator/use-input-indicator-root.js";

package/dist/default/ui/status-indicator/status-indicator-root.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"status-indicator-root.js","names":[],"sources":["../../../../src/ui/status-indicator/status-indicator-root.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ { createInputIndicatorLabels, StatusIndicatorCore, StatusIndicatorDataAttrs } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport { useTranslator } from '../../i18n/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useInputIndicatorRoot } from '../input-indicator/use-input-indicator-root';\nimport { StatusIndicatorProvider } from './context';\n\nexport interface StatusIndicatorRootProps\n extends UIComponentProps<'div', StatusIndicatorCore.State>,\n Omit<StatusIndicatorCore.Props, 'labels'> {}\n\nexport const StatusIndicatorRoot = forwardRef(function StatusIndicatorRoot(\n componentProps: StatusIndicatorRootProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const { render, className, style, actions, closeDelay, ...elementProps } = componentProps;\n const translator = useTranslator();\n const { elementRef, present, state } = useInputIndicatorRoot(\n () => new StatusIndicatorCore(),\n {\n actions,\n closeDelay,\n labels: createInputIndicatorLabels(translator),\n },\n { replayOnUpdate: false }\n );\n\n if (!present) return null;\n\n return (\n <StatusIndicatorProvider value={{ state }}>\n {renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: StatusIndicatorDataAttrs,\n ref: [forwardedRef, elementRef],\n props: [elementProps],\n }\n )}\n </StatusIndicatorProvider>\n );\n});\n\nexport namespace StatusIndicatorRoot {\n export type Props = StatusIndicatorRootProps;\n export type State = StatusIndicatorCore.State;\n}\n"],"mappings":"~~;;;;;;;;;AAgBA~~,MAAa,sBAAsB,WAAW,SAAS,oBACrD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,SAAS,YAAY,GAAG,iBAAiB;CAE3E,MAAM,EAAE,YAAY,SAAS,UAAU,4BAC/B,IAAI,oBAAoB,GAC9B;EACE;EACA;EACA,QAAQ,2BANO,cAM6B,CAAC;CAC/C,GACA,EAAE,gBAAgB,MAAM,CAC1B;CAEA,IAAI,CAAC,SAAS,OAAO;CAErB,OACE,oBAAC,yBAAD;EAAyB,OAAO,EAAE,MAAM;EACrC,UAAA,cACC,OACA;GAAE;GAAQ;GAAW;EAAM,GAC3B;GACE;GACA,cAAc;GACd,KAAK,CAAC,cAAc,UAAU;GAC9B,OAAO,CAAC,YAAY;EACtB,CACF;CACuB,CAAA;AAE7B,CAAC"}
1	+ {"version":3,"file":"status-indicator-root.js","names":[],"sources":["../../../../src/ui/status-indicator/status-indicator-root.tsx"],"sourcesContent":["import { createInputIndicatorLabels, StatusIndicatorCore, StatusIndicatorDataAttrs } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport { useTranslator } from '../../i18n/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useInputIndicatorRoot } from '../input-indicator/use-input-indicator-root';\nimport { StatusIndicatorProvider } from './context';\n\nexport interface StatusIndicatorRootProps\n extends UIComponentProps<'div', StatusIndicatorCore.State>,\n Omit<StatusIndicatorCore.Props, 'labels'> {}\n\nexport const StatusIndicatorRoot = forwardRef(function StatusIndicatorRoot(\n componentProps: StatusIndicatorRootProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const { render, className, style, actions, closeDelay, ...elementProps } = componentProps;\n const translator = useTranslator();\n const { elementRef, present, state } = useInputIndicatorRoot(\n () => new StatusIndicatorCore(),\n {\n actions,\n closeDelay,\n labels: createInputIndicatorLabels(translator),\n },\n { replayOnUpdate: false }\n );\n\n if (!present) return null;\n\n return (\n <StatusIndicatorProvider value={{ state }}>\n {renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: StatusIndicatorDataAttrs,\n ref: [forwardedRef, elementRef],\n props: [elementProps],\n }\n )}\n </StatusIndicatorProvider>\n );\n});\n\nexport namespace StatusIndicatorRoot {\n export type Props = StatusIndicatorRootProps;\n export type State = StatusIndicatorCore.State;\n}\n"],"mappings":";;;;;;;;AAcA,MAAa,sBAAsB,WAAW,SAAS,oBACrD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,SAAS,YAAY,GAAG,iBAAiB;CAE3E,MAAM,EAAE,YAAY,SAAS,UAAU,4BAC/B,IAAI,oBAAoB,GAC9B;EACE;EACA;EACA,QAAQ,2BANO,cAM6B,CAAC;CAC/C,GACA,EAAE,gBAAgB,MAAM,CAC1B;CAEA,IAAI,CAAC,SAAS,OAAO;CAErB,OACE,oBAAC,yBAAD;EAAyB,OAAO,EAAE,MAAM;EACrC,UAAA,cACC,OACA;GAAE;GAAQ;GAAW;EAAM,GAC3B;GACE;GACA,cAAc;GACd,KAAK,CAAC,cAAc,UAAU;GAC9B,OAAO,CAAC,YAAY;EACtB,CACF;CACuB,CAAA;AAE7B,CAAC"}

package/dist/default/ui/status-indicator/status-indicator-value.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { renderElement } from "../../utils/use-render.js";
 import { useStatusIndicatorContext } from "./context.js";
 import { forwardRef } from "react";

package/dist/default/ui/status-indicator/status-indicator-value.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"status-indicator-value.js","names":[],"sources":["../../../../src/ui/status-indicator/status-indicator-value.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ { getStatusIndicatorDisplayValue, type StatusIndicatorCore } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useStatusIndicatorContext } from './context';\n\nexport interface StatusIndicatorValueProps extends UIComponentProps<'span', StatusIndicatorCore.State> {}\n\nexport const StatusIndicatorValue = forwardRef(function StatusIndicatorValue(\n componentProps: StatusIndicatorValueProps,\n forwardedRef: ForwardedRef<HTMLSpanElement>\n) {\n const { render, className, style, ...elementProps } = componentProps;\n const { state } = useStatusIndicatorContext();\n\n return renderElement(\n 'span',\n { render, className, style },\n {\n state,\n ref: forwardedRef,\n props: [{ children: getStatusIndicatorDisplayValue(state) }, elementProps],\n }\n );\n});\n\nexport namespace StatusIndicatorValue {\n export type Props = StatusIndicatorValueProps;\n}\n"],"mappings":"~~;;;;;;AAYA~~,MAAa,uBAAuB,WAAW,SAAS,qBACtD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CACtD,MAAM,EAAE,UAAU,0BAA0B;CAE5C,OAAO,cACL,QACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,KAAK;EACL,OAAO,CAAC,EAAE,UAAU,+BAA+B,KAAK,EAAE,GAAG,YAAY;CAC3E,CACF;AACF,CAAC"}
1	+ {"version":3,"file":"status-indicator-value.js","names":[],"sources":["../../../../src/ui/status-indicator/status-indicator-value.tsx"],"sourcesContent":["import { getStatusIndicatorDisplayValue, type StatusIndicatorCore } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useStatusIndicatorContext } from './context';\n\nexport interface StatusIndicatorValueProps extends UIComponentProps<'span', StatusIndicatorCore.State> {}\n\nexport const StatusIndicatorValue = forwardRef(function StatusIndicatorValue(\n componentProps: StatusIndicatorValueProps,\n forwardedRef: ForwardedRef<HTMLSpanElement>\n) {\n const { render, className, style, ...elementProps } = componentProps;\n const { state } = useStatusIndicatorContext();\n\n return renderElement(\n 'span',\n { render, className, style },\n {\n state,\n ref: forwardedRef,\n props: [{ children: getStatusIndicatorDisplayValue(state) }, elementProps],\n }\n );\n});\n\nexport namespace StatusIndicatorValue {\n export type Props = StatusIndicatorValueProps;\n}\n"],"mappings":";;;;;AAUA,MAAa,uBAAuB,WAAW,SAAS,qBACtD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CACtD,MAAM,EAAE,UAAU,0BAA0B;CAE5C,OAAO,cACL,QACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,KAAK;EACL,OAAO,CAAC,EAAE,UAAU,+BAA+B,KAAK,EAAE,GAAG,YAAY;CAC3E,CACF;AACF,CAAC"}

package/dist/default/ui/thumbnail/thumbnail.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { useOptionalPlayer } from "../../player/context.js";
 import { useDestroy } from "../../utils/use-destroy.js";
 import { renderElement } from "../../utils/use-render.js";

package/dist/default/ui/thumbnail/thumbnail.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"thumbnail.js","names":[],"sources":["../../../../src/ui/thumbnail/thumbnail.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ {\n mapCuesToThumbnails,\n ThumbnailCore,\n ThumbnailDataAttrs,\n type ThumbnailFetchPriority,\n type ThumbnailImage,\n} from '@videojs/core';\nimport { createThumbnail, selectTextTrack } from '@videojs/core/dom';\nimport type { CSSProperties } from 'react';\nimport { forwardRef, useMemo, useRef, useState } from 'react';\n\nimport { useOptionalPlayer } from '../../player/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { useDestroy } from '../../utils/use-destroy';\nimport { renderElement } from '../../utils/use-render';\n\nexport interface ThumbnailProps extends UIComponentProps<'div', ThumbnailCore.State>, ThumbnailCore.Props {\n /** Pre-parsed thumbnail images — bypasses the automatic `<track>` detection. */\n thumbnails?: ThumbnailImage[] \| undefined;\n}\n\nexport const Thumbnail = forwardRef<HTMLDivElement, ThumbnailProps>(function Thumbnail(componentProps, forwardedRef) {\n const {\n render,\n className,\n style,\n time = 0,\n thumbnails: externalThumbnails,\n crossOrigin,\n loading,\n fetchPriority,\n ...elementProps\n } = componentProps;\n\n const [core] = useState(() => new ThumbnailCore());\n const divRef = useRef<HTMLDivElement>(null);\n const imgRef = useRef<HTMLImageElement>(null);\n const textTrack = useOptionalPlayer(selectTextTrack);\n\n // Force re-render when the handle's state changes (img load/error, resize).\n const [, setRenderToken] = useState(0);\n\n const [handle] = useState(() =>\n createThumbnail({\n getContainer: () => divRef.current,\n getImg: () => imgRef.current,\n onStateChange: () => setRenderToken((n) => n + 1),\n })\n );\n\n useDestroy(handle, () => handle.connect());\n\n // Resolve thumbnails: external prop takes priority over auto <track> path.\n const thumbnails = useMemo(() => {\n if (externalThumbnails && externalThumbnails.length > 0) return externalThumbnails;\n return textTrack && textTrack.thumbnailCues.length > 0\n ? mapCuesToThumbnails(textTrack.thumbnailCues, textTrack.thumbnailTrackSrc ?? undefined)\n : [];\n }, [externalThumbnails, textTrack]);\n\n const thumbnail = useMemo(() => core.findActiveThumbnail(thumbnails, time), [core, thumbnails, time]);\n\n // Track src changes via the handle.\n handle.updateSrc(thumbnail?.url);\n\n const state = core.getState(handle.loading, handle.error, thumbnail);\n\n // Compute styles declaratively from resize result.\n let containerStyle: CSSProperties = { overflow: 'hidden' };\n let imgStyle: CSSProperties \| undefined;\n\n if (thumbnail && handle.naturalWidth && handle.naturalHeight) {\n const constraints = handle.readConstraints();\n const result = core.resize(thumbnail, handle.naturalWidth, handle.naturalHeight, constraints);\n\n if (result) {\n containerStyle = {\n overflow: 'hidden',\n width: result.containerWidth,\n height: result.containerHeight,\n };\n imgStyle = {\n width: result.imageWidth,\n height: result.imageHeight,\n maxWidth: 'none',\n transform:\n result.offsetX \|\| result.offsetY ? `translate(-${result.offsetX}px, -${result.offsetY}px)` : undefined,\n };\n }\n }\n\n return renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: ThumbnailDataAttrs,\n ref: [forwardedRef, divRef],\n props: [\n core.getAttrs(state),\n { style: containerStyle },\n elementProps,\n {\n children: (\n <img\n ref={imgRef}\n alt=\"\"\n aria-hidden=\"true\"\n decoding=\"async\"\n src={thumbnail?.url}\n crossOrigin={crossOrigin === '' \|\| crossOrigin === null ? undefined : crossOrigin}\n loading={loading}\n style={imgStyle}\n // React's types omit `\| undefined` from fetchPriority — cast to satisfy exactOptionalPropertyTypes.\n fetchPriority={fetchPriority as ThumbnailFetchPriority}\n />\n ),\n },\n ],\n }\n );\n});\n\nexport namespace Thumbnail {\n export type Props = ThumbnailProps;\n export type State = ThumbnailCore.State;\n}\n"],"mappings":"~~;;;;;;;;;AAuBA~~,MAAa,YAAY,WAA2C,SAAS,UAAU,gBAAgB,cAAc;CACnH,MAAM,EACJ,QACA,WACA,OACA,OAAO,GACP,YAAY,oBACZ,aACA,SACA,eACA,GAAG,iBACD;CAEJ,MAAM,CAAC,QAAQ,eAAe,IAAI,cAAc,CAAC;CACjD,MAAM,SAAS,OAAuB,IAAI;CAC1C,MAAM,SAAS,OAAyB,IAAI;CAC5C,MAAM,YAAY,kBAAkB,eAAe;CAGnD,MAAM,GAAG,kBAAkB,SAAS,CAAC;CAErC,MAAM,CAAC,UAAU,eACf,gBAAgB;EACd,oBAAoB,OAAO;EAC3B,cAAc,OAAO;EACrB,qBAAqB,gBAAgB,MAAM,IAAI,CAAC;CAClD,CAAC,CACH;CAEA,WAAW,cAAc,OAAO,QAAQ,CAAC;CAGzC,MAAM,aAAa,cAAc;EAC/B,IAAI,sBAAsB,mBAAmB,SAAS,GAAG,OAAO;EAChE,OAAO,aAAa,UAAU,cAAc,SAAS,IACjD,oBAAoB,UAAU,eAAe,UAAU,qBAAqB,KAAA,CAAS,IACrF,CAAC;CACP,GAAG,CAAC,oBAAoB,SAAS,CAAC;CAElC,MAAM,YAAY,cAAc,KAAK,oBAAoB,YAAY,IAAI,GAAG;EAAC;EAAM;EAAY;CAAI,CAAC;CAGpG,OAAO,UAAU,WAAW,GAAG;CAE/B,MAAM,QAAQ,KAAK,SAAS,OAAO,SAAS,OAAO,OAAO,SAAS;CAGnE,IAAI,iBAAgC,EAAE,UAAU,SAAS;CACzD,IAAI;CAEJ,IAAI,aAAa,OAAO,gBAAgB,OAAO,eAAe;EAC5D,MAAM,cAAc,OAAO,gBAAgB;EAC3C,MAAM,SAAS,KAAK,OAAO,WAAW,OAAO,cAAc,OAAO,eAAe,WAAW;EAE5F,IAAI,QAAQ;GACV,iBAAiB;IACf,UAAU;IACV,OAAO,OAAO;IACd,QAAQ,OAAO;GACjB;GACA,WAAW;IACT,OAAO,OAAO;IACd,QAAQ,OAAO;IACf,UAAU;IACV,WACE,OAAO,WAAW,OAAO,UAAU,cAAc,OAAO,QAAQ,OAAO,OAAO,QAAQ,OAAO,KAAA;GACjG;EACF;CACF;CAEA,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,cAAc;EACd,KAAK,CAAC,cAAc,MAAM;EAC1B,OAAO;GACL,KAAK,SAAS,KAAK;GACnB,EAAE,OAAO,eAAe;GACxB;GACA,EACE,UACE,oBAAC,OAAD;IACE,KAAK;IACL,KAAI;IACJ,eAAY;IACZ,UAAS;IACT,KAAK,WAAW;IAChB,aAAa,gBAAgB,MAAM,gBAAgB,OAAO,KAAA,IAAY;IAC7D;IACT,OAAO;IAEQ;GAChB,CAAA,EAEL;EACF;CACF,CACF;AACF,CAAC"}
1	+ {"version":3,"file":"thumbnail.js","names":[],"sources":["../../../../src/ui/thumbnail/thumbnail.tsx"],"sourcesContent":["import {\n mapCuesToThumbnails,\n ThumbnailCore,\n ThumbnailDataAttrs,\n type ThumbnailFetchPriority,\n type ThumbnailImage,\n} from '@videojs/core';\nimport { createThumbnail, selectTextTrack } from '@videojs/core/dom';\nimport type { CSSProperties } from 'react';\nimport { forwardRef, useMemo, useRef, useState } from 'react';\n\nimport { useOptionalPlayer } from '../../player/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { useDestroy } from '../../utils/use-destroy';\nimport { renderElement } from '../../utils/use-render';\n\nexport interface ThumbnailProps extends UIComponentProps<'div', ThumbnailCore.State>, ThumbnailCore.Props {\n /** Pre-parsed thumbnail images — bypasses the automatic `<track>` detection. */\n thumbnails?: ThumbnailImage[] \| undefined;\n}\n\nexport const Thumbnail = forwardRef<HTMLDivElement, ThumbnailProps>(function Thumbnail(componentProps, forwardedRef) {\n const {\n render,\n className,\n style,\n time = 0,\n thumbnails: externalThumbnails,\n crossOrigin,\n loading,\n fetchPriority,\n ...elementProps\n } = componentProps;\n\n const [core] = useState(() => new ThumbnailCore());\n const divRef = useRef<HTMLDivElement>(null);\n const imgRef = useRef<HTMLImageElement>(null);\n const textTrack = useOptionalPlayer(selectTextTrack);\n\n // Force re-render when the handle's state changes (img load/error, resize).\n const [, setRenderToken] = useState(0);\n\n const [handle] = useState(() =>\n createThumbnail({\n getContainer: () => divRef.current,\n getImg: () => imgRef.current,\n onStateChange: () => setRenderToken((n) => n + 1),\n })\n );\n\n useDestroy(handle, () => handle.connect());\n\n // Resolve thumbnails: external prop takes priority over auto <track> path.\n const thumbnails = useMemo(() => {\n if (externalThumbnails && externalThumbnails.length > 0) return externalThumbnails;\n return textTrack && textTrack.thumbnailCues.length > 0\n ? mapCuesToThumbnails(textTrack.thumbnailCues, textTrack.thumbnailTrackSrc ?? undefined)\n : [];\n }, [externalThumbnails, textTrack]);\n\n const thumbnail = useMemo(() => core.findActiveThumbnail(thumbnails, time), [core, thumbnails, time]);\n\n // Track src changes via the handle.\n handle.updateSrc(thumbnail?.url);\n\n const state = core.getState(handle.loading, handle.error, thumbnail);\n\n // Compute styles declaratively from resize result.\n let containerStyle: CSSProperties = { overflow: 'hidden' };\n let imgStyle: CSSProperties \| undefined;\n\n if (thumbnail && handle.naturalWidth && handle.naturalHeight) {\n const constraints = handle.readConstraints();\n const result = core.resize(thumbnail, handle.naturalWidth, handle.naturalHeight, constraints);\n\n if (result) {\n containerStyle = {\n overflow: 'hidden',\n width: result.containerWidth,\n height: result.containerHeight,\n };\n imgStyle = {\n width: result.imageWidth,\n height: result.imageHeight,\n maxWidth: 'none',\n transform:\n result.offsetX \|\| result.offsetY ? `translate(-${result.offsetX}px, -${result.offsetY}px)` : undefined,\n };\n }\n }\n\n return renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: ThumbnailDataAttrs,\n ref: [forwardedRef, divRef],\n props: [\n core.getAttrs(state),\n { style: containerStyle },\n elementProps,\n {\n children: (\n <img\n ref={imgRef}\n alt=\"\"\n aria-hidden=\"true\"\n decoding=\"async\"\n src={thumbnail?.url}\n crossOrigin={crossOrigin === '' \|\| crossOrigin === null ? undefined : crossOrigin}\n loading={loading}\n style={imgStyle}\n // React's types omit `\| undefined` from fetchPriority — cast to satisfy exactOptionalPropertyTypes.\n fetchPriority={fetchPriority as ThumbnailFetchPriority}\n />\n ),\n },\n ],\n }\n );\n});\n\nexport namespace Thumbnail {\n export type Props = ThumbnailProps;\n export type State = ThumbnailCore.State;\n}\n"],"mappings":";;;;;;;;AAqBA,MAAa,YAAY,WAA2C,SAAS,UAAU,gBAAgB,cAAc;CACnH,MAAM,EACJ,QACA,WACA,OACA,OAAO,GACP,YAAY,oBACZ,aACA,SACA,eACA,GAAG,iBACD;CAEJ,MAAM,CAAC,QAAQ,eAAe,IAAI,cAAc,CAAC;CACjD,MAAM,SAAS,OAAuB,IAAI;CAC1C,MAAM,SAAS,OAAyB,IAAI;CAC5C,MAAM,YAAY,kBAAkB,eAAe;CAGnD,MAAM,GAAG,kBAAkB,SAAS,CAAC;CAErC,MAAM,CAAC,UAAU,eACf,gBAAgB;EACd,oBAAoB,OAAO;EAC3B,cAAc,OAAO;EACrB,qBAAqB,gBAAgB,MAAM,IAAI,CAAC;CAClD,CAAC,CACH;CAEA,WAAW,cAAc,OAAO,QAAQ,CAAC;CAGzC,MAAM,aAAa,cAAc;EAC/B,IAAI,sBAAsB,mBAAmB,SAAS,GAAG,OAAO;EAChE,OAAO,aAAa,UAAU,cAAc,SAAS,IACjD,oBAAoB,UAAU,eAAe,UAAU,qBAAqB,KAAA,CAAS,IACrF,CAAC;CACP,GAAG,CAAC,oBAAoB,SAAS,CAAC;CAElC,MAAM,YAAY,cAAc,KAAK,oBAAoB,YAAY,IAAI,GAAG;EAAC;EAAM;EAAY;CAAI,CAAC;CAGpG,OAAO,UAAU,WAAW,GAAG;CAE/B,MAAM,QAAQ,KAAK,SAAS,OAAO,SAAS,OAAO,OAAO,SAAS;CAGnE,IAAI,iBAAgC,EAAE,UAAU,SAAS;CACzD,IAAI;CAEJ,IAAI,aAAa,OAAO,gBAAgB,OAAO,eAAe;EAC5D,MAAM,cAAc,OAAO,gBAAgB;EAC3C,MAAM,SAAS,KAAK,OAAO,WAAW,OAAO,cAAc,OAAO,eAAe,WAAW;EAE5F,IAAI,QAAQ;GACV,iBAAiB;IACf,UAAU;IACV,OAAO,OAAO;IACd,QAAQ,OAAO;GACjB;GACA,WAAW;IACT,OAAO,OAAO;IACd,QAAQ,OAAO;IACf,UAAU;IACV,WACE,OAAO,WAAW,OAAO,UAAU,cAAc,OAAO,QAAQ,OAAO,OAAO,QAAQ,OAAO,KAAA;GACjG;EACF;CACF;CAEA,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,cAAc;EACd,KAAK,CAAC,cAAc,MAAM;EAC1B,OAAO;GACL,KAAK,SAAS,KAAK;GACnB,EAAE,OAAO,eAAe;GACxB;GACA,EACE,UACE,oBAAC,OAAD;IACE,KAAK;IACL,KAAI;IACJ,eAAY;IACZ,UAAS;IACT,KAAK,WAAW;IAChB,aAAa,gBAAgB,MAAM,gBAAgB,OAAO,KAAA,IAAY;IAC7D;IACT,OAAO;IAEQ;GAChB,CAAA,EAEL;EACF;CACF,CACF;AACF,CAAC"}

package/dist/default/ui/time/time-group.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { renderElement } from "../../utils/use-render.js";
 import { forwardRef } from "react";
 //#region src/ui/time/time-group.tsx

package/dist/default/ui/time/time-group.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"time-group.js","names":[],"sources":["../../../../src/ui/time/time-group.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ type { ForwardedRef, ReactNode } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\n\n// Empty state for Group (no dynamic state)\ntype GroupState = Record<string, never>;\n\nexport interface GroupProps extends UIComponentProps<'span', GroupState> {\n /** Time value components to render inside the group. /\n children?: ReactNode \| undefined;\n}\n\n/\n Container for composed time displays. Renders a `<span>` element.\n \n @example\n * ```tsx\n * <Time.Group>\n * <Time.Value type=\"current\" />\n * <Time.Separator />\n * <Time.Value type=\"duration\" />\n * </Time.Group>\n * ```\n */\nexport const Group = forwardRef(function Group(\n componentProps: GroupProps,\n forwardedRef: ForwardedRef<HTMLSpanElement>\n) {\n const { render, className, style, children, ...elementProps } = componentProps;\n\n const state: GroupState = {};\n\n return renderElement(\n 'span',\n { render, className, style },\n {\n state,\n ref: [forwardedRef],\n props: [{ children }, elementProps],\n }\n );\n});\n\nexport namespace Group {\n export type Props = GroupProps;\n}\n"],"mappings":"~~;;;;;;;;;;;;;;;;AA4BA~~,MAAa,QAAQ,WAAW,SAAS,MACvC,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,UAAU,GAAG,iBAAiB;CAIhE,OAAO,cACL,QACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE,OAAA,CAAI;EACJ,KAAK,CAAC,YAAY;EAClB,OAAO,CAAC,EAAE,SAAS,GAAG,YAAY;CACpC,CACF;AACF,CAAC"}
1	+ {"version":3,"file":"time-group.js","names":[],"sources":["../../../../src/ui/time/time-group.tsx"],"sourcesContent":["import type { ForwardedRef, ReactNode } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\n\n// Empty state for Group (no dynamic state)\ntype GroupState = Record<string, never>;\n\nexport interface GroupProps extends UIComponentProps<'span', GroupState> {\n /** Time value components to render inside the group. /\n children?: ReactNode \| undefined;\n}\n\n/\n Container for composed time displays. Renders a `<span>` element.\n \n @example\n * ```tsx\n * <Time.Group>\n * <Time.Value type=\"current\" />\n * <Time.Separator />\n * <Time.Value type=\"duration\" />\n * </Time.Group>\n * ```\n */\nexport const Group = forwardRef(function Group(\n componentProps: GroupProps,\n forwardedRef: ForwardedRef<HTMLSpanElement>\n) {\n const { render, className, style, children, ...elementProps } = componentProps;\n\n const state: GroupState = {};\n\n return renderElement(\n 'span',\n { render, className, style },\n {\n state,\n ref: [forwardedRef],\n props: [{ children }, elementProps],\n }\n );\n});\n\nexport namespace Group {\n export type Props = GroupProps;\n}\n"],"mappings":";;;;;;;;;;;;;;;AA0BA,MAAa,QAAQ,WAAW,SAAS,MACvC,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,UAAU,GAAG,iBAAiB;CAIhE,OAAO,cACL,QACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE,OAAA,CAAI;EACJ,KAAK,CAAC,YAAY;EAClB,OAAO,CAAC,EAAE,SAAS,GAAG,YAAY;CACpC,CACF;AACF,CAAC"}

package/dist/default/ui/time/time-separator.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { renderElement } from "../../utils/use-render.js";
 import { forwardRef } from "react";
 //#region src/ui/time/time-separator.tsx

package/dist/default/ui/time/time-separator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"time-separator.js","names":[],"sources":["../../../../src/ui/time/time-separator.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ type { ForwardedRef, ReactNode } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\n\n// Empty state for Separator (no dynamic state)\ntype SeparatorState = Record<string, never>;\n\nexport interface SeparatorProps extends UIComponentProps<'span', SeparatorState> {\n /** Separator content. Defaults to \"/\". /\n children?: ReactNode \| undefined;\n}\n\n/\n Divider between time values. Hidden from screen readers.\n \n @example\n * ```tsx\n * <Time.Separator />\n * <Time.Separator> of </Time.Separator>\n * ```\n */\nexport const Separator = forwardRef(function Separator(\n componentProps: SeparatorProps,\n forwardedRef: ForwardedRef<HTMLSpanElement>\n) {\n const { render, className, style, children = '/', ...elementProps } = componentProps;\n\n const state: SeparatorState = {};\n\n return renderElement(\n 'span',\n { render, className, style },\n {\n state,\n ref: [forwardedRef],\n props: [{ 'aria-hidden': 'true', children }, elementProps],\n }\n );\n});\n\nexport namespace Separator {\n export type Props = SeparatorProps;\n}\n"],"mappings":"~~;;;;;;;;;;;;;AAyBA~~,MAAa,YAAY,WAAW,SAAS,UAC3C,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,WAAW,KAAK,GAAG,iBAAiB;CAItE,OAAO,cACL,QACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE,OAAA,CAAI;EACJ,KAAK,CAAC,YAAY;EAClB,OAAO,CAAC;GAAE,eAAe;GAAQ;EAAS,GAAG,YAAY;CAC3D,CACF;AACF,CAAC"}
1	+ {"version":3,"file":"time-separator.js","names":[],"sources":["../../../../src/ui/time/time-separator.tsx"],"sourcesContent":["import type { ForwardedRef, ReactNode } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\n\n// Empty state for Separator (no dynamic state)\ntype SeparatorState = Record<string, never>;\n\nexport interface SeparatorProps extends UIComponentProps<'span', SeparatorState> {\n /** Separator content. Defaults to \"/\". /\n children?: ReactNode \| undefined;\n}\n\n/\n Divider between time values. Hidden from screen readers.\n \n @example\n * ```tsx\n * <Time.Separator />\n * <Time.Separator> of </Time.Separator>\n * ```\n */\nexport const Separator = forwardRef(function Separator(\n componentProps: SeparatorProps,\n forwardedRef: ForwardedRef<HTMLSpanElement>\n) {\n const { render, className, style, children = '/', ...elementProps } = componentProps;\n\n const state: SeparatorState = {};\n\n return renderElement(\n 'span',\n { render, className, style },\n {\n state,\n ref: [forwardedRef],\n props: [{ 'aria-hidden': 'true', children }, elementProps],\n }\n );\n});\n\nexport namespace Separator {\n export type Props = SeparatorProps;\n}\n"],"mappings":";;;;;;;;;;;;AAuBA,MAAa,YAAY,WAAW,SAAS,UAC3C,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,WAAW,KAAK,GAAG,iBAAiB;CAItE,OAAO,cACL,QACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE,OAAA,CAAI;EACJ,KAAK,CAAC,YAAY;EAClB,OAAO,CAAC;GAAE,eAAe;GAAQ;EAAS,GAAG,YAAY;CAC3D,CACF;AACF,CAAC"}

package/dist/default/ui/time/time-value.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { useLocale, useTranslator } from "../../i18n/context.js";
 import { usePlayer } from "../../player/context.js";
 import { renderElement } from "../../utils/use-render.js";

package/dist/default/ui/time/time-value.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"time-value.js","names":[],"sources":["../../../../src/ui/time/time-value.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ { TimeCore, TimeDataAttrs } from '@videojs/core';\nimport { logMissingFeature, selectTime } from '@videojs/core/dom';\nimport { translateText } from '@videojs/core/i18n';\nimport { durationSuffixText, elapsedSuffixText, remainingSuffixText } from '@videojs/core/i18n/text/time';\nimport { isInteractiveActivation } from '@videojs/utils/dom';\nimport { formatTimeAsPhrase } from '@videojs/utils/time';\nimport type { ForwardedRef, KeyboardEvent, MouseEvent } from 'react';\nimport { forwardRef, useEffect, useState } from 'react';\n\nimport { useLocale, useTranslator } from '../../i18n/context';\nimport { usePlayer } from '../../player/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\n\nexport interface ValueProps extends Omit<UIComponentProps<'time', TimeCore.State>, 'children'>, TimeCore.Props {}\n\n/*\n Displays a formatted time value (current, duration, or remaining).\n \n @example\n * ```tsx\n * <Time.Value />\n * <Time.Value type=\"duration\" />\n * <Time.Value type=\"remaining\" negativeSign=\"−\" />\n * ```\n */\nexport const Value = forwardRef(function Value(\n componentProps: ValueProps,\n forwardedRef: ForwardedRef<HTMLTimeElement>\n) {\n const { render, className, style, type, negativeSign, label, toggle = false, ...elementProps } = componentProps;\n\n const time = usePlayer(selectTime);\n const translator = useTranslator();\n const locale = useLocale();\n\n const [core] = useState(() => new TimeCore());\n\n const defaultType = type ?? TimeCore.defaultProps.type;\n const [activeType, setActiveType] = useState(defaultType);\n // biome-ignore lint/correctness/useExhaustiveDependencies: We want to listen for changes to defaultType and toggle (so we revert to default), this just means one less useEffect.\n useEffect(() => {\n setActiveType(defaultType);\n }, [defaultType, toggle]);\n\n core.setProps({\n type: activeType,\n negativeSign,\n label,\n toggle,\n });\n\n if (!time) {\n if (__DEV__) logMissingFeature('Time.Value', 'time');\n return null;\n }\n\n core.setMedia(time);\n core.setFormatLocale(locale);\n const state = core.getState();\n const attrs = core.getAttrs(state, defaultType);\n const labelParams = core.getLabelParams(state);\n const suffixText = {\n current: elapsedSuffixText,\n duration: durationSuffixText,\n remaining: remainingSuffixText,\n }[state.type];\n const resolvedLabelParams = labelParams\n ? {\n duration: translateText(suffixText, translator, {\n duration: formatTimeAsPhrase(Math.abs(state.seconds), { locale }),\n }),\n }\n : undefined;\n\n const content = state.negative ? (\n <>\n <span aria-hidden=\"true\">{negativeSign ?? TimeCore.defaultProps.negativeSign}</span>\n {state.text}\n </>\n ) : (\n state.text\n );\n\n const toggleType = () => {\n setActiveType((value) => {\n if (defaultType === 'current') {\n return value === 'remaining' ? 'current' : 'remaining';\n }\n return value === 'duration' ? 'remaining' : 'duration';\n });\n };\n\n const handleClick = (event: MouseEvent<HTMLTimeElement>) => {\n if (event.defaultPrevented) return;\n toggleType();\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLTimeElement>) => {\n if (event.defaultPrevented \|\| !isInteractiveActivation(event.nativeEvent)) return;\n // Prevent space from scrolling page.\n event.preventDefault();\n if (event.repeat) return;\n toggleType();\n };\n\n return renderElement(\n 'time',\n { render, className, style },\n {\n state,\n stateAttrMap: TimeDataAttrs,\n ref: [forwardedRef],\n props: [\n {\n dateTime: toggle ? undefined : state.datetime,\n children: content,\n ...attrs,\n 'aria-label': translateText(attrs['aria-label'], translator, resolvedLabelParams),\n 'aria-description': attrs['aria-description']\n ? translateText(attrs['aria-description'], translator)\n : undefined,\n ...(toggle ? { onClick: handleClick, onKeyDown: handleKeyDown } : undefined),\n },\n elementProps,\n ],\n }\n );\n});\n\nexport namespace Value {\n export type Props = ValueProps;\n export type State = TimeCore.State;\n}\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;AA4BA~~,MAAa,QAAQ,WAAW,SAAS,MACvC,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,MAAM,cAAc,OAAO,SAAS,OAAO,GAAG,iBAAiB;CAEjG,MAAM,OAAO,UAAU,UAAU;CACjC,MAAM,aAAa,cAAc;CACjC,MAAM,SAAS,UAAU;CAEzB,MAAM,CAAC,QAAQ,eAAe,IAAI,SAAS,CAAC;CAE5C,MAAM,cAAc,QAAQ,SAAS,aAAa;CAClD,MAAM,CAAC,YAAY,iBAAiB,SAAS,WAAW;CAExD,gBAAgB;EACd,cAAc,WAAW;CAC3B,GAAG,CAAC,aAAa,MAAM,CAAC;CAExB,KAAK,SAAS;EACZ,MAAM;EACN;EACA;EACA;CACF,CAAC;CAED,IAAI,CAAC,MAEH,OAAO;CAGT,KAAK,SAAS,IAAI;CAClB,KAAK,gBAAgB,MAAM;CAC3B,MAAM,QAAQ,KAAK,SAAS;CAC5B,MAAM,QAAQ,KAAK,SAAS,OAAO,WAAW;CAC9C,MAAM,cAAc,KAAK,eAAe,KAAK;CAC7C,MAAM,aAAa;EACjB,SAAS;EACT,UAAU;EACV,WAAW;CACb,EAAE,MAAM;CACR,MAAM,sBAAsB,cACxB,EACE,UAAU,cAAc,YAAY,YAAY,EAC9C,UAAU,mBAAmB,KAAK,IAAI,MAAM,OAAO,GAAG,EAAE,OAAO,CAAC,EAClE,CAAC,EACH,IACA,KAAA;CAEJ,MAAM,UAAU,MAAM,WACpB,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,QAAD;EAAM,eAAY;EAAQ,UAAA,gBAAgB,SAAS,aAAa;CAAmB,CAAA,GAClF,MAAM,IACP,EAAA,CAAA,IAEF,MAAM;CAGR,MAAM,mBAAmB;EACvB,eAAe,UAAU;GACvB,IAAI,gBAAgB,WAClB,OAAO,UAAU,cAAc,YAAY;GAE7C,OAAO,UAAU,aAAa,cAAc;EAC9C,CAAC;CACH;CAEA,MAAM,eAAe,UAAuC;EAC1D,IAAI,MAAM,kBAAkB;EAC5B,WAAW;CACb;CAEA,MAAM,iBAAiB,UAA0C;EAC/D,IAAI,MAAM,oBAAoB,CAAC,wBAAwB,MAAM,WAAW,GAAG;EAE3E,MAAM,eAAe;EACrB,IAAI,MAAM,QAAQ;EAClB,WAAW;CACb;CAEA,OAAO,cACL,QACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,cAAc;EACd,KAAK,CAAC,YAAY;EAClB,OAAO,CACL;GACE,UAAU,SAAS,KAAA,IAAY,MAAM;GACrC,UAAU;GACV,GAAG;GACH,cAAc,cAAc,MAAM,eAAe,YAAY,mBAAmB;GAChF,oBAAoB,MAAM,sBACtB,cAAc,MAAM,qBAAqB,UAAU,IACnD,KAAA;GACJ,GAAI,SAAS;IAAE,SAAS;IAAa,WAAW;GAAc,IAAI,KAAA;EACpE,GACA,YACF;CACF,CACF;AACF,CAAC"}
1	+ {"version":3,"file":"time-value.js","names":[],"sources":["../../../../src/ui/time/time-value.tsx"],"sourcesContent":["import { TimeCore, TimeDataAttrs } from '@videojs/core';\nimport { logMissingFeature, selectTime } from '@videojs/core/dom';\nimport { translateText } from '@videojs/core/i18n';\nimport { durationSuffixText, elapsedSuffixText, remainingSuffixText } from '@videojs/core/i18n/text/time';\nimport { isInteractiveActivation } from '@videojs/utils/dom';\nimport { formatTimeAsPhrase } from '@videojs/utils/time';\nimport type { ForwardedRef, KeyboardEvent, MouseEvent } from 'react';\nimport { forwardRef, useEffect, useState } from 'react';\n\nimport { useLocale, useTranslator } from '../../i18n/context';\nimport { usePlayer } from '../../player/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\n\nexport interface ValueProps extends Omit<UIComponentProps<'time', TimeCore.State>, 'children'>, TimeCore.Props {}\n\n/*\n Displays a formatted time value (current, duration, or remaining).\n \n @example\n * ```tsx\n * <Time.Value />\n * <Time.Value type=\"duration\" />\n * <Time.Value type=\"remaining\" negativeSign=\"−\" />\n * ```\n */\nexport const Value = forwardRef(function Value(\n componentProps: ValueProps,\n forwardedRef: ForwardedRef<HTMLTimeElement>\n) {\n const { render, className, style, type, negativeSign, label, toggle = false, ...elementProps } = componentProps;\n\n const time = usePlayer(selectTime);\n const translator = useTranslator();\n const locale = useLocale();\n\n const [core] = useState(() => new TimeCore());\n\n const defaultType = type ?? TimeCore.defaultProps.type;\n const [activeType, setActiveType] = useState(defaultType);\n // biome-ignore lint/correctness/useExhaustiveDependencies: We want to listen for changes to defaultType and toggle (so we revert to default), this just means one less useEffect.\n useEffect(() => {\n setActiveType(defaultType);\n }, [defaultType, toggle]);\n\n core.setProps({\n type: activeType,\n negativeSign,\n label,\n toggle,\n });\n\n if (!time) {\n if (__DEV__) logMissingFeature('Time.Value', 'time');\n return null;\n }\n\n core.setMedia(time);\n core.setFormatLocale(locale);\n const state = core.getState();\n const attrs = core.getAttrs(state, defaultType);\n const labelParams = core.getLabelParams(state);\n const suffixText = {\n current: elapsedSuffixText,\n duration: durationSuffixText,\n remaining: remainingSuffixText,\n }[state.type];\n const resolvedLabelParams = labelParams\n ? {\n duration: translateText(suffixText, translator, {\n duration: formatTimeAsPhrase(Math.abs(state.seconds), { locale }),\n }),\n }\n : undefined;\n\n const content = state.negative ? (\n <>\n <span aria-hidden=\"true\">{negativeSign ?? TimeCore.defaultProps.negativeSign}</span>\n {state.text}\n </>\n ) : (\n state.text\n );\n\n const toggleType = () => {\n setActiveType((value) => {\n if (defaultType === 'current') {\n return value === 'remaining' ? 'current' : 'remaining';\n }\n return value === 'duration' ? 'remaining' : 'duration';\n });\n };\n\n const handleClick = (event: MouseEvent<HTMLTimeElement>) => {\n if (event.defaultPrevented) return;\n toggleType();\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLTimeElement>) => {\n if (event.defaultPrevented \|\| !isInteractiveActivation(event.nativeEvent)) return;\n // Prevent space from scrolling page.\n event.preventDefault();\n if (event.repeat) return;\n toggleType();\n };\n\n return renderElement(\n 'time',\n { render, className, style },\n {\n state,\n stateAttrMap: TimeDataAttrs,\n ref: [forwardedRef],\n props: [\n {\n dateTime: toggle ? undefined : state.datetime,\n children: content,\n ...attrs,\n 'aria-label': translateText(attrs['aria-label'], translator, resolvedLabelParams),\n 'aria-description': attrs['aria-description']\n ? translateText(attrs['aria-description'], translator)\n : undefined,\n ...(toggle ? { onClick: handleClick, onKeyDown: handleKeyDown } : undefined),\n },\n elementProps,\n ],\n }\n );\n});\n\nexport namespace Value {\n export type Props = ValueProps;\n export type State = TimeCore.State;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA0BA,MAAa,QAAQ,WAAW,SAAS,MACvC,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,MAAM,cAAc,OAAO,SAAS,OAAO,GAAG,iBAAiB;CAEjG,MAAM,OAAO,UAAU,UAAU;CACjC,MAAM,aAAa,cAAc;CACjC,MAAM,SAAS,UAAU;CAEzB,MAAM,CAAC,QAAQ,eAAe,IAAI,SAAS,CAAC;CAE5C,MAAM,cAAc,QAAQ,SAAS,aAAa;CAClD,MAAM,CAAC,YAAY,iBAAiB,SAAS,WAAW;CAExD,gBAAgB;EACd,cAAc,WAAW;CAC3B,GAAG,CAAC,aAAa,MAAM,CAAC;CAExB,KAAK,SAAS;EACZ,MAAM;EACN;EACA;EACA;CACF,CAAC;CAED,IAAI,CAAC,MAEH,OAAO;CAGT,KAAK,SAAS,IAAI;CAClB,KAAK,gBAAgB,MAAM;CAC3B,MAAM,QAAQ,KAAK,SAAS;CAC5B,MAAM,QAAQ,KAAK,SAAS,OAAO,WAAW;CAC9C,MAAM,cAAc,KAAK,eAAe,KAAK;CAC7C,MAAM,aAAa;EACjB,SAAS;EACT,UAAU;EACV,WAAW;CACb,EAAE,MAAM;CACR,MAAM,sBAAsB,cACxB,EACE,UAAU,cAAc,YAAY,YAAY,EAC9C,UAAU,mBAAmB,KAAK,IAAI,MAAM,OAAO,GAAG,EAAE,OAAO,CAAC,EAClE,CAAC,EACH,IACA,KAAA;CAEJ,MAAM,UAAU,MAAM,WACpB,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,QAAD;EAAM,eAAY;EAAQ,UAAA,gBAAgB,SAAS,aAAa;CAAmB,CAAA,GAClF,MAAM,IACP,EAAA,CAAA,IAEF,MAAM;CAGR,MAAM,mBAAmB;EACvB,eAAe,UAAU;GACvB,IAAI,gBAAgB,WAClB,OAAO,UAAU,cAAc,YAAY;GAE7C,OAAO,UAAU,aAAa,cAAc;EAC9C,CAAC;CACH;CAEA,MAAM,eAAe,UAAuC;EAC1D,IAAI,MAAM,kBAAkB;EAC5B,WAAW;CACb;CAEA,MAAM,iBAAiB,UAA0C;EAC/D,IAAI,MAAM,oBAAoB,CAAC,wBAAwB,MAAM,WAAW,GAAG;EAE3E,MAAM,eAAe;EACrB,IAAI,MAAM,QAAQ;EAClB,WAAW;CACb;CAEA,OAAO,cACL,QACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,cAAc;EACd,KAAK,CAAC,YAAY;EAClB,OAAO,CACL;GACE,UAAU,SAAS,KAAA,IAAY,MAAM;GACrC,UAAU;GACV,GAAG;GACH,cAAc,cAAc,MAAM,eAAe,YAAY,mBAAmB;GAChF,oBAAoB,MAAM,sBACtB,cAAc,MAAM,qBAAqB,UAAU,IACnD,KAAA;GACJ,GAAI,SAAS;IAAE,SAAS;IAAa,WAAW;GAAc,IAAI,KAAA;EACpE,GACA,YACF;CACF,CACF;AACF,CAAC"}

package/dist/default/ui/time-slider/time-slider-chapters/slider-segments.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { renderElement } from "../../../utils/use-render.js";
 import { useSliderContext, useSliderPointerValue } from "../../slider/context.js";
 import { getStateDataAttrs } from "@videojs/core/dom";

package/dist/default/ui/time-slider/time-slider-chapters/slider-segments.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider-segments.js","names":[],"sources":["../../../../../src/ui/time-slider/time-slider-chapters/slider-segments.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ {\n type SliderSegmentRange,\n type SliderSegmentState,\n SliderSegmentsCore,\n TimeSliderChapterCSSVars,\n} from '@videojs/core';\nimport { getStateDataAttrs } from '@videojs/core/dom';\nimport type { CSSProperties, ReactElement } from 'react';\nimport { Fragment, forwardRef, useMemo, useState } from 'react';\n\nimport type { HTMLProps, UIComponentProps } from '../../../utils/types';\nimport { renderElement } from '../../../utils/use-render';\nimport { useSliderContext, useSliderPointerValue } from '../../slider/context';\n\ntype SegmentProps = Omit<HTMLProps<HTMLElement>, 'ref'>;\n\ninterface SliderSegmentsProps extends Omit<UIComponentProps<'div', SliderSegmentState>, 'children'> {\n ranges: readonly SliderSegmentRange[];\n min: number;\n max: number;\n renderSegment: (props: SegmentProps, state: SliderSegmentState) => ReactElement;\n}\n\n/** Private React adapter for rendering normalized numeric slider segments. */\nexport const SliderSegments = forwardRef<HTMLDivElement, SliderSegmentsProps>(\n function SliderSegments(componentProps, ref) {\n const { ranges, min, max, renderSegment, render, className, style, ...elementProps } = componentProps;\n const slider = useSliderContext();\n const pointerValue = useSliderPointerValue();\n const [core] = useState(() => new SliderSegmentsCore());\n const geometry = useMemo(\n () => core.getGeometry({ ranges, min, max, orientation: slider.state.orientation }),\n [core, ranges, min, max, slider.state.orientation]\n );\n const sliderAttrs = getStateDataAttrs(slider.state, slider.stateAttrMap);\n\n const segments = geometry.map((segment) => {\n const state = core.getState(segment, slider.state, pointerValue);\n const segmentStyle = {\n [TimeSliderChapterCSSVars.start]: state.startPercent,\n [TimeSliderChapterCSSVars.end]: state.endPercent,\n [TimeSliderChapterCSSVars.width]: state.width ?? state.height,\n [TimeSliderChapterCSSVars.fill]: `${state.fillPercent}%`,\n } as CSSProperties;\n\n return (\n <Fragment key={state.key}>\n {renderSegment(\n {\n ...sliderAttrs,\n style: segmentStyle,\n },\n state\n )}\n </Fragment>\n );\n });\n\n const state = geometry.length > 0 ? core.getState(geometry[0]!, slider.state, pointerValue) : null;\n if (!state) return null;\n\n return renderElement(\n 'div',\n { render, className, style },\n {\n state,\n ref,\n props: [{ 'aria-hidden': 'true' }, sliderAttrs, elementProps, { children: segments }],\n }\n );\n }\n);\n"],"mappings":"~~;;;;;;;;;AA0BA~~,MAAa,iBAAiB,WAC5B,SAAS,eAAe,gBAAgB,KAAK;CAC3C,MAAM,EAAE,QAAQ,KAAK,KAAK,eAAe,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CACvF,MAAM,SAAS,iBAAiB;CAChC,MAAM,eAAe,sBAAsB;CAC3C,MAAM,CAAC,QAAQ,eAAe,IAAI,mBAAmB,CAAC;CACtD,MAAM,WAAW,cACT,KAAK,YAAY;EAAE;EAAQ;EAAK;EAAK,aAAa,OAAO,MAAM;CAAY,CAAC,GAClF;EAAC;EAAM;EAAQ;EAAK;EAAK,OAAO,MAAM;CAAW,CACnD;CACA,MAAM,cAAc,kBAAkB,OAAO,OAAO,OAAO,YAAY;CAEvE,MAAM,WAAW,SAAS,KAAK,YAAY;EACzC,MAAM,QAAQ,KAAK,SAAS,SAAS,OAAO,OAAO,YAAY;EAC/D,MAAM,eAAe;IAClB,yBAAyB,QAAQ,MAAM;IACvC,yBAAyB,MAAM,MAAM;IACrC,yBAAyB,QAAQ,MAAM,SAAS,MAAM;IACtD,yBAAyB,OAAO,GAAG,MAAM,YAAY;EACxD;EAEA,OACE,oBAAC,UAAD,EAAA,UACG,cACC;GACE,GAAG;GACH,OAAO;EACT,GACA,KACF,EACQ,GARK,MAAM,GAQX;CAEd,CAAC;CAED,MAAM,QAAQ,SAAS,SAAS,IAAI,KAAK,SAAS,SAAS,IAAK,OAAO,OAAO,YAAY,IAAI;CAC9F,IAAI,CAAC,OAAO,OAAO;CAEnB,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA;EACA,OAAO;GAAC,EAAE,eAAe,OAAO;GAAG;GAAa;GAAc,EAAE,UAAU,SAAS;EAAC;CACtF,CACF;AACF,CACF"}
1	+ {"version":3,"file":"slider-segments.js","names":[],"sources":["../../../../../src/ui/time-slider/time-slider-chapters/slider-segments.tsx"],"sourcesContent":["import {\n type SliderSegmentRange,\n type SliderSegmentState,\n SliderSegmentsCore,\n TimeSliderChapterCSSVars,\n} from '@videojs/core';\nimport { getStateDataAttrs } from '@videojs/core/dom';\nimport type { CSSProperties, ReactElement } from 'react';\nimport { Fragment, forwardRef, useMemo, useState } from 'react';\n\nimport type { HTMLProps, UIComponentProps } from '../../../utils/types';\nimport { renderElement } from '../../../utils/use-render';\nimport { useSliderContext, useSliderPointerValue } from '../../slider/context';\n\ntype SegmentProps = Omit<HTMLProps<HTMLElement>, 'ref'>;\n\ninterface SliderSegmentsProps extends Omit<UIComponentProps<'div', SliderSegmentState>, 'children'> {\n ranges: readonly SliderSegmentRange[];\n min: number;\n max: number;\n renderSegment: (props: SegmentProps, state: SliderSegmentState) => ReactElement;\n}\n\n/** Private React adapter for rendering normalized numeric slider segments. */\nexport const SliderSegments = forwardRef<HTMLDivElement, SliderSegmentsProps>(\n function SliderSegments(componentProps, ref) {\n const { ranges, min, max, renderSegment, render, className, style, ...elementProps } = componentProps;\n const slider = useSliderContext();\n const pointerValue = useSliderPointerValue();\n const [core] = useState(() => new SliderSegmentsCore());\n const geometry = useMemo(\n () => core.getGeometry({ ranges, min, max, orientation: slider.state.orientation }),\n [core, ranges, min, max, slider.state.orientation]\n );\n const sliderAttrs = getStateDataAttrs(slider.state, slider.stateAttrMap);\n\n const segments = geometry.map((segment) => {\n const state = core.getState(segment, slider.state, pointerValue);\n const segmentStyle = {\n [TimeSliderChapterCSSVars.start]: state.startPercent,\n [TimeSliderChapterCSSVars.end]: state.endPercent,\n [TimeSliderChapterCSSVars.width]: state.width ?? state.height,\n [TimeSliderChapterCSSVars.fill]: `${state.fillPercent}%`,\n } as CSSProperties;\n\n return (\n <Fragment key={state.key}>\n {renderSegment(\n {\n ...sliderAttrs,\n style: segmentStyle,\n },\n state\n )}\n </Fragment>\n );\n });\n\n const state = geometry.length > 0 ? core.getState(geometry[0]!, slider.state, pointerValue) : null;\n if (!state) return null;\n\n return renderElement(\n 'div',\n { render, className, style },\n {\n state,\n ref,\n props: [{ 'aria-hidden': 'true' }, sliderAttrs, elementProps, { children: segments }],\n }\n );\n }\n);\n"],"mappings":";;;;;;;;AAwBA,MAAa,iBAAiB,WAC5B,SAAS,eAAe,gBAAgB,KAAK;CAC3C,MAAM,EAAE,QAAQ,KAAK,KAAK,eAAe,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CACvF,MAAM,SAAS,iBAAiB;CAChC,MAAM,eAAe,sBAAsB;CAC3C,MAAM,CAAC,QAAQ,eAAe,IAAI,mBAAmB,CAAC;CACtD,MAAM,WAAW,cACT,KAAK,YAAY;EAAE;EAAQ;EAAK;EAAK,aAAa,OAAO,MAAM;CAAY,CAAC,GAClF;EAAC;EAAM;EAAQ;EAAK;EAAK,OAAO,MAAM;CAAW,CACnD;CACA,MAAM,cAAc,kBAAkB,OAAO,OAAO,OAAO,YAAY;CAEvE,MAAM,WAAW,SAAS,KAAK,YAAY;EACzC,MAAM,QAAQ,KAAK,SAAS,SAAS,OAAO,OAAO,YAAY;EAC/D,MAAM,eAAe;IAClB,yBAAyB,QAAQ,MAAM;IACvC,yBAAyB,MAAM,MAAM;IACrC,yBAAyB,QAAQ,MAAM,SAAS,MAAM;IACtD,yBAAyB,OAAO,GAAG,MAAM,YAAY;EACxD;EAEA,OACE,oBAAC,UAAD,EAAA,UACG,cACC;GACE,GAAG;GACH,OAAO;EACT,GACA,KACF,EACQ,GARK,MAAM,GAQX;CAEd,CAAC;CAED,MAAM,QAAQ,SAAS,SAAS,IAAI,KAAK,SAAS,SAAS,IAAK,OAAO,OAAO,YAAY,IAAI;CAC9F,IAAI,CAAC,OAAO,OAAO;CAEnB,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA;EACA,OAAO;GAAC,EAAE,eAAe,OAAO;GAAG;GAAa;GAAc,EAAE,UAAU,SAAS;EAAC;CACtF,CACF;AACF,CACF"}

package/dist/default/ui/time-slider/time-slider-chapters/time-slider-chapter-title.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { usePlayer } from "../../../player/context.js";
 import { renderElement } from "../../../utils/use-render.js";
 import { useSliderContext, useSliderPointerValue } from "../../slider/context.js";

package/dist/default/ui/time-slider/time-slider-chapters/time-slider-chapter-title.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"time-slider-chapter-title.js","names":[],"sources":["../../../../../src/ui/time-slider/time-slider-chapters/time-slider-chapter-title.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ { TimeSliderChaptersCore } from '@videojs/core';\nimport { selectTextTrack, selectTime } from '@videojs/core/dom';\nimport type { MediaTextCue } from '@videojs/media';\nimport { forwardRef, useMemo, useState } from 'react';\n\nimport { usePlayer } from '../../../player/context';\nimport type { UIComponentProps } from '../../../utils/types';\nimport { renderElement } from '../../../utils/use-render';\nimport { useSliderContext, useSliderPointerValue } from '../../slider/context';\n\nexport interface TimeSliderChapterTitleState {\n /** Chapter at the current interaction value. /\n cue: MediaTextCue \| null;\n /* Chapter cue text, or an empty string for an uncovered interval. /\n text: string;\n}\n\nexport interface TimeSliderChapterTitleProps extends UIComponentProps<'span', TimeSliderChapterTitleState> {}\n\n/* Displays the chapter title at the current pointer or keyboard position. */\nexport const TimeSliderChapterTitle = forwardRef<HTMLSpanElement, TimeSliderChapterTitleProps>(\n function TimeSliderChapterTitle(componentProps, ref) {\n const { render, className, style, ...elementProps } = componentProps;\n const slider = useSliderContext();\n const pointerValue = useSliderPointerValue();\n const textTrack = usePlayer(selectTextTrack);\n const time = usePlayer(selectTime);\n const [core] = useState(() => new TimeSliderChaptersCore());\n const { chapters } = useMemo(\n () => core.getRanges(textTrack?.chaptersCues ?? [], 0, time?.duration ?? 0),\n [core, textTrack?.chaptersCues, time?.duration]\n );\n const keyboard = slider.state.interactive && !slider.state.pointing && !slider.state.dragging;\n const value = slider.state.pointing \|\| slider.state.dragging ? pointerValue : slider.state.value;\n const chapter = core.findChapter(chapters, value);\n const cue = chapter?.cue ?? null;\n const state = { cue, text: cue?.text ?? '' };\n\n return renderElement(\n 'span',\n { render, className, style },\n {\n state,\n ref,\n props: [\n {\n 'aria-hidden': keyboard ? undefined : true,\n 'aria-live': keyboard ? 'polite' : undefined,\n children: state.text,\n },\n elementProps,\n ],\n }\n );\n }\n);\n\nexport namespace TimeSliderChapterTitle {\n export type Props = TimeSliderChapterTitleProps;\n export type State = TimeSliderChapterTitleState;\n}\n"],"mappings":"~~;;;;;;;;;AAsBA~~,MAAa,yBAAyB,WACpC,SAAS,uBAAuB,gBAAgB,KAAK;CACnD,MAAM,EAAE,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CACtD,MAAM,SAAS,iBAAiB;CAChC,MAAM,eAAe,sBAAsB;CAC3C,MAAM,YAAY,UAAU,eAAe;CAC3C,MAAM,OAAO,UAAU,UAAU;CACjC,MAAM,CAAC,QAAQ,eAAe,IAAI,uBAAuB,CAAC;CAC1D,MAAM,EAAE,aAAa,cACb,KAAK,UAAU,WAAW,gBAAgB,CAAC,GAAG,GAAG,MAAM,YAAY,CAAC,GAC1E;EAAC;EAAM,WAAW;EAAc,MAAM;CAAQ,CAChD;CACA,MAAM,WAAW,OAAO,MAAM,eAAe,CAAC,OAAO,MAAM,YAAY,CAAC,OAAO,MAAM;CACrF,MAAM,QAAQ,OAAO,MAAM,YAAY,OAAO,MAAM,WAAW,eAAe,OAAO,MAAM;CAE3F,MAAM,MADU,KAAK,YAAY,UAAU,KACzB,CAAC,EAAE,OAAO;CAC5B,MAAM,QAAQ;EAAE;EAAK,MAAM,KAAK,QAAQ;CAAG;CAE3C,OAAO,cACL,QACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA;EACA,OAAO,CACL;GACE,eAAe,WAAW,KAAA,IAAY;GACtC,aAAa,WAAW,WAAW,KAAA;GACnC,UAAU,MAAM;EAClB,GACA,YACF;CACF,CACF;AACF,CACF"}
1	+ {"version":3,"file":"time-slider-chapter-title.js","names":[],"sources":["../../../../../src/ui/time-slider/time-slider-chapters/time-slider-chapter-title.tsx"],"sourcesContent":["import { TimeSliderChaptersCore } from '@videojs/core';\nimport { selectTextTrack, selectTime } from '@videojs/core/dom';\nimport type { MediaTextCue } from '@videojs/media';\nimport { forwardRef, useMemo, useState } from 'react';\n\nimport { usePlayer } from '../../../player/context';\nimport type { UIComponentProps } from '../../../utils/types';\nimport { renderElement } from '../../../utils/use-render';\nimport { useSliderContext, useSliderPointerValue } from '../../slider/context';\n\nexport interface TimeSliderChapterTitleState {\n /** Chapter at the current interaction value. /\n cue: MediaTextCue \| null;\n /* Chapter cue text, or an empty string for an uncovered interval. /\n text: string;\n}\n\nexport interface TimeSliderChapterTitleProps extends UIComponentProps<'span', TimeSliderChapterTitleState> {}\n\n/* Displays the chapter title at the current pointer or keyboard position. */\nexport const TimeSliderChapterTitle = forwardRef<HTMLSpanElement, TimeSliderChapterTitleProps>(\n function TimeSliderChapterTitle(componentProps, ref) {\n const { render, className, style, ...elementProps } = componentProps;\n const slider = useSliderContext();\n const pointerValue = useSliderPointerValue();\n const textTrack = usePlayer(selectTextTrack);\n const time = usePlayer(selectTime);\n const [core] = useState(() => new TimeSliderChaptersCore());\n const { chapters } = useMemo(\n () => core.getRanges(textTrack?.chaptersCues ?? [], 0, time?.duration ?? 0),\n [core, textTrack?.chaptersCues, time?.duration]\n );\n const keyboard = slider.state.interactive && !slider.state.pointing && !slider.state.dragging;\n const value = slider.state.pointing \|\| slider.state.dragging ? pointerValue : slider.state.value;\n const chapter = core.findChapter(chapters, value);\n const cue = chapter?.cue ?? null;\n const state = { cue, text: cue?.text ?? '' };\n\n return renderElement(\n 'span',\n { render, className, style },\n {\n state,\n ref,\n props: [\n {\n 'aria-hidden': keyboard ? undefined : true,\n 'aria-live': keyboard ? 'polite' : undefined,\n children: state.text,\n },\n elementProps,\n ],\n }\n );\n }\n);\n\nexport namespace TimeSliderChapterTitle {\n export type Props = TimeSliderChapterTitleProps;\n export type State = TimeSliderChapterTitleState;\n}\n"],"mappings":";;;;;;;;AAoBA,MAAa,yBAAyB,WACpC,SAAS,uBAAuB,gBAAgB,KAAK;CACnD,MAAM,EAAE,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CACtD,MAAM,SAAS,iBAAiB;CAChC,MAAM,eAAe,sBAAsB;CAC3C,MAAM,YAAY,UAAU,eAAe;CAC3C,MAAM,OAAO,UAAU,UAAU;CACjC,MAAM,CAAC,QAAQ,eAAe,IAAI,uBAAuB,CAAC;CAC1D,MAAM,EAAE,aAAa,cACb,KAAK,UAAU,WAAW,gBAAgB,CAAC,GAAG,GAAG,MAAM,YAAY,CAAC,GAC1E;EAAC;EAAM,WAAW;EAAc,MAAM;CAAQ,CAChD;CACA,MAAM,WAAW,OAAO,MAAM,eAAe,CAAC,OAAO,MAAM,YAAY,CAAC,OAAO,MAAM;CACrF,MAAM,QAAQ,OAAO,MAAM,YAAY,OAAO,MAAM,WAAW,eAAe,OAAO,MAAM;CAE3F,MAAM,MADU,KAAK,YAAY,UAAU,KACzB,CAAC,EAAE,OAAO;CAC5B,MAAM,QAAQ;EAAE;EAAK,MAAM,KAAK,QAAQ;CAAG;CAE3C,OAAO,cACL,QACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA;EACA,OAAO,CACL;GACE,eAAe,WAAW,KAAA,IAAY;GACtC,aAAa,WAAW,WAAW,KAAA;GACnC,UAAU,MAAM;EAClB,GACA,YACF;CACF,CACF;AACF,CACF"}

package/dist/default/ui/time-slider/time-slider-chapters/time-slider-chapters.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { usePlayer } from "../../../player/context.js";
 import { SliderSegments } from "./slider-segments.js";
 import { getStateDataAttrs, selectBuffer, selectTextTrack, selectTime } from "@videojs/core/dom";

package/dist/default/ui/time-slider/time-slider-chapters/time-slider-chapters.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"time-slider-chapters.js","names":[],"sources":["../../../../../src/ui/time-slider/time-slider-chapters/time-slider-chapters.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ {\n type SliderSegmentState,\n TimeSliderChapterCSSVars,\n TimeSliderChapterDataAttrs,\n type TimeSliderChapterRange,\n TimeSliderChaptersCore,\n} from '@videojs/core';\nimport { getStateDataAttrs, selectBuffer, selectTextTrack, selectTime } from '@videojs/core/dom';\nimport { isFunction } from '@videojs/utils/predicate';\nimport type { CSSProperties, ReactElement } from 'react';\nimport { forwardRef, useMemo, useState } from 'react';\n\nimport { usePlayer } from '../../../player/context';\nimport type { HTMLProps, UIComponentProps } from '../../../utils/types';\nimport { SliderSegments } from './slider-segments';\n\nexport type TimeSliderChapterState = TimeSliderChaptersCore.State;\n\nexport interface TimeSliderChaptersState {\n /** Normalized ranges spanning the full slider domain. /\n chapters: readonly TimeSliderChapterRange[];\n}\n\nexport interface TimeSliderChaptersProps extends Omit<UIComponentProps<'div', TimeSliderChaptersState>, 'children'> {\n /* Render one consumer-owned subtree for every normalized chapter range. /\n renderChapter: (props: Omit<HTMLProps<HTMLElement>, 'ref'>, state: TimeSliderChapterState) => ReactElement;\n}\n\n/* Renders normalized chapter ranges across the full slider, including one full range when chapter cues are absent. */\nexport const TimeSliderChapters = forwardRef<HTMLDivElement, TimeSliderChaptersProps>(\n function TimeSliderChapters(componentProps, ref) {\n const { renderChapter, className, style, render, ...props } = componentProps;\n const textTrack = usePlayer(selectTextTrack);\n const buffer = usePlayer(selectBuffer);\n const time = usePlayer(selectTime);\n const duration = time?.duration ?? 0;\n const [core] = useState(() => new TimeSliderChaptersCore());\n const { chapters, ranges, max } = useMemo(\n () => core.getRanges(textTrack?.chaptersCues ?? [], 0, duration),\n [core, textTrack?.chaptersCues, duration]\n );\n const bufferedEnd = buffer?.buffered.length ? buffer.buffered[buffer.buffered.length - 1]![1] : 0;\n const getChapterState = (segment: SliderSegmentState) => core.getState(segment, chapters, bufferedEnd);\n const state = useMemo(() => ({ chapters }), [chapters]);\n\n return (\n <SliderSegments\n ref={ref}\n {...props}\n className={isFunction(className) ? className(state) : className}\n style={isFunction(style) ? style(state) : style}\n render={isFunction(render) ? (renderProps) => render(renderProps, state) : render}\n ranges={ranges}\n min={0}\n max={max}\n renderSegment={(segmentProps, segment) => {\n const state = getChapterState(segment);\n const chapterProps = {\n ...segmentProps,\n ...getStateDataAttrs(state, TimeSliderChapterDataAttrs),\n style: {\n ...segmentProps.style,\n pointerEvents: state.cue ? undefined : 'none',\n [TimeSliderChapterCSSVars.buffer]: `${state.bufferPercent}%`,\n } as CSSProperties,\n };\n\n return renderChapter(chapterProps, state);\n }}\n />\n );\n }\n);\n\nexport namespace TimeSliderChapters {\n export type Props = TimeSliderChaptersProps;\n export type State = TimeSliderChaptersState;\n}\n"],"mappings":"~~;;;;;;;;;;AA+BA~~,MAAa,qBAAqB,WAChC,SAAS,mBAAmB,gBAAgB,KAAK;CAC/C,MAAM,EAAE,eAAe,WAAW,OAAO,QAAQ,GAAG,UAAU;CAC9D,MAAM,YAAY,UAAU,eAAe;CAC3C,MAAM,SAAS,UAAU,YAAY;CAErC,MAAM,WADO,UAAU,UACH,CAAC,EAAE,YAAY;CACnC,MAAM,CAAC,QAAQ,eAAe,IAAI,uBAAuB,CAAC;CAC1D,MAAM,EAAE,UAAU,QAAQ,QAAQ,cAC1B,KAAK,UAAU,WAAW,gBAAgB,CAAC,GAAG,GAAG,QAAQ,GAC/D;EAAC;EAAM,WAAW;EAAc;CAAQ,CAC1C;CACA,MAAM,cAAc,QAAQ,SAAS,SAAS,OAAO,SAAS,OAAO,SAAS,SAAS,EAAE,CAAE,KAAK;CAChG,MAAM,mBAAmB,YAAgC,KAAK,SAAS,SAAS,UAAU,WAAW;CACrG,MAAM,QAAQ,eAAe,EAAE,SAAS,IAAI,CAAC,QAAQ,CAAC;CAEtD,OACE,oBAAC,gBAAD;EACO;EACL,GAAI;EACJ,WAAW,WAAW,SAAS,IAAI,UAAU,KAAK,IAAI;EACtD,OAAO,WAAW,KAAK,IAAI,MAAM,KAAK,IAAI;EAC1C,QAAQ,WAAW,MAAM,KAAK,gBAAgB,OAAO,aAAa,KAAK,IAAI;EACnE;EACR,KAAK;EACA;EACL,gBAAgB,cAAc,YAAY;GACxC,MAAM,QAAQ,gBAAgB,OAAO;GACrC,MAAM,eAAe;IACnB,GAAG;IACH,GAAG,kBAAkB,OAAO,0BAA0B;IACtD,OAAO;KACL,GAAG,aAAa;KAChB,eAAe,MAAM,MAAM,KAAA,IAAY;MACtC,yBAAyB,SAAS,GAAG,MAAM,cAAc;IAC5D;GACF;GAEA,OAAO,cAAc,cAAc,KAAK;EAC1C;CACD,CAAA;AAEL,CACF"}
1	+ {"version":3,"file":"time-slider-chapters.js","names":[],"sources":["../../../../../src/ui/time-slider/time-slider-chapters/time-slider-chapters.tsx"],"sourcesContent":["import {\n type SliderSegmentState,\n TimeSliderChapterCSSVars,\n TimeSliderChapterDataAttrs,\n type TimeSliderChapterRange,\n TimeSliderChaptersCore,\n} from '@videojs/core';\nimport { getStateDataAttrs, selectBuffer, selectTextTrack, selectTime } from '@videojs/core/dom';\nimport { isFunction } from '@videojs/utils/predicate';\nimport type { CSSProperties, ReactElement } from 'react';\nimport { forwardRef, useMemo, useState } from 'react';\n\nimport { usePlayer } from '../../../player/context';\nimport type { HTMLProps, UIComponentProps } from '../../../utils/types';\nimport { SliderSegments } from './slider-segments';\n\nexport type TimeSliderChapterState = TimeSliderChaptersCore.State;\n\nexport interface TimeSliderChaptersState {\n /** Normalized ranges spanning the full slider domain. /\n chapters: readonly TimeSliderChapterRange[];\n}\n\nexport interface TimeSliderChaptersProps extends Omit<UIComponentProps<'div', TimeSliderChaptersState>, 'children'> {\n /* Render one consumer-owned subtree for every normalized chapter range. /\n renderChapter: (props: Omit<HTMLProps<HTMLElement>, 'ref'>, state: TimeSliderChapterState) => ReactElement;\n}\n\n/* Renders normalized chapter ranges across the full slider, including one full range when chapter cues are absent. */\nexport const TimeSliderChapters = forwardRef<HTMLDivElement, TimeSliderChaptersProps>(\n function TimeSliderChapters(componentProps, ref) {\n const { renderChapter, className, style, render, ...props } = componentProps;\n const textTrack = usePlayer(selectTextTrack);\n const buffer = usePlayer(selectBuffer);\n const time = usePlayer(selectTime);\n const duration = time?.duration ?? 0;\n const [core] = useState(() => new TimeSliderChaptersCore());\n const { chapters, ranges, max } = useMemo(\n () => core.getRanges(textTrack?.chaptersCues ?? [], 0, duration),\n [core, textTrack?.chaptersCues, duration]\n );\n const bufferedEnd = buffer?.buffered.length ? buffer.buffered[buffer.buffered.length - 1]![1] : 0;\n const getChapterState = (segment: SliderSegmentState) => core.getState(segment, chapters, bufferedEnd);\n const state = useMemo(() => ({ chapters }), [chapters]);\n\n return (\n <SliderSegments\n ref={ref}\n {...props}\n className={isFunction(className) ? className(state) : className}\n style={isFunction(style) ? style(state) : style}\n render={isFunction(render) ? (renderProps) => render(renderProps, state) : render}\n ranges={ranges}\n min={0}\n max={max}\n renderSegment={(segmentProps, segment) => {\n const state = getChapterState(segment);\n const chapterProps = {\n ...segmentProps,\n ...getStateDataAttrs(state, TimeSliderChapterDataAttrs),\n style: {\n ...segmentProps.style,\n pointerEvents: state.cue ? undefined : 'none',\n [TimeSliderChapterCSSVars.buffer]: `${state.bufferPercent}%`,\n } as CSSProperties,\n };\n\n return renderChapter(chapterProps, state);\n }}\n />\n );\n }\n);\n\nexport namespace TimeSliderChapters {\n export type Props = TimeSliderChaptersProps;\n export type State = TimeSliderChaptersState;\n}\n"],"mappings":";;;;;;;;;AA6BA,MAAa,qBAAqB,WAChC,SAAS,mBAAmB,gBAAgB,KAAK;CAC/C,MAAM,EAAE,eAAe,WAAW,OAAO,QAAQ,GAAG,UAAU;CAC9D,MAAM,YAAY,UAAU,eAAe;CAC3C,MAAM,SAAS,UAAU,YAAY;CAErC,MAAM,WADO,UAAU,UACH,CAAC,EAAE,YAAY;CACnC,MAAM,CAAC,QAAQ,eAAe,IAAI,uBAAuB,CAAC;CAC1D,MAAM,EAAE,UAAU,QAAQ,QAAQ,cAC1B,KAAK,UAAU,WAAW,gBAAgB,CAAC,GAAG,GAAG,QAAQ,GAC/D;EAAC;EAAM,WAAW;EAAc;CAAQ,CAC1C;CACA,MAAM,cAAc,QAAQ,SAAS,SAAS,OAAO,SAAS,OAAO,SAAS,SAAS,EAAE,CAAE,KAAK;CAChG,MAAM,mBAAmB,YAAgC,KAAK,SAAS,SAAS,UAAU,WAAW;CACrG,MAAM,QAAQ,eAAe,EAAE,SAAS,IAAI,CAAC,QAAQ,CAAC;CAEtD,OACE,oBAAC,gBAAD;EACO;EACL,GAAI;EACJ,WAAW,WAAW,SAAS,IAAI,UAAU,KAAK,IAAI;EACtD,OAAO,WAAW,KAAK,IAAI,MAAM,KAAK,IAAI;EAC1C,QAAQ,WAAW,MAAM,KAAK,gBAAgB,OAAO,aAAa,KAAK,IAAI;EACnE;EACR,KAAK;EACA;EACL,gBAAgB,cAAc,YAAY;GACxC,MAAM,QAAQ,gBAAgB,OAAO;GACrC,MAAM,eAAe;IACnB,GAAG;IACH,GAAG,kBAAkB,OAAO,0BAA0B;IACtD,OAAO;KACL,GAAG,aAAa;KAChB,eAAe,MAAM,MAAM,KAAA,IAAY;MACtC,yBAAyB,SAAS,GAAG,MAAM,cAAc;IAC5D;GACF;GAEA,OAAO,cAAc,cAAc,KAAK;EAC1C;CACD,CAAA;AAEL,CACF"}

package/dist/default/ui/time-slider/time-slider-root.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { useLocale, useTranslator } from "../../i18n/context.js";
 import { usePlayer } from "../../player/context.js";
 import { useLatestRef } from "../../utils/use-latest-ref.js";

package/dist/default/ui/time-slider/time-slider-root.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"time-slider-root.js","names":[],"sources":["../../../../src/ui/time-slider/time-slider-root.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ { TimeSliderCore, TimeSliderDataAttrs } from '@videojs/core';\nimport { getTimeSliderCSSVars, logMissingFeature, selectBuffer, selectPlayback, selectTime } from '@videojs/core/dom';\nimport { translateText } from '@videojs/core/i18n';\nimport { formatTime } from '@videojs/utils/time';\nimport { forwardRef, useEffect, useState } from 'react';\n\nimport { useLocale, useTranslator } from '../../i18n/context';\nimport { usePlayer } from '../../player/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { useLatestRef } from '../../utils/use-latest-ref';\nimport { renderElement } from '../../utils/use-render';\nimport { useSlider } from '../hooks/use-slider';\nimport { SliderProvider } from '../slider/context';\n\nconst noopSeek = (): Promise<number> => Promise.resolve(0);\n\nexport interface TimeSliderRootProps extends UIComponentProps<'div', TimeSliderCore.State>, TimeSliderCore.Props {\n onDragStart?: (() => void) \| undefined;\n onDragEnd?: (() => void) \| undefined;\n}\n\nexport const TimeSliderRoot = forwardRef<HTMLDivElement, TimeSliderRootProps>(\n function TimeSliderRoot(componentProps, forwardedRef) {\n const {\n render,\n className,\n style,\n label,\n changeThrottle = TimeSliderCore.defaultProps.changeThrottle,\n step = TimeSliderCore.defaultProps.step,\n largeStep = TimeSliderCore.defaultProps.largeStep,\n orientation,\n disabled,\n thumbAlignment,\n onDragStart,\n onDragEnd,\n pauseOnDrag,\n ...elementProps\n } = componentProps;\n\n const time = usePlayer(selectTime);\n const buffer = usePlayer(selectBuffer);\n const playback = usePlayer(selectPlayback);\n const translator = useTranslator();\n const locale = useLocale();\n\n const [core] = useState(() => new TimeSliderCore());\n core.setProps({\n label,\n step,\n largeStep,\n orientation,\n disabled,\n thumbAlignment,\n pauseOnDrag,\n changeThrottle,\n });\n core.setFormatLocale(locale);\n\n // Keep a ref to the latest media state for callbacks that fire outside the render cycle.\n const mediaRef = useLatestRef(time && buffer ? { ...time, ...buffer } : null);\n const playbackRef = useLatestRef(playback);\n\n // Resume playback if the slider unmounts mid-drag — createSlider's destroy()\n // does not fire onDragEnd, so without this the player would stay paused.\n useEffect(() => {\n return () => core.endDrag(playbackRef.current);\n }, [core]);\n\n const duration = time?.duration ?? 0;\n\n const { state, input, cssVars, rootRef, thumbRef, rootProps, rootStyle, thumbProps } =\n useSlider<TimeSliderCore.State>({\n computeState: (input) => {\n core.setInput(input);\n if (!time \|\| !buffer) {\n core.setMedia({\n currentTime: 0,\n duration: 0,\n seeking: false,\n seek: noopSeek,\n buffered: [],\n seekable: [],\n });\n } else {\n core.setMedia({ ...time, ...buffer });\n }\n\n return core.getState();\n },\n getPercent: () => core.percentFromValue(time?.currentTime ?? 0),\n getStepPercent: () => core.getStepPercent(),\n getLargeStepPercent: () => core.getLargeStepPercent(),\n orientation,\n disabled,\n changeThrottle,\n adjustPercent: (rawPercent, thumbSize, trackSize) =>\n core.adjustPercentForAlignment(rawPercent, thumbSize, trackSize),\n getCSSVars: getTimeSliderCSSVars,\n onValueCommit: (percent) => {\n const media = mediaRef.current;\n if (media) media.seek(core.rawValueFromPercent(percent));\n },\n onDragStart: () => {\n core.startDrag(playbackRef.current);\n onDragStart?.();\n },\n onDragEnd: () => {\n core.endDrag(playbackRef.current);\n onDragEnd?.();\n },\n });\n\n if (!time) {\n if (__DEV__) logMissingFeature('TimeSlider', 'time');\n return null;\n }\n\n return (\n <SliderProvider\n value={{\n state,\n pointerValue: core.rawValueFromPercent(state.pointerPercent),\n input,\n getPointerValue: (percent) => core.rawValueFromPercent(percent),\n thumbRef,\n thumbProps,\n stateAttrMap: TimeSliderDataAttrs,\n getAttrs: (sliderState) => {\n const attrs = core.getAttrs(sliderState as TimeSliderCore.State);\n return {\n ...attrs,\n 'aria-label': translateText(attrs['aria-label'], translator),\n 'aria-valuetext': translateText(\n attrs['aria-valuetext'],\n translator,\n core.getValueTextParams(sliderState as TimeSliderCore.State)\n ),\n };\n },\n formatValue: (value) => formatTime(value, duration, { locale }),\n }}\n >\n {renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: TimeSliderDataAttrs,\n ref: [forwardedRef, rootRef],\n props: [{ style: { ...cssVars, ...rootStyle } }, rootProps, elementProps],\n }\n )}\n </SliderProvider>\n );\n }\n);\n\nexport namespace TimeSliderRoot {\n export type Props = TimeSliderRootProps;\n export type State = TimeSliderCore.State;\n}\n"],"mappings":"~~;;;;;;;;;;;;;;AAgBA~~,MAAM,iBAAkC,QAAQ,QAAQ,CAAC;AAOzD,MAAa,iBAAiB,WAC5B,SAAS,eAAe,gBAAgB,cAAc;CACpD,MAAM,EACJ,QACA,WACA,OACA,OACA,iBAAiB,eAAe,aAAa,gBAC7C,OAAO,eAAe,aAAa,MACnC,YAAY,eAAe,aAAa,WACxC,aACA,UACA,gBACA,aACA,WACA,aACA,GAAG,iBACD;CAEJ,MAAM,OAAO,UAAU,UAAU;CACjC,MAAM,SAAS,UAAU,YAAY;CACrC,MAAM,WAAW,UAAU,cAAc;CACzC,MAAM,aAAa,cAAc;CACjC,MAAM,SAAS,UAAU;CAEzB,MAAM,CAAC,QAAQ,eAAe,IAAI,eAAe,CAAC;CAClD,KAAK,SAAS;EACZ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CACD,KAAK,gBAAgB,MAAM;CAG3B,MAAM,WAAW,aAAa,QAAQ,SAAS;EAAE,GAAG;EAAM,GAAG;CAAO,IAAI,IAAI;CAC5E,MAAM,cAAc,aAAa,QAAQ;CAIzC,gBAAgB;EACd,aAAa,KAAK,QAAQ,YAAY,OAAO;CAC/C,GAAG,CAAC,IAAI,CAAC;CAET,MAAM,WAAW,MAAM,YAAY;CAEnC,MAAM,EAAE,OAAO,OAAO,SAAS,SAAS,UAAU,WAAW,WAAW,eACtE,UAAgC;EAC9B,eAAe,UAAU;GACvB,KAAK,SAAS,KAAK;GACnB,IAAI,CAAC,QAAQ,CAAC,QACZ,KAAK,SAAS;IACZ,aAAa;IACb,UAAU;IACV,SAAS;IACT,MAAM;IACN,UAAU,CAAC;IACX,UAAU,CAAC;GACb,CAAC;QAED,KAAK,SAAS;IAAE,GAAG;IAAM,GAAG;GAAO,CAAC;GAGtC,OAAO,KAAK,SAAS;EACvB;EACA,kBAAkB,KAAK,iBAAiB,MAAM,eAAe,CAAC;EAC9D,sBAAsB,KAAK,eAAe;EAC1C,2BAA2B,KAAK,oBAAoB;EACpD;EACA;EACA;EACA,gBAAgB,YAAY,WAAW,cACrC,KAAK,0BAA0B,YAAY,WAAW,SAAS;EACjE,YAAY;EACZ,gBAAgB,YAAY;GAC1B,MAAM,QAAQ,SAAS;GACvB,IAAI,OAAO,MAAM,KAAK,KAAK,oBAAoB,OAAO,CAAC;EACzD;EACA,mBAAmB;GACjB,KAAK,UAAU,YAAY,OAAO;GAClC,cAAc;EAChB;EACA,iBAAiB;GACf,KAAK,QAAQ,YAAY,OAAO;GAChC,YAAY;EACd;CACF,CAAC;CAEH,IAAI,CAAC,MAEH,OAAO;CAGT,OACE,oBAAC,gBAAD;EACE,OAAO;GACL;GACA,cAAc,KAAK,oBAAoB,MAAM,cAAc;GAC3D;GACA,kBAAkB,YAAY,KAAK,oBAAoB,OAAO;GAC9D;GACA;GACA,cAAc;GACd,WAAW,gBAAgB;IACzB,MAAM,QAAQ,KAAK,SAAS,WAAmC;IAC/D,OAAO;KACL,GAAG;KACH,cAAc,cAAc,MAAM,eAAe,UAAU;KAC3D,kBAAkB,cAChB,MAAM,mBACN,YACA,KAAK,mBAAmB,WAAmC,CAC7D;IACF;GACF;GACA,cAAc,UAAU,WAAW,OAAO,UAAU,EAAE,OAAO,CAAC;EAChE;EAEC,UAAA,cACC,OACA;GAAE;GAAQ;GAAW;EAAM,GAC3B;GACE;GACA,cAAc;GACd,KAAK,CAAC,cAAc,OAAO;GAC3B,OAAO;IAAC,EAAE,OAAO;KAAE,GAAG;KAAS,GAAG;IAAU,EAAE;IAAG;IAAW;GAAY;EAC1E,CACF;CACc,CAAA;AAEpB,CACF"}
1	+ {"version":3,"file":"time-slider-root.js","names":[],"sources":["../../../../src/ui/time-slider/time-slider-root.tsx"],"sourcesContent":["import { TimeSliderCore, TimeSliderDataAttrs } from '@videojs/core';\nimport { getTimeSliderCSSVars, logMissingFeature, selectBuffer, selectPlayback, selectTime } from '@videojs/core/dom';\nimport { translateText } from '@videojs/core/i18n';\nimport { formatTime } from '@videojs/utils/time';\nimport { forwardRef, useEffect, useState } from 'react';\n\nimport { useLocale, useTranslator } from '../../i18n/context';\nimport { usePlayer } from '../../player/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { useLatestRef } from '../../utils/use-latest-ref';\nimport { renderElement } from '../../utils/use-render';\nimport { useSlider } from '../hooks/use-slider';\nimport { SliderProvider } from '../slider/context';\n\nconst noopSeek = (): Promise<number> => Promise.resolve(0);\n\nexport interface TimeSliderRootProps extends UIComponentProps<'div', TimeSliderCore.State>, TimeSliderCore.Props {\n onDragStart?: (() => void) \| undefined;\n onDragEnd?: (() => void) \| undefined;\n}\n\nexport const TimeSliderRoot = forwardRef<HTMLDivElement, TimeSliderRootProps>(\n function TimeSliderRoot(componentProps, forwardedRef) {\n const {\n render,\n className,\n style,\n label,\n changeThrottle = TimeSliderCore.defaultProps.changeThrottle,\n step = TimeSliderCore.defaultProps.step,\n largeStep = TimeSliderCore.defaultProps.largeStep,\n orientation,\n disabled,\n thumbAlignment,\n onDragStart,\n onDragEnd,\n pauseOnDrag,\n ...elementProps\n } = componentProps;\n\n const time = usePlayer(selectTime);\n const buffer = usePlayer(selectBuffer);\n const playback = usePlayer(selectPlayback);\n const translator = useTranslator();\n const locale = useLocale();\n\n const [core] = useState(() => new TimeSliderCore());\n core.setProps({\n label,\n step,\n largeStep,\n orientation,\n disabled,\n thumbAlignment,\n pauseOnDrag,\n changeThrottle,\n });\n core.setFormatLocale(locale);\n\n // Keep a ref to the latest media state for callbacks that fire outside the render cycle.\n const mediaRef = useLatestRef(time && buffer ? { ...time, ...buffer } : null);\n const playbackRef = useLatestRef(playback);\n\n // Resume playback if the slider unmounts mid-drag — createSlider's destroy()\n // does not fire onDragEnd, so without this the player would stay paused.\n useEffect(() => {\n return () => core.endDrag(playbackRef.current);\n }, [core]);\n\n const duration = time?.duration ?? 0;\n\n const { state, input, cssVars, rootRef, thumbRef, rootProps, rootStyle, thumbProps } =\n useSlider<TimeSliderCore.State>({\n computeState: (input) => {\n core.setInput(input);\n if (!time \|\| !buffer) {\n core.setMedia({\n currentTime: 0,\n duration: 0,\n seeking: false,\n seek: noopSeek,\n buffered: [],\n seekable: [],\n });\n } else {\n core.setMedia({ ...time, ...buffer });\n }\n\n return core.getState();\n },\n getPercent: () => core.percentFromValue(time?.currentTime ?? 0),\n getStepPercent: () => core.getStepPercent(),\n getLargeStepPercent: () => core.getLargeStepPercent(),\n orientation,\n disabled,\n changeThrottle,\n adjustPercent: (rawPercent, thumbSize, trackSize) =>\n core.adjustPercentForAlignment(rawPercent, thumbSize, trackSize),\n getCSSVars: getTimeSliderCSSVars,\n onValueCommit: (percent) => {\n const media = mediaRef.current;\n if (media) media.seek(core.rawValueFromPercent(percent));\n },\n onDragStart: () => {\n core.startDrag(playbackRef.current);\n onDragStart?.();\n },\n onDragEnd: () => {\n core.endDrag(playbackRef.current);\n onDragEnd?.();\n },\n });\n\n if (!time) {\n if (__DEV__) logMissingFeature('TimeSlider', 'time');\n return null;\n }\n\n return (\n <SliderProvider\n value={{\n state,\n pointerValue: core.rawValueFromPercent(state.pointerPercent),\n input,\n getPointerValue: (percent) => core.rawValueFromPercent(percent),\n thumbRef,\n thumbProps,\n stateAttrMap: TimeSliderDataAttrs,\n getAttrs: (sliderState) => {\n const attrs = core.getAttrs(sliderState as TimeSliderCore.State);\n return {\n ...attrs,\n 'aria-label': translateText(attrs['aria-label'], translator),\n 'aria-valuetext': translateText(\n attrs['aria-valuetext'],\n translator,\n core.getValueTextParams(sliderState as TimeSliderCore.State)\n ),\n };\n },\n formatValue: (value) => formatTime(value, duration, { locale }),\n }}\n >\n {renderElement(\n 'div',\n { render, className, style },\n {\n state,\n stateAttrMap: TimeSliderDataAttrs,\n ref: [forwardedRef, rootRef],\n props: [{ style: { ...cssVars, ...rootStyle } }, rootProps, elementProps],\n }\n )}\n </SliderProvider>\n );\n }\n);\n\nexport namespace TimeSliderRoot {\n export type Props = TimeSliderRootProps;\n export type State = TimeSliderCore.State;\n}\n"],"mappings":";;;;;;;;;;;;;AAcA,MAAM,iBAAkC,QAAQ,QAAQ,CAAC;AAOzD,MAAa,iBAAiB,WAC5B,SAAS,eAAe,gBAAgB,cAAc;CACpD,MAAM,EACJ,QACA,WACA,OACA,OACA,iBAAiB,eAAe,aAAa,gBAC7C,OAAO,eAAe,aAAa,MACnC,YAAY,eAAe,aAAa,WACxC,aACA,UACA,gBACA,aACA,WACA,aACA,GAAG,iBACD;CAEJ,MAAM,OAAO,UAAU,UAAU;CACjC,MAAM,SAAS,UAAU,YAAY;CACrC,MAAM,WAAW,UAAU,cAAc;CACzC,MAAM,aAAa,cAAc;CACjC,MAAM,SAAS,UAAU;CAEzB,MAAM,CAAC,QAAQ,eAAe,IAAI,eAAe,CAAC;CAClD,KAAK,SAAS;EACZ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CACD,KAAK,gBAAgB,MAAM;CAG3B,MAAM,WAAW,aAAa,QAAQ,SAAS;EAAE,GAAG;EAAM,GAAG;CAAO,IAAI,IAAI;CAC5E,MAAM,cAAc,aAAa,QAAQ;CAIzC,gBAAgB;EACd,aAAa,KAAK,QAAQ,YAAY,OAAO;CAC/C,GAAG,CAAC,IAAI,CAAC;CAET,MAAM,WAAW,MAAM,YAAY;CAEnC,MAAM,EAAE,OAAO,OAAO,SAAS,SAAS,UAAU,WAAW,WAAW,eACtE,UAAgC;EAC9B,eAAe,UAAU;GACvB,KAAK,SAAS,KAAK;GACnB,IAAI,CAAC,QAAQ,CAAC,QACZ,KAAK,SAAS;IACZ,aAAa;IACb,UAAU;IACV,SAAS;IACT,MAAM;IACN,UAAU,CAAC;IACX,UAAU,CAAC;GACb,CAAC;QAED,KAAK,SAAS;IAAE,GAAG;IAAM,GAAG;GAAO,CAAC;GAGtC,OAAO,KAAK,SAAS;EACvB;EACA,kBAAkB,KAAK,iBAAiB,MAAM,eAAe,CAAC;EAC9D,sBAAsB,KAAK,eAAe;EAC1C,2BAA2B,KAAK,oBAAoB;EACpD;EACA;EACA;EACA,gBAAgB,YAAY,WAAW,cACrC,KAAK,0BAA0B,YAAY,WAAW,SAAS;EACjE,YAAY;EACZ,gBAAgB,YAAY;GAC1B,MAAM,QAAQ,SAAS;GACvB,IAAI,OAAO,MAAM,KAAK,KAAK,oBAAoB,OAAO,CAAC;EACzD;EACA,mBAAmB;GACjB,KAAK,UAAU,YAAY,OAAO;GAClC,cAAc;EAChB;EACA,iBAAiB;GACf,KAAK,QAAQ,YAAY,OAAO;GAChC,YAAY;EACd;CACF,CAAC;CAEH,IAAI,CAAC,MAEH,OAAO;CAGT,OACE,oBAAC,gBAAD;EACE,OAAO;GACL;GACA,cAAc,KAAK,oBAAoB,MAAM,cAAc;GAC3D;GACA,kBAAkB,YAAY,KAAK,oBAAoB,OAAO;GAC9D;GACA;GACA,cAAc;GACd,WAAW,gBAAgB;IACzB,MAAM,QAAQ,KAAK,SAAS,WAAmC;IAC/D,OAAO;KACL,GAAG;KACH,cAAc,cAAc,MAAM,eAAe,UAAU;KAC3D,kBAAkB,cAChB,MAAM,mBACN,YACA,KAAK,mBAAmB,WAAmC,CAC7D;IACF;GACF;GACA,cAAc,UAAU,WAAW,OAAO,UAAU,EAAE,OAAO,CAAC;EAChE;EAEC,UAAA,cACC,OACA;GAAE;GAAQ;GAAW;EAAM,GAC3B;GACE;GACA,cAAc;GACd,KAAK,CAAC,cAAc,OAAO;GAC3B,OAAO;IAAC,EAAE,OAAO;KAAE,GAAG;KAAS,GAAG;IAAU,EAAE;IAAG;IAAW;GAAY;EAC1E,CACF;CACc,CAAA;AAEpB,CACF"}

package/dist/default/ui/tooltip/context.js CHANGED Viewed

@@ -1,4 +1,3 @@
-"use client";
 import { createContext, useContext } from "react";
 //#region src/ui/tooltip/context.tsx
 const TooltipContext = createContext(null);

package/dist/default/ui/tooltip/context.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/tooltip/context.tsx"],"sourcesContent":["~~'use~~ ~~client';\n\nimport~~ type { StateAttrMap, TooltipCore } from '@videojs/core';\nimport type { MediaContainer, PositioningBoundary, TooltipApi } from '@videojs/core/dom';\nimport { createContext, useContext } from 'react';\n\nexport interface TooltipContent {\n label?: string \| undefined;\n shortcut?: string \| undefined;\n}\n\nexport interface TooltipContextValue {\n core: TooltipCore;\n tooltip: TooltipApi;\n state: TooltipCore.State;\n preferredSide: TooltipCore.State['side'];\n setPositionedSide: (side: TooltipCore.State['side']) => void;\n stateAttrMap: StateAttrMap<TooltipCore.State>;\n anchorName: string;\n popupId: string;\n content: TooltipContent \| undefined;\n setContent: (content: TooltipContent \| undefined) => void;\n boundary: PositioningBoundary;\n container: MediaContainer \| null;\n}\n\nconst TooltipContext = createContext<TooltipContextValue \| null>(null);\n\nexport const TooltipContextProvider = TooltipContext.Provider;\n\nexport function useTooltipContext(): TooltipContextValue {\n const ctx = useContext(TooltipContext);\n if (!ctx) throw new Error('Tooltip compound components must be used within a Tooltip.Root');\n return ctx;\n}\n\nexport function useOptionalTooltipContext(): TooltipContextValue \| null {\n return useContext(TooltipContext);\n}\n"],"mappings":"~~;;;AA0BA~~,MAAM,iBAAiB,cAA0C,IAAI;AAErE,MAAa,yBAAyB,eAAe;AAErD,SAAgB,oBAAyC;CACvD,MAAM,MAAM,WAAW,cAAc;CACrC,IAAI,CAAC,KAAK,MAAM,IAAI,MAAM,gEAAgE;CAC1F,OAAO;AACT;AAEA,SAAgB,4BAAwD;CACtE,OAAO,WAAW,cAAc;AAClC"}
1	+ {"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/tooltip/context.tsx"],"sourcesContent":["import type { StateAttrMap, TooltipCore } from '@videojs/core';\nimport type { MediaContainer, PositioningBoundary, TooltipApi } from '@videojs/core/dom';\nimport { createContext, useContext } from 'react';\n\nexport interface TooltipContent {\n label?: string \| undefined;\n shortcut?: string \| undefined;\n}\n\nexport interface TooltipContextValue {\n core: TooltipCore;\n tooltip: TooltipApi;\n state: TooltipCore.State;\n preferredSide: TooltipCore.State['side'];\n setPositionedSide: (side: TooltipCore.State['side']) => void;\n stateAttrMap: StateAttrMap<TooltipCore.State>;\n anchorName: string;\n popupId: string;\n content: TooltipContent \| undefined;\n setContent: (content: TooltipContent \| undefined) => void;\n boundary: PositioningBoundary;\n container: MediaContainer \| null;\n}\n\nconst TooltipContext = createContext<TooltipContextValue \| null>(null);\n\nexport const TooltipContextProvider = TooltipContext.Provider;\n\nexport function useTooltipContext(): TooltipContextValue {\n const ctx = useContext(TooltipContext);\n if (!ctx) throw new Error('Tooltip compound components must be used within a Tooltip.Root');\n return ctx;\n}\n\nexport function useOptionalTooltipContext(): TooltipContextValue \| null {\n return useContext(TooltipContext);\n}\n"],"mappings":";;AAwBA,MAAM,iBAAiB,cAA0C,IAAI;AAErE,MAAa,yBAAyB,eAAe;AAErD,SAAgB,oBAAyC;CACvD,MAAM,MAAM,WAAW,cAAc;CACrC,IAAI,CAAC,KAAK,MAAM,IAAI,MAAM,gEAAgE;CAC1F,OAAO;AACT;AAEA,SAAgB,4BAAwD;CACtE,OAAO,WAAW,cAAc;AAClC"}