@gkucmierz/nano-ui 1.5.1 → 1.5.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/nano-ui.css +1 -1
- package/dist/nano-ui.js +289 -292
- package/package.json +1 -1
package/dist/nano-ui.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.global-tooltip[data-v-37c91a21]{--nu-tooltip-bg:#0f172af2;--nu-tooltip-color:#f8fafc;--nu-tooltip-radius:8px;--nu-tooltip-padding:8px 14px;--nu-tooltip-shadow:0 8px 24px #0000004d;--nu-tooltip-border:1px solid #ffffff1a;--nu-tooltip-arrow-border:#ffffff1a;z-index:99999;background:var(--nu-tooltip-bg);-webkit-backdrop-filter:blur(8px);color:var(--nu-tooltip-color);padding:var(--nu-tooltip-padding);border-radius:var(--nu-tooltip-radius);text-align:center;white-space:normal;word-wrap:break-word;pointer-events:none;width:max-content;max-width:min(350px,100vw - 32px);box-shadow:var(--nu-tooltip-shadow);border:var(--nu-tooltip-border);opacity:0;visibility:hidden;font-size:.85rem;font-weight:500;line-height:1.4;transition:opacity .2s cubic-bezier(.16,1,.3,1),transform .2s cubic-bezier(.16,1,.3,1);position:fixed;top:0;left:0;transform:translateY(4px)scale(.95)}.global-tooltip[data-v-37c91a21]:after{content:"";left:calc(50% + var(--arrow-offset,0px));background:var(--nu-tooltip-bg);-webkit-backdrop-filter:blur(8px);border-right:1px solid var(--nu-tooltip-arrow-border);border-bottom:1px solid var(--nu-tooltip-arrow-border);clip-path:polygon(100% 0,100% 100%,0 100%);border-radius:0 0 2px;width:10px;height:10px;margin-left:-5px;position:absolute;bottom:-5px;transform:rotate(45deg)}.global-tooltip.tooltip-bottom[data-v-37c91a21]:after{border-bottom:none;border-right:none;border-left:1px solid var(--nu-tooltip-arrow-border);border-top:1px solid var(--nu-tooltip-arrow-border);clip-path:polygon(0 0,100% 0,0 100%);border-radius:2px 0 0;top:-5px;bottom:auto}.global-tooltip.visible[data-v-37c91a21]{opacity:1;visibility:visible}:root{--nano-modal-bg:#1e1e24;--nano-modal-glass-bg:#1e1e24d9;--nano-modal-border:#ffffff1a;--nano-modal-text:#fff;--nano-modal-text-muted:#a0a0a0;--nano-modal-backdrop:#0009;--nano-modal-radius:12px;--nano-btn-primary:#3498db;--nano-btn-primary-hover:#2980b9;--nano-btn-secondary:#34495e;--nano-btn-secondary-hover:#2c3e50}.nano-modal-overlay{z-index:99999;background:var(--nano-modal-backdrop);box-sizing:border-box;outline:none;justify-content:center;align-items:center;width:100vw;height:100vh;padding:20px;display:flex;position:fixed;top:0;left:0}.nano-modal-overlay.nano-glass{-webkit-backdrop-filter:blur(8px)}.nano-modal-window{background:var(--nano-modal-bg);border:1px solid var(--nano-modal-border);border-radius:var(--nano-modal-radius);max-height:90vh;color:var(--nano-modal-text);flex-direction:column;display:flex;position:relative;box-shadow:0 24px 48px #00000080}.nano-modal-window:not([style*="position: absolute"]){margin:auto}.nano-glass .nano-modal-window{background:var(--nano-modal-glass-bg);-webkit-backdrop-filter:blur(16px)}.nano-modal-header{border-bottom:1px solid var(--nano-modal-border);-webkit-user-select:none;user-select:none;background:#0003;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.nano-modal-header.is-draggable{cursor:grab}.nano-modal-header.is-draggable:active{cursor:grabbing}.nano-modal-title{margin:0;font-size:1.25rem;font-weight:600;line-height:1.4}.nano-modal-close-btn{color:var(--nano-modal-text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.nano-modal-close-btn:hover{color:var(--nano-modal-text);background:#ffffff1a}.nano-modal-body{flex:1;padding:24px;overflow-y:auto}.nano-modal-footer{border-top:1px solid var(--nano-modal-border);background:#00000026;justify-content:flex-end;padding:16px 24px;display:flex}.nano-modal-actions{gap:12px;display:flex}.nano-btn{cursor:pointer;color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:.95rem;font-weight:600;transition:all .2s}.nano-btn-primary{background:var(--nano-btn-primary)}.nano-btn-primary:hover{background:var(--nano-btn-primary-hover)}.nano-btn-secondary{background:var(--nano-btn-secondary)}.nano-btn-secondary:hover{background:var(--nano-btn-secondary-hover)}.nano-modal-resizer{cursor:se-resize;width:16px;height:16px;color:var(--nano-modal-text-muted);z-index:10;justify-content:center;align-items:center;transition:color .2s;display:flex;position:absolute;bottom:4px;right:4px}.nano-modal-resizer:hover{color:var(--nano-modal-text)}.nano-modal-fade-enter-active,.nano-modal-fade-leave-active{transition:opacity .25s}.nano-modal-fade-enter-active .nano-modal-window{transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.nano-modal-fade-leave-active .nano-modal-window{transition:transform .2s ease-in}.nano-modal-fade-enter-from,.nano-modal-fade-leave-to{opacity:0}.nano-modal-fade-enter-from .nano-modal-window{transform:scale(.9)translateY(10px)}.nano-modal-fade-leave-to .nano-modal-window{transform:scale(.95)translateY(-10px)}.donut-canvas-wrapper[data-v-
|
|
1
|
+
.global-tooltip[data-v-37c91a21]{--nu-tooltip-bg:#0f172af2;--nu-tooltip-color:#f8fafc;--nu-tooltip-radius:8px;--nu-tooltip-padding:8px 14px;--nu-tooltip-shadow:0 8px 24px #0000004d;--nu-tooltip-border:1px solid #ffffff1a;--nu-tooltip-arrow-border:#ffffff1a;z-index:99999;background:var(--nu-tooltip-bg);-webkit-backdrop-filter:blur(8px);color:var(--nu-tooltip-color);padding:var(--nu-tooltip-padding);border-radius:var(--nu-tooltip-radius);text-align:center;white-space:normal;word-wrap:break-word;pointer-events:none;width:max-content;max-width:min(350px,100vw - 32px);box-shadow:var(--nu-tooltip-shadow);border:var(--nu-tooltip-border);opacity:0;visibility:hidden;font-size:.85rem;font-weight:500;line-height:1.4;transition:opacity .2s cubic-bezier(.16,1,.3,1),transform .2s cubic-bezier(.16,1,.3,1);position:fixed;top:0;left:0;transform:translateY(4px)scale(.95)}.global-tooltip[data-v-37c91a21]:after{content:"";left:calc(50% + var(--arrow-offset,0px));background:var(--nu-tooltip-bg);-webkit-backdrop-filter:blur(8px);border-right:1px solid var(--nu-tooltip-arrow-border);border-bottom:1px solid var(--nu-tooltip-arrow-border);clip-path:polygon(100% 0,100% 100%,0 100%);border-radius:0 0 2px;width:10px;height:10px;margin-left:-5px;position:absolute;bottom:-5px;transform:rotate(45deg)}.global-tooltip.tooltip-bottom[data-v-37c91a21]:after{border-bottom:none;border-right:none;border-left:1px solid var(--nu-tooltip-arrow-border);border-top:1px solid var(--nu-tooltip-arrow-border);clip-path:polygon(0 0,100% 0,0 100%);border-radius:2px 0 0;top:-5px;bottom:auto}.global-tooltip.visible[data-v-37c91a21]{opacity:1;visibility:visible}:root{--nano-modal-bg:#1e1e24;--nano-modal-glass-bg:#1e1e24d9;--nano-modal-border:#ffffff1a;--nano-modal-text:#fff;--nano-modal-text-muted:#a0a0a0;--nano-modal-backdrop:#0009;--nano-modal-radius:12px;--nano-btn-primary:#3498db;--nano-btn-primary-hover:#2980b9;--nano-btn-secondary:#34495e;--nano-btn-secondary-hover:#2c3e50}.nano-modal-overlay{z-index:99999;background:var(--nano-modal-backdrop);box-sizing:border-box;outline:none;justify-content:center;align-items:center;width:100vw;height:100vh;padding:20px;display:flex;position:fixed;top:0;left:0}.nano-modal-overlay.nano-glass{-webkit-backdrop-filter:blur(8px)}.nano-modal-window{background:var(--nano-modal-bg);border:1px solid var(--nano-modal-border);border-radius:var(--nano-modal-radius);max-height:90vh;color:var(--nano-modal-text);flex-direction:column;display:flex;position:relative;box-shadow:0 24px 48px #00000080}.nano-modal-window:not([style*="position: absolute"]){margin:auto}.nano-glass .nano-modal-window{background:var(--nano-modal-glass-bg);-webkit-backdrop-filter:blur(16px)}.nano-modal-header{border-bottom:1px solid var(--nano-modal-border);-webkit-user-select:none;user-select:none;background:#0003;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.nano-modal-header.is-draggable{cursor:grab}.nano-modal-header.is-draggable:active{cursor:grabbing}.nano-modal-title{margin:0;font-size:1.25rem;font-weight:600;line-height:1.4}.nano-modal-close-btn{color:var(--nano-modal-text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.nano-modal-close-btn:hover{color:var(--nano-modal-text);background:#ffffff1a}.nano-modal-body{flex:1;padding:24px;overflow-y:auto}.nano-modal-footer{border-top:1px solid var(--nano-modal-border);background:#00000026;justify-content:flex-end;padding:16px 24px;display:flex}.nano-modal-actions{gap:12px;display:flex}.nano-btn{cursor:pointer;color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:.95rem;font-weight:600;transition:all .2s}.nano-btn-primary{background:var(--nano-btn-primary)}.nano-btn-primary:hover{background:var(--nano-btn-primary-hover)}.nano-btn-secondary{background:var(--nano-btn-secondary)}.nano-btn-secondary:hover{background:var(--nano-btn-secondary-hover)}.nano-modal-resizer{cursor:se-resize;width:16px;height:16px;color:var(--nano-modal-text-muted);z-index:10;justify-content:center;align-items:center;transition:color .2s;display:flex;position:absolute;bottom:4px;right:4px}.nano-modal-resizer:hover{color:var(--nano-modal-text)}.nano-modal-fade-enter-active,.nano-modal-fade-leave-active{transition:opacity .25s}.nano-modal-fade-enter-active .nano-modal-window{transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.nano-modal-fade-leave-active .nano-modal-window{transition:transform .2s ease-in}.nano-modal-fade-enter-from,.nano-modal-fade-leave-to{opacity:0}.nano-modal-fade-enter-from .nano-modal-window{transform:scale(.9)translateY(10px)}.nano-modal-fade-leave-to .nano-modal-window{transform:scale(.95)translateY(-10px)}.donut-canvas-wrapper[data-v-e6247870]{flex-shrink:0;justify-content:center;align-items:center;width:120px;height:120px;transition:width .45s cubic-bezier(.25,1,.5,1),height .45s cubic-bezier(.25,1,.5,1);display:flex;position:relative}.donut-canvas-wrapper.is-expanded[data-v-e6247870]{width:100%;max-width:760px;height:320px}@media (width<=760px){.donut-canvas-wrapper.is-expanded[data-v-e6247870]{height:42vw}}.items-svg-chart[data-v-e6247870]{width:100%;height:100%;display:block;overflow:visible}.slice-group-3d[data-v-e6247870]{cursor:pointer;transition:transform .25s cubic-bezier(.25,1,.5,1),opacity .25s}.slice-group-3d.is-dimmed[data-v-e6247870]{opacity:.35}.label-group[data-v-e6247870]{transition:opacity .25s}.label-group path[data-v-e6247870]{transition:d .25s cubic-bezier(.25,1,.5,1),stroke-width .2s,opacity .2s}.label-group text[data-v-e6247870]{transition:transform .25s cubic-bezier(.25,1,.5,1),font-weight .2s,opacity .2s}.label-group.is-hovered path[data-v-e6247870]{stroke-width:2.2px}.label-group.is-hovered text[data-v-e6247870]{font-weight:700}.label-group.is-dimmed[data-v-e6247870]{opacity:.25}.no-transitions .label-group[data-v-e6247870],.no-transitions .label-group path[data-v-e6247870],.no-transitions .label-group text[data-v-e6247870],.no-transitions .slice-group-3d[data-v-e6247870]{transition:none!important}.center-text-value[data-v-e6247870]{fill:#fff;filter:drop-shadow(0 0 3px #000c)}.center-text-label[data-v-e6247870]{fill:#94a3b8;filter:drop-shadow(0 0 2px #000c)}:root[data-theme=light] .center-text-value[data-v-e6247870]{fill:#0f172a;filter:drop-shadow(0 0 3px #ffffffe6)}:root[data-theme=light] .center-text-label[data-v-e6247870]{fill:#475569;filter:drop-shadow(0 0 2px #ffffffe6)}.nano-scrub-track[data-v-429ba0d9]{cursor:ew-resize;-webkit-user-select:none;user-select:none;background:#00e5ff05;border:1px dashed #00e5ff40;border-radius:8px;justify-content:center;align-items:center;width:100%;height:44px;transition:border-color .2s,background-color .2s;display:flex;position:relative;overflow:hidden}.nano-scrub-track[data-v-429ba0d9]:hover{background:#00e5ff0a;border-color:#00e5ff66}.nano-scrub-progress[data-v-429ba0d9]{pointer-events:none;background:#00e5ff0f;height:100%;position:absolute;top:0;left:0}.nano-scrub-label[data-v-429ba0d9]{color:#00e5ff;letter-spacing:.03rem;z-index:1;pointer-events:none;align-items:center;gap:6px;font-size:10px;font-weight:700;display:flex}.nano-scrub-overlay[data-v-429ba0d9]{z-index:99999;pointer-events:none;-webkit-user-select:none;user-select:none;width:100vw;height:100vh;position:fixed;top:0;left:0}.nano-scrub-anchor[data-v-429ba0d9]{background:#00e5ff;border-radius:50%;width:10px;height:10px;position:fixed;transform:translate(-50%,-50%);box-shadow:0 0 12px #00e5ff,0 0 24px #00e5ff66}.nano-scrub-svg-line[data-v-429ba0d9]{width:100vw;height:100vh;position:fixed;top:0;left:0}.nano-scrub-popup[data-v-429ba0d9]{pointer-events:none;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0f172af2;border:1px solid #00e5ff59;border-radius:10px;flex-direction:column;gap:6px;min-width:200px;padding:12px 16px;display:flex;position:fixed;box-shadow:0 10px 30px #0009,0 0 20px #00e5ff26}.nano-scrub-popup-title[data-v-429ba0d9]{text-transform:uppercase;color:#64748b;letter-spacing:.06rem;font-size:10px;font-weight:700}.nano-scrub-popup-val[data-v-429ba0d9]{color:#fff;letter-spacing:.05rem;font-family:monospace;font-size:1.25rem;font-weight:800}.nano-scrub-popup-res[data-v-429ba0d9]{color:#00e5ff;font-size:11px;font-weight:700}span.ripple{background-color:var(--nano-ripple-color,#fff6);pointer-events:none;border-radius:50%;animation:.6s linear nano-ripple-anim;position:absolute;transform:scale(0)}@keyframes nano-ripple-anim{to{opacity:0;transform:scale(4)}}
|
|
2
2
|
/*$vite$:1*/
|
package/dist/nano-ui.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { Fragment as e, Teleport as t, Transition as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l,
|
|
1
|
+
import { Fragment as e, Teleport as t, Transition as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, mergeProps as u, nextTick as d, normalizeClass as f, normalizeStyle as p, onMounted as m, onUnmounted as h, openBlock as g, reactive as _, ref as v, renderList as y, renderSlot as b, resolveDirective as x, toDisplayString as S, unref as C, watch as w, withCtx as T, withDirectives as E, withKeys as D, withModifiers as O } from "vue";
|
|
2
2
|
//#region node_modules/@gkucmierz/analytics/dist/analytics.js
|
|
3
|
-
var
|
|
3
|
+
var k = new class {
|
|
4
4
|
constructor() {
|
|
5
5
|
this.appId = null, this.serverUrl = null, this.sessionId = null, this.isRealUser = !1, this.sessionActive = !1, this.eventQueue = [], this.botFlags = [];
|
|
6
6
|
}
|
|
@@ -95,124 +95,124 @@ var O = new class {
|
|
|
95
95
|
});
|
|
96
96
|
}
|
|
97
97
|
}();
|
|
98
|
-
typeof window < "u" && (window.Analytics =
|
|
98
|
+
typeof window < "u" && (window.Analytics = k);
|
|
99
99
|
//#endregion
|
|
100
100
|
//#region src/directives/ripple.js
|
|
101
|
-
var
|
|
101
|
+
var A = { mounted(e, t) {
|
|
102
102
|
e.style.position = "relative", e.style.overflow = "hidden", e.addEventListener("click", function(n) {
|
|
103
103
|
let r = e.getBoundingClientRect(), i = n.clientX - r.left, a = n.clientY - r.top, o = document.createElement("span"), s = Math.max(r.width, r.height), c = s / 2;
|
|
104
104
|
o.style.width = o.style.height = `${s}px`, o.style.left = `${i - c}px`, o.style.top = `${a - c}px`, o.classList.add("ripple"), t.value && typeof t.value == "string" && (o.style.backgroundColor = t.value), e.appendChild(o), setTimeout(() => {
|
|
105
105
|
o.remove();
|
|
106
106
|
}, 600);
|
|
107
107
|
});
|
|
108
|
-
} },
|
|
108
|
+
} }, j = _({
|
|
109
109
|
isVisible: !1,
|
|
110
110
|
text: "",
|
|
111
111
|
customClass: "",
|
|
112
112
|
targetRect: null
|
|
113
113
|
});
|
|
114
|
-
function
|
|
114
|
+
function M(e, t) {
|
|
115
115
|
if (!t) return;
|
|
116
116
|
let n = typeof t == "object" ? t.text : t, r = typeof t == "object" && t.class || "";
|
|
117
117
|
if (!n) return;
|
|
118
118
|
e.hasAttribute("aria-label") || e.setAttribute("aria-label", n);
|
|
119
119
|
let i = e.getBoundingClientRect();
|
|
120
|
-
|
|
120
|
+
j.targetRect = {
|
|
121
121
|
top: i.top,
|
|
122
122
|
left: i.left,
|
|
123
123
|
width: i.width,
|
|
124
124
|
bottom: i.bottom,
|
|
125
125
|
right: i.right
|
|
126
|
-
},
|
|
126
|
+
}, j.text = n, j.customClass = r, j.isVisible = !0;
|
|
127
127
|
}
|
|
128
|
-
typeof window < "u" && window.addEventListener("scroll",
|
|
128
|
+
typeof window < "u" && window.addEventListener("scroll", N, {
|
|
129
129
|
passive: !0,
|
|
130
130
|
capture: !0
|
|
131
131
|
});
|
|
132
|
-
function
|
|
133
|
-
|
|
132
|
+
function N() {
|
|
133
|
+
j.isVisible = !1;
|
|
134
134
|
}
|
|
135
135
|
//#endregion
|
|
136
136
|
//#region src/directives/tooltip.js
|
|
137
|
-
var
|
|
137
|
+
var P = {
|
|
138
138
|
mounted(e, t) {
|
|
139
139
|
e._tooltipOptions = t.value;
|
|
140
140
|
let n = null, r = !1;
|
|
141
141
|
e._handleMouseEnter = () => {
|
|
142
|
-
r ||
|
|
142
|
+
r || M(e, e._tooltipOptions);
|
|
143
143
|
}, e._handleMouseLeave = () => {
|
|
144
|
-
r ||
|
|
144
|
+
r || N();
|
|
145
145
|
}, e._handleFocus = () => {
|
|
146
|
-
r ||
|
|
146
|
+
r || M(e, e._tooltipOptions);
|
|
147
147
|
}, e._handleBlur = () => {
|
|
148
|
-
r ||
|
|
148
|
+
r || N();
|
|
149
149
|
}, e._handleTouchStart = () => {
|
|
150
150
|
r = !0, n && clearTimeout(n), n = setTimeout(() => {
|
|
151
|
-
|
|
151
|
+
M(e, e._tooltipOptions);
|
|
152
152
|
}, 400);
|
|
153
153
|
}, e._handleTouchEnd = () => {
|
|
154
|
-
n && clearTimeout(n),
|
|
154
|
+
n && clearTimeout(n), N(), setTimeout(() => {
|
|
155
155
|
r = !1;
|
|
156
156
|
}, 500);
|
|
157
157
|
}, e._handleTouchCancel = () => {
|
|
158
|
-
n && clearTimeout(n),
|
|
158
|
+
n && clearTimeout(n), N(), setTimeout(() => {
|
|
159
159
|
r = !1;
|
|
160
160
|
}, 500);
|
|
161
161
|
}, e._handleContextMenu = (t) => {
|
|
162
162
|
let n = typeof e._tooltipOptions == "object" ? e._tooltipOptions.text : e._tooltipOptions;
|
|
163
|
-
r &&
|
|
163
|
+
r && j.isVisible && j.text === n && t.preventDefault();
|
|
164
164
|
}, e.addEventListener("mouseenter", e._handleMouseEnter), e.addEventListener("mouseleave", e._handleMouseLeave), e.addEventListener("focus", e._handleFocus), e.addEventListener("blur", e._handleBlur), e.addEventListener("touchstart", e._handleTouchStart, { passive: !0 }), e.addEventListener("touchend", e._handleTouchEnd), e.addEventListener("touchmove", e._handleTouchCancel, { passive: !0 }), e.addEventListener("touchcancel", e._handleTouchCancel), e.addEventListener("contextmenu", e._handleContextMenu);
|
|
165
165
|
},
|
|
166
166
|
updated(e, t) {
|
|
167
167
|
e._tooltipOptions = t.value;
|
|
168
168
|
let n = typeof t.value == "object" ? t.value.text : t.value;
|
|
169
|
-
|
|
169
|
+
j.isVisible && j.text !== n && (e.matches(":hover") || document.activeElement === e) && M(e, t.value);
|
|
170
170
|
},
|
|
171
171
|
unmounted(e) {
|
|
172
|
-
e._handleMouseEnter && (e.removeEventListener("mouseenter", e._handleMouseEnter), e.removeEventListener("mouseleave", e._handleMouseLeave), e.removeEventListener("focus", e._handleFocus), e.removeEventListener("blur", e._handleBlur), e.removeEventListener("touchstart", e._handleTouchStart), e.removeEventListener("touchend", e._handleTouchEnd), e.removeEventListener("touchmove", e._handleTouchCancel), e.removeEventListener("touchcancel", e._handleTouchCancel), e.removeEventListener("contextmenu", e._handleContextMenu)),
|
|
172
|
+
e._handleMouseEnter && (e.removeEventListener("mouseenter", e._handleMouseEnter), e.removeEventListener("mouseleave", e._handleMouseLeave), e.removeEventListener("focus", e._handleFocus), e.removeEventListener("blur", e._handleBlur), e.removeEventListener("touchstart", e._handleTouchStart), e.removeEventListener("touchend", e._handleTouchEnd), e.removeEventListener("touchmove", e._handleTouchCancel), e.removeEventListener("touchcancel", e._handleTouchCancel), e.removeEventListener("contextmenu", e._handleContextMenu)), N();
|
|
173
173
|
}
|
|
174
|
-
},
|
|
174
|
+
}, F = (e, t) => {
|
|
175
175
|
let n = e.__vccOpts || e;
|
|
176
176
|
for (let [e, r] of t) n[e] = r;
|
|
177
177
|
return n;
|
|
178
|
-
},
|
|
178
|
+
}, I = /* @__PURE__ */ F({
|
|
179
179
|
__name: "GlobalTooltip",
|
|
180
180
|
setup(e) {
|
|
181
|
-
let t =
|
|
182
|
-
return
|
|
181
|
+
let t = v(null), n = v(0), r = v(0), i = v(0), a = v(!1);
|
|
182
|
+
return w(() => j.isVisible, async (e) => {
|
|
183
183
|
if (e) {
|
|
184
|
-
if (await
|
|
185
|
-
let e =
|
|
186
|
-
a.value = !1, (f < 8 || l < o.height + 8 &&
|
|
184
|
+
if (await d(), !t.value || !j.targetRect) return;
|
|
185
|
+
let e = j.targetRect, o = t.value.getBoundingClientRect(), s = window.innerWidth, c = window.innerHeight, l = e.top, u = c - e.bottom, f = e.top - o.height - 8;
|
|
186
|
+
a.value = !1, (f < 8 || l < o.height + 8 && u > l) && (f = e.bottom + 8, a.value = !0), f + o.height > c - 8 && (f = c - o.height - 8), f < 8 && (f = 8);
|
|
187
187
|
let p = e.left + e.width / 2, m = p - o.width / 2;
|
|
188
188
|
m < 8 ? m = 8 : m + o.width > s - 8 && (m = s - o.width - 8);
|
|
189
189
|
let h = p - (m + o.width / 2), g = o.width / 2 - 12;
|
|
190
190
|
h > g && (h = g), h < -g && (h = -g), i.value = h, n.value = m, r.value = f;
|
|
191
191
|
}
|
|
192
|
-
}), (e, s) => (
|
|
192
|
+
}), (e, s) => (g(), o("div", {
|
|
193
193
|
ref_key: "tooltipRef",
|
|
194
194
|
ref: t,
|
|
195
|
-
class:
|
|
195
|
+
class: f([
|
|
196
196
|
"global-tooltip",
|
|
197
197
|
{
|
|
198
|
-
visible:
|
|
198
|
+
visible: C(j).isVisible,
|
|
199
199
|
"tooltip-bottom": a.value
|
|
200
200
|
},
|
|
201
|
-
|
|
201
|
+
C(j).customClass
|
|
202
202
|
]),
|
|
203
|
-
style:
|
|
203
|
+
style: p({
|
|
204
204
|
transform: `translate(${n.value}px, ${r.value}px)`,
|
|
205
205
|
"--arrow-offset": `${i.value}px`
|
|
206
206
|
})
|
|
207
|
-
},
|
|
207
|
+
}, S(C(j).text), 7));
|
|
208
208
|
}
|
|
209
|
-
}, [["__scopeId", "data-v-37c91a21"]]),
|
|
209
|
+
}, [["__scopeId", "data-v-37c91a21"]]), L = { class: "nano-modal-title" }, R = {
|
|
210
210
|
key: 1,
|
|
211
211
|
class: "nano-modal-body"
|
|
212
|
-
},
|
|
212
|
+
}, z = {
|
|
213
213
|
key: 2,
|
|
214
214
|
class: "nano-modal-footer"
|
|
215
|
-
},
|
|
215
|
+
}, B = { class: "nano-modal-actions" }, V = {
|
|
216
216
|
__name: "NanoModal",
|
|
217
217
|
props: {
|
|
218
218
|
visible: {
|
|
@@ -293,79 +293,79 @@ var N = {
|
|
|
293
293
|
"ok",
|
|
294
294
|
"cancel"
|
|
295
295
|
],
|
|
296
|
-
setup(e, { emit:
|
|
297
|
-
let
|
|
296
|
+
setup(e, { emit: u }) {
|
|
297
|
+
let m = e, _ = u, y = v(null), C = v(null), k = v(null), A = v(null), j = v(null), M = v(null), N = v(!1), P = v(!1), F = 0, I = 0, V = 0, ee = 0, H = 0, te = 0, ne = 0, re = 0, ie = r(() => {
|
|
298
298
|
let e = {};
|
|
299
|
-
return j.value === null ? (e.maxWidth = typeof
|
|
300
|
-
}),
|
|
301
|
-
if (
|
|
302
|
-
if (N.value = !0, F = e.clientX,
|
|
303
|
-
let e =
|
|
299
|
+
return j.value === null ? (e.maxWidth = typeof m.width == "number" ? `${m.width}px` : m.width, e.width = "100%") : (e.width = `${j.value}px`, e.maxWidth = "none"), M.value === null ? m.height !== "auto" && (e.height = typeof m.height == "number" ? `${m.height}px` : m.height) : (e.height = `${M.value}px`, e.maxHeight = "none"), k.value !== null && A.value !== null && (e.position = "absolute", e.left = `${k.value}px`, e.top = `${A.value}px`, e.transform = "none", e.margin = "0"), e;
|
|
300
|
+
}), ae = (e) => {
|
|
301
|
+
if (m.draggable && !(e.target.tagName === "BUTTON" || e.target.closest("button"))) {
|
|
302
|
+
if (N.value = !0, F = e.clientX, I = e.clientY, k.value === null) {
|
|
303
|
+
let e = C.value.getBoundingClientRect();
|
|
304
304
|
k.value = e.left, A.value = e.top, j.value === null && (j.value = e.width), M.value === null && (M.value = e.height);
|
|
305
305
|
}
|
|
306
|
-
|
|
306
|
+
V = k.value, ee = A.value, window.addEventListener("mousemove", oe), window.addEventListener("mouseup", se);
|
|
307
307
|
}
|
|
308
|
-
},
|
|
308
|
+
}, oe = (e) => {
|
|
309
309
|
if (!N.value) return;
|
|
310
|
-
let t =
|
|
310
|
+
let t = V + (e.clientX - F), n = ee + (e.clientY - I), r = window.innerWidth, i = window.innerHeight, a = C.value.getBoundingClientRect();
|
|
311
311
|
t < 0 && (t = 0), n < 0 && (n = 0), t + a.width > r && (t = r - a.width), n + a.height > i && (n = i - a.height), k.value = t, A.value = n;
|
|
312
|
-
},
|
|
313
|
-
N.value = !1, window.removeEventListener("mousemove",
|
|
312
|
+
}, se = () => {
|
|
313
|
+
N.value = !1, window.removeEventListener("mousemove", oe), window.removeEventListener("mouseup", se);
|
|
314
|
+
}, ce = (e) => {
|
|
315
|
+
if (!m.resizable) return;
|
|
316
|
+
e.preventDefault(), e.stopPropagation(), P.value = !0, H = e.clientX, te = e.clientY;
|
|
317
|
+
let t = C.value.getBoundingClientRect();
|
|
318
|
+
k.value === null && (k.value = t.left, A.value = t.top), ne = t.width, re = t.height, window.addEventListener("mousemove", le), window.addEventListener("mouseup", ue);
|
|
314
319
|
}, le = (e) => {
|
|
315
|
-
if (!g.resizable) return;
|
|
316
|
-
e.preventDefault(), e.stopPropagation(), P.value = !0, V = e.clientX, ne = e.clientY;
|
|
317
|
-
let t = O.value.getBoundingClientRect();
|
|
318
|
-
k.value === null && (k.value = t.left, A.value = t.top), re = t.width, ie = t.height, window.addEventListener("mousemove", ue), window.addEventListener("mouseup", de);
|
|
319
|
-
}, ue = (e) => {
|
|
320
320
|
if (!P.value) return;
|
|
321
|
-
let t =
|
|
322
|
-
t <
|
|
321
|
+
let t = ne + (e.clientX - H), n = re + (e.clientY - te);
|
|
322
|
+
t < m.minWidth && (t = m.minWidth), n < m.minHeight && (n = m.minHeight);
|
|
323
323
|
let r = window.innerWidth - k.value, i = window.innerHeight - A.value;
|
|
324
324
|
t > r && (t = r), n > i && (n = i), j.value = t, M.value = n;
|
|
325
|
-
},
|
|
326
|
-
P.value = !1, window.removeEventListener("mousemove",
|
|
327
|
-
},
|
|
328
|
-
|
|
325
|
+
}, ue = () => {
|
|
326
|
+
P.value = !1, window.removeEventListener("mousemove", le), window.removeEventListener("mouseup", ue);
|
|
327
|
+
}, de = (e) => {
|
|
328
|
+
m.visible && e.key === "Escape" && (e.preventDefault(), e.stopPropagation(), fe());
|
|
329
329
|
};
|
|
330
|
-
|
|
331
|
-
e ? (k.value = null, A.value = null, j.value = null, M.value = null, document.body.style.overflow = "hidden", window.addEventListener("keydown",
|
|
332
|
-
}),
|
|
333
|
-
document.body.style.overflow = "", window.removeEventListener("keydown",
|
|
330
|
+
w(() => m.visible, async (e) => {
|
|
331
|
+
e ? (k.value = null, A.value = null, j.value = null, M.value = null, document.body.style.overflow = "hidden", window.addEventListener("keydown", de, { capture: !0 }), await d(), y.value && y.value.focus()) : (document.body.style.overflow = "", window.removeEventListener("keydown", de, { capture: !0 }), se(), ue());
|
|
332
|
+
}), h(() => {
|
|
333
|
+
document.body.style.overflow = "", window.removeEventListener("keydown", de, { capture: !0 }), se(), ue();
|
|
334
334
|
});
|
|
335
|
-
let
|
|
336
|
-
|
|
337
|
-
},
|
|
338
|
-
|
|
335
|
+
let fe = () => _("close"), pe = () => {
|
|
336
|
+
m.closeOnBackdrop && fe();
|
|
337
|
+
}, me = () => _("ok"), he = () => {
|
|
338
|
+
_("cancel"), fe();
|
|
339
339
|
};
|
|
340
340
|
return (r, u) => {
|
|
341
|
-
let
|
|
342
|
-
return
|
|
343
|
-
default:
|
|
341
|
+
let d = x("ripple");
|
|
342
|
+
return g(), i(t, { to: "body" }, [l(n, { name: "nano-modal-fade" }, {
|
|
343
|
+
default: T(() => [e.visible ? (g(), o("div", {
|
|
344
344
|
key: 0,
|
|
345
|
-
class:
|
|
346
|
-
onClick:
|
|
347
|
-
onKeydown: u[1] ||=
|
|
345
|
+
class: f(["nano-modal-overlay", { "nano-glass": e.glassmorphism }]),
|
|
346
|
+
onClick: O(pe, ["self"]),
|
|
347
|
+
onKeydown: u[1] ||= D(O((...e) => r.handleEsc && r.handleEsc(...e), ["stop"]), ["esc"]),
|
|
348
348
|
tabindex: "-1",
|
|
349
349
|
ref_key: "modalOverlay",
|
|
350
|
-
ref:
|
|
350
|
+
ref: y
|
|
351
351
|
}, [s("div", {
|
|
352
|
-
class:
|
|
352
|
+
class: f(["nano-modal-window", {
|
|
353
353
|
"is-dragging": N.value,
|
|
354
354
|
"is-resizing": P.value
|
|
355
355
|
}]),
|
|
356
|
-
style:
|
|
356
|
+
style: p(ie.value),
|
|
357
357
|
ref_key: "modalWindow",
|
|
358
|
-
ref:
|
|
358
|
+
ref: C
|
|
359
359
|
}, [
|
|
360
|
-
e.showHeader ? (
|
|
360
|
+
e.showHeader ? (g(), o("div", {
|
|
361
361
|
key: 0,
|
|
362
|
-
class:
|
|
363
|
-
onMousedown:
|
|
364
|
-
}, [
|
|
362
|
+
class: f(["nano-modal-header", { "is-draggable": e.draggable }]),
|
|
363
|
+
onMousedown: ae
|
|
364
|
+
}, [b(r.$slots, "header", {}, () => [s("h2", L, S(e.title), 1)]), s("button", {
|
|
365
365
|
class: "nano-modal-close-btn",
|
|
366
|
-
onClick:
|
|
366
|
+
onClick: O(fe, ["stop"]),
|
|
367
367
|
"aria-label": "Close",
|
|
368
|
-
onMousedown: u[0] ||=
|
|
368
|
+
onMousedown: u[0] ||= O(() => {}, ["stop"])
|
|
369
369
|
}, [...u[2] ||= [s("svg", {
|
|
370
370
|
xmlns: "http://www.w3.org/2000/svg",
|
|
371
371
|
width: "24",
|
|
@@ -387,20 +387,20 @@ var N = {
|
|
|
387
387
|
x2: "18",
|
|
388
388
|
y2: "18"
|
|
389
389
|
})], -1)]], 32)], 34)) : a("", !0),
|
|
390
|
-
e.showBody ? (
|
|
391
|
-
e.showFooter ? (
|
|
390
|
+
e.showBody ? (g(), o("div", R, [b(r.$slots, "body")])) : a("", !0),
|
|
391
|
+
e.showFooter ? (g(), o("div", z, [b(r.$slots, "footer", {}, () => [s("div", B, [e.showCancel ? E((g(), o("button", {
|
|
392
392
|
key: 0,
|
|
393
393
|
class: "nano-btn nano-btn-secondary",
|
|
394
|
-
onClick: ge
|
|
395
|
-
}, [c(x(e.cancelText), 1)])), [[p]]) : a("", !0), e.showOk ? T((h(), o("button", {
|
|
396
|
-
key: 1,
|
|
397
|
-
class: d(["nano-btn", "nano-btn-" + e.okVariant]),
|
|
398
394
|
onClick: he
|
|
399
|
-
}, [c(
|
|
400
|
-
|
|
395
|
+
}, [c(S(e.cancelText), 1)])), [[d]]) : a("", !0), e.showOk ? E((g(), o("button", {
|
|
396
|
+
key: 1,
|
|
397
|
+
class: f(["nano-btn", "nano-btn-" + e.okVariant]),
|
|
398
|
+
onClick: me
|
|
399
|
+
}, [c(S(e.okText), 1)], 2)), [[d]]) : a("", !0)])])])) : a("", !0),
|
|
400
|
+
e.resizable ? (g(), o("div", {
|
|
401
401
|
key: 3,
|
|
402
402
|
class: "nano-modal-resizer",
|
|
403
|
-
onMousedown:
|
|
403
|
+
onMousedown: ce
|
|
404
404
|
}, [...u[3] ||= [s("svg", {
|
|
405
405
|
width: "10",
|
|
406
406
|
height: "10",
|
|
@@ -419,7 +419,7 @@ var N = {
|
|
|
419
419
|
})]);
|
|
420
420
|
};
|
|
421
421
|
}
|
|
422
|
-
}, ee = ["viewBox"],
|
|
422
|
+
}, ee = ["viewBox"], H = { key: 0 }, te = [
|
|
423
423
|
"id",
|
|
424
424
|
"x1",
|
|
425
425
|
"y1",
|
|
@@ -433,7 +433,7 @@ var N = {
|
|
|
433
433
|
"id",
|
|
434
434
|
"y1",
|
|
435
435
|
"y2"
|
|
436
|
-
], ce = ["stop-color"], le = ["stop-color"], ue = { key: 1 }, de = ["x", "y"], fe = { key: 2 }, pe = ["d", "fill"], me = ["d", "stroke"], he = ["d", "fill"], ge = ["d", "fill"], _e = ["d", "fill"], ve = ["d", "stroke"], ye = ["d", "fill"], be = ["d", "stroke"], xe = ["d", "stroke-width"], Se = ["transform"], Ce = ["font-size"], we = ["font-size"], Te = ["d", "fill"], Ee = ["d", "stroke"], De = ["d", "fill"], Oe = ["d", "fill"], ke = ["d", "fill"], Ae = ["d", "stroke"], je = ["d", "fill"], Me = ["d", "stroke"], Ne = ["d", "stroke-width"], Pe = ["onMouseenter", "onClick"], Fe = ["d"], Ie = ["d"], Le = ["onMouseenter", "onClick"], Re = ["d", "stroke"], ze = ["y", "fill"], Be = ["onMouseenter", "onClick"], Ve = ["d", "stroke"], He = ["y", "fill"],
|
|
436
|
+
], ce = ["stop-color"], le = ["stop-color"], ue = { key: 1 }, de = ["x", "y"], fe = { key: 2 }, pe = ["d", "fill"], me = ["d", "stroke"], he = ["d", "fill"], ge = ["d", "fill"], _e = ["d", "fill"], ve = ["d", "stroke"], ye = ["d", "fill"], be = ["d", "stroke"], xe = ["d", "stroke-width"], Se = ["transform"], Ce = ["font-size"], we = ["font-size"], Te = ["d", "fill"], Ee = ["d", "stroke"], De = ["d", "fill"], Oe = ["d", "fill"], ke = ["d", "fill"], Ae = ["d", "stroke"], je = ["d", "fill"], Me = ["d", "stroke"], Ne = ["d", "stroke-width"], Pe = ["onMouseenter", "onClick"], Fe = ["d"], Ie = ["d"], Le = ["onMouseenter", "onClick"], Re = ["d", "stroke"], ze = ["y", "fill"], Be = ["onMouseenter", "onClick"], Ve = ["d", "stroke"], He = ["y", "fill"], Ue = /* @__PURE__ */ F({
|
|
437
437
|
__name: "ThreeDDonutChart",
|
|
438
438
|
props: {
|
|
439
439
|
data: {
|
|
@@ -532,26 +532,26 @@ var N = {
|
|
|
532
532
|
},
|
|
533
533
|
emits: ["update:hoveredItemId", "update:selectedItemId"],
|
|
534
534
|
setup(t, { expose: n, emit: i }) {
|
|
535
|
-
let c = t, l = i,
|
|
535
|
+
let c = t, l = i, u = null, _ = v(null), b = v(null), x = r({
|
|
536
536
|
get() {
|
|
537
537
|
return c.selectedItemId !== void 0 && c.selectedItemId !== null ? c.selectedItemId : b.value;
|
|
538
538
|
},
|
|
539
539
|
set(e) {
|
|
540
540
|
b.value = e, l("update:selectedItemId", e);
|
|
541
541
|
}
|
|
542
|
-
}),
|
|
543
|
-
!c.selectable || j.value || (T = !0,
|
|
542
|
+
}), C = r(() => j.value ? null : _.value === null ? c.selectable ? x.value : null : _.value), T = !1, E = (e) => {
|
|
543
|
+
!c.selectable || j.value || (T = !0, x.value === e ? x.value = null : x.value = e);
|
|
544
544
|
}, D = (e) => {
|
|
545
|
-
j.value || (
|
|
546
|
-
}, O =
|
|
545
|
+
j.value || (_.value = e);
|
|
546
|
+
}, O = v(null), k = (e) => {
|
|
547
547
|
if (c.selectable) {
|
|
548
548
|
if (T) {
|
|
549
549
|
T = !1;
|
|
550
550
|
return;
|
|
551
551
|
}
|
|
552
|
-
O.value && O.value.contains(e.target) && (
|
|
552
|
+
O.value && O.value.contains(e.target) && (x.value = null);
|
|
553
553
|
}
|
|
554
|
-
}, A =
|
|
554
|
+
}, A = v([]), j = r(() => (c.data || []).filter((e) => e.value > .001).length <= 1), M = [
|
|
555
555
|
"#3b82f6",
|
|
556
556
|
"#10b981",
|
|
557
557
|
"#a855f7",
|
|
@@ -631,12 +631,12 @@ var N = {
|
|
|
631
631
|
percentage: n
|
|
632
632
|
};
|
|
633
633
|
});
|
|
634
|
-
}),
|
|
634
|
+
}), V = r(() => A.value.reduce((e, t) => e + t.value, 0)), Ue = r(() => {
|
|
635
635
|
if (c.centerValue !== void 0 && c.centerValue !== "") return c.centerValue;
|
|
636
|
-
let e =
|
|
637
|
-
return e ? c.centerValueFormatter ? c.centerValueFormatter(e.item.value, e.item) : L(e.item.value) : c.centerValueFormatter ? c.centerValueFormatter(
|
|
636
|
+
let e = $.value.find((e) => e.item.id === C.value);
|
|
637
|
+
return e ? c.centerValueFormatter ? c.centerValueFormatter(e.item.value, e.item) : L(e.item.value) : c.centerValueFormatter ? c.centerValueFormatter(V.value, null) : c.valueDecimals === void 0 ? Math.round(V.value) : L(V.value);
|
|
638
638
|
}), We = r(() => {
|
|
639
|
-
let e =
|
|
639
|
+
let e = $.value.find((e) => e.item.id === C.value);
|
|
640
640
|
return e ? R(e.item.name, 12).toUpperCase() : (c.centerLabel || "").toUpperCase();
|
|
641
641
|
}), Ge = (e, t = !1) => {
|
|
642
642
|
let n = new Map(A.value.map((e) => [e.id, e])), r = new Map(e.map((e) => [e.id, e])), i = [];
|
|
@@ -697,18 +697,18 @@ var N = {
|
|
|
697
697
|
l < o ? (o = l, a = e, s = u) : l === o && u < s && (a = e, s = u);
|
|
698
698
|
}
|
|
699
699
|
return a;
|
|
700
|
-
}, qe = r(() => c.autoRotate && B.value && B.value.length > 0 ? Ke(B.value, c.rotationAngle) : c.rotationAngle), U =
|
|
701
|
-
let e = (
|
|
700
|
+
}, qe = r(() => c.autoRotate && B.value && B.value.length > 0 ? Ke(B.value, c.rotationAngle) : c.rotationAngle), U = v(qe.value), Je = v(!1), Ye = v(!1), Xe = null, W = c.is3D, G = v(c.isExpanded ? 380 : 60), K = v(c.isExpanded ? 160 : 60), q = v(c.isExpanded ? 180 : 48), J = v(c.isExpanded ? W ? 180 * c.slopeRatio : 180 : W ? 48 * c.slopeRatio : 48), Y = v(c.isExpanded ? 180 * (1 - c.thickness) : 48 * (1 - c.thickness)), X = v(c.isExpanded ? W ? 180 * (1 - c.thickness) * c.slopeRatio : 180 * (1 - c.thickness) : W ? 48 * (1 - c.thickness) * c.slopeRatio : 48 * (1 - c.thickness)), Ze = c.isExpanded && W ? 32 : 0, Z = v(W && c.slopeRatio > .5 ? Ze * (2 - 2 * c.slopeRatio) : Ze), Qe = v(c.isExpanded ? 760 : 120), $e = v(c.isExpanded ? 320 : 120), Q = v(c.isExpanded && c.showLabels ? 1 : 0), et = r(() => {
|
|
701
|
+
let e = (q.value - 48) / 132;
|
|
702
702
|
return 13 + 6 * Math.max(0, Math.min(1, e));
|
|
703
|
-
}),
|
|
704
|
-
let e = (
|
|
703
|
+
}), tt = r(() => {
|
|
704
|
+
let e = (q.value - 48) / 132;
|
|
705
705
|
return 7 + 1.5 * Math.max(0, Math.min(1, e));
|
|
706
|
-
}),
|
|
707
|
-
let e = A.value, t =
|
|
706
|
+
}), nt = r(() => K.value - Z.value / 2), $ = r(() => {
|
|
707
|
+
let e = A.value, t = V.value;
|
|
708
708
|
if (t === 0) return [];
|
|
709
|
-
let n = [], r = U.value * Math.PI / 180, i =
|
|
710
|
-
|
|
711
|
-
let a =
|
|
709
|
+
let n = [], r = U.value * Math.PI / 180, i = G.value;
|
|
710
|
+
K.value;
|
|
711
|
+
let a = q.value, o = J.value, s = Y.value, l = X.value, u = Z.value, d = nt.value, f = e.filter((e) => e.value > .001);
|
|
712
712
|
if (f.length === 1) {
|
|
713
713
|
let t = f[0], n = e.indexOf(t), r = F(t, n), p = `M ${i - a} ${d} A ${a} ${o} 0 0 1 ${i + a} ${d} A ${a} ${o} 0 0 1 ${i - a} ${d} M ${i - s} ${d} A ${s} ${l} 0 0 0 ${i + s} ${d} A ${s} ${l} 0 0 0 ${i - s} ${d} Z`, m = "", h = "";
|
|
714
714
|
u > 0 && (m = `M ${i + a} ${d} A ${a} ${o} 0 0 1 ${i - a} ${d} L ${i - a} ${d + u} A ${a} ${o} 0 0 0 ${i + a} ${d + u} Z`, h = `M ${i - s} ${d} A ${s} ${l} 0 0 1 ${i + s} ${d} L ${i + s} ${d + u} A ${s} ${l} 0 0 0 ${i - s} ${d + u} Z`);
|
|
@@ -806,7 +806,7 @@ var N = {
|
|
|
806
806
|
M ? (P = `M ${h} ${v} A ${a} ${o} 0 ${T} 1 ${y} ${b} M ${x} ${S} A ${s} ${l} 0 ${T} 0 ${C} ${w}`, N || (P += ` L ${h} ${v}`)) : (P = `M ${h} ${v} A ${a} ${o} 0 ${T} 1 ${y} ${b} L ${x} ${S} A ${s} ${l} 0 ${T} 0 ${C} ${w}`, N || (P += " Z"));
|
|
807
807
|
let F = "", I = "", L = "", R = "", z = "", B = "";
|
|
808
808
|
u > 0 && (F = `M ${h} ${v} A ${a} ${o} 0 ${T} 1 ${y} ${b} L ${y} ${b + u} A ${a} ${o} 0 ${T} 0 ${h} ${v + u} Z`, I = `M ${C} ${w} A ${s} ${l} 0 ${T} 1 ${x} ${S} L ${x} ${S + u} A ${s} ${l} 0 ${T} 0 ${C} ${w + u} Z`, M ? (L = `M ${h} ${v} A ${a} ${o} 0 ${T} 1 ${y} ${b} M ${y} ${b + u} A ${a} ${o} 0 ${T} 0 ${h} ${v + u}`, N || (L += ` L ${h} ${v}`)) : (L = `M ${h} ${v} A ${a} ${o} 0 ${T} 1 ${y} ${b} L ${y} ${b + u} A ${a} ${o} 0 ${T} 0 ${h} ${v + u}`, N || (L += " Z")), M ? (R = `M ${C} ${w} A ${s} ${l} 0 ${T} 1 ${x} ${S} M ${x} ${S + u} A ${s} ${l} 0 ${T} 0 ${C} ${w + u}`, N || (R += ` L ${C} ${w}`)) : (R = `M ${C} ${w} A ${s} ${l} 0 ${T} 1 ${x} ${S} L ${x} ${S + u} A ${s} ${l} 0 ${T} 0 ${C} ${w + u}`, N || (R += " Z")), Math.abs(r - A) < .001 && (z = `M ${h} ${v} L ${C} ${w} L ${C} ${w + u} L ${h} ${v + u} Z`), Math.abs(p - j) < .001 && (B = `M ${y} ${b} L ${x} ${S} L ${x} ${S + u} L ${y} ${b + u} Z`));
|
|
809
|
-
let
|
|
809
|
+
let V = d + o * Math.sin(m), ee = i + a * Math.cos(g), H = d + o * Math.sin(g), te = i + (a + 25) * Math.cos(g), ne = d + (o + 35 * c.slopeRatio) * Math.sin(g), re = i + (a + s) / 2 * Math.cos(g), ie = d + (o + l) / 2 * Math.sin(g), ae = a - s, oe = o - l;
|
|
810
810
|
n.push({
|
|
811
811
|
item: e,
|
|
812
812
|
index: f,
|
|
@@ -819,41 +819,38 @@ var N = {
|
|
|
819
819
|
topStrokePath: P,
|
|
820
820
|
outerWallStrokePath: L,
|
|
821
821
|
innerWallStrokePath: R,
|
|
822
|
-
midY:
|
|
822
|
+
midY: V,
|
|
823
823
|
topPath: E,
|
|
824
824
|
outerWallPath: F,
|
|
825
825
|
innerWallPath: I,
|
|
826
826
|
startCutPath: z,
|
|
827
827
|
endCutPath: B,
|
|
828
|
-
x0:
|
|
829
|
-
y0:
|
|
830
|
-
x1:
|
|
831
|
-
y1:
|
|
832
|
-
topGradX1:
|
|
833
|
-
topGradY1:
|
|
834
|
-
topGradX2:
|
|
835
|
-
topGradY2:
|
|
836
|
-
wallY1:
|
|
837
|
-
wallY2:
|
|
828
|
+
x0: ee,
|
|
829
|
+
y0: H,
|
|
830
|
+
x1: te,
|
|
831
|
+
y1: ne,
|
|
832
|
+
topGradX1: re - ae / 2,
|
|
833
|
+
topGradY1: ie - oe / 2,
|
|
834
|
+
topGradX2: re + ae / 2,
|
|
835
|
+
topGradY2: ie + oe / 2,
|
|
836
|
+
wallY1: H,
|
|
837
|
+
wallY2: H + u
|
|
838
838
|
});
|
|
839
839
|
}), r += p;
|
|
840
|
-
}), n.sort((e, t) =>
|
|
841
|
-
let n = w.value === e.item.id, r = w.value === t.item.id;
|
|
842
|
-
return n && !r ? 1 : !n && r ? -1 : e.midY - t.midY;
|
|
843
|
-
});
|
|
840
|
+
}), n.sort((e, t) => e.midY - t.midY);
|
|
844
841
|
}), rt = r(() => {
|
|
845
842
|
let e = /* @__PURE__ */ new Set(), t = [];
|
|
846
|
-
return
|
|
843
|
+
return $.value.forEach((n) => {
|
|
847
844
|
e.has(n.item.id) || (e.add(n.item.id), t.push(n));
|
|
848
845
|
}), t;
|
|
849
|
-
}), it = (e) =>
|
|
850
|
-
if (
|
|
846
|
+
}), it = (e) => C.value === e.item.id ? { transform: `translate(${10 * Math.cos(e.originalMidAngle)}px, ${10 * Math.sin(e.originalMidAngle)}px)` } : {}, at = r(() => {
|
|
847
|
+
if (Q.value <= .001) return {
|
|
851
848
|
left: [],
|
|
852
849
|
right: []
|
|
853
850
|
};
|
|
854
851
|
let e = [], t = [];
|
|
855
852
|
return rt.value.forEach((n) => {
|
|
856
|
-
let r = Math.cos(n.originalMidAngle) < 0, i = Math.sin(n.originalMidAngle) > 0, a =
|
|
853
|
+
let r = Math.cos(n.originalMidAngle) < 0, i = Math.sin(n.originalMidAngle) > 0, a = Z.value, o = n.y0 + (i ? a : 0), s = n.y1 + (i ? a : 0), c = {
|
|
857
854
|
item: n.item,
|
|
858
855
|
index: n.index,
|
|
859
856
|
color: n.color,
|
|
@@ -872,12 +869,12 @@ var N = {
|
|
|
872
869
|
right: t
|
|
873
870
|
};
|
|
874
871
|
}), ot = r(() => at.value.left), st = r(() => at.value.right), ct = (e) => {
|
|
875
|
-
let t =
|
|
872
|
+
let t = C.value === e.item.id, n = e.x0, r = e.y0, i = e.finalY;
|
|
876
873
|
if (t) {
|
|
877
874
|
let t = 10 * Math.cos(e.originalMidAngle || 0), a = 10 * Math.sin(e.originalMidAngle || 0);
|
|
878
875
|
n += t, r += a, i -= 5;
|
|
879
876
|
}
|
|
880
|
-
let a = n + 30 * Math.cos(e.originalMidAngle || 0), o = r + 30 * Math.sin(e.originalMidAngle || 0), s = e.isLeft, c = Math.sin(e.originalMidAngle || 0) < 0, l =
|
|
877
|
+
let a = n + 30 * Math.cos(e.originalMidAngle || 0), o = r + 30 * Math.sin(e.originalMidAngle || 0), s = e.isLeft, c = Math.sin(e.originalMidAngle || 0) < 0, l = G.value, u = q.value, d = s ? l - u - 15 : l + u + 15, f = s ? Math.min(d, a - 30) : Math.max(d, a + 30);
|
|
881
878
|
return `M ${n} ${r} C ${a} ${o}, ${f} ${c ? Math.min(o, i) : Math.max(o, i)}, ${s ? 90 : 670} ${i}`;
|
|
882
879
|
}, lt = (e = 450) => {
|
|
883
880
|
if (c.currentLowFxMode || c.immediate) {
|
|
@@ -885,94 +882,94 @@ var N = {
|
|
|
885
882
|
e.value = e.targetValue, e.percentage = e.targetPercentage === void 0 ? 0 : e.targetPercentage;
|
|
886
883
|
}), A.value = A.value.filter((e) => e.targetValue > 0), U.value = qe.value;
|
|
887
884
|
let e = c.is3D;
|
|
888
|
-
|
|
885
|
+
G.value = c.isExpanded ? 380 : 60, K.value = c.isExpanded ? 160 : 60, q.value = c.isExpanded ? 180 : 48, J.value = c.isExpanded ? e ? 180 * c.slopeRatio : 180 : e ? 48 * c.slopeRatio : 48, Y.value = c.isExpanded ? 180 * (1 - c.thickness) : 48 * (1 - c.thickness), X.value = c.isExpanded ? e ? 180 * (1 - c.thickness) * c.slopeRatio : 180 * (1 - c.thickness) : e ? 48 * (1 - c.thickness) * c.slopeRatio : 48 * (1 - c.thickness);
|
|
889
886
|
let t = c.isExpanded && e ? 32 : 0;
|
|
890
|
-
|
|
887
|
+
Z.value = e && c.slopeRatio > .5 ? t * (2 - 2 * c.slopeRatio) : t, Qe.value = c.isExpanded ? 760 : 120, $e.value = c.isExpanded ? 320 : 120, Q.value = c.isExpanded && c.showLabels ? 1 : 0, Je.value = !1;
|
|
891
888
|
return;
|
|
892
889
|
}
|
|
893
|
-
|
|
894
|
-
let t = performance.now(), n = U.value, r = qe.value, i =
|
|
895
|
-
let
|
|
890
|
+
u && cancelAnimationFrame(u), Je.value = !0;
|
|
891
|
+
let t = performance.now(), n = U.value, r = qe.value, i = G.value, a = K.value, o = q.value, s = J.value, l = Y.value, d = X.value, f = Z.value, p = Qe.value, m = $e.value, h = Q.value, g = c.is3D, _ = c.isExpanded ? 380 : 60, v = c.isExpanded ? 160 : 60, y = c.isExpanded ? 180 : 48, b = c.isExpanded ? g ? 180 * c.slopeRatio : 180 : g ? 48 * c.slopeRatio : 48, x = c.isExpanded ? 180 * (1 - c.thickness) : 48 * (1 - c.thickness), S = c.isExpanded ? g ? 180 * (1 - c.thickness) * c.slopeRatio : 180 * (1 - c.thickness) : g ? 48 * (1 - c.thickness) * c.slopeRatio : 48 * (1 - c.thickness), C = c.isExpanded && g ? 32 : 0, w = g && c.slopeRatio > .5 ? C * (2 - 2 * c.slopeRatio) : C, T = c.isExpanded ? 760 : 120, E = c.isExpanded ? 320 : 120, D = c.isExpanded && c.showLabels ? 1 : 0, O = (c) => {
|
|
892
|
+
let g = c - t, C = Math.min(1, g / e), k = 1 - (1 - C) ** 3;
|
|
896
893
|
A.value.forEach((e) => {
|
|
897
894
|
e.value = e.startValue + (e.targetValue - e.startValue) * k;
|
|
898
895
|
let t = e.startPercentage === void 0 ? 0 : e.startPercentage, n = e.targetPercentage === void 0 ? 0 : e.targetPercentage;
|
|
899
896
|
e.percentage = Math.round(t + (n - t) * k);
|
|
900
|
-
}), U.value = n + (r - n) * k,
|
|
897
|
+
}), U.value = n + (r - n) * k, G.value = i + (_ - i) * k, K.value = a + (v - a) * k, q.value = o + (y - o) * k, J.value = s + (b - s) * k, Y.value = l + (x - l) * k, X.value = d + (S - d) * k, Z.value = f + (w - f) * k, Qe.value = p + (T - p) * k, $e.value = m + (E - m) * k, Q.value = h + (D - h) * k, C < 1 ? u = requestAnimationFrame(O) : (u = null, A.value.forEach((e) => {
|
|
901
898
|
e.value = e.targetValue, e.percentage = e.targetPercentage === void 0 ? 0 : e.targetPercentage;
|
|
902
|
-
}), A.value = A.value.filter((e) => e.targetValue > 0),
|
|
899
|
+
}), A.value = A.value.filter((e) => e.targetValue > 0), G.value = _, K.value = v, q.value = y, J.value = b, Y.value = x, X.value = S, Z.value = w, Qe.value = T, $e.value = E, Q.value = D, Je.value = !1);
|
|
903
900
|
};
|
|
904
|
-
|
|
901
|
+
u = requestAnimationFrame(O);
|
|
905
902
|
}, ut = (e) => {
|
|
906
903
|
if (e.isSingleSlice) return !0;
|
|
907
|
-
let t =
|
|
904
|
+
let t = $.value, n = -1;
|
|
908
905
|
for (let r = t.length - 1; r >= 0; r--) if (t[r].item.id === e.item.id) {
|
|
909
906
|
n = r;
|
|
910
907
|
break;
|
|
911
908
|
}
|
|
912
909
|
return t.indexOf(e) === n;
|
|
913
910
|
};
|
|
914
|
-
return
|
|
911
|
+
return w(B, (e) => {
|
|
915
912
|
let t = c.immediate || c.currentLowFxMode;
|
|
916
913
|
Ge(e || [], t), t || lt();
|
|
917
914
|
}, {
|
|
918
915
|
deep: !0,
|
|
919
916
|
immediate: !0
|
|
920
|
-
}),
|
|
921
|
-
|
|
922
|
-
|
|
917
|
+
}), w(() => c.rotationAngle, () => {
|
|
918
|
+
Ye.value = !0, Xe && clearTimeout(Xe), Xe = setTimeout(() => {
|
|
919
|
+
Ye.value = !1;
|
|
923
920
|
}, 100);
|
|
924
|
-
}),
|
|
921
|
+
}), w(qe, (e) => {
|
|
925
922
|
c.immediate || c.currentLowFxMode ? U.value = e : lt();
|
|
926
|
-
}),
|
|
927
|
-
|
|
923
|
+
}), w(() => c.isExpanded, () => {
|
|
924
|
+
d(() => {
|
|
928
925
|
lt();
|
|
929
926
|
});
|
|
930
|
-
}),
|
|
931
|
-
|
|
927
|
+
}), w(() => c.is3D, () => {
|
|
928
|
+
d(() => {
|
|
932
929
|
lt();
|
|
933
930
|
});
|
|
934
|
-
}),
|
|
935
|
-
|
|
931
|
+
}), w(() => c.showLabels, () => {
|
|
932
|
+
d(() => {
|
|
936
933
|
lt();
|
|
937
934
|
});
|
|
938
|
-
}),
|
|
935
|
+
}), w(() => c.slopeRatio, (e) => {
|
|
939
936
|
if (c.is3D) {
|
|
940
|
-
|
|
937
|
+
J.value = c.isExpanded ? 180 * e : 48;
|
|
941
938
|
let t = c.isExpanded ? 180 : 48, n = c.isExpanded ? 180 * e : 48;
|
|
942
|
-
|
|
939
|
+
Y.value = t * (1 - c.thickness), X.value = n * (1 - c.thickness);
|
|
943
940
|
let r = c.isExpanded ? 32 : 0;
|
|
944
|
-
|
|
941
|
+
Z.value = e > .5 ? r * (2 - 2 * e) : r;
|
|
945
942
|
}
|
|
946
|
-
}),
|
|
943
|
+
}), w(() => c.thickness, (e) => {
|
|
947
944
|
let t = c.is3D, n = c.isExpanded ? 180 : 48, r = c.isExpanded ? t ? 180 * c.slopeRatio : 180 : t ? 48 * c.slopeRatio : 48;
|
|
948
|
-
|
|
949
|
-
}),
|
|
950
|
-
|
|
951
|
-
}),
|
|
945
|
+
Y.value = n * (1 - e), X.value = r * (1 - e);
|
|
946
|
+
}), w(() => c.hoveredItemId, (e) => {
|
|
947
|
+
_.value !== e && (_.value = e);
|
|
948
|
+
}), w(_, (e) => {
|
|
952
949
|
c.hoveredItemId !== e && l("update:hoveredItemId", e);
|
|
953
|
-
}),
|
|
954
|
-
document.addEventListener("click", k),
|
|
950
|
+
}), m(() => {
|
|
951
|
+
document.addEventListener("click", k), d(() => {
|
|
955
952
|
lt();
|
|
956
953
|
});
|
|
957
|
-
}),
|
|
958
|
-
document.removeEventListener("click", k),
|
|
954
|
+
}), h(() => {
|
|
955
|
+
document.removeEventListener("click", k), u && cancelAnimationFrame(u);
|
|
959
956
|
}), n({ redraw: () => {
|
|
960
|
-
|
|
957
|
+
u && cancelAnimationFrame(u), u = null, A.value.forEach((e) => {
|
|
961
958
|
e.value = e.targetValue;
|
|
962
959
|
}), A.value = A.value.filter((e) => e.targetValue > 0);
|
|
963
|
-
} }), (n, r) => (
|
|
960
|
+
} }), (n, r) => (g(), o("div", {
|
|
964
961
|
ref_key: "wrapperRef",
|
|
965
962
|
ref: O,
|
|
966
|
-
class:
|
|
963
|
+
class: f(["donut-canvas-wrapper", {
|
|
967
964
|
"is-expanded": t.isExpanded,
|
|
968
|
-
"no-transitions":
|
|
965
|
+
"no-transitions": Je.value || Ye.value || t.immediate
|
|
969
966
|
}])
|
|
970
|
-
}, [(
|
|
971
|
-
viewBox: `0 0 ${
|
|
967
|
+
}, [(g(), o("svg", {
|
|
968
|
+
viewBox: `0 0 ${Qe.value} ${$e.value}`,
|
|
972
969
|
class: "items-svg-chart",
|
|
973
970
|
xmlns: "http://www.w3.org/2000/svg"
|
|
974
|
-
}, [B.value && B.value.length > 0 ? (
|
|
975
|
-
(
|
|
971
|
+
}, [B.value && B.value.length > 0 ? (g(), o("defs", H, [
|
|
972
|
+
(g(!0), o(e, null, y(rt.value, (e) => (g(), o("linearGradient", {
|
|
976
973
|
key: "top-grad-" + z(e.item.id),
|
|
977
974
|
id: "top-grad-" + z(e.item.id),
|
|
978
975
|
gradientUnits: "userSpaceOnUse",
|
|
@@ -986,8 +983,8 @@ var N = {
|
|
|
986
983
|
}, null, 8, ne), s("stop", {
|
|
987
984
|
offset: "100%",
|
|
988
985
|
"stop-color": N(e.color, .85)
|
|
989
|
-
}, null, 8, re)], 8,
|
|
990
|
-
(
|
|
986
|
+
}, null, 8, re)], 8, te))), 128)),
|
|
987
|
+
(g(!0), o(e, null, y(rt.value, (e) => (g(), o("linearGradient", {
|
|
991
988
|
key: "outer-grad-" + z(e.item.id),
|
|
992
989
|
id: "outer-grad-" + z(e.item.id),
|
|
993
990
|
gradientUnits: "userSpaceOnUse",
|
|
@@ -1002,7 +999,7 @@ var N = {
|
|
|
1002
999
|
offset: "100%",
|
|
1003
1000
|
"stop-color": N(e.color, .5)
|
|
1004
1001
|
}, null, 8, oe)], 8, ie))), 128)),
|
|
1005
|
-
(
|
|
1002
|
+
(g(!0), o(e, null, y(rt.value, (e) => (g(), o("linearGradient", {
|
|
1006
1003
|
key: "inner-grad-" + z(e.item.id),
|
|
1007
1004
|
id: "inner-grad-" + z(e.item.id),
|
|
1008
1005
|
gradientUnits: "userSpaceOnUse",
|
|
@@ -1017,7 +1014,7 @@ var N = {
|
|
|
1017
1014
|
offset: "100%",
|
|
1018
1015
|
"stop-color": N(e.color, .4)
|
|
1019
1016
|
}, null, 8, le)], 8, se))), 128))
|
|
1020
|
-
])) : a("", !0), !B.value || B.value.length === 0 ? (
|
|
1017
|
+
])) : a("", !0), !B.value || B.value.length === 0 ? (g(), o("g", ue, [s("text", {
|
|
1021
1018
|
x: t.isExpanded ? 380 : 60,
|
|
1022
1019
|
y: t.isExpanded ? 160 : 60,
|
|
1023
1020
|
fill: "#64748b",
|
|
@@ -1025,21 +1022,21 @@ var N = {
|
|
|
1025
1022
|
"font-family": "system-ui, -apple-system, sans-serif",
|
|
1026
1023
|
"text-anchor": "middle",
|
|
1027
1024
|
"dominant-baseline": "middle"
|
|
1028
|
-
},
|
|
1029
|
-
(
|
|
1025
|
+
}, S(t.emptyText || "No data"), 9, de)])) : (g(), o("g", fe, [
|
|
1026
|
+
(g(!0), o(e, null, y($.value.filter((e) => e.midY < nt.value), (e) => (g(), o("g", {
|
|
1030
1027
|
key: "slice-sub-back-" + e.item.id + "-" + e.midAngle,
|
|
1031
|
-
class:
|
|
1032
|
-
"is-hovered":
|
|
1033
|
-
"is-dimmed":
|
|
1028
|
+
class: f(["slice-group-3d", {
|
|
1029
|
+
"is-hovered": C.value === e.item.id,
|
|
1030
|
+
"is-dimmed": C.value !== null && C.value !== e.item.id
|
|
1034
1031
|
}]),
|
|
1035
|
-
style:
|
|
1032
|
+
style: p(it(e))
|
|
1036
1033
|
}, [
|
|
1037
|
-
t.isExpanded && e.innerWallPath ? (
|
|
1034
|
+
t.isExpanded && e.innerWallPath ? (g(), o("path", {
|
|
1038
1035
|
key: 0,
|
|
1039
1036
|
d: e.innerWallPath,
|
|
1040
1037
|
fill: `url(#inner-grad-${z(e.item.id)})`
|
|
1041
1038
|
}, null, 8, pe)) : a("", !0),
|
|
1042
|
-
t.isExpanded && e.innerWallStrokePath ? (
|
|
1039
|
+
t.isExpanded && e.innerWallStrokePath ? (g(), o("path", {
|
|
1043
1040
|
key: 1,
|
|
1044
1041
|
d: e.innerWallStrokePath,
|
|
1045
1042
|
fill: "none",
|
|
@@ -1047,22 +1044,22 @@ var N = {
|
|
|
1047
1044
|
"stroke-width": "0.8",
|
|
1048
1045
|
"stroke-linejoin": "round"
|
|
1049
1046
|
}, null, 8, me)) : a("", !0),
|
|
1050
|
-
t.isExpanded && e.startCutPath ? (
|
|
1047
|
+
t.isExpanded && e.startCutPath ? (g(), o("path", {
|
|
1051
1048
|
key: 2,
|
|
1052
1049
|
d: e.startCutPath,
|
|
1053
1050
|
fill: N(e.color, .65)
|
|
1054
1051
|
}, null, 8, he)) : a("", !0),
|
|
1055
|
-
t.isExpanded && e.endCutPath ? (
|
|
1052
|
+
t.isExpanded && e.endCutPath ? (g(), o("path", {
|
|
1056
1053
|
key: 3,
|
|
1057
1054
|
d: e.endCutPath,
|
|
1058
1055
|
fill: N(e.color, .75)
|
|
1059
1056
|
}, null, 8, ge)) : a("", !0),
|
|
1060
|
-
t.isExpanded && e.outerWallPath ? (
|
|
1057
|
+
t.isExpanded && e.outerWallPath ? (g(), o("path", {
|
|
1061
1058
|
key: 4,
|
|
1062
1059
|
d: e.outerWallPath,
|
|
1063
1060
|
fill: `url(#outer-grad-${z(e.item.id)})`
|
|
1064
1061
|
}, null, 8, _e)) : a("", !0),
|
|
1065
|
-
t.isExpanded && e.outerWallStrokePath ? (
|
|
1062
|
+
t.isExpanded && e.outerWallStrokePath ? (g(), o("path", {
|
|
1066
1063
|
key: 5,
|
|
1067
1064
|
d: e.outerWallStrokePath,
|
|
1068
1065
|
fill: "none",
|
|
@@ -1070,12 +1067,12 @@ var N = {
|
|
|
1070
1067
|
"stroke-width": "0.8",
|
|
1071
1068
|
"stroke-linejoin": "round"
|
|
1072
1069
|
}, null, 8, ve)) : a("", !0),
|
|
1073
|
-
ut(e) ? (
|
|
1070
|
+
ut(e) ? (g(), o("path", {
|
|
1074
1071
|
key: 6,
|
|
1075
1072
|
d: e.originalTopPath,
|
|
1076
1073
|
fill: `url(#top-grad-${z(e.item.id)})`
|
|
1077
1074
|
}, null, 8, ye)) : a("", !0),
|
|
1078
|
-
ut(e) ? (
|
|
1075
|
+
ut(e) ? (g(), o("path", {
|
|
1079
1076
|
key: 7,
|
|
1080
1077
|
d: e.topStrokePath,
|
|
1081
1078
|
fill: "none",
|
|
@@ -1083,7 +1080,7 @@ var N = {
|
|
|
1083
1080
|
"stroke-width": "0.8",
|
|
1084
1081
|
"stroke-linejoin": "round"
|
|
1085
1082
|
}, null, 8, be)) : a("", !0),
|
|
1086
|
-
ut(e) ? (
|
|
1083
|
+
ut(e) ? (g(), o("path", {
|
|
1087
1084
|
key: 8,
|
|
1088
1085
|
d: e.topStrokePath,
|
|
1089
1086
|
fill: "none",
|
|
@@ -1092,43 +1089,43 @@ var N = {
|
|
|
1092
1089
|
"stroke-linejoin": "round"
|
|
1093
1090
|
}, null, 8, xe)) : a("", !0)
|
|
1094
1091
|
], 6))), 128)),
|
|
1095
|
-
c.showCenterText ? (
|
|
1092
|
+
c.showCenterText ? (g(), o("g", {
|
|
1096
1093
|
key: 0,
|
|
1097
|
-
transform: `translate(${
|
|
1094
|
+
transform: `translate(${G.value}, ${K.value})`,
|
|
1098
1095
|
class: "center-text-group"
|
|
1099
1096
|
}, [s("text", {
|
|
1100
1097
|
x: "0",
|
|
1101
1098
|
y: "-3",
|
|
1102
1099
|
class: "center-text-value",
|
|
1103
|
-
"font-size":
|
|
1100
|
+
"font-size": et.value,
|
|
1104
1101
|
"font-weight": "bold",
|
|
1105
1102
|
"font-family": "'JetBrains Mono', monospace",
|
|
1106
1103
|
"text-anchor": "middle",
|
|
1107
1104
|
"dominant-baseline": "middle"
|
|
1108
|
-
},
|
|
1105
|
+
}, S(Ue.value), 9, Ce), s("text", {
|
|
1109
1106
|
x: "0",
|
|
1110
1107
|
y: "10",
|
|
1111
1108
|
class: "center-text-label",
|
|
1112
|
-
"font-size":
|
|
1109
|
+
"font-size": tt.value,
|
|
1113
1110
|
"font-family": "system-ui, -apple-system, sans-serif",
|
|
1114
1111
|
"font-weight": "600",
|
|
1115
1112
|
"text-anchor": "middle",
|
|
1116
1113
|
"dominant-baseline": "middle"
|
|
1117
|
-
},
|
|
1118
|
-
(
|
|
1114
|
+
}, S(We.value), 9, we)], 8, Se)) : a("", !0),
|
|
1115
|
+
(g(!0), o(e, null, y($.value.filter((e) => e.midY >= nt.value), (e) => (g(), o("g", {
|
|
1119
1116
|
key: "slice-sub-front-" + e.item.id + "-" + e.midAngle,
|
|
1120
|
-
class:
|
|
1121
|
-
"is-hovered":
|
|
1122
|
-
"is-dimmed":
|
|
1117
|
+
class: f(["slice-group-3d", {
|
|
1118
|
+
"is-hovered": C.value === e.item.id,
|
|
1119
|
+
"is-dimmed": C.value !== null && C.value !== e.item.id
|
|
1123
1120
|
}]),
|
|
1124
|
-
style:
|
|
1121
|
+
style: p(it(e))
|
|
1125
1122
|
}, [
|
|
1126
|
-
t.isExpanded && e.innerWallPath ? (
|
|
1123
|
+
t.isExpanded && e.innerWallPath ? (g(), o("path", {
|
|
1127
1124
|
key: 0,
|
|
1128
1125
|
d: e.innerWallPath,
|
|
1129
1126
|
fill: `url(#inner-grad-${z(e.item.id)})`
|
|
1130
1127
|
}, null, 8, Te)) : a("", !0),
|
|
1131
|
-
t.isExpanded && e.innerWallStrokePath ? (
|
|
1128
|
+
t.isExpanded && e.innerWallStrokePath ? (g(), o("path", {
|
|
1132
1129
|
key: 1,
|
|
1133
1130
|
d: e.innerWallStrokePath,
|
|
1134
1131
|
fill: "none",
|
|
@@ -1136,22 +1133,22 @@ var N = {
|
|
|
1136
1133
|
"stroke-width": "0.8",
|
|
1137
1134
|
"stroke-linejoin": "round"
|
|
1138
1135
|
}, null, 8, Ee)) : a("", !0),
|
|
1139
|
-
t.isExpanded && e.startCutPath ? (
|
|
1136
|
+
t.isExpanded && e.startCutPath ? (g(), o("path", {
|
|
1140
1137
|
key: 2,
|
|
1141
1138
|
d: e.startCutPath,
|
|
1142
1139
|
fill: N(e.color, .65)
|
|
1143
1140
|
}, null, 8, De)) : a("", !0),
|
|
1144
|
-
t.isExpanded && e.endCutPath ? (
|
|
1141
|
+
t.isExpanded && e.endCutPath ? (g(), o("path", {
|
|
1145
1142
|
key: 3,
|
|
1146
1143
|
d: e.endCutPath,
|
|
1147
1144
|
fill: N(e.color, .75)
|
|
1148
1145
|
}, null, 8, Oe)) : a("", !0),
|
|
1149
|
-
t.isExpanded && e.outerWallPath ? (
|
|
1146
|
+
t.isExpanded && e.outerWallPath ? (g(), o("path", {
|
|
1150
1147
|
key: 4,
|
|
1151
1148
|
d: e.outerWallPath,
|
|
1152
1149
|
fill: `url(#outer-grad-${z(e.item.id)})`
|
|
1153
1150
|
}, null, 8, ke)) : a("", !0),
|
|
1154
|
-
t.isExpanded && e.outerWallStrokePath ? (
|
|
1151
|
+
t.isExpanded && e.outerWallStrokePath ? (g(), o("path", {
|
|
1155
1152
|
key: 5,
|
|
1156
1153
|
d: e.outerWallStrokePath,
|
|
1157
1154
|
fill: "none",
|
|
@@ -1159,12 +1156,12 @@ var N = {
|
|
|
1159
1156
|
"stroke-width": "0.8",
|
|
1160
1157
|
"stroke-linejoin": "round"
|
|
1161
1158
|
}, null, 8, Ae)) : a("", !0),
|
|
1162
|
-
ut(e) ? (
|
|
1159
|
+
ut(e) ? (g(), o("path", {
|
|
1163
1160
|
key: 6,
|
|
1164
1161
|
d: e.originalTopPath,
|
|
1165
1162
|
fill: `url(#top-grad-${z(e.item.id)})`
|
|
1166
1163
|
}, null, 8, je)) : a("", !0),
|
|
1167
|
-
ut(e) ? (
|
|
1164
|
+
ut(e) ? (g(), o("path", {
|
|
1168
1165
|
key: 7,
|
|
1169
1166
|
d: e.topStrokePath,
|
|
1170
1167
|
fill: "none",
|
|
@@ -1172,7 +1169,7 @@ var N = {
|
|
|
1172
1169
|
"stroke-width": "0.8",
|
|
1173
1170
|
"stroke-linejoin": "round"
|
|
1174
1171
|
}, null, 8, Me)) : a("", !0),
|
|
1175
|
-
ut(e) ? (
|
|
1172
|
+
ut(e) ? (g(), o("path", {
|
|
1176
1173
|
key: 8,
|
|
1177
1174
|
d: e.topStrokePath,
|
|
1178
1175
|
fill: "none",
|
|
@@ -1181,37 +1178,37 @@ var N = {
|
|
|
1181
1178
|
"stroke-linejoin": "round"
|
|
1182
1179
|
}, null, 8, Ne)) : a("", !0)
|
|
1183
1180
|
], 6))), 128)),
|
|
1184
|
-
(
|
|
1181
|
+
(g(!0), o(e, null, y(rt.value, (e) => (g(), o("g", {
|
|
1185
1182
|
key: "hover-trigger-" + e.item.id,
|
|
1186
1183
|
class: "hover-trigger-group",
|
|
1187
|
-
style:
|
|
1184
|
+
style: p({ cursor: c.selectable && !j.value ? "pointer" : "default" }),
|
|
1188
1185
|
onMouseenter: (t) => D(e.item.id),
|
|
1189
|
-
onMouseleave: r[0] ||= (e) =>
|
|
1186
|
+
onMouseleave: r[0] ||= (e) => _.value = null,
|
|
1190
1187
|
onClick: (t) => E(e.item.id)
|
|
1191
1188
|
}, [s("path", {
|
|
1192
1189
|
d: e.hoverPath || e.originalTopPath,
|
|
1193
1190
|
fill: "transparent"
|
|
1194
|
-
}, null, 8, Fe), e.originalOuterWallPath ? (
|
|
1191
|
+
}, null, 8, Fe), e.originalOuterWallPath ? (g(), o("path", {
|
|
1195
1192
|
key: 0,
|
|
1196
1193
|
d: e.originalOuterWallPath,
|
|
1197
1194
|
fill: "transparent"
|
|
1198
1195
|
}, null, 8, Ie)) : a("", !0)], 44, Pe))), 128)),
|
|
1199
1196
|
s("g", {
|
|
1200
1197
|
class: "labels-layer",
|
|
1201
|
-
style:
|
|
1202
|
-
opacity:
|
|
1203
|
-
pointerEvents:
|
|
1198
|
+
style: p({
|
|
1199
|
+
opacity: Q.value,
|
|
1200
|
+
pointerEvents: Q.value > .01 ? "auto" : "none"
|
|
1204
1201
|
})
|
|
1205
|
-
}, [(
|
|
1202
|
+
}, [(g(!0), o(e, null, y(ot.value, (e, t) => (g(), o("g", {
|
|
1206
1203
|
key: "label-left-" + e.item.id,
|
|
1207
|
-
class:
|
|
1208
|
-
"is-hovered":
|
|
1209
|
-
"is-dimmed":
|
|
1204
|
+
class: f(["label-group", {
|
|
1205
|
+
"is-hovered": C.value === e.item.id,
|
|
1206
|
+
"is-dimmed": C.value !== null && C.value !== e.item.id
|
|
1210
1207
|
}]),
|
|
1211
1208
|
onMouseenter: (t) => D(e.item.id),
|
|
1212
|
-
onMouseleave: r[1] ||= (e) =>
|
|
1209
|
+
onMouseleave: r[1] ||= (e) => _.value = null,
|
|
1213
1210
|
onClick: (t) => E(e.item.id),
|
|
1214
|
-
style:
|
|
1211
|
+
style: p({ cursor: c.selectable && !j.value ? "pointer" : "default" })
|
|
1215
1212
|
}, [s("path", {
|
|
1216
1213
|
d: ct(e),
|
|
1217
1214
|
fill: "none",
|
|
@@ -1226,17 +1223,17 @@ var N = {
|
|
|
1226
1223
|
"font-family": "system-ui, -apple-system, sans-serif",
|
|
1227
1224
|
"text-anchor": "end",
|
|
1228
1225
|
"dominant-baseline": "middle",
|
|
1229
|
-
style:
|
|
1230
|
-
},
|
|
1226
|
+
style: p(C.value === e.item.id ? "transform: translate(0, -5px);" : "")
|
|
1227
|
+
}, S(R(e.item.name, 24)) + " " + S(L(e.item.value)) + " " + S(e.item.unit || "") + " (" + S(e.item.percentage) + "%) ", 13, ze)], 46, Le))), 128)), (g(!0), o(e, null, y(st.value, (e, t) => (g(), o("g", {
|
|
1231
1228
|
key: "label-right-" + e.item.id,
|
|
1232
|
-
class:
|
|
1233
|
-
"is-hovered":
|
|
1234
|
-
"is-dimmed":
|
|
1229
|
+
class: f(["label-group", {
|
|
1230
|
+
"is-hovered": C.value === e.item.id,
|
|
1231
|
+
"is-dimmed": C.value !== null && C.value !== e.item.id
|
|
1235
1232
|
}]),
|
|
1236
1233
|
onMouseenter: (t) => D(e.item.id),
|
|
1237
|
-
onMouseleave: r[2] ||= (e) =>
|
|
1234
|
+
onMouseleave: r[2] ||= (e) => _.value = null,
|
|
1238
1235
|
onClick: (t) => E(e.item.id),
|
|
1239
|
-
style:
|
|
1236
|
+
style: p({ cursor: c.selectable && !j.value ? "pointer" : "default" })
|
|
1240
1237
|
}, [s("path", {
|
|
1241
1238
|
d: ct(e),
|
|
1242
1239
|
fill: "none",
|
|
@@ -1251,22 +1248,22 @@ var N = {
|
|
|
1251
1248
|
"font-family": "system-ui, -apple-system, sans-serif",
|
|
1252
1249
|
"text-anchor": "start",
|
|
1253
1250
|
"dominant-baseline": "middle",
|
|
1254
|
-
style:
|
|
1255
|
-
},
|
|
1251
|
+
style: p(C.value === e.item.id ? "transform: translate(0, -5px);" : "")
|
|
1252
|
+
}, S(R(e.item.name, 24)) + " " + S(L(e.item.value)) + " " + S(e.item.unit || "") + " (" + S(e.item.percentage) + "%) ", 13, He)], 46, Be))), 128))], 4)
|
|
1256
1253
|
]))], 8, ee))], 2));
|
|
1257
1254
|
}
|
|
1258
|
-
}, [["__scopeId", "data-v-
|
|
1255
|
+
}, [["__scopeId", "data-v-e6247870"]]), We = { class: "nano-scrub-label" }, Ge = {
|
|
1259
1256
|
key: 0,
|
|
1260
1257
|
class: "nano-scrub-overlay"
|
|
1261
|
-
},
|
|
1258
|
+
}, Ke = {
|
|
1262
1259
|
key: 1,
|
|
1263
1260
|
class: "nano-scrub-svg-line"
|
|
1264
|
-
},
|
|
1261
|
+
}, qe = [
|
|
1265
1262
|
"x1",
|
|
1266
1263
|
"y1",
|
|
1267
1264
|
"x2",
|
|
1268
1265
|
"y2"
|
|
1269
|
-
],
|
|
1266
|
+
], U = { class: "nano-scrub-popup-val" }, Je = { class: "nano-scrub-popup-res" }, Ye = /* @__PURE__ */ F(/* @__PURE__ */ Object.assign({ inheritAttrs: !1 }, {
|
|
1270
1267
|
__name: "PrecisionScrubber",
|
|
1271
1268
|
props: {
|
|
1272
1269
|
modelValue: {
|
|
@@ -1292,17 +1289,17 @@ var N = {
|
|
|
1292
1289
|
},
|
|
1293
1290
|
emits: ["update:modelValue"],
|
|
1294
1291
|
setup(n, { emit: c }) {
|
|
1295
|
-
let l = n,
|
|
1292
|
+
let l = n, d = c, f = v(null), m = v(!1), h = v(!1), _ = v(0), y = v(0), b = v(0), x = v(0), C = v(0), w = v(0), T = v(0), E = v(""), D = v({
|
|
1296
1293
|
left: 0,
|
|
1297
1294
|
width: 0
|
|
1298
|
-
}),
|
|
1295
|
+
}), O = r(() => {
|
|
1299
1296
|
let e = l.max - l.min;
|
|
1300
1297
|
return e <= 0 ? 0 : (l.modelValue - l.min) / e * 100;
|
|
1301
|
-
}),
|
|
1298
|
+
}), k = r(() => l.formatValue(l.modelValue)), A = (e) => {
|
|
1302
1299
|
if (e.button !== 0 || l.max - l.min <= 0) return;
|
|
1303
|
-
|
|
1300
|
+
m.value = !0, h.value = !1;
|
|
1304
1301
|
let t = e.currentTarget.getBoundingClientRect();
|
|
1305
|
-
|
|
1302
|
+
D.value = {
|
|
1306
1303
|
left: t.left,
|
|
1307
1304
|
width: t.width,
|
|
1308
1305
|
top: t.top,
|
|
@@ -1310,78 +1307,78 @@ var N = {
|
|
|
1310
1307
|
height: t.height
|
|
1311
1308
|
};
|
|
1312
1309
|
let n = e.clientX;
|
|
1313
|
-
|
|
1314
|
-
},
|
|
1315
|
-
if (!
|
|
1316
|
-
|
|
1310
|
+
_.value = n, y.value = l.modelValue, C.value = l.modelValue, b.value = n, x.value = e.clientY, w.value = n, T.value = e.clientY, E.value = "Coarse (Full range)", document.addEventListener("mousemove", j), document.addEventListener("mouseup", M), e.preventDefault();
|
|
1311
|
+
}, j = (e) => {
|
|
1312
|
+
if (!m.value) return;
|
|
1313
|
+
w.value = e.clientX, T.value = e.clientY;
|
|
1317
1314
|
let t = l.max - l.min;
|
|
1318
1315
|
if (t <= 0) return;
|
|
1319
|
-
let n =
|
|
1320
|
-
if (e.clientY < n.top ? (i = !0, r = n.top - e.clientY) : e.clientY > n.bottom && (i = !0, r = e.clientY - n.bottom), !
|
|
1321
|
-
let t = r, i = .25, a = 1.08, o = t + (a ** +t - 1), s = e.clientY < n.top ? -1 : 1, c = Math.round(-s * i * o),
|
|
1322
|
-
|
|
1316
|
+
let n = D.value, r = 0, i = !1;
|
|
1317
|
+
if (e.clientY < n.top ? (i = !0, r = n.top - e.clientY) : e.clientY > n.bottom && (i = !0, r = e.clientY - n.bottom), !h.value && i && (h.value = !0, b.value = e.clientX, x.value = e.clientY > n.bottom ? n.bottom : n.top, Math.abs(e.clientX - _.value) < 8 ? C.value = y.value : C.value = l.modelValue), h.value) {
|
|
1318
|
+
let t = r, i = .25, a = 1.08, o = t + (a ** +t - 1), s = e.clientY < n.top ? -1 : 1, c = Math.round(-s * i * o), u = C.value + c;
|
|
1319
|
+
u > l.max && (u = l.max), u < l.min && (u = l.min), d("update:modelValue", u);
|
|
1323
1320
|
let f = i * (1 + a ** +t * Math.log(a));
|
|
1324
|
-
f >= 1e9 ?
|
|
1321
|
+
f >= 1e9 ? E.value = `Coarse (±${N(Math.round(f))} / px)` : f >= 1e6 ? E.value = `Medium (±${N(Math.round(f))} / px)` : f >= 1 ? E.value = `Fine (±${N(Math.round(f))} / px)` : E.value = `Ultra-Fine (±1 index per ${Math.round(1 / f)}px)`;
|
|
1325
1322
|
} else {
|
|
1326
1323
|
let r = n.width - 16, i = Math.min(1, Math.max(0, (e.clientX - n.left - 8) / r));
|
|
1327
|
-
|
|
1324
|
+
d("update:modelValue", l.min + Math.round(i * t)), E.value = "Coarse (Full range)";
|
|
1328
1325
|
}
|
|
1329
|
-
},
|
|
1330
|
-
if (
|
|
1326
|
+
}, M = (e) => {
|
|
1327
|
+
if (m.value && !h.value) {
|
|
1331
1328
|
let t = l.max - l.min;
|
|
1332
|
-
if (t > 0 &&
|
|
1333
|
-
let n =
|
|
1334
|
-
|
|
1329
|
+
if (t > 0 && D.value.width > 0) {
|
|
1330
|
+
let n = D.value, r = n.width - 16, i = Math.min(1, Math.max(0, (e.clientX - n.left - 8) / r));
|
|
1331
|
+
d("update:modelValue", l.min + Math.round(i * t));
|
|
1335
1332
|
}
|
|
1336
1333
|
}
|
|
1337
|
-
|
|
1338
|
-
},
|
|
1339
|
-
return (r, c) => (
|
|
1334
|
+
m.value = !1, document.removeEventListener("mousemove", j), document.removeEventListener("mouseup", M);
|
|
1335
|
+
}, N = (e) => String(e).replace(/\B(?=(\d{3})+(?!\d))/g, " ");
|
|
1336
|
+
return (r, c) => (g(), o(e, null, [s("div", u({
|
|
1340
1337
|
class: "nano-scrub-track",
|
|
1341
|
-
onMousedown:
|
|
1338
|
+
onMousedown: A,
|
|
1342
1339
|
ref_key: "trackRef",
|
|
1343
|
-
ref:
|
|
1344
|
-
}, [s("div", {
|
|
1340
|
+
ref: f
|
|
1341
|
+
}, r.$attrs), [s("div", {
|
|
1345
1342
|
class: "nano-scrub-progress",
|
|
1346
|
-
style:
|
|
1347
|
-
}, null, 4), s("span",
|
|
1348
|
-
|
|
1343
|
+
style: p({ width: O.value + "%" })
|
|
1344
|
+
}, null, 4), s("span", We, S(n.label), 1)], 16), (g(), i(t, { to: "body" }, [m.value ? (g(), o("div", Ge, [
|
|
1345
|
+
h.value ? (g(), o("div", {
|
|
1349
1346
|
key: 0,
|
|
1350
1347
|
class: "nano-scrub-anchor",
|
|
1351
|
-
style:
|
|
1352
|
-
left:
|
|
1353
|
-
top:
|
|
1348
|
+
style: p({
|
|
1349
|
+
left: b.value + "px",
|
|
1350
|
+
top: x.value + "px"
|
|
1354
1351
|
})
|
|
1355
1352
|
}, null, 4)) : a("", !0),
|
|
1356
|
-
|
|
1357
|
-
x1:
|
|
1358
|
-
y1:
|
|
1359
|
-
x2:
|
|
1360
|
-
y2:
|
|
1353
|
+
h.value ? (g(), o("svg", Ke, [s("line", {
|
|
1354
|
+
x1: b.value,
|
|
1355
|
+
y1: x.value,
|
|
1356
|
+
x2: w.value,
|
|
1357
|
+
y2: T.value,
|
|
1361
1358
|
stroke: "#00e5ff",
|
|
1362
1359
|
"stroke-dasharray": "4,4",
|
|
1363
1360
|
"stroke-width": "1.5",
|
|
1364
1361
|
opacity: "0.6"
|
|
1365
|
-
}, null, 8,
|
|
1362
|
+
}, null, 8, qe)])) : a("", !0),
|
|
1366
1363
|
s("div", {
|
|
1367
1364
|
class: "nano-scrub-popup",
|
|
1368
|
-
style:
|
|
1369
|
-
left:
|
|
1370
|
-
top:
|
|
1365
|
+
style: p({
|
|
1366
|
+
left: w.value + 15 + "px",
|
|
1367
|
+
top: T.value + 15 + "px"
|
|
1371
1368
|
})
|
|
1372
1369
|
}, [
|
|
1373
1370
|
c[0] ||= s("div", { class: "nano-scrub-popup-title" }, "Scrubbing Mode", -1),
|
|
1374
|
-
s("div",
|
|
1375
|
-
s("div",
|
|
1371
|
+
s("div", U, S(k.value), 1),
|
|
1372
|
+
s("div", Je, S(E.value), 1)
|
|
1376
1373
|
], 4)
|
|
1377
1374
|
])) : a("", !0)]))], 64));
|
|
1378
1375
|
}
|
|
1379
|
-
}, [["__scopeId", "data-v-
|
|
1376
|
+
}), [["__scopeId", "data-v-429ba0d9"]]);
|
|
1380
1377
|
//#endregion
|
|
1381
1378
|
//#region src/index.js
|
|
1382
|
-
|
|
1383
|
-
var
|
|
1384
|
-
e.directive("ripple",
|
|
1379
|
+
k.init("nano-ui", "https://analytics.7u.pl");
|
|
1380
|
+
var Xe = { install(e) {
|
|
1381
|
+
e.directive("ripple", A), e.directive("tooltip", P), e.component("GlobalTooltip", I), e.component("NanoModal", V), e.component("ThreeDDonutChart", Ue), e.component("PrecisionScrubber", Ye);
|
|
1385
1382
|
} };
|
|
1386
1383
|
//#endregion
|
|
1387
|
-
export {
|
|
1384
|
+
export { I as GlobalTooltip, V as NanoModal, Ye as PrecisionScrubber, A as Ripple, Ue as ThreeDDonutChart, Xe as default, N as hideTooltip, M as showTooltip, P as tooltipDirective, j as tooltipState };
|