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