ColdBreeze/ColdBreeze-chat-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: widget input at enter key

Browse Source
This commit is contained in:
Tristan Yang
2022-12-21 08:07:12 +08:00
parent 7546af66a5
commit cef85edbd2
3 changed files with 10 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/widget_demo.html
+1 -1
View File
@@ -9,5 +9,5 @@
</head>
<body class="w-sreen h-screen bg-slate-800 text-stone-50"></body>
<script src="/widget.js" data-host-id="4" async></script>
<script src="/widget.js" data-host-id="1" async></script>
</html>
src/widget/Popup/Footer.tsx
+1 -1
View File
@@ -6,7 +6,7 @@ type Props = {
const Index: FC<Props> = () => {
return (
<footer className="text-xs text-gray-300 text-center pb-2">Powered by <a href="https://voce.chat" target="_blank" rel="noopener noreferrer" className="text-gray-400">voce.chat</a></footer>
<footer className="text-xs text-gray-300 text-center pb-2">Host your own <a href="https://voce.chat" target="_blank" rel="noopener noreferrer" className="text-gray-400">voce.chat</a></footer>
);
};
src/widget/Popup/MessageInput.tsx
+8 -1
View File
@@ -13,6 +13,7 @@ type Props = {
from: number,
to: number
}
let isComposing = false;
const MessageInput = (props: Props) => {
const { from, to } = props;
const { sendMessage } = useSendMessage({
@@ -34,6 +35,12 @@ const MessageInput = (props: Props) => {
value={content}
placeholder="Type and press enter"
onChange={e => setContent(e.target.value)}
onCompositionStart={() => {
isComposing = true;
}}
onCompositionEnd={() => {
isComposing = false;
}}
onInput={() => {
const element = ref.current;
if (!element) return;
@@ -42,7 +49,7 @@ const MessageInput = (props: Props) => {
element.style.height = `${element.scrollHeight + 2}px`;
}}
onKeyDown={e => {
if (!e.shiftKey && e.key === 'Enter') {
if (!e.shiftKey && e.key === 'Enter' && !isComposing) {
// e.stopPropagation();
e.preventDefault();
if (content.trim().length === 0) return;