UNPKG

react-split-pane

Version:

React split-pane component with hooks and TypeScript

3 lines (2 loc) 2.26 kB
"use strict";var e=require("react");function t(e,t,n){return Math.min(Math.max(e,t),n)}function n(e,t="polite"){if("undefined"==typeof document)return;const n=document.createElement("div");n.setAttribute("role","status"),n.setAttribute("aria-live",t),n.setAttribute("aria-atomic","true"),n.style.position="absolute",n.style.left="-10000px",n.style.width="1px",n.style.height="1px",n.style.overflow="hidden",n.textContent=e,document.body.appendChild(n),setTimeout(()=>{document.body.removeChild(n)},1e3)}function r(e){return 1e3>e?Math.round(e)+" pixels":Math.round(e/10)/100+" thousand pixels"}const i=10,o=50;exports.useKeyboardResize=function(s){const{direction:a,sizes:u,minSizes:c,maxSizes:l,step:d=i,largeStep:h=o,onResize:m,onResizeEnd:y}=s,f=e.useRef(null);return{handleKeyDown:e.useCallback(e=>i=>{if(!("horizontal"===a?["ArrowLeft","ArrowRight"]:["ArrowUp","ArrowDown"]).includes(i.key)&&"Home"!==i.key&&"End"!==i.key&&"Escape"!==i.key)return;if(i.preventDefault(),"Escape"===i.key){if(f.current){const e=f.current;f.current=null,m&&m(e,{sizes:e,source:"keyboard",originalEvent:i.nativeEvent}),y&&y(e,{sizes:e,source:"keyboard",originalEvent:i.nativeEvent}),n("Pane sizes restored")}return}null===f.current&&(f.current=[...u]);let o=0,s=[...u],p="arrow";switch(i.key){case"ArrowLeft":case"ArrowUp":o=-(i.shiftKey?h:d);break;case"ArrowRight":case"ArrowDown":o=i.shiftKey?h:d;break;case"Home":{p="home";const t=e+1,n=c[e]??0,r=(u[e]??0)+(u[t]??0);s[e]=n,s[t]=r-n;break}case"End":{p="end";const t=e,n=e+1,r=(u[t]??0)+(u[n]??0);s[t]=Math.min(l[t]??1/0,r-(c[n]??0)),s[n]=r-s[t];break}}if(0!==o&&(s=function(e,n,r,i,o){const s=[...e],a=e[n]??0,u=e[n+1]??0,c=i[n+1]??0,l=o[n+1]??1/0;let d=t(a+r,i[n]??0,o[n]??1/0),h=t(u-r,c,l);const m=u-h,y=Math.min(Math.abs(d-a),Math.abs(m));return r>0?(d=a+y,h=u-y):(d=a-y,h=u+y),s[n]=d,s[n+1]=h,s}(u,e,o,c,l)),s=s.map((e,n)=>t(e,c[n]??0,l[n]??1/0)),m&&m(s,{sizes:s,source:"keyboard",originalEvent:i.nativeEvent}),y&&y(s,{sizes:s,source:"keyboard",originalEvent:i.nativeEvent}),"home"===p)n(`Pane ${e+1} minimized to ${r(s[e]??0)}`);else if("end"===p)n(`Pane ${e+1} maximized to ${r(s[e]??0)}`);else{const t=o>0?e:e+1;n(`Pane ${t+1} resized to ${r(s[t]??0)}`)}},[a,u,c,l,d,h,m,y])}}; //# sourceMappingURL=keyboard.cjs.map