@appquality/unguess-design-system 3.1.104-attachments → 3.1.104

package/build/stories/avatar/InternalAvatar.d.ts

@@ -0,0 +1,2 @@
+declare const InternalAvatar: () => import("react/jsx-runtime").JSX.Element;
+export default InternalAvatar;

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?: "start" | "end" | "center" | "baseline" | "stretch" | undefined;
-    alignItemsXs?: "start" | "end" | "center" | "baseline" | "stretch" | undefined;
-    alignItemsSm?: "start" | "end" | "center" | "baseline" | "stretch" | undefined;
-    alignItemsMd?: "start" | "end" | "center" | "baseline" | "stretch" | undefined;
-    alignItemsLg?: "start" | "end" | "center" | "baseline" | "stretch" | undefined;
-    alignItemsXl?: "start" | "end" | "center" | "baseline" | "stretch" | undefined;
-    justifyContent?: "start" | "end" | "center" | "between" | "around" | undefined;
-    justifyContentXs?: "start" | "end" | "center" | "between" | "around" | undefined;
-    justifyContentSm?: "start" | "end" | "center" | "between" | "around" | undefined;
-    justifyContentMd?: "start" | "end" | "center" | "between" | "around" | undefined;
-    justifyContentLg?: "start" | "end" | "center" | "between" | "around" | undefined;
-    justifyContentXl?: "start" | "end" | "center" | "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;
@@ -33,7 +33,7 @@ export declare const Row: import("styled-components").IStyledComponent<"web", {
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
     className?: string | undefined;
-    contentEditable?: "inherit" | (boolean | "true" | "false") | undefined;
+    contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
     draggable?: (boolean | "true" | "false") | 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?: "text" | "search" | "none" | "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;
@@ -84,7 +84,7 @@ export declare const Row: import("styled-components").IStyledComponent<"web", {
     "aria-colindex"?: number | undefined;
     "aria-colspan"?: number | undefined;
     "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "time" | "step" | "true" | "false" | "page" | "location" | "date" | undefined;
+    "aria-current"?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time" | undefined;
     "aria-describedby"?: string | undefined;
     "aria-details"?: string | undefined;
     "aria-disabled"?: (boolean | "true" | "false") | undefined;
@@ -93,7 +93,7 @@ export declare const Row: import("styled-components").IStyledComponent<"web", {
     "aria-expanded"?: (boolean | "true" | "false") | undefined;
     "aria-flowto"?: string | undefined;
     "aria-grabbed"?: (boolean | "true" | "false") | undefined;
-    "aria-haspopup"?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
+    "aria-haspopup"?: boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree" | undefined;
     "aria-hidden"?: (boolean | "true" | "false") | undefined;
     "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
     "aria-keyshortcuts"?: string | undefined;
@@ -110,7 +110,7 @@ export declare const Row: import("styled-components").IStyledComponent<"web", {
     "aria-posinset"?: number | undefined;
     "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
     "aria-readonly"?: (boolean | "true" | "false") | undefined;
-    "aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
     "aria-required"?: (boolean | "true" | "false") | undefined;
     "aria-roledescription"?: string | undefined;
     "aria-rowcount"?: number | 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?: "start" | "end" | "center" | "baseline" | "stretch" | "auto" | undefined;
-    alignSelfXs?: "start" | "end" | "center" | "baseline" | "stretch" | "auto" | undefined;
-    alignSelfSm?: "start" | "end" | "center" | "baseline" | "stretch" | "auto" | undefined;
-    alignSelfMd?: "start" | "end" | "center" | "baseline" | "stretch" | "auto" | undefined;
-    alignSelfLg?: "start" | "end" | "center" | "baseline" | "stretch" | "auto" | undefined;
-    alignSelfXl?: "start" | "end" | "center" | "baseline" | "stretch" | "auto" | undefined;
-    textAlign?: "start" | "end" | "center" | "justify" | undefined;
-    textAlignXs?: "start" | "end" | "center" | "justify" | undefined;
-    textAlignSm?: "start" | "end" | "center" | "justify" | undefined;
-    textAlignMd?: "start" | "end" | "center" | "justify" | undefined;
-    textAlignLg?: "start" | "end" | "center" | "justify" | undefined;
-    textAlignXl?: "start" | "end" | "center" | "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;
@@ -330,7 +330,7 @@ export declare const Col: import("styled-components").IStyledComponent<"web", {
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
     className?: string | undefined;
-    contentEditable?: "inherit" | (boolean | "true" | "false") | undefined;
+    contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
     draggable?: (boolean | "true" | "false") | 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?: "text" | "search" | "none" | "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;
@@ -381,7 +381,7 @@ export declare const Col: import("styled-components").IStyledComponent<"web", {
     "aria-colindex"?: number | undefined;
     "aria-colspan"?: number | undefined;
     "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "time" | "step" | "true" | "false" | "page" | "location" | "date" | undefined;
+    "aria-current"?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time" | undefined;
     "aria-describedby"?: string | undefined;
     "aria-details"?: string | undefined;
     "aria-disabled"?: (boolean | "true" | "false") | undefined;
@@ -390,7 +390,7 @@ export declare const Col: import("styled-components").IStyledComponent<"web", {
     "aria-expanded"?: (boolean | "true" | "false") | undefined;
     "aria-flowto"?: string | undefined;
     "aria-grabbed"?: (boolean | "true" | "false") | undefined;
-    "aria-haspopup"?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
+    "aria-haspopup"?: boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree" | undefined;
     "aria-hidden"?: (boolean | "true" | "false") | undefined;
     "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
     "aria-keyshortcuts"?: string | undefined;
@@ -407,7 +407,7 @@ export declare const Col: import("styled-components").IStyledComponent<"web", {
     "aria-posinset"?: number | undefined;
     "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
     "aria-readonly"?: (boolean | "true" | "false") | undefined;
-    "aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
     "aria-required"?: (boolean | "true" | "false") | undefined;
     "aria-roledescription"?: string | undefined;
     "aria-rowcount"?: number | undefined;
@@ -600,7 +600,7 @@ export declare const MD: import("styled-components").IStyledComponent<"web", {
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
     className?: string | undefined;
-    contentEditable?: "inherit" | (boolean | "true" | "false") | undefined;
+    contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
     draggable?: (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?: "text" | "search" | "none" | "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;
@@ -651,7 +651,7 @@ export declare const MD: import("styled-components").IStyledComponent<"web", {
     "aria-colindex"?: number | undefined;
     "aria-colspan"?: number | undefined;
     "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "time" | "step" | "true" | "false" | "page" | "location" | "date" | undefined;
+    "aria-current"?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time" | undefined;
     "aria-describedby"?: string | undefined;
     "aria-details"?: string | undefined;
     "aria-disabled"?: (boolean | "true" | "false") | undefined;
@@ -660,7 +660,7 @@ export declare const MD: import("styled-components").IStyledComponent<"web", {
     "aria-expanded"?: (boolean | "true" | "false") | undefined;
     "aria-flowto"?: string | undefined;
     "aria-grabbed"?: (boolean | "true" | "false") | undefined;
-    "aria-haspopup"?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
+    "aria-haspopup"?: boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree" | undefined;
     "aria-hidden"?: (boolean | "true" | "false") | undefined;
     "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
     "aria-keyshortcuts"?: string | undefined;
@@ -677,7 +677,7 @@ export declare const MD: import("styled-components").IStyledComponent<"web", {
     "aria-posinset"?: number | undefined;
     "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
     "aria-readonly"?: (boolean | "true" | "false") | undefined;
-    "aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
     "aria-required"?: (boolean | "true" | "false") | undefined;
     "aria-roledescription"?: string | undefined;
     "aria-rowcount"?: number | undefined;

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

@@ -9,7 +9,6 @@ export type SuggestedUser = {
 };
 export interface ChatEditorArgs extends Partial<EditorOptions> {
     author: Author;
-    messageBadFileFormat: string;
     placeholderOptions?: Partial<PlaceholderOptions>;
     hasFloatingMenu?: boolean;
     hasButtonsMenu?: boolean;
@@ -19,7 +18,7 @@ export interface ChatEditorArgs extends Partial<EditorOptions> {
             bold?: string;
             italic?: string;
             mention?: string;
-            attachment?: string | React.ReactNode;
+            attachment?: React.ReactNode;
         };
         mention?: {
             noResults?: string;
@@ -38,10 +37,13 @@ export interface EditorHeaderArgs {
     title?: string;
     validation?: validationStatus;
 }
-export interface FileItem extends File {
-    isLoadingMedia: boolean;
-    isError?: boolean;
-    internal_id: string;
+export interface CommentMedia {
+    id: string;
+    type: string;
+    name?: string;
+    isLoadingMedia?: boolean;
+    error?: string;
+    url?: string;
 }
 export interface FloatingMenuArgs extends Partial<BubbleMenuProps> {
 }

package/build/stories/chat/context/chatContext.d.ts

@@ -1,15 +1,15 @@
 import { Editor } from "@tiptap/react";
 import React from "react";
-import { FileItem, SuggestedUser } from "../_types";
+import { CommentMedia, SuggestedUser } from "../_types";
 export type ChatContextType = {
     triggerSave: () => void;
     editor?: Editor;
     setEditor: React.Dispatch<React.SetStateAction<Editor | undefined>>;
     addThumbnails: (props: {
-        files: FileItem[];
+        files: (File & CommentMedia)[];
     }) => void;
     removeThumbnail: (index: number) => void;
-    thumbnails: FileItem[];
+    thumbnails: CommentMedia[];
     mentionableUsers: (props: {
         query: string;
     }) => SuggestedUser[];
@@ -29,7 +29,7 @@ export interface Data {
 }
 export declare const ChatContextProvider: ({ onSave, onFileUpload, onDeleteThumbnail, setMentionableUsers, children, }: {
     onSave?: ((editor: Editor, mentions: SuggestedUser[]) => void) | undefined;
-    onFileUpload?: ((files: FileItem[]) => Promise<Data>) | undefined;
+    onFileUpload?: ((files: (File & CommentMedia)[]) => Promise<Data>) | undefined;
     onDeleteThumbnail: (id: string) => void;
     children: React.ReactNode;
     setMentionableUsers: (props: {

package/build/stories/chat/hooks/useMedia.d.ts

@@ -0,0 +1,8 @@
+export declare const acceptedMediaTypes: RegExp;
+export declare function useMedia(): {
+    getMedia: (data: FileList) => (File & {
+        url: string;
+        isLoadingMedia: boolean;
+        id: string;
+    })[];
+};

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

@@ -1,7 +1,6 @@
 import { PlaceholderOptions } from "@tiptap/extension-placeholder";
 import { Editor as TipTapEditor } from "@tiptap/react";
-import { ChatEditorArgs, FileItem, SuggestedUser } from "./_types";
-import { MediaType } from "./parts/comment";
+import { ChatEditorArgs, CommentMedia, SuggestedUser } from "./_types";
 import { Data } from "./context/chatContext";
 interface EditorStoryArgs extends ChatEditorArgs {
     children?: any;
@@ -13,12 +12,12 @@ interface EditorStoryArgs extends ChatEditorArgs {
         };
         message: string;
         date: string;
-        media?: MediaType[];
+        media?: CommentMedia[];
     }[];
     editorText?: string;
     background?: string;
     onSave: (editor: TipTapEditor, mentions: SuggestedUser[]) => void;
-    onFileUpload?: (files: FileItem[]) => Promise<Data>;
+    onFileUpload?: (files: (File & CommentMedia)[]) => Promise<Data>;
     placeholderOptions?: Partial<PlaceholderOptions>;
 }
 export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, EditorStoryArgs>;

package/build/stories/chat/parts/MediaLightbox.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { CommentMedia } from "../_types";
+interface MediaLightBoxProps {
+    isOpen: boolean;
+    header: React.ReactNode;
+    onClose: () => void;
+    slideChange: (index: number) => void;
+    selectedImageIndex: number;
+    thumbnails: CommentMedia[];
+    videoRefs: React.MutableRefObject<Array<HTMLVideoElement | null>>;
+    details?: React.ReactNode;
+}
+declare const MediaLightBox: ({ header, onClose, slideChange, selectedImageIndex, thumbnails, videoRefs, isOpen, details }: MediaLightBoxProps) => import("react/jsx-runtime").JSX.Element | null;
+export default MediaLightBox;

package/build/stories/chat/parts/ThumbnailContainer/Thumbnail.d.ts

@@ -0,0 +1,11 @@
+interface Props {
+    src?: string;
+    type: string;
+    clickThumbnail?: () => void;
+    isLoadingMedia?: boolean;
+    removeThumbnail?: () => void;
+    showX?: boolean;
+    error?: string;
+}
+declare const Thumbnail: ({ src, type, removeThumbnail, clickThumbnail, showX, isLoadingMedia, error, }: Props) => import("react/jsx-runtime").JSX.Element;
+export default Thumbnail;

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

@@ -1,13 +1,5 @@
-export interface FileElement {
-    fileName: string;
-    fileType: string;
-    errorCode?: "FILE_TOO_BIG" | "INVALID_FILE_EXTENSION" | "GENERIC_ERROR";
-    previewUrl: string;
-    internal_id: string;
-    isLoadingMedia: boolean;
-}
 interface Props {
-    openLightbox: (file: File, index: number) => void;
+    openLightbox: (index: number) => void;
 }
 declare const ThumbnailContainer: ({ openLightbox }: Props) => import("react/jsx-runtime").JSX.Element | null;
 export default ThumbnailContainer;

package/build/stories/chat/parts/comment.d.ts

@@ -1,15 +1,10 @@
 import { PropsWithChildren } from "react";
-import { Author } from "../_types";
-export type MediaType = {
-    url: string;
-    id: number;
-    type: "image" | "video";
-};
+import { Author, CommentMedia } from "../_types";
 export declare const Comment: ({ author, message, children, date, media, header, }: PropsWithChildren<{
     author: Author;
     message: string;
     date: string;
-    media?: MediaType[] | undefined;
+    media?: CommentMedia[] | undefined;
     header: {
         title: string;
         message?: string | undefined;

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/CreateObservationButton.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+declare const CreateObservationButton: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("../buttons/button/_types").ButtonArgs & import("react").RefAttributes<HTMLButtonElement>, {
+    position: {
+        x: number;
+        y: number;
+    };
+}>> & import("react").ForwardRefExoticComponent<import("../buttons/button/_types").ButtonArgs & import("react").RefAttributes<HTMLButtonElement>> & {
+    EndIcon: {
+        (props: import("@zendeskgarden/react-buttons").IButtonEndIconProps): JSX.Element;
+        displayName: string;
+    };
+    StartIcon: {
+        (props: import("@zendeskgarden/react-buttons").IButtonEndIconProps): JSX.Element;
+        displayName: string;
+    };
+};
+export { CreateObservationButton };

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

@@ -1,4 +1,6 @@
 import { ISpanProps } from "@zendeskgarden/react-typography";
+import { ReactNode } from "react";
+import { IBookmark } from "../player/_types";
 export interface HighlightArgs {
     /**
      * Applies a font color. Use [PALETTE](/components/palette#palette) colors
@@ -13,18 +15,17 @@ export interface HighlightArgs {
     isMonospace?: boolean;
     /** Adjusts the font size. By default font size is medium */
     size?: "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl";
-    handleSelection?: (part: {
+    search?: string;
+    onSelectionButtonClick?: (part: {
         from: number;
         to: number;
         text: string;
     }) => void;
-    search?: string;
+    i18n?: {
+        selectionButtonLabel: string;
+    };
 }
-export interface Observation {
-    id: number;
-    start: number;
-    end: number;
-    backgroundColor?: string;
+export interface Observation extends Omit<IBookmark, "onClick"> {
     color?: string;
 }
 export interface WordProps extends ISpanProps {
@@ -33,6 +34,6 @@ export interface WordProps extends ISpanProps {
     currentTime?: number;
     observations?: Observation[];
     text: string;
-    /** Adjusts the font size. By default font size is medium */
     size?: "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl";
+    tooltipContent?: (observations: Observation[]) => ReactNode;
 }

package/build/stories/highlight/demo-parts/data.d.ts

@@ -0,0 +1,55 @@
+export declare const DemoTranscript: {
+    metadata: {
+        transaction_key: string;
+        request_id: string;
+        sha256: string;
+        created: string;
+        duration: number;
+        channels: number;
+        models: string[];
+        model_info: {
+            "4accafca-a091-473d-8241-f5a847cb5766": {
+                name: string;
+                version: string;
+                arch: string;
+            };
+        };
+    };
+    results: {
+        channels: {
+            alternatives: {
+                transcript: string;
+                confidence: number;
+                words: {
+                    word: string;
+                    start: number;
+                    end: number;
+                    confidence: number;
+                    speaker: number;
+                    speaker_confidence: number;
+                    punctuated_word: string;
+                }[];
+                paragraphs: {
+                    transcript: string;
+                    paragraphs: {
+                        sentences: {
+                            text: string;
+                            start: number;
+                            end: number;
+                        }[];
+                        speaker: number;
+                        num_words: number;
+                        start: number;
+                        end: number;
+                        sentiment: number;
+                    }[];
+                };
+            }[];
+        }[];
+    };
+};
+export declare const DemoSentiment: {
+    role: string;
+    rate: number;
+    content: string;
+};

package/build/stories/highlight/demo-parts/sentiment-tag.d.ts

@@ -0,0 +1,7 @@
+export declare const getSentiment: (value: number) => {
+    color: string;
+    text: import("react/jsx-runtime").JSX.Element;
+} | {
+    color: string;
+    text: string;
+};

package/build/stories/highlight/demo-parts/transcript-base.d.ts

@@ -0,0 +1,5 @@
+import { StoryArgs } from "../index.stories";
+export declare const Transcript: (args: StoryArgs & {
+    currentTime: number;
+    offset: number;
+}) => import("react/jsx-runtime").JSX.Element;

package/build/stories/highlight/demo-parts/transcript-diarization.d.ts

@@ -0,0 +1,5 @@
+import { StoryArgs } from "../index.stories";
+export declare const TDiarization: (args: StoryArgs & {
+    currentTime: number;
+    offset: number;
+}) => import("react/jsx-runtime").JSX.Element;

package/build/stories/highlight/demo-parts/transcript-paragraph.d.ts

@@ -0,0 +1,5 @@
+import { StoryArgs } from "../index.stories";
+export declare const TParagraph: (args: StoryArgs & {
+    currentTime: number;
+    offset: number;
+}) => import("react/jsx-runtime").JSX.Element;

package/build/stories/highlight/demo-parts/transcript-sentiment.d.ts

@@ -0,0 +1,5 @@
+import { StoryArgs } from "../index.stories";
+export declare const TSentiment: (args: StoryArgs & {
+    currentTime: number;
+    offset: number;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,18 +1,17 @@
-/// <reference types="react" />
-import { HighlightArgs } from "./_types";
-interface StoryArgs extends HighlightArgs {
-    words: {
-        start: number;
-        end: number;
-        word: string;
+import { HighlightArgs, WordProps } from "./_types";
+export interface StoryArgs extends HighlightArgs {
+    words: Array<WordProps & {
         speaker: number;
-    }[];
+    }>;
     currentTime: number;
     includeSearch?: boolean;
 }
 export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, StoryArgs>;
-export declare const VideoSync: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, StoryArgs>;
+export declare const WithSelectionButton: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, StoryArgs>;
+export declare const WithTooltip: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, StoryArgs>;
 export declare const WithSearch: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, StoryArgs>;
+export declare const VideoSync: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, StoryArgs>;
+export declare const Demo: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, StoryArgs>;
 declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, HighlightArgs & {
     children?: import("react").ReactNode;
 }>;

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

@@ -1,4 +1,3 @@
-export declare const Searchable: ({ start, text, }: {
-    start: number;
+export declare const Searchable: ({ text, }: {
     text: string;
 }) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,14 +1,16 @@
-import { HTMLAttributes } from "react";
+import { HTMLAttributes, ReactNode } from "react";
 export interface PlayerArgs extends HTMLAttributes<HTMLVideoElement> {
     url: string;
     start?: number;
     end?: number;
-    enablePipOnScroll?: boolean;
+    pipMode?: "auto" | (() => boolean) | boolean;
+    onPipChange?: (isPip: boolean) => void;
     onCutHandler?: (time: number) => void;
     isCutting?: boolean;
     bookmarks?: IBookmark[];
     handleBookmarkUpdate?: (bookmark: IBookmark) => void;
     i18n?: PlayerI18n;
+    showControls?: boolean;
 }
 export interface PlayerI18n {
     beforeHighlight?: string;
@@ -20,9 +22,26 @@ export interface IBookmark {
     end: number;
     hue?: string;
     label?: string;
+    tooltipContent?: ReactNode;
+    isFocused?: boolean;
     onClick?: () => void;
+    tags?: VideoTag[];
 }
 export interface WrapperProps {
     isPlaying?: boolean;
     isLoaded?: boolean;
+    showControls?: boolean;
 }
+type VideoTag = {
+    group: {
+        id: number;
+        name: string;
+    };
+    tag: {
+        id: number;
+        name: string;
+        style: string;
+        usageNumber: number;
+    };
+};
+export {};

package/build/stories/player/hooks/usePictureInPicture.d.ts

@@ -0,0 +1,4 @@
+import { PlayerArgs } from "../_types";
+type PictureInPictureHook = (videoRef?: HTMLVideoElement | null, pipMode?: PlayerArgs["pipMode"], onPipChange?: PlayerArgs["onPipChange"]) => void;
+export declare const usePictureInPicture: PictureInPictureHook;
+export {};