@appquality/unguess-design-system 3.1.91-highlight-obs → 3.1.91-load-tests

package/build/index.js

@@ -4794,7 +4794,9 @@ const PlayerCore = React.forwardRef((props, forwardRef) => {
     const videoRef = (_a = context.player) === null || _a === void 0 ? void 0 : _a.ref.current;
     const isLoaded = !!videoRef;
     const containerRef = React.useRef(null);
-    React.useImperativeHandle(forwardRef, () => videoRef, [videoRef]);
+    React.useImperativeHandle(forwardRef, () => videoRef, [
+        videoRef,
+    ]);
     React.useEffect(() => {
         if (videoRef) {
             videoRef.addEventListener("pause", () => {
@@ -4809,8 +4811,10 @@ const PlayerCore = React.forwardRef((props, forwardRef) => {
             }
         };
     }, [setIsPlaying, videoRef]);
-    return (jsxRuntime.jsxs(Container$1, Object.assign({ isLoaded: isLoaded, isPlaying: context.isPlaying, ref: containerRef, showControls: props.showControls }, { children: [!isLoaded ? (jsxRuntime.jsx(VideoSpinner, {})) : (jsxRuntime.jsx(FloatingControls, { isPlaying: context.isPlaying, showControls: props.showControls, onClick: togglePlay })), jsxRuntime.jsx(Video__default["default"].Player, { className: "player-container" }), jsxRuntime.jsx(ProgressContextProvider, { children: jsxRuntime.jsx(Controls, { container: containerRef.current, onCutHandler: onCutHandler, bookmarks: bookmarks, isCutting: isCutting, onBookMarkUpdated: props.handleBookmarkUpdate, i18n: props.i18n, showControls: props.showControls }) })] })));
-});
+    return (jsxRuntime.jsxs(Container$1, Object.assign({ isLoaded: isLoaded, isPlaying: context.isPlaying, ref: containerRef }, { children: [!isLoaded ? (jsxRuntime.jsx(VideoSpinner, {})) : (jsxRuntime.jsx(FloatingControls, { isPlaying: context.isPlaying, onClick: togglePlay })), jsxRuntime.jsx(Video__default["default"].Player, { className: "player-container" }), jsxRuntime.jsx(ProgressContextProvider, { children: jsxRuntime.jsx(Controls, { container: containerRef.current, onCutHandler: onCutHandler, bookmarks: bookmarks, isCutting: isCutting, onBookMarkUpdated: props.handleBookmarkUpdate, i18n: props.i18n }) })] })));
+});
+const PlayerProvider = (props) => (jsxRuntime.jsx(Video__default["default"], Object.assign({ src: props.url }, props, { children: props.children })));
+PlayerProvider.Core = PlayerCore;
 
 const MediaLightBox = ({ header, onClose, slideChange, selectedImageIndex, thumbnails, videoRefs, isOpen, details }) => {
     if (!isOpen) {
@@ -5688,12 +5692,15 @@ const StyledWord = styled__default["default"].div `
 
   ${({ observations, theme }) => {
     var _a;
-    return observations && observations.length > 0 &&
+    return observations &&
+        observations.length > 0 &&
         `
       color: ${(_a = observations[observations.length - 1].color) !== null && _a !== void 0 ? _a : theme.palette.grey[600]};
       box-sizing: border-box;
-      font-weight: ${getFocusedObs(observations) ? theme.fontWeights.extrabold : theme.fontWeights.semibold};
-      font-style: ${getFocusedObs(observations) ? 'italic' : 'normal'};
+      font-weight: ${getFocusedObs(observations)
+            ? theme.fontWeights.extrabold
+            : theme.fontWeights.semibold};
+      font-style: ${getFocusedObs(observations) ? "italic" : "normal"};
       z-index: 1;
       &:focus {
         outline: none;
@@ -5723,6 +5730,23 @@ const Layer = styled__default["default"].div `
   z-index: 0;
   background-color: ${({ color }) => getColor(color, undefined, undefined, 0.2)};
 `;
+const textFromSelection = (selection) => {
+    if (!selection || !selection.toString().length)
+        return "";
+    if (selection.anchorNode === null || selection.focusNode === null)
+        return "";
+    var range = selection.getRangeAt(0);
+    var tempDiv = document.createElement("div");
+    tempDiv.appendChild(range.cloneContents());
+    var items = tempDiv.querySelectorAll("div");
+    items.forEach(function (item) {
+        if (item.getAttribute("data-unselectable")) {
+            item.remove();
+        }
+    });
+    var filteredText = tempDiv.textContent || tempDiv.innerText;
+    return filteredText.length ? filteredText.trim() : selection.toString();
+};
 /**
  *  Use Highlight to use highlight interation on any text element
  */
@@ -5734,26 +5758,12 @@ const Highlight = (props) => {
     const [position, setPosition] = React.useState();
     const [selection, setSelection] = React.useState();
     const activeSelection = document.getSelection();
-    const extractText = (selection) => {
-        if (selection.anchorNode === null || selection.focusNode === null)
-            return "";
-        var range = selection.getRangeAt(0);
-        var tempDiv = document.createElement("div");
-        tempDiv.appendChild(range.cloneContents());
-        var items = tempDiv.querySelectorAll("div");
-        items.forEach(function (item) {
-            if (item.getAttribute("data-unselectable")) {
-                item.remove();
-            }
-        });
-        var filteredText = tempDiv.textContent || tempDiv.innerText;
-        return filteredText.length ? filteredText.trim() : selection.toString();
-    };
+    const extractText = React.useMemo(() => textFromSelection(activeSelection), [activeSelection]);
     const handleSelectionChange = React.useCallback(() => {
         var _a, _b, _c, _d, _e, _f, _g, _h;
         if (activeSelection && activeSelection.toString().length > 0) {
             // Extract the text from the selection cleaning unselectable items
-            const text = extractText(activeSelection);
+            const text = extractText;
             if (!text)
                 return;
             const anchorNode = (_a = activeSelection === null || activeSelection === void 0 ? void 0 : activeSelection.anchorNode) === null || _a === void 0 ? void 0 : _a.parentElement;
@@ -5768,9 +5778,7 @@ const Highlight = (props) => {
                     const range = activeSelection.getRangeAt(0);
                     const rects = range.getClientRects();
                     const lastRect = rects[rects.length - 1];
-                    const containerRect = ref && ref.current
-                        ? ref.current.getBoundingClientRect()
-                        : null;
+                    const containerRect = ref && ref.current ? ref.current.getBoundingClientRect() : null;
                     if (!lastRect || !containerRect)
                         return;
                     const relativeY = lastRect.bottom - containerRect.top + ref.current.scrollTop;
@@ -5798,7 +5806,7 @@ const Highlight = (props) => {
         else {
             setIsSelecting(false);
         }
-    }, [onSelectionButtonClick, activeSelection]);
+    }, [activeSelection, extractText, onSelectionButtonClick]);
     React.useEffect(() => {
         if (ref.current === null)
             return;
@@ -5821,10 +5829,11 @@ const Word = (props) => {
         var _a, _b;
         return (_b = (_a = props.observations) === null || _a === void 0 ? void 0 : _a.filter((obs) => props.start >= obs.start && props.end <= obs.end)) !== null && _b !== void 0 ? _b : [];
     }, [props.observations, props.start, props.end]);
-    const ObsWord = React.useMemo(() => (jsxRuntime.jsxs(StyledWord, Object.assign({}, props, { "data-start": props.start, "data-end": props.end, className: foundObservations.length > 0 ? "highlighted" : "" }, (foundObservations && { observations: foundObservations }), { children: [foundObservations.length > 0 && foundObservations.map((obs) => {
-                var _a;
-                return (jsxRuntime.jsx(Layer, { color: (_a = obs.hue) !== null && _a !== void 0 ? _a : theme.palette.grey[600] }, obs.id));
-            }), isActive ? (jsxRuntime.jsx(ActiveWord, Object.assign({ "data-start": props.start, "data-end": props.end }, { children: jsxRuntime.jsx(Searchable, { text: props.text }) }))) : (jsxRuntime.jsx(Searchable, { text: props.text })), " "] }))), [props, foundObservations, isActive]);
+    const ObsWord = React.useMemo(() => (jsxRuntime.jsxs(StyledWord, Object.assign({}, props, { "data-start": props.start, "data-end": props.end, className: foundObservations.length > 0 ? "highlighted" : "" }, (foundObservations && { observations: foundObservations }), { children: [foundObservations.length > 0 &&
+                foundObservations.map((obs) => {
+                    var _a;
+                    return (jsxRuntime.jsx(Layer, { color: (_a = obs.hue) !== null && _a !== void 0 ? _a : theme.palette.grey[600] }, obs.id));
+                }), isActive ? (jsxRuntime.jsx(ActiveWord, Object.assign({ "data-start": props.start, "data-end": props.end }, { children: jsxRuntime.jsx(Searchable, { text: props.text }) }))) : (jsxRuntime.jsx(Searchable, { text: props.text })), " "] }))), [props, foundObservations, isActive]);
     if (props.tooltipContent !== undefined && foundObservations.length > 0) {
         return (jsxRuntime.jsx(Tooltip, Object.assign({ content: props.tooltipContent(foundObservations), isTransparent: true }, { children: ObsWord })));
     }
@@ -7254,6 +7263,10 @@ Object.defineProperty(exports, 'ModalClose', {
   enumerable: true,
   get: function () { return reactModals.Close; }
 });
+Object.defineProperty(exports, 'useVideoContext', {
+  enumerable: true,
+  get: function () { return Video.useVideoContext; }
+});
 exports.Accordion = Accordion;
 exports.Alert = Alert;
 exports.Anchor = Anchor;
@@ -7351,6 +7364,7 @@ exports.Pagination = Pagination;
 exports.Paragraph = Paragraph;
 exports.PieChart = PieChart;
 exports.Player = Player;
+exports.PlayerProvider = PlayerProvider;
 exports.PreviousItem = PreviousItem;
 exports.ProductCard = ProductCard;
 exports.ProfileModal = ProfileModal;

package/build/stories/buttons/button/index.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ButtonArgs } from "./_types";
 export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, ButtonArgs>;
 export declare const Basic: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, ButtonArgs>;

package/build/stories/buttons/utils.d.ts

@@ -8,18 +8,18 @@ export declare const variants: readonly [{}, {
     readonly disabled: true;
 }];
 export declare const Row: import("styled-components").IStyledComponent<"web", {
-    alignItems?: "center" | "start" | "end" | "baseline" | "stretch" | undefined;
-    alignItemsXs?: "center" | "start" | "end" | "baseline" | "stretch" | undefined;
-    alignItemsSm?: "center" | "start" | "end" | "baseline" | "stretch" | undefined;
-    alignItemsMd?: "center" | "start" | "end" | "baseline" | "stretch" | undefined;
-    alignItemsLg?: "center" | "start" | "end" | "baseline" | "stretch" | undefined;
-    alignItemsXl?: "center" | "start" | "end" | "baseline" | "stretch" | undefined;
-    justifyContent?: "center" | "start" | "end" | "between" | "around" | undefined;
-    justifyContentXs?: "center" | "start" | "end" | "between" | "around" | undefined;
-    justifyContentSm?: "center" | "start" | "end" | "between" | "around" | undefined;
-    justifyContentMd?: "center" | "start" | "end" | "between" | "around" | undefined;
-    justifyContentLg?: "center" | "start" | "end" | "between" | "around" | undefined;
-    justifyContentXl?: "center" | "start" | "end" | "between" | "around" | undefined;
+    alignItems?: "start" | "center" | "end" | "baseline" | "stretch" | undefined;
+    alignItemsXs?: "start" | "center" | "end" | "baseline" | "stretch" | undefined;
+    alignItemsSm?: "start" | "center" | "end" | "baseline" | "stretch" | undefined;
+    alignItemsMd?: "start" | "center" | "end" | "baseline" | "stretch" | undefined;
+    alignItemsLg?: "start" | "center" | "end" | "baseline" | "stretch" | undefined;
+    alignItemsXl?: "start" | "center" | "end" | "baseline" | "stretch" | undefined;
+    justifyContent?: "start" | "center" | "end" | "between" | "around" | undefined;
+    justifyContentXs?: "start" | "center" | "end" | "between" | "around" | undefined;
+    justifyContentSm?: "start" | "center" | "end" | "between" | "around" | undefined;
+    justifyContentMd?: "start" | "center" | "end" | "between" | "around" | undefined;
+    justifyContentLg?: "start" | "center" | "end" | "between" | "around" | undefined;
+    justifyContentXl?: "start" | "center" | "end" | "between" | "around" | undefined;
     wrap?: "wrap" | "nowrap" | "wrap-reverse" | undefined;
     wrapXs?: "wrap" | "nowrap" | "wrap-reverse" | undefined;
     wrapSm?: "wrap" | "nowrap" | "wrap-reverse" | undefined;
@@ -73,7 +73,7 @@ export declare const Row: import("styled-components").IStyledComponent<"web", {
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
-    inputMode?: "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    inputMode?: "decimal" | "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | undefined;
     is?: string | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: (boolean | "true" | "false") | undefined;
@@ -299,18 +299,18 @@ export declare const Col: import("styled-components").IStyledComponent<"web", {
     md?: string | number | boolean | undefined;
     lg?: string | number | boolean | undefined;
     xl?: string | number | boolean | undefined;
-    alignSelf?: "center" | "start" | "end" | "baseline" | "stretch" | "auto" | undefined;
-    alignSelfXs?: "center" | "start" | "end" | "baseline" | "stretch" | "auto" | undefined;
-    alignSelfSm?: "center" | "start" | "end" | "baseline" | "stretch" | "auto" | undefined;
-    alignSelfMd?: "center" | "start" | "end" | "baseline" | "stretch" | "auto" | undefined;
-    alignSelfLg?: "center" | "start" | "end" | "baseline" | "stretch" | "auto" | undefined;
-    alignSelfXl?: "center" | "start" | "end" | "baseline" | "stretch" | "auto" | undefined;
-    textAlign?: "center" | "start" | "end" | "justify" | undefined;
-    textAlignXs?: "center" | "start" | "end" | "justify" | undefined;
-    textAlignSm?: "center" | "start" | "end" | "justify" | undefined;
-    textAlignMd?: "center" | "start" | "end" | "justify" | undefined;
-    textAlignLg?: "center" | "start" | "end" | "justify" | undefined;
-    textAlignXl?: "center" | "start" | "end" | "justify" | undefined;
+    alignSelf?: "start" | "center" | "end" | "baseline" | "stretch" | "auto" | undefined;
+    alignSelfXs?: "start" | "center" | "end" | "baseline" | "stretch" | "auto" | undefined;
+    alignSelfSm?: "start" | "center" | "end" | "baseline" | "stretch" | "auto" | undefined;
+    alignSelfMd?: "start" | "center" | "end" | "baseline" | "stretch" | "auto" | undefined;
+    alignSelfLg?: "start" | "center" | "end" | "baseline" | "stretch" | "auto" | undefined;
+    alignSelfXl?: "start" | "center" | "end" | "baseline" | "stretch" | "auto" | undefined;
+    textAlign?: "start" | "center" | "end" | "justify" | undefined;
+    textAlignXs?: "start" | "center" | "end" | "justify" | undefined;
+    textAlignSm?: "start" | "center" | "end" | "justify" | undefined;
+    textAlignMd?: "start" | "center" | "end" | "justify" | undefined;
+    textAlignLg?: "start" | "center" | "end" | "justify" | undefined;
+    textAlignXl?: "start" | "center" | "end" | "justify" | undefined;
     offset?: string | number | undefined;
     offsetXs?: string | number | undefined;
     offsetSm?: string | number | undefined;
@@ -370,7 +370,7 @@ export declare const Col: import("styled-components").IStyledComponent<"web", {
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
-    inputMode?: "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    inputMode?: "decimal" | "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | undefined;
     is?: string | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: (boolean | "true" | "false") | undefined;
@@ -640,7 +640,7 @@ export declare const MD: import("styled-components").IStyledComponent<"web", {
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
-    inputMode?: "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    inputMode?: "decimal" | "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | undefined;
     is?: string | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: (boolean | "true" | "false") | undefined;

package/build/stories/chat/index.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { PlaceholderOptions } from "@tiptap/extension-placeholder";
 import { Editor as TipTapEditor } from "@tiptap/react";
 import { ChatEditorArgs, CommentMedia, SuggestedUser } from "./_types";

package/build/stories/dropdowns/select/index.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { DropdownArgs, SelectArgs } from "./_types";
 import { MenuArgs } from "../menu/_types";
 interface IItem {

package/build/stories/editor/index.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { EditorArgs } from "./_types";
 interface EditorStoryArgs extends EditorArgs {
     children?: any;

package/build/stories/highlight/index.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { HighlightArgs, WordProps } from "./_types";
 export interface StoryArgs extends HighlightArgs {
     words: Array<WordProps & {

package/build/stories/player/index.d.ts

@@ -1,4 +1,5 @@
-/// <reference types="react" />
+import { useVideoContext } from "@appquality/stream-player";
+import { PropsWithChildren } from "react";
 import { PlayerArgs } from "./_types";
 /**
  * The Player is a styled media tag with custom controls
@@ -7,4 +8,8 @@ import { PlayerArgs } from "./_types";
     - To display a video
  */
 declare const Player: import("react").ForwardRefExoticComponent<PlayerArgs & import("react").RefAttributes<HTMLVideoElement>>;
-export { Player };
+declare const PlayerProvider: {
+    (props: PropsWithChildren<PlayerArgs>): import("react/jsx-runtime").JSX.Element;
+    Core: import("react").ForwardRefExoticComponent<PlayerArgs & import("react").RefAttributes<HTMLVideoElement>>;
+};
+export { Player, PlayerProvider, useVideoContext };

package/build/stories/player/index.stories.d.ts

@@ -1,10 +1,9 @@
-/// <reference types="react" />
 import { PlayerArgs } from "./_types";
 interface PlayerStoryArgs extends PlayerArgs {
 }
 export declare const Basic: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, PlayerStoryArgs>;
-export declare const ShowControls: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, PlayerStoryArgs>;
 export declare const Streaming: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, PlayerStoryArgs>;
 export declare const WithBookmarks: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, PlayerStoryArgs>;
+export declare const WithContext: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, PlayerStoryArgs>;
 declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, PlayerArgs & import("react").RefAttributes<HTMLVideoElement>>;
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appquality/unguess-design-system",
-  "version": "3.1.91-highlight-obs",
+  "version": "3.1.91-load-tests",
   "description": "",
   "main": "build/index.js",
   "types": "build/index.d.ts",