UNPKG

@stlite/browser

Version:
2 lines (1 loc) 3.73 kB
import{r,b as J}from"./index-B3URMCDH.js";import{s as Q,i as P,a as U,b as Z,T as _,C as ee,m as te}from"./index-DS8mNSuh.js";const re=()=>t=>t.targetX,ie=()=>t=>t.targetY,ne=()=>t=>t.targetWidth,ae=()=>t=>t.targetHeight,oe=()=>t=>t.targetY+10,se=()=>t=>Math.max(0,(t.targetHeight-28)/2),de=Q("div")({name:"DataGridOverlayEditorStyle",class:"gdg-d19meir1",propsAsIs:!1,vars:{"d19meir1-0":[ie(),"px"],"d19meir1-1":[re(),"px"],"d19meir1-2":[ne(),"px"],"d19meir1-3":[ae(),"px"],"d19meir1-4":[oe(),"px"],"d19meir1-5":[se(),"px"]}});function le(){const[t,a]=r.useState();return[t??void 0,a]}function ce(){const[t,a]=le(),[n,f]=r.useState(0),[v,b]=r.useState(!0);r.useLayoutEffect(()=>{if(t===void 0||!("IntersectionObserver"in window))return;const o=new IntersectionObserver(s=>{s.length!==0&&b(s[0].isIntersecting)},{threshold:1});return o.observe(t),()=>o.disconnect()},[t]),r.useEffect(()=>{if(v||t===void 0)return;let o;const s=()=>{const{right:k}=t.getBoundingClientRect();f(m=>Math.min(m+window.innerWidth-k-10,0)),o=requestAnimationFrame(s)};return o=requestAnimationFrame(s),()=>{o!==void 0&&cancelAnimationFrame(o)}},[t,v]);const C=r.useMemo(()=>({transform:`translateX(${n}px)`}),[n]);return{ref:a,style:C}}const ue=t=>{const{target:a,content:n,onFinishEditing:f,forceEditMode:v,initialValue:b,imageEditorOverride:C,markdownDivCreateNode:o,highlight:s,className:k,theme:m,id:V,cell:w,bloom:p,validateCell:c,getCellRenderer:M,provideEditor:x,isOutsideClick:W,customEventTarget:X}=t,[d,Y]=r.useState(v?n:void 0),O=r.useRef(d??n);O.current=d??n;const[h,N]=r.useState(()=>c===void 0?!0:!(P(n)&&(c==null?void 0:c(w,n,O.current))===!1)),u=r.useCallback((e,i)=>{f(h?e:void 0,i)},[h,f]),q=r.useCallback(e=>{if(c!==void 0&&e!==void 0&&P(e)){const i=c(w,e,O.current);i===!1?N(!1):(typeof i=="object"&&(e=i),N(!0))}Y(e)},[w,c]),y=r.useRef(!1),g=r.useRef(void 0),B=r.useCallback(()=>{u(d,[0,0]),y.current=!0},[d,u]),G=r.useCallback((e,i)=>{u(e,i??g.current??[0,0]),y.current=!0},[u]),j=r.useCallback(async e=>{let i=!1;e.key==="Escape"?(e.stopPropagation(),e.preventDefault(),g.current=[0,0]):e.key==="Enter"&&!e.shiftKey?(e.stopPropagation(),e.preventDefault(),g.current=[0,1],i=!0):e.key==="Tab"&&(e.stopPropagation(),e.preventDefault(),g.current=[e.shiftKey?-1:1,0],i=!0),window.setTimeout(()=>{!y.current&&g.current!==void 0&&(u(i?d:void 0,g.current),y.current=!0)},0)},[u,d]),D=d??n,[l,L]=r.useMemo(()=>{var e,i;if(U(n))return[];const K=x==null?void 0:x(n);return K!==void 0?[K,!1]:[(i=(e=M(n))==null?void 0:e.provideEditor)==null?void 0:i.call(e,n),!1]},[n,M,x]),{ref:$,style:z}=ce();let R=!0,F,I=!0,E;if(l!==void 0){R=l.disablePadding!==!0,I=l.disableStyling!==!0;const e=Z(l);e&&(E=l.styleOverride);const i=e?l.editor:l;F=r.createElement(i,{isHighlighted:s,onChange:q,value:D,initialValue:b,onFinishedEditing:G,validatedSelection:P(D)?D.selectionRange:void 0,forceEditMode:v,target:a,imageEditorOverride:C,markdownDivCreateNode:o,isValid:h,theme:m})}E={...E,...z};const T=document.getElementById("portal");if(T===null)return console.error('Cannot open Data Grid overlay editor, because portal not found. Please add `<div id="portal" />` as the last child of your `<body>`.'),null;let S=I?"gdg-style":"gdg-unstyle";h||(S+=" gdg-invalid"),R&&(S+=" gdg-pad");const A=(p==null?void 0:p[0])??1,H=(p==null?void 0:p[1])??1;return J.createPortal(r.createElement(_.Provider,{value:m},r.createElement(ee,{style:te(m),className:k,onClickOutside:B,isOutsideClick:W,customEventTarget:X},r.createElement(de,{ref:$,id:V,className:S,style:E,as:L===!0?"label":void 0,targetX:a.x-A,targetY:a.y-H,targetWidth:a.width+A*2,targetHeight:a.height+H*2},r.createElement("div",{className:"gdg-clip-region",onKeyDown:j},F)))),T)};export{ue as default};