@bitux/review-layer-react 0.1.3 → 0.1.4

package/dist/review-layer-react.umd.cjs

@@ -27,7 +27,7 @@ Check the top-level render call using <`+u+">.")}return n}}function le(r,n){{if(
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`,zr,Q,zt,Q),se[Q+zr]=!0}}return r===i?Tt(O):Vt(O),O}}function Dt(r,n,u){return ce(r,n,u,!0)}function It(r,n,u){return ce(r,n,u,!1)}var Ot=It,Lt=Dt;er.Fragment=i,er.jsx=Ot,er.jsxs=Lt}()),er}process.env.NODE_ENV==="production"?Er.exports=de():Er.exports=fe();var s=Er.exports;function ve(e){if(e.id&&/^[a-zA-Z][\w-]*$/.test(e.id))return`#${e.id}`;const o=[];let t=e;for(;t&&t.nodeType===Node.ELEMENT_NODE;){let i=t.nodeName.toLowerCase();if(t.id&&/^[a-zA-Z][\w-]*$/.test(t.id)){o.unshift(`#${t.id}`);break}if(t.className&&typeof t.className=="string"){const l=t.className.trim().split(/\s+/).filter(Boolean);if(l.length>0){const c=l.filter(p=>/^[a-zA-Z][\w-]*$/.test(p)).slice(0,2).map(p=>`.${p}`).join("");c&&(i+=c)}}if(o.length>0){const l=t.parentElement;if(l){const c=Array.from(l.children).filter(p=>p.nodeName===t.nodeName);if(c.length>1){const p=c.indexOf(t)+1;i+=`:nth-child(${p})`}}}o.unshift(i),t=t.parentElement}return o.join(" > ")}const pe="[data-review-layer-root]",ge=16;function Rr(e,o,t=ge){if(typeof window>"u")return{x:e,y:o};const i=t,l=t,c=window.innerWidth-t,p=window.innerHeight-t;return{x:Math.max(i,Math.min(c,e)),y:Math.max(l,Math.min(p,o))}}function Mr(e){var o;if(typeof document>"u"||!(e!=null&&e.trim()))return null;try{const t=document.querySelector(e);return!t||(o=t.closest)!=null&&o.call(t,pe)?null:t.getBoundingClientRect()}catch{return null}}function be(e){if(typeof window>"u")return{relativeX:0,relativeY:0};const o=window.innerWidth,t=window.innerHeight;return{relativeX:o>0?e.left/o:0,relativeY:t>0?e.top/t:0}}function Sr(e){if(typeof window>"u")return{x:e.x??0,y:e.y??0};const o=e.relativeX??e.relative_x??null,t=e.relativeY??e.relative_y??null;return o!=null&&t!=null?{x:o*window.innerWidth,y:t*window.innerHeight}:{x:e.x??0,y:e.y??0}}function he(e){const{x:o,y:t}=Sr(e),i=e.width??100,l=e.height??40;return new DOMRect(o,t,i,l)}function cr(e){const o=(e.relativeX??e.relative_x)!=null&&(e.relativeY??e.relative_y)!=null,t=e.x!=null&&e.y!=null;if(o||t)return Sr(e);if(e.selector){const i=Mr(e.selector);if(i!=null)return{x:i.left,y:i.top}}return Sr(e)}const k={PENDING:"pending",DEV_FIXED:"dev_fixed",VALIDATED:"validated"};function tr(e){return{"Content-Type":"application/json","x-review-key":e}}async function xe(e,o,t){const i=await fetch(`${e}/reviewers`,{headers:tr(o),signal:t==null?void 0:t.signal});if(!i.ok)throw new Error("Failed to fetch reviewers");return(await i.json()).data??[]}async function ye(e,o,t){const i=await fetch(`${e}/comments`,{method:"POST",headers:tr(o),body:JSON.stringify(t)});if(!i.ok){const c=await i.json().catch(()=>({}));throw new Error(c.message||"Failed to create comment")}return(await i.json()).data}async function me(e,o,t,i){const l=new URLSearchParams({url:t}),c=await fetch(`${e}/comments?${l}`,{headers:tr(o),signal:i==null?void 0:i.signal});if(!c.ok)throw new Error("Failed to fetch comments");return(await c.json()).data??[]}async function we(e,o,t,i){const l=await fetch(`${e}/comments/${t}/status`,{method:"PATCH",headers:tr(o),body:JSON.stringify({status:i})});if(!l.ok){const p=await l.json().catch(()=>({}));throw new Error(p.message||"Failed to update comment status")}return(await l.json()).data}async function _e(e,o,t){const i=await fetch(`${e}/comments/${t}`,{method:"DELETE",headers:tr(o)});if(!i.ok){const l=await i.json().catch(()=>({}));throw new Error(l.message||"Failed to delete comment")}}const Ee={position:"fixed",inset:0,zIndex:999997,backgroundColor:"transparent"},Re={position:"fixed",minWidth:320,maxWidth:400,padding:"var(--ui-positive-Value_400, 16px)",backgroundColor:"var(--ui-color-bg-surface-default, #fff)",border:"1px solid var(--ui-color-border-subtle, #e8e8e8)",borderRadius:"var(--ui-radius_8, 8px)",boxShadow:"0 8px 24px var(--ui-color-black-alpha-20, rgba(0,0,0,0.15))",zIndex:999998},Se={width:"100%",minHeight:80,padding:"var(--ui-positive-Value_200, 8px) var(--ui-positive-Value_300, 12px)",marginBottom:"var(--ui-positive-Value_200, 12px)",border:"1px solid var(--ui-color-border-default, #d9d9d9)",borderRadius:"var(--ui-radius_6, 6px)",fontSize:"var(--ui-font-size-sm, 14px)",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",resize:"vertical",boxSizing:"border-box"},Ce={width:"100%",padding:"var(--ui-positive-Value_200, 8px) var(--ui-positive-Value_300, 12px)",marginBottom:"var(--ui-positive-Value_300, 12px)",border:"1px solid var(--ui-color-border-default, #d9d9d9)",borderRadius:"var(--ui-radius_6, 6px)",fontSize:"var(--ui-font-size-sm, 14px)"},ke={padding:"var(--ui-positive-Value_200, 8px) var(--ui-positive-Value_400, 16px)",backgroundColor:"var(--ui-color-bg-fill-danger-default, #ff4d4f)",color:"var(--ui-color-text-on-color, #fff)",border:"none",borderRadius:"var(--ui-radius_6, 6px)",fontSize:"var(--ui-font-size-sm, 14px)",cursor:"pointer",fontWeight:"var(--ui-font-weight-medium, 500)"};function Pe({apiUrl:e,apiKey:o,reviewers:t,position:i,payload:l,onClose:c,onSuccess:p}){var L;const[b,f]=a.useState(""),[_,y]=a.useState(((L=t[0])==null?void 0:L.id)??0),[m,j]=a.useState(!1),[C,V]=a.useState(null);a.useEffect(()=>{t.length>0&&!_&&y(t[0].id)},[t,_]);const F=a.useCallback(async d=>{if(d.preventDefault(),!(!b.trim()||!_)){j(!0),V(null);try{await ye(e,o,{...l,message:b.trim(),reviewerId:_}),p(),c()}catch(g){V(g instanceof Error?g.message:"Failed to send comment")}finally{j(!1)}}},[e,o,l,b,_,p,c]);return s.jsxs(s.Fragment,{children:[s.jsx("div",{role:"presentation",style:Ee,onClick:c,onKeyDown:d=>d.key==="Escape"&&c()}),s.jsx("div",{style:{...Re,left:Math.min(i.x,typeof window<"u"?window.innerWidth-420:i.x),top:i.y+12},onClick:d=>d.stopPropagation(),children:s.jsxs("form",{onSubmit:F,children:[s.jsx("textarea",{placeholder:"Escribe tu comentario...",value:b,onChange:d=>f(d.target.value),style:Se,required:!0,autoFocus:!0}),s.jsxs("select",{value:_,onChange:d=>y(Number(d.target.value)),style:Ce,required:!0,disabled:t.length===0,children:[s.jsx("option",{value:"",children:t.length===0?"No hay revisores (ejecuta php artisan db:seed en la API)":"Selecciona revisor"}),t.map(d=>s.jsx("option",{value:d.id,children:d.name},d.id))]}),C&&s.jsx("div",{style:{color:"var(--ui-color-text-danger-default, #ff4d4f)",fontSize:"var(--ui-font-size-xs, 12px)",marginBottom:"var(--ui-positive-Value_200, 8px)"},children:C}),s.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:s.jsx("button",{type:"submit",style:ke,disabled:m||t.length===0,children:m?"Enviando...":"Enviar comentario"})})]})})]})}const je=a.memo(Pe),Ve="var(--ui-color-red-500, #ef4444)";function Te(e){return{position:"fixed",outline:`2px solid ${e}`,outlineOffset:"var(--ui-positive-Value_200, 2px)",pointerEvents:"none",zIndex:999997,boxSizing:"border-box"}}const De=a.memo(function({selector:o,active:t,fallbackComment:i,outlineColor:l=Ve}){const[c,p]=a.useState(null),b=a.useCallback(()=>{if(!t){p(null);return}const f=o!=null&&o.trim()?Mr(o):null;if(f){p(f);return}if(i){p(he(i));return}p(null)},[o,t,i]);return a.useEffect(()=>{b()},[b]),a.useEffect(()=>{if(t)return window.addEventListener("scroll",b,!0),window.addEventListener("resize",b),()=>{window.removeEventListener("scroll",b,!0),window.removeEventListener("resize",b)}},[t,b]),!t||c==null?null:s.jsx("div",{"aria-hidden":!0,style:{...Te(l),left:c.left,top:c.top,width:c.width,height:c.height}})}),dr=32,Wr=15e5,Cr=250,M={cardBg:"var(--ui-color-bg-surface-default, #ffffff)",cardFooterBg:"var(--ui-color-bg-surface-secondary-default, #f8fafc)",textDark:"var(--ui-color-text-primary, #333333)",textMuted:"var(--ui-color-text-secondary, #888888)",border:"var(--ui-color-border-default, #cccccc)",shadow:"var(--ui-shadow-card, 0 4px 16px rgba(0, 0, 0, 0.12))"},Ie={[k.PENDING]:"Pendiente",[k.DEV_FIXED]:"Corregido",[k.VALIDATED]:"Validado"},Oe={[k.PENDING]:"PENDIENTE",[k.DEV_FIXED]:"CORREGIDO",[k.VALIDATED]:"VALIDADO"},K={[k.PENDING]:"var(--ui-color-red-500, rgb(240, 69, 69))",[k.DEV_FIXED]:"var(--ui-color-yellow-500, rgb(235, 179, 8))",[k.VALIDATED]:"var(--ui-color-green-500, rgb(33, 196, 94))"},Br={[k.PENDING]:"var(--ui-color-bg-surface-danger-default, #fef2f2)",[k.DEV_FIXED]:"var(--ui-color-bg-surface-warning-default, #fffbeb)",[k.VALIDATED]:"var(--ui-color-bg-surface-success-default, #f0fdf4)"},fr={[k.PENDING]:"var(--ui-color-red-500, #ef4444)",[k.DEV_FIXED]:"var(--ui-color-orange-500, #f59e0b)",[k.VALIDATED]:"var(--ui-color-green-500, #22c55e)"};function Le(e){const o=e.trim().split(/\s+/);return o.length>=2?(o[0][0]+o[o.length-1][0]).toUpperCase():e.slice(0,2).toUpperCase()||"?"}const ze=()=>s.jsx("svg",{width:"12",height:"12",viewBox:"0 0 12 12",fill:"none",style:{marginRight:4,flexShrink:0},children:s.jsx("path",{d:"M10 3L4.5 8.5L2 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),Ae=({color:e})=>s.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",style:{flexShrink:0},children:[s.jsx("path",{d:"M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z",stroke:e,strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",fill:"none"}),s.jsx("path",{d:"M8 10h.01M12 10h.01M16 10h.01",stroke:"var(--ui-color-white, #fff)",strokeWidth:"1.5",strokeLinecap:"round"})]}),Fe=e=>({position:"fixed",width:dr,height:dr,borderRadius:"50%",backgroundColor:K[e]??K[k.PENDING],color:"var(--ui-color-text-on-color, #fff)",display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",boxShadow:"0 2px 8px var(--ui-color-black-alpha-20, rgba(0,0,0,0.2))",zIndex:999998,border:"2px solid var(--ui-color-white, #fff)"}),Ne={position:"fixed",width:Cr,minWidth:Cr,maxWidth:Cr,boxSizing:"border-box",backgroundColor:M.cardBg,borderRadius:"var(--ui-radius_12, 12px)",boxShadow:M.shadow,fontSize:"var(--ui-font-size-sm, 14px)",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",zIndex:999999,pointerEvents:"auto"},Me={display:"flex",alignItems:"center",justifyContent:"space-between",gap:"var(--ui-positive-Value_250, 10px)",borderBottom:`1px solid ${M.border}`,padding:"var(--ui-positive-Value_300, 12px)"},We=e=>({width:40,height:40,borderRadius:"50%",backgroundColor:K[e]??K[k.PENDING],color:"var(--ui-color-text-on-color, #fff)",border:"2px solid var(--ui-color-white, #fff)",display:"flex",alignItems:"center",justifyContent:"center",fontSize:"var(--ui-font-size-sm, 14px)",fontWeight:"var(--ui-font-weight-bold, 700)",flexShrink:0,overflow:"hidden"}),Be=a.memo(function({reviewer:o,status:t}){const i=o==null?void 0:o.image_url,l=(o==null?void 0:o.name)??"Revisor",c=We(t);if(i&&i.trim()){const p=K[t]??K[k.PENDING];return s.jsx("div",{style:{...c,border:`2px solid ${p}`},children:s.jsx("img",{src:i,alt:l,style:{width:"100%",height:"100%",objectFit:"cover"},loading:"lazy"})})}return s.jsx("div",{style:c,children:Le(l)})}),Ye={flexShrink:0,width:"var(--ui-positive-Value_600, 24px)",height:"var(--ui-positive-Value_600, 24px)",padding:0,border:"none",borderRadius:"var(--ui-radius_6, 6px)",backgroundColor:"transparent",color:M.textDark,cursor:"pointer",fontSize:"var(--ui-positive-Value_450, 18px)",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center"},Ue=e=>{const o=fr[e]??fr[k.PENDING];return{display:"inline-flex",alignItems:"center",padding:"var(--ui-positive-Value_50, 4px) var(--ui-positive-Value_100, 10px)",borderRadius:"var(--ui-radius_full, 9999px)",fontSize:"8px",fontWeight:"var(--ui-font-weight-bold, 700)",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",textTransform:"uppercase",letterSpacing:"0.02em",backgroundColor:Br[e]??Br[k.PENDING],color:o,border:`1px solid ${o}`}},Ge={display:"block",fontSize:"var(--ui-font-size-2xs, 10px)",fontWeight:"var(--ui-font-weight-semibold, 600)",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",color:M.textMuted,textTransform:"uppercase",letterSpacing:"0.04em"},He={width:"100%",padding:"var(--ui-positive-Value_200, 8px) var(--ui-positive-Value_300, 12px)",paddingRight:"var(--ui-positive-Value_800, 32px)",fontSize:"var(--ui-font-size-xs, 13px)",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",borderRadius:"var(--ui-radius_8, 8px)",border:`1px solid ${M.border}`,backgroundColor:M.cardBg,color:M.textDark,cursor:"pointer",appearance:"none",backgroundImage:`url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 8L2 4h8z'/%3E%3C/svg%3E")`,backgroundRepeat:"no-repeat",backgroundPosition:"right var(--ui-positive-Value_250, 10px) center"},Xe={display:"flex",alignItems:"center",justifyContent:"flex-end",gap:"var(--ui-positive-Value_200, 8px)",padding:"var(--ui-positive-Value_300, 12px)",borderTop:`1px solid ${M.border}`,backgroundColor:M.cardFooterBg},Yr={minWidth:100,padding:"var(--ui-positive-Value_200, 8px) var(--ui-positive-Value_350, 14px)",fontSize:"var(--ui-font-size-xs, 13px)",fontWeight:"var(--ui-font-weight-semibold, 600)",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",borderRadius:"var(--ui-radius_8, 8px)",cursor:"pointer",border:"none"},Je={...Yr,backgroundColor:"transparent",color:M.textDark},vr="review-layer-resolve-btn",Ze=["pending","dev_fixed","validated"],Qe={...Yr,backgroundColor:"var(--ui-color-bg-fill-success-default, #22c55e)",color:"var(--ui-color-text-on-color, #fff)"};function Ke({comment:e,offset:o={dx:0,dy:0},apiUrl:t,apiKey:i,onStatusChange:l,reviewMode:c=!1}){var ar,lr;const[p,b]=a.useState(!1),[f,_]=a.useState(!1),[y,m]=a.useState(()=>cr(e)),[j,C]=a.useState(!1),[V,F]=a.useState(null),L=a.useRef(null),d=a.useRef(null),g=a.useRef(null),I=a.useCallback(()=>{m(cr(e))},[e]);a.useEffect(()=>{I()},[I]),a.useEffect(()=>{if(!(typeof window>"u"))return window.addEventListener("scroll",I,!0),window.addEventListener("resize",I),()=>{window.removeEventListener("scroll",I,!0),window.removeEventListener("resize",I)}},[I]);const A=a.useCallback(()=>{L.current!==null&&(clearTimeout(L.current),L.current=null)},[]),H=a.useCallback(()=>{c||(A(),b(!0))},[c,A]),or=a.useCallback(()=>{f||(L.current=setTimeout(()=>{L.current=null,b(!1)},Wr))},[f]),nr=a.useCallback(()=>{A(),b(!0)},[A]),ir=a.useCallback(()=>{f||(L.current=setTimeout(()=>{L.current=null,b(!1)},Wr))},[f]),X=a.useCallback(()=>{if(c){f&&(_(!1),b(!1));return}f?(_(!1),b(!1)):(_(!0),b(!0))},[c,f]);a.useEffect(()=>{if(!f)return;const E=Z=>{var hr,xr;const ur=Z.target;(hr=d.current)!=null&&hr.contains(ur)||(xr=g.current)!=null&&xr.contains(ur)||(_(!1),b(!1))};return document.addEventListener("mousedown",E,!0),()=>document.removeEventListener("mousedown",E,!0)},[f]),a.useEffect(()=>()=>A(),[A]),a.useEffect(()=>{c&&(_(!1),b(!1))},[c]);const w=y.x+o.dx,P=y.y+o.dy,{x:z,y:T}=Rr(w,P,dr/2),U=p&&!f,B=a.useCallback(()=>{_(!1),b(!1)},[]),J=a.useCallback(async E=>{if(E!==e.status){F(null),C(!0);try{await we(t,i,e.id,E),l()}catch(Z){F(Z instanceof Error?Z.message:"Error al actualizar")}finally{C(!1)}}},[t,i,e.id,e.status,l]),gr=a.useCallback(async()=>{F(null),C(!0);try{await _e(t,i,e.id),l(),B()}catch(E){F(E instanceof Error?E.message:"Error al eliminar")}finally{C(!1)}},[t,i,e.id,l,B]),br=a.useMemo(()=>({...Fe(e.status),left:z,top:T,transform:"translate(-50%, -50%)"}),[e.status,z,T]);return s.jsxs(s.Fragment,{children:[s.jsx(De,{selector:e.selector,active:U,fallbackComment:e,outlineColor:fr[e.status]??fr[k.PENDING]}),s.jsx("div",{ref:d,role:"button",tabIndex:0,"aria-label":`Comentario: ${e.message.slice(0,30)}...`,"aria-expanded":p,style:br,onMouseEnter:H,onMouseLeave:or,onClick:X,children:s.jsx(Ae,{color:"var(--ui-color-white, #fff)"})}),p&&s.jsxs("div",{ref:g,role:"dialog","aria-label":"Detalle del comentario",style:{...Ne,left:z+dr/2+6,top:T},onMouseEnter:nr,onMouseLeave:ir,children:[s.jsxs("div",{style:Me,children:[s.jsxs("div",{style:{display:"flex",alignItems:"center",gap:10,flex:1,minWidth:0},children:[s.jsx(Be,{reviewer:e.reviewer,status:e.status}),s.jsxs("div",{children:[s.jsx("div",{style:{fontWeight:700,fontSize:14,color:M.textDark},children:((ar=e.reviewer)==null?void 0:ar.name)??"Revisor"}),s.jsx("div",{style:{fontSize:12,color:M.textMuted},children:((lr=e.reviewer)==null?void 0:lr.job_title)??"Revisor"})]})]}),s.jsx("button",{type:"button","aria-label":e.status===k.VALIDATED?"Eliminar comentario":"Cerrar",style:Ye,disabled:j,onClick:E=>{E.stopPropagation(),e.status===k.VALIDATED?gr():B()},onMouseDown:E=>E.stopPropagation(),children:"✕"})]}),s.jsxs("div",{style:{padding:12,display:"flex",alignItems:"flex-start",flexDirection:"column",gap:4},children:[s.jsxs("div",{style:Ue(e.status),children:[e.status===k.VALIDATED&&s.jsx(ze,{}),Oe[e.status]??e.status]}),s.jsx("div",{style:{color:M.textDark,lineHeight:1.5,marginBottom:12,marginTop:12},children:e.message}),s.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:4,width:"100%"},children:[s.jsx("label",{style:Ge,htmlFor:`comment-status-${e.id}`,children:"Cambiar estado"}),s.jsx("select",{id:`comment-status-${e.id}`,style:He,value:e.status,disabled:j,onChange:E=>J(E.target.value),onMouseDown:E=>E.stopPropagation(),"aria-label":"Cambiar estado del comentario",children:Ze.map(E=>s.jsx("option",{value:E,children:Ie[E]},E))}),V&&s.jsx("div",{style:{marginTop:8,fontSize:11,color:"var(--ui-color-text-danger-default, rgb(240, 69, 69))"},children:V})]})]}),s.jsxs("div",{style:Xe,children:[s.jsx("button",{type:"button",style:Je,onMouseDown:E=>E.stopPropagation(),onClick:E=>{E.stopPropagation(),B()},children:"Cerrar"}),e.status!==k.VALIDATED&&s.jsxs(s.Fragment,{children:[s.jsx("style",{children:`
+  <%s key={someKey} {...props} />`,zr,Q,zt,Q),se[Q+zr]=!0}}return r===i?Tt(O):Vt(O),O}}function Dt(r,n,u){return ce(r,n,u,!0)}function It(r,n,u){return ce(r,n,u,!1)}var Ot=It,Lt=Dt;er.Fragment=i,er.jsx=Ot,er.jsxs=Lt}()),er}process.env.NODE_ENV==="production"?Er.exports=de():Er.exports=fe();var s=Er.exports;function ve(e){if(e.id&&/^[a-zA-Z][\w-]*$/.test(e.id))return`#${e.id}`;const o=[];let t=e;for(;t&&t.nodeType===Node.ELEMENT_NODE;){let i=t.nodeName.toLowerCase();if(t.id&&/^[a-zA-Z][\w-]*$/.test(t.id)){o.unshift(`#${t.id}`);break}if(t.className&&typeof t.className=="string"){const l=t.className.trim().split(/\s+/).filter(Boolean);if(l.length>0){const c=l.filter(p=>/^[a-zA-Z][\w-]*$/.test(p)).slice(0,2).map(p=>`.${p}`).join("");c&&(i+=c)}}if(o.length>0){const l=t.parentElement;if(l){const c=Array.from(l.children).filter(p=>p.nodeName===t.nodeName);if(c.length>1){const p=c.indexOf(t)+1;i+=`:nth-child(${p})`}}}o.unshift(i),t=t.parentElement}return o.join(" > ")}const pe="[data-review-layer-root]",ge=16;function Rr(e,o,t=ge){if(typeof window>"u")return{x:e,y:o};const i=t,l=t,c=window.innerWidth-t,p=window.innerHeight-t;return{x:Math.max(i,Math.min(c,e)),y:Math.max(l,Math.min(p,o))}}function Mr(e){var o;if(typeof document>"u"||!(e!=null&&e.trim()))return null;try{const t=document.querySelector(e);return!t||(o=t.closest)!=null&&o.call(t,pe)?null:t.getBoundingClientRect()}catch{return null}}function be(e){if(typeof window>"u")return{relativeX:0,relativeY:0};const o=window.innerWidth,t=window.innerHeight;return{relativeX:o>0?e.left/o:0,relativeY:t>0?e.top/t:0}}function Sr(e){if(typeof window>"u")return{x:e.x??0,y:e.y??0};const o=e.relativeX??e.relative_x??null,t=e.relativeY??e.relative_y??null;return o!=null&&t!=null?{x:o*window.innerWidth,y:t*window.innerHeight}:{x:e.x??0,y:e.y??0}}function he(e){const{x:o,y:t}=Sr(e),i=e.width??100,l=e.height??40;return new DOMRect(o,t,i,l)}function cr(e){const o=(e.relativeX??e.relative_x)!=null&&(e.relativeY??e.relative_y)!=null,t=e.x!=null&&e.y!=null;if(o||t)return Sr(e);if(e.selector){const i=Mr(e.selector);if(i!=null)return{x:i.left,y:i.top}}return Sr(e)}const k={PENDING:"pending",DEV_FIXED:"dev_fixed",VALIDATED:"validated"};function tr(e){return{"Content-Type":"application/json","x-review-key":e}}async function xe(e,o,t){const i=await fetch(`${e}/reviewers`,{headers:tr(o),signal:t==null?void 0:t.signal});if(!i.ok)throw new Error("Failed to fetch reviewers");return(await i.json()).data??[]}async function ye(e,o,t){const i=await fetch(`${e}/comments`,{method:"POST",headers:tr(o),body:JSON.stringify(t)});if(!i.ok){const c=await i.json().catch(()=>({}));throw new Error(c.message||"Failed to create comment")}return(await i.json()).data}async function me(e,o,t,i){const l=new URLSearchParams({url:t}),c=await fetch(`${e}/comments?${l}`,{headers:tr(o),signal:i==null?void 0:i.signal});if(!c.ok)throw new Error("Failed to fetch comments");return(await c.json()).data??[]}async function we(e,o,t,i){const l=await fetch(`${e}/comments/${t}/status`,{method:"PATCH",headers:tr(o),body:JSON.stringify({status:i})});if(!l.ok){const p=await l.json().catch(()=>({}));throw new Error(p.message||"Failed to update comment status")}return(await l.json()).data}async function _e(e,o,t){const i=await fetch(`${e}/comments/${t}`,{method:"DELETE",headers:tr(o)});if(!i.ok){const l=await i.json().catch(()=>({}));throw new Error(l.message||"Failed to delete comment")}}const Ee={position:"fixed",inset:0,zIndex:999997,backgroundColor:"transparent"},Re={position:"fixed",minWidth:320,maxWidth:400,padding:"var(--ui-positive-Value_400, 16px)",backgroundColor:"var(--ui-color-bg-surface-default, #fff)",border:"1px solid var(--ui-color-border-subtle, #e8e8e8)",borderRadius:"var(--ui-radius_8, 8px)",boxShadow:"0 8px 24px var(--ui-color-black-alpha-20, rgba(0,0,0,0.15))",zIndex:999998},Se={width:"100%",minHeight:80,padding:"var(--ui-positive-Value_200, 8px) var(--ui-positive-Value_300, 12px)",marginBottom:"var(--ui-positive-Value_200, 12px)",border:"1px solid var(--ui-color-border-default, #d9d9d9)",borderRadius:"var(--ui-radius_6, 6px)",fontSize:"var(--ui-font-size-sm, 14px)",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",resize:"vertical",boxSizing:"border-box"},Ce={width:"100%",padding:"var(--ui-positive-Value_200, 8px) var(--ui-positive-Value_300, 12px)",marginBottom:"var(--ui-positive-Value_300, 12px)",border:"1px solid var(--ui-color-border-default, #d9d9d9)",borderRadius:"var(--ui-radius_6, 6px)",fontSize:"var(--ui-font-size-sm, 14px)"},ke={padding:"var(--ui-positive-Value_200, 8px) var(--ui-positive-Value_400, 16px)",backgroundColor:"var(--ui-color-bg-fill-danger-default, #ff4d4f)",color:"var(--ui-color-text-on-color, #fff)",border:"none",borderRadius:"var(--ui-radius_6, 6px)",fontSize:"var(--ui-font-size-sm, 14px)",cursor:"pointer",fontWeight:"var(--ui-font-weight-medium, 500)"};function Pe({apiUrl:e,apiKey:o,reviewers:t,position:i,payload:l,onClose:c,onSuccess:p}){var L;const[b,f]=a.useState(""),[_,y]=a.useState(((L=t[0])==null?void 0:L.id)??0),[m,j]=a.useState(!1),[C,V]=a.useState(null);a.useEffect(()=>{t.length>0&&!_&&y(t[0].id)},[t,_]);const F=a.useCallback(async d=>{if(d.preventDefault(),!(!b.trim()||!_)){j(!0),V(null);try{await ye(e,o,{...l,message:b.trim(),reviewerId:_}),p(),c()}catch(g){V(g instanceof Error?g.message:"Failed to send comment")}finally{j(!1)}}},[e,o,l,b,_,p,c]);return s.jsxs(s.Fragment,{children:[s.jsx("div",{role:"presentation",style:Ee,onClick:c,onKeyDown:d=>d.key==="Escape"&&c()}),s.jsx("div",{style:{...Re,left:Math.min(i.x,typeof window<"u"?window.innerWidth-420:i.x),top:i.y+12},onClick:d=>d.stopPropagation(),children:s.jsxs("form",{onSubmit:F,children:[s.jsx("textarea",{placeholder:"Escribe tu comentario...",value:b,onChange:d=>f(d.target.value),style:Se,required:!0,autoFocus:!0}),s.jsxs("select",{value:_,onChange:d=>y(Number(d.target.value)),style:Ce,required:!0,disabled:t.length===0,children:[s.jsx("option",{value:"",children:t.length===0?"No hay revisores (ejecuta php artisan db:seed en la API)":"Selecciona revisor"}),t.map(d=>s.jsx("option",{value:d.id,children:d.name},d.id))]}),C&&s.jsx("div",{style:{color:"var(--ui-color-text-danger-default, #ff4d4f)",fontSize:"var(--ui-font-size-xs, 12px)",marginBottom:"var(--ui-positive-Value_200, 8px)"},children:C}),s.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:s.jsx("button",{type:"submit",style:ke,disabled:m||t.length===0,children:m?"Enviando...":"Enviar comentario"})})]})})]})}const je=a.memo(Pe),Ve="var(--ui-color-red-500, #ef4444)";function Te(e){return{position:"fixed",outline:`2px solid ${e}`,outlineOffset:"var(--ui-positive-Value_200, 2px)",pointerEvents:"none",zIndex:999997,boxSizing:"border-box"}}const De=a.memo(function({selector:o,active:t,fallbackComment:i,outlineColor:l=Ve}){const[c,p]=a.useState(null),b=a.useCallback(()=>{if(!t){p(null);return}const f=o!=null&&o.trim()?Mr(o):null;if(f){p(f);return}if(i){p(he(i));return}p(null)},[o,t,i]);return a.useEffect(()=>{b()},[b]),a.useEffect(()=>{if(t)return window.addEventListener("scroll",b,!0),window.addEventListener("resize",b),()=>{window.removeEventListener("scroll",b,!0),window.removeEventListener("resize",b)}},[t,b]),!t||c==null?null:s.jsx("div",{"aria-hidden":!0,style:{...Te(l),left:c.left,top:c.top,width:c.width,height:c.height}})}),dr=32,Wr=150,Cr=250,M={cardBg:"var(--ui-color-bg-surface-default, #ffffff)",cardFooterBg:"var(--ui-color-bg-surface-secondary-default, #f8fafc)",textDark:"var(--ui-color-text-primary, #333333)",textMuted:"var(--ui-color-text-secondary, #888888)",border:"var(--ui-color-border-default, #cccccc)",shadow:"var(--ui-shadow-card, 0 4px 16px rgba(0, 0, 0, 0.12))"},Ie={[k.PENDING]:"Pendiente",[k.DEV_FIXED]:"Corregido",[k.VALIDATED]:"Validado"},Oe={[k.PENDING]:"PENDIENTE",[k.DEV_FIXED]:"CORREGIDO",[k.VALIDATED]:"VALIDADO"},K={[k.PENDING]:"var(--ui-color-red-500, rgb(240, 69, 69))",[k.DEV_FIXED]:"var(--ui-color-yellow-500, rgb(235, 179, 8))",[k.VALIDATED]:"var(--ui-color-green-500, rgb(33, 196, 94))"},Br={[k.PENDING]:"var(--ui-color-bg-surface-danger-default, #fef2f2)",[k.DEV_FIXED]:"var(--ui-color-bg-surface-warning-default, #fffbeb)",[k.VALIDATED]:"var(--ui-color-bg-surface-success-default, #f0fdf4)"},fr={[k.PENDING]:"var(--ui-color-red-500, #ef4444)",[k.DEV_FIXED]:"var(--ui-color-orange-500, #f59e0b)",[k.VALIDATED]:"var(--ui-color-green-500, #22c55e)"};function Le(e){const o=e.trim().split(/\s+/);return o.length>=2?(o[0][0]+o[o.length-1][0]).toUpperCase():e.slice(0,2).toUpperCase()||"?"}const ze=()=>s.jsx("svg",{width:"12",height:"12",viewBox:"0 0 12 12",fill:"none",style:{marginRight:4,flexShrink:0},children:s.jsx("path",{d:"M10 3L4.5 8.5L2 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),Ae=({color:e})=>s.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",style:{flexShrink:0},children:[s.jsx("path",{d:"M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z",stroke:e,strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",fill:"none"}),s.jsx("path",{d:"M8 10h.01M12 10h.01M16 10h.01",stroke:"var(--ui-color-white, #fff)",strokeWidth:"1.5",strokeLinecap:"round"})]}),Fe=e=>({position:"fixed",width:dr,height:dr,borderRadius:"50%",backgroundColor:K[e]??K[k.PENDING],color:"var(--ui-color-text-on-color, #fff)",display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",boxShadow:"0 2px 8px var(--ui-color-black-alpha-20, rgba(0,0,0,0.2))",zIndex:999998,border:"2px solid var(--ui-color-white, #fff)"}),Ne={position:"fixed",width:Cr,minWidth:Cr,maxWidth:Cr,boxSizing:"border-box",backgroundColor:M.cardBg,borderRadius:"var(--ui-radius_12, 12px)",boxShadow:M.shadow,fontSize:"var(--ui-font-size-sm, 14px)",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",zIndex:999999,pointerEvents:"auto"},Me={display:"flex",alignItems:"center",justifyContent:"space-between",gap:"var(--ui-positive-Value_250, 10px)",borderBottom:`1px solid ${M.border}`,padding:"var(--ui-positive-Value_300, 12px)"},We=e=>({width:40,height:40,borderRadius:"50%",backgroundColor:K[e]??K[k.PENDING],color:"var(--ui-color-text-on-color, #fff)",border:"2px solid var(--ui-color-white, #fff)",display:"flex",alignItems:"center",justifyContent:"center",fontSize:"var(--ui-font-size-sm, 14px)",fontWeight:"var(--ui-font-weight-bold, 700)",flexShrink:0,overflow:"hidden"}),Be=a.memo(function({reviewer:o,status:t}){const i=o==null?void 0:o.image_url,l=(o==null?void 0:o.name)??"Revisor",c=We(t);if(i&&i.trim()){const p=K[t]??K[k.PENDING];return s.jsx("div",{style:{...c,border:`2px solid ${p}`},children:s.jsx("img",{src:i,alt:l,style:{width:"100%",height:"100%",objectFit:"cover"},loading:"lazy"})})}return s.jsx("div",{style:c,children:Le(l)})}),Ye={flexShrink:0,width:"var(--ui-positive-Value_600, 24px)",height:"var(--ui-positive-Value_600, 24px)",padding:0,border:"none",borderRadius:"var(--ui-radius_6, 6px)",backgroundColor:"transparent",color:M.textDark,cursor:"pointer",fontSize:"var(--ui-positive-Value_450, 18px)",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center"},Ue=e=>{const o=fr[e]??fr[k.PENDING];return{display:"inline-flex",alignItems:"center",padding:"var(--ui-positive-Value_50, 4px) var(--ui-positive-Value_100, 10px)",borderRadius:"var(--ui-radius_full, 9999px)",fontSize:"8px",fontWeight:"var(--ui-font-weight-bold, 700)",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",textTransform:"uppercase",letterSpacing:"0.02em",backgroundColor:Br[e]??Br[k.PENDING],color:o,border:`1px solid ${o}`}},Ge={display:"block",fontSize:"var(--ui-font-size-2xs, 10px)",fontWeight:"var(--ui-font-weight-semibold, 600)",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",color:M.textMuted,textTransform:"uppercase",letterSpacing:"0.04em"},He={width:"100%",padding:"var(--ui-positive-Value_200, 8px) var(--ui-positive-Value_300, 12px)",paddingRight:"var(--ui-positive-Value_800, 32px)",fontSize:"var(--ui-font-size-xs, 13px)",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",borderRadius:"var(--ui-radius_8, 8px)",border:`1px solid ${M.border}`,backgroundColor:M.cardBg,color:M.textDark,cursor:"pointer",appearance:"none",backgroundImage:`url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 8L2 4h8z'/%3E%3C/svg%3E")`,backgroundRepeat:"no-repeat",backgroundPosition:"right var(--ui-positive-Value_250, 10px) center"},Xe={display:"flex",alignItems:"center",justifyContent:"flex-end",gap:"var(--ui-positive-Value_200, 8px)",padding:"var(--ui-positive-Value_300, 12px)",borderTop:`1px solid ${M.border}`,backgroundColor:M.cardFooterBg},Yr={minWidth:100,padding:"var(--ui-positive-Value_200, 8px) var(--ui-positive-Value_350, 14px)",fontSize:"var(--ui-font-size-xs, 13px)",fontWeight:"var(--ui-font-weight-semibold, 600)",fontFamily:"var(--ui-font-family-ui, 'Inter', sans-serif)",borderRadius:"var(--ui-radius_8, 8px)",cursor:"pointer",border:"none"},Je={...Yr,backgroundColor:"transparent",color:M.textDark},vr="review-layer-resolve-btn",Ze=["pending","dev_fixed","validated"],Qe={...Yr,backgroundColor:"var(--ui-color-bg-fill-success-default, #22c55e)",color:"var(--ui-color-text-on-color, #fff)"};function Ke({comment:e,offset:o={dx:0,dy:0},apiUrl:t,apiKey:i,onStatusChange:l,reviewMode:c=!1}){var ar,lr;const[p,b]=a.useState(!1),[f,_]=a.useState(!1),[y,m]=a.useState(()=>cr(e)),[j,C]=a.useState(!1),[V,F]=a.useState(null),L=a.useRef(null),d=a.useRef(null),g=a.useRef(null),I=a.useCallback(()=>{m(cr(e))},[e]);a.useEffect(()=>{I()},[I]),a.useEffect(()=>{if(!(typeof window>"u"))return window.addEventListener("scroll",I,!0),window.addEventListener("resize",I),()=>{window.removeEventListener("scroll",I,!0),window.removeEventListener("resize",I)}},[I]);const A=a.useCallback(()=>{L.current!==null&&(clearTimeout(L.current),L.current=null)},[]),H=a.useCallback(()=>{c||(A(),b(!0))},[c,A]),or=a.useCallback(()=>{f||(L.current=setTimeout(()=>{L.current=null,b(!1)},Wr))},[f]),nr=a.useCallback(()=>{A(),b(!0)},[A]),ir=a.useCallback(()=>{f||(L.current=setTimeout(()=>{L.current=null,b(!1)},Wr))},[f]),X=a.useCallback(()=>{if(c){f&&(_(!1),b(!1));return}f?(_(!1),b(!1)):(_(!0),b(!0))},[c,f]);a.useEffect(()=>{if(!f)return;const E=Z=>{var hr,xr;const ur=Z.target;(hr=d.current)!=null&&hr.contains(ur)||(xr=g.current)!=null&&xr.contains(ur)||(_(!1),b(!1))};return document.addEventListener("mousedown",E,!0),()=>document.removeEventListener("mousedown",E,!0)},[f]),a.useEffect(()=>()=>A(),[A]),a.useEffect(()=>{c&&(_(!1),b(!1))},[c]);const w=y.x+o.dx,P=y.y+o.dy,{x:z,y:T}=Rr(w,P,dr/2),U=p&&!f,B=a.useCallback(()=>{_(!1),b(!1)},[]),J=a.useCallback(async E=>{if(E!==e.status){F(null),C(!0);try{await we(t,i,e.id,E),l()}catch(Z){F(Z instanceof Error?Z.message:"Error al actualizar")}finally{C(!1)}}},[t,i,e.id,e.status,l]),gr=a.useCallback(async()=>{F(null),C(!0);try{await _e(t,i,e.id),l(),B()}catch(E){F(E instanceof Error?E.message:"Error al eliminar")}finally{C(!1)}},[t,i,e.id,l,B]),br=a.useMemo(()=>({...Fe(e.status),left:z,top:T,transform:"translate(-50%, -50%)"}),[e.status,z,T]);return s.jsxs(s.Fragment,{children:[s.jsx(De,{selector:e.selector,active:U,fallbackComment:e,outlineColor:fr[e.status]??fr[k.PENDING]}),s.jsx("div",{ref:d,role:"button",tabIndex:0,"aria-label":`Comentario: ${e.message.slice(0,30)}...`,"aria-expanded":p,style:br,onMouseEnter:H,onMouseLeave:or,onClick:X,children:s.jsx(Ae,{color:"var(--ui-color-white, #fff)"})}),p&&s.jsxs("div",{ref:g,role:"dialog","aria-label":"Detalle del comentario",style:{...Ne,left:z+dr/2+6,top:T},onMouseEnter:nr,onMouseLeave:ir,children:[s.jsxs("div",{style:Me,children:[s.jsxs("div",{style:{display:"flex",alignItems:"center",gap:10,flex:1,minWidth:0},children:[s.jsx(Be,{reviewer:e.reviewer,status:e.status}),s.jsxs("div",{children:[s.jsx("div",{style:{fontWeight:700,fontSize:14,color:M.textDark},children:((ar=e.reviewer)==null?void 0:ar.name)??"Revisor"}),s.jsx("div",{style:{fontSize:12,color:M.textMuted},children:((lr=e.reviewer)==null?void 0:lr.job_title)??"Revisor"})]})]}),s.jsx("button",{type:"button","aria-label":e.status===k.VALIDATED?"Eliminar comentario":"Cerrar",style:Ye,disabled:j,onClick:E=>{E.stopPropagation(),e.status===k.VALIDATED?gr():B()},onMouseDown:E=>E.stopPropagation(),children:"✕"})]}),s.jsxs("div",{style:{padding:12,display:"flex",alignItems:"flex-start",flexDirection:"column",gap:4},children:[s.jsxs("div",{style:Ue(e.status),children:[e.status===k.VALIDATED&&s.jsx(ze,{}),Oe[e.status]??e.status]}),s.jsx("div",{style:{color:M.textDark,lineHeight:1.5,marginBottom:12,marginTop:12},children:e.message}),s.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:4,width:"100%"},children:[s.jsx("label",{style:Ge,htmlFor:`comment-status-${e.id}`,children:"Cambiar estado"}),s.jsx("select",{id:`comment-status-${e.id}`,style:He,value:e.status,disabled:j,onChange:E=>J(E.target.value),onMouseDown:E=>E.stopPropagation(),"aria-label":"Cambiar estado del comentario",children:Ze.map(E=>s.jsx("option",{value:E,children:Ie[E]},E))}),V&&s.jsx("div",{style:{marginTop:8,fontSize:11,color:"var(--ui-color-text-danger-default, rgb(240, 69, 69))"},children:V})]})]}),s.jsxs("div",{style:Xe,children:[s.jsx("button",{type:"button",style:Je,onMouseDown:E=>E.stopPropagation(),onClick:E=>{E.stopPropagation(),B()},children:"Cerrar"}),e.status!==k.VALIDATED&&s.jsxs(s.Fragment,{children:[s.jsx("style",{children:`
                   .${vr}:hover:not(:disabled) {
                     background-color: var(--ui-color-bg-fill-success-hover, #16a34a) !important;
                   }