import{a as z,g as L,i as h,cA as m,j as n,h as V,dP as R,bm as W,cH as q,ch as G,cg as J,aV as Q,l as U,f as w,bD as j,cr as O,cs as A,cp as X,m as Y}from"./main-343.js";import{C as Z}from"./bf-810-248.js";import{I as P}from"./bf-236-288.js";function le({subtitle:k,objectPaths:r,id:p,allowImportant:$,state:N,hslaPaths:B}){const{css:i}=z(),{element:g,fieldKey:x}=L(),[S,K]=h(q),[D,E]=h(G),[M,F]=h(J),[H,I]=h(Q);let T,v,c="";const C=e=>X(e,{themeVars:D,styles:H,themeColors:M}),y=e=>m(C(e.object),U(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":""},f=Object.keys(o);for(let e=0;e<f.length;e+=1){const t=f[e];if(f.length===2&&t==="outline"){const s=y(o[t]),a=s==null?void 0:s.split(/(?!\(.*)\s(?![^(]*?\))/g);l["outline-width"]=m(o[t],a[0])||"",l["outline-style"]=m(o[t],a[1])||"",l["outline-color"]=m(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"]&&(v=l["outline-color"],c+=`Color: ${l["outline-color"]}; `);const b=(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"?E(s=>w(s,a=>{b(t,a)})):e.object==="themeColors"&&F(s=>w(s,a=>{b(t,a)}))}),j(O(g,x,"outline Clear","",{styles:A("styles")}));else{const{paths:e}=r;I(t=>w(t,s=>{b(e,s)})),j(O(g,x,"outline Clear","",{styles:A("styles")}))}};return n.jsxs("div",{className:i(V.flxc),children:[$&&c&&n.jsx(P,{id:p,className:i({mr:3}),paths:r.paths,propertyPath:T}),n.jsxs("div",{title:c||"Add outline Style",className:i(u.preview_wrp,S.id===p&&u.active),children:[n.jsxs("button",{onClick:e=>R(e,K,{component:"outline-style",subtitle:k,objectPaths:r,state:N,id:p,hslaPaths:B}),type:"button",className:i(u.pickrBtn),"data-testid":`${p}-modal-btn`,children:[n.jsx(Z,{bg:v,h:24,w:24,className:i(V.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(W,{size:"12"})})]})]})}const u={preview_wrp:{bd:"var(--white-0-95)",w:130,mnw:130,brs:10,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};
