@bothub-chat/ui/dist/components/input-message/use-input.js

Bothub UI Components

import{useRef as e,useState as t,useCallback as n,useEffect as r}from"react";import{isMobileDevice as l}from"./utils.js";const s=({initialMessage:s,disabled:u,sendDisabled:o,autoFocus:a,messageSubmitKey:c="enter",onChange:i,onSendMessage:v,onTextAreaChange:h,onFocus:d,onBlur:f})=>{var g;const p=e(null),[b,m]=t(null!==(g=!u&&a)&&void 0!==g&&g),[y,x]=t("calc(var(--bothub-scale, 1) * 22px)"),[E,k]="string"==typeof s?[s,i]:t(""),C=n(e=>{m(!0),null==d||d(e)},[d]),D=n(e=>{m(!1),null==f||f(e)},[f]),F=n(()=>{var e;u||null===(e=p.current)||void 0===e||e.focus()},[u]),K=n(e=>{null==k||k(e.target.value),null==h||h(e)},[k,h]);return r(()=>{const e=p.current;if(!e||u)return;const t=!u&&!!a;m(t),t?e.focus():document.activeElement===e&&e.blur()},[u,a]),r(()=>{const e=p.current;if(null===e)return;const t=()=>{var e;const t=p.current;if(!t)return;const n=t.value,r=null!==(e=t.selectionStart)&&void 0!==e?e:0,l=n.slice(0,r),s=n.slice(r);var u,o;null==k||k(`${l}\n${s}`),u=t,o=r+1,setTimeout(()=>{u.selectionStart=o,u.selectionEnd=o},1)},n=e=>{if(e.stopPropagation(),o)return;if("Enter"!==e.key)return;if(l())return;if(e.shiftKey)return;if(!b)return;const n=e.ctrlKey||e.metaKey;if("enter"===c)return n?(e.preventDefault(),void t()):(e.preventDefault(),null==v||v(),void x("calc(var(--bothub-scale, 1) * 22px)"));n&&(e.preventDefault(),null==v||v(),x("calc(var(--bothub-scale, 1) * 22px)"))};return e.addEventListener("keydown",n),()=>{e.removeEventListener("keydown",n)}},[b,E,c,v,k]),r(()=>{const e=p.current;null!==e&&(e.style.height="calc(var(--bothub-scale, 1) * 22px)",e.style.height=`${e.scrollHeight}px`,x(`${e.scrollHeight}px`))},[E,a]),{textareaRef:p,isFocus:b,height:y,message:E,setHeight:x,setMessage:k,handleFocus:C,handleBlur:D,handleClick:F,handleChange:K}};export{s as useInput};