import{a as z,g as G,i as m,cA as h,j as n,h as j,el as L,bs as R,cH as W,cm as X,cl as q,aX as J,l as Q,f as w,bG as V,cu as O,cv as A,cs as U,m as Y}from"./main-634.js";import{C as Z}from"./bf-486-243.js";import{I as P}from"./bf-967-393.js";function le({subtitle:k,objectPaths:r,id:p,allowImportant:N,state:$,hslaPaths:B}){const{css:i}=z(),{element:g,fieldKey:v}=G(),[S,K]=m(W),[E,M]=m(X),[D,F]=m(q),[H,I]=m(J);let T,x,c="";const C=e=>U(e,{themeVars:E,styles:H,themeColors:D}),y=e=>h(C(e.object),Q(C(e.object),e.path)),o=[];if(Array.isArray(r))r.forEach(e=>{const{paths:t,object:s}=e;Object.keys(e.paths).forEach(d=>{o[d]={object:s,path:t[d]}})});else{const{paths:e,object:t}=r;Object.keys(e).forEach(a=>{o[a]={object:t,path:e[a]}})}const l={"outline-color":"","outline-width":"","outline-offset":"","outline-style":""},b=Object.keys(o);for(let e=0;e<b.length;e+=1){const t=b[e];if(b.length===2&&t==="outline"){const s=y(o[t]),a=s==null?void 0:s.split(/(?!\(.*)\s(?![^(]*?\))/g);l["outline-width"]=h(o[t],a[0])||"",l["outline-style"]=h(o[t],a[1])||"",l["outline-color"]=h(o[t],a[2])||"";break}t!=="outline-offset"&&(l[t]=y(o[t]))}l["outline-offset"]=y(o["outline-offset"]),l["outline-width"]&&(c+=`Width: ${l["outline-width"]}; `),l["outline-style"]&&(c+=`Style: ${l["outline-style"]}; `),l["outline-color"]&&(x=l["outline-color"],c+=`Color: ${l["outline-color"]}; `);const f=(e,t,s="")=>{Object.keys(e).map(d=>{Y(t,e[d],s)})},_=()=>{if(Array.isArray(r))r.map(e=>{const{paths:t}=e;e.object==="themeVars"?M(s=>w(s,a=>{f(t,a)})):e.object==="themeColors"&&F(s=>w(s,a=>{f(t,a)}))}),V(O(g,v,"outline Clear","",{styles:A("styles")}));else{const{paths:e}=r;I(t=>w(t,s=>{f(e,s)})),V(O(g,v,"outline Clear","",{styles:A("styles")}))}};return n.jsxs("div",{className:i(j.flxc),children:[N&&c&&n.jsx(P,{id:p,className:i({mr:3}),paths:r.paths,propertyPath:T,stateObjName:r.object||"styles"}),n.jsxs("div",{title:c||"Add outline Style",className:i(u.preview_wrp,S.id===p&&u.active),children:[n.jsxs("button",{onClick:e=>L(e,K,{component:"outline-style",subtitle:k,objectPaths:r,state:$,id:p,hslaPaths:B}),type:"button",className:i(u.pickrBtn),"data-testid":`${p}-modal-btn`,children:[n.jsx(Z,{bg:x,h:24,w:24,className:i(j.mr2)}),n.jsx("span",{className:i(u.clrVal),children:c||"Add outline Style"})]}),c&&n.jsx("button",{title:"Clear Value",className:i(u.clearBtn),onClick:_,type:"button","aria-label":"Clear outline","data-testid":`${p}-clear-btn`,children:n.jsx(R,{size:"12"})})]})]})}const u={preview_wrp:{bd:"var(--white-0-95)",w:130,mnw:130,brs:"var(--bf-bdr-radius-sm)",p:3,flx:"center-between",":hover":{bs:"0 0 0 1px var(--white-0-83)"}},preview:{w:25,h:25,b:"1px solid gray",brs:7,curp:1,mr:7},clearBtn:{brs:"50%",p:4,w:17,h:17,b:"none",flx:"center",bd:"transparent",cr:"var(--white-0-50)",curp:1,":hover":{cr:"var(--black-0)",bd:"#d3d1d1"}},pickrBtn:{b:"none",curp:1,flx:"center",bd:"transparent",p:0},clrVal:{w:73,ws:"nowrap",textOverflow:"ellipsis",ow:"hidden"},active:{focusShadow:1}};export{le as O};
