webs-sdk 0.19.64 → 0.19.65

package/dist/types/media-chrome-store-types.d.ts

@@ -0,0 +1,107 @@
+import type * as React from "react";
+export interface MediaState {
+    mediaPaused?: boolean;
+    mediaVolume?: number;
+    mediaMuted?: boolean;
+    mediaVolumeLevel?: "off" | "low" | "medium" | "high";
+    mediaCurrentTime?: number;
+    mediaSeekable?: [number, number] | null;
+    mediaBuffered?: [number, number][];
+    mediaLoading?: boolean;
+    mediaHasPlayed?: boolean;
+    mediaEnded?: boolean;
+    mediaIsFullscreen?: boolean;
+    mediaPlaybackRate?: number;
+    mediaError?: MediaError | null;
+    mediaSubtitlesList?: Array<{
+        kind: string;
+        label: string;
+        language: string;
+    }>;
+    mediaSubtitlesShowing?: Array<{
+        kind: string;
+        label: string;
+        language: string;
+    }>;
+    mediaVideoRenditionList?: Array<{
+        id?: string;
+        width?: number;
+        height?: number;
+        bitrate?: number;
+    }>;
+    mediaVideoRenditionSelected?: string;
+    mediaRenditionList?: Array<{
+        id?: string;
+        width?: number;
+        height?: number;
+        bitrate?: number;
+    }>;
+    mediaRenditionSelected?: string;
+    mediaChaptersCues?: Array<{
+        startTime: number;
+        endTime: number;
+        text: string;
+    }>;
+    mediaPreviewTime?: number;
+    mediaPreviewImage?: string;
+    mediaPreviewCoords?: [string, string, string, string] | null;
+    mediaDuration?: number;
+    mediaIsPip?: boolean;
+    mediaIsAirplaying?: boolean;
+    mediaDownloadUrl?: string;
+    mediaLoopOn?: boolean;
+    mediaAudioTrackList?: Array<{
+        id: string;
+        kind: string;
+        label: string;
+        language: string;
+        enabled: boolean;
+    }>;
+    mediaAudioTrackEnabled?: string;
+    mediaStreamType?: string;
+    mediaTimeIsLive?: boolean;
+}
+export declare const MediaActionTypes: {
+    readonly MEDIA_ELEMENT_CHANGE_REQUEST: "mediaelementchangerequest";
+    readonly FULLSCREEN_ELEMENT_CHANGE_REQUEST: "fullscreenelementchangerequest";
+    readonly MEDIA_PLAY_REQUEST: "mediaplayrequest";
+    readonly MEDIA_PAUSE_REQUEST: "mediapauserequest";
+    readonly MEDIA_MUTE_REQUEST: "mediamuterequest";
+    readonly MEDIA_UNMUTE_REQUEST: "mediaunmuterequest";
+    readonly MEDIA_LOOP_REQUEST: "medialooprequest";
+    readonly MEDIA_VOLUME_REQUEST: "mediavolumerequest";
+    readonly MEDIA_SEEK_REQUEST: "mediaseekrequest";
+    readonly MEDIA_AIRPLAY_REQUEST: "mediaairplayrequest";
+    readonly MEDIA_ENTER_FULLSCREEN_REQUEST: "mediaenterfullscreenrequest";
+    readonly MEDIA_EXIT_FULLSCREEN_REQUEST: "mediaexitfullscreenrequest";
+    readonly MEDIA_PREVIEW_REQUEST: "mediapreviewrequest";
+    readonly MEDIA_ENTER_PIP_REQUEST: "mediaenterpiprequest";
+    readonly MEDIA_EXIT_PIP_REQUEST: "mediaexitpiprequest";
+    readonly MEDIA_ENTER_CAST_REQUEST: "mediaentercastrequest";
+    readonly MEDIA_EXIT_CAST_REQUEST: "mediaexitcastrequest";
+    readonly MEDIA_SHOW_SUBTITLES_REQUEST: "mediashowsubtitlesrequest";
+    readonly MEDIA_DISABLE_SUBTITLES_REQUEST: "mediadisablesubtitlesrequest";
+    readonly MEDIA_TOGGLE_SUBTITLES_REQUEST: "mediatogglesubtitlesrequest";
+    readonly MEDIA_PLAYBACK_RATE_REQUEST: "mediaplaybackraterequest";
+    readonly MEDIA_RENDITION_REQUEST: "mediarenditionrequest";
+    readonly MEDIA_AUDIO_TRACK_REQUEST: "mediaaudiotrackrequest";
+    readonly MEDIA_SEEK_TO_LIVE_REQUEST: "mediaseektoliverequest";
+};
+export declare const MediaProvider: (props: {
+    children: React.ReactNode;
+    mediaStore?: unknown;
+}) => React.JSX.Element;
+export declare const timeUtils: {
+    formatTime: (time: number, duration: number) => string;
+    [key: string]: unknown;
+};
+export type DispatchFn = (action: {
+    type: string;
+    detail?: unknown;
+}) => void;
+export declare const useMediaDispatch: () => DispatchFn;
+export declare const useMediaRef: () => (mediaEl: HTMLVideoElement | HTMLAudioElement | null | undefined) => void;
+export declare const useMediaFullscreenRef: () => (el: HTMLElement | null | undefined) => void;
+export declare const useMediaSelector: <S = unknown>(selector: (state: Partial<MediaState>) => S, equalityFn?: (a: unknown, b: unknown) => boolean) => S;
+export declare const useMediaStore: () => unknown;
+//# sourceMappingURL=media-chrome-store-types.d.ts.map

package/dist/types/media-chrome-store-types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"media-chrome-store-types.d.ts","sourceRoot":"","sources":["../../src/types/media-chrome-store-types.ts"],"names":[],"mappings":"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"}

package/dist/types/media-chrome-store-types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=media-chrome-store-types.js.map

package/dist/types/media-chrome-store-types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"media-chrome-store-types.js","sourceRoot":"","sources":["../../src/types/media-chrome-store-types.ts"],"names":[],"mappings":""}

package/dist/utils/QRCode.d.ts

@@ -0,0 +1 @@
+//# sourceMappingURL=QRCode.d.ts.map

package/dist/utils/QRCode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"QRCode.d.ts","sourceRoot":"","sources":["../../src/utils/QRCode.ts"],"names":[],"mappings":""}

package/dist/utils/QRCode.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=QRCode.js.map

package/dist/utils/QRCode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"QRCode.js","sourceRoot":"","sources":["../../src/utils/QRCode.ts"],"names":[],"mappings":""}

package/dist/utils/imageValidation.d.ts

@@ -0,0 +1,6 @@
+export interface ImageValidationConfig {
+    decodeTimeout?: number;
+    verbose?: boolean;
+}
+export declare function isDecodableImageFile(file: File, config?: ImageValidationConfig): Promise<boolean>;
+//# sourceMappingURL=imageValidation.d.ts.map

package/dist/utils/imageValidation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"imageValidation.d.ts","sourceRoot":"","sources":["../../src/utils/imageValidation.ts"],"names":[],"mappings":"AAeA,MAAM,WAAW,qBAAqB;IAEpC,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAoBD,wBAAsB,oBAAoB,CACxC,IAAI,EAAE,IAAI,EACV,MAAM,GAAE,qBAA0B,GACjC,OAAO,CAAC,OAAO,CAAC,CAyDlB"}

package/dist/utils/imageValidation.js

@@ -0,0 +1,64 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isDecodableImageFile = isDecodableImageFile;
+const DEFAULT_CONFIG = {
+    decodeTimeout: 10000,
+    verbose: false,
+};
+async function isDecodableImageFile(file, config = {}) {
+    var _a;
+    const cfg = Object.assign(Object.assign({}, DEFAULT_CONFIG), config);
+    if (!file || !file.type.startsWith('image/')) {
+        if (cfg.verbose)
+            console.warn('[Image Validation] Rejected: not an image MIME type', file === null || file === void 0 ? void 0 : file.type);
+        return false;
+    }
+    if (typeof createImageBitmap === 'function') {
+        try {
+            const bitmap = await createImageBitmap(file);
+            (_a = bitmap.close) === null || _a === void 0 ? void 0 : _a.call(bitmap);
+            if (cfg.verbose)
+                console.log('[Image Validation] ✅ Decoded via createImageBitmap');
+            return true;
+        }
+        catch (error) {
+            if (cfg.verbose)
+                console.warn('[Image Validation] ❌ createImageBitmap failed to decode', error);
+            return false;
+        }
+    }
+    if (typeof document === 'undefined' || typeof URL === 'undefined') {
+        if (cfg.verbose)
+            console.warn('[Image Validation] No browser APIs available to decode image');
+        return false;
+    }
+    return new Promise((resolve) => {
+        const url = URL.createObjectURL(file);
+        const img = new Image();
+        const cleanup = () => {
+            clearTimeout(timeoutId);
+            URL.revokeObjectURL(url);
+        };
+        const timeoutId = setTimeout(() => {
+            cleanup();
+            img.src = '';
+            if (cfg.verbose)
+                console.warn('[Image Validation] ❌ Timed out decoding image');
+            resolve(false);
+        }, cfg.decodeTimeout);
+        img.onload = () => {
+            cleanup();
+            if (cfg.verbose)
+                console.log('[Image Validation] ✅ Decoded via <img> element');
+            resolve(true);
+        };
+        img.onerror = () => {
+            cleanup();
+            if (cfg.verbose)
+                console.warn('[Image Validation] ❌ <img> element failed to decode');
+            resolve(false);
+        };
+        img.src = url;
+    });
+}
+//# sourceMappingURL=imageValidation.js.map

package/dist/utils/imageValidation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"imageValidation.js","sourceRoot":"","sources":["../../src/utils/imageValidation.ts"],"names":[],"mappings":";;AAwCA,oDA4DC;AA9ED,MAAM,cAAc,GAAoC;IACtD,aAAa,EAAE,KAAK;IACpB,OAAO,EAAE,KAAK;CACf,CAAC;AAeK,KAAK,UAAU,oBAAoB,CACxC,IAAU,EACV,SAAgC,EAAE;;IAElC,MAAM,GAAG,mCAAQ,cAAc,GAAK,MAAM,CAAE,CAAC;IAE7C,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE,CAAC;QAC7C,IAAI,GAAG,CAAC,OAAO;YAAE,OAAO,CAAC,IAAI,CAAC,qDAAqD,EAAE,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,IAAI,CAAC,CAAC;QACjG,OAAO,KAAK,CAAC;IACf,CAAC;IAID,IAAI,OAAO,iBAAiB,KAAK,UAAU,EAAE,CAAC;QAC5C,IAAI,CAAC;YACH,MAAM,MAAM,GAAG,MAAM,iBAAiB,CAAC,IAAI,CAAC,CAAC;YAC7C,MAAA,MAAM,CAAC,KAAK,sDAAI,CAAC;YACjB,IAAI,GAAG,CAAC,OAAO;gBAAE,OAAO,CAAC,GAAG,CAAC,oDAAoD,CAAC,CAAC;YACnF,OAAO,IAAI,CAAC;QACd,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,IAAI,GAAG,CAAC,OAAO;gBAAE,OAAO,CAAC,IAAI,CAAC,yDAAyD,EAAE,KAAK,CAAC,CAAC;YAChG,OAAO,KAAK,CAAC;QACf,CAAC;IACH,CAAC;IAGD,IAAI,OAAO,QAAQ,KAAK,WAAW,IAAI,OAAO,GAAG,KAAK,WAAW,EAAE,CAAC;QAClE,IAAI,GAAG,CAAC,OAAO;YAAE,OAAO,CAAC,IAAI,CAAC,8DAA8D,CAAC,CAAC;QAC9F,OAAO,KAAK,CAAC;IACf,CAAC;IAED,OAAO,IAAI,OAAO,CAAU,CAAC,OAAO,EAAE,EAAE;QACtC,MAAM,GAAG,GAAG,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;QACtC,MAAM,GAAG,GAAG,IAAI,KAAK,EAAE,CAAC;QAExB,MAAM,OAAO,GAAG,GAAG,EAAE;YACnB,YAAY,CAAC,SAAS,CAAC,CAAC;YACxB,GAAG,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC;QAC3B,CAAC,CAAC;QAEF,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE;YAChC,OAAO,EAAE,CAAC;YACV,GAAG,CAAC,GAAG,GAAG,EAAE,CAAC;YACb,IAAI,GAAG,CAAC,OAAO;gBAAE,OAAO,CAAC,IAAI,CAAC,+CAA+C,CAAC,CAAC;YAC/E,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC,CAAC;QAEtB,GAAG,CAAC,MAAM,GAAG,GAAG,EAAE;YAChB,OAAO,EAAE,CAAC;YACV,IAAI,GAAG,CAAC,OAAO;gBAAE,OAAO,CAAC,GAAG,CAAC,gDAAgD,CAAC,CAAC;YAC/E,OAAO,CAAC,IAAI,CAAC,CAAC;QAChB,CAAC,CAAC;QACF,GAAG,CAAC,OAAO,GAAG,GAAG,EAAE;YACjB,OAAO,EAAE,CAAC;YACV,IAAI,GAAG,CAAC,OAAO;gBAAE,OAAO,CAAC,IAAI,CAAC,qDAAqD,CAAC,CAAC;YACrF,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC,CAAC;QAEF,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC;IAChB,CAAC,CAAC,CAAC;AACL,CAAC"}

package/docs/CONFIGURED_MEDIA_PLAYER.md

@@ -0,0 +1,40 @@
+# ConfiguredMediaPlayer
+
+`ConfiguredMediaPlayer` is the prop-driven layout for the new Radix-based Dice UI media player. The original `VideoPlayer` remains available. For custom layouts, use the composable `MediaPlayer*` exports from `webs-sdk/ui` instead.
+
+```tsx
+import { ConfiguredMediaPlayer } from 'webs-sdk/ui';
+
+<ConfiguredMediaPlayer
+  src="https://example.com/movie.m3u8"
+  poster="/movie-poster.jpg"
+  label="Movie trailer"
+  autoPlay={false}
+  preload="metadata"
+  sources={[
+    { lang: 'en', src: 'https://example.com/en.m3u8' },
+    { lang: 'es', src: 'https://example.com/es.m3u8' },
+  ]}
+  defaultLanguage="en"
+  onLanguageChange={(lang) => console.log(lang)}
+  tracks={[{ src: '/subtitles/en.vtt', srcLang: 'en', label: 'English', kind: 'subtitles' }]}
+  controls={{ seekButtons: true, pictureInPicture: true, captions: true, download: false }}
+  seekSeconds={10}
+  playbackSpeeds={[0.75, 1, 1.25, 1.5, 2]}
+  onEnded={() => console.log('Finished')}
+/>
+```
+
+## Props
+
+- `src`: required media URL; `.m3u8` video uses native HLS where available, otherwise dynamically loads `hls.js`.
+- `mediaType`: `"video"` (default) or `"audio"`.
+- `poster`, `autoPlay`, `preload`, `muted`, `loop`, `playsInline`: media element attributes.
+- `sources`, `defaultLanguage`, `onLanguageChange`: alternative URLs selected by language. The selector appears only for multiple sources.
+- `tracks`: subtitle/caption track definitions (`src`, `srcLang`, `label`, optional `kind` and `default`).
+- `controls`: optional per-control visibility flags. Defaults: play, seek, volume, time, settings, fullscreen, loading, error enabled; seek buttons, speed, captions, loop, picture-in-picture, download disabled. Set `settings: false, speed: true` to show the standalone speed picker.
+- `seekSeconds`, `playbackSpeeds`: seek-button interval and available playback rates.
+- `mediaProps`: additional attributes and event handlers for the underlying media element.
+- Root props (`className`, `style`, `autoHide`, `disabled`, `onPlay`, `onPause`, `onEnded`, `onTimeUpdate`, `onVolumeChange`, `onMuted`, `onMediaError`, etc.) are passed to `MediaPlayer`.
+
+Because the component uses Tailwind classes, consuming applications must include the installed SDK source in their Tailwind content scan. For Tailwind v4, add `@source "../../node_modules/webs-sdk/dist/components/ui";` in the application's CSS (adjust the path relative to that CSS file).