vue-data-ui 2.4.16 → 2.4.18

package/dist/PenAndPaper-DZMrk8wy.js

@@ -0,0 +1,415 @@
+import { computed as O, ref as c, watch as q, withDirectives as A, openBlock as p, createElementBlock as f, createElementVNode as C, normalizeStyle as b, createVNode as P, Fragment as R, renderList as H, createCommentVNode as V, unref as j, onMounted as oe, nextTick as ne, onBeforeUnmount as le, normalizeClass as T, vModelText as re, withModifiers as Q } from "vue";
+import { F as ae, l as se, X as ue } from "./index-Du8vv3oo.js";
+import D from "./BaseIcon-DnSWchyz.js";
+import { v as ce } from "./usePrinter-Dg442RJ0.js";
+import { _ as G } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const ie = { style: { height: "100%", width: "100%", position: "relative" } }, de = { class: "icon" }, ve = ["onClick"], pe = { style: { position: "absolute", top: "50%", left: "50%", transform: "translate(-50%, -46%)" } }, fe = ["value"], he = {
+  __name: "ColorPicker",
+  props: {
+    value: {
+      type: String,
+      default: "#ffffff"
+    },
+    size: {
+      type: String,
+      default: "50px"
+    },
+    backgroundColor: {
+      type: String,
+      default: "#FFFFFF"
+    },
+    buttonBorderColor: {
+      type: String,
+      default: "#FFFFFF"
+    }
+  },
+  emits: ["update:value"],
+  setup(r, { emit: I }) {
+    const h = r, k = O(() => ({
+      backgroundColor: h.value,
+      width: "100%",
+      height: "100%",
+      cursor: "pointer"
+    })), y = c(null), $ = c(!1), M = () => {
+      var u;
+      (u = y.value) == null || u.click();
+    };
+    function S(u) {
+      I("update:value", u), $.value = !1;
+    }
+    function x() {
+      $.value = !1;
+    }
+    function L() {
+      $.value && x();
+    }
+    const X = (u) => {
+      const B = u.target.value;
+      I("update:value", B);
+    }, F = O(() => ae(h.value));
+    q(
+      () => h.value,
+      (u) => {
+        y.value.value = u;
+      }
+    );
+    const w = c([
+      "#000000",
+      "#FFFFFF",
+      "#FF5733",
+      "#33FF57",
+      "#3357FF",
+      "#FFC300",
+      "#800080",
+      "#FF1493",
+      "#00CED1"
+    ]);
+    return (u, B) => A((p(), f("div", ie, [
+      C("div", {
+        onClick: B[0] || (B[0] = (z) => $.value = !$.value),
+        style: b(k.value)
+      }, [
+        C("div", de, [
+          P(D, {
+            name: "palette",
+            stroke: F.value,
+            size: 22
+          }, null, 8, ["stroke"])
+        ])
+      ], 4),
+      $.value ? (p(), f("div", {
+        key: 0,
+        class: "vue-ui-color-picker",
+        style: b({
+          backgroundColor: r.backgroundColor
+        })
+      }, [
+        (p(!0), f(R, null, H(w.value, (z) => (p(), f("div", {
+          class: "vue-ui-color-picker-option",
+          style: b({
+            backgroundColor: z,
+            outline: `1px solid ${r.buttonBorderColor}`
+          }),
+          onClick: () => S(z)
+        }, null, 12, ve))), 256)),
+        C("div", {
+          class: "vue-ui-color-picker-option",
+          onClick: M,
+          style: b({
+            backgroundColor: r.value,
+            outline: `1px solid ${r.buttonBorderColor}`
+          })
+        }, [
+          C("div", pe, [
+            P(D, {
+              name: "colorPicker",
+              stroke: F.value,
+              size: 22
+            }, null, 8, ["stroke"])
+          ]),
+          C("input", {
+            ref_key: "colorInput",
+            ref: y,
+            type: "color",
+            value: r.value,
+            class: "hidden-input",
+            onInput: X
+          }, null, 40, fe)
+        ], 4)
+      ], 4)) : V("", !0)
+    ])), [
+      [j(ce), L]
+    ]);
+  }
+}, ke = /* @__PURE__ */ G(he, [["__scopeId", "data-v-84e6c062"]]), ge = {
+  class: /* @__PURE__ */ T({
+    "vue-ui-pen-and-paper-action": !0
+  }),
+  style: { padding: "0 !important" }
+}, me = ["disabled"], Ce = ["xmlns", "viewBox", "onTouchstart", "onTouchmove"], ye = ["cx", "cy", "r", "fill"], $e = ["d", "stroke", "stroke-width"], be = ["d", "stroke", "stroke-width"], Fe = {
+  __name: "PenAndPaper",
+  props: {
+    parent: {
+      type: HTMLElement
+    },
+    backgroundColor: {
+      type: String,
+      default: "#FFFFFF"
+    },
+    color: {
+      type: String,
+      default: "#2D353C"
+    },
+    active: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["close"],
+  setup(r, { emit: I }) {
+    const h = r, k = c([]), y = c([]), $ = c("0 0 0 0"), M = c(h.color), S = c(1), x = O(() => se(h.color, 0.6));
+    function L({ width: o, height: t }) {
+      $.value = `0 0 ${o} ${t}`;
+    }
+    const X = c(null);
+    oe(() => {
+      ne(() => {
+        if (h.parent) {
+          X.value = new ResizeObserver((e) => {
+            for (const n of e) {
+              const { width: l, height: a } = n.contentRect;
+              L({ width: l, height: a });
+            }
+          }), X.value.observe(h.parent);
+          const { width: o, height: t } = h.parent.getBoundingClientRect();
+          L({ width: o, height: t });
+        }
+      });
+    }), le(() => {
+      X.value && X.value.disconnect();
+    }), q(
+      () => h.parent,
+      (o) => {
+        if (!o) return;
+        const { width: t, height: e } = h.parent.getBoundingClientRect();
+        L({ width: t, height: e });
+      },
+      { immediate: !0 }
+    );
+    const F = c(!1), w = c(""), u = c(null);
+    function B(o) {
+      if (!u.value) return;
+      F.value = !0;
+      const { x: t, y: e } = W(o);
+      w.value = `M ${t} ${e}`;
+    }
+    function z(o) {
+      if (!F.value || !u.value) return;
+      const { x: t, y: e } = W(o);
+      w.value += ` ${t} ${e}`;
+    }
+    function U(o) {
+      const t = o.trim().split(/\s+/);
+      if (t.length < 4)
+        return o;
+      const e = t.slice(1).map(Number);
+      if (e.length % 2 !== 0)
+        return o;
+      const n = J(e), l = [`M ${n[0]} ${n[1]}`];
+      for (let i = 2; i < n.length - 2; i += 2) {
+        const g = n[i - 2], m = n[i - 1], d = n[i], v = n[i + 1], N = (g + d) / 2, Y = (m + v) / 2;
+        l.push(`Q ${g} ${m} ${N} ${Y}`);
+      }
+      const a = n[n.length - 2], s = n[n.length - 1];
+      return l.push(`L ${a} ${s}`), l.join(" ");
+    }
+    function J(o, t = 1) {
+      const e = [...o];
+      for (let n = 2; n < o.length - 2; n += 2) {
+        const l = o[n], a = o[n + 1], s = o[n - 2], i = o[n - 1], g = o[n + 2], m = o[n + 3];
+        e[n] = l + t * ((s + g) / 2 - l), e[n + 1] = a + t * ((i + m) / 2 - a);
+      }
+      return e;
+    }
+    function K(o) {
+      const t = o.trim().split(/\s+/);
+      let e = "", n = "", l = null, a = null;
+      for (let s = 0; s < t.length; s += 1) {
+        const i = t[s];
+        if (isNaN(i)) {
+          if (n = i, n === "M" || n === "L")
+            l = parseFloat(t[++s]), a = parseFloat(t[++s]), e += `${n}${l} ${a}`;
+          else if (n === "Q") {
+            const g = parseFloat(t[++s]), m = parseFloat(t[++s]), d = parseFloat(t[++s]), v = parseFloat(t[++s]);
+            g === l && m === a ? e += `t${d - l} ${v - a}` : e += `q${g - l} ${m - a} ${d - l} ${v - a}`, l = d, a = v;
+          }
+        } else {
+          const g = parseFloat(i), m = parseFloat(t[++s]);
+          if (n === "L") {
+            const d = g - l, v = m - a;
+            d === 0 ? e += `v${v}` : v === 0 ? e += `h${d}` : e += `l${d} ${v}`, l = g, a = m;
+          } else if (n === "Q") {
+            const d = g, v = m, N = parseFloat(t[++s]), Y = parseFloat(t[++s]);
+            d === l && v === a ? e += `t${N - l} ${Y - a}` : e += `q${d - l} ${v - a} ${N - l} ${Y - a}`, l = N, a = Y;
+          }
+        }
+      }
+      return e;
+    }
+    function E() {
+      F.value && (k.value.push({
+        strokeWidth: S.value,
+        path: K(U(w.value)),
+        color: M.value
+      }), y.value = [], w.value = ""), F.value = !1;
+    }
+    function W(o) {
+      if (!u.value) return { x: 0, y: 0 };
+      const t = u.value.getBoundingClientRect();
+      let e, n;
+      return o.touches && o.touches.length ? (e = o.touches[0].clientX, n = o.touches[0].clientY) : (e = o.clientX, n = o.clientY), {
+        x: e - t.left,
+        y: n - t.top
+      };
+    }
+    c(!1);
+    function Z() {
+      if (k.value.length > 0) {
+        const o = k.value.pop();
+        y.value.push(o);
+      }
+    }
+    function _() {
+      if (y.value.length > 0) {
+        const o = y.value.pop();
+        k.value.push(o);
+      }
+    }
+    function ee() {
+      k.value = [], y.value = [];
+    }
+    const te = c(null);
+    return (o, t) => (p(), f(R, null, [
+      r.active ? (p(), f("div", {
+        key: 0,
+        "data-html2canvas-ignore": "",
+        class: T({
+          "vue-ui-pen-and-paper-actions": !0,
+          visible: r.active
+        })
+      }, [
+        C("button", {
+          class: "vue-ui-pen-and-paper-action",
+          style: b({
+            backgroundColor: r.backgroundColor,
+            border: `1px solid ${x.value}`
+          }),
+          onClick: t[0] || (t[0] = (e) => I("close"))
+        }, [
+          P(D, {
+            name: "close",
+            stroke: r.color
+          }, null, 8, ["stroke"])
+        ], 4),
+        C("button", ge, [
+          P(ke, {
+            value: M.value,
+            "onUpdate:value": t[1] || (t[1] = (e) => M.value = e),
+            backgroundColor: r.backgroundColor,
+            buttonBorderColor: x.value
+          }, null, 8, ["value", "backgroundColor", "buttonBorderColor"])
+        ]),
+        C("button", {
+          class: T({
+            "vue-ui-pen-and-paper-action": !0,
+            "vue-ui-pen-and-paper-action-disabled": !k.value.length
+          }),
+          disabled: !k.value.length,
+          style: b({
+            backgroundColor: r.backgroundColor,
+            border: `1px solid ${x.value}`
+          }),
+          onClick: Z
+        }, [
+          P(D, {
+            name: "restart",
+            stroke: r.color
+          }, null, 8, ["stroke"])
+        ], 14, me),
+        C("button", {
+          class: T({
+            "vue-ui-pen-and-paper-action": !0,
+            "vue-ui-pen-and-paper-action-disabled": !y.value.length
+          }),
+          style: b({
+            backgroundColor: r.backgroundColor,
+            border: `1px solid ${x.value}`
+          }),
+          onClick: _
+        }, [
+          P(D, {
+            name: "restart",
+            stroke: r.color,
+            style: { transform: "scaleX(-1)" }
+          }, null, 8, ["stroke"])
+        ], 6),
+        C("button", {
+          class: T([{
+            "vue-ui-pen-and-paper-action": !0,
+            "vue-ui-pen-and-paper-action-disabled": !k.value.length
+          }, "vue-ui-pen-and-paper-action"]),
+          style: b({
+            backgroundColor: r.backgroundColor,
+            border: `1px solid ${x.value}`
+          }),
+          onClick: ee
+        }, [
+          P(D, {
+            name: "trash",
+            stroke: r.color
+          }, null, 8, ["stroke"])
+        ], 6),
+        A(C("input", {
+          ref_key: "range",
+          ref: te,
+          type: "range",
+          class: "vertical-range",
+          min: 0.5,
+          max: 12,
+          step: 0.1,
+          "onUpdate:modelValue": t[2] || (t[2] = (e) => S.value = e),
+          style: b({
+            accentColor: r.color
+          })
+        }, null, 4), [
+          [re, S.value]
+        ])
+      ], 2)) : V("", !0),
+      (p(), f("svg", {
+        ref_key: "svgElement",
+        ref: u,
+        xmlns: j(ue),
+        viewBox: $.value,
+        class: T({
+          "vue-ui-pen-and-paper": !0,
+          inactive: !r.active
+        }),
+        onMousedown: B,
+        onMousemove: z,
+        onMouseup: E,
+        onMouseleave: E,
+        onTouchstart: Q(B, ["prevent"]),
+        onTouchmove: Q(z, ["prevent"]),
+        onTouchend: E
+      }, [
+        (p(!0), f(R, null, H(k.value, (e) => (p(), f(R, { key: e }, [
+          e.path.replace("M", "").split(" ").length === 2 ? (p(), f("circle", {
+            key: 0,
+            cx: e.path.replace("M", "").split(" ")[0],
+            cy: e.path.replace("M", "").split(" ")[1],
+            r: e.strokeWidth / 2,
+            fill: e.color
+          }, null, 8, ye)) : (p(), f("path", {
+            key: 1,
+            class: "vue-ui-pen-and-paper-path",
+            d: e.path,
+            stroke: e.color,
+            "stroke-width": e.strokeWidth,
+            fill: "none"
+          }, null, 8, $e))
+        ], 64))), 128)),
+        F.value ? (p(), f("path", {
+          key: 0,
+          class: "vue-ui-pen-and-paper-path vue-ui-pen-and-paper-path-drawing",
+          d: U(w.value),
+          stroke: M.value,
+          "stroke-width": S.value * 1.1,
+          fill: "none"
+        }, null, 8, be)) : V("", !0)
+      ], 42, Ce))
+    ], 64));
+  }
+}, Se = /* @__PURE__ */ G(Fe, [["__scopeId", "data-v-a932b1ac"]]);
+export {
+  Se as P
+};

package/dist/PenAndPaper-dZiEH0m2.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("vue"),M=require("./index-1cntUuUo.cjs"),E=require("./BaseIcon-DUo61uTK.cjs"),U=require("./usePrinter-BgfmrF5f.cjs"),L=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),W={style:{height:"100%",width:"100%",position:"relative"}},A={class:"icon"},H=["onClick"],Q={style:{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -46%)"}},_=["value"],j={__name:"ColorPicker",props:{value:{type:String,default:"#ffffff"},size:{type:String,default:"50px"},backgroundColor:{type:String,default:"#FFFFFF"},buttonBorderColor:{type:String,default:"#FFFFFF"}},emits:["update:value"],setup(a,{emit:P}){const p=a,f=e.computed(()=>({backgroundColor:p.value,width:"100%",height:"100%",cursor:"pointer"})),h=e.ref(null),g=e.ref(!1),b=()=>{var u;(u=h.value)==null||u.click()};function B(u){P("update:value",u),g.value=!1}function y(){g.value=!1}function N(){g.value&&y()}const x=u=>{const $=u.target.value;P("update:value",$)},C=e.computed(()=>M.adaptColorToBackground(p.value));e.watch(()=>p.value,u=>{h.value.value=u});const F=e.ref(["#000000","#FFFFFF","#FF5733","#33FF57","#3357FF","#FFC300","#800080","#FF1493","#00CED1"]);return(u,$)=>e.withDirectives((e.openBlock(),e.createElementBlock("div",W,[e.createElementVNode("div",{onClick:$[0]||($[0]=w=>g.value=!g.value),style:e.normalizeStyle(f.value)},[e.createElementVNode("div",A,[e.createVNode(E.default,{name:"palette",stroke:C.value,size:22},null,8,["stroke"])])],4),g.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"vue-ui-color-picker",style:e.normalizeStyle({backgroundColor:a.backgroundColor})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(F.value,w=>(e.openBlock(),e.createElementBlock("div",{class:"vue-ui-color-picker-option",style:e.normalizeStyle({backgroundColor:w,outline:`1px solid ${a.buttonBorderColor}`}),onClick:()=>B(w)},null,12,H))),256)),e.createElementVNode("div",{class:"vue-ui-color-picker-option",onClick:b,style:e.normalizeStyle({backgroundColor:a.value,outline:`1px solid ${a.buttonBorderColor}`})},[e.createElementVNode("div",Q,[e.createVNode(E.default,{name:"colorPicker",stroke:C.value,size:22},null,8,["stroke"])]),e.createElementVNode("input",{ref_key:"colorInput",ref:h,type:"color",value:a.value,class:"hidden-input",onInput:x},null,40,_)],4)],4)):e.createCommentVNode("",!0)])),[[e.unref(U.vClickOutside),N]])}},G=L._export_sfc(j,[["__scopeId","data-v-84e6c062"]]),J={class:e.normalizeClass({"vue-ui-pen-and-paper-action":!0}),style:{padding:"0 !important"}},K=["disabled"],Z=["xmlns","viewBox","onTouchstart","onTouchmove"],ee=["cx","cy","r","fill"],te=["d","stroke","stroke-width"],oe=["d","stroke","stroke-width"],ne={__name:"PenAndPaper",props:{parent:{type:HTMLElement},backgroundColor:{type:String,default:"#FFFFFF"},color:{type:String,default:"#2D353C"},active:{type:Boolean,default:!1}},emits:["close"],setup(a,{emit:P}){const p=a,f=e.ref([]),h=e.ref([]),g=e.ref("0 0 0 0"),b=e.ref(p.color),B=e.ref(1),y=e.computed(()=>M.lightenHexColor(p.color,.6));function N({width:n,height:o}){g.value=`0 0 ${n} ${o}`}const x=e.ref(null);e.onMounted(()=>{e.nextTick(()=>{if(p.parent){x.value=new ResizeObserver(t=>{for(const l of t){const{width:r,height:c}=l.contentRect;N({width:r,height:c})}}),x.value.observe(p.parent);const{width:n,height:o}=p.parent.getBoundingClientRect();N({width:n,height:o})}})}),e.onBeforeUnmount(()=>{x.value&&x.value.disconnect()}),e.watch(()=>p.parent,n=>{if(!n)return;const{width:o,height:t}=p.parent.getBoundingClientRect();N({width:o,height:t})},{immediate:!0});const C=e.ref(!1),F=e.ref(""),u=e.ref(null);function $(n){if(!u.value)return;C.value=!0;const{x:o,y:t}=D(n);F.value=`M ${o} ${t}`}function w(n){if(!C.value||!u.value)return;const{x:o,y:t}=D(n);F.value+=` ${o} ${t}`}function X(n){const o=n.trim().split(/\s+/);if(o.length<4)return n;const t=o.slice(1).map(Number);if(t.length%2!==0)return n;const l=T(t),r=[`M ${l[0]} ${l[1]}`];for(let i=2;i<l.length-2;i+=2){const k=l[i-2],m=l[i-1],d=l[i],v=l[i+1],V=(k+d)/2,z=(m+v)/2;r.push(`Q ${k} ${m} ${V} ${z}`)}const c=l[l.length-2],s=l[l.length-1];return r.push(`L ${c} ${s}`),r.join(" ")}function T(n,o=1){const t=[...n];for(let l=2;l<n.length-2;l+=2){const r=n[l],c=n[l+1],s=n[l-2],i=n[l-1],k=n[l+2],m=n[l+3];t[l]=r+o*((s+k)/2-r),t[l+1]=c+o*((i+m)/2-c)}return t}function Y(n){const o=n.trim().split(/\s+/);let t="",l="",r=null,c=null;for(let s=0;s<o.length;s+=1){const i=o[s];if(isNaN(i)){if(l=i,l==="M"||l==="L")r=parseFloat(o[++s]),c=parseFloat(o[++s]),t+=`${l}${r} ${c}`;else if(l==="Q"){const k=parseFloat(o[++s]),m=parseFloat(o[++s]),d=parseFloat(o[++s]),v=parseFloat(o[++s]);k===r&&m===c?t+=`t${d-r} ${v-c}`:t+=`q${k-r} ${m-c} ${d-r} ${v-c}`,r=d,c=v}}else{const k=parseFloat(i),m=parseFloat(o[++s]);if(l==="L"){const d=k-r,v=m-c;d===0?t+=`v${v}`:v===0?t+=`h${d}`:t+=`l${d} ${v}`,r=k,c=m}else if(l==="Q"){const d=k,v=m,V=parseFloat(o[++s]),z=parseFloat(o[++s]);d===r&&v===c?t+=`t${V-r} ${z-c}`:t+=`q${d-r} ${v-c} ${V-r} ${z-c}`,r=V,c=z}}}return t}function S(){C.value&&(f.value.push({strokeWidth:B.value,path:Y(X(F.value)),color:b.value}),h.value=[],F.value=""),C.value=!1}function D(n){if(!u.value)return{x:0,y:0};const o=u.value.getBoundingClientRect();let t,l;return n.touches&&n.touches.length?(t=n.touches[0].clientX,l=n.touches[0].clientY):(t=n.clientX,l=n.clientY),{x:t-o.left,y:l-o.top}}e.ref(!1);function q(){if(f.value.length>0){const n=f.value.pop();h.value.push(n)}}function I(){if(h.value.length>0){const n=h.value.pop();f.value.push(n)}}function R(){f.value=[],h.value=[]}const O=e.ref(null);return(n,o)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[a.active?(e.openBlock(),e.createElementBlock("div",{key:0,"data-html2canvas-ignore":"",class:e.normalizeClass({"vue-ui-pen-and-paper-actions":!0,visible:a.active})},[e.createElementVNode("button",{class:"vue-ui-pen-and-paper-action",style:e.normalizeStyle({backgroundColor:a.backgroundColor,border:`1px solid ${y.value}`}),onClick:o[0]||(o[0]=t=>P("close"))},[e.createVNode(E.default,{name:"close",stroke:a.color},null,8,["stroke"])],4),e.createElementVNode("button",J,[e.createVNode(G,{value:b.value,"onUpdate:value":o[1]||(o[1]=t=>b.value=t),backgroundColor:a.backgroundColor,buttonBorderColor:y.value},null,8,["value","backgroundColor","buttonBorderColor"])]),e.createElementVNode("button",{class:e.normalizeClass({"vue-ui-pen-and-paper-action":!0,"vue-ui-pen-and-paper-action-disabled":!f.value.length}),disabled:!f.value.length,style:e.normalizeStyle({backgroundColor:a.backgroundColor,border:`1px solid ${y.value}`}),onClick:q},[e.createVNode(E.default,{name:"restart",stroke:a.color},null,8,["stroke"])],14,K),e.createElementVNode("button",{class:e.normalizeClass({"vue-ui-pen-and-paper-action":!0,"vue-ui-pen-and-paper-action-disabled":!h.value.length}),style:e.normalizeStyle({backgroundColor:a.backgroundColor,border:`1px solid ${y.value}`}),onClick:I},[e.createVNode(E.default,{name:"restart",stroke:a.color,style:{transform:"scaleX(-1)"}},null,8,["stroke"])],6),e.createElementVNode("button",{class:e.normalizeClass([{"vue-ui-pen-and-paper-action":!0,"vue-ui-pen-and-paper-action-disabled":!f.value.length},"vue-ui-pen-and-paper-action"]),style:e.normalizeStyle({backgroundColor:a.backgroundColor,border:`1px solid ${y.value}`}),onClick:R},[e.createVNode(E.default,{name:"trash",stroke:a.color},null,8,["stroke"])],6),e.withDirectives(e.createElementVNode("input",{ref_key:"range",ref:O,type:"range",class:"vertical-range",min:.5,max:12,step:.1,"onUpdate:modelValue":o[2]||(o[2]=t=>B.value=t),style:e.normalizeStyle({accentColor:a.color})},null,4),[[e.vModelText,B.value]])],2)):e.createCommentVNode("",!0),(e.openBlock(),e.createElementBlock("svg",{ref_key:"svgElement",ref:u,xmlns:e.unref(M.XMLNS),viewBox:g.value,class:e.normalizeClass({"vue-ui-pen-and-paper":!0,inactive:!a.active}),onMousedown:$,onMousemove:w,onMouseup:S,onMouseleave:S,onTouchstart:e.withModifiers($,["prevent"]),onTouchmove:e.withModifiers(w,["prevent"]),onTouchend:S},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.value,t=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:t},[t.path.replace("M","").split(" ").length===2?(e.openBlock(),e.createElementBlock("circle",{key:0,cx:t.path.replace("M","").split(" ")[0],cy:t.path.replace("M","").split(" ")[1],r:t.strokeWidth/2,fill:t.color},null,8,ee)):(e.openBlock(),e.createElementBlock("path",{key:1,class:"vue-ui-pen-and-paper-path",d:t.path,stroke:t.color,"stroke-width":t.strokeWidth,fill:"none"},null,8,te))],64))),128)),C.value?(e.openBlock(),e.createElementBlock("path",{key:0,class:"vue-ui-pen-and-paper-path vue-ui-pen-and-paper-path-drawing",d:X(F.value),stroke:b.value,"stroke-width":B.value*1.1,fill:"none"},null,8,oe)):e.createCommentVNode("",!0)],42,Z))],64))}},le=L._export_sfc(ne,[["__scopeId","data-v-a932b1ac"]]);exports.PenAndPaper=le;

package/dist/{Shape-BDC0jxZ3.js → Shape-BKbfblrd.js}

@@ -1,5 +1,5 @@
 import { computed as u, openBlock as l, createElementBlock as i, createCommentVNode as a } from "vue";
-import { V as p, O as f } from "./index-DtgCF1dT.js";
+import { V as p, O as f } from "./index-Du8vv3oo.js";
 const y = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], c = ["d", "fill", "stroke", "stroke-width"], g = ["points", "fill", "stroke", "stroke-width"], $ = {
   __name: "Shape",
   props: {

package/dist/{Shape-eSbBghIf.cjs → Shape-Ck4xWZB_.cjs}

@@ -1 +1 @@
-"use strict";const e=require("vue"),a=require("./index-ConhUMxI.cjs"),c=["cx","cy","r","fill","stroke","stroke-width"],m=["d","fill","stroke","stroke-width"],v=["points","fill","stroke","stroke-width"],p={__name:"Shape",props:{color:String,isSelected:{type:Boolean,default:!1},limit:{type:Number,default:3},plot:Object,radius:Number,shape:String,stroke:String,strokeWidth:Number,zoom:{type:Number,default:1.3}},emits:["mouseover","mouseout","click"],setup(n,{emit:r}){const t=n;function d(u){return{circle:{points:1,rotation:0},line:{points:2,rotation:0},triangle:{points:3,rotation:.52},square:{points:4,rotation:.783},diamond:{points:4,rotation:0},pentagon:{points:5,rotation:.95},hexagon:{points:6,rotation:0}}[u]}const s=e.computed(()=>d(t.shape)),i=e.computed(()=>t.shape!=="star"?null:a.createStar({plot:{x:t.plot.x,y:t.plot.y},radius:t.radius*(t.isSelected?t.zoom:1)})),k=e.computed(()=>a.createPolygonPath({plot:{x:t.plot.x,y:t.plot.y},radius:t.radius*(t.isSelected?t.zoom:1),sides:s.value.points,rotation:s.value.rotation}).path);return(u,o)=>(e.openBlock(),e.createElementBlock("g",null,[s.value&&s.value.points===1?(e.openBlock(),e.createElementBlock("circle",{key:0,cx:n.plot.x,cy:n.plot.y,r:t.radius*(t.isSelected?t.zoom:1),fill:n.color,stroke:n.stroke,"stroke-width":n.strokeWidth,onMouseover:o[0]||(o[0]=l=>r("mouseover")),onMouseout:o[1]||(o[1]=l=>r("mouseout")),onClick:o[2]||(o[2]=l=>r("click"))},null,40,c)):e.createCommentVNode("",!0),s.value&&s.value.points>=n.limit?(e.openBlock(),e.createElementBlock("path",{key:1,d:k.value,fill:n.color,stroke:n.stroke,"stroke-width":n.strokeWidth,onMouseover:o[3]||(o[3]=l=>r("mouseover")),onMouseout:o[4]||(o[4]=l=>r("mouseout")),onClick:o[5]||(o[5]=l=>r("click"))},null,40,m)):e.createCommentVNode("",!0),i.value?(e.openBlock(),e.createElementBlock("polygon",{key:2,points:i.value,fill:n.color,stroke:n.stroke,"stroke-width":n.strokeWidth,onMouseover:o[6]||(o[6]=l=>r("mouseover")),onMouseout:o[7]||(o[7]=l=>r("mouseout")),onClick:o[8]||(o[8]=l=>r("click"))},null,40,v)):e.createCommentVNode("",!0)]))}};exports._sfc_main=p;
+"use strict";const e=require("vue"),a=require("./index-1cntUuUo.cjs"),c=["cx","cy","r","fill","stroke","stroke-width"],m=["d","fill","stroke","stroke-width"],v=["points","fill","stroke","stroke-width"],p={__name:"Shape",props:{color:String,isSelected:{type:Boolean,default:!1},limit:{type:Number,default:3},plot:Object,radius:Number,shape:String,stroke:String,strokeWidth:Number,zoom:{type:Number,default:1.3}},emits:["mouseover","mouseout","click"],setup(n,{emit:r}){const t=n;function d(u){return{circle:{points:1,rotation:0},line:{points:2,rotation:0},triangle:{points:3,rotation:.52},square:{points:4,rotation:.783},diamond:{points:4,rotation:0},pentagon:{points:5,rotation:.95},hexagon:{points:6,rotation:0}}[u]}const s=e.computed(()=>d(t.shape)),i=e.computed(()=>t.shape!=="star"?null:a.createStar({plot:{x:t.plot.x,y:t.plot.y},radius:t.radius*(t.isSelected?t.zoom:1)})),k=e.computed(()=>a.createPolygonPath({plot:{x:t.plot.x,y:t.plot.y},radius:t.radius*(t.isSelected?t.zoom:1),sides:s.value.points,rotation:s.value.rotation}).path);return(u,o)=>(e.openBlock(),e.createElementBlock("g",null,[s.value&&s.value.points===1?(e.openBlock(),e.createElementBlock("circle",{key:0,cx:n.plot.x,cy:n.plot.y,r:t.radius*(t.isSelected?t.zoom:1),fill:n.color,stroke:n.stroke,"stroke-width":n.strokeWidth,onMouseover:o[0]||(o[0]=l=>r("mouseover")),onMouseout:o[1]||(o[1]=l=>r("mouseout")),onClick:o[2]||(o[2]=l=>r("click"))},null,40,c)):e.createCommentVNode("",!0),s.value&&s.value.points>=n.limit?(e.openBlock(),e.createElementBlock("path",{key:1,d:k.value,fill:n.color,stroke:n.stroke,"stroke-width":n.strokeWidth,onMouseover:o[3]||(o[3]=l=>r("mouseover")),onMouseout:o[4]||(o[4]=l=>r("mouseout")),onClick:o[5]||(o[5]=l=>r("click"))},null,40,m)):e.createCommentVNode("",!0),i.value?(e.openBlock(),e.createElementBlock("polygon",{key:2,points:i.value,fill:n.color,stroke:n.stroke,"stroke-width":n.strokeWidth,onMouseover:o[6]||(o[6]=l=>r("mouseover")),onMouseout:o[7]||(o[7]=l=>r("mouseout")),onClick:o[8]||(o[8]=l=>r("click"))},null,40,v)):e.createCommentVNode("",!0)]))}};exports._sfc_main=p;

package/dist/Slicer-C2JTt4Gx.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("vue"),O=require("./BaseIcon-DUo61uTK.cjs"),C=require("./useResponsive-BJ7DTGpm.cjs"),v=require("./index-1cntUuUo.cjs"),T=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),w=l=>(e.pushScopeId("data-v-a7172e39"),l=l(),e.popScopeId(),l),U={"data-html2canvas-ignore":"",style:{padding:"0 24px"},class:"vue-data-ui-zoom"},W={class:"vue-data-ui-slicer-labels",style:{position:"relative","z-index":"1","pointer-events":"none"}},j={key:0,style:{width:"100%",position:"relative"}},X={key:0,class:"minimap",style:{width:"100%"}},Z=["xmlns","viewBox"],_=["id"],G=["stop-color"],H=w(()=>e.createElementVNode("stop",{offset:"100%","stop-color":"transparent"},null,-1)),J=["d","stroke"],K=["x","width","height","fill","rx"],Q=["d","fill"],Y=["x","width","height","rx","fill"],ee=["x","width","height","fill","rx"],te=["d","fill"],le=["d","stroke"],ae=["cx","cy","stroke","fill"],ne=["cx","cy","stroke","fill"],oe=["x1","x2","y2","stroke"],ie=["x","height","width","onMouseenter"],ue=w(()=>e.createElementVNode("div",{class:"slider-track"},null,-1)),re=["min","max"],se=["min","max"],ce={__name:"Slicer",props:{background:{type:String,default:"#FFFFFF"},borderColor:{type:String,default:"#FFFFFF"},fontSize:{type:Number,default:14},labelLeft:{type:String,default:""},labelRight:{type:String,default:""},textColor:{type:String,default:"#1A1A1A"},inputColor:{type:String,default:"#1A1A1A"},max:{type:Number,default:0},min:{type:Number,default:0},selectColor:{type:String,default:"#4A4A4A"},useResetSlot:{type:Boolean,default:!1},valueStart:{type:[Number,String],default:0},valueEnd:{type:[Number,String],default:0},minimap:{type:Array,default:[]},smoothMinimap:{type:Boolean,default:!1},minimapSelectedColor:{type:String,default:"#1f77b4"},minimapSelectionRadius:{type:Number,default:12},minimapLineColor:{type:String,default:"#2D353C"},minimapSelectedColorOpacity:{type:Number,default:.2},minimapSelectedIndex:{type:Number,default:null},minimapIndicatorColor:{type:String,default:"#2D353C"}},emits:["update:start","update:end","reset","trapMouse"],setup(l,{emit:h}){const t=l;e.useCssVars(a=>({"6267c498":B.value,"0b4565e8":f.value,"65e63d06":z.value,"4adae388":l.selectColor,"0d1d7aca":$.value}));const u=e.ref(t.min),r=e.ref(t.max),p=e.computed(()=>!!t.minimap.length),b=e.ref(v.createUid()),V=e.computed(()=>{const a=t.max-t.min,o=(u.value-t.min)/a*100,i=(r.value-t.min)/a*100;return{left:`${o}%`,width:`${i-o}%`,background:t.selectColor}}),B=e.computed(()=>t.inputColor),$=e.computed(()=>t.background),z=e.computed(()=>`${t.selectColor}33`),f=e.computed(()=>t.borderColor),N=e.computed(()=>{let a=[];for(let o=0;o<t.minimap.length;o+=1)a.push(o);return a});function E(){h("reset")}function M(){Number(u.value)>Number(r.value)-1&&(u.value=Number(r.value)-1),h("update:start",Number(u.value))}function L(){Number(r.value)<Number(u.value)+1&&(r.value=Number(u.value)+1),h("update:end",Number(r.value))}e.watch(()=>t.min,a=>{Number(u.value)<Number(a)&&(u.value=Number(a)),Number(r.value)<Number(a)&&(r.value=Number(a))}),e.watch(()=>t.max,a=>{Number(u.value)>Number(a)&&(u.value=Number(a)),Number(r.value)>Number(a)&&(r.value=Number(a))});const g=e.ref(null),n=e.ref({width:0,height:0}),S=e.ref(null);e.onMounted(()=>{if(p.value&&g.value){const a=C.throttle(()=>{requestAnimationFrame(()=>{const{width:c,height:x}=C.useResponsive({chart:g.value});n.value.width=c,n.value.height=Math.max(0,x-47)})});S.value=new ResizeObserver(a),S.value.observe(g.value);const{width:o,height:i}=g.value.getBoundingClientRect();n.value.width=o,n.value.height=i}}),e.onBeforeUnmount(()=>{S.value&&S.value.disconnect()});const s=e.computed(()=>t.minimap.length?n.value.width/t.minimap.length:0),d=e.computed(()=>{if(!t.minimap.length)return[];const a=Math.max(...t.minimap),o=Math.min(...t.minimap)-10,i=a-(o>0?0:o),c=t.minimap.map((A,q)=>{const D=A-o;return{x:n.value.width/t.minimap.length*q+s.value/2,y:n.value.height-D/i*(n.value.height*.9)}}),x=t.smoothMinimap?v.createSmoothPath(c):v.createStraightPath(c),k=[...c].slice(t.valueStart,t.valueEnd),R=t.smoothMinimap?v.createSmoothPath(k):v.createStraightPath(k);return{fullSet:x,selectionSet:R,sliced:k,firstPlot:c[t.valueStart],lastPlot:c[t.valueEnd-1]}}),m=e.computed(()=>({x:s.value*u.value+s.value/2,width:n.value.width*((r.value-u.value)/t.max)-s.value})),F=e.computed(()=>({left:0,color:t.textColor,fontSize:`${t.fontSize}px`,top:p.value?"28px":"-28px",pointerEvents:"none"})),I=e.computed(()=>({right:0,color:t.textColor,fontSize:`${t.fontSize}px`,top:p.value?"28px":"-28px",direction:"rtl",pointerEvents:"none"})),y=e.ref(t.minimapSelectedIndex);e.watch(()=>t.minimapSelectedIndex,a=>{y.value=a+t.valueStart},{immediate:!0});function P(a){y.value=a,a>=t.valueStart&&a<t.valueEnd&&h("trapMouse",a-t.valueStart)}return(a,o)=>(e.openBlock(),e.createElementBlock("div",U,[e.createElementVNode("div",W,[l.valueStart>0||l.valueEnd<l.max?(e.openBlock(),e.createElementBlock("div",j,[l.useResetSlot?e.renderSlot(a.$slots,"reset-action",{key:1,reset:E},void 0,!0):(e.openBlock(),e.createElementBlock("button",{key:0,"data-cy-reset":"",tabindex:"0",role:"button",class:"vue-data-ui-refresh-button",style:e.normalizeStyle({top:p.value?"36px":"-16px",pointerEvents:"all !important"}),onClick:E},[e.createVNode(O.default,{name:"refresh",stroke:l.textColor},null,8,["stroke"])],4))])):e.createCommentVNode("",!0)]),e.createElementVNode("div",{class:"double-range-slider",ref_key:"minimapWrapper",ref:g,style:{"z-index":"0"}},[p.value?(e.openBlock(),e.createElementBlock("div",X,[(e.openBlock(),e.createElementBlock("svg",{xmlns:e.unref(v.XMLNS),viewBox:`0 0 ${n.value.width<0?0:n.value.width} ${n.value.height<0?0:n.value.height}`},[e.createElementVNode("defs",null,[e.createElementVNode("linearGradient",{id:b.value,x1:"0%",y1:"0%",x2:"0%",y2:"100%"},[e.createElementVNode("stop",{offset:"0%","stop-color":`${l.minimapLineColor}50`},null,8,G),H],8,_)]),e.createElementVNode("path",{d:`M${d.value.fullSet}`,stroke:`${l.minimapLineColor}`,fill:"none","stroke-width":"1","stroke-linecap":"round","stroke-linejoin":"round",style:{opacity:"1"}},null,8,J),e.createElementVNode("rect",{x:m.value.x,width:m.value.width<0?0:m.value.width,height:n.value.height,y:0,fill:f.value,rx:l.minimapSelectionRadius,stroke:"none"},null,8,K),e.createElementVNode("path",{d:`M${s.value/2},${n.value.height} ${d.value.fullSet} L${n.value.width-s.value/2},${n.value.height}Z`,fill:`url(#${b.value})`,stroke:"none",style:{opacity:"1"}},null,8,Q),e.createElementVNode("rect",{x:m.value.x,width:m.value.width<0?0:m.value.width,height:n.value.height,y:0,rx:l.minimapSelectionRadius,fill:f.value},null,8,Y),e.createElementVNode("rect",{x:m.value.x,width:m.value.width<0?0:m.value.width,height:n.value.height,y:0,fill:l.minimapSelectedColor,rx:l.minimapSelectionRadius,style:e.normalizeStyle({opacity:l.minimapSelectedColorOpacity})},null,12,ee),e.createElementVNode("path",{d:`M${d.value.sliced[0].x},${n.value.height} ${d.value.selectionSet} L${d.value.sliced.at(-1).x},${n.value.height}Z`,fill:`url(#${b.value})`,stroke:"none",style:{opacity:"1"}},null,8,te),e.createElementVNode("path",{d:`M ${d.value.selectionSet}`,stroke:`${l.minimapLineColor}`,fill:"transparent","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},null,8,le),e.createElementVNode("circle",{cx:d.value.firstPlot.x,cy:d.value.firstPlot.y,"stroke-width":"0.5",stroke:f.value,r:"3",fill:l.minimapLineColor},null,8,ae),e.createElementVNode("circle",{cx:d.value.lastPlot.x,cy:d.value.lastPlot.y,"stroke-width":"0.5",stroke:f.value,r:"3",fill:l.minimapLineColor},null,8,ne),y.value!==null?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(N.value,(i,c)=>(e.openBlock(),e.createElementBlock("g",null,[y.value===i&&i>=l.valueStart&&i<l.valueEnd?(e.openBlock(),e.createElementBlock("line",{key:0,x1:s.value*c+s.value/2,x2:s.value*c+s.value/2,y1:0,y2:n.value.height,stroke:l.minimapIndicatorColor,"stroke-linecap":"round","stroke-dasharray":"2","stroke-width":"1"},null,8,oe)):e.createCommentVNode("",!0)]))),256)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(N.value,(i,c)=>(e.openBlock(),e.createElementBlock("rect",{x:s.value*c,y:0,height:n.value.height,width:s.value<0?0:s.value,fill:"transparent",style:{"pointer-events":"all !important"},onMouseenter:x=>P(i),onMouseleave:o[0]||(o[0]=x=>{y.value=null,h("trapMouse",null)})},null,40,ie))),256))],8,Z))])):e.createCommentVNode("",!0),ue,e.createElementVNode("div",{class:"range-highlight",style:e.normalizeStyle(V.value)},null,4),e.withDirectives(e.createElementVNode("input",{type:"range",class:"range-left",min:l.min,max:l.max,"onUpdate:modelValue":o[1]||(o[1]=i=>u.value=i),onInput:M},null,40,re),[[e.vModelText,u.value]]),e.createElementVNode("div",{class:"thumb-label thumb-label-left",style:e.normalizeStyle(F.value)},e.toDisplayString(l.labelLeft),5),e.withDirectives(e.createElementVNode("input",{type:"range",class:"range-right",min:l.min,max:l.max,"onUpdate:modelValue":o[2]||(o[2]=i=>r.value=i),onInput:L},null,40,se),[[e.vModelText,r.value]]),e.createElementVNode("div",{class:"thumb-label thumb-label-right",style:e.normalizeStyle(I.value)},e.toDisplayString(l.labelRight),5)],512)]))}},de=T._export_sfc(ce,[["__scopeId","data-v-a7172e39"]]);exports.Slicer=de;