| 1 |
- import{u as p}from"./vue-flow-core-1a88c3a1.js";import{H as C,c as b,I as g,o as r,b as m,J as f,e as c,X as G,ac as $,f as s,D as w,q as y}from"./index-8d0bf0b2.js";var a=(e=>(e.Lines="lines",e.Dots="dots",e))(a||{});const z=function({dimensions:e,size:n,color:l}){return $("path",{stroke:l,"stroke-width":n,d:`M${e[0]/2} 0 V${e[1]} M0 ${e[1]/2} H${e[0]}`})},D=function({radius:e,color:n}){return $("circle",{cx:e,cy:e,r:e,fill:n})};a.Lines+"",a.Dots+"";const B={[a.Dots]:"#81818a",[a.Lines]:"#eee"},L=["id","x","y","width","height","patternTransform"],S={key:2,height:"100",width:"100"},I=["fill"],M=["x","y","fill"],O={name:"Background",compatConfig:{MODE:3}},E=C({...O,props:{id:{},variant:{default:()=>a.Dots},gap:{default:20},size:{default:1},lineWidth:{default:1},patternColor:{},color:{},bgColor:{},height:{default:100},width:{default:100},x:{default:0},y:{default:0},offset:{default:2}},setup(e){const{id:n,viewport:l}=p(),o=b(()=>{const[t,v]=Array.isArray(e.gap)?e.gap:[e.gap,e.gap],u=[t*l.value.zoom||1,v*l.value.zoom||1],d=e.size*l.value.zoom,k=e.variant===a.Dots?[d/e.offset,d/e.offset]:[u[0]/e.offset,u[1]/e.offset];return{scaledGap:u,offset:k,size:d}}),i=g(()=>`pattern-${n}${e.id?`-${e.id}`:""}`),h=g(()=>e.color||e.patternColor||B[e.variant||a.Dots]);return(t,v)=>(r(),m("svg",{class:"vue-flow__background vue-flow__container",style:G({height:`${t.height>100?100:t.height}%`,width:`${t.width>100?100:t.width}%`})},[f(t.$slots,"pattern-container",{id:i.value},()=>[c("pattern",{id:i.value,x:s(l).x%o.value.scaledGap[0],y:s(l).y%o.value.scaledGap[1],width:o.value.scaledGap[0],height:o.value.scaledGap[1],patternTransform:`translate(-${o.value.offset[0]},-${o.value.offset[1]})`,patternUnits:"userSpaceOnUse"},[f(t.$slots,"pattern",{},()=>[t.variant===s(a).Lines?(r(),w(s(z),{key:0,size:t.lineWidth,color:h.value,dimensions:o.value.scaledGap},null,8,["size","color","dimensions"])):t.variant===s(a).Dots?(r(),w(s(D),{key:1,color:h.value,radius:o.value.size/t.offset},null,8,["color","radius"])):y("",!0),t.bgColor?(r(),m("svg",S,[c("rect",{width:"100%",height:"100%",fill:t.bgColor},null,8,I)])):y("",!0)])],8,L)]),c("rect",{x:t.x,y:t.y,width:"100%",height:"100%",fill:`url(#${i.value})`},null,8,M),f(t.$slots,"default",{id:i.value})],4))}});export{E as _};
|
