1import"./CzWYS0ow.js";import{p as me,A as t,B as i,g as e,C as r,t as f,D as Y,a as m,K as Z,G as b,F as ge,b as fe,u as s,c as be,f as pe,e as p,Q as xe,L as he}from"./OXJHxFgF.js";import{i as O}from"./B4Eafymj.js";import{r as _,e as $,i as ee,a as P,b as _e,s as v}from"./DWUm8jVP.js";import{b as D,a as ae}from"./Jt-egNG3.js";var we=p("<img/>"),ye=p("<source/>"),ke=p("<picture><!> <img/></picture>"),Ce=p('<figcaption class="text-sm text-slate-500 mt-2 text-center"> </figcaption>'),Se=p("<option> </option>"),je=p('<div class="space-y-4"><div class="border border-gray-200 p-4 rounded-lg"><h3 class="text-lg font-medium mb-2">Preview</h3> <div class="flex justify-center"><figure><!> <!></figure></div></div> <div class="space-y-4"><div><label for="image-src" class="block text-sm font-medium text-gray-700 mb-1">Image Source URL</label> <input id="image-src" type="url" class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-green-500 focus:border-green-500" placeholder="https://example.com/image.jpg" required=""/></div> <div><label for="image-alt" class="block text-sm font-medium text-gray-700 mb-1">Alt Text (Required for Accessibility)</label> <input id="image-alt" type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-green-500 focus:border-green-500" placeholder="Description of the image" required=""/></div> <div><label for="image-caption" class="block text-sm font-medium text-gray-700 mb-1">Caption (Optional)</label> <input id="image-caption" type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-green-500 focus:border-green-500" placeholder="Image caption"/></div> <div class="grid grid-cols-1 md:grid-cols-2 gap-4"><div><label for="width" class="block text-sm font-medium text-gray-700 mb-1">Width</label> <select class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-green-500 focus:border-green-500"></select></div> <div class="flex items-center"><input id="rounded" type="checkbox" class="h-4 w-4 text-green-600 focus:ring-green-500 border-gray-300 rounded"/> <label for="rounded" class="ml-2 block text-sm text-gray-900">Rounded Corners</label></div> <div class="flex items-center"><input id="shadow" type="checkbox" class="h-4 w-4 text-green-600 focus:ring-green-500 border-gray-300 rounded"/> <label for="shadow" class="ml-2 block text-sm text-gray-900">Shadow Effect</label></div></div> <div class="pt-4"><button class="px-4 py-2 bg-green-600 hover:bg-green-700 text-white font-medium rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500">Save Changes</button></div></div></div>');function We(re,d){me(d,!0);let c=s(()=>d.src),x=s(()=>d.alt),h=s(()=>d.caption),w=s(()=>d.width),y=s(()=>d.rounded),k=s(()=>d.shadow);const te=[{value:"w-48",label:"Small (192px)"},{value:"w-64",label:"Medium (256px)"},{value:"w-96",label:"Large (384px)"},{value:"w-full",label:"Full Width"},{value:"max-w-sm",label:"Max Small"},{value:"max-w-md",label:"Max Medium"},{value:"max-w-lg",label:"Max Large"}];function le(){d.onUpdate&&d.onUpdate({src:e(c),alt:e(x),caption:e(h),width:e(w),rounded:e(y),shadow:e(k)})}let ie=s(()=>e(w)||"w-96"),E=s(()=>e(y)?"rounded-lg":""),F=s(()=>e(k)?"shadow-lg":"");var C=je(),S=t(C),B=i(t(S),2),j=t(B),G=t(j);{var oe=a=>{var l=be(),o=pe(l);{var n=u=>{var g=we();f(()=>{v(g,"src",e(c)),v(g,"alt",e(x)||"Preview"),P(g,1,`w-full h-auto object-cover ${e(E)} ${e(F)}`)}),m(u,g)};O(o,u=>{u(n,-1)})}m(a,l)},se=a=>{var l=ke(),o=t(l);$(o,17,()=>Object.entries(e(c).sources),ee,(u,g)=>{var X=s(()=>xe(e(g),2));let ue=()=>e(X)[0],ve=()=>e(X)[1];var I=ye();f(()=>{v(I,"srcset",ve()),v(I,"type","image/"+ue())}),m(u,I)});var n=i(o,2);r(l),f(()=>{v(n,"src",e(c).img.src),v(n,"alt",e(x)||"Preview"),P(n,1,`w-full h-auto object-cover ${e(E)} ${e(F)}`),v(n,"width",e(c).img.w),v(n,"height",e(c).img.h)}),m(a,l)};O(G,a=>{typeof e(c)=="string"?a(oe):a(se,-1)})}var de=i(G,2);{var ce=a=>{var l=Ce(),o=t(l,!0);r(l),f(()=>Y(o,e(h))),m(a,l)};O(de,a=>{e(h)&&a(ce)})}r(j),r(B),r(S);var K=i(S,2),M=t(K),Q=i(t(M),2);_(Q),r(M);var R=i(M,2),T=i(t(R),2);_(T),r(R);var A=i(R,2),z=i(t(A),2);_(z),r(A);var L=i(A,2),U=t(L),W=i(t(U),2);$(W,21,()=>te,ee,(a,l)=>{var o=Se(),n=t(o,!0);r(o);var u={};f(()=>{Y(n,e(l).label),u!==(u=e(l).value)&&(o.value=(o.__value=e(l).value)??"")}),m(a,o)}),r(W),r(U);var q=i(U,2),H=t(q);_(H),Z(2),r(q);var J=i(q,2),N=t(J);_(N),Z(2),r(J),r(L);var V=i(L,2),ne=t(V);r(V),r(K),r(C),f(()=>P(j,1,`mx-auto ${e(ie)}`)),D(Q,()=>e(c),a=>b(c,a)),D(T,()=>e(x),a=>b(x,a)),D(z,()=>e(h),a=>b(h,a)),_e(W,()=>e(w),a=>b(w,a)),ae(H,()=>e(y),a=>b(y,a)),ae(N,()=>e(k),a=>b(k,a)),ge("click",ne,le),m(re,C),fe()}he(["click"]);export{We as default}; 2//# sourceMappingURL=C4vDHiAP.js.map
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.