import{l,i as N,r as O,e as o,o as t,d as s,a as y,b as p,t as i,u as C,F as S,g as A,n as U,c as B,w as q}from"./vue.esm-bundler.js?ver=1.6.6";import{_ as z}from"../app.js";import{_ as V}from"./DynamicIcon.js?ver=1.6.6";import E from"./AppearancePreview.js?ver=1.6.6";import{t as x}from"./Translator.js?ver=1.6.6";import{I as L}from"./IconButton.js?ver=1.6.6";import"./vue-router.js?ver=1.6.6";import"./preload-helper.js?ver=1.6.6";import"./Badge.js?ver=1.6.6";import"./Model.js?ver=1.6.6";import"./Rest.js?ver=1.6.6";import"./common.js?ver=1.6.6";import"./dayjs.min.js?ver=1.6.6";import"./Str.js?ver=1.6.6";import"./timezone.js?ver=1.6.6";import"./weekOfYear.js?ver=1.6.6";import"./Arr.js?ver=1.6.6";import"./Utils.js?ver=1.6.6";import"./CurrencyFormatter.js?ver=1.6.6";import"./index.js?ver=1.6.6";import"./Url.js?ver=1.6.6";import"./Notify.js?ver=1.6.6";import"./_plugin-vue_export-helper.js?ver=1.6.6";import"./index3.js?ver=1.6.6";import"./TransitionAccordion.js?ver=1.6.6";import"./Empty.js?ver=1.6.6";import"./OrderCustomerInformation.js?ver=1.6.6";import"./Animation.js?ver=1.6.6";import"./CardBody.js?ver=1.6.6";import"./UserCan.js?ver=1.6.6";import"./Asset.js?ver=1.6.6";import"./AddressComponent2.js?ver=1.6.6";import"./NotFound.js?ver=1.6.6";import"./productService.js?ver=1.6.6";import"./Activity.js?ver=1.6.6";import"./BundleProducts.js?ver=1.6.6";import"./dateShortCuts.js?ver=1.6.6";import"./index4.js?ver=1.6.6";import"./countries.js?ver=1.6.6";import"./index2.js?ver=1.6.6";import"./AttrGroups.js?ver=1.6.6";import"./DynamicTemplateParser.js?ver=1.6.6";import"./ProductVariationSelector.js?ver=1.6.6";import"./galleryTabs.js?ver=1.6.6";import"./FileUploaderDialog.js?ver=1.6.6";import"./Screenshot.js?ver=1.6.6";import"./useElementPlusComponents.js?ver=1.6.6";const G={class:"fct-appearance-component-wrapper"},M={class:"fct-appearance-component"},P={key:0,class:"fct-appearance-heading"},T={class:"setting-label"},W={key:0,class:"form-note"},F=["aria-label"],H=["aria-checked","tabindex","onClick","onKeydown"],J={class:"fct-appearance-source-card__text"},Q={class:"fct-appearance-source-card__title"},X={key:0,class:"fct-appearance-source-card__note"},Y={key:0,class:"fct-appearance-colors"},Z={class:"fct-appearance-color-group__label"},ee={class:"fct-appearance-color-fields"},ae={class:"setting-label"},Je={__name:"AppearanceComponent",props:{name:{type:String,required:!0},field:{type:Object},fieldKey:{type:String},value:{required:!0},variant:{type:String},nesting:{type:Boolean,default:!1},statePath:{type:String},form:{type:Object,required:!0},callback:{type:Function},label:{type:String},attribute:{required:!0}},setup(b){const u=b,h=l(()=>{var e;return((e=u.field)==null?void 0:e.heading)||{}}),m=l(()=>{var e;return((e=u.field)==null?void 0:e.source_options)||[]}),D=l(()=>{var e;return((e=u.field)==null?void 0:e.color_groups)||[]}),g=l(()=>{var e;return(e=u.field)==null?void 0:e.custom_source}),r=l(()=>u.form.data.values),k=e=>r.value.appearance_source===e.value,w=e=>{r.value.appearance_source=e.value},I=l(()=>r.value.appearance_source===g.value),K=l(()=>{const e=m.value.findIndex(k);return e===-1?0:e}),R=(e,d)=>{var a,f;const _=m.value.length;let c=d;if(e.key==="ArrowDown"||e.key==="ArrowRight")c=(d+1)%_;else if(e.key==="ArrowUp"||e.key==="ArrowLeft")c=(d-1+_)%_;else if(e.key===" "||e.key==="Enter"){e.preventDefault(),w(m.value[d]);return}else return;e.preventDefault(),w(m.value[c]),(f=(a=e.currentTarget.closest('[role="radiogroup"]'))==null?void 0:a.querySelectorAll('[role="radio"]')[c])==null||f.focus()},$=()=>{r.value.appearance_colors={}};return N(()=>{const e=r.value.appearance_colors;(!e||Array.isArray(e)||typeof e!="object")&&(r.value.appearance_colors={})}),(e,d)=>{var c;const _=O("el-tooltip");return t(),o("div",G,[s("div",M,[h.value.label?(t(),o("div",P,[s("span",T,i(h.value.label),1),h.value.note?(t(),o("div",W,i(h.value.note),1)):p("",!0)])):p("",!0),s("div",{class:"fct-appearance-source",role:"radiogroup","aria-label":C(x)("Where colors come from")},[(t(!0),o(S,null,A(m.value,(a,f)=>(t(),o("div",{key:a.value,class:U(["fct-appearance-source-card",{"is-checked":k(a)}])},[s("div",{class:"fct-appearance-source-card__header",role:"radio","aria-checked":k(a),tabindex:f===K.value?0:-1,onClick:n=>w(a),onKeydown:n=>R(n,f)},[a.icon?(t(),B(V,{key:0,name:a.icon,class:"fct-appearance-source-option-icon"},null,8,["name"])):p("",!0),s("span",J,[s("span",Q,i(a.label),1),a.note?(t(),o("span",X,i(a.note),1)):p("",!0)]),k(a)?(t(),B(V,{key:1,name:"CheckCircleFill",class:"fct-appearance-source-icon"})):p("",!0)],40,H),I.value&&a.value===g.value?(t(),o("div",Y,[y(_,{content:C(x)("Reset all colors"),placement:"top"},{default:q(()=>[y(L,{size:"small",tag:"button",type:"button",class:"fct-reset-color-btn","aria-label":C(x)("Reset all colors"),onClick:$},{default:q(()=>[y(V,{name:"Reset",class:"w-4 h-4"})]),_:1},8,["aria-label"])]),_:1},8,["content"]),(t(!0),o(S,null,A(D.value,n=>(t(),o("div",{key:n.key,class:"fct-appearance-color-group"},[s("span",Z,i(n.label),1),s("div",ee,[(t(!0),o(S,null,A(n.fields,v=>(t(),o("div",{class:"fct-appearance-color-field",key:v.key},[s("span",ae,i(v.label),1),y(z,{modelValue:r.value.appearance_colors[v.key],"onUpdate:modelValue":j=>r.value.appearance_colors[v.key]=j,field:v,form:b.form,attribute:{}},null,8,["modelValue","onUpdate:modelValue","field","form"])]))),128))])]))),128))])):p("",!0)],2))),128))],8,F)]),y(E,{preview:((c=b.field)==null?void 0:c.preview)||{},source:r.value.appearance_source,colors:r.value.appearance_colors||{},"custom-source":g.value},null,8,["preview","source","colors","custom-source"])])}}};export{Je as default};