import{I as d}from"./iconify-p99pbjf9.js";import h from"./IconPicker-AR6HnD7K.js";import{d as _,A as o,J as r,_ as b,P as v,O as y,i as c,j as i,am as g,H as x,c as m,r as I,g as e}from"./index-DOFLUERq.js";import{_ as E}from"./_plugin-vue_export-helper-DlAUqK2U.js";const P={class:"field-label"},w={key:0,class:"required"},B={class:"icon-field-content"},C=["title"],V={key:1,class:"icon-display"},N={key:1,class:"icon-placeholder"},j={class:"icon-value-display"},O={key:0,class:"field-value-text"},S=_({__name:"Icon",props:{df:{},record:{},canEdit:{type:Boolean},ctx:{}},setup(l){const t=l,p=m(()=>t.df.label_layout||"vertical"),a=m({get:()=>t.record[t.df.fieldname]||"",set:f=>{t.record[t.df.fieldname]=f}}),u=I(null);function k(){u.value?.open()}return(f,n)=>(e(),o("div",{class:x(["field-wrapper",`layout-${p.value}`])},[r("label",P,[b(v(l.ctx.t(l.df.label||l.df.fieldname))+" ",1),l.df.reqd?(e(),o("span",w,"*")):y("",!0)]),r("div",B,[l.canEdit?(e(),o("div",{key:0,class:"icon-display clickable",onClick:k,title:l.ctx.t("Click to select icon")},[a.value?(e(),c(i(d),{key:0,icon:a.value,width:24,height:24,class:"icon-gray icon-preview"},null,8,["icon"])):(e(),c(i(d),{key:1,icon:"tabler:apps",width:24,height:24,class:"icon-gray icon-placeholder-icon"}))],8,C)):(e(),o("div",V,[a.value?(e(),c(i(d),{key:0,icon:a.value,width:24,height:24,class:"icon-gray"},null,8,["icon"])):(e(),o("span",N,"—"))])),r("div",j,[l.canEdit?(e(),c(i(g),{key:1,value:a.value,"onUpdate:value":n[0]||(n[0]=s=>a.value=s),placeholder:l.ctx.t("Enter icon name or click icon to select"),class:"icon-input",clearable:""},null,8,["value","placeholder"])):(e(),o("span",O,v(a.value||"—"),1))])]),l.canEdit?(e(),c(h,{key:0,ref_key:"iconPickerRef",ref:u,"model-value":a.value,"onUpdate:modelValue":n[1]||(n[1]=s=>a.value=s),style:{display:"none"}},null,8,["model-value"])):y("",!0)],2))}}),q=E(S,[["__scopeId","data-v-5f2b6189"]]),$=Object.freeze(Object.defineProperty({__proto__:null,default:q},Symbol.toStringTag,{value:"Module"}));export{$ as _};
