@bizhermit/react-sdk
Version:
React SDK
1 lines • 3.55 kB
JavaScript
;var __createBinding=this&&this.__createBinding||(Object.create?function(e,t,r,a){void 0===a&&(a=r);var u=Object.getOwnPropertyDescriptor(t,r);u&&!("get"in u?!t.__esModule:u.writable||u.configurable)||(u={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,a,u)}:function(e,t,r,a){void 0===a&&(a=r),e[a]=t[r]}),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&__createBinding(t,e,r);return __setModuleDefault(t,e),t},__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.useTextArea=void 0;const string_utils_1=__importDefault(require("@bizhermit/basic-utils/dist/string-utils")),react_1=__importStar(require("react")),value_1=__importDefault(require("../../hooks/value")),core_style_1=require("../../styles/core-style"),css_var_1=__importStar(require("../../styles/css-var")),input_style_1=__importStar(require("../../styles/input-style")),jsx_style_1=__importDefault(require("../../styles/jsx-style")),input_1=require("../../utils/input"),resizer_1=__importDefault(require("../resizer")),cn="bh-txa",TextArea=react_1.default.forwardRef(((e,t)=>{const r=(0,react_1.useRef)(),{val:a,set:u,buf:s}=(0,value_1.default)(e,{effect:e=>{r.current.value!==e&&(r.current.value=e??"")}}),l=t=>{e.$disabled||e.$readOnly||u.current(t)},n=(0,react_1.useRef)(a);return(0,react_1.useEffect)((()=>{e.$hook?._set({focus:()=>r.current?.focus(),getValue:()=>s.current,setValue:e=>u.current(e)})}),[e.$hook?._set]),react_1.default.createElement("div",{...(0,input_1.inputAttributes)(e,cn),ref:t,"data-t":"f","data-v":string_utils_1.default.isNotEmpty(a)},react_1.default.createElement("textarea",{ref:r,className:`${input_style_1.inputCn}_fld ${cn}_fld ${core_style_1.sbCn}`,name:e.$name,disabled:e.$disabled,readOnly:e.$readOnly,autoComplete:e.$autoComplete,maxLength:e.$maxLength,minLength:e.$minLength,required:e.$required,"data-align":e.$textAlign,onChange:t=>{const a=t.currentTarget.value,u=e.$changing?.(a);!1!==u?n.current=a:r.current.value=n.current??""},onBlur:e=>{l(e.currentTarget.value)},onKeyDown:e=>{switch(e.key){case"Enter":l(e.currentTarget.value);break;case"Escape":r.current.value=s.current}}}),e.$resize?react_1.default.createElement(resizer_1.default,{direction:"boolean"==typeof e.$resize?"xy":e.$resize}):react_1.default.createElement(react_1.default.Fragment,null),input_style_1.default,Style)})),useTextArea=()=>{const e=(0,react_1.useRef)({});return{focus:(0,react_1.useCallback)((()=>{e.current.focus?.()}),[]),getValue:(0,react_1.useCallback)((()=>e.current.getValue?.()),[]),setValue:(0,react_1.useCallback)((t=>{e.current.setValue?.(t)}),[]),_set:(0,react_1.useCallback)((t=>{e.current=t}),[])}};exports.useTextArea=useTextArea;const Style=react_1.default.createElement(jsx_style_1.default,{id:cn,depsDesign:!0},(({design:e})=>`\n.${cn} {\n width: 200px;\n height: calc(${css_var_1.default.size} * 3 + ${css_var_1.default.pdy} * 2);\n}\n.${cn}[placeholder] {\n${(0,css_var_1.switchDesign)(e,{_:`height: calc(${css_var_1.default.size} * 3 + ${css_var_1.default.pdy} * 2);`,c:`height: calc(${css_var_1.default.size} * 3 + ${css_var_1.default.pdy} * 2 + ${css_var_1.default.phsize});`})}\n}\n`));exports.default=TextArea;