@appquality/unguess-design-system 3.1.60 → 3.1.62

package/CHANGELOG.md

@@ -1,3 +1,29 @@
+# v3.1.62 (Tue Jan 02 2024)
+
+#### 🐛 Bug Fix
+
+- [CHAT] Improvements and fixes [#290](https://github.com/AppQuality/unguess-design-system/pull/290) ([@cannarocks](https://github.com/cannarocks))
+- fix(chat): add clear from external save and fix shrinked avat [#289](https://github.com/AppQuality/unguess-design-system/pull/289) ([@cannarocks](https://github.com/cannarocks))
+
+#### Authors: 1
+
+- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
+
+---
+
+# v3.1.61 (Fri Dec 29 2023)
+
+#### 🐛 Bug Fix
+
+- Improve chat spacing and save behaviour [#288](https://github.com/AppQuality/unguess-design-system/pull/288) ([@cannarocks](https://github.com/cannarocks))
+- Update-chat-spaces [#287](https://github.com/AppQuality/unguess-design-system/pull/287) ([@cannarocks](https://github.com/cannarocks))
+
+#### Authors: 1
+
+- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
+
+---
+
 # v3.1.60 (Fri Dec 29 2023)
 
 #### 🐛 Bug Fix

package/build/index.js

@@ -2289,6 +2289,7 @@ const ChatContextProvider = ({ onSave, children, }) => {
         triggerSave: () => {
             if (editor && onSave) {
                 onSave(editor);
+                editor.commands.clearContent();
             }
         },
     }), [comment, setComment, isEditing, setIsEditing, editor, setEditor, onSave]);
@@ -2302,18 +2303,18 @@ const useChatContext = () => {
 };
 
 const ChatContainer = styled__default["default"](Card) `
-  padding: ${({ theme }) => theme.space.md};
+  padding: ${({ theme }) => `0 ${theme.space.base * 4}px`};
   &:hover {
     box-shadow: none;
   }
   cursor: default;
 `;
 const MessagesContainer = styled__default["default"].div `
-  padding: ${({ theme }) => theme.space.md};
-  margin: ${({ theme }) => `0 -${theme.space.md}`};
+  padding: ${({ theme }) => `${theme.space.md} ${theme.space.sm}`};
+  margin: ${({ theme }) => `0 -${theme.space.base * 4}px`};
   display: flex;
   flex-direction: column;
-  gap: ${({ theme }) => theme.space.sm};
+  gap: ${({ theme }) => theme.space.xs};
   background: ${({ chatBkg }) => chatBkg !== null && chatBkg !== void 0 ? chatBkg : `#fff`};
   overflow-y: auto;
 `;
@@ -2326,7 +2327,7 @@ const Title$1 = (props) => jsxRuntime.jsx(reactNotifications.Title, Object.assig
 const ChatTitle = styled__default["default"](Title$1) `
   color: ${({ theme }) => theme.palette.blue[600]};
   margin: ${({ theme }) => `0 -${theme.space.md}`};
-  padding: ${({ theme }) => `0 ${theme.space.md} ${theme.space.sm}`};
+  padding: ${({ theme }) => `${theme.space.sm} ${theme.space.md}`};
   border-bottom: ${({ theme }) => `1px solid ${theme.palette.grey[200]}`};
 `;
 
@@ -2747,13 +2748,13 @@ const FloatingMenu = (props) => {
 const ChatBoxContainer = styled__default["default"].div `
   display: flex;
   border-top: 1px solid ${({ theme }) => theme.palette.grey[200]};
-  margin: ${({ theme }) => `0 -${theme.space.md}`};
-  padding: ${({ theme }) => theme.space.md};
+  margin: ${({ theme }) => `0 -${theme.space.base * 4}px`};
+  padding: ${({ theme }) => `${theme.space.base * 4}px ${theme.space.sm} 0`};
 `;
 const EditorContainer$1 = styled__default["default"](reactForms.FauxInput) `
   margin-left: ${({ theme }) => theme.space.sm};
+  padding: ${({ theme }) => `${theme.space.xxs} ${theme.space.xs}`};
   .ProseMirror {
-    padding: ${({ theme }) => `${theme.space.xxs} ${theme.space.xs}`};
     background-color: #fff;
     min-height: 36px;
     outline: none;
@@ -2779,10 +2780,11 @@ const CommentBox = (_a) => {
     var _b;
     var { placeholderOptions } = _a, props = __rest(_a, ["placeholderOptions"]);
     const { children, hasInlineMenu, bubbleOptions, author } = props;
-    const { setEditor, triggerSave } = useChatContext();
+    const { editor, setEditor, triggerSave } = useChatContext();
     const onKeyDown = (event) => {
         if ((event.ctrlKey || event.metaKey) && event.key === "Enter") {
             triggerSave();
+            editor === null || editor === void 0 ? void 0 : editor.commands.clearContent();
         }
     };
     const ed = react.useEditor(Object.assign({ extensions: [
@@ -2943,8 +2945,8 @@ const AuthorContainer = styled.styled.div `
   gap: ${({ theme }) => theme.space.sm};
 `;
 const CommentDate = styled.styled.span `
-color: ${({ theme }) => theme.palette.grey[500]};
-font-weight: ${({ theme }) => theme.fontWeights.thin};
+  color: ${({ theme }) => theme.palette.grey[500]};
+  font-weight: ${({ theme }) => theme.fontWeights.thin};
 `;
 const Footer$2 = styled.styled.div `
   display: flex;
@@ -2954,7 +2956,7 @@ const Footer$2 = styled.styled.div `
 `;
 const Comment = ({ author, message, children, date, }) => {
     var _a, _b;
-    return (jsxRuntime.jsxs(CommentCard, { children: [jsxRuntime.jsxs(AuthorContainer, { children: [jsxRuntime.jsx(Avatar, Object.assign({ avatarType: (_a = author.avatarType) !== null && _a !== void 0 ? _a : "text" }, { children: author.avatar })), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsxs(Title$1, { children: [(_b = author.name) !== null && _b !== void 0 ? _b : "User", jsxRuntime.jsx(CommentDate, { children: date })] }), jsxRuntime.jsx(ReadOnly, { children: jsxRuntime.jsx(Editor, Object.assign({ editable: false }, { children: message })) })] })] }), jsxRuntime.jsx(Footer$2, { children: children })] }));
+    return (jsxRuntime.jsxs(CommentCard, { children: [jsxRuntime.jsxs(AuthorContainer, { children: [jsxRuntime.jsx(Avatar, Object.assign({ avatarType: (_a = author.avatarType) !== null && _a !== void 0 ? _a : "text", style: { flexShrink: 0 } }, { children: author.avatar })), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsxs(Title$1, { children: [(_b = author.name) !== null && _b !== void 0 ? _b : "User", jsxRuntime.jsx(CommentDate, { children: date })] }), jsxRuntime.jsx(ReadOnly, { children: jsxRuntime.jsx(Editor, Object.assign({ editable: false }, { children: message })) })] })] }), jsxRuntime.jsx(Footer$2, { children: children })] }));
 };
 
 /**

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

@@ -1,4 +1,4 @@
-import { ReactNode } from "react";
+/// <reference types="react" />
 export declare const ChatTitle: import("styled-components").IStyledComponent<"web", {
     isRegular?: boolean | undefined;
     defaultChecked?: boolean | undefined;
@@ -98,7 +98,7 @@ export declare const ChatTitle: import("styled-components").IStyledComponent<"we
     "aria-valuemin"?: number | undefined;
     "aria-valuenow"?: number | undefined;
     "aria-valuetext"?: string | undefined;
-    children?: ReactNode;
+    children?: import("react").ReactNode;
     dangerouslySetInnerHTML?: {
         __html: string | TrustedHTML;
     } | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appquality/unguess-design-system",
-  "version": "3.1.60",
+  "version": "3.1.62",
   "description": "",
   "main": "build/index.js",
   "types": "build/index.d.ts",

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

@@ -1 +0,0 @@
-export declare const ChatInput: () => void;