@retoo/scena 0.0.2 → 0.1.0
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.
- package/README.md +1 -1
- package/dist/index.d.ts +33 -6
- package/dist/scena.cjs.js +7766 -6890
- package/dist/scena.css +4 -2
- package/dist/scena.css.map +1 -1
- package/dist/scena.es.js +7768 -6930
- package/dist/scena.min.cjs.js +4040 -1
- package/dist/scena.min.css +1 -1
- package/dist/scena.min.es.js +4041 -1
- package/dist/scena.min.umd.js +4044 -1
- package/dist/scena.umd.js +8070 -7194
- package/package.json +8 -8
package/README.md
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
[](https://use-retoo.github.io/scena/distribution/bundle-size)
|
|
5
5
|
[](./LICENSE.md)
|
|
6
6
|
|
|
7
|
-
Embeddable video widget for any website. Framework-agnostic, SSR-safe, ~
|
|
7
|
+
Embeddable video widget for any website. Framework-agnostic, SSR-safe, ~30KB gzipped.
|
|
8
8
|
|
|
9
9
|
**[Documentation](https://use-retoo.github.io/scena)**
|
|
10
10
|
|
package/dist/index.d.ts
CHANGED
|
@@ -294,6 +294,10 @@ interface ScenaCloseButtonComponentStyles {
|
|
|
294
294
|
button: ComponentStyles;
|
|
295
295
|
cross: ComponentStyles;
|
|
296
296
|
}
|
|
297
|
+
/** Custom HTML override for the close button. */
|
|
298
|
+
interface ScenaCloseButtonComponentHtml {
|
|
299
|
+
button: string;
|
|
300
|
+
}
|
|
297
301
|
/** Configuration props for the close button widget. */
|
|
298
302
|
interface ScenaCloseButtonProps {
|
|
299
303
|
id: string;
|
|
@@ -302,6 +306,7 @@ interface ScenaCloseButtonProps {
|
|
|
302
306
|
aria: Partial<ComponentAriaProps>;
|
|
303
307
|
customClasses: Partial<ScenaCloseButtonComponentClasses>;
|
|
304
308
|
customStyles: Partial<ScenaCloseButtonComponentStyles>;
|
|
309
|
+
customHtml: Partial<ScenaCloseButtonComponentHtml>;
|
|
305
310
|
onClick: (event: Event) => void;
|
|
306
311
|
}
|
|
307
312
|
/** DOM elements exposed by the close button component. */
|
|
@@ -330,6 +335,10 @@ interface ScenaCtaButtonComponentStyles {
|
|
|
330
335
|
root: ComponentStyles;
|
|
331
336
|
button: ComponentStyles;
|
|
332
337
|
}
|
|
338
|
+
/** Custom HTML override for the CTA button. */
|
|
339
|
+
interface ScenaCtaButtonComponentHtml {
|
|
340
|
+
button: string;
|
|
341
|
+
}
|
|
333
342
|
/** Adaptive display settings for the CTA button across screen sizes. */
|
|
334
343
|
interface ScenaCtaButtonAdaptive {
|
|
335
344
|
sizes: ComponentSize[];
|
|
@@ -345,6 +354,7 @@ interface ScenaCtaButtonProps {
|
|
|
345
354
|
aria: Partial<ComponentAriaProps>;
|
|
346
355
|
customClasses: Partial<ScenaCtaButtonComponentClasses>;
|
|
347
356
|
customStyles: Partial<ScenaCtaButtonComponentStyles>;
|
|
357
|
+
customHtml: Partial<ScenaCtaButtonComponentHtml>;
|
|
348
358
|
onClick: (event: Event) => void;
|
|
349
359
|
}
|
|
350
360
|
/** DOM elements exposed by the CTA button component. */
|
|
@@ -499,7 +509,7 @@ interface ScenaVideoSnippets {
|
|
|
499
509
|
/** Options for creating the video controller. */
|
|
500
510
|
interface UseVideoControllerOptions {
|
|
501
511
|
/** Getter that returns the underlying `<video>` DOM element. */
|
|
502
|
-
getVideoElement: () => HTMLVideoElement;
|
|
512
|
+
getVideoElement: () => HTMLVideoElement | null;
|
|
503
513
|
/** Event emitter to broadcast video lifecycle events. */
|
|
504
514
|
eventEmitter: ScenaEventEmitter;
|
|
505
515
|
}
|
|
@@ -508,7 +518,7 @@ type UseVideoControllerReturns = ScenaVideoData & ScenaVideoMethods & ScenaVideo
|
|
|
508
518
|
/** DOM elements exposed by the video widget. */
|
|
509
519
|
interface ScenaVideoElements {
|
|
510
520
|
root: HTMLDivElement | null;
|
|
511
|
-
video: HTMLVideoElement;
|
|
521
|
+
video: HTMLVideoElement | null;
|
|
512
522
|
}
|
|
513
523
|
/** Component ref for the video widget. */
|
|
514
524
|
interface ScenaVideoRef {
|
|
@@ -564,6 +574,11 @@ interface ScenaVideoControlsComponentStyles {
|
|
|
564
574
|
play: ComponentStyles;
|
|
565
575
|
pause: ComponentStyles;
|
|
566
576
|
}
|
|
577
|
+
/** Custom HTML overrides for the video play/pause controls. */
|
|
578
|
+
interface ScenaVideoControlsComponentHtml {
|
|
579
|
+
play: string;
|
|
580
|
+
pause: string;
|
|
581
|
+
}
|
|
567
582
|
/** Per-button ARIA overrides for video controls. */
|
|
568
583
|
interface ScenaVideoControlsComponentAria {
|
|
569
584
|
play: Partial<ComponentAriaProps>;
|
|
@@ -576,6 +591,7 @@ interface ScenaVideoControlsProps {
|
|
|
576
591
|
aria: Partial<ScenaVideoControlsComponentAria>;
|
|
577
592
|
customClasses: Partial<ScenaVideoControlsComponentClasses>;
|
|
578
593
|
customStyles: Partial<ScenaVideoControlsComponentStyles>;
|
|
594
|
+
customHtml: Partial<ScenaVideoControlsComponentHtml>;
|
|
579
595
|
}
|
|
580
596
|
/** DOM elements exposed by the video controls component. */
|
|
581
597
|
interface ScenaVideoControlsElements {
|
|
@@ -620,12 +636,17 @@ interface ScenaVideoLoaderComponentStyles {
|
|
|
620
636
|
root: ComponentStyles;
|
|
621
637
|
loader: ComponentStyles;
|
|
622
638
|
}
|
|
639
|
+
/** Custom HTML override for the video loader. */
|
|
640
|
+
interface ScenaVideoLoaderComponentHtml {
|
|
641
|
+
loader: string;
|
|
642
|
+
}
|
|
623
643
|
/** Configuration props for the video buffering/loading indicator. */
|
|
624
644
|
interface ScenaVideoLoaderProps {
|
|
625
645
|
id: string;
|
|
626
646
|
size: ComponentSize;
|
|
627
647
|
customClasses: Partial<ScenaVideoLoaderComponentClasses>;
|
|
628
648
|
customStyles: Partial<ScenaVideoLoaderComponentStyles>;
|
|
649
|
+
customHtml: Partial<ScenaVideoLoaderComponentHtml>;
|
|
629
650
|
}
|
|
630
651
|
/** DOM elements exposed by the video loader component. */
|
|
631
652
|
interface ScenaVideoLoaderElements {
|
|
@@ -737,8 +758,8 @@ interface UseProgressLineReturn {
|
|
|
737
758
|
/** Props accepted by the line progress hook. */
|
|
738
759
|
interface UseProgressLineProps {
|
|
739
760
|
getRootElement: () => HTMLElement;
|
|
740
|
-
getSize: () => ComponentSize;
|
|
741
761
|
getCustomThickness: () => ScenaProgressComponentThickness;
|
|
762
|
+
getSize: () => ComponentSize;
|
|
742
763
|
getProgress: () => number;
|
|
743
764
|
}
|
|
744
765
|
/** Seek event callbacks used internally by the line progress hook. */
|
|
@@ -749,9 +770,9 @@ interface UseProgressLineEvents {
|
|
|
749
770
|
}
|
|
750
771
|
/** Props accepted by the circle progress hook. */
|
|
751
772
|
interface UseProgressCircleProps {
|
|
752
|
-
getRootElement: () => SVGSVGElement;
|
|
753
|
-
getSize: () => ComponentSize;
|
|
773
|
+
getRootElement: () => SVGSVGElement | null;
|
|
754
774
|
getCustomThickness: () => ScenaProgressComponentThickness;
|
|
775
|
+
getSize: () => ComponentSize;
|
|
755
776
|
getProgress: () => number;
|
|
756
777
|
getBuffer: () => number;
|
|
757
778
|
}
|
|
@@ -859,6 +880,11 @@ interface ScenaVideoVolumeComponentStyles {
|
|
|
859
880
|
mute: ComponentStyles;
|
|
860
881
|
unmute: ComponentStyles;
|
|
861
882
|
}
|
|
883
|
+
/** Custom HTML overrides for the volume mute/unmute controls. */
|
|
884
|
+
interface ScenaVideoVolumeComponentHtml {
|
|
885
|
+
mute: string;
|
|
886
|
+
unmute: string;
|
|
887
|
+
}
|
|
862
888
|
/** Per-button ARIA overrides for volume controls. */
|
|
863
889
|
interface ScenaVideoVolumeComponentAria {
|
|
864
890
|
mute: Partial<ComponentAriaProps>;
|
|
@@ -872,6 +898,7 @@ interface ScenaVideoVolumeProps {
|
|
|
872
898
|
aria: Partial<ScenaVideoVolumeComponentAria>;
|
|
873
899
|
customClasses: Partial<ScenaVideoVolumeComponentClasses>;
|
|
874
900
|
customStyles: Partial<ScenaVideoVolumeComponentStyles>;
|
|
901
|
+
customHtml: Partial<ScenaVideoVolumeComponentHtml>;
|
|
875
902
|
}
|
|
876
903
|
/** DOM elements exposed by the volume control component. */
|
|
877
904
|
interface ScenaVideoVolumeElements {
|
|
@@ -1253,4 +1280,4 @@ declare const getScenaContext: () => ScenaContext;
|
|
|
1253
1280
|
declare const setScenaContext: (context: ScenaContext) => ScenaContext;
|
|
1254
1281
|
|
|
1255
1282
|
export { ComponentAriaHaspopup, ComponentAriaPressed, ComponentPlacement, ComponentPosition, ComponentShape, ComponentSize, OverrideLayer, ScenaButtonAriaHaspopup, ScenaButtonAriaPressed, ScenaButtonShape, ScenaButtonType, ScenaButtonVariant, ScenaCtaButtonPlacement, ScenaElement, ScenaEvent, ScenaVideoCrossOrigin, ScenaVideoPreload, ScenaVideoProgressVariant, ScenaVideoState, defineScenaElement, getScenaContext, getScenaElement, getScenaVideoContext, scenaProgressCircleThicknessMap, scenaProgressLineThicknessMap, setScenaContext, setScenaVideoContext, useEventEmitter, useProgressCircle, useProgressLine, useScena, useScenaConfig, useScenaOverrides, useScenaPreview, useScenaResponsive, useScenaVisibility, useVideoController };
|
|
1256
|
-
export type { ComponentAriaProps, ComponentClasses, ComponentRef, ComponentSnippet, ComponentSnippetReturn, ComponentStyles, ScenaApi, ScenaButtonComponentClasses, ScenaButtonComponentStyles, ScenaButtonElements, ScenaButtonEvents, ScenaButtonProps, ScenaButtonSnippets, ScenaCloseButtonComponentClasses, ScenaCloseButtonComponentStyles, ScenaCloseButtonElements, ScenaCloseButtonProps, ScenaCloseButtonRef, ScenaComponents, ScenaConfig, ScenaConfigFeatures, ScenaConfigOverrides, ScenaContainerCustomClasses, ScenaContainerCustomStyles, ScenaContainerElements, ScenaContainerProps, ScenaContainerRef, ScenaContainerSnippets, ScenaContext, ScenaCtaButtonAdaptive, ScenaCtaButtonComponentClasses, ScenaCtaButtonComponentStyles, ScenaCtaButtonElements, ScenaCtaButtonProps, ScenaCtaButtonRef, ScenaElementTag, ScenaEventEmitter, ScenaEventHandler, ScenaEventMap, ScenaFeatures, ScenaIconCustomClasses, ScenaIconCustomStyles, ScenaIconElements, ScenaIconProps, ScenaIconSnippets, ScenaInstance, ScenaLoaderCustomClasses, ScenaLoaderCustomStyles, ScenaLoaderElements, ScenaLoaderProps, ScenaOverrides, ScenaPreviewApi, ScenaPreviewConfig, ScenaProgressCircleComponentClasses, ScenaProgressCircleComponentStyles, ScenaProgressCircleElements, ScenaProgressCircleEvents, ScenaProgressCircleProps, ScenaProgressComponentThickness, ScenaProgressLineComponentClasses, ScenaProgressLineComponentStyles, ScenaProgressLineElements, ScenaProgressLineEvents, ScenaProgressLineProps, ScenaProgressThickness, ScenaProps, ScenaRef, ScenaResponsiveApi, ScenaResponsiveConfig, ScenaTarget, ScenaVideoCallbacks, ScenaVideoComponentClasses, ScenaVideoComponentStyles, ScenaVideoContainerCustomClasses, ScenaVideoContainerCustomStyles, ScenaVideoContainerElements, ScenaVideoContainerProps, ScenaVideoContainerRef, ScenaVideoContainerSnippets, ScenaVideoContext, ScenaVideoControlsComponentAria, ScenaVideoControlsComponentClasses, ScenaVideoControlsComponentStyles, ScenaVideoControlsElements, ScenaVideoControlsProps, ScenaVideoControlsRef, ScenaVideoData, ScenaVideoElements, ScenaVideoEventOptions, ScenaVideoEventOptionsWithError, ScenaVideoEventOptionsWithEvent, ScenaVideoLoaderComponentClasses, ScenaVideoLoaderComponentStyles, ScenaVideoLoaderElements, ScenaVideoLoaderProps, ScenaVideoLoaderRef, ScenaVideoMethods, ScenaVideoProgressComponentClasses, ScenaVideoProgressComponentStyles, ScenaVideoProgressComponentThickness, ScenaVideoProgressElements, ScenaVideoProgressProps, ScenaVideoProgressRef, ScenaVideoProgressThickness, ScenaVideoProgressThicknessMap, ScenaVideoProps, ScenaVideoRef, ScenaVideoSnippets, ScenaVideoVolumeComponentAria, ScenaVideoVolumeComponentClasses, ScenaVideoVolumeComponentStyles, ScenaVideoVolumeElements, ScenaVideoVolumeProps, ScenaVideoVolumeRef, ScenaVisibilityApi, ScenaVisibilityConfig, UseProgressCircleEvents, UseProgressCircleProps, UseProgressCircleReturn, UseProgressCircleReturnEvents, UseProgressLineEvents, UseProgressLineProps, UseProgressLineReturn, UseProgressLineReturnEvents, UseScenaConfigReturns, UseScenaOverridesReturns, UseScenaPreviewOptions, UseScenaPreviewReturns, UseScenaResponsiveReturns, UseScenaReturns, UseScenaVisibilityReturns, UseVideoControllerOptions, UseVideoControllerReturns };
|
|
1283
|
+
export type { ComponentAriaProps, ComponentClasses, ComponentRef, ComponentSnippet, ComponentSnippetReturn, ComponentStyles, ScenaApi, ScenaButtonComponentClasses, ScenaButtonComponentStyles, ScenaButtonElements, ScenaButtonEvents, ScenaButtonProps, ScenaButtonSnippets, ScenaCloseButtonComponentClasses, ScenaCloseButtonComponentHtml, ScenaCloseButtonComponentStyles, ScenaCloseButtonElements, ScenaCloseButtonProps, ScenaCloseButtonRef, ScenaComponents, ScenaConfig, ScenaConfigFeatures, ScenaConfigOverrides, ScenaContainerCustomClasses, ScenaContainerCustomStyles, ScenaContainerElements, ScenaContainerProps, ScenaContainerRef, ScenaContainerSnippets, ScenaContext, ScenaCtaButtonAdaptive, ScenaCtaButtonComponentClasses, ScenaCtaButtonComponentHtml, ScenaCtaButtonComponentStyles, ScenaCtaButtonElements, ScenaCtaButtonProps, ScenaCtaButtonRef, ScenaElementTag, ScenaEventEmitter, ScenaEventHandler, ScenaEventMap, ScenaFeatures, ScenaIconCustomClasses, ScenaIconCustomStyles, ScenaIconElements, ScenaIconProps, ScenaIconSnippets, ScenaInstance, ScenaLoaderCustomClasses, ScenaLoaderCustomStyles, ScenaLoaderElements, ScenaLoaderProps, ScenaOverrides, ScenaPreviewApi, ScenaPreviewConfig, ScenaProgressCircleComponentClasses, ScenaProgressCircleComponentStyles, ScenaProgressCircleElements, ScenaProgressCircleEvents, ScenaProgressCircleProps, ScenaProgressComponentThickness, ScenaProgressLineComponentClasses, ScenaProgressLineComponentStyles, ScenaProgressLineElements, ScenaProgressLineEvents, ScenaProgressLineProps, ScenaProgressThickness, ScenaProps, ScenaRef, ScenaResponsiveApi, ScenaResponsiveConfig, ScenaTarget, ScenaVideoCallbacks, ScenaVideoComponentClasses, ScenaVideoComponentStyles, ScenaVideoContainerCustomClasses, ScenaVideoContainerCustomStyles, ScenaVideoContainerElements, ScenaVideoContainerProps, ScenaVideoContainerRef, ScenaVideoContainerSnippets, ScenaVideoContext, ScenaVideoControlsComponentAria, ScenaVideoControlsComponentClasses, ScenaVideoControlsComponentHtml, ScenaVideoControlsComponentStyles, ScenaVideoControlsElements, ScenaVideoControlsProps, ScenaVideoControlsRef, ScenaVideoData, ScenaVideoElements, ScenaVideoEventOptions, ScenaVideoEventOptionsWithError, ScenaVideoEventOptionsWithEvent, ScenaVideoLoaderComponentClasses, ScenaVideoLoaderComponentHtml, ScenaVideoLoaderComponentStyles, ScenaVideoLoaderElements, ScenaVideoLoaderProps, ScenaVideoLoaderRef, ScenaVideoMethods, ScenaVideoProgressComponentClasses, ScenaVideoProgressComponentStyles, ScenaVideoProgressComponentThickness, ScenaVideoProgressElements, ScenaVideoProgressProps, ScenaVideoProgressRef, ScenaVideoProgressThickness, ScenaVideoProgressThicknessMap, ScenaVideoProps, ScenaVideoRef, ScenaVideoSnippets, ScenaVideoVolumeComponentAria, ScenaVideoVolumeComponentClasses, ScenaVideoVolumeComponentHtml, ScenaVideoVolumeComponentStyles, ScenaVideoVolumeElements, ScenaVideoVolumeProps, ScenaVideoVolumeRef, ScenaVisibilityApi, ScenaVisibilityConfig, UseProgressCircleEvents, UseProgressCircleProps, UseProgressCircleReturn, UseProgressCircleReturnEvents, UseProgressLineEvents, UseProgressLineProps, UseProgressLineReturn, UseProgressLineReturnEvents, UseScenaConfigReturns, UseScenaOverridesReturns, UseScenaPreviewOptions, UseScenaPreviewReturns, UseScenaResponsiveReturns, UseScenaReturns, UseScenaVisibilityReturns, UseVideoControllerOptions, UseVideoControllerReturns };
|