lc-vue-size-scale/dist/index.umd.cjs

尺寸刻度尺

(function(){"use strict";try{if(typeof document<"u"){var a=document.createElement("style");a.appendChild(document.createTextNode(".px-scale[data-v-38c0985f]{position:absolute;--scale-border-color: #333;--scale-border: 1px solid var(--scale-border-color);--small-scale-size: 4px;--normal-scale-size: calc(2 * var(--small-scale-size));--large-scale-size: calc(4 * var(--small-scale-size));--scale-size: calc(5 * var(--small-scale-size))}.px-scale.top-scale[data-v-38c0985f]{top:0}.px-scale.top-scale .scale-item[data-v-38c0985f]{bottom:0}.px-scale.top-scale .scale-text[data-v-38c0985f]{top:var(--small-scale-size)}.px-scale.bottom-scale[data-v-38c0985f]{bottom:0}.px-scale.bottom-scale .scale-item[data-v-38c0985f]{top:0}.px-scale.bottom-scale .scale-text[data-v-38c0985f]{bottom:var(--small-scale-size)}.px-scale.left-scale[data-v-38c0985f]{left:0;height:100%}.px-scale.left-scale .scale-item[data-v-38c0985f]{right:0}.px-scale.left-scale .scale-text[data-v-38c0985f]{left:var(--small-scale-size)}.px-scale.right-scale[data-v-38c0985f]{right:0}.px-scale.right-scale .scale-item[data-v-38c0985f]{left:0}.px-scale.right-scale .scale-text[data-v-38c0985f]{right:var(--small-scale-size)}.px-scale.top-scale[data-v-38c0985f],.px-scale.bottom-scale[data-v-38c0985f]{width:100%;height:var(--scale-size)}.px-scale.top-scale .scale-item[data-v-38c0985f],.px-scale.bottom-scale .scale-item[data-v-38c0985f]{border-left:var(--scale-border)}.px-scale.top-scale .scale-item.small-scale-item[data-v-38c0985f],.px-scale.bottom-scale .scale-item.small-scale-item[data-v-38c0985f]{height:var(--small-scale-size)}.px-scale.top-scale .scale-item.normal-scale-item[data-v-38c0985f],.px-scale.bottom-scale .scale-item.normal-scale-item[data-v-38c0985f]{height:var(--normal-scale-size)}.px-scale.top-scale .scale-item.large-scale-item[data-v-38c0985f],.px-scale.bottom-scale .scale-item.large-scale-item[data-v-38c0985f]{height:var(--large-scale-size)}.px-scale.left-scale[data-v-38c0985f],.px-scale.right-scale[data-v-38c0985f]{height:100%;width:var(--scale-size)}.px-scale.left-scale .scale-item[data-v-38c0985f],.px-scale.right-scale .scale-item[data-v-38c0985f]{border-top:var(--scale-border)}.px-scale.left-scale .scale-item.small-scale-item[data-v-38c0985f],.px-scale.right-scale .scale-item.small-scale-item[data-v-38c0985f]{width:var(--small-scale-size)}.px-scale.left-scale .scale-item.normal-scale-item[data-v-38c0985f],.px-scale.right-scale .scale-item.normal-scale-item[data-v-38c0985f]{width:var(--normal-scale-size)}.px-scale.left-scale .scale-item.large-scale-item[data-v-38c0985f],.px-scale.right-scale .scale-item.large-scale-item[data-v-38c0985f]{width:var(--large-scale-size)}.px-scale.left-scale .scale-text[data-v-38c0985f],.px-scale.right-scale .scale-text[data-v-38c0985f]{writing-mode:vertical-rl}.px-scale .scale-item[data-v-38c0985f]{position:absolute}.px-scale .scale-text[data-v-38c0985f]{position:absolute;font-size:12px;line-height:1}")),document.head.appendChild(a)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
(function(c,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core"],e):(c=typeof globalThis<"u"?globalThis:c||self,e(c["lc-vue-size-scale"]={},c.Vue,c["@vueuse/core"]))})(this,function(c,e,m){"use strict";const u=((l,n)=>{const a=l.__vccOpts||l;for(const[i,p]of n)a[i]=p;return a})(e.defineComponent({__name:"px-scale",props:{placement:{type:String,default:"top"},particleSize:{type:Number,default:5}},setup(l){const n=l,a=e.ref(),{width:i,height:p}=m.useElementSize(a),d=e.ref({}),f=e.computed(()=>{const r=n.placement==="top"||n.placement==="bottom"?i.value:p.value;return Math.floor(r/n.particleSize)+1}),y=e.computed(()=>{const r=f.value,s=[];for(let t=0;t<r;t++)s.push({size:t*n.particleSize,type:t%10===0?"large":t%5===0?"normal":"small"});return s}),x=e.computed(()=>{const s=Math.floor(f.value/20)+1,t=[];for(let o=1;o<s;o++)t.push({offset:o*20*n.particleSize});return t});return(r,s)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"pxScaleRef",ref:a,class:e.normalizeClass(["size-scale px-scale",`${l.placement}-scale`]),style:e.normalizeStyle(d.value)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(y.value,(t,o)=>(e.openBlock(),e.createElementBlock("div",{key:o,class:e.normalizeClass(["scale-item",`${t.type}-scale-item`]),style:e.normalizeStyle({top:l.placement==="left"||l.placement==="right"?`${t.size}px`:void 0,left:l.placement==="top"||l.placement==="bottom"?`${t.size}px`:void 0})},null,6))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(x.value,(t,o)=>(e.openBlock(),e.createElementBlock("div",{key:o,class:"scale-text",style:e.normalizeStyle({top:l.placement==="left"||l.placement==="right"?`${t.offset+2}px`:void 0,left:l.placement==="top"||l.placement==="bottom"?`${t.offset+2}px`:void 0})},e.toDisplayString(t.offset),5))),128))],6))}}),[["__scopeId","data-v-38c0985f"]]);c.PxScale=u,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})});