| 1 |
import{a as S,g as C,i as H,aH as B,aq as M,aX as L,r as T,z,j as e,_ as m,h as n,M as P,f as g,bG as b,ba as U,m as _}from"./main-294.js";import{F as p}from"./bf-821-385.js";import{A as $}from"./bf-446-382.js";import{F as k,I as D}from"./bf-766-384.js";import{S as N}from"./bf-908-241.js";import{e as E}from"./bf-176-80.js";import"./bf-934-246.js";import"./bf-22-244.js";import"./bf-764-245.js";import"./bf-5-86.js";import"./bf-487-72.js";import"./bf-867-113.js";function te(){var f;const{css:s}=S(),{fieldKey:a}=C(),[c,h]=H(B),F=M(L),[y,u]=T.useState(!1);if(!a)return null;const t=z(c[a]),I=t.alt||"",w=d=>{const{value:l}=d.target;l===""?delete t.alt:t.alt=l.replace(/\\\\/g,"$_bf_$");const i=g(c,r=>{r[a]=t});h(i),b({event:`Field alt Change ${t.alt||a}`,type:"field_alt_change",state:{fields:i,fldKey:a}})},A=d=>{const{value:l}=d.target;l===""?delete t.bg_img:t.bg_img=l.replace(/\\\\/g,"$_bf_$");const i=g(c,r=>{r[a]=t});h(i),b({event:`Field Image Change ${t.bg_img||a}`,type:"field_img_change",state:{fields:i,fldKey:a}})},x=d=>{const{name:l,value:i}=d.target;t[l]=Number(i);const r=g(c,o=>{o[a]=t});h(r);const j=o=>`fields->${a}->classes->.${a}-fld-wrp->${o}`;b({event:`Field ${l} Change ${t.lbl||a}`,type:`field_${l}_change`,state:{fields:r,fldKey:a}}),U(),F(o=>g(o,v=>{_(v,j(l),`${Number(i)}px`),l==="height"&&_(v,j("max-height"),`${Number(i)}px`)}))};return e.jsxs(e.Fragment,{children:[e.jsxs(N,{id:"nam-stng",title:m("Background Image"),className:s(p.fieldSection),children:[e.jsx("div",{className:s(n.flxc,{jc:"end"}),children:e.jsx(E,{msg:"Change",children:e.jsx("button",{"data-testid":"img-edt-btn",type:"button",onClick:()=>u(!0),className:s(K.browseBtn),children:"Browse"})})}),e.jsx("div",{className:s({w:"97%",mx:5}),children:e.jsx($,{id:"fld-lbl-stng",ariaLabel:"Label input",changeAction:A,value:(f=t.bg_img)==null?void 0:f.replace(/\$_bf_\$/g,"\\"),placeholder:"e.g: https://ps.w.org/bit-form/assets/icon-256x256.png?rev=2376144"})}),e.jsxs("div",{className:s(n.flxcb,n.ml1),children:[e.jsx("label",{htmlFor:"alt",className:s(n.mr1),children:m("Width")}),e.jsx("input",{type:"number",name:"width","data-testid":"img-width","aria-label":"Image Width",placeholder:"auto",className:s(p.input,n.w4),value:t.width,onChange:x})]}),e.jsxs("div",{className:s(n.flxcb,n.ml1),children:[e.jsx("label",{htmlFor:"alt",className:s(n.mr1),children:m("Height")}),e.jsx("input",{type:"number",name:"height","data-testid":"img-height","aria-label":"Image Height",placeholder:"auto",className:s(p.input,n.w4),value:t.height,onChange:x})]})]}),e.jsx(k,{}),e.jsx(N,{id:"nam-stng",title:m("Image Alt Text"),className:s(p.fieldSection),children:e.jsx("div",{children:e.jsx("div",{className:s({w:"97%",mx:5}),children:e.jsx($,{id:"fld-lbl-stng",ariaLabel:"Label input",changeAction:w,value:I.replace(/\$_bf_\$/g,"\\"),placeholder:"Alternative Text"})})})}),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(D,{iconType:"bg_img",selected:"Upload Image",uploadLbl:"Upload Image",setModal:u,unsplash:!0})]})]})}const K={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{te as default}; |
