@iwusong/datav-vue3
Version:
Vue3 large screen data display component library
25 lines (24 loc) • 3.32 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),i=require("@jiaminghi/color"),m=require("../../hooks/useResize.js"),V=require("../../hooks/useUuid.js"),u=require("../../utils/borderBox.js"),b=require("../../utils/common.js"),c=require("../../utils/styled.js"),a=require("../styled/borderBox.js");require("lodash-es");require("../../utils/logger.js");const d=["#2e6099","#7ce7fd"],C=c.styled.svg`
position: absolute;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
`("border-svg-container"),x=b.withInstall(e.defineComponent({name:"BorderBox12",props:u.createBorderBoxCommonProps(),setup(f,{slots:s,expose:$}){const{autoBindRef:h,refreshLayoutSize:p,domSize:g}=m.useResize();$({refreshLayoutSize:p});const N=V.useUuid();return()=>{const{color:k,backgroundColor:B}=f,{width:o,height:r}=g,t=u.mergeColor(d,k),l=`border-box-12-filterId-${N}`;return e.createVNode(a.BorderBoxContainer,{class:c.styled.getClassNameForBind("border-box-12"),ref:h},{default:()=>[e.createVNode(C,{width:o,height:r},{default:()=>[e.createVNode("defs",null,[e.createVNode("filter",{id:l,height:"150%",width:"150%",x:"-25%",y:"-25%"},[e.createVNode("feMorphology",{operator:"dilate",radius:"1",in:"SourceAlpha",result:"thicken"},null),e.createVNode("feGaussianBlur",{in:"thicken",stdDeviation:"2",result:"blurred"},null),e.createVNode("feFlood",{"flood-color":i.fade(t[1]||d[1],70),result:"glowColor"},[e.createVNode("animate",{attributeName:"flood-color",values:`
${i.fade(t[1]||d[1],70)};
${i.fade(t[1]||d[1],30)};
${i.fade(t[1]||d[1],70)};
`,dur:"3s",begin:"0s",repeatCount:"indefinite"},null)]),e.createVNode("feComposite",{in:"glowColor",in2:"blurred",operator:"in",result:"softGlowColored"},null),e.createVNode("feMerge",null,[e.createVNode("feMergeNode",{in:"softGlowColored"},null),e.createVNode("feMergeNode",{in:"SourceGraphic"},null)])])]),o&&r&&e.createVNode("path",{fill:B,"stroke-width":"2",stroke:t[0],d:`
M15 5 L ${o-15} 5 Q ${o-5} 5, ${o-5} 15
L ${o-5} ${r-15} Q ${o-5} ${r-5}, ${o-15} ${r-5}
L 15, ${r-5} Q 5 ${r-5} 5 ${r-15} L 5 15
Q 5 5 15 5
`},null),e.createVNode("path",{"stroke-width":"2",fill:"transparent","stroke-linecap":"round",filter:`url(#${l})`,stroke:t[1],d:"M 20 5 L 15 5 Q 5 5 5 15 L 5 20"},null),e.createVNode("path",{"stroke-width":"2",fill:"transparent","stroke-linecap":"round",filter:`url(#${l})`,stroke:t[1],d:`M ${o-20} 5 L ${o-15} 5 Q ${o-5} 5 ${o-5} 15 L ${o-5} 20`},null),e.createVNode("path",{"stroke-width":"2",fill:"transparent","stroke-linecap":"round",filter:`url(#${l})`,stroke:t[1],d:`
M ${o-20} ${r-5} L ${o-15} ${r-5}
Q ${o-5} ${r-5} ${o-5} ${r-15}
L ${o-5} ${r-20}
`},null),e.createVNode("path",{"stroke-width":"2",fill:"transparent","stroke-linecap":"round",filter:`url(#${l})`,stroke:t[1],d:`
M 20 ${r-5} L 15 ${r-5}
Q 5 ${r-5} 5 ${r-15}
L 5 ${r-20}
`},null)]}),e.createVNode(a.BorderBoxContent,null,{default:()=>{var n;return[(n=s.default)==null?void 0:n.call(s)]}})]})}}}));exports.BorderBox12=x;