@appquality/unguess-design-system 3.1.85 → 3.1.86-player-ref

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { PlaceholderOptions } from "@tiptap/extension-placeholder";
 import { BubbleMenuProps, EditorOptions } from "@tiptap/react";
 type validationStatus = "success" | "warning" | "error";
@@ -7,16 +8,18 @@ export type SuggestedUser = {
     email: string;
 };
 export interface ChatEditorArgs extends Partial<EditorOptions> {
+    author: Author;
+    messageBadFileFormat: string;
     placeholderOptions?: Partial<PlaceholderOptions>;
     hasFloatingMenu?: boolean;
     hasButtonsMenu?: boolean;
     bubbleOptions?: any;
-    author: Author;
     i18n?: {
         menu?: {
             bold?: string;
             italic?: string;
             mention?: string;
+            attachment?: string | React.ReactNode;
         };
         mention?: {
             noResults?: string;
@@ -35,6 +38,11 @@ export interface EditorHeaderArgs {
     title?: string;
     validation?: validationStatus;
 }
+export interface FileItem extends File {
+    isLoadingMedia: boolean;
+    isError?: boolean;
+    internal_id: string;
+}
 export interface FloatingMenuArgs extends Partial<BubbleMenuProps> {
 }
 export {};

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

@@ -1,17 +1,36 @@
 import { Editor } from "@tiptap/react";
 import React from "react";
-import { SuggestedUser } from "../_types";
+import { FileItem, SuggestedUser } from "../_types";
 export type ChatContextType = {
     triggerSave: () => void;
     editor?: Editor;
     setEditor: React.Dispatch<React.SetStateAction<Editor | undefined>>;
+    addThumbnails: (props: {
+        files: FileItem[];
+    }) => void;
+    removeThumbnail: (index: number) => void;
+    thumbnails: FileItem[];
     mentionableUsers: (props: {
         query: string;
     }) => SuggestedUser[];
+    afterUploadCallback: (failed: string[]) => void;
+    clearInput: () => void;
+    onDeleteThumbnail: (id: string) => void;
 };
 export declare const ChatContext: React.Context<ChatContextType | null>;
-export declare const ChatContextProvider: ({ onSave, setMentionableUsers, children, }: {
+export interface Data {
+    uploaded_ids?: {
+        id: number;
+    }[];
+    failed?: {
+        name: string;
+        errorCode: string;
+    }[];
+}
+export declare const ChatContextProvider: ({ onSave, onFileUpload, onDeleteThumbnail, setMentionableUsers, children, }: {
     onSave?: ((editor: Editor, mentions: SuggestedUser[]) => void) | undefined;
+    onFileUpload?: ((files: FileItem[]) => Promise<Data>) | undefined;
+    onDeleteThumbnail: (id: string) => void;
     children: React.ReactNode;
     setMentionableUsers: (props: {
         query: string;

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

@@ -1,7 +1,8 @@
-/// <reference types="react" />
 import { PlaceholderOptions } from "@tiptap/extension-placeholder";
 import { Editor as TipTapEditor } from "@tiptap/react";
-import { ChatEditorArgs, SuggestedUser } from "./_types";
+import { ChatEditorArgs, FileItem, SuggestedUser } from "./_types";
+import { MediaType } from "./parts/comment";
+import { Data } from "./context/chatContext";
 interface EditorStoryArgs extends ChatEditorArgs {
     children?: any;
     comments?: {
@@ -12,10 +13,12 @@ interface EditorStoryArgs extends ChatEditorArgs {
         };
         message: string;
         date: string;
+        media?: MediaType[];
     }[];
     editorText?: string;
     background?: string;
     onSave: (editor: TipTapEditor, mentions: SuggestedUser[]) => void;
+    onFileUpload?: (files: FileItem[]) => 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/ThumbnailContainer/DeleteThumbnailX.d.ts

@@ -0,0 +1,5 @@
+interface Props {
+    deleteThumbnail: (e: any) => void;
+}
+declare const DeleteThumbnailX: ({ deleteThumbnail }: Props) => import("react/jsx-runtime").JSX.Element;
+export default DeleteThumbnailX;

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

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

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

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

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

@@ -0,0 +1,13 @@
+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;
+}
+declare const ThumbnailContainer: ({ openLightbox }: Props) => import("react/jsx-runtime").JSX.Element | null;
+export default ThumbnailContainer;

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

@@ -1,7 +1,17 @@
 import { PropsWithChildren } from "react";
 import { Author } from "../_types";
-export declare const Comment: ({ author, message, children, date, }: PropsWithChildren<{
+export type MediaType = {
+    url: string;
+    id: number;
+    type: "image" | "video";
+};
+export declare const Comment: ({ author, message, children, date, media, header, }: PropsWithChildren<{
     author: Author;
     message: string;
     date: string;
+    media?: MediaType[] | undefined;
+    header: {
+        title: string;
+        message?: string | undefined;
+    };
 }>) => import("react/jsx-runtime").JSX.Element | null;

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

@@ -5,4 +5,4 @@ export declare const editorExtensions: ({ placeholderOptions, mentionableUsers,
         query: string;
     }) => SuggestedUser[];
     placeholderOptions?: Partial<PlaceholderOptions> | undefined;
-}) => (import("@tiptap/react").Extension<import("@tiptap/extension-typography").TypographyOptions, any> | import("@tiptap/react").Mark<import("@tiptap/extension-link").LinkOptions, any> | import("@tiptap/react").Extension<import("@tiptap/starter-kit").StarterKitOptions, any> | import("@tiptap/react").Extension<PlaceholderOptions, any> | import("@tiptap/react").Extension<import("@tiptap/extension-character-count").CharacterCountOptions, import("@tiptap/extension-character-count").CharacterCountStorage> | import("@tiptap/react").Node<import("@tiptap/extension-mention").MentionOptions, any>)[];
+}) => (import("@tiptap/react").Extension<import("@tiptap/extension-typography").TypographyOptions, any> | import("@tiptap/react").Mark<import("@tiptap/extension-link").LinkOptions, any> | import("@tiptap/react").Extension<import("@tiptap/starter-kit").StarterKitOptions, any> | import("@tiptap/react").Node<import("@tiptap/extension-image").ImageOptions, any> | import("@tiptap/react").Extension<import("@tiptap/extension-dropcursor").DropcursorOptions, any> | import("@tiptap/react").Extension<PlaceholderOptions, any> | import("@tiptap/react").Extension<import("@tiptap/extension-character-count").CharacterCountOptions, import("@tiptap/extension-character-count").CharacterCountStorage> | import("@tiptap/react").Node<import("@tiptap/extension-mention").MentionOptions, any>)[];

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 } from "./_types";
 interface StoryArgs extends HighlightArgs {
     words: {

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { PlayerArgs } from "./_types";
 interface PlayerStoryArgs extends PlayerArgs {
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appquality/unguess-design-system",
-  "version": "3.1.85",
+  "version": "3.1.86-player-ref",
   "description": "",
   "main": "build/index.js",
   "types": "build/index.d.ts",
@@ -37,6 +37,8 @@
     "@nivo/waffle": "^0.80.0",
     "@tiptap/extension-bubble-menu": "2.1.16",
     "@tiptap/extension-character-count": "2.1.16",
+    "@tiptap/extension-dropcursor": "^2.2.4",
+    "@tiptap/extension-image": "^2.2.4",
     "@tiptap/extension-link": "2.1.16",
     "@tiptap/extension-mention": "2.1.16",
     "@tiptap/extension-placeholder": "2.1.16",
@@ -66,7 +68,8 @@
     "react-slick": "^0.29.0",
     "react-window": "^1.8.6",
     "tippy.js": "^6.3.7",
-    "ua-parser-js": "^1.0.2"
+    "ua-parser-js": "^1.0.2",
+    "uuid": "^9.0.1"
   },
   "devDependencies": {
     "@babel/preset-env": "^7.21.5",
@@ -90,6 +93,7 @@
     "@types/react-window": "^1.8.5",
     "@types/styled-components": "^5.1.23",
     "@types/ua-parser-js": "^0.7.36",
+    "@types/uuid": "^9.0.8",
     "@zendeskgarden/react-dropdowns": "^8.49.0",
     "@zendeskgarden/react-forms": "^8.49.0",
     "@zendeskgarden/react-theming": "^8.48.2",