import{a as C,g as H,i as L,A as M,r as T,aq as B,j as e,_ as c,h as r,M as P,aF as z,aV as D,f as p,bD as x,b5 as K,m as $}from"./main-343.js";import{F as g}from"./bf-838-284.js";import{e as U}from"./bf-649-79.js";import{F as k,A as E,b as R}from"./bf-622-233.js";import{A as F}from"./bf-772-285.js";import{F as h,I as W}from"./bf-505-323.js";import{S as N}from"./bf-711-253.js";import"./bf-697-110.js";import"./bf-90-70.js";import"./bf-594-113.js";import"./bf-983-247.js";import"./bf-810-248.js";import"./bf-603-251.js";import"./bf-453-86.js";import"./bf-190-88.js";import"./bf-914-249.js";import"./bf-870-250.js";import"./bf-411-252.js";import"./bf-901-254.js";import"./bf-656-255.js";import"./bf-806-256.js";import"./bf-519-87.js";import"./bf-318-257.js";import"./bf-437-78.js";import"./bf-689-322.js";import"./bf-123-272.js";import"./bf-209-80.js";import"./bf-529-105.js";import"./bf-730-282.js";import"./bf-623-283.js";function $e(){var j;const{css:a}=C(),{fieldKey:s}=H(),[d,b]=L(z),t=M(d[s]),[y,u]=T.useState(!1),A=t.alt||"",I=B(D),S=n=>{const{value:i}=n.target;i===""?delete t.alt:t.alt=i.replace(/\\\\/g,"$_bf_$");const l=p(d,o=>{o[s]=t});b(l),x({event:`Field alt Change ${t.alt||s}`,type:"field_alt_change",state:{fields:l,fldKey:s}})},w=n=>{const{value:i}=n.target;i===""?delete t.bg_img:t.bg_img=i.replace(/\\\\/g,"$_bf_$");const l=p(d,o=>{o[s]=t});b(l),x({event:`Field Image Change ${t.bg_img||s}`,type:"field_img_change",state:{fields:l,fldKey:s}})},f=n=>{const{name:i,value:l}=n.target;t[i]=Number(l);const o=p(d,m=>{m[s]=t});b(o);const v=m=>`fields->${s}->classes->.${s}-fld-wrp->${m}`;x({event:`Field ${i} Change ${t.lbl||s}`,type:`field_${i}_change`,state:{fields:o,fldKey:s}}),K(),I(m=>p(m,_=>{$(_,v(i),`${Number(l)}px`),i==="height"&&$(_,v("max-height"),`${Number(l)}px`)}))};return e.jsxs("div",{children:[e.jsx(k,{title:"Field Settings",subtitle:t.typ,fieldKey:s}),e.jsx(E,{}),e.jsx(h,{}),e.jsx(R,{}),e.jsx(h,{}),e.jsxs(N,{id:"nam-stng",title:c("Background Image"),className:a(g.fieldSection),children:[e.jsx("div",{className:a(r.flxc,{jc:"end"}),children:e.jsx(U,{msg:"Change",children:e.jsx("button",{"data-testid":"img-edt-btn",type:"button",onClick:()=>u(!0),className:a(q.browseBtn),children:"Browse"})})}),e.jsx("div",{className:a({w:"97%",mx:5}),children:e.jsx(F,{id:"fld-lbl-stng",ariaLabel:"Label input",changeAction:w,value:(j=t.bg_img)==null?void 0:j.replace(/\$_bf_\$/g,"\\"),placeholder:"e.g: https://ps.w.org/bit-form/assets/icon-256x256.png?rev=2376144"})}),e.jsxs("div",{className:a(r.flxcb,r.ml1),children:[e.jsx("label",{htmlFor:"alt",className:a(r.mr1),children:c("Width")}),e.jsx("input",{type:"number",name:"width","data-testid":"img-width","aria-label":"Image Width",placeholder:"auto",className:a(g.input,r.w4),value:t.width,onChange:f})]}),e.jsxs("div",{className:a(r.flxcb,r.ml1),children:[e.jsx("label",{htmlFor:"alt",className:a(r.mr1),children:c("Height")}),e.jsx("input",{type:"number",name:"height","data-testid":"img-height","aria-label":"Image Height",placeholder:"auto",className:a(g.input,r.w4),value:t.height,onChange:f})]})]}),e.jsx(h,{}),e.jsx(N,{id:"nam-stng",title:c("Image Alt Text"),className:a(g.fieldSection),children:e.jsx("div",{children:e.jsx("div",{className:a({w:"97%",mx:5}),children:e.jsx(F,{id:"fld-lbl-stng",ariaLabel:"Label input",changeAction:S,value:A.replace(/\$_bf_\$/g,"\\"),placeholder:"Alternative Text"})})})}),e.jsx(h,{}),e.jsxs(P,{md:!0,autoHeight:!0,show:y,setModal:u,className:"o-v",title:"Image",children:[e.jsx("div",{className:"pos-rel"}),e.jsx(W,{iconType:"bg_img",selected:"Upload Image",uploadLbl:"Upload Image",setModal:u,unsplash:!0})]})]})}const q={browseBtn:{b:"none",bd:"none",p:"5px 10px",tn:"all ease-in-out 0.2s","&:hover":{bd:"var(--b-79-96)",cr:"var(--b-50)",brs:"8px"}}};export{$e as default};
