https://aslitools.com/_next/static/chunks/68279-51bbe5fd7564ad78.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[53515,68279],{294:(e,t,r)=>{r.d(t,{i:()=>f});var a=r(95155),l=r(12115),n=r(89239),s=r(81477),i=r(6489);let o=["#FFFFFF","#000000","#F43F5E","#EC4899","#A855F7","#6366F1","#3B82F6","#06B6D4","#10B981","#22C55E","#84CC16","#EAB308","#F59E0B","#F97316","#EF4444"],c="advanced-color-picker:recent";function d(e){return Math.min(1,Math.max(0,e))}function u(e,t,r){return Math.min(r,Math.max(t,e))}function h(e){let t=e.trim();if(!t)return null;let r=t.startsWith("#")?t.slice(1):t;if(3===r.length){let e=r[0]??"0",t=r[1]??"0",a=r[2]??"0";return`#${e}${e}${t}${t}${a}${a}`.toUpperCase()}return 6===r.length?/^[0-9a-fA-F]{6}$/.test(r)?`#${r}`.toUpperCase():null:8===r.length&&/^[0-9a-fA-F]{8}$/.test(r)?`#${r.slice(0,6)}`.toUpperCase():null}function m(e){let t=h(e);if(!t)return null;let r=parseInt(t.slice(1),16);return{r:r>>16&255,g:r>>8&255,b:255&r}}function x({r:e,g:t,b:r}){let a=u(Math.round(e),0,255),l=u(Math.round(t),0,255),n=u(Math.round(r),0,255);return`#${(0x1000000+(a<<16)+(l<<8)+n).toString(16).slice(1).toUpperCase()}`}function p({r:e,g:t,b:r}){let a=e/255,l=t/255,n=r/255,s=Math.max(a,l,n),i=s-Math.min(a,l,n),o=0;return 0!==i&&(o=(s===a?(l-n)/i%6:s===l?(n-a)/i+2:(a-l)/i+4)*60)<0&&(o+=360),{h:o,s:0===s?0:i/s,v:s}}function g({h:e,s:t,v:r}){let a=(e%360+360)%360,l=r*t,n=l*(1-Math.abs(a/60%2-1)),s=r-l,i=0,o=0,c=0;return a>=0&&a<60?(i=l,o=n,c=0):a>=60&&a<120?(i=n,o=l,c=0):a>=120&&a<180?(i=0,o=l,c=n):a>=180&&a<240?(i=0,o=n,c=l):a>=240&&a<300?(i=n,o=0,c=l):(i=l,o=0,c=n),{r:(i+s)*255,g:(o+s)*255,b:(c+s)*255}}function f({value:e,onChange:t,disabled:r=!1,className:b,presets:y=o}){let k=(0,l.useMemo)(()=>h(e)??"#000000",[e]),j=(0,l.useMemo)(()=>p(m(k)??{r:0,g:0,b:0}),[k]),[v,w]=(0,l.useState)(!1),[N,M]=(0,l.useState)(j),[C,F]=(0,l.useState)(k),[,A]=(0,l.useState)([]),P=(0,l.useRef)(null),T=(0,l.useRef)(null),S=(0,l.useRef)(null),$=(0,l.useRef)(null),E=(0,l.useRef)(null);(0,l.useEffect)(()=>{M(j)},[j]),(0,l.useEffect)(()=>{F(k)},[k]),(0,l.useEffect)(()=>{A(function(){try{let e=window.localStorage.getItem(c);if(!e)return[];let t=JSON.parse(e);if(!Array.isArray(t))return[];let r=[];for(let e of t){if("string"!=typeof e)continue;let t=h(e);t&&r.push(t)}return r}catch{return[]}}())},[]);let G=(0,l.useMemo)(()=>x(g(N)),[N]),R=(0,l.useCallback)(e=>{r||(E.current&&window.clearTimeout(E.current),E.current=window.setTimeout(()=>{A(t=>{let r=[e,...t.filter(t=>t!==e)].slice(0,10);try{window.localStorage.setItem(c,JSON.stringify(r))}catch{}return r})},250))},[r]),z=(0,l.useCallback)(e=>{let r={h:u(e.h,0,360),s:d(e.s),v:d(e.v)};M(r);let a=x(g(r));t(a),R(a)},[t,R]),H=(0,l.useCallback)(()=>{let e=S.current;if(!e)return;let t=e.getContext("2d");if(!t)return;e.width=240,e.height=160;let r=g({h:N.h,s:1,v:1});t.clearRect(0,0,e.width,e.height),t.fillStyle=x(r),t.fillRect(0,0,e.width,e.height);let a=t.createLinearGradient(0,0,e.width,0);a.addColorStop(0,x({r:255,g:255,b:255})),a.addColorStop(1,x(r)),t.fillStyle=a,t.fillRect(0,0,e.width,e.height);let l=t.createLinearGradient(0,0,0,e.height);l.addColorStop(0,"rgba(0,0,0,0)"),l.addColorStop(1,"rgba(0,0,0,1)"),t.fillStyle=l,t.fillRect(0,0,e.width,e.height)},[N.h]);(0,l.useEffect)(()=>{H()},[H]),(0,l.useEffect)(()=>{if(!v)return;let e=e=>{let t=e.target;t instanceof Node&&P.current?.contains(t)||w(!1)};return window.addEventListener("pointerdown",e),()=>window.removeEventListener("pointerdown",e)},[v]);let I=(0,l.useCallback)((e,t)=>{let r=S.current;if(!r)return;let a=r.getBoundingClientRect(),l=u((e-a.left)/a.width,0,1),n=u((t-a.top)/a.height,0,1);z({h:N.h,s:l,v:1-n})},[N.h,z]),B=(0,l.useCallback)(e=>{r||(e.currentTarget.setPointerCapture(e.pointerId),I(e.clientX,e.clientY))},[r,I]),J=(0,l.useCallback)(e=>{r||e.buttons&&I(e.clientX,e.clientY)},[r,I]),D=(0,l.useMemo)(()=>({x:240*N.s,y:(1-N.v)*160}),[N.s,N.v]),L=(0,l.useCallback)(()=>{let e=h(C);if(!e)return;F(e);let t=m(e);t&&z(p(t))},[C,z]),V=(0,l.useCallback)(e=>{F(e);let t=h(e);if(!t)return;let r=m(t);r&&z(p(r))},[z]),q=(0,l.useMemo)(()=>{let e=N.h%360/360;return`${100*d(e)}%`},[N.h]),U=(0,l.useCallback)(e=>{if(r)return;let t=$.current;if(!t)return;let a=t.getBoundingClientRect();z({h:360*u((e-a.left)/a.width,0,1),s:N.s,v:N.v})},[r,N.s,N.v,z]),_=(0,l.useCallback)(e=>{e.currentTarget.setPointerCapture(e.pointerId),U(e.clientX)},[U]),X=(0,l.useCallback)(e=>{r||e.buttons&&U(e.clientX)},[r,U]);return(0,a.jsxs)("div",{ref:P,className:`relative ${b||""} w-full`,children:[(0,a.jsxs)("div",{className:"flex items-center gap-2 h-10 w-full rounded-md border border-border bg-background px-2.5 shadow-sm focus-within:ring-2 focus-within:ring-ring/50",children:[(0,a.jsx)("button",{type:"button",className:"h-8 w-10 rounded border border-border bg-background p-0.5 shadow-sm hover:shadow-md flex items-center justify-center shrink-0","aria-label":"Pick color",disabled:r,onClick:()=>w(e=>!e),children:(0,a.jsx)("span",{className:"block h-full w-full bg-cover rounded",style:{backgroundColor:G}})}),(0,a.jsx)("input",{type:"text",inputMode:"text",value:C,onChange:e=>V(e.target.value),onBlur:()=>L(),disabled:r,className:"flex-1 h-10 bg-transparent border-0 px-1 text-sm font-mono outline-none","aria-label":"Hex color"}),(0,a.jsx)(n.$,{type:"button",variant:"ghost",size:"icon",className:"h-9 w-9 rounded-md",onClick:()=>w(e=>!e),disabled:r,"aria-label":"Open color picker",children:(0,a.jsx)(i.A,{className:"w-4 h-4"})})]}),v&&!r&&(0,a.jsxs)(s.Zp,{ref:T,className:"absolute z-50 mt-2 w-[320px] p-4",children:[(0,a.jsxs)("div",{className:"space-y-3",children:[(0,a.jsxs)("div",{className:"relative",children:[(0,a.jsx)("canvas",{ref:S,className:"rounded-md border border-border bg-background cursor-crosshair w-full",width:240,height:160,onPointerDown:B,onPointerMove:J,"aria-label":"Saturation and value"}),(0,a.jsx)("div",{className:"pointer-events-none absolute",style:{left:`${D.x}px`,top:`${D.y}px`,transform:"translate(-50%, -50%)"}

1,children:(0,a.jsx)("div",{className:"h-4 w-4 rounded-full border border-background shadow",style:{backgroundColor:G}})})]}),(0,a.jsxs)("div",{className:"relative",children:[(0,a.jsx)("div",{ref:$,role:"slider","aria-label":"Color hue","aria-valuemin":0,"aria-valuemax":360,"aria-valuenow":Math.round(N.h),tabIndex:0,onPointerDown:_,onPointerMove:X,className:"h-4 w-full rounded-md border border-border cursor-pointer",style:{backgroundImage:"linear-gradient(90deg, #FF0000 0%, #FFFF00 17%, #00FF00 33%, #00FFFF 50%, #0000FF 67%, #FF00FF 83%, #FF0000 100%)"}}),(0,a.jsx)("div",{className:"pointer-events-none absolute top-1/2 -translate-y-1/2",style:{left:q,width:"2px",height:"16px"},children:(0,a.jsx)("div",{className:"h-full w-full rounded-full bg-background border border-border shadow-sm"})})]})]}),(0,a.jsx)("div",{className:"mt-4 space-y-3",children:(0,a.jsxs)("div",{children:[(0,a.jsx)("div",{className:"text-xs text-muted-foreground mb-2",children:"Presets"}),(0,a.jsx)("div",{className:"grid grid-cols-7 gap-2",children:y.slice(0,14).map(e=>{let t=h(e)??e;return(0,a.jsx)("button",{type:"button",className:"h-6 w-6 rounded border border-border hover:border-primary",style:{backgroundColor:t},onClick:()=>{let e=m(t);e&&z(p(e))},"aria-label":`Preset ${t}`},e)})})]})})]})]})}},6489:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("palette",[["path",{d:"M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z",key:"e79jfc"}],["circle",{cx:"13.5",cy:"6.5",r:".5",fill:"currentColor",key:"1okk4w"}],["circle",{cx:"17.5",cy:"10.5",r:".5",fill:"currentColor",key:"f64h9f"}],["circle",{cx:"6.5",cy:"12.5",r:".5",fill:"currentColor",key:"qy21gx"}],["circle",{cx:"8.5",cy:"7.5",r:".5",fill:"currentColor",key:"fotxhn"}]])},7019:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("layout-list",[["rect",{width:"7",height:"7",x:"3",y:"3",rx:"1",key:"1g98yp"}],["rect",{width:"7",height:"7",x:"3",y:"14",rx:"1",key:"1bb6yr"}],["path",{d:"M14 4h7",key:"3xa0d5"}],["path",{d:"M14 9h7",key:"1icrd9"}],["path",{d:"M14 15h7",key:"1mj8o2"}],["path",{d:"M14 20h7",key:"11slyb"}]])},9199:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("rotate-ccw",[["path",{d:"M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8",key:"1357e3"}],["path",{d:"M3 3v5h5",key:"1xhq8a"}]])},12137:(e,t,r)=>{r.r(t),r.d(t,{JpgToPngTransparentTool:()=>h});var a=r(95155),l=r(83899),n=r(63054),s=r(12115),i=r(21975),o=r(83952),c=r(47910),d=r(294),u=r(60753);function h({onViewChange:e}={}){let t=(0,o.c)(),[r,m]=(0,s.useState)("landing"),[x,p]=(0,s.use

1State)("#FFFFFF"),[g,f]=(0,s.useState)(15),b=(0,s.useCallback)(async(e,t)=>{let r=[];for(let a=0;a<e.length;a+=1){let l=e[a],n=await function(e,t,r){let a,l,n=(l=parseInt(a=t.replace(/^#/,""),16),6===a.length?{r:l>>16&255,g:l>>8&255,b:255&l}:{r:255,g:255,b:255}),s=Math.max(0,Math.min(255,Math.round(r/100*255)));return new Promise((t,r)=>{let a=new FileReader;a.onload=e=>{let a=new Image;a.onload=()=>{let e=document.createElement("canvas");e.width=a.width,e.height=a.height;let l=e.getContext("2d");if(!l)return void r(Error("Could not get canvas context"));l.drawImage(a,0,0);let i=l.getImageData(0,0,e.width,e.height),o=i.data;for(let e=0;e<o.length;e+=4){let t=o[e],r=o[e+1],a=o[e+2],l=Math.abs(t-n.r),i=Math.abs(r-n.g),c=Math.abs(a-n.b);l<=s&&i<=s&&c<=s&&(o[e+3]=0)}l.putImageData(i,0,0),e.toBlob(e=>{e?t(e):r(Error("Conversion failed"))},"image/png")},a.onerror=()=>r(Error("Failed to load image")),a.src=e.target?.result},a.onerror=()=>r(Error("Failed to read file")),a.readAsDataURL(e)})}(l,x,g),s=l.name.replace(/\.[^/.]+$/,"");r.push({id:`r-${a}-${Date.now()}`,fileName:`${s}.png`,blob:n,size:n.size}),t?.onProgress?.(100*(a+1)/e.length)}return r},[x,g]),y=t.jpgToPngTransparent??{};y.seoContent;let k=y.title??"JPG to PNG Transparent",j={title:y.title??"Convert JPG to Transparent PNG",description:y.description??"Remove a background color from JPG images and convert to transparent PNG.",subtitle:y.subtitle??"Free JPG to transparent PNG converter. Remove backgrounds instantly.",badge:y.badge??"JPG to PNG Transparent",icon:i.A,accept:"image/jpeg,image/jpg,.jpg,.jpeg",maxFiles:n.kH,maxFileSizeBytes:n.fR,supportedFormatsLabel:y.supportedFormats??`Max ${n.kH} files • Max file size: 50MB • Supported: .jpg, .jpeg`},v={selectFiles:y.selectFiles??"Select JPG files",dragDropHint:y.dragDropHint??"Drag & drop JPG images here or click to browse",selectedFilesTitle:y.selectedFilesTitle??"Selected Files",addFiles:y.addFiles??"Add more files",convertButton:y.convert??"Convert to Transparent PNG",processingTitle:y.processingTitle??"Converting JPG to transparent PNG",processingStatus:y.processingStatus??"Processing your images...",cancelProcessing:y.cancelProcessing??"Cancel Processing",processingComplete:y.processingComplete??"Conversion complete!",yourFileReady:y.yourFileReady??"Your transparent PNG is ready for download",yourFilesReady:y.yourFilesReady??"Your transparent PNGs are ready for download",download:y.download??"Download",processMoreFiles:y.processMoreFiles??"Convert more images",clearAll:y.clearAll??"Clear all",settingsTitle:y.settingsTitle??"Conversion Settings"},w=(0,a.jsxs)("div",{className:"space-y-5",children:[(0,a.jsx)(u.fN,{title:"Transparent color",children:(0,a.jsxs)("div",{children:[(0,a.jsx)("label",{className:"text-sm font-medium block mb-2",children:"Make this color transparent"}),(0,a.jsx)(d.i,{value:x,onChange:p,className:"w-full"}),(0,a.jsx)("p",{className:"text-xs text-muted-foreground mt-1",children:"Pixels matching this color (within tolerance) become transparent."})]})}),(0,a.jsx)(u.fN,{title:"Tolerance",children:(0,a.jsx)(u.mA,{label:"Tolerance (%)",value:g,onChange:e=>f(Math.round(e)),min:0,max:100,step:5})})]});return(0,a.jsxs)("div",{className:"flex-1 flex flex-col min-h-0 bg-background",children:[(0,a.jsx)(c.B,{config:j,labels:v,settingsPanel:w,onConvert:b,toolName:k,toolPath:"/tools/jpg-to-png-transparent",onViewChange:t=>{m(t),e?.(t)}}),"landing"===r&&t.jpgToPngTransparent?.seoContent&&(0,a.jsx)(l.u,{seoContent:t.jpgToPngTransparent.seoContent,faq:t.jpgToPngTransparent.faq,mainHeadingLevel:"h2"})]})}},12651:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("circle-check",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"m9 12 2 2 4-4",key:"dzmm74"}]])},16869:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("text-align-center",[["path",{d:"M21 5H3",key:"1fi0y6"}],["path",{d:"M17 12H7",key:"16if0g"}],["path",{d:"M19 19H5",key:"vjpgq2"}]])},22651:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("zoom-in",[["circle",{cx:"11",cy:"11",r:"8",key:"4ej97u"}],["line",{x1:"21",x2:"16.65",y1:"21",y2:"16.65",key:"13gj7c"}],["line",{x1:"11",x2:"11",y1:"8",y2:"14",key:"1vmskp"}],["line",{x1:"8",x2:"14",y1:"11",y2:"11",key:"durymu"}]])},32211:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("arrow-down-a-z",[["path",{d:"m3 16 4 4 4-4",key:"1co6wj"}

1],["path",{d:"M7 20V4",key:"1yoxec"}],["path",{d:"M20 8h-5",key:"1vsyxs"}],["path",{d:"M15 10V6.5a2.5 2.5 0 0 1 5 0V10",key:"ag13bf"}],["path",{d:"M15 14h5l-5 6h5",key:"ur5jdg"}]])},35269:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("circle-arrow-right",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"m12 16 4-4-4-4",key:"1i9zcv"}],["path",{d:"M8 12h8",key:"1wcyev"}]])},41933:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("text-align-end",[["path",{d:"M21 5H3",key:"1fi0y6"}],["path",{d:"M21 12H9",key:"dn1m92"}],["path",{d:"M21 19H7",key:"4cu937"}]])},45916:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("text-align-start",[["path",{d:"M21 5H3",key:"1fi0y6"}],["path",{d:"M15 12H3",key:"6jk70r"}],["path",{d:"M17 19H3",key:"z6ezky"}]])},48368:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("file-text",[["path",{d:"M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z",key:"1oefj6"}],["path",{d:"M14 2v5a1 1 0 0 0 1 1h5",key:"wfsgrz"}],["path",{d:"M10 9H8",key:"b1mrlr"}],["path",{d:"M16 13H8",key:"t4e002"}],["path",{d:"M16 17H8",key:"z1uh3a"}]])},48484:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("text-align-justify",[["path",{d:"M3 5h18",key:"1u36vt"}],["path",{d:"M3 12h18",key:"1i2n21"}],["path",{d:"M3 19h18",key:"awlh7x"}]])},51914:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("plus",[["path",{d:"M5 12h14",key:"1ays0h"}],["path",{d:"M12 5v14",key:"s699le"}]])},59883:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("grip-vertical",[["circle",{cx:"9",cy:"12",r:"1",key:"1vctgf"}],["circle",{cx:"9",cy:"5",r:"1",key:"hp0tcf"}],["circle",{cx:"9",cy:"19",r:"1",key:"fkjjf6"}],["circle",{cx:"15",cy:"12",r:"1",key:"1tmaij"}],["circle",{cx:"15",cy:"5",r:"1",key:"19l28e"}],["circle",{cx:"15",cy:"19",r:"1",key:"f4zoj3"}]])},60753:(e,t,r)=>{r.d(t,{NL:()=>g,T_:()=>m,fN:()=>h,jK:()=>p,mA:()=>x,ox:()=>y,vP:()=>f,wG:()=>u});var a=r(95155),l=r(89239),n=r(70872),s=r(94961),i=r(45916),o=r(16869),c=r(41933),d=r(48484);function u({label:e,tooltip:t,icon:r,className:l="flex items-center gap-2 mb-2",labelClassName:i="text-sm font-medium text-foreground"}){return(0,a.jsxs)("div",{className:l,children:[r?(0,a.jsx)(r,{className:"w-4 h-4 text-primary shrink-0","aria-hidden":!0}):null,(0,a.jsx)("label",{className:i,children:e}),t?(0,a.jsx)(n.m,{content:t,children:(0,a.jsx)(s.A,{className:"w-4 h-4 text-muted-foreground cursor-help shrink-0"})}):null]})}function h({title:e,children:t,icon:r,tooltip:l}){return(0,a.jsxs)("div",{className:"border-t border-border/60 pt-4 first:border-t-0 first:pt-0",children:[(0,a.jsxs)("div",{className:"flex items-center gap-2 mb-3",children:[r?(0,a.jsx)(r,{className:"w-4 h-4 text-primary shrink-0","aria-hidden":!0}):null,(0,a.jsx)("h4",{className:"text-sm font-bold text-foreground",children:e}),l?(0,a.jsx)(n.m,{content:l,children:(0,a.jsx)(s.A,{className:"w-4 h-4 text-muted-foreground cursor-help shrink-0"})}):null]}),(0,a.jsx)("div",{className:"space-y-3",children:t})]})}function m({label:e,checked:t,onChange:r,description:l,tooltip:i,icon:o,disabled:c=!1}){return(0,a.jsxs)("div",{className:`flex items-center justify-between gap-3 py-0.5 ${c?"opacity-50":""}`,children:[(0,a.jsxs)("div",{className:"flex-1 min-w-0",children:[(0,a.jsxs)("div",{className:"flex items-center gap-2",children:[o?(0,a.jsx)(o,{className:"w-4 h-4 text-primary shrink-0","aria-hidden":!0}):null,(0,a.jsx)("span",{className:"text-sm font-semibold text-foreground",children:e}),i?(0,a.jsx)(n.m,{content:i,children:(0,a.jsx)(s.A,{className:"w-4 h-4 text-muted-foreground cursor-help shrink-0"})}):null]}),l&&(0,a.jsx)("p",{className:"text-xs text-muted-foreground mt-0.5",children:l})]}),(0,a.jsx)("button",{type:"button",disabled:c,onClick:()=>r(!t),className:`relative inline-flex h-6 w-10 shrink-0 items-center rounded-full border ${t?"bg-primary border-primary":"bg-muted border-border"}`,children:(0,a.jsx)("span",{className:`inline-block h-4 w-4 transform rounded-full bg-background shadow ${t?"translate-x-5":"translate-x-1"}`})})]})}function x({label:e,value:t,onChange:r,min:l,max:i,step:o=1,unit:c,helperTextLeft:d,helperTextRight:u,tooltip:h,icon:m}){let p=c?`${t}${c}`:t.toString(),g=e=>Number.isNaN(e)?t:Math.min(i,Math.max(l,e));return(0,a.jsxs)("div",{children:[(0,a.jsxs)("div",{className:"flex items-center justify-between mb-2",children:[(0,a.jsxs)("div",{className:"flex items-center gap-2 min-w-0",children:[m?(0,a.jsx)(m,{className:"w-4 h-4 text-primary shrink-0","aria-hidden":!0}):null,(0,a.jsx)("span",{className:"text-sm font-medium",children:e}),h?(0,a.jsx)(n.m,{content:h,children:(0,a.jsx)(s.A,{className:"w-4 h-4 text-muted-foreground cursor-help shrink-0"})}):null]}),(0,a.jsxs)("div",{className:"flex items-center gap-2 text-xs text-muted-foreground",children:[(0,a.jsx)("button",{type:"button",onClick:()=>

1{r(g(t-o))},className:"h-6 w-6 flex items-center justify-center rounded-md border border-border bg-background hover:bg-muted text-xs",children:"−"}),(0,a.jsx)("span",{className:"min-w-12 text-center font-medium",children:p}),(0,a.jsx)("button",{type:"button",onClick:()=>{r(g(t+o))},className:"h-6 w-6 flex items-center justify-center rounded-md border border-border bg-background hover:bg-muted text-xs",children:"+"})]})]}),(0,a.jsx)("input",{type:"range",min:l,max:i,step:o,value:t,onChange:e=>r(g(Number(e.target.value))),className:"w-full accent-primary"}),(d||u)&&(0,a.jsxs)("div",{className:"flex justify-between text-xs text-muted-foreground mt-1",children:[(0,a.jsx)("span",{children:d}),(0,a.jsx)("span",{children:u})]})]})}function p({label:e,value:t,onChange:r,min:l,max:i,suffix:o,tooltip:c,icon:d}){return(0,a.jsxs)("div",{children:[(0,a.jsxs)("div",{className:"flex items-center justify-between mb-1",children:[(0,a.jsxs)("div",{className:"flex items-center gap-2 min-w-0",children:[d?(0,a.jsx)(d,{className:"w-4 h-4 text-primary shrink-0","aria-hidden":!0}):null,(0,a.jsx)("span",{className:"text-sm font-medium",children:e}),c?(0,a.jsx)(n.m,{content:c,children:(0,a.jsx)(s.A,{className:"w-4 h-4 text-muted-foreground cursor-help shrink-0"})}):null]}),o&&(0,a.jsx)("span",{className:"text-xs text-muted-foreground",children:o})]}),(0,a.jsx)("input",{type:"number",value:Number.isNaN(t)?"":t,onChange:e=>{var a;return r(Number.isNaN(a=Number(e.target.value))?t:("number"==typeof l&&(a=Math.max(l,a)),"number"==typeof i&&(a=Math.min(i,a)),a))},className:"w-full rounded-md border border-border bg-background px-3 py-2 text-sm",min:l,max:i})]})}function g({label:e,value:t,onChange:r,placeholder:l,helperText:n,tooltip:s,icon:i}){return(0,a.jsxs)("div",{children:[(0,a.jsx)(u,{label:e,tooltip:s,icon:i}),(0,a.jsx)("input",{type:"text",value:t,onChange:e=>r(e.target.value),placeholder:l,className:"w-full rounded-md border border-border bg-background px-2 py-1.5 text-sm"}),n&&(0,a.jsx)("p",{className:"text-xs text-muted-foreground mt-1",children:n})]})}function f({title:e,children:t}){return(0,a.jsxs)("div",{className:"space-y-2 text-sm text-muted-foreground",children:[e&&(0,a.jsx)("p",{className:"font-medium text-foreground",children:e}),t]})}let b=[{value:"left",label:"Align left",Icon:i.A},{value:"center",label:"Align center",Icon:o.A},{value:"right",label:"Align right",Icon:c.A},{value:"justify",label:"Justify",Icon:d.A}];function y({value:e,onChange:t,className:r="grid grid-cols-4 gap-2"}){return(0,a.jsx)("div",{className:r,role:"group","aria-label":"Text alignment",children:b.map(({value:r,label:s,Icon:i})=>{let o=e===r;return(0,a.jsx)(n.m,{content:s,children:(0,a.jsx)(l.$,{type:"button",variant:o?"default":"outline",size:"sm",onClick:()=>t(r),className:"w-full px-0","aria-label":s,"aria-pressed":o,children:(0,a.jsx)(i,{className:"h-4 w-4","aria-hidden":!0})})},r)})})}},67635:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("copy",[["rect",{width:"14",height:"14",x:"8",y:"8",rx:"2",ry:"2",key:"17jyea"}],["path",{d:"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2",key:"zix9uf"}]])},68459:(e,t,r)=>{r.d(t,{A:()=>a});let a=(0,r(78340).A)("trash-2",[["path",{d:"M10 11v6",key:"nco0om"}],["path",{d:"M14 11v6",key:"outv1u"}],["path",{d:"M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6",key:"miytrc"}],["path",{d:"M3 6h18",key:"d0wm0j"}],["path",{d:"M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2",key:"e791ji"}]])}}]);