@videojs/react 10.0.0-rc.1 → 10.0.0-rc.3

package/dist/dev/ui/slider/context.js

@@ -1,23 +1,62 @@
+import { c } from "react-compiler-runtime";
 import { createContext, useContext, useSyncExternalStore } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/ui/slider/context.tsx
 const SliderContext = createContext(null);
-function SliderProvider({ value, children }) {
-	return /* @__PURE__ */ jsx(SliderContext.Provider, {
-		value,
-		children
-	});
+function SliderProvider(t0) {
+	const $ = c(3);
+	const { value, children } = t0;
+	let t1;
+	if ($[0] !== children || $[1] !== value) {
+		t1 = /* @__PURE__ */ jsx(SliderContext.Provider, {
+			value,
+			children
+		});
+		$[0] = children;
+		$[1] = value;
+		$[2] = t1;
+	} else t1 = $[2];
+	return t1;
 }
 function useSliderContext() {
 	const ctx = useContext(SliderContext);
 	if (!ctx) throw new Error("Slider compound components must be used within a Slider.Root");
 	return ctx;
 }
-function useSliderPointerValue(enabled = true) {
+function useSliderPointerValue(t0) {
+	const $ = c(9);
+	const enabled = t0 === void 0 ? true : t0;
 	const context = useSliderContext();
-	const percent = useSyncExternalStore((onChange) => context.input?.subscribe(onChange) ?? (() => {}), () => enabled ? context.input?.current.pointerPercent ?? null : null, () => enabled ? context.input?.current.pointerPercent ?? null : null);
-	return percent === null ? context.pointerValue : context.getPointerValue?.(percent) ?? context.pointerValue;
+	let t1;
+	if ($[0] !== context.input) {
+		t1 = (onChange) => context.input?.subscribe(onChange) ?? _temp;
+		$[0] = context.input;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	let t3;
+	if ($[2] !== context.input?.current || $[3] !== enabled) {
+		t2 = () => enabled ? context.input?.current.pointerPercent ?? null : null;
+		t3 = () => enabled ? context.input?.current.pointerPercent ?? null : null;
+		$[2] = context.input?.current;
+		$[3] = enabled;
+		$[4] = t2;
+		$[5] = t3;
+	} else {
+		t2 = $[4];
+		t3 = $[5];
+	}
+	const percent = useSyncExternalStore(t1, t2, t3);
+	let t4;
+	if ($[6] !== context || $[7] !== percent) {
+		t4 = percent === null ? context.pointerValue : context.getPointerValue?.(percent) ?? context.pointerValue;
+		$[6] = context;
+		$[7] = percent;
+		$[8] = t4;
+	} else t4 = $[8];
+	return t4;
 }
+function _temp() {}
 //#endregion
 export { SliderProvider, useSliderContext, useSliderPointerValue };
 

package/dist/dev/ui/slider/context.js.map

@@ -1 +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\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\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;CAExF,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;CAEA,OAAO,YAAY,OAAO,QAAQ,eAAgB,QAAQ,kBAAkB,OAAO,KAAK,QAAQ;AAClG"}
+{"version":3,"file":"context.js","names":["{ value, children }: SliderProviderProps","<SliderContext.Provider value={value}>{children}</SliderContext.Provider>","SliderContext.Provider","enabled = true","(onChange) => context.input?.subscribe(onChange) ?? (() => {})","input","() => {}","() => (enabled ? (context.input?.current.pointerPercent ?? null) : null)","current","percent === null ? context.pointerValue : (context.getPointerValue?.(percent) ?? context.pointerValue)","context.pointerValue"],"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\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\n  return percent === null ? context.pointerValue : (context.getPointerValue?.(percent) ?? context.pointerValue);\n}\n"],"mappings":";;;;AAmBA,MAAM,gBAAgB,cAAyC,IAAI;AAInE,SAAgB,eAAA,IAAyD;;CAA1C,MAAA,EAAE,OAAO,aAATA;CACtBC,IAAAA;CAAuC,IAAA,EAAA,OAAA,YAAA,EAAA,OAAR,OAAA;EAA/B,KAAA,oBAACC,cAAAA,UAAD;GAA+B;GAAQ;EAAiC,CAAA;EAAjC,EAAA,KAAA;EAAR,EAAA,KAAA;;;CAAtC,OAAOD;AACT;AAEA,SAAgB,mBAAuC;CACrD,MAAM,MAAM,WAAW,aAAa;CACpC,IAAI,CAAC,KAAK,MAAM,IAAI,MAAM,8DAA8D;CAExF,OAAO;AACT;AAEA,SAAgB,sBAAA,IAA8C;;CAAxB,MAAA,UAAA,OAAA,KAAA,IAAU,OAAVE;CACpC,MAAM,UAAU,iBAAiB;CAE/BC,IAAAA;CAAsBC,IAAAA,EAAAA,OAAAA,QAAAA,OAAAA;EAAtB,MAAC,aAAa,QAAQ,OAAO,UAAU,QAAQ,KAAMC;EAA/BD,EAAAA,KAAAA,QAAAA;;;CACtBE,IAAAA;CACAA,IAAAA;CADiCC,IAAAA,EAAAA,OAAAA,QAAP,OAAO,WAAA,EAAA,OAA1B,SAAA;EAAP,WAAO,UAAW,QAAQ,OAAO,QAAQ,kBAAkB,OAAQ;EACnE,WAAO,UAAW,QAAQ,OAAO,QAAQ,kBAAkB,OAAQ;EADlCA,EAAAA,KAAAA,QAAP,OAAO;EAA1B,EAAA,KAAA;;;;;;;CAFT,MAAM,UAAU,qBACdJ,IACAG,IACAA,EACF;CAEOE,IAAAA;CAAmBC,IAAAA,EAAAA,OAAAA,WAAAA,EAAAA,OAAnB,SAAA;EAAY,KAAA,YAAA,OAAO,QAAQ,eAAgB,QAAQ,kBAAkB,OAAO,KAAK,QAAQ;EAAtEA,EAAAA,KAAAA;EAAnB,EAAA,KAAA;;;CAAP,OAAOD;AACT;AANyD,SAAA,QAAM,CAAC"}

package/dist/dev/ui/slider/fill.d.ts

@@ -0,0 +1,12 @@
+import { UIComponentProps } from "../../utils/types.js";
+import { SliderState } from "@videojs/core";
+//#region src/ui/slider/fill.d.ts
+interface SliderFillProps extends UIComponentProps<'div', SliderState> {}
+/** Displays the filled portion from start to the current value. */
+declare const SliderFill: import("react").ForwardRefExoticComponent<SliderFillProps>;
+declare namespace SliderFill {
+  type Props = SliderFillProps;
+}
+//#endregion
+export { SliderFill, SliderFillProps };
+//# sourceMappingURL=fill.d.ts.map

package/dist/dev/ui/slider/fill.js

@@ -0,0 +1,13 @@
+import { createContextPart } from "../create-context-part.js";
+import { useSliderContext } from "./context.js";
+//#region src/ui/slider/fill.tsx
+/** Displays the filled portion from start to the current value. */
+const SliderFill = createContextPart({
+	displayName: "SliderFill",
+	tag: "div",
+	useContext: useSliderContext
+});
+//#endregion
+export { SliderFill };
+
+//# sourceMappingURL=fill.js.map

package/dist/dev/ui/slider/fill.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fill.js","names":[],"sources":["../../../../src/ui/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/dev/ui/slider/index.parts.d.ts

@@ -1,14 +1,14 @@
-import { SliderBuffer, SliderBufferProps } from "./slider-buffer.js";
-import { SliderFill, SliderFillProps } from "./slider-fill.js";
-import { SliderPreview, SliderPreviewProps } from "./slider-preview.js";
-import { SliderRoot, SliderRootProps } from "./slider-root.js";
-import { SliderThumb, SliderThumbProps } from "./slider-thumb.js";
-import { SliderThumbnail, SliderThumbnailProps } from "./slider-thumbnail.js";
-import { SliderTrack, SliderTrackProps } from "./slider-track.js";
-import { SliderValue, SliderValueProps } from "./slider-value.js";
+import { SliderBuffer, SliderBufferProps } from "./buffer.js";
+import { SliderFill, SliderFillProps } from "./fill.js";
+import { SliderPreview, SliderPreviewProps } from "./preview.js";
+import { SliderRoot, SliderRootProps } from "./root.js";
+import { SliderThumb, SliderThumbProps } from "./thumb.js";
+import { index_parts_d_exports as index_parts_d_exports$1 } from "./thumbnail/index.parts.js";
+import { SliderTrack, SliderTrackProps } from "./track.js";
+import { SliderValue, SliderValueProps } from "./value.js";
 declare namespace index_parts_d_exports {
-  export { SliderBuffer as Buffer, SliderBufferProps as BufferProps, SliderFill as Fill, SliderFillProps as FillProps, SliderPreview as Preview, SliderPreviewProps as PreviewProps, SliderRoot as Root, SliderRootProps as RootProps, SliderThumb as Thumb, SliderThumbProps as ThumbProps, SliderThumbnail as Thumbnail, SliderThumbnailProps as ThumbnailProps, SliderTrack as Track, SliderTrackProps as TrackProps, SliderValue as Value, SliderValueProps as ValueProps };
+  export { SliderBuffer as Buffer, SliderBufferProps as BufferProps, SliderFill as Fill, SliderFillProps as FillProps, SliderPreview as Preview, SliderPreviewProps as PreviewProps, SliderRoot as Root, SliderRootProps as RootProps, SliderThumb as Thumb, SliderThumbProps as ThumbProps, index_parts_d_exports$1 as Thumbnail, SliderTrack as Track, SliderTrackProps as TrackProps, SliderValue as Value, SliderValueProps as ValueProps };
 }
 //#endregion
-export { SliderBuffer as Buffer, type SliderBufferProps as BufferProps, SliderFill as Fill, type SliderFillProps as FillProps, SliderPreview as Preview, type SliderPreviewProps as PreviewProps, SliderRoot as Root, type SliderRootProps as RootProps, SliderThumb as Thumb, type SliderThumbProps as ThumbProps, SliderThumbnail as Thumbnail, type SliderThumbnailProps as ThumbnailProps, SliderTrack as Track, type SliderTrackProps as TrackProps, SliderValue as Value, type SliderValueProps as ValueProps, index_parts_d_exports };
+export { SliderBuffer as Buffer, type SliderBufferProps as BufferProps, SliderFill as Fill, type SliderFillProps as FillProps, SliderPreview as Preview, type SliderPreviewProps as PreviewProps, SliderRoot as Root, type SliderRootProps as RootProps, SliderThumb as Thumb, type SliderThumbProps as ThumbProps, index_parts_d_exports$1 as Thumbnail, SliderTrack as Track, type SliderTrackProps as TrackProps, SliderValue as Value, type SliderValueProps as ValueProps, index_parts_d_exports };
 //# sourceMappingURL=index.parts.d.ts.map

package/dist/dev/ui/slider/index.parts.js

@@ -1,12 +1,12 @@
 import { __exportAll } from "../../_virtual/_rolldown/runtime.js";
-import { SliderBuffer } from "./slider-buffer.js";
-import { SliderFill } from "./slider-fill.js";
-import { SliderPreview } from "./slider-preview.js";
-import { SliderRoot } from "./slider-root.js";
-import { SliderThumb } from "./slider-thumb.js";
-import { SliderThumbnail } from "./slider-thumbnail.js";
-import { SliderTrack } from "./slider-track.js";
-import { SliderValue } from "./slider-value.js";
+import { SliderBuffer } from "./buffer.js";
+import { SliderFill } from "./fill.js";
+import { SliderPreview } from "./preview.js";
+import { SliderRoot } from "./root.js";
+import { SliderThumb } from "./thumb.js";
+import { index_parts_exports as index_parts_exports$1 } from "./thumbnail/index.parts.js";
+import { SliderTrack } from "./track.js";
+import { SliderValue } from "./value.js";
 //#region src/ui/slider/index.parts.ts
 var index_parts_exports = /* @__PURE__ */ __exportAll({
 	Buffer: () => SliderBuffer,
@@ -14,11 +14,11 @@ var index_parts_exports = /* @__PURE__ */ __exportAll({
 	Preview: () => SliderPreview,
 	Root: () => SliderRoot,
 	Thumb: () => SliderThumb,
-	Thumbnail: () => SliderThumbnail,
+	Thumbnail: () => index_parts_exports$1,
 	Track: () => SliderTrack,
 	Value: () => SliderValue
 });
 //#endregion
-export { SliderBuffer as Buffer, SliderFill as Fill, SliderPreview as Preview, SliderRoot as Root, SliderThumb as Thumb, SliderThumbnail as Thumbnail, SliderTrack as Track, SliderValue as Value, index_parts_exports };
+export { SliderBuffer as Buffer, SliderFill as Fill, SliderPreview as Preview, SliderRoot as Root, SliderThumb as Thumb, index_parts_exports$1 as Thumbnail, SliderTrack as Track, SliderValue as Value, index_parts_exports };
 
 //# sourceMappingURL=index.parts.js.map

package/dist/dev/ui/slider/index.parts.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../src/ui/slider/index.parts.ts"],"sourcesContent":["export { SliderBuffer as Buffer, type SliderBufferProps as BufferProps } from './slider-buffer';\nexport { SliderFill as Fill, type SliderFillProps as FillProps } from './slider-fill';\nexport { SliderPreview as Preview, type SliderPreviewProps as PreviewProps } from './slider-preview';\nexport { SliderRoot as Root, type SliderRootProps as RootProps } from './slider-root';\nexport { SliderThumb as Thumb, type SliderThumbProps as ThumbProps } from './slider-thumb';\nexport { SliderThumbnail as Thumbnail, type SliderThumbnailProps as ThumbnailProps } from './slider-thumbnail';\nexport { SliderTrack as Track, type SliderTrackProps as TrackProps } from './slider-track';\nexport { SliderValue as Value, type SliderValueProps as ValueProps } from './slider-value';\n"],"mappings":""}
+{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../src/ui/slider/index.parts.ts"],"sourcesContent":["export { SliderBuffer as Buffer, type SliderBufferProps as BufferProps } from './buffer';\nexport { SliderFill as Fill, type SliderFillProps as FillProps } from './fill';\nexport { SliderPreview as Preview, type SliderPreviewProps as PreviewProps } from './preview';\nexport { SliderRoot as Root, type SliderRootProps as RootProps } from './root';\nexport { SliderThumb as Thumb, type SliderThumbProps as ThumbProps } from './thumb';\nexport * as Thumbnail from './thumbnail/index.parts';\nexport { SliderTrack as Track, type SliderTrackProps as TrackProps } from './track';\nexport { SliderValue as Value, type SliderValueProps as ValueProps } from './value';\n"],"mappings":""}

package/dist/dev/ui/slider/preview.d.ts

@@ -0,0 +1,12 @@
+import { UIComponentProps } from "../../utils/types.js";
+import { SliderPreviewProps, SliderState } from "@videojs/core";
+//#region src/ui/slider/preview.d.ts
+interface SliderPreviewProps$1 extends SliderPreviewProps, UIComponentProps<'div', SliderState> {}
+/** Positioning container for preview content that tracks the pointer along the slider. */
+declare const SliderPreview: import("react").ForwardRefExoticComponent<Omit<SliderPreviewProps$1, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare namespace SliderPreview {
+  type Props = SliderPreviewProps$1;
+}
+//#endregion
+export { SliderPreview, SliderPreviewProps$1 as SliderPreviewProps };
+//# sourceMappingURL=preview.d.ts.map

package/dist/dev/ui/slider/preview.js

@@ -0,0 +1,36 @@
+import { renderElement } from "../../utils/use-render.js";
+import { useSliderContext } from "./context.js";
+import { getSliderPreviewStyle } from "@videojs/core/dom";
+import { forwardRef, useEffect, useRef, useState } from "react";
+import { observeResize } from "@videojs/utils/dom";
+//#region src/ui/slider/preview.tsx
+/** Positioning container for preview content that tracks the pointer along the slider. */
+const SliderPreview = forwardRef(function SliderPreview(componentProps, forwardedRef) {
+	const { render, className, style, overflow = "clamp", ...elementProps } = componentProps;
+	const context = useSliderContext();
+	const { state } = context;
+	const measureRef = useRef(null);
+	const [width, setWidth] = useState(0);
+	useEffect(() => {
+		const el = measureRef.current;
+		if (!el) return;
+		return observeResize(el, ([entry]) => {
+			setWidth(entry.contentRect.width);
+		});
+	}, []);
+	const positionStyle = getSliderPreviewStyle(width, overflow);
+	return renderElement("div", {
+		render,
+		className,
+		style
+	}, {
+		state,
+		stateAttrMap: context.stateAttrMap,
+		ref: [forwardedRef, measureRef],
+		props: [{ style: positionStyle }, elementProps]
+	});
+});
+//#endregion
+export { SliderPreview };
+
+//# sourceMappingURL=preview.js.map

package/dist/dev/ui/slider/preview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview.js","names":[],"sources":["../../../../src/ui/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/dev/ui/slider/root.d.ts

@@ -0,0 +1,17 @@
+import { UIComponentProps } from "../../utils/types.js";
+import { SliderCore } from "@videojs/core";
+//#region src/ui/slider/root.d.ts
+interface SliderRootProps extends UIComponentProps<'div', SliderCore.State>, SliderCore.Props {
+  onValueChange?: ((value: number) => void) | undefined;
+  onValueCommit?: ((value: number) => void) | undefined;
+  onDragStart?: (() => void) | undefined;
+  onDragEnd?: (() => void) | undefined;
+}
+declare const SliderRoot: import("react").ForwardRefExoticComponent<Omit<SliderRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare namespace SliderRoot {
+  type Props = SliderRootProps;
+  type State = SliderCore.State;
+}
+//#endregion
+export { SliderRoot, SliderRootProps };
+//# sourceMappingURL=root.d.ts.map

package/dist/dev/ui/slider/root.js

@@ -0,0 +1,191 @@
+import { useTranslator } from "../../i18n/context.js";
+import { renderElement } from "../../utils/use-render.js";
+import { useSlider } from "../hooks/use-slider.js";
+import { SliderProvider } from "./context.js";
+import { SliderCore, SliderDataAttrs } from "@videojs/core";
+import { getSliderCSSVars } from "@videojs/core/dom";
+import { translateText } from "@videojs/core/i18n";
+import { c } from "react-compiler-runtime";
+import { forwardRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/ui/slider/root.tsx
+const SliderRoot = forwardRef(function SliderRoot(componentProps, forwardedRef) {
+	const $ = c(47);
+	const { render, className, style, label, min, max, step, largeStep, orientation, disabled, thumbAlignment, value: t0, onValueChange, onValueCommit, onDragStart, onDragEnd, ...elementProps } = componentProps;
+	const value = t0 === void 0 ? 0 : t0;
+	const [core] = useState(_temp);
+	const translator = useTranslator();
+	core.setProps({
+		label,
+		min,
+		max,
+		step,
+		largeStep,
+		orientation,
+		disabled,
+		thumbAlignment
+	});
+	let t1;
+	let t2;
+	if ($[0] !== core || $[1] !== value) {
+		t1 = (input) => {
+			core.setInput(input);
+			return core.getSliderState(value);
+		};
+		t2 = () => core.percentFromValue(value);
+		$[0] = core;
+		$[1] = value;
+		$[2] = t1;
+		$[3] = t2;
+	} else {
+		t1 = $[2];
+		t2 = $[3];
+	}
+	let t3;
+	let t4;
+	if ($[4] !== core) {
+		t3 = () => core.getStepPercent();
+		t4 = () => core.getLargeStepPercent();
+		$[4] = core;
+		$[5] = t3;
+		$[6] = t4;
+	} else {
+		t3 = $[5];
+		t4 = $[6];
+	}
+	let t5;
+	if ($[7] !== core) {
+		t5 = (rawPercent, thumbSize, trackSize) => core.adjustPercentForAlignment(rawPercent, thumbSize, trackSize);
+		$[7] = core;
+		$[8] = t5;
+	} else t5 = $[8];
+	let t6;
+	if ($[9] !== core || $[10] !== onValueChange) {
+		t6 = (percent) => onValueChange?.(core.valueFromPercent(percent));
+		$[9] = core;
+		$[10] = onValueChange;
+		$[11] = t6;
+	} else t6 = $[11];
+	let t7;
+	if ($[12] !== core || $[13] !== onValueCommit) {
+		t7 = (percent_0) => onValueCommit?.(core.valueFromPercent(percent_0));
+		$[12] = core;
+		$[13] = onValueCommit;
+		$[14] = t7;
+	} else t7 = $[14];
+	let t8;
+	if ($[15] !== disabled || $[16] !== onDragEnd || $[17] !== onDragStart || $[18] !== orientation || $[19] !== t1 || $[20] !== t2 || $[21] !== t3 || $[22] !== t4 || $[23] !== t5 || $[24] !== t6 || $[25] !== t7) {
+		t8 = {
+			computeState: t1,
+			getPercent: t2,
+			getStepPercent: t3,
+			getLargeStepPercent: t4,
+			orientation,
+			disabled,
+			adjustPercent: t5,
+			getCSSVars: getSliderCSSVars,
+			onValueChange: t6,
+			onValueCommit: t7,
+			onDragStart,
+			onDragEnd
+		};
+		$[15] = disabled;
+		$[16] = onDragEnd;
+		$[17] = onDragStart;
+		$[18] = orientation;
+		$[19] = t1;
+		$[20] = t2;
+		$[21] = t3;
+		$[22] = t4;
+		$[23] = t5;
+		$[24] = t6;
+		$[25] = t7;
+		$[26] = t8;
+	} else t8 = $[26];
+	const { state, input: input_0, cssVars, rootRef, thumbRef: sliderThumbRef, rootProps, rootStyle, thumbProps } = useSlider(t8);
+	const T0 = SliderProvider;
+	let t9;
+	if ($[27] !== core || $[28] !== state.pointerPercent) {
+		t9 = core.valueFromPercent(state.pointerPercent);
+		$[27] = core;
+		$[28] = state.pointerPercent;
+		$[29] = t9;
+	} else t9 = $[29];
+	let t10;
+	if ($[30] !== core) {
+		t10 = (percent_1) => core.valueFromPercent(percent_1);
+		$[30] = core;
+		$[31] = t10;
+	} else t10 = $[31];
+	let t11;
+	if ($[32] !== core || $[33] !== translator) {
+		t11 = (sliderState) => {
+			const attrs = core.getAttrs(sliderState);
+			return {
+				...attrs,
+				"aria-label": translateText(attrs["aria-label"], translator)
+			};
+		};
+		$[32] = core;
+		$[33] = translator;
+		$[34] = t11;
+	} else t11 = $[34];
+	let t12;
+	if ($[35] !== input_0 || $[36] !== sliderThumbRef || $[37] !== state || $[38] !== t10 || $[39] !== t11 || $[40] !== t9 || $[41] !== thumbProps) {
+		t12 = {
+			state,
+			pointerValue: t9,
+			input: input_0,
+			getPointerValue: t10,
+			thumbRef: sliderThumbRef,
+			thumbProps,
+			stateAttrMap: SliderDataAttrs,
+			getAttrs: t11,
+			formatValue: void 0
+		};
+		$[35] = input_0;
+		$[36] = sliderThumbRef;
+		$[37] = state;
+		$[38] = t10;
+		$[39] = t11;
+		$[40] = t9;
+		$[41] = thumbProps;
+		$[42] = t12;
+	} else t12 = $[42];
+	const t13 = renderElement("div", {
+		render,
+		className,
+		style
+	}, {
+		state,
+		stateAttrMap: SliderDataAttrs,
+		ref: [forwardedRef, rootRef],
+		props: [
+			{ style: {
+				...cssVars,
+				...rootStyle
+			} },
+			rootProps,
+			elementProps
+		]
+	});
+	let t14;
+	if ($[43] !== T0 || $[44] !== t12 || $[45] !== t13) {
+		t14 = /* @__PURE__ */ jsx(T0, {
+			value: t12,
+			children: t13
+		});
+		$[43] = T0;
+		$[44] = t12;
+		$[45] = t13;
+		$[46] = t14;
+	} else t14 = $[46];
+	return t14;
+});
+function _temp() {
+	return new SliderCore();
+}
+//#endregion
+export { SliderRoot };
+
+//# sourceMappingURL=root.js.map

package/dist/dev/ui/slider/root.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"root.js","names":["value = 0","() => new SliderCore()","(input) => {\n      core.setInput(input);\n      return core.getSliderState(value);\n    }","() => core.percentFromValue(value)","() => core.getStepPercent()","() => core.getLargeStepPercent()","(rawPercent, thumbSize, trackSize) =>\n      core.adjustPercentForAlignment(rawPercent, thumbSize, trackSize)","(percent) => onValueChange?.(core.valueFromPercent(percent))","(percent) => onValueCommit?.(core.valueFromPercent(percent))","percent","{\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  }","core.valueFromPercent(state.pointerPercent)","pointerPercent","(percent) => core.valueFromPercent(percent)","(sliderState) => {\n          const attrs = core.getAttrs(sliderState);\n\n          return { ...attrs, 'aria-label': translateText(attrs['aria-label'], translator) };\n        }","{\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\n          return { ...attrs, 'aria-label': translateText(attrs['aria-label'], translator) };\n        },\n        formatValue: undefined,\n      }","input","<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\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>","SliderProvider","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      )"],"sources":["../../../../src/ui/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';\n\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\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\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":"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"}

package/dist/dev/ui/slider/thumb.d.ts

@@ -0,0 +1,12 @@
+import { UIComponentProps } from "../../utils/types.js";
+import { SliderState } from "@videojs/core";
+//#region src/ui/slider/thumb.d.ts
+interface SliderThumbProps extends UIComponentProps<'div', SliderState> {}
+/** Draggable handle for setting the slider value. Receives focus and handles keyboard interaction. */
+declare const SliderThumb: import("react").ForwardRefExoticComponent<Omit<SliderThumbProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare namespace SliderThumb {
+  type Props = SliderThumbProps;
+}
+//#endregion
+export { SliderThumb, SliderThumbProps };
+//# sourceMappingURL=thumb.d.ts.map

package/dist/dev/ui/slider/thumb.js

@@ -0,0 +1,29 @@
+import { renderElement } from "../../utils/use-render.js";
+import { useSliderContext } from "./context.js";
+import { forwardRef } from "react";
+//#region src/ui/slider/thumb.tsx
+/** Draggable handle for setting the slider value. Receives focus and handles keyboard interaction. */
+const SliderThumb = forwardRef(function SliderThumb(componentProps, forwardedRef) {
+	const { render, className, style, ...elementProps } = componentProps;
+	const context = useSliderContext();
+	const { state, thumbRef, thumbProps, getAttrs } = context;
+	const attrs = getAttrs(state);
+	return renderElement("div", {
+		render,
+		className,
+		style
+	}, {
+		state,
+		stateAttrMap: context.stateAttrMap,
+		ref: [forwardedRef, thumbRef],
+		props: [
+			attrs,
+			thumbProps,
+			elementProps
+		]
+	});
+});
+//#endregion
+export { SliderThumb };
+
+//# sourceMappingURL=thumb.js.map

package/dist/dev/ui/slider/thumb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"thumb.js","names":[],"sources":["../../../../src/ui/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/dev/ui/slider/thumbnail/index.parts.d.ts

@@ -0,0 +1,8 @@
+import { ThumbnailImage, ThumbnailImageProps } from "../../thumbnail/image.js";
+import { SliderThumbnailRoot, SliderThumbnailRootProps } from "./root.js";
+declare namespace index_parts_d_exports {
+  export { ThumbnailImage as Image, ThumbnailImageProps as ImageProps, SliderThumbnailRoot as Root, SliderThumbnailRootProps as RootProps };
+}
+//#endregion
+export { ThumbnailImage as Image, type ThumbnailImageProps as ImageProps, SliderThumbnailRoot as Root, type SliderThumbnailRootProps as RootProps, index_parts_d_exports };
+//# sourceMappingURL=index.parts.d.ts.map

package/dist/dev/ui/slider/thumbnail/index.parts.js

@@ -0,0 +1,12 @@
+import { __exportAll } from "../../../_virtual/_rolldown/runtime.js";
+import { ThumbnailImage } from "../../thumbnail/image.js";
+import { SliderThumbnailRoot } from "./root.js";
+//#region src/ui/slider/thumbnail/index.parts.ts
+var index_parts_exports = /* @__PURE__ */ __exportAll({
+	Image: () => ThumbnailImage,
+	Root: () => SliderThumbnailRoot
+});
+//#endregion
+export { ThumbnailImage as Image, SliderThumbnailRoot as Root, index_parts_exports };
+
+//# sourceMappingURL=index.parts.js.map

package/dist/dev/ui/slider/thumbnail/index.parts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../../src/ui/slider/thumbnail/index.parts.ts"],"sourcesContent":["export { ThumbnailImage as Image, type ThumbnailImageProps as ImageProps } from '../../thumbnail/image';\nexport { SliderThumbnailRoot as Root, type SliderThumbnailRootProps as RootProps } from './root';\n"],"mappings":""}

package/dist/dev/ui/slider/thumbnail/root.d.ts

@@ -0,0 +1,18 @@
+import { ThumbnailRootProps } from "../../thumbnail/root.js";
+import { ThumbnailCore } from "@videojs/core";
+//#region src/ui/slider/thumbnail/root.d.ts
+interface SliderThumbnailRootProps extends Omit<ThumbnailRootProps, 'time'> {}
+/**
+ * Resolves, sizes, and clips the thumbnail at the slider pointer.
+ *
+ * Render `Slider.Thumbnail.Image` inside it for the controlled image. Other children can provide loading indicators,
+ * overlays, or temporary presentation layers.
+ */
+declare const SliderThumbnailRoot: import("react").ForwardRefExoticComponent<Omit<SliderThumbnailRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare namespace SliderThumbnailRoot {
+  type Props = SliderThumbnailRootProps;
+  type State = ThumbnailCore.State;
+}
+//#endregion
+export { SliderThumbnailRoot, SliderThumbnailRootProps };
+//# sourceMappingURL=root.d.ts.map

package/dist/dev/ui/slider/thumbnail/root.js

@@ -0,0 +1,33 @@
+import { useSliderPointerValue } from "../context.js";
+import { ThumbnailRoot } from "../../thumbnail/root.js";
+import { c } from "react-compiler-runtime";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/ui/slider/thumbnail/root.tsx
+/**
+* Resolves, sizes, and clips the thumbnail at the slider pointer.
+*
+* Render `Slider.Thumbnail.Image` inside it for the controlled image. Other children can provide loading indicators,
+* overlays, or temporary presentation layers.
+*/
+const SliderThumbnailRoot = forwardRef(function SliderThumbnailRoot(componentProps, forwardedRef) {
+	const $ = c(4);
+	const pointerValue = useSliderPointerValue();
+	let t0;
+	if ($[0] !== componentProps || $[1] !== forwardedRef || $[2] !== pointerValue) {
+		t0 = /* @__PURE__ */ jsx(ThumbnailRoot, {
+			ref: forwardedRef,
+			...componentProps,
+			time: pointerValue
+		});
+		$[0] = componentProps;
+		$[1] = forwardedRef;
+		$[2] = pointerValue;
+		$[3] = t0;
+	} else t0 = $[3];
+	return t0;
+});
+//#endregion
+export { SliderThumbnailRoot };
+
+//# sourceMappingURL=root.js.map

package/dist/dev/ui/slider/thumbnail/root.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"root.js","names":["<Thumbnail.Root ref={forwardedRef} {...componentProps} time={pointerValue} />","Thumbnail.Root"],"sources":["../../../../../src/ui/slider/thumbnail/root.tsx"],"sourcesContent":["import type { ThumbnailCore } from '@videojs/core';\nimport { forwardRef, type ForwardedRef } from 'react';\n\nimport { Thumbnail } from '../../thumbnail';\nimport type { ThumbnailRootProps } from '../../thumbnail/root';\nimport { useSliderPointerValue } from '../context';\n\nexport interface SliderThumbnailRootProps extends Omit<ThumbnailRootProps, 'time'> {}\n\n/**\n * Resolves, sizes, and clips the thumbnail at the slider pointer.\n *\n * Render `Slider.Thumbnail.Image` inside it for the controlled image. Other children can provide loading indicators,\n * overlays, or temporary presentation layers.\n */\nexport const SliderThumbnailRoot = forwardRef(function SliderThumbnailRoot(\n  componentProps: SliderThumbnailRootProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const pointerValue = useSliderPointerValue();\n\n  return <Thumbnail.Root ref={forwardedRef} {...componentProps} time={pointerValue} />;\n});\n\nexport namespace SliderThumbnailRoot {\n  export type Props = SliderThumbnailRootProps;\n  export type State = ThumbnailCore.State;\n}\n"],"mappings":";;;;;;;;;;;;AAeA,MAAa,sBAAsB,WAAW,SAAS,oBACrD,gBACA,cACA;;CACA,MAAM,eAAe,sBAAsB;CAEpCA,IAAAA;CAAuC,IAAA,EAAA,OAAA,kBAAA,EAAA,OAAlB,gBAAA,EAAA,OAAwC,cAAA;EAA7D,KAAA,oBAACC,eAAD;GAAgB,KAAK;GAAc,GAAI;GAAgB,MAAM;EAAe,CAAA;EAArC,EAAA,KAAA;EAAlB,EAAA,KAAA;EAAwC,EAAA,KAAA;;;CAApE,OAAOD;AACT,CAAC"}

package/dist/dev/ui/slider/track.d.ts

@@ -0,0 +1,12 @@
+import { UIComponentProps } from "../../utils/types.js";
+import { SliderState } from "@videojs/core";
+//#region src/ui/slider/track.d.ts
+interface SliderTrackProps extends UIComponentProps<'div', SliderState> {}
+/** Contains the slider's visual track and interactive hit zone. */
+declare const SliderTrack: import("react").ForwardRefExoticComponent<SliderTrackProps>;
+declare namespace SliderTrack {
+  type Props = SliderTrackProps;
+}
+//#endregion
+export { SliderTrack, SliderTrackProps };
+//# sourceMappingURL=track.d.ts.map