@zh-keyboard/react 0.5.0 → 0.5.1

package/dist/zh-keyboard-react.umd.cjs

@@ -53,5 +53,5 @@ React keys must be passed directly to JSX without using spread:
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
 	http://jedwatson.github.io/classnames
-*/var ui;function Ny(){return ui||(ui=1,function(a){(function(){var s={}.hasOwnProperty;function f(){for(var k="",_=0;_<arguments.length;_++){var O=arguments[_];O&&(k=S(k,l(O)))}return k}function l(k){if(typeof k=="string"||typeof k=="number")return k;if(typeof k!="object")return"";if(Array.isArray(k))return f.apply(null,k);if(k.toString!==Object.prototype.toString&&!k.toString.toString().includes("[native code]"))return k.toString();var _="";for(var O in k)s.call(k,O)&&k[O]&&(_=S(_,O));return _}function S(k,_){return _?k?k+" "+_:k+_:k}a.exports?(f.default=f,a.exports=f):window.classNames=f})()}(Ar)),Ar.exports}var My=Ny();const ci=fa(My);function zy(a=!1){const[s,f]=H.useState(!1),[l,S]=H.useState(0);return H.useEffect(()=>{async function k(){const O=Ut();if(O)try{f(await O.initialize({onProgress:j=>{S(j)}}))}catch(j){console.error("初始化手写识别服务失败:",j),f(!1)}else console.warn("未注册手写识别服务"),f(!1)}async function _(){const O=Ut();if(O&&s)try{await O.close(),f(!1)}catch(j){console.error("关闭手写识别服务失败:",j)}}return a&&k(),()=>{_()}},[a,s]),{recognizerInitialized:s,recognizerProgress:l}}const Dr="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M21,11H6.83L10.41,7.41L9,6L3,12L9,18L10.41,16.58L6.83,13H21V11Z'%20/%3e%3c/svg%3e",Ir="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M19,7V11H5.83L9.41,7.41L8,6L2,12L8,18L9.41,16.58L5.83,13H21V7H19Z'%20/%3e%3c/svg%3e";function qt(){const a=H.useRef(Ky());H.useEffect(()=>{const l=a.current;return()=>{l.stop()}},[]);const s=H.useCallback((l,S)=>{var k,_;l.preventDefault(),(_=(k=l.currentTarget)==null?void 0:k.setPointerCapture)==null||_.call(k,l.pointerId),a.current.start(S)},[]),f=H.useCallback(()=>{a.current.stop()},[]);return{startRepeat:s,stopRepeat:f}}const li=({candidates:a,onSelect:s})=>{function f(l){s(l)}return A.jsx("div",{className:"zhk-candidate-list",children:a.map(l=>A.jsx("button",{className:"zhk-candidate-list__item",onClick:()=>f(l),children:l},`candidate-${l}`))})},Ly=({recognizerInitialized:a,recognizerProgress:s,onKey:f,onExit:l})=>{const S=H.useRef(null),k=H.useRef(null),_=H.useRef(null),O=H.useRef(!1),[j,I]=H.useState([]),{startRepeat:U,stopRepeat:K}=qt(),D=H.useCallback(async()=>{if(!_.current||_.current.getStrokeData().length===0||O.current)return;const ce=Ut();if(ce){O.current=!0;try{const Pe=[..._.current.getStrokeData()],De=await ce.recognize(Pe);I(De)}catch(Pe){console.error("识别笔迹失败:",Pe)}finally{O.current=!1}}else console.warn("手写识别服务不可用")},[]),Y=H.useCallback(()=>{S.current&&(_.current&&_.current.destroy(),_.current=new Cy(S.current,{onDrawEnd:D}))},[D]),[W,Q]=ri(k);H.useLayoutEffect(()=>{if(Q&&a)return Y(),()=>{_.current&&_.current.destroy()}},[Q,a,Y]);function $(){_.current&&_.current.clearCanvas()}function ue(ce){f({key:ce}),I([]),$()}function ee(ce){ce.preventDefault()}return A.jsxs("div",{className:"handwriting-input",children:[A.jsx(li,{candidates:j,onSelect:ue}),A.jsx("div",{ref:k,className:"handwriting-content",children:Q?A.jsxs(A.Fragment,{children:[A.jsxs("div",{className:"handwriting-buttons",children:[A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"。"})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:"。"}),A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"？"})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:"？"}),A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"！"})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:"！"}),A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"、"})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:"、"})]}),A.jsx("div",{className:"handwriting-canvas-container",children:a?A.jsx("canvas",{ref:S,className:"handwriting-canvas",width:Q,height:Q}):A.jsxs("div",{className:"handwriting-loading",style:{width:`${Q}px`,height:`${Q}px`},children:[A.jsx("div",{className:"loading-text",children:"正在加载手写识别..."}),A.jsx("div",{className:"progress-bar",children:A.jsx("div",{className:"progress-fill",style:{width:`${s*100}%`}})}),A.jsxs("div",{className:"progress-text",children:[Math.round(s*100),"%"]})]})}),A.jsxs("div",{className:"handwriting-buttons",children:[A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"delete",isControl:!0})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:A.jsx("img",{src:Dr,alt:"删除"})}),A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onClick:l,onContextMenu:ee,children:"返回"}),A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"，"})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:"，"}),A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"enter",isControl:!0})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:A.jsx("img",{src:Ir,alt:"回车"})})]})]}):null})]})},Fy="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M6,18H18V16H6M12,8.41L16.59,13L18,11.58L12,5.58L6,11.58L7.41,13L12,8.41Z'%20/%3e%3c/svg%3e",fi="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M3%2015H5V19H19V15H21V19C21%2020.1%2020.1%2021%2019%2021H5C3.9%2021%203%2020.1%203%2019V15Z'%20/%3e%3c/svg%3e",By="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z'%20/%3e%3c/svg%3e",Uy=({candidates:a,onSelect:s,onClose:f})=>{function l(k){s(k)}function S(){f()}return A.jsxs("div",{className:"zhk-selection",children:[A.jsx("div",{className:"zhk-selection__list",children:a.map(k=>A.jsx("div",{className:"zhk-selection__text",onClick:()=>l(k),children:k},k))}),A.jsx("div",{className:"zhk-selection__func",children:A.jsx("button",{className:"zhk-selection__func-btn",onClick:S,children:"返回"})})]})},qy=({currentPinyin:a,onInput:s,setCurrentPinyin:f})=>{const l=H.useMemo(()=>new Sy,[]),[S,k]=H.useState([]),[_,O]=H.useState(!1);H.useEffect(()=>{async function U(){k(await l.processInput(a))}U()},[a,l]);const j=H.useMemo(()=>S.slice(0,30),[S]);function I(U){l.selectCandidate(U),s(U),f(""),O(!1)}return A.jsxs("div",{className:"zhk-candidate",children:[A.jsxs("div",{className:"zhk-candidate__container",children:[a&&A.jsx("div",{className:"zhk-candidate__pinyin",children:a}),A.jsxs("div",{className:"zhk-candidate__bottom-container",children:[S.length>0&&A.jsx(li,{candidates:j,onSelect:I}),S.length>0&&A.jsx("button",{className:"zhk-candidate__more",onClick:()=>O(!0),children:A.jsx("img",{src:By,alt:"更多"})})]})]}),_&&A.jsx(Uy,{candidates:S,onSelect:I,onClose:()=>O(!1)})]})},Vy=({enableHandwriting:a,mode:s,onKey:f,setMode:l})=>{const[S,k]=H.useState(!1),[_,O]=H.useState(""),{startRepeat:j,stopRepeat:I}=qt(),U=H.useMemo(()=>s==="zh",[s]),K=H.useMemo(()=>U?!0:S,[U,S]);function D(he,Ie=!1){f({key:he,isControl:Ie})}function Y(){U?l("hand"):k(!S)}function W(){l("num")}function Q(){l("symbol")}const $=["1","2","3","4","5","6","7","8","9","0"],ue=[["q","w","e","r","t","y","u","i","o","p"],["a","s","d","f","g","h","j","k","l"],["z","x","c","v","b","n","m"]];function ee(){if(s==="zh"&&_){O(_.slice(0,-1));return}D("delete",!0)}function ce(he){if(s==="zh"){O(_+he);return}const Ie=S?he.toUpperCase():he;D(Ie)}function Pe(){l(s==="zh"?"en":"zh")}const De=H.useMemo(()=>a?"手写":"-",[a]),Se=H.useMemo(()=>!a,[a]);function fe(he){he.preventDefault()}return A.jsxs("div",{className:"zhk-base",children:[A.jsx("div",{className:"zhk-base__row",children:s==="zh"?A.jsx(qy,{currentPinyin:_,onInput:he=>D(he,!1),onKey:f,setCurrentPinyin:O}):$.map(he=>A.jsx("button",{className:"zhk-base__key zhk-base__key--letter",onPointerDown:Ie=>j(Ie,()=>ce(he)),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:he},`number-${he}`))}),ue.map((he,Ie)=>A.jsxs("div",{className:"zhk-base__row",children:[Ie===2&&A.jsx("button",{className:`zhk-base__key zhk-base__key--function zhk-base__key--shift ${!U&&S?"zhk-base__key--active":""} ${U&&Se?"zhk-base__key--disabled":""}`,disabled:U&&Se,onClick:Y,onContextMenu:fe,children:U?De:A.jsx("img",{src:Fy,className:"zhk-base__key-icon",alt:"Shift"})}),he.map(Ke=>A.jsx("button",{className:"zhk-base__key zhk-base__key--letter",onPointerDown:Xe=>j(Xe,()=>ce(Ke)),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:K?Ke.toUpperCase():Ke},Ke)),Ie===2&&A.jsx("button",{className:"zhk-base__key zhk-base__key--function zhk-base__key--delete",onPointerDown:Ke=>j(Ke,()=>ee()),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:A.jsx("img",{src:Dr,className:"zhk-base__key-icon",alt:"Delete"})})]},`row-${he.join("")}`)),A.jsxs("div",{className:"zhk-base__row",children:[A.jsx("button",{className:"zhk-base__key zhk-base__key--function",onClick:Q,onContextMenu:fe,children:"符"}),A.jsx("button",{className:"zhk-base__key zhk-base__key--function",onClick:W,onContextMenu:fe,children:"123"}),A.jsx("button",{className:"zhk-base__key",onPointerDown:he=>j(he,()=>D(",")),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:"，"}),A.jsx("button",{className:"zhk-base__key zhk-base__key--space",onPointerDown:he=>j(he,()=>D(" ")),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:A.jsx("img",{src:fi,className:"zhk-base__key-icon",alt:"Space"})}),A.jsx("button",{className:"zhk-base__key",onPointerDown:he=>j(he,()=>D("。")),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:"。"}),A.jsxs("button",{className:"zhk-base__key zhk-base__key--function",onClick:Pe,onContextMenu:fe,children:[A.jsx("span",{className:"zhk-base__toggle-main",children:s==="zh"?"中":"英"}),A.jsxs("span",{className:"zhk-base__toggle-sub",children:["/",s==="zh"?"英":"中"]})]}),A.jsx("button",{className:"zhk-base__key zhk-base__key--function",onPointerDown:he=>j(he,()=>D("enter",!0)),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:A.jsx("img",{src:Ir,className:"zhk-base__key-icon",alt:"Enter"})})]})]})},Hy=[["1","2","3"],["4","5","6"],["7","8","9"],["back","0","space"]],Wy=({onKey:a,onExit:s,keyboardRows:f=Hy})=>{const{startRepeat:l,stopRepeat:S}=qt(),k=[{key:"delete",icon:Dr,text:"",alt:"Delete"},{key:".",icon:"",text:".",alt:"."},{key:"@",icon:"",text:"@",alt:"@"},{key:"enter",icon:Ir,text:"",alt:"Enter"}];function _(D){a({key:D})}function O(D,Y=!0){a({key:D,isControl:Y})}function j(){s()}function I(D){D.preventDefault()}function U(D,Y){D==="back"||(D==="space"&&(D=" "),D==="delete"||D==="enter"?l(Y,()=>O(D)):l(Y,()=>_(D)))}const K=D=>D==="back"?"返回":D==="space"?A.jsx("img",{src:fi,className:"zhk-base__key-icon",alt:"Space"}):D;return A.jsx("div",{className:"num-keyboard",children:A.jsxs("div",{className:"num-keyboard__container",children:[A.jsx("div",{className:"num-keyboard__left",children:A.jsx("div",{className:"num-keyboard__rows",children:f.map(D=>A.jsx("div",{className:"num-keyboard__row",children:D.map(Y=>A.jsx("button",{className:`num-keyboard__key ${Y==="back"?"num-keyboard__key--back":""} ${Y==="space"?"num-keyboard__key--space":""}`,onClick:()=>Y==="back"&&j(),onPointerDown:W=>U(Y,W),onPointerUp:S,onPointerLeave:S,onPointerCancel:S,onContextMenu:I,children:K(Y)},`key-${D.join("")}-${Y}`))},`row-${D.join("")}`))})}),A.jsx("div",{className:"num-keyboard__right",children:k.map(D=>A.jsx("button",{className:"num-keyboard__key num-keyboard__key--function",onPointerDown:Y=>{if(D.key==="."||D.key==="@"){l(Y,()=>_(D.key));return}l(Y,()=>O(D.key))},onPointerUp:S,onPointerLeave:S,onPointerCancel:S,onContextMenu:I,children:D.icon?A.jsx("img",{src:D.icon,className:"num-keyboard__key-icon",alt:D.alt}):A.jsx("span",{children:D.text})},`func-${D.key}`))})]})})},Yy="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M18,20V10H6V20H18M18,8A2,2%200%200,1%2020,10V20A2,2%200%200,1%2018,22H6C4.89,22%204,21.1%204,20V10A2,2%200%200,1%206,8H15V6A3,3%200%200,0%2012,3A3,3%200%200,0%209,6H7A5,5%200%200,1%2012,1A5,5%200%200,1%2017,6V8H18M12,17A2,2%200%200,1%2010,15A2,2%200%200,1%2012,13A2,2%200%200,1%2014,15A2,2%200%200,1%2012,17Z'%20/%3e%3c/svg%3e",Gy="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M12,17C10.89,17%2010,16.1%2010,15C10,13.89%2010.89,13%2012,13A2,2%200%200,1%2014,15A2,2%200%200,1%2012,17M18,20V10H6V20H18M18,8A2,2%200%200,1%2020,10V20A2,2%200%200,1%2018,22H6C4.89,22%204,21.1%204,20V10C4,8.89%204.89,8%206,8H7V6A5,5%200%200,1%2012,1A5,5%200%200,1%2017,6V8H18M12,3A3,3%200%200,0%209,6V8H15V6A3,3%200%200,0%2012,3Z'%20/%3e%3c/svg%3e",Xy=({onKey:a,onExit:s})=>{const f="!@#$%^&*(){}[]<>/\\|:;\"',.?+-=_~`€£¥₹©®™°",l="！＠＃￥％…＆＊（）｛｝［］＜＞／＼｜：；＂＇，。？＋－＝＿～·€£¥₹©®™°",[S,k]=H.useState("en"),_=H.useMemo(()=>S==="zh"?l:f,[S]),[O,j]=H.useState(!1),{startRepeat:I,stopRepeat:U}=qt();function K($){a({key:$}),O||s()}function D(){s()}function Y(){j(!O)}function W($){$.preventDefault()}function Q($,ue){O&&I(ue,()=>K($))}return A.jsx("div",{className:"symbol-keyboard",children:A.jsxs("div",{className:"symbol-keyboard__content",children:[A.jsxs("div",{className:"symbol-keyboard__functions",children:[A.jsxs("div",{className:"symbol-keyboard__lang-selector",children:[A.jsx("button",{type:"button",className:`symbol-keyboard__lang-btn ${S==="zh"?"symbol-keyboard__lang-btn--active":""}`,onClick:()=>k("zh"),onContextMenu:W,children:"中文"}),A.jsx("button",{className:`symbol-keyboard__lang-btn ${S==="en"?"symbol-keyboard__lang-btn--active":""}`,onClick:()=>k("en"),onContextMenu:W,children:"英文"})]}),A.jsxs("div",{className:"symbol-keyboard__control-group",children:[A.jsx("button",{className:`symbol-keyboard__key symbol-keyboard__key--function symbol-keyboard__key--lock ${O?"symbol-keyboard__key--locked":""}`,onClick:Y,onContextMenu:W,children:O?A.jsx("img",{src:Gy,alt:"Lock closed"}):A.jsx("img",{src:Yy,alt:"Lock open"})}),A.jsx("button",{className:"symbol-keyboard__key symbol-keyboard__key--function symbol-keyboard__key--back",onClick:D,onContextMenu:W,children:"返回"})]})]}),A.jsx("div",{className:"symbol-keyboard__symbols-container",children:A.jsx("div",{className:"symbol-keyboard__symbols-grid",children:_.split("").map($=>A.jsx("button",{className:"symbol-keyboard__key",onClick:()=>!O&&K($),onPointerDown:ue=>Q($,ue),onPointerUp:U,onPointerLeave:U,onPointerCancel:U,onContextMenu:W,children:$},`key-${$}`))})})]})})},Jy=({defaultMode:a=Bn().defaultMode??"en",enableHandwriting:s=Bn().enableHandwriting??!1,position:f=Bn().position??"static",disableWhenNoFocus:l=Bn().disableWhenNoFocus??!0,onKey:S,className:k,style:_,numKeys:O=Bn().numKeys})=>{const[j,I]=H.useState(a),U=H.useRef(a),[K,D]=H.useState(null),Y=H.useRef(null),W=Hu(),[Q,$]=ri(Y),{recognizerInitialized:ue,recognizerProgress:ee}=zy(s);H.useEffect(()=>{(j==="en"||j==="zh")&&(U.current=j)},[j]);const[ce,Pe]=H.useState(!1),De=H.useRef(null),Se=H.useCallback(()=>{if(!$)return;const _e=jy(W,Y.current,f);D(_e)},[W,f,$]),fe=H.useMemo(()=>f==="static"||yt(W),[W,f]);H.useLayoutEffect(()=>{const _e=De.current!==W;fe&&$&&_e&&(De.current=W,Se())},[fe,W,Se,$]),H.useLayoutEffect(()=>{if($&&!ce){Se();const _e=setTimeout(()=>{Pe(!0)},0);return()=>clearTimeout(_e)}},[$,ce,Se]),H.useLayoutEffect(()=>{if(W&&yt(W)){const _e=W.dataset.inputmode;I(je=>_e||je)}},[W]);const he=H.useMemo(()=>l===!1?!1:!yt(W),[l,W]),Ie=H.useMemo(()=>{let _e;return()=>{clearTimeout(_e),_e=setTimeout(Se,100)}},[Se]);zt("scroll",Ie,window,{passive:!0}),zt("resize",Ie,window,{passive:!0});const Ke=H.useCallback(_e=>{if(_e.isControl)switch(_e.key){case"delete":yt(W)&&Dy(W);break}else W&&yt(W)&&Ay(W,_e.key);S&&S(_e)},[S,W]),Xe=H.useCallback(()=>{["hand","num","symbol"].includes(U.current)&&I(a),I(U.current)},[a]);return A.jsx("div",{ref:Y,className:ci("zhk",{"zhk--floating":f==="float","zhk--bottom":f==="bottom","zhk--disabled":he},k),style:{"--keyboard-height":`${$}px`,...K,..._,display:fe?void 0:"none",opacity:ce?1:0},onMouseDown:_e=>_e.preventDefault(),children:he||!fe||!$?A.jsx("div",{className:ci("zhk__disabled-overlay"),children:A.jsx("span",{children:"请选择输入框以启用键盘"})}):A.jsxs(A.Fragment,{children:[j==="hand"&&A.jsx(Ly,{recognizerInitialized:ue,recognizerProgress:ee,onKey:Ke,onExit:Xe}),j==="num"&&A.jsx(Wy,{onKey:Ke,onExit:Xe,keyboardRows:O}),j==="symbol"&&A.jsx(Xy,{onKey:Ke,onExit:Xe}),(j==="en"||j==="zh")&&A.jsx(Vy,{mode:j,setMode:I,enableHandwriting:s,onKey:Ke})]})})},hi=a=>{const{position:s="static"}=a,f=A.jsx(Jy,{...a});return s==="static"?f:zn.createPortal(f,document.body)};ge.ZhKeyboard=hi,ge.default=hi,ge.getHandwritingRecognizer=Ut,ge.getKeyboardConfig=Bn,ge.registerHandwritingRecognizer=Oy,ge.setKeyboardConfig=Py,Object.defineProperties(ge,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+*/var ui;function Ny(){return ui||(ui=1,function(a){(function(){var s={}.hasOwnProperty;function f(){for(var k="",_=0;_<arguments.length;_++){var O=arguments[_];O&&(k=S(k,l(O)))}return k}function l(k){if(typeof k=="string"||typeof k=="number")return k;if(typeof k!="object")return"";if(Array.isArray(k))return f.apply(null,k);if(k.toString!==Object.prototype.toString&&!k.toString.toString().includes("[native code]"))return k.toString();var _="";for(var O in k)s.call(k,O)&&k[O]&&(_=S(_,O));return _}function S(k,_){return _?k?k+" "+_:k+_:k}a.exports?(f.default=f,a.exports=f):window.classNames=f})()}(Ar)),Ar.exports}var My=Ny();const ci=fa(My);function zy(a=!1){const[s,f]=H.useState(!1),[l,S]=H.useState(0);return H.useEffect(()=>{async function k(){const O=Ut();if(O)try{f(await O.initialize({onProgress:j=>{S(j)}}))}catch(j){console.error("初始化手写识别服务失败:",j),f(!1)}else console.warn("未注册手写识别服务"),f(!1)}async function _(){const O=Ut();if(O&&s)try{await O.close(),f(!1)}catch(j){console.error("关闭手写识别服务失败:",j)}}return a&&k(),()=>{_()}},[a,s]),{recognizerInitialized:s,recognizerProgress:l}}const Dr="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M21,11H6.83L10.41,7.41L9,6L3,12L9,18L10.41,16.58L6.83,13H21V11Z'%20/%3e%3c/svg%3e",Ir="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M19,7V11H5.83L9.41,7.41L8,6L2,12L8,18L9.41,16.58L5.83,13H21V7H19Z'%20/%3e%3c/svg%3e";function qt(){const a=H.useRef(Ky());H.useEffect(()=>{const l=a.current;return()=>{l.stop()}},[]);const s=H.useCallback((l,S)=>{var k,_;l.preventDefault(),(_=(k=l.currentTarget)==null?void 0:k.setPointerCapture)==null||_.call(k,l.pointerId),a.current.start(S)},[]),f=H.useCallback(()=>{a.current.stop()},[]);return{startRepeat:s,stopRepeat:f}}const li=({candidates:a,onSelect:s})=>{function f(l){s(l)}return A.jsx("div",{className:"zhk-candidate-list",children:a.map(l=>A.jsx("button",{className:"zhk-candidate-list__item",onClick:()=>f(l),children:l},`candidate-${l}`))})},Ly=({recognizerInitialized:a,recognizerProgress:s,onKey:f,onExit:l})=>{const S=H.useRef(null),k=H.useRef(null),_=H.useRef(null),O=H.useRef(!1),[j,I]=H.useState([]),{startRepeat:U,stopRepeat:K}=qt(),D=H.useCallback(async()=>{if(!_.current||_.current.getStrokeData().length===0||O.current)return;const ce=Ut();if(ce){O.current=!0;try{const Pe=[..._.current.getStrokeData()],De=await ce.recognize(Pe);I(De)}catch(Pe){console.error("识别笔迹失败:",Pe)}finally{O.current=!1}}else console.warn("手写识别服务不可用")},[]),Y=H.useCallback(()=>{S.current&&(_.current&&_.current.destroy(),_.current=new Cy(S.current,{onDrawEnd:D}))},[D]),[W,Q]=ri(k);H.useLayoutEffect(()=>{if(Q&&a)return Y(),()=>{_.current&&_.current.destroy()}},[Q,a,Y]);function $(){_.current&&_.current.clearCanvas()}function ue(ce){f({key:ce}),I([]),$()}function ee(ce){ce.preventDefault()}return A.jsxs("div",{className:"handwriting-input",children:[A.jsx(li,{candidates:j,onSelect:ue}),A.jsx("div",{ref:k,className:"handwriting-content",children:Q?A.jsxs(A.Fragment,{children:[A.jsxs("div",{className:"handwriting-buttons",children:[A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"。"})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:"。"}),A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"？"})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:"？"}),A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"！"})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:"！"}),A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"、"})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:"、"})]}),A.jsx("div",{className:"handwriting-canvas-container",children:a?A.jsx("canvas",{ref:S,className:"handwriting-canvas",width:Q,height:Q}):A.jsxs("div",{className:"handwriting-loading",style:{width:`${Q}px`,height:`${Q}px`},children:[A.jsx("div",{className:"loading-text",children:"正在加载手写识别..."}),A.jsx("div",{className:"progress-bar",children:A.jsx("div",{className:"progress-fill",style:{width:`${s*100}%`}})}),A.jsxs("div",{className:"progress-text",children:[Math.round(s*100),"%"]})]})}),A.jsxs("div",{className:"handwriting-buttons",children:[A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"delete",isControl:!0})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:A.jsx("img",{src:Dr,alt:"删除"})}),A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onClick:l,onContextMenu:ee,children:"返回"}),A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"，"})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:"，"}),A.jsx("button",{className:"handwriting-btn handwriting-btn--function",onPointerDown:ce=>U(ce,()=>f({key:"enter",isControl:!0})),onPointerUp:K,onPointerLeave:K,onPointerCancel:K,onContextMenu:ee,children:A.jsx("img",{src:Ir,alt:"回车"})})]})]}):null})]})},Fy="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M6,18H18V16H6M12,8.41L16.59,13L18,11.58L12,5.58L6,11.58L7.41,13L12,8.41Z'%20/%3e%3c/svg%3e",fi="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M3%2015H5V19H19V15H21V19C21%2020.1%2020.1%2021%2019%2021H5C3.9%2021%203%2020.1%203%2019V15Z'%20/%3e%3c/svg%3e",By="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z'%20/%3e%3c/svg%3e",Uy=({candidates:a,onSelect:s,onClose:f})=>{function l(k){s(k)}function S(){f()}return A.jsxs("div",{className:"zhk-selection",children:[A.jsx("div",{className:"zhk-selection__list",children:a.map(k=>A.jsx("div",{className:"zhk-selection__text",onClick:()=>l(k),children:k},k))}),A.jsx("div",{className:"zhk-selection__func",children:A.jsx("button",{className:"zhk-selection__func-btn",onClick:S,children:"返回"})})]})},qy=({currentPinyin:a,onInput:s,setCurrentPinyin:f})=>{const l=H.useMemo(()=>new Sy,[]),[S,k]=H.useState([]),[_,O]=H.useState(!1);H.useEffect(()=>{async function U(){k(await l.processInput(a))}U()},[a,l]);const j=H.useMemo(()=>S.slice(0,30),[S]);function I(U){l.selectCandidate(U),s(U),f(""),O(!1)}return A.jsxs("div",{className:"zhk-candidate",children:[A.jsxs("div",{className:"zhk-candidate__container",children:[a&&A.jsx("div",{className:"zhk-candidate__pinyin",children:a}),A.jsxs("div",{className:"zhk-candidate__bottom-container",children:[S.length>0&&A.jsx(li,{candidates:j,onSelect:I}),S.length>0&&A.jsx("button",{className:"zhk-candidate__more",onClick:()=>O(!0),children:A.jsx("img",{src:By,alt:"更多"})})]})]}),_&&A.jsx(Uy,{candidates:S,onSelect:I,onClose:()=>O(!1)})]})},Vy=({enableHandwriting:a,mode:s,onKey:f,setMode:l})=>{const[S,k]=H.useState(!1),[_,O]=H.useState(""),{startRepeat:j,stopRepeat:I}=qt(),U=H.useMemo(()=>s==="zh",[s]),K=H.useMemo(()=>U?!0:S,[U,S]);function D(he,Ie=!1){f({key:he,isControl:Ie})}function Y(){U?l("hand"):k(!S)}function W(){l("num")}function Q(){l("symbol")}const $=["1","2","3","4","5","6","7","8","9","0"],ue=[["q","w","e","r","t","y","u","i","o","p"],["a","s","d","f","g","h","j","k","l"],["z","x","c","v","b","n","m"]];function ee(){if(s==="zh"&&_){O(_.slice(0,-1));return}D("delete",!0)}function ce(he){if(s==="zh"){O(_+he);return}const Ie=S?he.toUpperCase():he;D(Ie)}function Pe(){l(s==="zh"?"en":"zh")}const De=H.useMemo(()=>a?"手写":"-",[a]),Se=H.useMemo(()=>!a,[a]);function fe(he){he.preventDefault()}return A.jsxs("div",{className:"zhk-base",children:[A.jsx("div",{className:"zhk-base__row",children:s==="zh"?A.jsx(qy,{currentPinyin:_,onInput:he=>D(he,!1),onKey:f,setCurrentPinyin:O}):$.map(he=>A.jsx("button",{className:"zhk-base__key zhk-base__key--letter",onPointerDown:Ie=>j(Ie,()=>ce(he)),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:he},`number-${he}`))}),ue.map((he,Ie)=>A.jsxs("div",{className:"zhk-base__row",children:[Ie===2&&A.jsx("button",{className:`zhk-base__key zhk-base__key--function zhk-base__key--shift ${!U&&S?"zhk-base__key--active":""} ${U&&Se?"zhk-base__key--disabled":""}`,disabled:U&&Se,onClick:Y,onContextMenu:fe,children:U?De:A.jsx("img",{src:Fy,className:"zhk-base__key-icon",alt:"Shift"})}),he.map(Ke=>A.jsx("button",{className:"zhk-base__key zhk-base__key--letter",onPointerDown:Xe=>j(Xe,()=>ce(Ke)),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:K?Ke.toUpperCase():Ke},Ke)),Ie===2&&A.jsx("button",{className:"zhk-base__key zhk-base__key--function zhk-base__key--delete",onPointerDown:Ke=>j(Ke,()=>ee()),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:A.jsx("img",{src:Dr,className:"zhk-base__key-icon",alt:"Delete"})})]},`row-${he.join("")}`)),A.jsxs("div",{className:"zhk-base__row",children:[A.jsx("button",{className:"zhk-base__key zhk-base__key--function",onClick:Q,onContextMenu:fe,children:"符"}),A.jsx("button",{className:"zhk-base__key zhk-base__key--function",onClick:W,onContextMenu:fe,children:"123"}),A.jsx("button",{className:"zhk-base__key",onPointerDown:he=>j(he,()=>D(",")),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:"，"}),A.jsx("button",{className:"zhk-base__key zhk-base__key--space",onPointerDown:he=>j(he,()=>D(" ")),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:A.jsx("img",{src:fi,className:"zhk-base__key-icon",alt:"Space"})}),A.jsx("button",{className:"zhk-base__key",onPointerDown:he=>j(he,()=>D("。")),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:"。"}),A.jsxs("button",{className:"zhk-base__key zhk-base__key--function",onClick:Pe,onContextMenu:fe,children:[A.jsx("span",{className:"zhk-base__toggle-main",children:s==="zh"?"中":"英"}),A.jsxs("span",{className:"zhk-base__toggle-sub",children:["/",s==="zh"?"英":"中"]})]}),A.jsx("button",{className:"zhk-base__key zhk-base__key--function",onPointerDown:he=>j(he,()=>D("enter",!0)),onPointerUp:I,onPointerLeave:I,onPointerCancel:I,onContextMenu:fe,children:A.jsx("img",{src:Ir,className:"zhk-base__key-icon",alt:"Enter"})})]})]})},Hy=[["1","2","3"],["4","5","6"],["7","8","9"],["back","0","space"]],Wy=({onKey:a,onExit:s,keyboardRows:f=Bn().numKeys||Hy})=>{const{startRepeat:l,stopRepeat:S}=qt(),k=[{key:"delete",icon:Dr,text:"",alt:"Delete"},{key:".",icon:"",text:".",alt:"."},{key:"@",icon:"",text:"@",alt:"@"},{key:"enter",icon:Ir,text:"",alt:"Enter"}];function _(D){a({key:D})}function O(D,Y=!0){a({key:D,isControl:Y})}function j(){s()}function I(D){D.preventDefault()}function U(D,Y){D==="back"||(D==="space"&&(D=" "),D==="delete"||D==="enter"?l(Y,()=>O(D)):l(Y,()=>_(D)))}const K=D=>D==="back"?"返回":D==="space"?A.jsx("img",{src:fi,className:"zhk-base__key-icon",alt:"Space"}):D;return A.jsx("div",{className:"num-keyboard",children:A.jsxs("div",{className:"num-keyboard__container",children:[A.jsx("div",{className:"num-keyboard__left",children:A.jsx("div",{className:"num-keyboard__rows",children:f.map(D=>A.jsx("div",{className:"num-keyboard__row",children:D.map(Y=>A.jsx("button",{className:`num-keyboard__key ${Y==="back"?"num-keyboard__key--back":""} ${Y==="space"?"num-keyboard__key--space":""}`,onClick:()=>Y==="back"&&j(),onPointerDown:W=>U(Y,W),onPointerUp:S,onPointerLeave:S,onPointerCancel:S,onContextMenu:I,children:K(Y)},`key-${D.join("")}-${Y}`))},`row-${D.join("")}`))})}),A.jsx("div",{className:"num-keyboard__right",children:k.map(D=>A.jsx("button",{className:"num-keyboard__key num-keyboard__key--function",onPointerDown:Y=>{if(D.key==="."||D.key==="@"){l(Y,()=>_(D.key));return}l(Y,()=>O(D.key))},onPointerUp:S,onPointerLeave:S,onPointerCancel:S,onContextMenu:I,children:D.icon?A.jsx("img",{src:D.icon,className:"num-keyboard__key-icon",alt:D.alt}):A.jsx("span",{children:D.text})},`func-${D.key}`))})]})})},Yy="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M18,20V10H6V20H18M18,8A2,2%200%200,1%2020,10V20A2,2%200%200,1%2018,22H6C4.89,22%204,21.1%204,20V10A2,2%200%200,1%206,8H15V6A3,3%200%200,0%2012,3A3,3%200%200,0%209,6H7A5,5%200%200,1%2012,1A5,5%200%200,1%2017,6V8H18M12,17A2,2%200%200,1%2010,15A2,2%200%200,1%2012,13A2,2%200%200,1%2014,15A2,2%200%200,1%2012,17Z'%20/%3e%3c/svg%3e",Gy="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M12,17C10.89,17%2010,16.1%2010,15C10,13.89%2010.89,13%2012,13A2,2%200%200,1%2014,15A2,2%200%200,1%2012,17M18,20V10H6V20H18M18,8A2,2%200%200,1%2020,10V20A2,2%200%200,1%2018,22H6C4.89,22%204,21.1%204,20V10C4,8.89%204.89,8%206,8H7V6A5,5%200%200,1%2012,1A5,5%200%200,1%2017,6V8H18M12,3A3,3%200%200,0%209,6V8H15V6A3,3%200%200,0%2012,3Z'%20/%3e%3c/svg%3e",Xy=({onKey:a,onExit:s})=>{const f="!@#$%^&*(){}[]<>/\\|:;\"',.?+-=_~`€£¥₹©®™°",l="！＠＃￥％…＆＊（）｛｝［］＜＞／＼｜：；＂＇，。？＋－＝＿～·€£¥₹©®™°",[S,k]=H.useState("en"),_=H.useMemo(()=>S==="zh"?l:f,[S]),[O,j]=H.useState(!1),{startRepeat:I,stopRepeat:U}=qt();function K($){a({key:$}),O||s()}function D(){s()}function Y(){j(!O)}function W($){$.preventDefault()}function Q($,ue){O&&I(ue,()=>K($))}return A.jsx("div",{className:"symbol-keyboard",children:A.jsxs("div",{className:"symbol-keyboard__content",children:[A.jsxs("div",{className:"symbol-keyboard__functions",children:[A.jsxs("div",{className:"symbol-keyboard__lang-selector",children:[A.jsx("button",{type:"button",className:`symbol-keyboard__lang-btn ${S==="zh"?"symbol-keyboard__lang-btn--active":""}`,onClick:()=>k("zh"),onContextMenu:W,children:"中文"}),A.jsx("button",{className:`symbol-keyboard__lang-btn ${S==="en"?"symbol-keyboard__lang-btn--active":""}`,onClick:()=>k("en"),onContextMenu:W,children:"英文"})]}),A.jsxs("div",{className:"symbol-keyboard__control-group",children:[A.jsx("button",{className:`symbol-keyboard__key symbol-keyboard__key--function symbol-keyboard__key--lock ${O?"symbol-keyboard__key--locked":""}`,onClick:Y,onContextMenu:W,children:O?A.jsx("img",{src:Gy,alt:"Lock closed"}):A.jsx("img",{src:Yy,alt:"Lock open"})}),A.jsx("button",{className:"symbol-keyboard__key symbol-keyboard__key--function symbol-keyboard__key--back",onClick:D,onContextMenu:W,children:"返回"})]})]}),A.jsx("div",{className:"symbol-keyboard__symbols-container",children:A.jsx("div",{className:"symbol-keyboard__symbols-grid",children:_.split("").map($=>A.jsx("button",{className:"symbol-keyboard__key",onClick:()=>!O&&K($),onPointerDown:ue=>Q($,ue),onPointerUp:U,onPointerLeave:U,onPointerCancel:U,onContextMenu:W,children:$},`key-${$}`))})})]})})},Jy=({defaultMode:a=Bn().defaultMode??"en",enableHandwriting:s=Bn().enableHandwriting??!1,position:f=Bn().position??"static",disableWhenNoFocus:l=Bn().disableWhenNoFocus??!0,onKey:S,className:k,style:_,numKeys:O})=>{const[j,I]=H.useState(a),U=H.useRef(a),[K,D]=H.useState(null),Y=H.useRef(null),W=Hu(),[Q,$]=ri(Y),{recognizerInitialized:ue,recognizerProgress:ee}=zy(s);H.useEffect(()=>{(j==="en"||j==="zh")&&(U.current=j)},[j]);const[ce,Pe]=H.useState(!1),De=H.useRef(null),Se=H.useCallback(()=>{if(!$)return;const _e=jy(W,Y.current,f);D(_e)},[W,f,$]),fe=H.useMemo(()=>f==="static"||yt(W),[W,f]);H.useLayoutEffect(()=>{const _e=De.current!==W;fe&&$&&_e&&(De.current=W,Se())},[fe,W,Se,$]),H.useLayoutEffect(()=>{if($&&!ce){Se();const _e=setTimeout(()=>{Pe(!0)},0);return()=>clearTimeout(_e)}},[$,ce,Se]),H.useLayoutEffect(()=>{if(W&&yt(W)){const _e=W.dataset.inputmode;I(je=>_e||je)}},[W]);const he=H.useMemo(()=>l===!1?!1:!yt(W),[l,W]),Ie=H.useMemo(()=>{let _e;return()=>{clearTimeout(_e),_e=setTimeout(Se,100)}},[Se]);zt("scroll",Ie,window,{passive:!0}),zt("resize",Ie,window,{passive:!0});const Ke=H.useCallback(_e=>{if(_e.isControl)switch(_e.key){case"delete":yt(W)&&Dy(W);break}else W&&yt(W)&&Ay(W,_e.key);S&&S(_e)},[S,W]),Xe=H.useCallback(()=>{["hand","num","symbol"].includes(U.current)&&I(a),I(U.current)},[a]);return A.jsx("div",{ref:Y,className:ci("zhk",{"zhk--floating":f==="float","zhk--bottom":f==="bottom","zhk--disabled":he},k),style:{"--keyboard-height":`${$}px`,...K,..._,display:fe?void 0:"none",opacity:ce?1:0},onMouseDown:_e=>_e.preventDefault(),children:he||!fe||!$?A.jsx("div",{className:ci("zhk__disabled-overlay"),children:A.jsx("span",{children:"请选择输入框以启用键盘"})}):A.jsxs(A.Fragment,{children:[j==="hand"&&A.jsx(Ly,{recognizerInitialized:ue,recognizerProgress:ee,onKey:Ke,onExit:Xe}),j==="num"&&A.jsx(Wy,{onKey:Ke,onExit:Xe,keyboardRows:O}),j==="symbol"&&A.jsx(Xy,{onKey:Ke,onExit:Xe}),(j==="en"||j==="zh")&&A.jsx(Vy,{mode:j,setMode:I,enableHandwriting:s,onKey:Ke})]})})},hi=a=>{const{position:s="static"}=a,f=A.jsx(Jy,{...a});return s==="static"?f:zn.createPortal(f,document.body)};ge.ZhKeyboard=hi,ge.default=hi,ge.getHandwritingRecognizer=Ut,ge.getKeyboardConfig=Bn,ge.registerHandwritingRecognizer=Oy,ge.setKeyboardConfig=Py,Object.defineProperties(ge,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
 //# sourceMappingURL=zh-keyboard-react.umd.cjs.map