vue3-scale-ruler/lib/ScaleRule.vue2.js

"use strict";const o=require("vue"),v=require("./props.js"),f=require("./components/RulerCanvas.vue.js"),m={key:0},y={key:1},b=o.defineComponent({__name:"ScaleRule",props:o.mergeDefaults({width:{},height:{},thick:{},scale:{},ratio:{},lines:{},isShowReferLine:{type:Boolean},startX:{},startY:{},rect:{},useMoveLine:{type:Boolean},autoUpdateCssVar:{type:Boolean},longLineColor:{},shortLineColor:{},fontColor:{},lineColor:{},bgColor:{},borderColor:{},activeColor:{},blockColor:{},step:{},cornerIcon:{},cornerCloseIcon:{},lineCloseIcon:{}},{...v.SketchRulePropsDefaultValeue}),setup(p,{expose:L}){const e=p,C=o.ref(),i=o.ref(e.isShowReferLine);let t;const h=o.ref(e.autoUpdateCssVar||!1),a=o.reactive({longLineColor:e.longLineColor,shortLineColor:e.shortLineColor||e.fontColor,bgColor:e.bgColor,borderColor:e.borderColor,fontColor:e.fontColor,lineColor:e.lineColor||e.longLineColor,activeColor:e.activeColor||e.longLineColor,blockColor:e.blockColor||e.longLineColor}),l=o.reactive({longLineColor:e.longLineColor,shortLineColor:e.shortLineColor||e.fontColor,bgColor:e.bgColor,borderColor:e.borderColor,fontColor:e.fontColor,lineColor:e.lineColor||e.longLineColor,activeColor:e.activeColor||e.longLineColor,blockColor:e.blockColor||e.longLineColor}),g=["longLineColor","shortLineColor"],d=()=>{Object.keys(l).forEach(r=>{var n;let s="--ruler-"+r.replace(/([A-Z])/g,c=>`-${c.toLocaleLowerCase()}`);(n=C.value)==null||n.style.setProperty(s,l[r])})},k=()=>{t||(t=new MutationObserver(()=>{const r=getComputedStyle(document.documentElement);let s=!1;Object.keys(l).forEach(n=>{if(n&&a[n].substring(0,2)==="--"){let c=r.getPropertyValue(a[n]);c!==l[n]&&(l[n]=c,g.includes(n)===!1&&(s=!0))}}),s&&d()}))},u=()=>{k(),t==null||t.observe(document.body,{attributes:!0,childList:!0,subtree:!0})};return o.watchEffect(()=>{h.value===!0&&u()}),o.onUnmounted(()=>{t==null||t.disconnect()}),L({updateColorVar:r=>{u(),r&&typeof r=="function"&&r()}}),(r,s)=>{const n=o.resolveComponent("el-icon");return o.openBlock(),o.createElementBlock("div",{ref_key:"mainRef",ref:C,class:"ibsp-nextui-ruler"},[o.createVNode(f,o.mergeProps(e,{key:"h",h:!0,isShowReferLine:i.value,longLineColor:l.longLineColor,shortLineColor:l.shortLineColor,fontColor:l.fontColor}),null,16,["isShowReferLine","longLineColor","shortLineColor","fontColor"]),o.createVNode(f,o.mergeProps(e,{key:"v",h:!1,isShowReferLine:i.value,longLineColor:l.longLineColor,shortLineColor:l.shortLineColor,fontColor:l.fontColor}),null,16,["isShowReferLine","longLineColor","shortLineColor","fontColor"]),o.createElementVNode("div",{class:"ruler-icon",style:o.normalizeStyle({width:`${r.thick}px`,height:`${r.thick}px`}),onClick:s[0]||(s[0]=c=>i.value=!i.value)},[o.createVNode(n,null,{default:o.withCtx(()=>[r.cornerIcon&&r.cornerCloseIcon?(o.openBlock(),o.createElementBlock(o.Fragment,{key:0},[i.value?(o.openBlock(),o.createBlock(o.resolveDynamicComponent(r.cornerCloseIcon),{key:1})):(o.openBlock(),o.createBlock(o.resolveDynamicComponent(r.cornerIcon),{key:0}))],64)):(o.openBlock(),o.createElementBlock(o.Fragment,{key:1},[i.value?(o.openBlock(),o.createElementBlock("span",m,"N")):(o.openBlock(),o.createElementBlock("span",y,"Y"))],64))]),_:1})],4)],512)}}});module.exports=b;