1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[455],{1534:(e,t,r)=>{Promise.resolve().then(r.bind(r,6649)),Promise.resolve().then(r.bind(r,4197)),Promise.resolve().then(r.t.bind(r,2619,23))},2010:(e,t,r)=>{"use strict";r.d(t,{h:()=>n});var l=r(5155);function n(e){let{message:t}=e;return(0,l.jsx)("span",{className:"sr-only",role:"status","aria-live":"polite","data-testid":"status-live",children:t})}},3235:(e,t,r)=>{"use strict";r.d(t,{B:()=>l});class l{push(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;for(this.past.push({value:e,bytes:t}),this.totalBytes+=t;this.past.length>l.CAPACITY;){let e=this.past.shift();e&&(this.totalBytes-=e.bytes)}for(;this.totalBytes>this.byteBudget&&this.past.length>1;){let e=this.past.shift();e&&(this.totalBytes-=e.bytes)}this.future=[]}undo(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,r=this.past.pop();return r?(this.totalBytes-=r.bytes,this.future.push({value:e,bytes:t}),r.value):null}redo(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,r=this.future.pop();return r?(this.past.push({value:e,bytes:t}),this.totalBytes+=t,r.value):null}get canUndo(){return this.past.length>0}get canRedo(){return this.future.length>0}get depth(){return this.past.length}clear(){this.past=[],this.future=[],this.totalBytes=0}constructor(e=1/0){this.byteBudget=e,this.past=[],this.future=[],this.totalBytes=0}}l.CAPACITY=20},4197:(e,t,r)=>{"use strict";r.d(t,{HomeConversionProof:()=>u,PixelArtContentExamples:()=>c});var l=r(5155),n=r(2115),a=r(9828);let s=[{id:"portrait",title:"Portrait",description:"Fine hair, skin tones, and a bold jacket make palette reduction easy to spot.",source:"/examples/pixel-art-portrait-source.webp",alt:"A fictional woman in a colorful studio portrait"},{id:"landscape",title:"Landscape",description:"Layered mountains, water, and clouds expose how grid size handles depth.",source:"/examples/pixel-art-landscape-source.webp",alt:"A mountain valley with a turquoise lake at golden hour"},{id:"fox",title:"Animal",description:"The fox's fur and forest texture show where dithering earns its keep.",source:"/examples/pixel-art-fox-source.webp",alt:"A red fox in a sunlit woodland"}];function o(e){let{label:t,gridWidth:r,paletteCount:s,dithering:o,source:i}=e,c=(0,n.useRef)(null);return(0,n.useEffect)(()=>{let e=c.current;if(!e)return;let t=new Image;t.src=i;let l=!1;return t.onload=()=>{if(l)return;let n=document.createElement("canvas");n.width=t.naturalWidth,n.height=t.naturalHeight;let i=n.getContext("2d",{willReadFrequently:!0}),c=e.getContext("2d");if(!i||!c)return;i.drawImage(t,0,0);let u=i.getImageData(0,0,n.width,n.height),d=(0,a.NW)({width:n.width,height:n.height,data:u.data},{gridWidth:r,paletteCount:s,dithering:o,background:"solid"}),p=(0,a.a3)(d.grid,d.palette,12);e.width=p.width,e.height=p.height,c.putImageData(new ImageData(p.data,p.width,p.height),0,0)},()=>{l=!0,t.onload=null}},[o,r,s,i]),(0,l.jsxs)("figure",{className:"pixel-case-output",children:[(0,l.jsx)("canvas",{ref:c,"aria-label":"".concat(t," pixel-art result")}),(0,l.jsx)("figcaption",{children:t})]})}function i(e){let{example:t}=e;return(0,l.jsxs)("article",{className:"pixel-case-slide","aria-label":"".concat(t.title," conversion comparison"),children:[(0,l.jsxs)("header",{children:[(0,l.jsxs)("p",{className:"eyebrow",children:[t.title," conversion"]}),(0,l.jsx)("p",{children:t.description})]}),(0,l.jsxs)("div",{className:"pixel-case-grid",children:[(0,l.jsxs)("figure",{className:"pixel-case-source",children:[(0,l.jsx)("img",{src:t.source,alt:t.alt}),(0,l.jsx)("figcaption",{children:"Original source"})]}),(0,l.jsx)(o,{label:"16-cell grid \xb7 8 colors",gridWidth:16,paletteCount:8,dithering:"none",source:t.source}),(0,l.jsx)(o,{label:"32-cell grid \xb7 16 colors",gridWidth:32,paletteCount:16,dithering:"none",source:t.source}),(0,l.jsx)(o,{label:"32-cell grid \xb7 16 colors \xb7 FloydâSteinberg",gridWidth:32,paletteCount:16,dithering:"floyd-steinberg",source:t.source})]})]})}function c(){let[e,t]=(0,n.useState)(0);return(0,l.jsxs)("section",{className:"pixel-case-study","aria-labelledby":"pixel-case-study-title",children:[(0,l.jsxs)("div",{children:[(0,l.jsx)("p",{className:"eyebrow",children:"Made with this converter"}),(0,l.jsx)("h2",{id:"pixel-case-study-title",children:"Compare the settings. Choose your result."}),(0,l.jsx)("p",{children:"These results use the same converter as the editor. Select an image, then compare grid size, color count and dithering at your own pace."})]}),(0,l.jsx)("div",{className:"example-switcher",role:"group","aria-label":"Conversion example",children:s.map((r,n)=>(0,l.jsx)("button",{className:"btn secondary",type:"button","aria-pressed":n===e,onClick:()=>t(n),children:r.title},r.id))}),(0,l.jsx)(i,{example:s[e]})]})}function u(){let e=s[0];return(0,l.jsxs)("div",{className:"hero-demo real-proof",children:[(0,l.jsxs)("div",{className:"windowbar",children:[(0,l.jsx)("span",{children:"ONE PHOTO. YOUR PIXEL PATTERN."}),(0,l.jsx)("span",{children:"32 cells \xb7 16 colors"})]}),(0,l.jsxs)("div",{className:"proof-grid",children:[(0,l.jsxs)("figure",{children:[(0,l.jsx)("img",{src:e.source,alt:e.alt,width:640,height:480}),(0,l.jsx)("figcaption",{children:"Start with an image"})]}),(0,l.jsx)(o,{label:"Refine the pixels",gridWidth:32,paletteCount:16,dithering:"none",source:e.source})]}),(0,l.jsx)("p",{children:"Real output from the browser editor. Paint, pick or erase cells before you download."}),(0,l.jsx)("a",{className:"btn secondary",href:"/image-to-pixel-art",children:"Try the converter"})]})}},6263:(e,t,r)=>{"use strict";r.d(t,{I:()=>s});
1var l=r(5155),n=r(9902),a=r(8293);function s(e){let{copy:t,phase:r,inputRef:s,onFiles:o,onReset:i,testPrefix:c}=e,u=(0,a.Z)(o),d="ready"===r||"error"===r;return(0,l.jsxs)("div",{className:"step",children:[(0,l.jsx)("h3",{children:t.label}),(0,l.jsxs)("button",{type:"button",className:"upload".concat(u.dragActive?" dragover":""),"data-testid":"".concat(c,"-dropzone"),onClick:()=>{var e;return null==(e=s.current)?void 0:e.click()},onDragEnter:u.onDragEnter,onDragOver:u.onDragOver,onDragLeave:u.onDragLeave,onDrop:u.onDrop,"aria-label":"Choose or drop one image","aria-busy":"validating"===r,children:[(0,l.jsx)("strong",{children:t.dropTitle}),(0,l.jsx)("small",{children:t.dropBody}),(0,l.jsx)("span",{className:"btn secondary","data-testid":"".concat(c,"-choose-file"),"aria-hidden":"true",children:t.chooseButton}),(0,l.jsx)("p",{className:"input-help",children:t.inputHelp})]}),(0,l.jsx)("input",{ref:s,type:"file",accept:"image/png,image/jpeg,image/webp",className:"sr-only","aria-label":t.chooseButton,"data-testid":"".concat(c,"-file-input"),onChange:e=>{o(e.target.files)}}),(0,l.jsx)("p",{className:"control",children:(0,l.jsx)("span",{className:"help",children:n.Y})}),"p0"===c&&(0,l.jsxs)("p",{className:"help",children:["Edited cells and settings can autosave on this browser. Original images are not saved. ",(0,l.jsx)("a",{href:"#pixel_art-project",children:"Manage your local project"}),"."]}),(0,l.jsxs)("div",{style:{display:"flex",gap:6,flexWrap:"wrap"},children:[(0,l.jsx)("button",{type:"button",className:"btn secondary","data-testid":"".concat(c,"-replace"),disabled:!d,onClick:()=>{var e;return null==(e=s.current)?void 0:e.click()},children:t.replaceButton}),(0,l.jsx)("button",{type:"button",className:"btn secondary","data-testid":"".concat(c,"-reset"),disabled:!(d||"validating"===r),onClick:i,children:t.resetButton})]})]})}},6649:(e,t,r)=>{"use strict";r.d(t,{ImageToPixelArtTool:()=>B});var l=r(5155),n=r(2115),a=r(2619),s=r.n(a),o=r(9902),i=r(7272),c=r(5014),u=r(4462),d=r(9919),p=r(5839),h=r(6249),g=r(4188),m=r(186),x=r(1803),f=r(8293),b=r(6263),v=r(9030),y=r(2010),w=r(9828),j=r(1228),N=r(3235),k=r(7167);function T(e,t,r){return"".concat((e/255).toFixed(3)," ").concat((t/255).toFixed(3)," ").concat((r/255).toFixed(3)," rg")}var _=r(6109),C=r(4995),P=r(6124),R=r(4054),S=r(9757);function E(e){return{cells:new Int16Array(e.grid.cells),colors:new Uint8ClampedArray(e.palette.colors)}}function B(){var e,t,r,a,B,M,A,D,F,Q,X;let I=(0,x.v)("pixel_art"),L=(0,n.useRef)(!1),U=(0,n.useRef)(!1),O=(0,n.useRef)(null),[W,G]=(0,n.useState)(0),[H,z]=(0,n.useState)(!1),[K,Y]=(0,n.useState)(!1),{handleFiles:q,inputRef:Z}=I,V=(0,n.useCallback)(e=>{if(null==e?void 0:e.length){if(!L.current&&U.current&&!window.confirm("Choose another image? This replaces your manual edits.")){Z.current&&(Z.current.value="");return}q(e)}}
1,[q,Z]),J=(0,f.Z)(V),[$,ee]=(0,n.useState)(16),[et,er]=(0,n.useState)(p.hs),[el,en]=(0,n.useState)(0),[ea,es]=(0,n.useState)(w.XU),[eo,ei]=(0,n.useState)(w.yp),[ec,eu]=(0,n.useState)("none"),[ed,ep]=(0,n.useState)("transparent"),[eh,eg]=(0,n.useState)(null),[em,ex]=(0,n.useState)(!1),[ef,eb]=(0,n.useState)(!1),[ev,ey]=(0,n.useState)("original"),[ew,ej]=(0,n.useState)(!0),[eN,ek]=(0,n.useState)(null),[eT,e_]=(0,n.useState)(0),[eC,eP]=(0,n.useState)(null),eR=(0,n.useMemo)(()=>{var e,t;return eh?{cx:Math.max(0,Math.min(eh.grid.cols-1,null!=(e=null==eC?void 0:eC.cx)?e:0)),cy:Math.max(0,Math.min(eh.grid.rows-1,null!=(t=null==eC?void 0:eC.cy)?t:0))}:null},[eh,eC]),[eS,eE]=(0,n.useState)(null),[eB,eM]=(0,n.useState)(null),[eA,eD]=(0,n.useState)(o.XQ.empty),[eF,eQ]=(0,n.useState)(!1);(0,n.useEffect)(()=>{let e=()=>(0,C.u4)({name:"tool_open",params:{tool:"pixel_art",route_id:"pixel_art"}},"pixel_art:tool_open"),t=t=>{var r;(null==(r=t.detail)?void 0:r.granted)&&e()};return e(),window.addEventListener(S.Y,t),()=>window.removeEventListener(S.Y,t)},[]);let eX=(0,n.useRef)(new N.B),[,eI]=(0,n.useState)(0),eL=(0,n.useRef)(null),eU=(0,n.useRef)(null),eO=(0,n.useRef)(null),eW=(0,n.useRef)(null),eG=(0,u.c)(eW,null!=(a=null==eh?void 0:eh.grid.cols)?a:1,null!=(B=null==eh?void 0:eh.grid.rows)?B:1,12,"result"===ev&&!!eh),eH=eh?{width:eG.cellPixels*eh.grid.cols,height:eG.cellPixels*eh.grid.rows}:null,ez=(0,n.useRef)(null);(0,n.useEffect)(()=>()=>{null!==ez.current&&cancelAnimationFrame(ez.current)},[]);let eK=(0,n.useRef)(null),eY=(0,n.useRef)(!1),eq=(0,n.useRef)(!1),eZ=(0,n.useRef)(0),eV=(0,n.useRef)(null);(0,n.useEffect)(()=>()=>{var e;null==(e=eV.current)||e.cancel(),eZ.current++},[]);let eJ=(0,n.useRef)(0),e$=(0,n.useRef)(null),e0=(0,n.useRef)("png"),e1=(0,n.useRef)(null),e2=(0,n.useRef)(null);e2.current=eh;let e3=(0,n.useRef)({source:I.source,gridWidth:ea,paletteCount:eo,dithering:ec,background:ed,preparation:et});e3.current={source:I.source,gridWidth:ea,paletteCount:eo,dithering:ec,background:ed,preparation:et};let e4=(0,n.useRef)(null),e5=(0,n.useRef)(ef);e5.current=ef,(0,n.useRef)(!1).current=null!==I.source;let e6=(0,n.useCallback)(()=>{eK.current&&(URL.revokeObjectURL(eK.current),eK.current=null)},[]);(0,n.useEffect)(()=>{(0,k.eK)(window)||(eQ(!0),eD(o.XQ.fatal))},[]),(0,n.useEffect)(()=>()=>{eJ.current++,e$.current&&(clearTimeout(e$.current),e$.current=null),e6()},[e6]);let e9=(0,n.useCallback)(()=>{var e,t;let r=null==(e=I.source)?void 0:e.img,l=eO.current;if(!r||!l)return;let n=Math.min(1,1200/Math.max(r.width,r.height)),a=Math.max(1,Math.round(r.width*n)),s=Math.max(1,Math.round(r.height*n));l.width=a,l.height=s;let o=l.getContext("2d");if(!o)return;let i=null==(t=I.source)?void 0:t.originalPreview;if(i){l.width=i.width,l.height=i.height,o.putImageData(new ImageData(i.data,i.width,i.height),0,0);return}if(null===i)return void o.clearRect(0,0,a,s);let c=(0,_.Tk)(r);o.imageSmoothingEnabled=!0,o.clearRect(0,0,a,s),o.drawImage(c,0,0,a,s),c.width=0,c.height=0},[I.source]),e8=(0,n.useCallback)(()=>{if(!eh)return;let e=eL.current;if(!e)return;let t=(0,w.a3)(eh.grid,eh.palette,12);e.width=t.width,e.height=t.height;let r=e.getContext("2d");r&&(r.clearRect(0,0,t.width,t.height),r.putImageData(new ImageData(t.data,t.width,t.height),0,0))},[eh]),e7=(0,n.useCallback)(()=>{if(!eh)return;let e=eU.current;if(!e)return;let t=12*eh.grid.cols,r=12*eh.grid.rows;e.width=t,e.height=r;let l=e.getContext("2d");if(l){if(l.clearRect(0,0,t,r),ew&&"result"===ev){l.strokeStyle="rgba(23,35,31,0.35)",l.lineWidth=1;for(let e=0;e<=eh.grid.cols;e++)l.beginPath(),l.moveTo(12*e+.5,0),l.lineTo(12*e+.5,r),l.stroke();for(let e=0;e<=eh.grid.rows;e++)l.beginPath(),l.moveTo(0,12*e+.5),l.lineTo(t,12*e+.5),l.stroke()}eR&&eN&&"result"===ev&&(l.strokeStyle="#17231f",l.lineWidth=3,l.strokeRect(12*eR.cx+1.5,12*eR.cy+1.5,9,9),l.strokeStyle="#ffffff",l.lineWidth=1,l.strokeRect(12*eR.cx+3.5,12*eR.cy+3.5,5,5))}},[eh,ew,ev,eR,eN]);(0,n.useEffect)(()=>{"original"===ev&&e9()},[ev,e9,I.source]),(0,n.useEffect)(()=>{"result"===ev&&e8()},[ev,e8]),(0,n.useEffect)(()=>{e7()},[e7]),(0,n.useEffect)(()=>{var e;if(null==(e=eV.current)||e.cancel(),eZ.current++,e4.current=null,null!==ez.current&&cancelAnimationFrame(ez.current),ez.current=null,L.current){I.source&&Y(!0);return}z(!1),Y(!1),U.current=!1,eg(null),eb(!1),eX.current.clear(),ek(null),eP(null),ey("original"),eM(null),eE(null),eJ.current++,e$.current&&(clearTimeout(e$.current),e$.current=null),e6(),eD(I.source?o.XQ.acceptedP0:o.XQ.empty)},[I.source,e6]),(0,n.useEffect)(()=>
1{"validating"===I.phase&&eD(o.XQ.validating),"ready"!==I.phase&&ex(!1)},[I.phase]);let te=(0,n.useCallback)(function(){var e,t;let r=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"final";if(L.current)return;let l=e3.current,n=null==(e=l.source)?void 0:e.img;if(!n)return;ex(!0),eD(o.XQ.processingP0),null==(t=eV.current)||t.cancel();let a=++eZ.current;setTimeout(async()=>{var e,t,s,i;if(eZ.current===a)try{let s=l.preparation,i=(0,h.j)({tool:"pixel_art",source:n,preparation:s,settings:{gridWidth:(0,w.wt)(l.gridWidth),paletteCount:(0,w._p)(l.paletteCount),dithering:l.dithering,background:l.background}},(0,k.nl)(navigator));eV.current=i;let c=await i.promise;if(eZ.current!==a)return;eV.current=null,eg(c),"final"===r&&(e4.current=l,U.current=!1,G(e=>e+1),z(!1),Y(!1),eX.current.clear(),e_(0),eb(!0),(0,P.R)("pixel_art",l.source)),ey("result"),eD("final"===r?o.XQ.resultP0:o.XQ.stale),"final"===r&&(0,C.u4)({name:"processing_succeeded",params:{tool:"pixel_art",mode:"convert",input_source:null!=(t=null==(e=l.source)?void 0:e.inputSource)?t:"file",grid_bucket:(0,k.NF)(c.grid.cols),palette_bucket:(0,k.mT)(c.palette.count),dither_mode:"floyd-steinberg"===l.dithering?"floyd_steinberg":"none"}},"pixel_art:processing_succeeded:".concat(c.grid.cols,":").concat(c.palette.count,":").concat(l.dithering,":").concat(l.background))}catch(e){if(e instanceof h.S||eZ.current!==a)return;eM(e instanceof w.Qs||e instanceof p.rK&&"memory"===e.reason?"memory_limit":"processing_error"),"final"===r&&(0,C.u4)({name:"processing_failed",params:{tool:"pixel_art",input_source:null!=(i=null==(s=l.source)?void 0:s.inputSource)?i:"file",error_category:e instanceof w.Qs||e instanceof p.rK&&"memory"===e.reason?"memory_limit":"processing_error"}}),eD("")}finally{eZ.current===a&&ex(!1)}},30)},[]);(0,n.useEffect)(()=>{if(L.current||!I.source)return;eJ.current++;let e=window.setTimeout(()=>te("final"),0);return()=>window.clearTimeout(e)},[I.source,te]),(0,n.useEffect)(()=>{var e;if(L.current||!e3.current.source)return;null==(e=eV.current)||e.cancel(),eZ.current++,eJ.current++,eb(!1),e2.current&&eD(o.XQ.stale);let t=window.setTimeout(()=>{e1.current=null,te("preview")},100);return e1.current=t,()=>{window.clearTimeout(t),e1.current===t&&(e1.current=null)}},[ea,eo,ec,ed,te]);let tt=(0,n.useCallback)(()=>{var e;if(!e3.current.source)return;let t=e3.current,r=e4.current;e5.current&&r&&t.source===r.source&&t.gridWidth===r.gridWidth&&t.paletteCount===r.paletteCount&&t.dithering===r.dithering&&t.background===r.background&&t.preparation===r.preparation||(null!==e1.current&&(window.clearTimeout(e1.current),e1.current=null),null==(e=eV.current)||e.cancel(),eZ.current++,window.setTimeout(()=>te("final"),0))},[te]);(0,n.useEffect)(()=>{var e;if(L.current||!e3.current.source)return;null!==e1.current&&(window.clearTimeout(e1.current),e1.current=null),null==(e=eV.current)||e.cancel(),eZ.current++,eJ.current++,eb(!1);let t=window.setTimeout(()=>te("final"),0);return()=>window.clearTimeout(t)},[et,el,te]);let tr=(0,n.useCallback)(e=>{let t=eL.current;if(!t||!eh)return null;let r=t.getBoundingClientRect(),l=t.width/r.width,n=t.height/r.height,a=(e.clientX-r.left)*l,s=(e.clientY-r.top)*n,o=Math.floor(a/12),i=Math.floor(s/12);return o<0||i<0||o>=eh.grid.cols||i>=eh.grid.rows?null:{cx:o,cy:i}},[eh]),tl=(0,n.useCallback)((e,t,r,l)=>{if(!eh)return;let n=t*eh.grid.cols+e;if("pick"===r){let e=eh.grid.cells[n];e>=0&&(e_(e),(0,C.u4)({name:"edit_used",params:{tool:"pixel_art",edit_mode:"picker"}},"pixel_art:first-edit"));return}let a="erase"===r?-1:eT;eh.grid.cells[n]!==a&&(l&&!eq.current&&(eX.current.push(E(eh),2*eh.grid.cells.length),eq.current=!0),U.current=!0,eJ.current++,eE(null),eh.grid.cells[n]=a,(0,C.u4)({name:"edit_used",params:{tool:"pixel_art",edit_mode:"erase"===r?"eraser":"paint"}},"pixel_art:first-edit"),e8(),eI(e=>e+1))},[eh,eT,e8]),tn=(0,n.useCallback)(e=>{var t,r;if(eG.pan||!eN||"result"!==ev||!eh||0!==e.button)return;let l=tr(e);l&&(eY.current=!0,eq.current=!1,null==(t=(r=e.target).setPointerCapture)||t.call(r,e.pointerId),tl(l.cx,l.cy,eN,!0))},[eG.pan,eN,ev,eh,tr,tl]),ta=(0,n.useCallback)(e=>{if(!eN||!eY.current||"pick"===eN)return;let t=tr(e);t&&tl(t.cx,t.cy,eN,!0)},[eN,tr,tl]),ts=(0,n.useCallback)(()=>{eY.current=!1,eq.current&&G(e=>e+1)},[]),to=(0,n.useCallback)((e,t)=>{null!==ez.current&&cancelAnimationFrame(ez.current),ez.current=requestAnimationFrame(()=>{ez.current=null;let r=eW.current,l=eL.current,n=e2.current;if(!r||!l||!n)return;let a=l.getBoundingClientRect(),s=r.getBoundingClientRect(),o=s.left+r.clientLeft,i=s.top+r.clientTop,c=o+r.clientWidth,u=i+r.clientHeight,d=a.width/n.grid.cols,p=a.height/n.grid.rows,h=a.left+Math.min(e,n.grid.cols-1)*d,g=a.top+Math.min(t,n.grid.rows-1)*p;h<o+4?r.scrollLeft-=o+4-h:h+d>c-4&&(r.scrollLeft+=h+d-c+4),g<i+4?r.scrollTop-=i+4-g:g+p>u-4&&(r.scrollTop+=g+p-u+4)})},[]),ti=(0,n.useCallback)(e=>{if(eG.pan||!eN||!eh)return;let t=eh.grid.cols,r=eh.grid.rows,{cx:l,cy:n}=null!=eR?eR:{cx:0,cy:0},a={ArrowLeft:[-1,0],ArrowRight:[1,0],ArrowUp:[0,-1],ArrowDown:[0,1]};if(a[e.key]){e.preventDefault();let[s,o]=a[e.key];eP({cx:l=Math.max(0,Math.min(t-1,l+s)),cy:n=Math.max(0,Math.min(r-1,n+o))}),to(l,n);return}
1("Enter"===e.key||" "===e.key)&&(e.preventDefault(),to(l,n),eq.current=!1,tl(l,n,eN,!0),eq.current&&G(e=>e+1))},[eG.pan,eN,eh,eR,to,tl]),tc=(0,n.useCallback)(()=>{if(!eh)return;let e=eX.current.undo(E(eh),2*eh.grid.cells.length);e?(U.current=!0,G(e=>e+1),eJ.current++,eE(null),eh.grid.cells.set(e.cells),eh.palette.colors.set(e.colors),e8(),e7(),eI(e=>e+1)):eD(o.XQ.noUndo)},[eh,e8,e7]),tu=(0,n.useCallback)(()=>{if(!eh)return;let e=eX.current.redo(E(eh),2*eh.grid.cells.length);e?(U.current=!0,G(e=>e+1),eJ.current++,eE(null),eh.grid.cells.set(e.cells),eh.palette.colors.set(e.colors),e8(),e7(),eI(e=>e+1)):eD(o.XQ.noRedo)},[eh,e8,e7]),td=(0,n.useCallback)((e,t)=>{if(!eh)return;U.current=!0,G(e=>e+1),eJ.current++,eE(null),eX.current.push(E(eh),2*eh.grid.cells.length);let r=parseInt(t.slice(1,3),16),l=parseInt(t.slice(3,5),16),n=parseInt(t.slice(5,7),16);eh.palette.colors[3*e]=r,eh.palette.colors[3*e+1]=l,eh.palette.colors[3*e+2]=n,e8(),eI(e=>e+1)},[eh,e8]),tp=(0,n.useCallback)(async()=>{if(!eh||eS)return;e0.current="png",eE("png"),eD(o.XQ.exportingPng);let e=eJ.current;(0,C.u4)({name:"export_started",params:{tool:"pixel_art",export_format:"png"}},"pixel_art:export_started:png");try{var t,r;let l=(0,w.a3)(eh.grid,eh.palette,$),n=await (0,_.a2)(l,"png");if(eJ.current!==e)return;let a=null!=(r=null==(t=I.source)?void 0:t.baseName)?r:"image",s=(0,_.zc)(n,_.GV.pixelArtPng(a));e6(),eK.current=s,eD(o.XQ.exported),(0,C.u4)({name:"export_succeeded",params:{tool:"pixel_art",export_format:"png",mode:"convert"}},"pixel_art:export_succeeded:png")}catch(r){if(eJ.current!==e)return;let t=r instanceof _.xz?"download_blocked":r instanceof w.Qs?"memory_limit":"export_encoder_error";eM(t),(0,C.u4)({name:"export_failed",params:{tool:"pixel_art",export_format:"png",error_category:t}})}finally{eJ.current===e&&eE(null)}},[eh,eS,I.source,e6,$]),th=(0,n.useCallback)(()=>{if(!eh||eS)return;e0.current="pdf",eE("pdf"),eD(o.XQ.exportingPdf);let e=eJ.current;(0,C.u4)({name:"export_started",params:{tool:"pixel_art",export_format:"pdf"}},"pixel_art:export_started:pdf"),e$.current=setTimeout(()=>{if(e$.current=null,eJ.current===e)try{var t,r;let l=function(e,t){if(e.cols<1||e.rows<1||e.cells.length!==e.cols*e.rows)throw Error("invalid grid");if(t.count<1)throw Error("invalid palette");(0,w.M6)(e.cols,e.rows);let r=e.cols>e.rows,l=r?792:612,n=r?612:792,a=function(e,t){let r=(t?792:612)-72,l=(t?612:792)-72-40,n=Math.max(6,Math.min(24,Math.floor(Math.min(r/e.cols,l/e.rows)))),a=Math.max(1,Math.floor(r/n)),s=Math.max(1,Math.floor(l/n)),o=[];for(let t=0;t<e.rows;t+=s)for(let r=0;r<e.cols;r+=a)o.push({colStart:r,rowStart:t,cols:Math.min(a,e.cols-r),rows:Math.min(s,e.rows-t)});return o}(e,r),s=function(e){let t=[];for(let r=0;r<e.count;r++){let l=e.colors[3*r],n=e.colors[3*r+1],a=e.colors[3*r+2];t.push("".concat(r+1," RGB ").concat(l," ").concat(n," ").concat(a," ").concat((0,j.tU)(e,r)))}return t}(t),o=[],i=[];o.push({body:""}),o.push({body:""});let c=[];for(let r of a){let a=l-72,s=n-72-40,u=Math.max(6,Math.min(24,Math.floor(Math.min(a/e.cols,s/e.rows)))),d=r.cols*u,p=r.rows*u,h=36+Math.floor((a-d)/2),g=n-36-40-p,m=[];m.push("BT /F1 10 Tf 36 "+(n-36+6)+" Td (Pixel Pattern) Tj ET"),m.push("BT /F1 8 Tf 36 "+(n-36-8)+" Td (Grid "+e.cols+" x "+e.rows+" - page cells "+(r.colStart+1)+"-"+(r.colStart+r.cols)+" x "+(r.rowStart+1)+"-"+(r.rowStart+r.rows)+") Tj ET");for(let l=0;l<r.rows;l++)for(let n=0;n<r.cols;n++){let a=r.colStart+n,s=r.rowStart+l,o=e.cells[s*e.cols+a],i=h+n*u,c=g+(r.rows-1-l)*u;if(o>=0){let e=t.colors[3*o],r=t.colors[3*o+1],l=t.colors[3*o+2];m.push("".concat(T(e,r,l)," ").concat(i," ").concat(c," ").concat(u," ").concat(u," re f"));let n=String(o+1),a=u>=14?7:5,s=.299*e+.587*r+.114*l>150?"0.09 0.14 0.12":"1 1 1";m.push("BT /F1 ".concat(a," Tf ").concat(s," rg ").concat(i+Math.max(1,(u-n.length*a*.5)/2)," ").concat(c+u/2-a/3," Td (").concat(n,") Tj ET"))}}m.push("0.09 0.14 0.12 RG 0.6 w");for(let e=0;e<=r.cols;e++){let t=h+e*u;m.push("".concat(t," ").concat(g," m ").concat(t," ").concat(g+p," l S"))}for(let e=0;e<=r.rows;e++){let t=g+e*u;m.push("".concat(h," ").concat(t," m ").concat(h+d," ").concat(t," l S"))}m.push("BT /F1 6 Tf 0.36 0.41 0.38 rg");for(let e=0;e<r.cols;e+=5){let t=r.colStart+e+1;m.push("1 0 0 1 ".concat(h+e*u+1," ").concat(g-8," Tm (").concat(t,") Tj"))}m.push("ET");let x=o.length+1;c.push(x),o.push({body:"<< /Length ".concat(m.join("\n").length," >>\nstream\n").concat(m.join("\n"),"\nendstream")});let f=o.length+1;i.push(f),o.push({body:"<< /Type /Page /Parent 2 0 R /MediaBox [0 0 ".concat(l," ").concat(n,"] /Resources << /Font << /F1 ").concat(o.length+2," 0 R >> >> /Contents ").concat(x," 0 R >>")}),o.push({body:"<< /Type /Font /Subtype /Type1 /BaseFont /Helvetica >>"})}{let e=[];e.push("BT /F1 12 Tf 36 "+(n-36)+" Td (Palette legend) Tj ET");let r=n-36-24;for(let l of s){let[n]=l.split(" "),a=Number(n)-1,s=t.colors[3*a],o=t.colors[3*a+1],i=t.colors[3*a+2];if(e.push("".concat(T(s,o,i)," 36 ").concat(r-2," 10 10 re f")),e.push("0.09 0.14 0.12 RG 0.6 w 36 ".concat(r-2," 10 10 re S")),e.push("BT /F1 8 Tf 0.09 0.14 0.12 rg 52 ".concat(r," Td (").concat(l.replace(/\\/g,"\\\\").replace(/\(/g,"\\(").replace(/\)/g,"\\)"),") Tj ET")),(r-=14)<36)break}r-=8,e.push("BT /F1 7 Tf 0.42 0.45 0.43 rg 36 "+r+" Td (Printable grid reference only. Not a vector file, bill of materials, material-quantity guide, or production-color guarantee.) Tj ET");let a=o.length+1;c.push(a),o.push({body:"<< /Length ".concat(e.join("\n").length," >>\nstream\n").concat(e.join("\n"),"\nendstream")});let u=o.length+1;i.push(u),o.push({body:"<< /Type /Page /Parent 2 0 R /MediaBox [0 0 ".concat(l," ").concat(n,"] /Resources << /Font << /F1 ").concat(o.length+2," 0 R >> >> /Contents ").concat(a," 0 R >>")}),o.push({body:"<< /Type /Font /Subtype /Type1 /BaseFont /Helvetica >>"})}o[0]={body:"<< /Type /Catalog /Pages 2 0 R >>"},o[1]={body:"<< /Type /Pages /Kids [".concat(i.map(e=>"".concat(e," 0 R")).join(" "),"] /Count ").concat(i.length," >>")};let u=[],d=[],p=0,h="%PDF-1.4\n";u.push(h),p+=h.length;for(let e=0;e<o.length;e++){d.push(p);let t="".concat(e+1," 0 obj\n").concat(o[e].body,"\nendobj\n");u.push(t),p+=t.length}let g=p,m="xref\n0 ".concat(o.length+1,"\n0000000000 65535 f \n");for(let e of d)m+="".concat(String(e).padStart(10,"0")," 00000 n \n");m+="trailer\n<< /Size ".concat(o.length+1," /Root 1 0 R >>\nstartxref\n").concat(g,"\n%%EOF\n"),u.push(m);let x=u.join(""),f=new Uint8Array(new ArrayBuffer(x.length));for(let e=0;e<x.length;e++)f[e]=255&x.charCodeAt(e);return f}(eh.grid,eh.palette);if(eJ.current!==e)return;let n=new Blob([l],{type:"application/pdf"}),a=null!=(r=null==(t=I.source)?void 0:t.baseName)?r:"image",s=(0,_.zc)(n,_.GV.pixelArtPdf(a));e6(),eK.current=s,eD(o.XQ.exported),(0,C.u4)({name:"export_succeeded",params:{tool:"pixel_art",export_format:"pdf",mode:"convert"}},"pixel_art:export_succeeded:pdf")}catch(r){if(eJ.current!==e)return;let t=r instanceof _.xz?"download_blocked":r instanceof w.Qs?"memory_limit":"pdf_generation_error";eM(t),(0,C.u4)({name:"export_failed",params:{tool:"pixel_art",export_format:"pdf",error_category:t}})}finally{eJ.current===e&&eE(null)}},30)},[eh,eS,I.source,e6]),tg=(0,n.useMemo)(()=>eh&&ef&&!em?(null!=O.current||(O.current=crypto.randomUUID()),{schemaVersion:1,tool:"pixel_art",projectId:O.current,updatedAt:new Date().toISOString(),contentRevision:W,sourcePersisted:!1,content:{cols:eh.grid.cols,rows:eh.grid.rows,cells:Array.from(eh.grid.cells),palette:Array.from(eh.palette.colors)},conversionSettings:{gridWidth:ea,paletteCount:eo,dithering:ec,background:ed,preprocess:et}
1,layoutSettings:{exportScale:$}}):null,[eh,ef,em,W,ea,eo,ec,ed,$,et]),tm=()=>{var e;e4.current=null,L.current=!1,U.current=!1,O.current=null,null==(e=eV.current)||e.cancel(),eZ.current++,eJ.current++,I.reset(),e6(),er(p.hs),eg(null),e2.current=null,eb(!1),ex(!1),eE(null),eM(null),ek(null),eP(null),ey("original"),z(!1),Y(!1),G(0),eX.current.clear(),eD(o.XQ.empty),null!==e1.current&&(clearTimeout(e1.current),e1.current=null),null!==e$.current&&(clearTimeout(e$.current),e$.current=null)},tx=null!==eh,tf=o.h;return eF?(0,l.jsx)("div",{className:"overlay",style:{position:"relative",inset:"auto",minHeight:300},"data-testid":"fatal-capability",children:(0,l.jsxs)("div",{className:"box",role:"alert",children:[(0,l.jsx)("h3",{children:o.XQ.fatal}),(0,l.jsx)("p",{children:o.XQ.fatalGuidance}),(0,l.jsx)(s(),{className:"btn primary",href:"/",children:o.XQ.fatalBack})]})}):(0,l.jsxs)("div",{children:[(0,l.jsxs)("div",{id:"pixel-art-tool",className:"workbench","data-clarity-mask":"true",children:[(0,l.jsxs)("div",{className:"rail",children:[(0,l.jsx)(b.I,{copy:tf.step1,phase:I.phase,inputRef:I.inputRef,onFiles:V,onReset:tm,testPrefix:"p0"}),H&&(0,l.jsxs)("div",{className:"source-recovery",children:[(0,l.jsx)("p",{children:"The original image was not saved. You can edit and export this pattern. Choose an image to prepare a rebuild."}),K&&(0,l.jsx)("button",{type:"button",className:"btn secondary",onClick:()=>{window.confirm("Rebuild from the selected image? This replaces the restored pattern and its edits.")&&(L.current=!1,te("final"))},children:"Rebuild from selected image"}),(0,l.jsx)("button",{type:"button",className:"btn secondary",onClick:tm,children:"Reset workbench"})]}),(0,l.jsx)(i.N,{source:null!=(M=null==(e=I.source)?void 0:e.img)?M:null,value:et,onApply:e=>(!U.current||!!window.confirm("Apply preparation and rebuild? This replaces your manual edits."))&&(L.current=!1,er(e),!0)}),(0,l.jsxs)(R.R,{className:"step",title:tf.step2.label,children:[(0,l.jsx)(d.l,{source:null!=(A=null==(t=I.source)?void 0:t.img)?A:null,tool:"pixel_art",settings:{cols:ea,colors:eo,dithering:ec,background:ed},preparation:et,disabled:em||"validating"===I.phase,revision:W,onApply:e=>(!U.current||!!window.confirm("Apply these conversion settings? This replaces your manual edits."))&&(L.current=!1,es(e.cols),ei(e.colors),eu(e.dithering),en(e=>e+1),!0)}),(0,l.jsxs)("fieldset",{className:"conversion-settings",disabled:H,children:[(0,l.jsxs)("div",{className:"control",children:[(0,l.jsxs)("div",{className:"label-row",children:[(0,l.jsx)("label",{htmlFor:"p0-grid",children:tf.step2.gridLabel}),(0,l.jsxs)("span",{children:[ea," ",tf.step2.gridSuffix]})]}),(0,l.jsx)("input",{id:"p0-grid",type:"range",min:w.Yu,max:w.or,value:ea,onChange:e=>{es(Number(e.target.value))},onPointerUp:tt,onTouchEnd:tt,onKeyUp:tt,onBlur:tt,"data-testid":"p0-grid"}),(0,l.jsx)("p",{className:"help",children:tf.step2.gridHelp})]}),(0,l.jsxs)("div",{className:"control",children:[(0,l.jsxs)("div",{className:"label-row",children:[(0,l.jsx)("label",{htmlFor:"p0-palette",children:tf.step2.paletteLabel}),(0,l.jsx)("span",{children:eo})]}),(0,l.jsx)("input",{id:"p0-palette",type:"range",min:w.vm,max:w.nP,value:eo,onChange:e=>{ei(Number(e.target.value))},onPointerUp:tt,onTouchEnd:tt,onKeyUp:tt,onBlur:tt,"data-testid":"p0-palette"}),(0,l.jsx)("p",{className:"help",children:tf.step2.paletteHelp})]}),(0,l.jsxs)("div",{className:"control",children:[(0,l.jsx)("span",{className:"label-row",id:"p0-dither-label",children:tf.step2.ditherLabel}),(0,l.jsxs)("div",{className:"seg",role:"group","aria-labelledby":"p0-dither-label",children:[(0,l.jsx)("button",{type:"button",className:"none"===ec?"active":"","aria-pressed":"none"===ec,onClick:()=>{eu("none"),window.setTimeout(()=>tt(),0)},"data-testid":"p0-dither-none",children:tf.step2.ditherNone}),(0,l.jsx)("button",{type:"button",className:"floyd-steinberg"===ec?"active":"","aria-pressed":"floyd-steinberg"===ec,onClick:()=>{eu("floyd-steinberg"),window.setTimeout(()=>tt(),0)},"data-testid":"p0-dither-fs",children:tf.step2.ditherFs})]}),(0,l.jsx)("p",{className:"help",children:tf.step2.ditherHelp})]}),(0,l.jsxs)("div",{className:"control",children:[(0,l.jsx)("span",{className:"label-row",id:"p0-bg-label",children:tf.step2.backgroundLabel}),(0,l.jsxs)("div",{className:"seg",role:"group","aria-labelledby":"p0-bg-label",children:[(0,l.jsx)("button",{type:"button",className:"transparent"===ed?"active":"","aria-pressed":"transparent"===ed,onClick:()=>{ep("transparent"),window.setTimeout(()=>tt(),0)},"data-testid":"p0-bg-transparent",children:tf.step2.backgroundTransparent}),(0,l.jsx)("button",{type:"button",className:"solid"===ed?"active":"","aria-pressed":"solid"===ed,onClick:()=>{ep("solid"),window.setTimeout(()=>tt(),0)},"data-testid":"p0-bg-solid",children:tf.step2.backgroundSolid})]}),(0,l.jsx)("p",{className:"help",children:tf.step2.backgroundHelp})]}),(0,l.jsx)("p",{className:"help",children:tf.step2.defaultNote}),(0,l.jsx)("p",{className:"help","data-testid":"p0-process",children:tf.step2.autoUpdateNote}),(0,l.jsx)("p",{className:"warning-short",children:tf.step2.editReplacementWarning})]})]}),(0,l.jsxs)("div",{className:"step action-dock","data-testid":"p0-edit-dock","aria-disabled":!tx||!ef,children:[(0,l.jsx)("h3",{children:tf.step3.label}),(0,l.jsx)("div",{className:"control",children:(0,l.jsxs)("label",{style:{display:"flex",alignItems:"center",gap:8,minHeight:44},children:[(0,l.jsx)("input",{type:"checkbox",checked:ew,onChange:e=>ej(e.target.checked),style:{width:20,height:20,accentColor:"var(--ink)"},"data-testid":"p0-grid-overlay"}),tf.step3.gridOverlayLabel]})}),(0,l.jsxs)("div",{className:"control",children:[(0,l.jsx)("span",{className:"label-row",id:"p0-edit-label",children:tf.step3.editModeL
1abel}),(0,l.jsx)("div",{className:"seg",role:"group","aria-labelledby":"p0-edit-label",style:{gridTemplateColumns:"1fr 1fr 1fr"},children:[["paint",tf.step3.toolPaint,"p0-tool-paint"],["pick",tf.step3.toolPick,"p0-tool-pick"],["erase",tf.step3.toolErase,"p0-tool-erase"]].map(e=>{let[t,r,n]=e;return(0,l.jsx)("button",{type:"button",className:eN!==t||eG.pan?"":"active","aria-pressed":eN===t&&!eG.pan,onClick:()=>{let e=eN===t?null:t;eG.setPan(!1),e&&eG.cellPixels<20&&eG.changeZoom(2),ek(e),eD(e?o.XQ.editingP0(r):o.XQ.resultP0)},"data-testid":n,children:r},t)})}),(0,l.jsx)("p",{className:"help",children:tf.step3.paletteInstruction})]}),(0,l.jsxs)("div",{className:"control",children:[(0,l.jsx)("span",{className:"label-row",children:tf.step3.paletteSection}),(0,l.jsx)("div",{className:"palette-strip",children:Array.from({length:null!=(D=null==eh?void 0:eh.palette.count)?D:0},(e,t)=>(0,l.jsxs)("div",{className:"swatch","data-testid":"p0-swatch-".concat(t),children:[(0,l.jsx)("input",{id:"p0-color-".concat(t),type:"color",className:"swatch-color",value:eh?(0,j.tU)(eh.palette,t):"#000000",disabled:!ef,onChange:e=>td(t,e.target.value),"aria-label":"Edit palette color ".concat(t+1)}),(0,l.jsx)("button",{type:"button",className:"swatch-select","aria-pressed":eT===t,"aria-label":"Select palette color ".concat(t+1),onClick:()=>e_(t),children:t+1})]},t))})]}),(0,l.jsxs)("div",{style:{display:"flex",gap:6},children:[(0,n.createElement)("button",{autoComplete:"off",key:"undo-".concat(H),type:"button",className:"btn secondary",onClick:tc,disabled:!eX.current.canUndo,"data-testid":"p0-undo"},tf.step3.undo),(0,n.createElement)("button",{autoComplete:"off",key:"redo-".concat(H),type:"button",className:"btn secondary",onClick:tu,disabled:!eX.current.canRedo,"data-testid":"p0-redo"},tf.step3.redo)]}),(0,l.jsx)("p",{className:"help",children:tf.step3.undoHelp}),(0,l.jsx)("p",{className:"help",children:tf.step3.editorInstruction})]}),(0,l.jsxs)("div",{className:"step action-dock","data-testid":"p0-export-dock","aria-disabled":!tx||!ef,children:[(0,l.jsx)("h3",{children:tf.step4.label}),(0,l.jsx)("p",{className:"help",style:{marginBottom:8},children:tf.step4.intro}),(0,l.jsxs)("label",{className:"control",children:["PNG scale",(0,l.jsx)("select",{"aria-label":"PNG scale",value:$,disabled:null!==eS,onChange:e=>ee(Number(e.target.value)),children:[1,2,4,8,16].map(e=>(0,l.jsxs)("option",{value:e,children:[e,"\xd7",1===e?" â original grid size":""]},e))})]}),eh&&(0,l.jsxs)("p",{className:"help",children:["PNG size: ",eh.grid.cols*$," \xd7 ",eh.grid.rows*$," px. Crisp pixels, no smoothing."]}),(0,l.jsxs)("div",{style:{display:"grid",gap:8},children:[(0,l.jsx)("button",{autoComplete:"off",type:"button",className:"btn primary",onClick:tp,disabled:!tx||!ef||em||null!==eS,"data-testid":"p0-export-png",children:"png"===eS?o.XQ.exportingPng:tf.step4.pngButton}),(0,l.jsx)("button",{autoComplete:"off",type:"button",className:"btn dark",onClick:th,disabled:!tx||!ef||em||null!==eS,"data-testid":"p0-export-pdf",children:"pdf"===eS?o.XQ.exportingPdf:tf.step4.pdfButton})]}),(0,l.jsx)("p",{className:"help",style:{marginTop:8},children:tf.step4.pngBody}),(0,l.jsx)("p",{className:"help",children:tf.step4.pdfBody}),(0,l.jsx)("p",{className:"help",children:tf.step4.pdfLimitation})]})]}),(0,l.jsx)("div",{className:"stage-column",children:(0,l.jsxs)("div",{className:"stage",children:[(0,l.jsxs)("div",{className:"example-action",children:[(0,l.jsx)("button",{className:"btn secondary",type:"button",disabled:I.exampleBusy||"validating"===I.phase,onClick:()=>{(L.current||!eh||window.confirm("Try an example? This replaces the current pattern."))&&I.loadExample()},children:I.exampleBusy?"Loading exampleâ¦":"Try an example"}),(0,l.jsx)("span",{children:"Use a sample image to explore the editor."}),I.exampleBusy&&(0,l.jsx)("button",{type:"button",className:"btn secondary",onClick:e=>{var t;let r=null==(t=e.currentTarget.parentElement)?void 0:t.querySelector("button");I.cancelExample(),eD("Example loading canceled."),requestAnimationFrame(()=>null==r?void 0:r.focus())},children:"Cancel example"}),I.exampleError&&(0,l.jsx)("p",{role:"alert",children:"The example could not load. Try the example again or choose your own image."})]}),(0,l.jsxs)("div",{className:"stagebar",children:[(0,l.jsxs)("div",{className:"tabs",role:"tablist","aria-label":"Preview",children:[(0,l.jsx)("button",{type:"button",role:"tab","aria-selected":"original"===ev,className:"tab".concat("original"===ev?" active":""),onClick:()=>{ey("original"),eD(o.XQ.viewOriginal)},disabled:!I.source,"data-testid":"p0-tab-original",children:tf.step3.tabOriginal}),(0,l.jsx)("button",{type:"button",role:"tab","aria-selected":"result"===ev,className:"tab".concat("result"===ev?" active":""),onClick:()=>{ey("result"),eD(o.XQ.viewResultP0)},disabled:!tx,"data-testid":"p0-tab-result",children:tf.step3.tabResult})]}),(0,l.jsx)("span",{className:"live","data-testid":"p0-status",children:em?o.XQ.processingP0:"png"===eS?o.XQ.exportingPng:"pdf"===eS?o.XQ.exportingPdf:eA})]}),(0,l.jsxs)("div",{children:[(0,l.jsx)(c.R,{enabled:"result"===ev&&tx,zoom:eG.zoom,cellPixels:eG.cellPixels,pan:eG.pan,onZoom:eG.changeZoom,onPan:eG.setPan}
1),"result"===ev&&eN&&!eG.pan&&eh&&eR&&(0,l.jsxs)("p",{className:"help",id:"p0-keyboard-position","data-testid":"p0-keyboard-position",role:"status","aria-live":"polite",children:["Keyboard cell: row ",eR.cy+1," of ",eh.grid.rows,", column ",eR.cx+1," of ",eh.grid.cols,"."]})]}),(0,l.jsxs)("div",{ref:eW,...eG.events,className:"canvas-host".concat("result"===ev?" pattern-viewport":"").concat(eG.pan?" navigation-mode":"").concat(J.dragActive?" dragover":""),"data-testid":"p0-canvas-host",role:"group",tabIndex:0,"aria-label":"Preview and editor. Press Enter or Space to choose an image, or drop one PNG, JPEG, or WebP.","aria-busy":em||"validating"===I.phase,onKeyDown:e=>{if(eG.events.onKeyDown(e),!e.defaultPrevented&&e.target===e.currentTarget&&("Enter"===e.key||" "===e.key)){var t;e.preventDefault(),null==(t=I.inputRef.current)||t.click()}},onDragEnter:J.onDragEnter,onDragOver:J.onDragOver,onDragLeave:J.onDragLeave,onDrop:J.onDrop,children:["original"===ev&&I.source&&(0,l.jsx)("div",{className:"render-box",children:null===I.source.originalPreview?(0,l.jsx)("p",{role:"status",children:"The original preview is unavailable. You can still use this image to build and export a result."}):(0,l.jsx)("canvas",{ref:eO,className:"preview","data-testid":"p0-original-canvas","aria-label":"Original image preview"})}),"result"===ev&&tx&&(0,l.jsxs)("div",{className:"render-box p0-render-box",children:[(0,l.jsx)("canvas",{ref:eL,className:"preview","data-testid":"p0-result-canvas",role:"img","aria-label":tf.step3.previewLabel,"aria-describedby":eN&&!eG.pan?"p0-keyboard-position":void 0,tabIndex:eN?0:-1,style:{width:null==eH?void 0:eH.width,height:null==eH?void 0:eH.height,cursor:eN?"crosshair":"default",touchAction:"none"},onPointerDown:tn,onPointerMove:ta,onPointerUp:ts,onPointerCancel:ts,onKeyDown:ti}),(0,l.jsx)("canvas",{ref:eU,className:"grid-overlay-canvas",style:{left:"50%",top:"50%",width:null!=(F=null==eH?void 0:eH.width)?F:0,height:null!=(Q=null==eH?void 0:eH.height)?Q:0,transform:"translate(-50%, -50%)"},"aria-hidden":"true"})]}),"empty"===I.phase&&!I.source&&!eh&&(0,l.jsx)("div",{className:"overlay",style:{background:"transparent"},children:(0,l.jsxs)("div",{className:"box",children:[(0,l.jsx)("h3",{children:tf.step1.dropTitle}),(0,l.jsx)("p",{children:tf.step1.dropBody})]})}),J.dragActive&&(0,l.jsx)("div",{className:"overlay stage-overlay","data-testid":"p0-stage-drag-active",children:(0,l.jsxs)("div",{className:"box",children:[(0,l.jsx)("h3",{children:I.source?"Drop to replace the current image":"Drop an image here"}),(0,l.jsx)("p",{children:"One PNG, JPEG, or WebP"})]})}),(I.error||eB)&&(0,l.jsx)(v.b,{inputFailure:!!I.error,rejection:null!=(X=I.error)?X:eB?{category:eB}:null,onKeep:I.error&&ef&&eh&&!eB?()=>{I.dismissError(),eD("The current result was kept. You can continue editing or exporting."),requestAnimationFrame(()=>{var e;return null==(e=document.querySelector('[data-testid="p0-export-png"]'))?void 0:e.focus()})}:void 0,onPrimary:()=>{var e,t,r,l,n;if((null==(e=I.error)?void 0:e.category)==="processing_error"){null==(r=I.inputRef.current)||r.click();return}let a=null!=(l=null==(t=I.error)?void 0:t.category)?l:eB;switch(eM(null),a){case"memory_limit":case"browser_unsupported":tm();break;case"processing_error":te("final");break;case"pdf_generation_error":th();break;case"download_blocked":"pdf"===e0.current?th():tp();break;case"export_encoder_error":tp();break;default:null==(n=I.inputRef.current)||n.click()}},onSecondary:()=>{var e,t,r;let l=null!=(t=null==(e=I.error)?void 0:e.category)?t:eB;switch(eM(null),l){case"pdf_generation_error":case"export_encoder_error":tp();break;default:null==(r=I.inputRef.current)||r.click()}}})]}),(0,l.jsx)("div",{className:"statusbar",children:(0,l.jsx)("span",{children:eA})})]})}),(0,l.jsx)(g.U,{tool:"pixel_art",project:tg,onRestore:e=>{var t,r;if("pixel_art"!==e.tool)return;null==(t=eV.current)||t.cancel(),eZ.current++,eJ.current++,L.current=!0,U.current=!0,null!==e1.current&&(clearTimeout(e1.current),e1.current=null),null!==e$.current&&(clearTimeout(e$.current),e$.current=null),e4.current=null,I.reset(),e6(),O.current=e.projectId,er(null!=(r=e.conversionSettings.preprocess)?r:p.hs),es(e.conversionSettings.gridWidth),ei(e.conversionSettings.paletteCount),eu(e.conversionSettings.dithering),ep(e.conversionSettings.background),ee(e.layoutSettings.exportScale);let l=(0,m.s)(e);e2.current=l,eg(l),eb(!0),ex(!1),eE(null),eM(null),e_(0),eP(null),ey("result"),eX.current.clear(),G(e.contentRevision),z(!0),Y(!1),eD("Project restored. Edit or export it; choose a source image only if you want to rebuild.")},autoSave:(null==(r=I.source)?void 0:r.inputSource)!=="example"||U.current,hasWork:!!eh})]}),(0,l.jsx)(y.h,{message:eA})]})}},9030:(e,t,r)=>{"use strict";r.d(t,{b:()=>a});var l=r(5155),n=r(9902);function a(e){var t;let{rejection:r,onPrimary:a,onSecondary:s,onKeep:o,inputFailure:i=!1}=e;if(!r)return null;
1let c=null!=(t=n.Sr[r.category])?t:n.Sr.processing_error,u=i&&"processing_error"===r.category?{...c,body:"The image could not be read on this device. Select it again or try another image.",primary:"Choose image again"}:c;return(0,l.jsx)("div",{className:"overlay input-error-overlay","data-testid":"error-".concat(r.category),children:(0,l.jsxs)("div",{className:"box",role:"alert",children:[(0,l.jsx)("h3",{children:u.heading}),(0,l.jsx)("p",{children:u.body}),(0,l.jsx)("button",{type:"button",className:"btn primary",onClick:()=>a(u),children:u.primary}),u.secondary&&s&&(0,l.jsx)("button",{type:"button",className:"btn secondary",onClick:()=>s(u),children:u.secondary}),o&&(0,l.jsx)("button",{type:"button",className:"btn secondary",onClick:o,children:"Keep current result"})]})})}}},e=>{e.O(0,[619,922,62,616,143,441,255,358],()=>e(e.s=1534)),_N_E=e.O()}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.