react-pro-messenger 1.0.11 → 1.0.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +5 -0
- package/dist/index.es.js +6037 -1539
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +18 -47
- package/dist/index.umd.js.map +1 -1
- package/dist/src/components/Button.d.ts +2 -0
- package/{types → dist/src}/components/ContextMenu/ContextMenu.d.ts +1 -1
- package/dist/src/components/Icons/DoubleCheckIcon.d.ts +3 -0
- package/dist/src/components/Icons/FileIcon.d.ts +3 -0
- package/dist/src/components/Icons/MicIcon.d.ts +3 -0
- package/dist/src/components/Icons/PlayIcon.d.ts +3 -0
- package/dist/src/components/Icons/PuaseIcon.d.ts +3 -0
- package/dist/src/components/Icons/SendIcon.d.ts +3 -0
- package/dist/src/components/Icons/SpeechBubbleCornerIcon.d.ts +3 -0
- package/{types → dist/src}/components/Input/Input.d.ts +3 -2
- package/{types → dist/src}/components/Media/Media.d.ts +2 -1
- package/{types → dist/src}/components/Media/Voice/Voice.d.ts +2 -1
- package/{types → dist/src}/components/Message/LeftSide/LeftSide.d.ts +2 -2
- package/{types → dist/src}/components/Message/RightSide/RightSide.d.ts +2 -2
- package/{types → dist/src}/features/Chat/index.d.ts +2 -2
- package/{types → dist/src}/features/Chat/logic.d.ts +1 -1
- package/{types → dist/src}/ts/interfaces.d.ts +2 -2
- package/dist/src/vite-env.d.ts +1 -0
- package/dist/style.css +1 -0
- package/package.json +29 -33
- package/README.md +0 -240
- package/dist/react-pro-messenger.css +0 -1
- package/dist/vite.svg +0 -1
- package/types/App.d.ts +0 -20
- package/types/components/Icons/DoubleCheckIcon.d.ts +0 -2
- package/types/components/Icons/FileIcon.d.ts +0 -2
- package/types/components/Icons/MicIcon.d.ts +0 -2
- package/types/components/Icons/PlayIcon.d.ts +0 -3
- package/types/components/Icons/PuaseIcon.d.ts +0 -3
- package/types/components/Icons/SendIcon.d.ts +0 -2
- package/types/components/Icons/SpeechBubbleCornerIcon.d.ts +0 -2
- package/types/components/Tasks/Tasks.d.ts +0 -11
- package/types/index.d.ts +0 -4
- package/types/main.d.ts +0 -1
- /package/{types → dist/src}/components/ConformaitionModal/ConformationModal.d.ts +0 -0
- /package/{types → dist/src}/components/Media/File/File.d.ts +0 -0
- /package/{types → dist/src}/domain/MessageEntity.d.ts +0 -0
- /package/{types → dist/src}/ts/enum.d.ts +0 -0
|
@@ -1,8 +1,9 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import { SymbolAssignment } from "../../ts/interfaces";
|
|
2
3
|
declare const ChatInput: ({ onSendMessage, onSendVoice, onFileSend, dynamicSymbolAssignments, }: {
|
|
3
4
|
onSendMessage: (newMessage: string) => void;
|
|
4
5
|
onSendVoice: (voiceBlobUrl: string) => void;
|
|
5
6
|
onFileSend: (blob: Blob) => void;
|
|
6
|
-
dynamicSymbolAssignments?: SymbolAssignment<any>[];
|
|
7
|
-
}) =>
|
|
7
|
+
dynamicSymbolAssignments?: SymbolAssignment<any>[] | undefined;
|
|
8
|
+
}) => JSX.Element;
|
|
8
9
|
export default ChatInput;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import { AttachmentTypeEnum } from "../../ts/enum";
|
|
2
3
|
interface MediaProps {
|
|
3
4
|
attachment: string;
|
|
4
5
|
attachmentType?: AttachmentTypeEnum;
|
|
5
6
|
}
|
|
6
|
-
declare const Media: ({ attachment, attachmentType }: MediaProps) =>
|
|
7
|
+
declare const Media: ({ attachment, attachmentType }: MediaProps) => JSX.Element | null;
|
|
7
8
|
export default Media;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
interface VoicePlayerProps {
|
|
2
3
|
src: string;
|
|
3
4
|
className?: string;
|
|
4
5
|
}
|
|
5
|
-
declare const VoicePlayer: ({ src, className }: VoicePlayerProps) =>
|
|
6
|
+
declare const VoicePlayer: ({ src, className }: VoicePlayerProps) => JSX.Element;
|
|
6
7
|
export default VoicePlayer;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { MessageEntity } from "../../../domain/MessageEntity";
|
|
3
3
|
declare const LeftSide: ({ message, showUserProfile, handleContextMenu, media, }: {
|
|
4
|
-
media:
|
|
4
|
+
media: JSX.Element | null;
|
|
5
5
|
message: MessageEntity;
|
|
6
6
|
showUserProfile: boolean;
|
|
7
7
|
handleContextMenu: (event: React.MouseEvent, message: MessageEntity) => void;
|
|
8
|
-
}) =>
|
|
8
|
+
}) => JSX.Element;
|
|
9
9
|
export default LeftSide;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { MessageEntity } from "../../../domain/MessageEntity";
|
|
3
3
|
declare const RightSide: ({ handleContextMenu, media, message, }: {
|
|
4
|
-
media:
|
|
4
|
+
media: JSX.Element | null;
|
|
5
5
|
message: MessageEntity;
|
|
6
6
|
handleContextMenu: (event: React.MouseEvent, message: MessageEntity) => void;
|
|
7
|
-
}) =>
|
|
7
|
+
}) => JSX.Element;
|
|
8
8
|
export default RightSide;
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { MessageEntity } from "../../domain/MessageEntity";
|
|
3
|
-
import "../../index.css";
|
|
4
3
|
import { SymbolAssignment, UserInterface } from "../../ts/interfaces";
|
|
5
4
|
export interface ChatPropsInterface {
|
|
6
5
|
messages: MessageEntity[];
|
|
@@ -8,6 +7,7 @@ export interface ChatPropsInterface {
|
|
|
8
7
|
width?: string;
|
|
9
8
|
height?: string;
|
|
10
9
|
className?: string;
|
|
10
|
+
backgroundImage?: string;
|
|
11
11
|
style?: React.CSSProperties;
|
|
12
12
|
updateMessages: (messages: MessageEntity[]) => void;
|
|
13
13
|
onMessageSent: (message: MessageEntity) => void;
|
|
@@ -15,5 +15,5 @@ export interface ChatPropsInterface {
|
|
|
15
15
|
onDeleteMessage: (id: string) => void;
|
|
16
16
|
onEditMessage: (id: string) => void;
|
|
17
17
|
}
|
|
18
|
-
declare const Chat: ({ width, height, className, style, messages, user, updateMessages, onMessageSent, onDeleteMessage, onEditMessage, dynamicSymbolAssignments, }: ChatPropsInterface) =>
|
|
18
|
+
declare const Chat: ({ width, height, className, style, messages, user, updateMessages, onMessageSent, onDeleteMessage, onEditMessage, dynamicSymbolAssignments, backgroundImage, }: ChatPropsInterface) => JSX.Element;
|
|
19
19
|
export default Chat;
|
|
@@ -23,7 +23,7 @@ declare const Logic: ({ user, messages, updateMessages, onMessageSent, onEditMes
|
|
|
23
23
|
y: number;
|
|
24
24
|
message: MessageEntity | null;
|
|
25
25
|
} | null;
|
|
26
|
-
chatRef: React.RefObject<HTMLDivElement
|
|
26
|
+
chatRef: React.RefObject<HTMLDivElement>;
|
|
27
27
|
setIsModalOpen: React.Dispatch<React.SetStateAction<boolean>>;
|
|
28
28
|
};
|
|
29
29
|
export default Logic;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
2
|
export interface UserInterface {
|
|
3
3
|
id: string;
|
|
4
4
|
profileImageUrl?: string;
|
|
@@ -11,7 +11,7 @@ export interface SymbolAssignment<T = any> {
|
|
|
11
11
|
component?: ({ onClick, listsProps, }: {
|
|
12
12
|
onClick: (id: string, value: string) => void;
|
|
13
13
|
listsProps: T;
|
|
14
|
-
}) =>
|
|
14
|
+
}) => JSX.Element;
|
|
15
15
|
lists?: T[];
|
|
16
16
|
pagNumber: number;
|
|
17
17
|
updatePageNumber: (newPage: number) => void;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
/// <reference types="vite/client" />
|
package/dist/style.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.left-1\/2{left:50%}.top-1\/2{top:50%}.top-0{top:0px}.right-0{right:0px}.left-0{left:0px}.bottom-0{bottom:0px}.right-4{right:1rem}.top-\[11px\]{top:11px}.-right-\[11\.4px\]{right:-11.4px}.top-5{top:1.25rem}.bottom-full{bottom:100%}.top-1{top:.25rem}.-left-2{left:-.5rem}.-right-2{right:-.5rem}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.ml-2{margin-left:.5rem}.mb-2{margin-bottom:.5rem}.mt-1{margin-top:.25rem}.mr-3{margin-right:.75rem}.flex{display:flex}.inline-flex{display:inline-flex}.h-full{height:100%}.h-8{height:2rem}.h-3{height:.75rem}.h-11{height:2.75rem}.h-9{height:2.25rem}.h-2{height:.5rem}.h-12{height:3rem}.max-h-full{max-height:100%}.max-h-60{max-height:15rem}.w-full{width:100%}.w-8{width:2rem}.w-3{width:.75rem}.w-\[90\%\]{width:90%}.w-9{width:2.25rem}.w-12{width:3rem}.w-3\/4{width:75%}.w-fit{width:-moz-fit-content;width:fit-content}.max-w-2xl{max-width:42rem}.max-w-sm{max-width:24rem}.flex-1{flex:1 1 0%}.flex-grow{flex-grow:1}.-translate-x-1\/2{--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-rotate-180{--tw-rotate: -180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-x-\[-1\]{--tw-scale-x: -1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-1{gap:.25rem}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.self-end{align-self:flex-end}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-y-scroll{overflow-y:scroll}.rounded-lg{border-radius:.5rem}.rounded{border-radius:.25rem}.rounded-md{border-radius:.375rem}.rounded-3xl{border-radius:1.5rem}.rounded-full{border-radius:9999px}.rounded-xl{border-radius:.75rem}.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.rounded-b{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.rounded-tl-3xl{border-top-left-radius:1.5rem}.rounded-tr-2xl{border-top-right-radius:1rem}.rounded-bl-3xl{border-bottom-left-radius:1.5rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-gray-200{--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.border-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity))}.bg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))}.bg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity))}.bg-\[rgb\(0\,0\,0\,0\.6\)\]{background-color:#0009}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.bg-transparent{background-color:transparent}.bg-blue-700{--tw-bg-opacity: 1;background-color:rgb(29 78 216 / var(--tw-bg-opacity))}.bg-green-500{--tw-bg-opacity: 1;background-color:rgb(34 197 94 / var(--tw-bg-opacity))}.bg-gray-700{--tw-bg-opacity: 1;background-color:rgb(55 65 81 / var(--tw-bg-opacity))}.bg-gray-300{--tw-bg-opacity: 1;background-color:rgb(209 213 219 / var(--tw-bg-opacity))}.bg-green-200{--tw-bg-opacity: 1;background-color:rgb(187 247 208 / var(--tw-bg-opacity))}.bg-blue-200{--tw-bg-opacity: 1;background-color:rgb(191 219 254 / var(--tw-bg-opacity))}.\!bg-cover{background-size:cover!important}.fill-gray-200{fill:#e5e7eb}.fill-blue-200{fill:#bfdbfe}.p-4{padding:1rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.pr-4{padding-right:1rem}.pl-4{padding-left:1rem}.pb-2{padding-bottom:.5rem}.pb-16{padding-bottom:4rem}.pr-\[22px\]{padding-right:22px}.pl-1{padding-left:.25rem}.pl-\[1\.5px\]{padding-left:1.5px}.pt-5{padding-top:1.25rem}.text-left{text-align:left}.text-center{text-align:center}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.text-\[10px\]{font-size:10px}.font-bold{font-weight:700}.font-semibold{font-weight:600}.font-medium{font-weight:500}.leading-relaxed{line-height:1.625}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.text-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity))}.text-gray-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}.text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.text-black{--tw-text-opacity: 1;color:rgb(0 0 0 / var(--tw-text-opacity))}.text-blue-400{--tw-text-opacity: 1;color:rgb(96 165 250 / var(--tw-text-opacity))}.text-gray-800{--tw-text-opacity: 1;color:rgb(31 41 55 / var(--tw-text-opacity))}.text-blue-500{--tw-text-opacity: 1;color:rgb(59 130 246 / var(--tw-text-opacity))}.text-gray-600{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity))}.text-red-600{--tw-text-opacity: 1;color:rgb(220 38 38 / var(--tw-text-opacity))}.text-green-600{--tw-text-opacity: 1;color:rgb(22 163 74 / var(--tw-text-opacity))}.text-blue-600{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity))}.text-green-500{--tw-text-opacity: 1;color:rgb(34 197 94 / var(--tw-text-opacity))}.text-red-500{--tw-text-opacity: 1;color:rgb(239 68 68 / var(--tw-text-opacity))}.text-orange-400{--tw-text-opacity: 1;color:rgb(251 146 60 / var(--tw-text-opacity))}.text-orange-700{--tw-text-opacity: 1;color:rgb(194 65 12 / var(--tw-text-opacity))}.shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-xl{--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:rgba(255,255,255,.5);border-radius:4px}::-webkit-scrollbar-button{display:none}*{scrollbar-width:thin;scrollbar-color:rgba(87,87,87,.5) transparent}.rows-wrapper .bubble-tail{position:absolute;bottom:-1px;inset-inline-end:-8.4px;width:11px;height:20px;fill:var(--surface-color);transform:scaleX(calc(var(--reflect) * -1))}.hover\:bg-blue-700:hover{--tw-bg-opacity: 1;background-color:rgb(29 78 216 / var(--tw-bg-opacity))}.hover\:bg-gray-200:hover{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity))}.hover\:bg-blue-800:hover{--tw-bg-opacity: 1;background-color:rgb(30 64 175 / var(--tw-bg-opacity))}.hover\:bg-gray-100:hover{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))}.hover\:bg-blue-600:hover{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity))}.hover\:bg-green-600:hover{--tw-bg-opacity: 1;background-color:rgb(22 163 74 / var(--tw-bg-opacity))}.hover\:bg-gray-600:hover{--tw-bg-opacity: 1;background-color:rgb(75 85 99 / var(--tw-bg-opacity))}.hover\:text-gray-900:hover{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity))}.hover\:text-blue-700:hover{--tw-text-opacity: 1;color:rgb(29 78 216 / var(--tw-text-opacity))}.hover\:text-gray-700:hover{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity))}.hover\:underline:hover{text-decoration-line:underline}.focus\:z-10:focus{z-index:10}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-4:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-blue-300:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(147 197 253 / var(--tw-ring-opacity))}.focus\:ring-gray-100:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(243 244 246 / var(--tw-ring-opacity))}@media (prefers-color-scheme: dark){.dark\:border-gray-600{--tw-border-opacity: 1;border-color:rgb(75 85 99 / var(--tw-border-opacity))}.dark\:bg-gray-700{--tw-bg-opacity: 1;background-color:rgb(55 65 81 / var(--tw-bg-opacity))}.dark\:bg-blue-600{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity))}.dark\:bg-gray-800{--tw-bg-opacity: 1;background-color:rgb(31 41 55 / var(--tw-bg-opacity))}.dark\:text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.dark\:text-gray-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}.dark\:hover\:bg-blue-700:hover{--tw-bg-opacity: 1;background-color:rgb(29 78 216 / var(--tw-bg-opacity))}.dark\:hover\:bg-gray-700:hover{--tw-bg-opacity: 1;background-color:rgb(55 65 81 / var(--tw-bg-opacity))}.dark\:hover\:text-white:hover{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.dark\:focus\:ring-blue-800:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(30 64 175 / var(--tw-ring-opacity))}.dark\:focus\:ring-gray-700:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(55 65 81 / var(--tw-ring-opacity))}}@media (min-width: 768px){.md\:inset-0{top:0px;right:0px;bottom:0px;left:0px}.md\:max-w-\[400px\]{max-width:400px}.md\:p-5{padding:1.25rem}}.\[\&\>g\>path\]\:fill-green-200>g>path{fill:#bbf7d0}.\[\&\>g\>path\]\:fill-blue-200>g>path{fill:#bfdbfe}
|
package/package.json
CHANGED
|
@@ -1,50 +1,46 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-pro-messenger",
|
|
3
|
-
"version": "1.0.11",
|
|
4
3
|
"description": "Telegram-style chat component for React",
|
|
4
|
+
"private": false,
|
|
5
|
+
"version": "1.0.13",
|
|
5
6
|
"type": "module",
|
|
6
7
|
"main": "dist/index.umd.js",
|
|
7
8
|
"module": "dist/index.es.js",
|
|
8
|
-
"types": "
|
|
9
|
+
"types": "dist/index.d.ts",
|
|
10
|
+
"exports": {
|
|
11
|
+
".": {
|
|
12
|
+
"import": "./dist/index.es.js",
|
|
13
|
+
"require": "./dist/index.umd.js",
|
|
14
|
+
"types": "./dist/index.d.ts"
|
|
15
|
+
}
|
|
16
|
+
},
|
|
9
17
|
"files": [
|
|
10
|
-
"dist"
|
|
11
|
-
"types"
|
|
18
|
+
"/dist"
|
|
12
19
|
],
|
|
20
|
+
"publishConfig": {
|
|
21
|
+
"access": "public"
|
|
22
|
+
},
|
|
13
23
|
"scripts": {
|
|
14
24
|
"dev": "vite --open",
|
|
15
25
|
"build": "tsc && vite build",
|
|
16
|
-
"
|
|
17
|
-
"
|
|
26
|
+
"prepare": "npm run build",
|
|
27
|
+
"preview": "vite preview"
|
|
18
28
|
},
|
|
19
|
-
"
|
|
20
|
-
"framer-motion": "^12.
|
|
29
|
+
"dependencies": {
|
|
30
|
+
"framer-motion": "^12.4.7",
|
|
21
31
|
"react": "^18.2.0",
|
|
22
|
-
"react-dom": "^18.2.0"
|
|
23
|
-
},
|
|
24
|
-
"devDependencies": {
|
|
25
|
-
"@tailwindcss/vite": "^4.0.6",
|
|
26
|
-
"@types/jest": "^29.5.12",
|
|
27
|
-
"@types/react": "^19.0.8",
|
|
28
|
-
"@types/react-dom": "^19.0.3",
|
|
29
|
-
"@vitejs/plugin-react-swc": "^3.5.0",
|
|
30
|
-
"jest": "^29.7.0",
|
|
32
|
+
"react-dom": "^18.2.0",
|
|
31
33
|
"react-feather": "^2.0.10",
|
|
32
|
-
"
|
|
33
|
-
"tailwindcss": "^3.4.17",
|
|
34
|
-
"typescript": "~5.7.2",
|
|
35
|
-
"vite": "^6.1.0"
|
|
34
|
+
"tailwindcss": "^3.2.4"
|
|
36
35
|
},
|
|
37
|
-
"
|
|
38
|
-
"react",
|
|
39
|
-
"
|
|
40
|
-
"
|
|
41
|
-
"
|
|
42
|
-
"
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
"repository": {
|
|
47
|
-
"type": "git",
|
|
48
|
-
"url": "https://github.com/yourusername/react-pro-messenger.git"
|
|
36
|
+
"devDependencies": {
|
|
37
|
+
"@types/react": "^18.0.26",
|
|
38
|
+
"@types/react-dom": "^18.0.9",
|
|
39
|
+
"@vitejs/plugin-react-swc": "^3.0.0",
|
|
40
|
+
"autoprefixer": "^10.4.13",
|
|
41
|
+
"postcss": "^8.4.20",
|
|
42
|
+
"typescript": "^4.9.3",
|
|
43
|
+
"vite": "^4.0.0",
|
|
44
|
+
"vite-plugin-dts": "^1.7.1"
|
|
49
45
|
}
|
|
50
46
|
}
|
package/README.md
DELETED
|
@@ -1,240 +0,0 @@
|
|
|
1
|
-
## React Pro Messenger
|
|
2
|
-
|
|
3
|
-
A feature-rich chat component with Telegram-inspired UI and modern messaging features.
|
|
4
|
-
|
|
5
|
-
  
|
|
6
|
-
|
|
7
|
-
---
|
|
8
|
-
|
|
9
|
-
## Features ✨
|
|
10
|
-
|
|
11
|
-
### Core Functionality
|
|
12
|
-
|
|
13
|
-
- Telegram-style messaging interface
|
|
14
|
-
- Multi-user chat support
|
|
15
|
-
- Message history with scroll
|
|
16
|
-
- Responsive design
|
|
17
|
-
|
|
18
|
-
### Message Types
|
|
19
|
-
|
|
20
|
-
- **Text messages** with formatting
|
|
21
|
-
- **Voice messages** with audio player
|
|
22
|
-
- **File attachments** (images, documents)
|
|
23
|
-
- **Symbol integration** (@mentions, #tasks)
|
|
24
|
-
|
|
25
|
-
### Interactive Features
|
|
26
|
-
|
|
27
|
-
- Context menu for message actions
|
|
28
|
-
- Delete/edit message functionality
|
|
29
|
-
- Dynamic symbol recognition:(for example :)
|
|
30
|
-
- `@` for user mentions
|
|
31
|
-
- `#` for task references
|
|
32
|
-
- Animated message transitions
|
|
33
|
-
|
|
34
|
-
---
|
|
35
|
-
|
|
36
|
-
## Installation 📦
|
|
37
|
-
|
|
38
|
-
```bash
|
|
39
|
-
npm install react-pro-messenger
|
|
40
|
-
```
|
|
41
|
-
|
|
42
|
-
# or
|
|
43
|
-
|
|
44
|
-
```bash
|
|
45
|
-
yarn add react-pro-messenger
|
|
46
|
-
```
|
|
47
|
-
|
|
48
|
-
## Basic Usage 🚀
|
|
49
|
-
|
|
50
|
-
```tsx
|
|
51
|
-
import { Chat, MessageEntity } from "react-pro-messenger";
|
|
52
|
-
|
|
53
|
-
const App = () => {
|
|
54
|
-
const [messages, setMessages] = useState<MessageEntity[]>(initialMessages);
|
|
55
|
-
const currentUser = { id: "user-1", fullName: "John Doe" };
|
|
56
|
-
|
|
57
|
-
return (
|
|
58
|
-
<Chat
|
|
59
|
-
messages={messages}
|
|
60
|
-
user={currentUser}
|
|
61
|
-
onMessageSent={(newMsg) => setMessages([...messages, newMsg])}
|
|
62
|
-
onDeleteMessage={(id) =>
|
|
63
|
-
setMessages(messages.filter((msg) => msg.id !== id))
|
|
64
|
-
}
|
|
65
|
-
/>
|
|
66
|
-
);
|
|
67
|
-
};
|
|
68
|
-
```
|
|
69
|
-
|
|
70
|
-
## Component Props ⚙️
|
|
71
|
-
|
|
72
|
-
### Chat Component Configuration
|
|
73
|
-
|
|
74
|
-
| Prop | Type | Default | Description |
|
|
75
|
-
| -------------------------- | -------------------- | ------------ | ------------------------- |
|
|
76
|
-
| `messages` | `MessageEntity[]` | **Required** | Array of message objects |
|
|
77
|
-
| `user` | `UserInterface` | **Required** | Current user details |
|
|
78
|
-
| `width` | `string` | `"400px"` | Container width |
|
|
79
|
-
| `height` | `string` | `"600px"` | Container height |
|
|
80
|
-
| `dynamicSymbolAssignments` | `SymbolAssignment[]` | `[]` | Symbol-component mappings |
|
|
81
|
-
| `className` | `string` | `""` | Additional CSS classes |
|
|
82
|
-
|
|
83
|
-
**Key**:
|
|
84
|
-
📌 `Type` = Expected prop type
|
|
85
|
-
📌 `Default` = Default value if not required
|
|
86
|
-
📌 **Required** = Must be provided
|
|
87
|
-
|
|
88
|
-
## Customization 🎨
|
|
89
|
-
|
|
90
|
-
Symbol Integration
|
|
91
|
-
|
|
92
|
-
```tsx
|
|
93
|
-
const taskComponent = ({ listsProps, onClick }) => (
|
|
94
|
-
<div className="task-item">
|
|
95
|
-
<span>📌</span>
|
|
96
|
-
<p>{listsProps.name}</p>
|
|
97
|
-
</div>
|
|
98
|
-
);
|
|
99
|
-
|
|
100
|
-
<Chat
|
|
101
|
-
dynamicSymbolAssignments={[
|
|
102
|
-
{
|
|
103
|
-
symbol: "#",
|
|
104
|
-
component: taskComponent,
|
|
105
|
-
lists: tasksList,
|
|
106
|
-
},
|
|
107
|
-
]}
|
|
108
|
-
/>;
|
|
109
|
-
```
|
|
110
|
-
|
|
111
|
-
# Basic Usage 💻
|
|
112
|
-
|
|
113
|
-
```tsx
|
|
114
|
-
Copy;
|
|
115
|
-
import { Chat, MessageEntity } from "react-pro-messenger";
|
|
116
|
-
import { useState } from "react";
|
|
117
|
-
|
|
118
|
-
function App() {
|
|
119
|
-
const [messages, setMessages] = useState<MessageEntity[]>([]);
|
|
120
|
-
const currentUser = { id: "user-1", fullName: "John Doe" };
|
|
121
|
-
|
|
122
|
-
return (
|
|
123
|
-
<div className="h-[600px] w-[400px]">
|
|
124
|
-
<Chat
|
|
125
|
-
messages={messages}
|
|
126
|
-
user={currentUser}
|
|
127
|
-
onMessageSent={(newMsg) => setMessages([...messages, newMsg])}
|
|
128
|
-
onDeleteMessage={(id) =>
|
|
129
|
-
setMessages(messages.filter((msg) => msg.id !== id))
|
|
130
|
-
}
|
|
131
|
-
/>
|
|
132
|
-
</div>
|
|
133
|
-
);
|
|
134
|
-
}
|
|
135
|
-
```
|
|
136
|
-
|
|
137
|
-
## Dynamic Symbol Integration (@/#) 🔠
|
|
138
|
-
|
|
139
|
-
```tsx
|
|
140
|
-
Copy;
|
|
141
|
-
import { Tasks, User } from "react-pro-messenger";
|
|
142
|
-
|
|
143
|
-
// In your main component
|
|
144
|
-
<Chat
|
|
145
|
-
dynamicSymbolAssignments={[
|
|
146
|
-
{
|
|
147
|
-
symbol: "#",
|
|
148
|
-
component: ({ listsProps, onClick }) => (
|
|
149
|
-
<Tasks task={listsProps} onClick={onClick} />
|
|
150
|
-
),
|
|
151
|
-
lists: yourTasksList,
|
|
152
|
-
},
|
|
153
|
-
{
|
|
154
|
-
symbol: "@",
|
|
155
|
-
component: ({ listsProps, onClick }) => (
|
|
156
|
-
<User user={listsProps} onClick={onClick} />
|
|
157
|
-
),
|
|
158
|
-
lists: yourUsersList,
|
|
159
|
-
},
|
|
160
|
-
]}
|
|
161
|
-
/>;
|
|
162
|
-
```
|
|
163
|
-
|
|
164
|
-
## Sending Messages Example 📩
|
|
165
|
-
|
|
166
|
-
```tsx
|
|
167
|
-
Copy;
|
|
168
|
-
// Create new message
|
|
169
|
-
const newMessage = new MessageEntity({
|
|
170
|
-
id: Date.now().toString(),
|
|
171
|
-
text: "Hello World!",
|
|
172
|
-
createdDate: new Date().toISOString(),
|
|
173
|
-
user: currentUser,
|
|
174
|
-
isRightSided: true,
|
|
175
|
-
});
|
|
176
|
-
|
|
177
|
-
// Add to messages array
|
|
178
|
-
setMessages((prev) => [...prev, newMessage]);
|
|
179
|
-
```
|
|
180
|
-
|
|
181
|
-
## Advanced Features 🚀
|
|
182
|
-
|
|
183
|
-
1. Custom Styling
|
|
184
|
-
|
|
185
|
-
```tsx
|
|
186
|
-
<Chat
|
|
187
|
-
className="custom-chat-styles"
|
|
188
|
-
dynamicSymbolAssignments={
|
|
189
|
-
[
|
|
190
|
-
/*...*/
|
|
191
|
-
]
|
|
192
|
-
}
|
|
193
|
-
// Add Tailwind classes or CSS modules
|
|
194
|
-
style={{
|
|
195
|
-
"--message-bg": "#f0f4ff",
|
|
196
|
-
"--user-color": "#1a237e",
|
|
197
|
-
}}
|
|
198
|
-
/>
|
|
199
|
-
```
|
|
200
|
-
|
|
201
|
-
2. Context Menu Handling
|
|
202
|
-
|
|
203
|
-
```tsx
|
|
204
|
-
const handleDelete = (messageId: string) => {
|
|
205
|
-
setMessages(messages.filter((msg) => msg.id !== messageId));
|
|
206
|
-
};
|
|
207
|
-
|
|
208
|
-
const handleEdit = (messageId: string) => {
|
|
209
|
-
// Your edit logic
|
|
210
|
-
};
|
|
211
|
-
|
|
212
|
-
<Chat onDeleteMessage={handleDelete} onEditMessage={handleEdit} />;
|
|
213
|
-
```
|
|
214
|
-
|
|
215
|
-
## Contributing 🤝
|
|
216
|
-
|
|
217
|
-
Fork the repository
|
|
218
|
-
|
|
219
|
-
Create feature branch:
|
|
220
|
-
|
|
221
|
-
```bash
|
|
222
|
-
git checkout -b feature/new-feature
|
|
223
|
-
```
|
|
224
|
-
|
|
225
|
-
Commit changes:
|
|
226
|
-
|
|
227
|
-
```bash
|
|
228
|
-
git commit -m 'Add awesome feature'
|
|
229
|
-
```
|
|
230
|
-
|
|
231
|
-
Push to branch:
|
|
232
|
-
|
|
233
|
-
```bash
|
|
234
|
-
git push origin feature/new-feature
|
|
235
|
-
```
|
|
236
|
-
|
|
237
|
-
Open a Pull Request
|
|
238
|
-
|
|
239
|
-
License 📜
|
|
240
|
-
MIT License © 2023 [mahdij98]
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
/*! tailwindcss v4.0.6 | MIT License | https://tailwindcss.com */.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.top-\[11px\]{top:11px}.-right-\[11\.4px\]{right:-11.4px}.bottom-full{bottom:100%}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.h-full{height:100%}.max-h-full{max-height:100%}.w-3\/4{width:75%}.w-\[90\%\]{width:90%}.w-fit{width:fit-content}.w-full{width:100%}.max-w-3\/4{max-width:75%}.flex-1{flex:1}.shrink{flex-shrink:1}.flex-grow,.grow{flex-grow:1}.scale-x-\[-1\]{--tw-scale-x:-1;scale:var(--tw-scale-x)var(--tw-scale-y)}.-rotate-180{rotate:-180deg}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x)var(--tw-rotate-y)var(--tw-rotate-z)var(--tw-skew-x)var(--tw-skew-y)}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.self-end{align-self:flex-end}.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.overflow-y-scroll{overflow-y:scroll}.rounded-full{border-radius:3.40282e38px}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.bg-\[rgb\(0\,0\,0\,0\.6\)\]{background-color:#0009}.bg-transparent{background-color:#0000}.\!bg-cover{background-size:cover!important}.pr-\[22px\]{padding-right:22px}.pl-\[1\.5px\]{padding-left:1.5px}.text-center{text-align:center}.text-left{text-align:left}.text-\[10px\]{font-size:10px}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.transition-discrete{transition-behavior:allow-discrete}.outline-none{--tw-outline-style:none;outline-style:none}@media (hover:hover){.hover\:underline:hover{text-decoration-line:underline}}.focus\:z-10:focus{z-index:10}.focus\:ring-4:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(4px + var(--tw-ring-offset-width))var(--tw-ring-color,currentColor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff80;border-radius:4px}::-webkit-scrollbar-button{display:none}*{scrollbar-width:thin;scrollbar-color:#57575780 transparent}.rows-wrapper .bubble-tail{width:11px;height:20px;fill:var(--surface-color);transform:scaleX(calc(var(--reflect)*-1));bottom:-1px;position:absolute;inset-inline-end:-8.4px}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-rotate-x{syntax:"*";inherits:false;initial-value:rotateX(0)}@property --tw-rotate-y{syntax:"*";inherits:false;initial-value:rotateY(0)}@property --tw-rotate-z{syntax:"*";inherits:false;initial-value:rotateZ(0)}@property --tw-skew-x{syntax:"*";inherits:false;initial-value:skewX(0)}@property --tw-skew-y{syntax:"*";inherits:false;initial-value:skewY(0)}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}
|
package/dist/vite.svg
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
package/types/App.d.ts
DELETED
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
export interface TaskInterface {
|
|
2
|
-
id: string;
|
|
3
|
-
name: string;
|
|
4
|
-
}
|
|
5
|
-
export interface TasksProps {
|
|
6
|
-
symbol?: string;
|
|
7
|
-
task: TaskInterface;
|
|
8
|
-
onClick: (id: string, text: string) => void;
|
|
9
|
-
}
|
|
10
|
-
export interface UserPropsInterface {
|
|
11
|
-
id: string;
|
|
12
|
-
name: string;
|
|
13
|
-
}
|
|
14
|
-
export interface UserProps {
|
|
15
|
-
symbol?: string;
|
|
16
|
-
user: UserPropsInterface;
|
|
17
|
-
onClick: (id: string, value: string) => void;
|
|
18
|
-
}
|
|
19
|
-
declare function App(): import("react/jsx-runtime").JSX.Element;
|
|
20
|
-
export default App;
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
export interface TaskInterface {
|
|
2
|
-
id: string;
|
|
3
|
-
name: string;
|
|
4
|
-
}
|
|
5
|
-
export interface TasksProps {
|
|
6
|
-
symbol?: string;
|
|
7
|
-
task: TaskInterface;
|
|
8
|
-
onClick: (id: string, text: string) => void;
|
|
9
|
-
}
|
|
10
|
-
declare const Tasks: ({ symbol, onClick, task }: TasksProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
|
-
export default Tasks;
|
package/types/index.d.ts
DELETED
package/types/main.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./index.css";
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|