impact-ui 5.0.1 → 5.0.2-alpha.1

package/dist/components/TableChat/components/TableChatRightSection/ChatInput/ChatInput.js

@@ -1,6 +1,7 @@
-!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('@keyframes ia-shimmer-horizontal{0%{background-position:100% 0}to{background-position:0 0}}@keyframes ia-shimmer-vertical{0%{background-position:0 100%}to{background-position:0 0}}@property --ia-shimmer-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes ia-shimmer-circular{0%{--ia-shimmer-angle:0deg}to{--ia-shimmer-angle:360deg}}.ia-shimmer{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(90deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer{animation:none;background-image:linear-gradient(90deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--ltr{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(90deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--ltr{animation:none;background-image:linear-gradient(90deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--rtl{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:reverse;background-color:#e8edf5;background-image:linear-gradient(270deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--rtl{animation:none;background-image:linear-gradient(270deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--btt{animation:ia-shimmer-vertical 1.6s ease-in-out infinite;animation-direction:reverse;background-color:#e8edf5;background-image:linear-gradient(0deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:100% 300%}@media (prefers-reduced-motion:reduce){.ia-shimmer--btt{animation:none;background-image:linear-gradient(0deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--ttb{animation:ia-shimmer-vertical 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(0deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:100% 300%}@media (prefers-reduced-motion:reduce){.ia-shimmer--ttb{animation:none;background-image:linear-gradient(0deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--circular{background-color:#e8edf5;background-repeat:no-repeat;--ia-shimmer-angle:0deg;animation:ia-shimmer-circular 1.6s linear infinite;background-image:conic-gradient(from var(--ia-shimmer-angle),#eceef4 0deg,#e8edf5 80deg,#d5dbe8 160deg,#e8edf5 260deg,#eceef4 1turn);background-size:100% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--circular{animation:none;background-image:conic-gradient(from 0deg,#eceef4,#e8edf5,#d5dbe8,#e8edf5 1turn)}}:root{--ia-focus-color:#4259ee;--ia-focus-bg:#fff;--ia-focus-ring-width:2px;--ia-focus-ring-offset:2px;--ia-modal-backdrop:#0d152ccc}*,:after,:before{box-sizing:border-box}body,textarea{font-style:normal;font-weight:500}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{border:0;font-size:100%;font:inherit;margin:0;padding:0;vertical-align:initial}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}body{font-family:Manrope,sans-serif}.impact-notification-separator{background-color:#d9dde7;display:inline-block;height:16px;width:1.5px}.impact-notification-horizontal-separator{background-color:#d9dde7;display:inline-block;height:1px;width:100%}ul.storybook-order-list{list-style-type:disc;padding-left:12px}ul.storybook-order-list li{font-size:12px;line-height:20px;padding-bottom:8px}ul.storybook-order-list li strong{font-weight:800}ul.storybook-order-child-list{list-style-type:circle;padding-left:20px}ul.storybook-order-child-list li{font-size:12px;line-height:20px;padding-bottom:8px}ul.storybook-order-child-list li strong{font-weight:800}.chat-input{background:#fff;box-sizing:border-box;margin:0 16px 12px;min-width:0}.chat-input.focused{border-top-color:#4259ee}.chat-input .edit-mode-indicator{background-color:#fff3cd;border:1px solid #ffeaa7;border-radius:8px;margin-bottom:8px;padding:8px 12px}.chat-input .edit-mode-indicator .edit-mode-text{align-items:center;color:#856404;display:flex;font-size:14px;justify-content:space-between}.chat-input .edit-mode-indicator .edit-mode-text span{align-items:center;display:flex;font-weight:500;gap:6px}.chat-input .edit-mode-indicator .edit-mode-text .cancel-edit-btn{background:none;border:1px solid #ffeaa7;border-radius:4px;color:#856404;cursor:pointer;font-size:12px;padding:4px 8px;transition:all .2s ease}.chat-input .edit-mode-indicator .edit-mode-text .cancel-edit-btn:hover{background-color:#ffeaa7;color:#6c5400}.chat-input .quick-action-container{align-items:center;display:flex;justify-content:flex-end;margin-bottom:6px}.chat-input .show-formatting-enabled{justify-content:space-between}.chat-input .formatting-toolbar{align-items:center}.chat-input .formatting-toolbar .format-button{align-items:center;background:none;border:none;color:#7a8294;cursor:pointer;display:flex;justify-content:center;padding:6px}.chat-input .formatting-toolbar .format-button:hover{background:#eceefd;color:#4259ee}.chat-input .input-container{position:relative}.chat-input .input-container .input-wrapper{align-items:flex-end;background:#fff;border:1px solid #d9dde7;border-radius:12px;box-shadow:0 0 12px 8px #0000000f;display:flex;gap:8px;padding:12px 16px;transition:border-color .2s ease}.chat-input .input-container .input-wrapper:focus-within{border-color:#4259ee}.chat-input .input-container .input-wrapper .message-input{background:none;border:none;color:#1f2b4d;flex:1;font-family:Manrope,sans-serif;font-size:14px;line-height:1.4;outline:none}.chat-input .input-container .input-wrapper .message-input::placeholder{color:#7a8294}.chat-input .input-container .input-wrapper .image-input-container{display:flex;flex-direction:column;gap:2px;width:100%}.chat-input .input-container .character-count{bottom:-22px;color:#b4bac7;font-size:11px;position:absolute;right:-5px}.chat-input .formatting-toolbar{display:flex;gap:4px;padding:4px}.chat-input .formatting-toolbar .format-button{border-radius:4px;padding:4px;transition:all .2s ease}.chat-input .formatting-toolbar .format-button:hover{background-color:#f5f5f5}.chat-input .formatting-toolbar .format-button.is-active{background-color:#e2f4ff;color:#4259ee}.chat-input .upload-container{display:flex;flex-direction:column;width:100%}.chat-input .upload-container .image-preview-container{display:flex;flex-wrap:wrap;gap:8px}.chat-input .upload-container .image-preview-container img{border-radius:8px;object-fit:cover}.chat-input .upload-container .file-preview-container{display:flex;flex-direction:column;gap:4px}.chat-input .message-input{border:1px solid #f0f0f0;border-radius:4px;font-size:14px;line-height:1.5;padding:8px;width:100%}.chat-input .message-input:focus{border-color:#4259ee;outline:none}.chat-input .chat-input-section{border-radius:12px;display:flex;flex-direction:column;gap:6px;position:static;width:100%}.chat-input .chat-input-section.new-chat-screen{bottom:0;position:relative;width:100%}.chat-input .chat-input-section.custom-screen{bottom:15px;width:95%}.chat-input .chat-input-textarea{border:none;max-height:500px;min-height:10px;outline:none;overflow-y:auto;resize:none;width:100%}.chat-input .chat-input-container{background:#fff;border:1px solid #d9dde7;border-radius:12px;box-shadow:0 0 12px 8px #0000000f;padding:12px;position:relative;width:100%}.chat-input .chat-input-container:focus-within,.chat-input .chat-input-container:hover{border:1px solid #b3bdf8}.chat-input .chat-input-wrapper{align-items:flex-end;display:flex;max-height:182px;transition:all .2s ease-in-out;width:100%}.chat-input .chat-input-wrapper.stacked{align-items:stretch;flex-direction:column}.chat-input .chat-input-wrapper.empty{align-items:flex-end;flex-direction:row}.chat-input .chat-input-wrapper.single-line-textarea{align-items:center}.chat-input .message-input-container{display:flex;flex-direction:column;gap:4px;width:100%}.chat-input .chat-textarea{background:#0000;border:none;color:#1f2b4d;flex:1;font-family:Manrope,sans-serif;font-size:14px;font-weight:400;line-height:160%;max-height:142px;outline:none;overflow-y:hidden;padding:0;resize:none;width:100%}.chat-input .chat-textarea::placeholder{color:#b4bac7}.chat-input .chat-textarea{transition:all .2s ease-in-out}.chat-input .chat-textarea.scrollable{overflow-y:auto}.chat-input .chat-actions{align-items:flex-end;display:flex;gap:12px;height:32px;justify-content:flex-end}.chat-input .chat-actions.fixed{height:36px}.chat-input .chat-actions.not-fixed{height:32px}.chat-input .input-actions{align-items:center;display:flex;gap:8px}.chat-input .input-actions .send-actions{align-items:center;display:flex;gap:8px;height:30px}.chat-input .input-actions .send-actions .ia-btn-icon{height:28px;margin-bottom:-4px}.chat-input .input-actions .send-actions img{width:12px}.chat-input .input-actions .send-actions .check-button{background:none;border:3px solid #eceefd;border-radius:8px;color:#7a8294;cursor:pointer;height:32px;padding:8px;width:32px}.chat-input .input-actions .send-actions .check-button .check-icon{width:12px}.chat-input .input-actions .send-actions .send-button{align-items:center!important;background:#0000!important;border:none!important;border-radius:6px!important;color:#fff!important;display:flex!important;height:32px!important;justify-content:center!important;min-width:32px!important;padding:0!important;width:32px!important}.tiptap p.is-editor-empty:first-child:before{color:#d9dde7;content:attr(data-placeholder);float:left;height:0;pointer-events:none}.quick-action-menu.MuiPopover-root .MuiPaper-root{margin-bottom:8px!important}.ia-styles.ia-menu.quick-action-container .MuiList-root{min-width:214px!important}.ia-styles.ia-menu.quick-action-container .MuiPaper-root{margin-left:6px!important;margin-top:-10px!important}.ia-styles.ia-menu.priority-action-container .MuiList-root{min-width:214px!important}.ia-styles.ia-menu.priority-action-container .MuiPaper-root{margin-left:36px!important;margin-top:-6px!important}.input-actions .send-actions .ia-btn-icon-loading{margin-bottom:0;padding-top:7px}.selected_action_priority{border:1px solid #3649c6!important}')),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}}();
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('@keyframes ia-shimmer-horizontal{0%{background-position:100% 0}to{background-position:0 0}}@keyframes ia-shimmer-vertical{0%{background-position:0 100%}to{background-position:0 0}}@property --ia-shimmer-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes ia-shimmer-circular{0%{--ia-shimmer-angle:0deg}to{--ia-shimmer-angle:360deg}}.ia-shimmer{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(90deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer{animation:none;background-image:linear-gradient(90deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--ltr{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(90deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--ltr{animation:none;background-image:linear-gradient(90deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--rtl{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:reverse;background-color:#e8edf5;background-image:linear-gradient(270deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--rtl{animation:none;background-image:linear-gradient(270deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--btt{animation:ia-shimmer-vertical 1.6s ease-in-out infinite;animation-direction:reverse;background-color:#e8edf5;background-image:linear-gradient(0deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:100% 300%}@media (prefers-reduced-motion:reduce){.ia-shimmer--btt{animation:none;background-image:linear-gradient(0deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--ttb{animation:ia-shimmer-vertical 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(0deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:100% 300%}@media (prefers-reduced-motion:reduce){.ia-shimmer--ttb{animation:none;background-image:linear-gradient(0deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--circular{background-color:#e8edf5;background-repeat:no-repeat;--ia-shimmer-angle:0deg;animation:ia-shimmer-circular 1.6s linear infinite;background-image:conic-gradient(from var(--ia-shimmer-angle),#eceef4 0deg,#e8edf5 80deg,#d5dbe8 160deg,#e8edf5 260deg,#eceef4 1turn);background-size:100% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--circular{animation:none;background-image:conic-gradient(from 0deg,#eceef4,#e8edf5,#d5dbe8,#e8edf5 1turn)}}:root{--ia-focus-color:#4259ee;--ia-focus-bg:#fff;--ia-focus-ring-width:2px;--ia-focus-ring-offset:2px;--ia-modal-backdrop:#0d152ccc}*,:after,:before{box-sizing:border-box}body,textarea{font-style:normal;font-weight:500}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{border:0;font-size:100%;font:inherit;margin:0;padding:0;vertical-align:initial}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}body{font-family:Manrope,sans-serif}.impact-notification-separator{background-color:#d9dde7;display:inline-block;height:16px;width:1.5px}.impact-notification-horizontal-separator{background-color:#d9dde7;display:inline-block;height:1px;width:100%}ul.storybook-order-list{list-style-type:disc;padding-left:12px}ul.storybook-order-list li{font-size:12px;line-height:20px;padding-bottom:8px}ul.storybook-order-list li strong{font-weight:800}ul.storybook-order-child-list{list-style-type:circle;padding-left:20px}ul.storybook-order-child-list li{font-size:12px;line-height:20px;padding-bottom:8px}ul.storybook-order-child-list li strong{font-weight:800}.chat-input{background:#fff;box-sizing:border-box;margin:0 16px 12px;min-width:0}.chat-input.focused{border-top-color:#4259ee}.chat-input .edit-mode-indicator{background-color:#fff3cd;border:1px solid #ffeaa7;border-radius:8px;margin-bottom:8px;padding:8px 12px}.chat-input .edit-mode-indicator .edit-mode-text{align-items:center;color:#856404;display:flex;font-size:14px;justify-content:space-between}.chat-input .edit-mode-indicator .edit-mode-text span{align-items:center;display:flex;font-weight:500;gap:6px}.chat-input .edit-mode-indicator .edit-mode-text .cancel-edit-btn{background:none;border:1px solid #ffeaa7;border-radius:4px;color:#856404;cursor:pointer;font-size:12px;padding:4px 8px;transition:all .2s ease}.chat-input .edit-mode-indicator .edit-mode-text .cancel-edit-btn:hover{background-color:#ffeaa7;color:#6c5400}.chat-input .quick-action-container{align-items:center;display:flex;justify-content:flex-end;margin-bottom:6px}.chat-input .show-formatting-enabled{justify-content:space-between}.chat-input .formatting-toolbar{align-items:center}.chat-input .formatting-toolbar .format-button{align-items:center;background:none;border:none;color:#7a8294;cursor:pointer;display:flex;justify-content:center;padding:6px}.chat-input .formatting-toolbar .format-button:hover{background:#eceefd;color:#4259ee}.chat-input .input-container{position:relative}.chat-input .input-container .input-wrapper{align-items:flex-end;background:#fff;border:1px solid #d9dde7;border-radius:12px;box-shadow:0 0 12px 8px #0000000f;display:flex;gap:8px;padding:12px 16px;transition:border-color .2s ease}.chat-input .input-container .input-wrapper:focus-within{border-color:#4259ee}.chat-input .input-container .input-wrapper .message-input{background:none;border:none;color:#1f2b4d;flex:1;font-family:Manrope,sans-serif;font-size:14px;line-height:1.4;outline:none}.chat-input .input-container .input-wrapper .message-input::placeholder{color:#7a8294}.chat-input .input-container .input-wrapper .image-input-container{display:flex;flex-direction:column;gap:2px;width:100%}.chat-input .input-container .character-count{bottom:-22px;color:#b4bac7;font-size:11px;position:absolute;right:-5px}.chat-input .formatting-toolbar{display:flex;gap:4px;padding:4px}.chat-input .formatting-toolbar .format-button{border-radius:4px;padding:4px;transition:all .2s ease}.chat-input .formatting-toolbar .format-button:hover{background-color:#f5f5f5}.chat-input .formatting-toolbar .format-button.is-active{background-color:#e2f4ff;color:#4259ee}.chat-input .upload-container{display:flex;flex-direction:column;width:100%}.chat-input .upload-container .image-preview-container{display:flex;flex-wrap:wrap;gap:8px}.chat-input .upload-container .image-preview-container img{border-radius:8px;object-fit:cover}.chat-input .upload-container .file-preview-container{display:flex;flex-direction:column;gap:4px}.chat-input .message-input{border:1px solid #f0f0f0;border-radius:4px;font-size:14px;line-height:1.5;padding:8px;width:100%}.chat-input .message-input:focus{border-color:#4259ee;outline:none}.chat-input .chat-input-section{border-radius:12px;display:flex;flex-direction:column;gap:6px;position:static;width:100%}.chat-input .chat-input-section.new-chat-screen{bottom:0;position:relative;width:100%}.chat-input .chat-input-section.custom-screen{bottom:15px;width:95%}.chat-input .chat-input-textarea{border:none;max-height:500px;min-height:10px;outline:none;overflow-y:auto;resize:none;width:100%}.chat-input .chat-input-container{background:#fff;border:1px solid #d9dde7;border-radius:12px;box-shadow:0 0 12px 8px #0000000f;box-sizing:border-box;display:flex;flex-direction:column;gap:12px;padding:12px;position:relative;width:100%}.chat-input .chat-input-container:focus-within,.chat-input .chat-input-container:hover{border:1px solid #b3bdf8}.chat-input .reply-preview{align-items:flex-start;background:#f2f4fb;border-radius:8px 8px 0 0;box-sizing:border-box;display:flex;gap:8px;padding:8px;width:100%}.chat-input .reply-preview__text{color:#60697d;flex:1;font-size:14px;font-weight:500;letter-spacing:.14px;line-height:1.6;margin:0;min-width:0;word-break:break-word}.chat-input .reply-preview__close{align-items:center;background:#0000;border:none;border-radius:4px;color:#7a8294;cursor:pointer;display:inline-flex;flex-shrink:0;height:20px;justify-content:center;margin:0;padding:0;width:20px}.chat-input .reply-preview__close:hover{background:#1f2b4d0f;color:#1f2b4d}.chat-input .chat-input-wrapper{align-items:flex-end;display:flex;max-height:182px;transition:all .2s ease-in-out;width:100%}.chat-input .chat-input-wrapper.stacked{align-items:stretch;flex-direction:column}.chat-input .chat-input-wrapper.empty{align-items:flex-end;flex-direction:row}.chat-input .chat-input-wrapper.single-line-textarea{align-items:center}.chat-input .message-input-container{display:flex;flex-direction:column;gap:4px;width:100%}.chat-input .chat-textarea{background:#0000;border:none;color:#1f2b4d;flex:1;font-family:Manrope,sans-serif;font-size:14px;font-weight:400;line-height:160%;max-height:142px;outline:none;overflow-y:hidden;padding:0;resize:none;width:100%}.chat-input .chat-textarea::placeholder{color:#b4bac7}.chat-input .chat-textarea{transition:all .2s ease-in-out}.chat-input .chat-textarea.scrollable{overflow-y:auto}.chat-input .chat-actions{align-items:flex-end;display:flex;gap:12px;height:32px;justify-content:flex-end}.chat-input .chat-actions.fixed{height:36px}.chat-input .chat-actions.not-fixed{height:32px}.chat-input .input-actions{align-items:center;display:flex;gap:8px}.chat-input .input-actions .send-actions{align-items:center;display:flex;gap:8px;height:30px}.chat-input .input-actions .send-actions .ia-btn-icon{height:28px;margin-bottom:-4px}.chat-input .input-actions .send-actions img{width:12px}.chat-input .input-actions .send-actions .check-button{background:none;border:3px solid #eceefd;border-radius:8px;color:#7a8294;cursor:pointer;height:32px;padding:8px;width:32px}.chat-input .input-actions .send-actions .check-button .check-icon{width:12px}.chat-input .input-actions .send-actions .send-button{align-items:center!important;background:#0000!important;border:none!important;border-radius:6px!important;color:#fff!important;display:flex!important;height:32px!important;justify-content:center!important;min-width:32px!important;padding:0!important;width:32px!important}.tiptap p.is-editor-empty:first-child:before{color:#d9dde7;content:attr(data-placeholder);float:left;height:0;pointer-events:none}.quick-action-menu.MuiPopover-root .MuiPaper-root{margin-bottom:8px!important}.ia-styles.ia-menu.quick-action-container .MuiList-root{min-width:214px!important}.ia-styles.ia-menu.quick-action-container .MuiPaper-root{margin-left:6px!important;margin-top:-10px!important}.ia-styles.ia-menu.priority-action-container .MuiList-root{min-width:214px!important}.ia-styles.ia-menu.priority-action-container .MuiPaper-root{margin-left:36px!important;margin-top:-6px!important}.input-actions .send-actions .ia-btn-icon-loading{margin-bottom:0;padding-top:7px}.selected_action_priority{border:1px solid #3649c6!important}')),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}}();
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import React__default, { useState, useRef, useEffect } from "react";
+import React__default, { useState, useRef, useMemo, useEffect } from "react";
+import default_1 from "../../../../../node_modules/@mui/icons-material/Close.js";
 import { getAssetUrl } from "../../../../../utils/assetBase.js";
 import { Button } from "../../../../Button/index.js";
 import { Menu } from "../../../../Menu/index.js";
@@ -30,6 +31,7 @@ const ChatInput = ({
   onAttach,
   onImageUpload,
   onEmojiClick,
+  onQuickAction,
   showFormatting = true,
   showQuickAction = true,
   quickActionLabel,
@@ -40,6 +42,9 @@ const ChatInput = ({
   isEditMode = false,
   editingMessage = null,
   onCancelEdit,
+  isReplyMode = false,
+  replyingToMessage = null,
+  onCancelReply,
   chatId
 }) => {
   var _a, _b, _c, _d, _e, _f;
@@ -67,6 +72,15 @@ const ChatInput = ({
   const [height, setHeight] = useState("auto");
   const [selectedPriority, setSelectedPriority] = useState("");
   const [selectedQuickAction, setSelectedQuickAction] = useState(null);
+  const REPLY_PREVIEW_MAX_LENGTH = 140;
+  const replyPreviewText = useMemo(() => {
+    if (!replyingToMessage) return "";
+    const raw = replyingToMessage.content || replyingToMessage.text || "";
+    if (typeof raw !== "string") return "";
+    const plain = raw.replace(/<[^>]*>/g, " ").replace(/\s+/g, " ").trim();
+    if (plain.length <= REPLY_PREVIEW_MAX_LENGTH) return plain;
+    return `${plain.slice(0, REPLY_PREVIEW_MAX_LENGTH).trim()}...`;
+  }, [replyingToMessage]);
   const [isFormatActive, setIsFormatActive] = useState({
     bold: false,
     italic: false,
@@ -396,13 +410,6 @@ const ChatInput = ({
     }
   }, [message]);
   return /* @__PURE__ */ jsxs("div", { className: `${className} ${isFocused ? "focused" : ""}`, children: [
-    isEditMode && editingMessage && /* @__PURE__ */ jsx("div", { className: "edit-mode-indicator", children: /* @__PURE__ */ jsxs("div", { className: "edit-mode-text", children: [
-      /* @__PURE__ */ jsxs("span", { children: [
-        "✏️ ",
-        t("tableChat.input.editingMessage")
-      ] }),
-      /* @__PURE__ */ jsx("button", { className: "cancel-edit-btn", type: "button", onClick: onCancelEdit, children: t("common.cancel") })
-    ] }) }),
     /* @__PURE__ */ jsxs("div", { className: `quick-action-container ${showFormatting ? "show-formatting-enabled" : ""}`, children: [
       showFormatting && /* @__PURE__ */ jsx(
         EditorToolbar,
@@ -410,21 +417,7 @@ const ChatInput = ({
           ref: toolbarRef,
           activeStates: isFormatActive,
           className: "formatting-toolbar",
-          enabledItems: [
-            "bold",
-            "italic",
-            "link",
-            // "bulletList", // Enabled if required (functionality implemented)
-            // "orderedList",
-            "strike",
-            "highlight"
-            // "h1",
-            // "h2",
-            // "h3",
-            // "h4",
-            // "h5",
-            // "h6",
-          ],
+          enabledItems: ["bold", "italic", "link", "strike", "highlight"],
           editor: editorRef.current,
           onEmojiSelect: handleEmojiPickerOpen
         }
@@ -460,7 +453,7 @@ const ChatInput = ({
             options: quickActionMenuOptions,
             selected: selectedQuickAction,
             onClick: (option) => {
-              var _a2;
+              var _a2, _b2;
               const text = getPrefillText(option.value, quickActionMenuOptions);
               if ((selectedQuickAction == null ? void 0 : selectedQuickAction.value) === option.value) {
                 setSelectedQuickAction(null);
@@ -468,10 +461,16 @@ const ChatInput = ({
                 if ((_a2 = editorRef.current) == null ? void 0 : _a2.clearContent) {
                   editorRef.current.clearContent();
                 }
+                onChange == null ? void 0 : onChange("");
               } else {
                 setSelectedQuickAction(text);
                 const prefillText = (text == null ? void 0 : text.prefillText) || "";
                 setMessage(prefillText);
+                if (((_b2 = editorRef.current) == null ? void 0 : _b2.editor) && prefillText) {
+                  editorRef.current.editor.commands.setContent(`<p>${prefillText}</p>`);
+                }
+                onChange == null ? void 0 : onChange(prefillText);
+                onQuickAction == null ? void 0 : onQuickAction(option, chatId);
               }
               setQuickActionMenuOpen(false);
             },
@@ -482,112 +481,127 @@ const ChatInput = ({
         )
       ] })
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "chat-input-section", children: /* @__PURE__ */ jsx("div", { className: "chat-input-container", children: /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: `chat-input-wrapper ${isFixed ? "stacked" : ""} ${!isFixed || message === "" ? "empty" : ""} ${!isFixed ? "single-line-textarea" : ""}`,
-        style: { height },
-        children: [
-          /* @__PURE__ */ jsxs("div", { className: "message-input-container", children: [
-            /* @__PURE__ */ jsxs("div", { className: "upload-container", children: [
-              /* @__PURE__ */ jsx("div", { className: "image-preview-container", children: image || isLoading || isError ? /* @__PURE__ */ jsx(
-                ImageUploader,
+    /* @__PURE__ */ jsx("div", { className: `chat-input-section ${isReplyMode && replyingToMessage ? "is-replying" : ""}`, children: /* @__PURE__ */ jsxs("div", { className: "chat-input-container", children: [
+      isReplyMode && replyingToMessage ? /* @__PURE__ */ jsxs("div", { className: "reply-preview", children: [
+        /* @__PURE__ */ jsx("p", { className: "reply-preview__text", children: replyPreviewText }),
+        onCancelReply ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            "aria-label": t("common.close"),
+            className: "reply-preview__close",
+            type: "button",
+            onClick: onCancelReply,
+            children: /* @__PURE__ */ jsx(default_1, { fontSize: "small" })
+          }
+        ) : null
+      ] }) : null,
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: `chat-input-wrapper ${isFixed ? "stacked" : ""} ${!isFixed || message === "" ? "empty" : ""} ${!isFixed ? "single-line-textarea" : ""}`,
+          style: { height },
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "message-input-container", children: [
+              /* @__PURE__ */ jsxs("div", { className: "upload-container", children: [
+                /* @__PURE__ */ jsx("div", { className: "image-preview-container", children: image || isLoading || isError ? /* @__PURE__ */ jsx(
+                  ImageUploader,
+                  {
+                    handleClear,
+                    handleRetry,
+                    image,
+                    isError,
+                    isLoading
+                  }
+                ) : null }),
+                /* @__PURE__ */ jsx("div", { className: "file-preview-container", children: (uploadedFile || fileUploadLoading || fileUploadError) && /* @__PURE__ */ jsx(
+                  FileUploader,
+                  {
+                    file: uploadedFile,
+                    fileUrl,
+                    isError: fileUploadError,
+                    isLoading: fileUploadLoading,
+                    onClear: handleFileClear,
+                    onDownload: handleFileDownload,
+                    onRetry: handleFileRetry
+                  }
+                ) })
+              ] }),
+              /* @__PURE__ */ jsx(
+                MentionEditor,
                 {
-                  handleClear,
-                  handleRetry,
-                  image,
-                  isError,
-                  isLoading
+                  ref: editorRef,
+                  chatId,
+                  disabled,
+                  loadParticipantsAvatar: messageConfig.loadParticipantsAvatar,
+                  maxLength,
+                  placeholder: t("tableChat.input.mentionPlaceholder"),
+                  value: getDisplayValue(),
+                  onChange: handleInputChange,
+                  onSend: handleSend
                 }
-              ) : null }),
-              /* @__PURE__ */ jsx("div", { className: "file-preview-container", children: (uploadedFile || fileUploadLoading || fileUploadError) && /* @__PURE__ */ jsx(
-                FileUploader,
+              )
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: `chat-actions ${isFixed ? "fixed" : ""}`, children: /* @__PURE__ */ jsx("div", { className: "input-actions", children: /* @__PURE__ */ jsxs("div", { className: "send-actions", children: [
+              /* @__PURE__ */ jsx(
+                Button,
                 {
-                  file: uploadedFile,
-                  fileUrl,
-                  isError: fileUploadError,
-                  isLoading: fileUploadLoading,
-                  onClear: handleFileClear,
-                  onDownload: handleFileDownload,
-                  onRetry: handleFileRetry
+                  ariaLabel: t("tableChat.input.markAsDone"),
+                  className: `${selectedPriority.value && "selected_action_priority"} check-button`,
+                  icon: /* @__PURE__ */ jsx("img", { className: "check-icon", src: CheckIcon }),
+                  variant: "tertiary",
+                  onClick: handlePriorityClick
                 }
-              ) })
-            ] }),
-            /* @__PURE__ */ jsx(
-              MentionEditor,
-              {
-                ref: editorRef,
-                chatId,
-                disabled,
-                loadParticipantsAvatar: messageConfig.loadParticipantsAvatar,
-                maxLength,
-                placeholder: t("tableChat.input.mentionPlaceholder"),
-                value: getDisplayValue(),
-                onChange: handleInputChange,
-                onSend: handleSend
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsx("div", { className: `chat-actions ${isFixed ? "fixed" : ""}`, children: /* @__PURE__ */ jsx("div", { className: "input-actions", children: /* @__PURE__ */ jsxs("div", { className: "send-actions", children: [
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                ariaLabel: t("tableChat.input.markAsDone"),
-                className: `${selectedPriority.value && "selected_action_priority"} check-button`,
-                icon: /* @__PURE__ */ jsx("img", { className: "check-icon", src: CheckIcon }),
-                variant: "tertiary",
-                onClick: handlePriorityClick
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              Menu,
-              {
-                anchorEl: priorityAnchorEl,
-                iconPlacement: "top",
-                menuContainerClassName: "priority-action-container",
-                MenuProps: {
-                  anchorOrigin: {
-                    vertical: "top",
-                    horizontal: "left"
+              ),
+              /* @__PURE__ */ jsx(
+                Menu,
+                {
+                  anchorEl: priorityAnchorEl,
+                  iconPlacement: "top",
+                  menuContainerClassName: "priority-action-container",
+                  MenuProps: {
+                    anchorOrigin: {
+                      vertical: "top",
+                      horizontal: "left"
+                    },
+                    transformOrigin: {
+                      vertical: "bottom",
+                      horizontal: "right"
+                    }
                   },
-                  transformOrigin: {
-                    vertical: "bottom",
-                    horizontal: "right"
-                  }
-                },
-                open: priorityMenuOpen,
-                options: priorityMenuOptions,
-                selected: selectedPriority,
-                onClick: (option) => {
-                  const text = getPrefillText(option.value, priorityMenuOptions);
-                  if (selectedPriority.value === option.value) {
-                    setSelectedPriority("");
-                  } else {
-                    setSelectedPriority(text);
+                  open: priorityMenuOpen,
+                  options: priorityMenuOptions,
+                  selected: selectedPriority,
+                  onClick: (option) => {
+                    const text = getPrefillText(option.value, priorityMenuOptions);
+                    if (selectedPriority.value === option.value) {
+                      setSelectedPriority("");
+                    } else {
+                      setSelectedPriority(text);
+                    }
+                    setPriorityMenuOpen(false);
+                  },
+                  onClose: () => {
+                    setPriorityMenuOpen(false);
                   }
-                  setPriorityMenuOpen(false);
-                },
-                onClose: () => {
-                  setPriorityMenuOpen(false);
                 }
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                "aria-label": isEditMode ? t("tableChat.input.updateMessage") : t("tableChat.input.sendMessage"),
-                disabled: !getTrimmedValue(),
-                icon: /* @__PURE__ */ jsx("img", { src: SendIcon }),
-                loading: isSending,
-                title: isEditMode ? t("tableChat.input.updateMessage") : t("tableChat.input.sendMessage"),
-                variant: "primary",
-                onClick: handleSend
-              }
-            )
-          ] }) }) })
-        ]
-      }
-    ) }) }),
+              ),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  "aria-label": t("tableChat.input.sendMessage"),
+                  disabled: !getTrimmedValue(),
+                  icon: /* @__PURE__ */ jsx("img", { src: SendIcon }),
+                  loading: isSending,
+                  title: t("tableChat.input.sendMessage"),
+                  variant: "primary",
+                  onClick: handleSend
+                }
+              )
+            ] }) }) })
+          ]
+        }
+      )
+    ] }) }),
     /* @__PURE__ */ jsx(
       TableChatEmojiPicker,
       {

package/dist/components/TableChat/components/TableChatRightSection/ChatMessages/ChatMessage.d.ts

@@ -1,34 +1,36 @@
 
-export declare const ChatMessage: ({ messageId, author, authorName, authorAvatar, content, timestamp, isUser, showActions, showAvatar, isDeleted, edited, deleted, onReply, onReact, onBookmark, onPin, pinned, onMore, onEdit, onMessageDelete, onRefetchMessages, type, priority, actions, className, onThreadClick, isThreadIconVisible, isPinChatIconvisible, isHighlighted, highlightColor, }: {
+export declare const ChatMessage: ({ messageId, authorName, authorAvatar, content, timestamp, isUser, isDeleted, edited, deleted, onReply, onFinalize, onPin, pinned, onEdit, onMessageDelete, type, priority, className, onThreadClick, isThreadIconVisible, isPinChatIconvisible, isHighlighted, highlightColor, quote, showReplyActions, showFinalize, showEditOption, showDeleteOption, moreOptions, isEditing, onCancelEdit, onSaveEdit, }: {
     messageId: any;
-    author: any;
     authorName: any;
     authorAvatar: any;
     content: any;
     timestamp: any;
     isUser?: boolean | undefined;
-    showActions?: boolean | undefined;
-    showAvatar?: boolean | undefined;
     isDeleted?: boolean | undefined;
     edited?: boolean | undefined;
     deleted?: boolean | undefined;
     onReply: any;
-    onReact: any;
-    onBookmark: any;
+    onFinalize: any;
     onPin: any;
     pinned: any;
-    onMore: any;
     onEdit: any;
     onMessageDelete: any;
-    onRefetchMessages: any;
     type?: string | undefined;
     priority?: string | undefined;
-    actions?: never[] | undefined;
     className?: string | undefined;
     onThreadClick: any;
     isThreadIconVisible: any;
     isPinChatIconvisible: any;
     isHighlighted?: boolean | undefined;
     highlightColor?: null | undefined;
+    quote: any;
+    showReplyActions?: boolean | undefined;
+    showFinalize?: boolean | undefined;
+    showEditOption?: boolean | undefined;
+    showDeleteOption?: boolean | undefined;
+    moreOptions?: never[] | undefined;
+    isEditing?: boolean | undefined;
+    onCancelEdit: any;
+    onSaveEdit: any;
 }) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ChatMessage.d.ts.map

package/dist/components/TableChat/components/TableChatRightSection/ChatMessages/ChatMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatMessage.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatMessages/ChatMessage.tsx"],"names":[],"mappings":"AAUA,OAAO,2BAA2B,CAAC;AAKnC,eAAO,MAAM,WAAW,GAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+B3B,4CA4KA,CAAC"}
+{"version":3,"file":"ChatMessage.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatMessages/ChatMessage.tsx"],"names":[],"mappings":"AAWA,OAAO,2BAA2B,CAAC;AAKnC,eAAO,MAAM,WAAW,GAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiC3B,4CA0JA,CAAC"}