@kubit-ui-web/react-components 1.13.2 → 1.15.0

package/dist/cjs/components/validationStatus/types/validationStatus.d.ts

@@ -0,0 +1,27 @@
+import { ReactNode } from 'react';
+import { IElementOrIcon } from '../../../components/elementOrIcon';
+import { IText } from '../../../components/text';
+import { CustomTokenTypes, ROLES } from '../../../types';
+import { ValidationStatusState, ValidationStatusStylesProps } from './validationStatusTheme';
+export type ValidationStatusTextType = Omit<IText<string>, 'children'> & {
+    content: ReactNode;
+};
+export type ValidationStatusItemType = {
+    state: ValidationStatusState;
+    text: ValidationStatusTextType;
+    dataTestId?: string;
+    role?: string | ROLES;
+};
+export type ValidationStatusStateIconsType = {
+    [key in ValidationStatusState]: IElementOrIcon;
+};
+export interface IValidationStatusStandAlone {
+    styles: ValidationStatusStylesProps;
+    items: ValidationStatusItemType[];
+    stateIcons: ValidationStatusStateIconsType;
+    maxItemsAllowed?: number;
+    dataTestId?: string;
+}
+export interface IValidationStatus<V = undefined extends string ? unknown : string> extends Omit<IValidationStatusStandAlone, 'styles'>, Omit<CustomTokenTypes<ValidationStatusStylesProps>, 'cts' | 'extraCt'> {
+    variant: V;
+}

package/dist/cjs/components/validationStatus/types/validationStatusTheme.d.ts

@@ -0,0 +1,21 @@
+import { CommonStyleType, IconTypes, TypographyTypes } from '../../../types';
+export declare enum ValidationStatusState {
+    DEFAULT = "DEFAULT",
+    SUCCESS = "SUCCESS",
+    ERROR = "ERROR"
+}
+export type ValidationStatusCommonProps = {
+    container?: CommonStyleType;
+    row?: CommonStyleType;
+};
+export type ValidationStatusStateProps = {
+    icon?: IconTypes;
+    explainText?: TypographyTypes;
+};
+export type ValidationStatusStateKey = {
+    [state in ValidationStatusState]?: ValidationStatusStateProps;
+};
+export type ValidationStatusStylesProps = ValidationStatusCommonProps & ValidationStatusStateKey;
+export type ValidationStatusStylesType<V extends string | number | symbol> = {
+    [variant in V]: ValidationStatusStylesProps;
+};

package/dist/cjs/components/validationStatus/validationStatus.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { IValidationStatus } from './types';
+declare const ValidationStatusBoundary: <V extends string | unknown>(props: IValidationStatus<V>, ref: React.ForwardedRef<HTMLUListElement> | undefined | null) => JSX.Element;
+declare const ValidationStatus: <V extends string | unknown>(props: React.PropsWithChildren<IValidationStatus<V>> & {
+    ref?: React.ForwardedRef<HTMLDivElement> | undefined | null;
+}) => ReturnType<typeof ValidationStatusBoundary>;
+export { ValidationStatus };

package/dist/cjs/components/validationStatus/validationStatus.styled.d.ts

@@ -0,0 +1,7 @@
+import { ValidationStatusStylesProps } from './types';
+type ValidationStatusProps = {
+    styles: ValidationStatusStylesProps;
+};
+export declare const ValidationStatusFrame: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, ValidationStatusProps>> & string;
+export declare const ValidationStatusRow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, ValidationStatusProps>> & string;
+export {};

package/dist/cjs/components/validationStatus/validationStatusStandAlone.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { IValidationStatusStandAlone } from './types';
+export declare const ValidationStatusStandAlone: React.ForwardRefExoticComponent<IValidationStatusStandAlone & React.RefAttributes<HTMLUListElement>>;

package/dist/cjs/components/validationStatus/validationStatusStandAlone.js

@@ -31,9 +31,9 @@ const text_1 = require("../../components/text");
 const types_1 = require("./types");
 const validationStatus_styled_1 = require("./validationStatus.styled");
 const maxItems = 6;
-const ValidationStatusStandAloneComponent = ({ maxItemsAllowed = maxItems, ...props }, ref) => {
+const ValidationStatusStandAloneComponent = ({ maxItemsAllowed = maxItems, dataTestId = 'validation-status', ...props }, ref) => {
     const itemsLimited = props.items.length > maxItemsAllowed ? props.items.slice(0, maxItemsAllowed) : props.items;
-    return ((0, jsx_runtime_1.jsx)(validationStatus_styled_1.ValidationStatusFrame, { ref: ref, "data-testid": props.dataTestId, styles: props.styles, children: itemsLimited.map((item, index) => {
+    return ((0, jsx_runtime_1.jsx)(validationStatus_styled_1.ValidationStatusFrame, { ref: ref, "data-testid": dataTestId, styles: props.styles, children: itemsLimited.map((item, index) => {
             const checked = item.state === types_1.ValidationStatusState.SUCCESS;
             return ((0, jsx_runtime_1.jsxs)(validationStatus_styled_1.ValidationStatusRow, { "data-testid": item.dataTestId, role: item.role, styles: props.styles, children: [(0, jsx_runtime_1.jsx)(elementOrIcon_1.ElementOrIcon, { "aria-checked": checked, customIconStyles: props.styles[item.state]?.icon, ...props.stateIcons[item.state] }), (0, jsx_runtime_1.jsx)(text_1.Text, { customTypography: props.styles[item.state]?.explainText, ...item.text, children: item.text.content })] }, `${item.text.content}--${index}`));
         }) }));

package/dist/cjs/components/validationStatus/validationStatusStandAlone.js.map

@@ -1 +1 @@
-{"version":3,"file":"validationStatusStandAlone.js","sourceRoot":"","sources":["../../../../src/components/validationStatus/validationStatusStandAlone.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAE/B,8DAA2D;AAC3D,4CAAyC;AAEzC,mCAIiB;AACjB,uEAAuF;AAEvF,MAAM,QAAQ,GAAG,CAAC,CAAC;AAEnB,MAAM,mCAAmC,GAAG,CAC1C,EAAE,eAAe,GAAG,QAAQ,EAAE,GAAG,KAAK,EAA+B,EACrE,GAA4D,EAC/C,EAAE;IACf,MAAM,YAAY,GAChB,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,eAAe,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,eAAe,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC;IAE7F,OAAO,CACL,uBAAC,+CAAqB,IAAC,GAAG,EAAE,GAAG,iBAAe,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,YACjF,YAAY,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YAChC,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,KAAK,6BAAqB,CAAC,OAAO,CAAC;YAC7D,OAAO,CACL,wBAAC,6CAAmB,mBAEL,IAAI,CAAC,UAAU,EAC5B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,KAAK,CAAC,MAAM,aAEpB,uBAAC,6BAAa,oBACE,OAAO,EACrB,gBAAgB,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,IAAI,KAC5C,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GAChC,EACF,uBAAC,WAAI,IAAC,gBAAgB,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,WAAW,KAAM,IAAI,CAAC,IAAI,YACzE,IAAI,CAAC,IAAI,CAAC,OAAO,GACb,KAZF,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,KAAK,KAAK,EAAE,CAajB,CACvB,CAAC;QACJ,CAAC,CAAC,GACoB,CACzB,CAAC;AACJ,CAAC,CAAC;AAEW,QAAA,0BAA0B,GAAG,KAAK,CAAC,UAAU,CAAC,mCAAmC,CAAC,CAAC"}
+{"version":3,"file":"validationStatusStandAlone.js","sourceRoot":"","sources":["../../../../src/components/validationStatus/validationStatusStandAlone.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAE/B,8DAA2D;AAC3D,4CAAyC;AAEzC,mCAIiB;AACjB,uEAAuF;AAEvF,MAAM,QAAQ,GAAG,CAAC,CAAC;AAEnB,MAAM,mCAAmC,GAAG,CAC1C,EACE,eAAe,GAAG,QAAQ,EAC1B,UAAU,GAAG,mBAAmB,EAChC,GAAG,KAAK,EACoB,EAC9B,GAA4D,EAC/C,EAAE;IACf,MAAM,YAAY,GAChB,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,eAAe,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,eAAe,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC;IAE7F,OAAO,CACL,uBAAC,+CAAqB,IAAC,GAAG,EAAE,GAAG,iBAAe,UAAU,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,YAC3E,YAAY,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YAChC,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,KAAK,6BAAqB,CAAC,OAAO,CAAC;YAC7D,OAAO,CACL,wBAAC,6CAAmB,mBAEL,IAAI,CAAC,UAAU,EAC5B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,KAAK,CAAC,MAAM,aAEpB,uBAAC,6BAAa,oBACE,OAAO,EACrB,gBAAgB,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,IAAI,KAC5C,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GAChC,EACF,uBAAC,WAAI,IAAC,gBAAgB,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,WAAW,KAAM,IAAI,CAAC,IAAI,YACzE,IAAI,CAAC,IAAI,CAAC,OAAO,GACb,KAZF,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,KAAK,KAAK,EAAE,CAajB,CACvB,CAAC;QACJ,CAAC,CAAC,GACoB,CACzB,CAAC;AACJ,CAAC,CAAC;AAEW,QAAA,0BAA0B,GAAG,KAAK,CAAC,UAAU,CAAC,mCAAmC,CAAC,CAAC"}

package/dist/cjs/components/video/components/index.d.ts

@@ -0,0 +1,7 @@
+export * from './playStopButton';
+export * from './screenButtons';
+export * from './volume';
+export * from './time';
+export * from './subtitleFullScreenButtons';
+export * from './linkAndActionButton';
+export * from './videoSkeleton';

package/dist/cjs/components/video/components/linkAndActionButton.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { LinkTargetType } from '../../../components/link';
+import { GenericLinkType } from '../../../provider/genericComponents';
+import { LinkAndActionButtonAlignment, VideoButtonType } from '../types';
+import { VideoStyleType } from '../types/videoTheme';
+interface ILinkAndActionButton {
+    styles: VideoStyleType;
+    linkUrl?: string;
+    componentLink?: GenericLinkType;
+    linkText?: string;
+    linkTarget?: LinkTargetType;
+    actionButton?: VideoButtonType;
+    linkAndActionButtonAlignment?: LinkAndActionButtonAlignment;
+    onLinkClick?: React.MouseEventHandler<HTMLElement>;
+}
+export declare const LinkAndActionButton: ({ linkTarget, ...props }: ILinkAndActionButton) => JSX.Element | null;
+export {};

package/dist/cjs/components/video/components/linkAndActionButton.js

@@ -8,7 +8,7 @@ const text_1 = require("../../../components/text");
 const video_styled_1 = require("../video.styled");
 const LinkAndActionButton = ({ linkTarget = link_1.LinkTargetType.BLANK, ...props }) => {
     return props.linkText || props.actionButton ? ((0, jsx_runtime_1.jsxs)(video_styled_1.BottomContainerStyled, { linkAndActionButtonAlignment: props.linkAndActionButtonAlignment, styles: props.styles, children: [(props.styles.actionButton?.size || props.actionButton?.size) &&
-                (props.styles.actionButton?.variant || props.actionButton?.variant) && ((0, jsx_runtime_1.jsx)(button_1.Button, { size: props.styles.actionButton?.size, variant: props.styles.actionButton?.variant, ...props.actionButton, children: props.actionButton?.content })), props.linkUrl && ((0, jsx_runtime_1.jsx)(text_1.Text, { component: props.componentLink, customTypography: props.styles.link, decoration: text_1.TextDecorationType.UNDERLINE, target: linkTarget, url: props.linkUrl, onClick: props.onLinkClick, children: props.linkText }))] })) : null;
+                (props.styles.actionButton?.variant || props.actionButton?.variant) && ((0, jsx_runtime_1.jsx)(button_1.Button, { size: props.styles.actionButton?.size, variant: props.styles.actionButton?.variant, ...props.actionButton, children: props.actionButton?.content })), props.linkUrl && ((0, jsx_runtime_1.jsx)(video_styled_1.LinkContainerStyled, { styles: props.styles, children: (0, jsx_runtime_1.jsx)(text_1.Text, { component: props.componentLink, customTypography: props.styles.link, decoration: text_1.TextDecorationType.UNDERLINE, target: linkTarget, url: props.linkUrl, onClick: props.onLinkClick, children: props.linkText }) }))] })) : null;
 };
 exports.LinkAndActionButton = LinkAndActionButton;
 //# sourceMappingURL=linkAndActionButton.js.map

package/dist/cjs/components/video/components/linkAndActionButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"linkAndActionButton.js","sourceRoot":"","sources":["../../../../../src/components/video/components/linkAndActionButton.tsx"],"names":[],"mappings":";;;;AAEA,uDAAoD;AACpD,4CAAmD;AACnD,4CAA6D;AAK7D,kDAAwD;AAajD,MAAM,mBAAmB,GAAG,CAAC,EAClC,UAAU,GAAG,qBAAc,CAAC,KAAK,EACjC,GAAG,KAAK,EACa,EAAsB,EAAE;IAC7C,OAAO,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,CAC5C,wBAAC,oCAAqB,IACpB,4BAA4B,EAAE,KAAK,CAAC,4BAA4B,EAChE,MAAM,EAAE,KAAK,CAAC,MAAM,aAEnB,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,EAAE,IAAI,IAAI,KAAK,CAAC,YAAY,EAAE,IAAI,CAAC;gBAC5D,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,EAAE,OAAO,IAAI,KAAK,CAAC,YAAY,EAAE,OAAO,CAAC,IAAI,CACrE,uBAAC,eAAM,IACL,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,YAAY,EAAE,IAAI,EACrC,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,YAAY,EAAE,OAAO,KACvC,KAAK,CAAC,YAAY,YAErB,KAAK,CAAC,YAAY,EAAE,OAAO,GACrB,CACV,EACF,KAAK,CAAC,OAAO,IAAI,CAChB,uBAAC,WAAI,IACH,SAAS,EAAE,KAAK,CAAC,aAAa,EAC9B,gBAAgB,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,EACnC,UAAU,EAAE,yBAAkB,CAAC,SAAS,EACxC,MAAM,EAAE,UAAU,EAClB,GAAG,EAAE,KAAK,CAAC,OAAO,EAClB,OAAO,EAAE,KAAK,CAAC,WAAW,YAEzB,KAAK,CAAC,QAAQ,GACV,CACR,IACqB,CACzB,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC,CAAC;AAjCW,QAAA,mBAAmB,uBAiC9B"}
+{"version":3,"file":"linkAndActionButton.js","sourceRoot":"","sources":["../../../../../src/components/video/components/linkAndActionButton.tsx"],"names":[],"mappings":";;;;AAEA,uDAAoD;AACpD,4CAAmD;AACnD,4CAA6D;AAK7D,kDAA6E;AAatE,MAAM,mBAAmB,GAAG,CAAC,EAClC,UAAU,GAAG,qBAAc,CAAC,KAAK,EACjC,GAAG,KAAK,EACa,EAAsB,EAAE;IAC7C,OAAO,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,CAC5C,wBAAC,oCAAqB,IACpB,4BAA4B,EAAE,KAAK,CAAC,4BAA4B,EAChE,MAAM,EAAE,KAAK,CAAC,MAAM,aAEnB,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,EAAE,IAAI,IAAI,KAAK,CAAC,YAAY,EAAE,IAAI,CAAC;gBAC5D,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,EAAE,OAAO,IAAI,KAAK,CAAC,YAAY,EAAE,OAAO,CAAC,IAAI,CACrE,uBAAC,eAAM,IACL,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,YAAY,EAAE,IAAI,EACrC,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,YAAY,EAAE,OAAO,KACvC,KAAK,CAAC,YAAY,YAErB,KAAK,CAAC,YAAY,EAAE,OAAO,GACrB,CACV,EACF,KAAK,CAAC,OAAO,IAAI,CAChB,uBAAC,kCAAmB,IAAC,MAAM,EAAE,KAAK,CAAC,MAAM,YACvC,uBAAC,WAAI,IACH,SAAS,EAAE,KAAK,CAAC,aAAa,EAC9B,gBAAgB,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,EACnC,UAAU,EAAE,yBAAkB,CAAC,SAAS,EACxC,MAAM,EAAE,UAAU,EAClB,GAAG,EAAE,KAAK,CAAC,OAAO,EAClB,OAAO,EAAE,KAAK,CAAC,WAAW,YAEzB,KAAK,CAAC,QAAQ,GACV,GACa,CACvB,IACqB,CACzB,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC,CAAC;AAnCW,QAAA,mBAAmB,uBAmC9B"}

package/dist/cjs/components/video/components/playStopButton.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { IElementOrIcon } from '../../../components/elementOrIcon';
+import { VideoStyleType } from '../types/videoTheme';
+interface IPlayStopButton {
+    styles: VideoStyleType;
+    playing: boolean;
+    buttonsBarPlayIcon: IElementOrIcon;
+    buttonsBarPlayIconTooltip: JSX.Element | string;
+    buttonsBarPlayIconToTransition?: IElementOrIcon;
+    handlePlayStopVideo?: React.MouseEventHandler<HTMLButtonElement>;
+}
+export declare const PlayStopButton: (props: IPlayStopButton) => JSX.Element | null;
+export {};

package/dist/cjs/components/video/components/playStopButton.js

@@ -8,8 +8,8 @@ const hooks_1 = require("../../../hooks");
 const types_1 = require("../../../types");
 const PlayStopButton = (props) => {
     const device = (0, hooks_1.useMediaDevice)();
-    const ButtonBarPlay = () => props.styles.buttonsBarPlayIcon?.size?.[device] ? ((0, jsx_runtime_1.jsx)(mediaButton_1.MediaButton, { hasBackground: false, icon: props.buttonsBarPlayIcon, size: props.styles.buttonsBarPlayIcon?.size?.[device], twisted: props.playing, twistedIcon: props.buttonsBarPlayIconToTransition, variant: props.styles.buttonsBarPlayIcon?.variant, onClick: props.handlePlayStopVideo })) : null;
-    return device === types_1.DeviceBreakpointsType.DESKTOP ? ((0, jsx_runtime_1.jsx)(tooltipUnControlled_1.TooltipUnControlled, { childrenAsButton: false, content: { content: props.buttonsBarPlayIconTooltip }, tooltipAsModal: false, variant: props.styles.tooltip?.variant, children: (0, jsx_runtime_1.jsx)(ButtonBarPlay, {}) })) : ((0, jsx_runtime_1.jsx)(ButtonBarPlay, {}));
+    const ButtonBarPlay = props.styles.buttonsBarPlayIcon?.size?.[device] ? ((0, jsx_runtime_1.jsx)(mediaButton_1.MediaButton, { hasBackground: false, icon: props.buttonsBarPlayIcon, size: props.styles.buttonsBarPlayIcon?.size?.[device], twisted: props.playing, twistedIcon: props.buttonsBarPlayIconToTransition, variant: props.styles.buttonsBarPlayIcon?.variant, onClick: props.handlePlayStopVideo })) : null;
+    return device === types_1.DeviceBreakpointsType.DESKTOP ? ((0, jsx_runtime_1.jsx)(tooltipUnControlled_1.TooltipUnControlled, { childrenAsButton: false, content: { content: props.buttonsBarPlayIconTooltip }, tooltipAsModal: false, variant: props.styles.tooltip?.variant, children: ButtonBarPlay })) : (ButtonBarPlay);
 };
 exports.PlayStopButton = PlayStopButton;
 //# sourceMappingURL=playStopButton.js.map

package/dist/cjs/components/video/components/playStopButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"playStopButton.js","sourceRoot":"","sources":["../../../../../src/components/video/components/playStopButton.tsx"],"names":[],"mappings":";;;;AAGA,sEAAmE;AAEnE,kFAA0F;AAC1F,mCAAyC;AACzC,mCAAgD;AAazC,MAAM,cAAc,GAAG,CAAC,KAAsB,EAAe,EAAE;IACpE,MAAM,MAAM,GAAG,IAAA,sBAAc,GAAE,CAAC;IAChC,MAAM,aAAa,GAAG,GAAuB,EAAE,CAC7C,KAAK,CAAC,MAAM,CAAC,kBAAkB,EAAE,IAAI,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAChD,uBAAC,yBAAW,IACV,aAAa,EAAE,KAAK,EACpB,IAAI,EAAE,KAAK,CAAC,kBAAkB,EAC9B,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,kBAAkB,EAAE,IAAI,EAAE,CAAC,MAAM,CAAwB,EAC5E,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,WAAW,EAAE,KAAK,CAAC,8BAA8B,EACjD,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,kBAAkB,EAAE,OAAO,EACjD,OAAO,EAAE,KAAK,CAAC,mBAAmB,GAClC,CACH,CAAC,CAAC,CAAC,IAAI,CAAC;IACX,OAAO,MAAM,KAAK,6BAAqB,CAAC,OAAO,CAAC,CAAC,CAAC,CAChD,uBAAC,yCAAO,IACN,gBAAgB,EAAE,KAAK,EACvB,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,yBAAyB,EAAE,EACrD,cAAc,EAAE,KAAK,EACrB,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,OAAO,YAEtC,uBAAC,aAAa,KAAG,GACT,CACX,CAAC,CAAC,CAAC,CACF,uBAAC,aAAa,KAAG,CAClB,CAAC;AACJ,CAAC,CAAC;AA1BW,QAAA,cAAc,kBA0BzB"}
+{"version":3,"file":"playStopButton.js","sourceRoot":"","sources":["../../../../../src/components/video/components/playStopButton.tsx"],"names":[],"mappings":";;;;AAGA,sEAAmE;AAEnE,kFAA0F;AAC1F,mCAAyC;AACzC,mCAAgD;AAazC,MAAM,cAAc,GAAG,CAAC,KAAsB,EAAsB,EAAE;IAC3E,MAAM,MAAM,GAAG,IAAA,sBAAc,GAAE,CAAC;IAChC,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,kBAAkB,EAAE,IAAI,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CACtE,uBAAC,yBAAW,IACV,aAAa,EAAE,KAAK,EACpB,IAAI,EAAE,KAAK,CAAC,kBAAkB,EAC9B,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,kBAAkB,EAAE,IAAI,EAAE,CAAC,MAAM,CAAwB,EAC5E,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,WAAW,EAAE,KAAK,CAAC,8BAA8B,EACjD,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,kBAAkB,EAAE,OAAO,EACjD,OAAO,EAAE,KAAK,CAAC,mBAAmB,GAClC,CACH,CAAC,CAAC,CAAC,IAAI,CAAC;IACT,OAAO,MAAM,KAAK,6BAAqB,CAAC,OAAO,CAAC,CAAC,CAAC,CAChD,uBAAC,yCAAO,IACN,gBAAgB,EAAE,KAAK,EACvB,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,yBAAyB,EAAE,EACrD,cAAc,EAAE,KAAK,EACrB,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,OAAO,YAErC,aAAa,GACN,CACX,CAAC,CAAC,CAAC,CACF,aAAa,CACd,CAAC;AACJ,CAAC,CAAC;AAzBW,QAAA,cAAc,kBAyBzB"}

package/dist/cjs/components/video/components/screenButtons.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { IElementOrIcon } from '../../../components/elementOrIcon';
+import { VideoStyleType } from '../types/videoTheme';
+interface IScreenButtons {
+    styles: VideoStyleType;
+    playing: boolean;
+    loading: boolean;
+    screenPlayIcon: IElementOrIcon;
+    screenLoadingIcon: IElementOrIcon;
+    handlePlayStopVideo?: React.MouseEventHandler<HTMLButtonElement>;
+}
+export declare const ScreenButtons: (props: IScreenButtons) => JSX.Element;
+export {};

package/dist/cjs/components/video/components/subtitleFullScreenButtons.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { IElementOrIcon } from '../../../components/elementOrIcon/types/elementOrIcon';
+import { VideoStyleType } from '../types/videoTheme';
+interface IButtonBarSubtitles {
+    styles: VideoStyleType;
+    buttonsBarSubtitlesIcon: IElementOrIcon;
+    buttonsBarSubtitlesIconToTransition?: IElementOrIcon;
+    subtitlesActivated: boolean;
+    onSubtitlesClick?: React.MouseEventHandler<HTMLButtonElement>;
+}
+interface IButtonBarFullScreen {
+    styles: VideoStyleType;
+    buttonsBarFullScreenIcon: IElementOrIcon;
+    buttonsBarFullScreenIconToTransition?: IElementOrIcon;
+    fullScreen: boolean;
+    onFullScreenClick?: React.MouseEventHandler<HTMLButtonElement>;
+}
+interface ISubtitleFullScreenButtons extends IButtonBarSubtitles, IButtonBarFullScreen {
+    buttonsBarSubtitlesIconTooltip: JSX.Element | string;
+    buttonsBarFullScreenIconTooltip: JSX.Element | string;
+}
+export declare const SubtitleFullScreenButtons: (props: ISubtitleFullScreenButtons) => JSX.Element;
+export {};

package/dist/cjs/components/video/components/subtitleFullScreenButtons.js

@@ -8,9 +8,9 @@ const useMediaDevice_1 = require("../../../hooks/useMediaDevice/useMediaDevice")
 const types_1 = require("../../../types");
 const SubtitleFullScreenButtons = (props) => {
     const device = (0, useMediaDevice_1.useMediaDevice)();
-    const ButtonBarSubtitles = (props) => props.styles.buttonsBarSubtitlesIcon?.size?.[device] ? ((0, jsx_runtime_1.jsx)(mediaButton_1.MediaButton, { hasBackground: false, icon: props.buttonsBarSubtitlesIcon, size: props.styles.buttonsBarSubtitlesIcon?.size?.[device], twisted: props.subtitlesActivated, twistedIcon: props.buttonsBarSubtitlesIconToTransition, variant: props.styles.buttonsBarSubtitlesIcon?.variant, onClick: props.onSubtitlesClick })) : null;
-    const ButtonBarFullScreen = (props) => props.styles.buttonsBarFullScreenIcon?.size?.[device] ? ((0, jsx_runtime_1.jsx)(mediaButton_1.MediaButton, { hasBackground: false, icon: props.buttonsBarFullScreenIcon, size: props.styles.buttonsBarFullScreenIcon?.size?.[device], twisted: props.fullScreen, twistedIcon: props.buttonsBarFullScreenIconToTransition, variant: props.styles.buttonsBarFullScreenIcon?.variant, onClick: props.onFullScreenClick })) : null;
-    return device === types_1.DeviceBreakpointsType.DESKTOP ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(tooltipUnControlled_1.TooltipUnControlled, { childrenAsButton: false, content: { content: props.buttonsBarSubtitlesIconTooltip }, tooltipAsModal: false, variant: props.styles.tooltip?.variant, children: (0, jsx_runtime_1.jsx)(ButtonBarSubtitles, { ...props }) }), (0, jsx_runtime_1.jsx)(tooltipUnControlled_1.TooltipUnControlled, { childrenAsButton: false, content: { content: props.buttonsBarFullScreenIconTooltip }, tooltipAsModal: false, variant: props.styles.tooltip?.variant, children: (0, jsx_runtime_1.jsx)(ButtonBarFullScreen, { ...props }) })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(ButtonBarSubtitles, { ...props }), (0, jsx_runtime_1.jsx)(ButtonBarFullScreen, { ...props })] }));
+    const ButtonBarSubtitles = props.styles.buttonsBarSubtitlesIcon?.size?.[device] ? ((0, jsx_runtime_1.jsx)(mediaButton_1.MediaButton, { hasBackground: false, icon: props.buttonsBarSubtitlesIcon, size: props.styles.buttonsBarSubtitlesIcon?.size?.[device], twisted: props.subtitlesActivated, twistedIcon: props.buttonsBarSubtitlesIconToTransition, variant: props.styles.buttonsBarSubtitlesIcon?.variant, onClick: props.onSubtitlesClick })) : null;
+    const ButtonBarFullScreen = props.styles.buttonsBarFullScreenIcon?.size?.[device] ? ((0, jsx_runtime_1.jsx)(mediaButton_1.MediaButton, { hasBackground: false, icon: props.buttonsBarFullScreenIcon, size: props.styles.buttonsBarFullScreenIcon?.size?.[device], twisted: props.fullScreen, twistedIcon: props.buttonsBarFullScreenIconToTransition, variant: props.styles.buttonsBarFullScreenIcon?.variant, onClick: props.onFullScreenClick })) : null;
+    return device === types_1.DeviceBreakpointsType.DESKTOP ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(tooltipUnControlled_1.TooltipUnControlled, { childrenAsButton: false, content: { content: props.buttonsBarSubtitlesIconTooltip }, tooltipAsModal: false, variant: props.styles.tooltip?.variant, children: ButtonBarSubtitles }), (0, jsx_runtime_1.jsx)(tooltipUnControlled_1.TooltipUnControlled, { childrenAsButton: false, content: { content: props.buttonsBarFullScreenIconTooltip }, tooltipAsModal: false, variant: props.styles.tooltip?.variant, children: ButtonBarFullScreen })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [ButtonBarSubtitles, ButtonBarFullScreen] }));
 };
 exports.SubtitleFullScreenButtons = SubtitleFullScreenButtons;
 //# sourceMappingURL=subtitleFullScreenButtons.js.map

package/dist/cjs/components/video/components/subtitleFullScreenButtons.js.map

@@ -1 +1 @@
-{"version":3,"file":"subtitleFullScreenButtons.js","sourceRoot":"","sources":["../../../../../src/components/video/components/subtitleFullScreenButtons.tsx"],"names":[],"mappings":";;;;AAGA,sEAAmE;AAEnE,kFAA0F;AAC1F,0EAAuE;AACvE,mCAAgD;AAyBzC,MAAM,yBAAyB,GAAG,CAAC,KAAiC,EAAe,EAAE;IAC1F,MAAM,MAAM,GAAG,IAAA,+BAAc,GAAE,CAAC;IAEhC,MAAM,kBAAkB,GAAG,CAAC,KAA0B,EAAsB,EAAE,CAC5E,KAAK,CAAC,MAAM,CAAC,uBAAuB,EAAE,IAAI,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CACrD,uBAAC,yBAAW,IACV,aAAa,EAAE,KAAK,EACpB,IAAI,EAAE,KAAK,CAAC,uBAAuB,EACnC,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,uBAAuB,EAAE,IAAI,EAAE,CAAC,MAAM,CAAwB,EACjF,OAAO,EAAE,KAAK,CAAC,kBAAkB,EACjC,WAAW,EAAE,KAAK,CAAC,mCAAmC,EACtD,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,uBAAuB,EAAE,OAAO,EACtD,OAAO,EAAE,KAAK,CAAC,gBAAgB,GAC/B,CACH,CAAC,CAAC,CAAC,IAAI,CAAC;IAEX,MAAM,mBAAmB,GAAG,CAAC,KAA2B,EAAsB,EAAE,CAC9E,KAAK,CAAC,MAAM,CAAC,wBAAwB,EAAE,IAAI,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CACtD,uBAAC,yBAAW,IACV,aAAa,EAAE,KAAK,EACpB,IAAI,EAAE,KAAK,CAAC,wBAAwB,EACpC,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,wBAAwB,EAAE,IAAI,EAAE,CAAC,MAAM,CAAwB,EAClF,OAAO,EAAE,KAAK,CAAC,UAAU,EACzB,WAAW,EAAE,KAAK,CAAC,oCAAoC,EACvD,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,wBAAwB,EAAE,OAAO,EACvD,OAAO,EAAE,KAAK,CAAC,iBAAiB,GAChC,CACH,CAAC,CAAC,CAAC,IAAI,CAAC;IAEX,OAAO,MAAM,KAAK,6BAAqB,CAAC,OAAO,CAAC,CAAC,CAAC,CAChD,6DACE,uBAAC,yCAAO,IACN,gBAAgB,EAAE,KAAK,EACvB,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,8BAA8B,EAAE,EAC1D,cAAc,EAAE,KAAK,EACrB,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,OAAO,YAEtC,uBAAC,kBAAkB,OAAK,KAAK,GAAI,GACzB,EACV,uBAAC,yCAAO,IACN,gBAAgB,EAAE,KAAK,EACvB,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,+BAA+B,EAAE,EAC3D,cAAc,EAAE,KAAK,EACrB,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,OAAO,YAEtC,uBAAC,mBAAmB,OAAK,KAAK,GAAI,GAC1B,IACT,CACJ,CAAC,CAAC,CAAC,CACF,6DACE,uBAAC,kBAAkB,OAAK,KAAK,GAAI,EACjC,uBAAC,mBAAmB,OAAK,KAAK,GAAI,IACjC,CACJ,CAAC;AACJ,CAAC,CAAC;AAtDW,QAAA,yBAAyB,6BAsDpC"}
+{"version":3,"file":"subtitleFullScreenButtons.js","sourceRoot":"","sources":["../../../../../src/components/video/components/subtitleFullScreenButtons.tsx"],"names":[],"mappings":";;;;AAGA,sEAAmE;AAEnE,kFAA0F;AAC1F,0EAAuE;AACvE,mCAAgD;AAyBzC,MAAM,yBAAyB,GAAG,CAAC,KAAiC,EAAe,EAAE;IAC1F,MAAM,MAAM,GAAG,IAAA,+BAAc,GAAE,CAAC;IAEhC,MAAM,kBAAkB,GAAG,KAAK,CAAC,MAAM,CAAC,uBAAuB,EAAE,IAAI,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAChF,uBAAC,yBAAW,IACV,aAAa,EAAE,KAAK,EACpB,IAAI,EAAE,KAAK,CAAC,uBAAuB,EACnC,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,uBAAuB,EAAE,IAAI,EAAE,CAAC,MAAM,CAAwB,EACjF,OAAO,EAAE,KAAK,CAAC,kBAAkB,EACjC,WAAW,EAAE,KAAK,CAAC,mCAAmC,EACtD,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,uBAAuB,EAAE,OAAO,EACtD,OAAO,EAAE,KAAK,CAAC,gBAAgB,GAC/B,CACH,CAAC,CAAC,CAAC,IAAI,CAAC;IAET,MAAM,mBAAmB,GAAG,KAAK,CAAC,MAAM,CAAC,wBAAwB,EAAE,IAAI,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAClF,uBAAC,yBAAW,IACV,aAAa,EAAE,KAAK,EACpB,IAAI,EAAE,KAAK,CAAC,wBAAwB,EACpC,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,wBAAwB,EAAE,IAAI,EAAE,CAAC,MAAM,CAAwB,EAClF,OAAO,EAAE,KAAK,CAAC,UAAU,EACzB,WAAW,EAAE,KAAK,CAAC,oCAAoC,EACvD,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,wBAAwB,EAAE,OAAO,EACvD,OAAO,EAAE,KAAK,CAAC,iBAAiB,GAChC,CACH,CAAC,CAAC,CAAC,IAAI,CAAC;IAET,OAAO,MAAM,KAAK,6BAAqB,CAAC,OAAO,CAAC,CAAC,CAAC,CAChD,6DACE,uBAAC,yCAAO,IACN,gBAAgB,EAAE,KAAK,EACvB,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,8BAA8B,EAAE,EAC1D,cAAc,EAAE,KAAK,EACrB,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,OAAO,YAErC,kBAAkB,GACX,EACV,uBAAC,yCAAO,IACN,gBAAgB,EAAE,KAAK,EACvB,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,+BAA+B,EAAE,EAC3D,cAAc,EAAE,KAAK,EACrB,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,OAAO,YAErC,mBAAmB,GACZ,IACT,CACJ,CAAC,CAAC,CAAC,CACF,6DACG,kBAAkB,EAClB,mBAAmB,IACnB,CACJ,CAAC;AACJ,CAAC,CAAC;AApDW,QAAA,yBAAyB,6BAoDpC"}

package/dist/cjs/components/video/components/time.d.ts

@@ -0,0 +1,8 @@
+import { VideoStyleType } from '../types/videoTheme';
+interface ITime {
+    styles: VideoStyleType;
+    currentTime: number;
+    duration: number;
+}
+export declare const Time: (props: ITime) => JSX.Element;
+export {};

package/dist/cjs/components/video/components/videoSkeleton.d.ts

@@ -0,0 +1,8 @@
+import { VideoStyleType } from '../types/videoTheme';
+interface IVideoSkeleton {
+    styles: VideoStyleType;
+    skeletonText?: string;
+    dataTestIdVideoSkeleton?: string;
+}
+export declare const VideoSkeleton: (props: IVideoSkeleton) => JSX.Element;
+export {};

package/dist/cjs/components/video/components/volume.d.ts

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import { IElementOrIcon } from '../../../components/elementOrIcon';
+import { VideoStyleType } from '../types/videoTheme';
+interface IVolume {
+    styles: VideoStyleType;
+    buttonsBarVolumeIcon: IElementOrIcon;
+    buttonsBarVolumeIconTooltip: JSX.Element | string;
+    buttonsBarVolumeIconToTransition?: IElementOrIcon;
+    volume: string;
+    volumeBarAriaLabel?: string;
+    onVolumeButtonClick?: React.MouseEventHandler<HTMLButtonElement>;
+    onVolumeChange?: React.ChangeEventHandler<HTMLInputElement>;
+    dataTestIdVolumeInput?: string;
+}
+interface IButtonBarVolume {
+    styles: VideoStyleType;
+    buttonsBarVolumeIcon: IElementOrIcon;
+    buttonsBarVolumeIconToTransition?: IElementOrIcon;
+    volume: string;
+    volumeBarAriaLabel?: string;
+    onVolumeButtonClick?: React.MouseEventHandler<HTMLButtonElement>;
+}
+interface IVolumeInput {
+    styles: VideoStyleType;
+    volume: string;
+    volumeBarAriaLabel?: string;
+    dataTestIdVolumeInput?: string;
+    onVolumeChange?: React.ChangeEventHandler<HTMLInputElement>;
+}
+interface IVolume extends IButtonBarVolume, IVolumeInput {
+    buttonsBarVolumeIconTooltip: JSX.Element | string;
+}
+export declare const Volume: (props: IVolume) => JSX.Element;
+export {};

package/dist/cjs/components/video/index.d.ts

@@ -0,0 +1,4 @@
+export * from './types';
+export { VideoStandAlone } from './videoStandAlone';
+export { VideoControlled } from './videoControlled';
+export { VideoUnControlled as Video } from './videoUnControlled';

package/dist/cjs/components/video/types/index.d.ts

@@ -0,0 +1,2 @@
+export * from './video';
+export type { VideoStylesType, VideoStyleType, MediaButtonType, SkeletonType } from './videoTheme';

package/dist/cjs/components/video/types/video.d.ts

@@ -0,0 +1,96 @@
+import { IButton } from '../../../components/button';
+import { IElementOrIcon } from '../../../components/elementOrIcon';
+import { LinkTargetType } from '../../../components/link';
+import { GenericLinkType } from '../../../provider/genericComponents';
+import { CustomTokenTypes } from '../../../types';
+import { TrackKindType, VideoType } from '../../../types/video';
+import { VideoStyleType } from './videoTheme';
+export declare enum LinkAndActionButtonAlignment {
+    LEFT = "flex-start",
+    CENTER = "center",
+    RIGHT = "flex-end"
+}
+export type VideoButtonType = Omit<IButton, 'children' | 'variant' | 'size'> & {
+    content: string;
+    variant?: string;
+    size?: string;
+};
+export interface IVideoStandAlone {
+    videoSrc: string;
+    styles: VideoStyleType;
+    posterUrl?: string;
+    videoType: VideoType;
+    trackKind?: TrackKindType;
+    trackLabel?: string;
+    trackSrc?: string;
+    trackSrcLang?: string;
+    screenPlayIcon: IElementOrIcon;
+    screenLoadingIcon: IElementOrIcon;
+    showButtonsBar?: boolean;
+    buttonsBarPlayIcon: IElementOrIcon;
+    buttonsBarPlayIconTooltip: JSX.Element | string;
+    buttonsBarPlayIconToTransition: IElementOrIcon;
+    buttonsBarVolumeIcon: IElementOrIcon;
+    buttonsBarVolumeIconTooltip: JSX.Element | string;
+    buttonsBarVolumeIconToTransition?: IElementOrIcon;
+    volumeBarAriaLabel?: string;
+    buttonsBarSubtitlesIcon: IElementOrIcon;
+    buttonsBarSubtitlesIconTooltip: JSX.Element | string;
+    buttonsBarSubtitlesIconToTransition?: IElementOrIcon;
+    buttonsBarFullScreenIcon: IElementOrIcon;
+    buttonsBarFullScreenIconTooltip: JSX.Element | string;
+    buttonsBarFullScreenIconToTransition?: IElementOrIcon;
+    linkAndActionButtonAlignment?: LinkAndActionButtonAlignment;
+    videoRef: React.RefObject<HTMLVideoElement>;
+    videoContainerRef: React.RefObject<HTMLDivElement>;
+    fullScreen: boolean;
+    autoFullScreen?: boolean;
+    playing: boolean;
+    loading: boolean;
+    subtitlesActivated: boolean;
+    volume: string;
+    currentTime: number;
+    duration: number;
+    barAriaLabel?: string;
+    actionButton?: VideoButtonType;
+    linkText?: string;
+    linkUrl?: string;
+    linkTarget?: LinkTargetType;
+    componentLink: GenericLinkType;
+    hasSkeleton?: boolean;
+    skeletonText?: string;
+    showControls: boolean;
+    showScreenButtons?: boolean;
+    hasOverlay: boolean;
+    onLinkClick?: React.MouseEventHandler<HTMLElement>;
+    onFullScreenClick?: React.MouseEventHandler<HTMLButtonElement>;
+    onVolumeChange?: React.ChangeEventHandler<HTMLInputElement>;
+    onVolumeButtonClick?: React.MouseEventHandler<HTMLButtonElement>;
+    onSubtitlesClick?: React.MouseEventHandler<HTMLButtonElement>;
+    onTogglePlay?: React.MouseEventHandler<HTMLVideoElement> | React.MouseEventHandler<HTMLButtonElement>;
+    onCanPlay?: React.ReactEventHandler<HTMLVideoElement>;
+    onLoadedMetadata?: React.ReactEventHandler<HTMLVideoElement>;
+    onVideoPause?: React.ReactEventHandler<HTMLVideoElement>;
+    onVideoPlay?: React.ReactEventHandler<HTMLVideoElement>;
+    onTimeUpdate?: React.ReactEventHandler<HTMLVideoElement>;
+    onProgressBarChange?: (value: number) => void;
+    onProgressBarDragEnd?: () => void;
+    onProgressBarDragStart?: () => void;
+    dataTestIdParentContainer?: string;
+    dataTestIdOverlay?: string;
+    dataTestIdVideoSkeleton?: string;
+    dataTestIdVolumeInput?: string;
+}
+export interface IVideoControlled<V = undefined extends string ? unknown : string> extends Omit<IVideoStandAlone, 'styles' | 'formatTime' | 'componentLink'>, Omit<CustomTokenTypes<VideoStyleType>, 'cts' | 'extraCt'> {
+    variant: V;
+}
+type propsToOmit = 'styles' | 'videoRef' | 'videoContainerRef' | 'fullScreen' | 'playing' | 'showButtonsBar' | 'loading' | 'subtitlesActivated' | 'volume' | 'currentTime' | 'duration' | 'hasOverlay' | 'showControls' | 'showScreenButtons' | 'onTogglePlay' | 'onProgressBarChange' | 'onProgressBarDragStart' | 'onProgressBarDragEnd' | 'onVolumeButtonClick' | 'onSubtitlesClick' | 'onFullScreenClick';
+export interface IVideoUnControlled<V = undefined extends string ? unknown : string> extends Omit<IVideoControlled<V>, propsToOmit> {
+    hasInitialOverlay?: boolean;
+    timeToHideButtonsBar?: number;
+    onSubtitlesClick?: (event: React.MouseEvent<HTMLButtonElement>, activated: boolean) => void;
+    onFullScreenClick?: (event: React.MouseEvent<HTMLButtonElement>, activated: boolean) => void;
+    onVolumeButtonClick?: (event: React.MouseEvent<HTMLButtonElement>, valume: string) => void;
+    onTogglePlay?: (event: React.MouseEvent<HTMLVideoElement | HTMLButtonElement, MouseEvent>, playing: boolean) => void;
+}
+export {};

package/dist/cjs/components/video/types/videoTheme.d.ts

@@ -0,0 +1,58 @@
+import { MediaButtonSizeType } from '../../../components/mediaButton/types/sizes';
+import { DeviceBreakpointsType } from '../../../types';
+import { CommonStyleType, TypographyTypes } from '../../../types/styles';
+export type MediaButtonType = {
+    variant?: string;
+    color?: string;
+    backgroundColor?: string;
+    size?: {
+        [key in DeviceBreakpointsType]?: MediaButtonSizeType;
+    };
+};
+export type SkeletonType = {
+    width?: string;
+    height?: string;
+    variant?: string;
+    shapeVariant?: string;
+};
+export type VideoStyleType = {
+    progressBarVariant?: string;
+    progressBarSize?: string;
+    container?: CommonStyleType;
+    videoContainer?: CommonStyleType;
+    videoElement?: CommonStyleType;
+    subtitles?: CommonStyleType & TypographyTypes & {
+        padding_bottom?: string;
+        additionalPaddingForSubtitles?: string;
+    };
+    screenIconContainer?: CommonStyleType;
+    controlsContainer?: CommonStyleType;
+    buttonsContainer?: CommonStyleType;
+    screenPlayLoadingIcon?: MediaButtonType;
+    buttonsBarPlayIcon?: MediaButtonType;
+    buttonsBarVolumeIcon?: MediaButtonType;
+    volumeBar?: CommonStyleType;
+    videoDuration?: TypographyTypes;
+    buttonsBarSubtitlesIcon?: MediaButtonType;
+    buttonsBarFullScreenIcon?: MediaButtonType;
+    buttonsBarFirstSubcontainer?: CommonStyleType;
+    buttonsBarSecondSubcontainer?: CommonStyleType;
+    bottomContainer?: CommonStyleType;
+    linkContainer?: CommonStyleType;
+    link?: TypographyTypes;
+    actionButton?: {
+        size?: string;
+        variant?: string;
+    };
+    videoSkeletonContainer?: CommonStyleType;
+    videoSkeleton?: SkeletonType;
+    buttonsSkeletonContainer?: CommonStyleType;
+    buttonSkeleton?: SkeletonType;
+    overlay?: CommonStyleType;
+    tooltip?: {
+        variant?: string;
+    };
+};
+export type VideoStylesType<P extends string | number | symbol> = {
+    [key in P]: VideoStyleType;
+};

package/dist/cjs/components/video/video.styled.d.ts

@@ -0,0 +1,27 @@
+import { LinkAndActionButtonAlignment, VideoStyleType } from './types';
+type VideoPropsStyleType = {
+    styles: VideoStyleType;
+};
+export declare const ContainerStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, VideoPropsStyleType>> & string;
+export declare const VideoContainerStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, VideoPropsStyleType>> & string;
+export declare const VideoElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, VideoPropsStyleType & {
+    paddingBottomSubtitles: string;
+} & {
+    isFullScreen: boolean;
+}>> & string;
+export declare const ScreenIconContainerStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, VideoPropsStyleType>> & string;
+export declare const ControlsContainerStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, VideoPropsStyleType & {
+    showControls: boolean;
+}>> & string;
+export declare const ButtonsContainerStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, VideoPropsStyleType>> & string;
+export declare const VolumeContainerStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, VideoPropsStyleType>> & string;
+export declare const ButtonsBarFirstSubcontainerStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, VideoPropsStyleType>> & string;
+export declare const ButtonsBarSecondSubontainerStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, VideoPropsStyleType>> & string;
+export declare const BottomContainerStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, VideoPropsStyleType & {
+    linkAndActionButtonAlignment?: LinkAndActionButtonAlignment;
+}>> & string;
+export declare const LinkContainerStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, VideoPropsStyleType>> & string;
+export declare const VideoSkeletonContainerStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, VideoPropsStyleType>> & string;
+export declare const ButtonsSkeletonContainerStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, VideoPropsStyleType>> & string;
+export declare const OverlayStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, VideoPropsStyleType>> & string;
+export {};

package/dist/cjs/components/video/video.styled.js

@@ -23,7 +23,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.OverlayStyled = exports.ButtonsSkeletonContainerStyled = exports.VideoSkeletonContainerStyled = exports.BottomContainerStyled = exports.ButtonsBarSecondSubontainerStyled = exports.ButtonsBarFirstSubcontainerStyled = exports.VolumeContainerStyled = exports.ButtonsContainerStyled = exports.ControlsContainerStyled = exports.ScreenIconContainerStyled = exports.VideoElement = exports.VideoContainerStyled = exports.ContainerStyled = void 0;
+exports.OverlayStyled = exports.ButtonsSkeletonContainerStyled = exports.VideoSkeletonContainerStyled = exports.LinkContainerStyled = exports.BottomContainerStyled = exports.ButtonsBarSecondSubontainerStyled = exports.ButtonsBarFirstSubcontainerStyled = exports.VolumeContainerStyled = exports.ButtonsContainerStyled = exports.ControlsContainerStyled = exports.ScreenIconContainerStyled = exports.VideoElement = exports.VideoContainerStyled = exports.ContainerStyled = void 0;
 const styled_components_1 = __importStar(require("styled-components"));
 const getStyles_1 = require("../../utils/getStyles/getStyles");
 exports.ContainerStyled = styled_components_1.default.div `
@@ -143,6 +143,11 @@ exports.BottomContainerStyled = styled_components_1.default.div `
   width: 100%;
   ${({ styles }) => (0, getStyles_1.getStyles)(styles?.bottomContainer)}
 `;
+exports.LinkContainerStyled = styled_components_1.default.div `
+  > * {
+    ${({ styles }) => (0, getStyles_1.getStyles)(styles?.linkContainer)}
+  }
+`;
 exports.VideoSkeletonContainerStyled = styled_components_1.default.div `
   ${({ styles }) => (0, getStyles_1.getStyles)(styles?.videoSkeletonContainer)}
 `;

package/dist/cjs/components/video/video.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"video.styled.js","sourceRoot":"","sources":["../../../../src/components/video/video.styled.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"video.styled.js","sourceRoot":"","sources":["../../../../src/components/video/video.styled.ts"],"names":[],"mappings":"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"}

package/dist/cjs/components/video/videoControlled.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { IVideoControlled } from './types/video';
+declare const VideoBoundary: <V extends string | unknown>(props: IVideoControlled<V>, ref: React.ForwardedRef<HTMLDivElement> | undefined | null) => JSX.Element;
+declare const VideoControlled: <V>(props: React.PropsWithChildren<IVideoControlled<V>> & {
+    ref?: React.ForwardedRef<HTMLDivElement> | undefined | null;
+}) => ReturnType<typeof VideoBoundary>;
+export { VideoControlled };

package/dist/cjs/components/video/videoStandAlone.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { IVideoStandAlone } from './types';
+export declare const VideoStandAlone: React.ForwardRefExoticComponent<IVideoStandAlone & React.RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/video/videoStandAlone.js

@@ -31,7 +31,7 @@ const progressBar_1 = require("../progressBar");
 const components_1 = require("./components");
 const video_styled_1 = require("./video.styled");
 const VIDEO_BASE_ID = 'video';
-const VideoStandAloneComponent = (props, ref) => {
+const VideoStandAloneComponent = ({ dataTestIdOverlay = 'overlay', dataTestIdParentContainer = 'video', dataTestIdVideoSkeleton = 'skeleton', dataTestIdVolumeInput = 'volume-input', ...props }, ref) => {
     const BASE_ID = (0, hooks_1.useId)(VIDEO_BASE_ID);
     const controlsContainerId = `${BASE_ID}-controlsContainer`;
     const getPaddingBottomSubtitles = () => {
@@ -42,9 +42,9 @@ const VideoStandAloneComponent = (props, ref) => {
         return `${paddingBottom + additionalPadding}rem`;
     };
     if (props.hasSkeleton) {
-        return ((0, jsx_runtime_1.jsx)(components_1.VideoSkeleton, { dataTestIdVideoSkeleton: props.dataTestIdVideoSkeleton, skeletonText: props.skeletonText, styles: props.styles }));
+        return ((0, jsx_runtime_1.jsx)(components_1.VideoSkeleton, { dataTestIdVideoSkeleton: dataTestIdVideoSkeleton, skeletonText: props.skeletonText, styles: props.styles }));
     }
-    return ((0, jsx_runtime_1.jsxs)(video_styled_1.ContainerStyled, { ref: ref, "data-testid": props.dataTestIdParentContainer, styles: props.styles, children: [(0, jsx_runtime_1.jsxs)(video_styled_1.VideoContainerStyled, { ref: props.videoContainerRef, styles: props.styles, children: [props.hasOverlay && ((0, jsx_runtime_1.jsx)(video_styled_1.OverlayStyled, { "data-testid": props.dataTestIdOverlay, styles: props.styles })), (0, jsx_runtime_1.jsxs)(video_styled_1.VideoElement, { ref: props.videoRef, controls: false, isFullScreen: props.fullScreen, paddingBottomSubtitles: getPaddingBottomSubtitles(), poster: props.posterUrl, styles: props.styles, width: "100%", onCanPlay: props.onCanPlay, onClick: props.onTogglePlay, onLoadedMetadata: props.onLoadedMetadata, onPause: props.onVideoPause, onPlay: props.onVideoPlay, onTimeUpdate: props.onTimeUpdate, children: [(0, jsx_runtime_1.jsx)("source", { src: props.videoSrc, type: props.videoType }), props.subtitlesActivated && ((0, jsx_runtime_1.jsx)("track", { default: true, kind: props.trackKind, label: props.trackLabel, src: props.trackSrc, srcLang: props.trackSrcLang }))] }), props.showScreenButtons && ((0, jsx_runtime_1.jsx)(components_1.ScreenButtons, { handlePlayStopVideo: props.onTogglePlay, loading: props.loading, playing: props.playing, screenLoadingIcon: props.screenLoadingIcon, screenPlayIcon: props.screenPlayIcon, styles: props.styles })), !props.loading && !props.hasOverlay && ((0, jsx_runtime_1.jsxs)(video_styled_1.ControlsContainerStyled, { id: controlsContainerId, showControls: props.showControls, styles: props.styles, children: [(0, jsx_runtime_1.jsx)(progressBar_1.ProgressBar, { barAriaLabel: props.barAriaLabel, percentProgressCompleted: (props.currentTime / (props.duration || 1)) * 100, size: props.styles.progressBarSize, variant: props.styles.progressBarVariant, onChange: props.onProgressBarChange, onDragEnd: props.onProgressBarDragEnd, onDragStart: props.onProgressBarDragStart }), (0, jsx_runtime_1.jsxs)(video_styled_1.ButtonsContainerStyled, { styles: props.styles, children: [(0, jsx_runtime_1.jsxs)(video_styled_1.ButtonsBarFirstSubcontainerStyled, { styles: props.styles, children: [(0, jsx_runtime_1.jsx)(components_1.PlayStopButton, { buttonsBarPlayIcon: props.buttonsBarPlayIcon, buttonsBarPlayIconToTransition: props.buttonsBarPlayIconToTransition, buttonsBarPlayIconTooltip: props.buttonsBarPlayIconTooltip, handlePlayStopVideo: props.onTogglePlay, playing: props.playing, styles: props.styles }), (0, jsx_runtime_1.jsx)(components_1.Volume, { buttonsBarVolumeIcon: props.buttonsBarVolumeIcon, buttonsBarVolumeIconToTransition: props.buttonsBarVolumeIconToTransition, buttonsBarVolumeIconTooltip: props.buttonsBarVolumeIconTooltip, dataTestIdVolumeInput: props.dataTestIdVolumeInput, styles: props.styles, volume: props.volume, volumeBarAriaLabel: props.volumeBarAriaLabel, onVolumeButtonClick: props.onVolumeButtonClick, onVolumeChange: props.onVolumeChange }), (0, jsx_runtime_1.jsx)(components_1.Time, { currentTime: props.currentTime, duration: props.duration, styles: props.styles })] }), (0, jsx_runtime_1.jsx)(video_styled_1.ButtonsBarSecondSubontainerStyled, { styles: props.styles, children: (0, jsx_runtime_1.jsx)(components_1.SubtitleFullScreenButtons, { buttonsBarFullScreenIcon: props.buttonsBarFullScreenIcon, buttonsBarFullScreenIconToTransition: props.buttonsBarFullScreenIconToTransition, buttonsBarFullScreenIconTooltip: props.buttonsBarFullScreenIconTooltip, buttonsBarSubtitlesIcon: props.buttonsBarSubtitlesIcon, buttonsBarSubtitlesIconToTransition: props.buttonsBarSubtitlesIconToTransition, buttonsBarSubtitlesIconTooltip: props.buttonsBarSubtitlesIconTooltip, fullScreen: props.fullScreen, styles: props.styles, subtitlesActivated: props.subtitlesActivated, onFullScreenClick: props.onFullScreenClick, onSubtitlesClick: props.onSubtitlesClick }) })] })] }))] }), (0, jsx_runtime_1.jsx)(components_1.LinkAndActionButton, { actionButton: props.actionButton, componentLink: props.componentLink, linkAndActionButtonAlignment: props.linkAndActionButtonAlignment, linkTarget: props.linkTarget, linkText: props.linkText, linkUrl: props.linkUrl, styles: props.styles, onLinkClick: props.onLinkClick })] }));
+    return ((0, jsx_runtime_1.jsxs)(video_styled_1.ContainerStyled, { ref: ref, "data-testid": dataTestIdParentContainer, styles: props.styles, children: [(0, jsx_runtime_1.jsxs)(video_styled_1.VideoContainerStyled, { ref: props.videoContainerRef, styles: props.styles, children: [props.hasOverlay && ((0, jsx_runtime_1.jsx)(video_styled_1.OverlayStyled, { "data-testid": dataTestIdOverlay, styles: props.styles })), (0, jsx_runtime_1.jsxs)(video_styled_1.VideoElement, { ref: props.videoRef, controls: false, isFullScreen: props.fullScreen, paddingBottomSubtitles: getPaddingBottomSubtitles(), poster: props.posterUrl, styles: props.styles, width: "100%", onCanPlay: props.onCanPlay, onClick: props.onTogglePlay, onLoadedMetadata: props.onLoadedMetadata, onPause: props.onVideoPause, onPlay: props.onVideoPlay, onTimeUpdate: props.onTimeUpdate, children: [(0, jsx_runtime_1.jsx)("source", { src: props.videoSrc, type: props.videoType }), props.subtitlesActivated && ((0, jsx_runtime_1.jsx)("track", { default: true, kind: props.trackKind, label: props.trackLabel, src: props.trackSrc, srcLang: props.trackSrcLang }))] }), props.showScreenButtons && ((0, jsx_runtime_1.jsx)(components_1.ScreenButtons, { handlePlayStopVideo: props.onTogglePlay, loading: props.loading, playing: props.playing, screenLoadingIcon: props.screenLoadingIcon, screenPlayIcon: props.screenPlayIcon, styles: props.styles })), !props.loading && !props.hasOverlay && ((0, jsx_runtime_1.jsxs)(video_styled_1.ControlsContainerStyled, { id: controlsContainerId, showControls: props.showControls, styles: props.styles, children: [(0, jsx_runtime_1.jsx)(progressBar_1.ProgressBar, { barAriaLabel: props.barAriaLabel, percentProgressCompleted: (props.currentTime / (props.duration || 1)) * 100, size: props.styles.progressBarSize, variant: props.styles.progressBarVariant, onChange: props.onProgressBarChange, onDragEnd: props.onProgressBarDragEnd, onDragStart: props.onProgressBarDragStart }), (0, jsx_runtime_1.jsxs)(video_styled_1.ButtonsContainerStyled, { styles: props.styles, children: [(0, jsx_runtime_1.jsxs)(video_styled_1.ButtonsBarFirstSubcontainerStyled, { styles: props.styles, children: [(0, jsx_runtime_1.jsx)(components_1.PlayStopButton, { buttonsBarPlayIcon: props.buttonsBarPlayIcon, buttonsBarPlayIconToTransition: props.buttonsBarPlayIconToTransition, buttonsBarPlayIconTooltip: props.buttonsBarPlayIconTooltip, handlePlayStopVideo: props.onTogglePlay, playing: props.playing, styles: props.styles }), (0, jsx_runtime_1.jsx)(components_1.Volume, { buttonsBarVolumeIcon: props.buttonsBarVolumeIcon, buttonsBarVolumeIconToTransition: props.buttonsBarVolumeIconToTransition, buttonsBarVolumeIconTooltip: props.buttonsBarVolumeIconTooltip, dataTestIdVolumeInput: dataTestIdVolumeInput, styles: props.styles, volume: props.volume, volumeBarAriaLabel: props.volumeBarAriaLabel, onVolumeButtonClick: props.onVolumeButtonClick, onVolumeChange: props.onVolumeChange }), (0, jsx_runtime_1.jsx)(components_1.Time, { currentTime: props.currentTime, duration: props.duration, styles: props.styles })] }), (0, jsx_runtime_1.jsx)(video_styled_1.ButtonsBarSecondSubontainerStyled, { styles: props.styles, children: (0, jsx_runtime_1.jsx)(components_1.SubtitleFullScreenButtons, { buttonsBarFullScreenIcon: props.buttonsBarFullScreenIcon, buttonsBarFullScreenIconToTransition: props.buttonsBarFullScreenIconToTransition, buttonsBarFullScreenIconTooltip: props.buttonsBarFullScreenIconTooltip, buttonsBarSubtitlesIcon: props.buttonsBarSubtitlesIcon, buttonsBarSubtitlesIconToTransition: props.buttonsBarSubtitlesIconToTransition, buttonsBarSubtitlesIconTooltip: props.buttonsBarSubtitlesIconTooltip, fullScreen: props.fullScreen, styles: props.styles, subtitlesActivated: props.subtitlesActivated, onFullScreenClick: props.onFullScreenClick, onSubtitlesClick: props.onSubtitlesClick }) })] })] }))] }), (0, jsx_runtime_1.jsx)(components_1.LinkAndActionButton, { actionButton: props.actionButton, componentLink: props.componentLink, linkAndActionButtonAlignment: props.linkAndActionButtonAlignment, linkTarget: props.linkTarget, linkText: props.linkText, linkUrl: props.linkUrl, styles: props.styles, onLinkClick: props.onLinkClick })] }));
 };
 exports.VideoStandAlone = React.forwardRef(VideoStandAloneComponent);
 //# sourceMappingURL=videoStandAlone.js.map