@gkucmierz/nano-ui 1.5.0 → 1.5.1
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 +15 -10
- 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-a055ea0b]{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-a055ea0b]{width:100%;max-width:760px;height:320px}@media (width<=760px){.donut-canvas-wrapper.is-expanded[data-v-a055ea0b]{height:42vw}}.items-svg-chart[data-v-a055ea0b]{width:100%;height:100%;display:block;overflow:visible}.slice-group-3d[data-v-a055ea0b]{cursor:pointer;transition:transform .25s cubic-bezier(.25,1,.5,1),opacity .25s}.slice-group-3d.is-dimmed[data-v-a055ea0b]{opacity:.35}.label-group[data-v-a055ea0b]{transition:opacity .25s}.label-group path[data-v-a055ea0b]{transition:d .25s cubic-bezier(.25,1,.5,1),stroke-width .2s,opacity .2s}.label-group text[data-v-a055ea0b]{transition:transform .25s cubic-bezier(.25,1,.5,1),font-weight .2s,opacity .2s}.label-group.is-hovered path[data-v-a055ea0b]{stroke-width:2.2px}.label-group.is-hovered text[data-v-a055ea0b]{font-weight:700}.label-group.is-dimmed[data-v-a055ea0b]{opacity:.25}.no-transitions .label-group[data-v-a055ea0b],.no-transitions .label-group path[data-v-a055ea0b],.no-transitions .label-group text[data-v-a055ea0b],.no-transitions .slice-group-3d[data-v-a055ea0b]{transition:none!important}.center-text-value[data-v-a055ea0b]{fill:#fff;filter:drop-shadow(0 0 3px #000c)}.center-text-label[data-v-a055ea0b]{fill:#94a3b8;filter:drop-shadow(0 0 2px #000c)}:root[data-theme=light] .center-text-value[data-v-a055ea0b]{fill:#0f172a;filter:drop-shadow(0 0 3px #ffffffe6)}:root[data-theme=light] .center-text-label[data-v-a055ea0b]{fill:#475569;filter:drop-shadow(0 0 2px #ffffffe6)}.nano-scrub-track[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-a055ea0b]{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-a055ea0b]{width:100%;max-width:760px;height:320px}@media (width<=760px){.donut-canvas-wrapper.is-expanded[data-v-a055ea0b]{height:42vw}}.items-svg-chart[data-v-a055ea0b]{width:100%;height:100%;display:block;overflow:visible}.slice-group-3d[data-v-a055ea0b]{cursor:pointer;transition:transform .25s cubic-bezier(.25,1,.5,1),opacity .25s}.slice-group-3d.is-dimmed[data-v-a055ea0b]{opacity:.35}.label-group[data-v-a055ea0b]{transition:opacity .25s}.label-group path[data-v-a055ea0b]{transition:d .25s cubic-bezier(.25,1,.5,1),stroke-width .2s,opacity .2s}.label-group text[data-v-a055ea0b]{transition:transform .25s cubic-bezier(.25,1,.5,1),font-weight .2s,opacity .2s}.label-group.is-hovered path[data-v-a055ea0b]{stroke-width:2.2px}.label-group.is-hovered text[data-v-a055ea0b]{font-weight:700}.label-group.is-dimmed[data-v-a055ea0b]{opacity:.25}.no-transitions .label-group[data-v-a055ea0b],.no-transitions .label-group path[data-v-a055ea0b],.no-transitions .label-group text[data-v-a055ea0b],.no-transitions .slice-group-3d[data-v-a055ea0b]{transition:none!important}.center-text-value[data-v-a055ea0b]{fill:#fff;filter:drop-shadow(0 0 3px #000c)}.center-text-label[data-v-a055ea0b]{fill:#94a3b8;filter:drop-shadow(0 0 2px #000c)}:root[data-theme=light] .center-text-value[data-v-a055ea0b]{fill:#0f172a;filter:drop-shadow(0 0 3px #ffffffe6)}:root[data-theme=light] .center-text-label[data-v-a055ea0b]{fill:#475569;filter:drop-shadow(0 0 2px #ffffffe6)}.nano-scrub-track[data-v-afd79d20]{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-afd79d20]:hover{background:#00e5ff0a;border-color:#00e5ff66}.nano-scrub-progress[data-v-afd79d20]{pointer-events:none;background:#00e5ff0f;height:100%;position:absolute;top:0;left:0}.nano-scrub-label[data-v-afd79d20]{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-afd79d20]{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-afd79d20]{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-afd79d20]{width:100vw;height:100vh;position:fixed;top:0;left:0}.nano-scrub-popup[data-v-afd79d20]{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-afd79d20]{text-transform:uppercase;color:#64748b;letter-spacing:.06rem;font-size:10px;font-weight:700}.nano-scrub-popup-val[data-v-afd79d20]{color:#fff;letter-spacing:.05rem;font-family:monospace;font-size:1.25rem;font-weight:800}.nano-scrub-popup-res[data-v-afd79d20]{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
|
@@ -1304,22 +1304,27 @@ var N = {
|
|
|
1304
1304
|
let t = e.currentTarget.getBoundingClientRect();
|
|
1305
1305
|
E.value = {
|
|
1306
1306
|
left: t.left,
|
|
1307
|
-
width: t.width
|
|
1307
|
+
width: t.width,
|
|
1308
|
+
top: t.top,
|
|
1309
|
+
bottom: t.bottom,
|
|
1310
|
+
height: t.height
|
|
1308
1311
|
};
|
|
1309
1312
|
let n = e.clientX;
|
|
1310
1313
|
g.value = n, v.value = l.modelValue, S.value = l.modelValue, y.value = n, b.value = e.clientY, C.value = n, w.value = e.clientY, T.value = "Coarse (Full range)", document.addEventListener("mousemove", A), document.addEventListener("mouseup", j), e.preventDefault();
|
|
1311
1314
|
}, A = (e) => {
|
|
1312
1315
|
if (!p.value) return;
|
|
1313
1316
|
C.value = e.clientX, w.value = e.clientY;
|
|
1314
|
-
let t =
|
|
1315
|
-
if (
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
let
|
|
1319
|
-
|
|
1317
|
+
let t = l.max - l.min;
|
|
1318
|
+
if (t <= 0) return;
|
|
1319
|
+
let n = E.value, r = 0, i = !1;
|
|
1320
|
+
if (e.clientY < n.top ? (i = !0, r = n.top - e.clientY) : e.clientY > n.bottom && (i = !0, r = e.clientY - n.bottom), !m.value && i && (m.value = !0, y.value = e.clientX, b.value = e.clientY > n.bottom ? n.bottom : n.top, Math.abs(e.clientX - g.value) < 8 ? S.value = v.value : S.value = l.modelValue), m.value) {
|
|
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), d = S.value + c;
|
|
1322
|
+
d > l.max && (d = l.max), d < l.min && (d = l.min), u("update:modelValue", d);
|
|
1323
|
+
let f = i * (1 + a ** +t * Math.log(a));
|
|
1324
|
+
f >= 1e9 ? T.value = `Coarse (±${M(Math.round(f))} / px)` : f >= 1e6 ? T.value = `Medium (±${M(Math.round(f))} / px)` : f >= 1 ? T.value = `Fine (±${M(Math.round(f))} / px)` : T.value = `Ultra-Fine (±1 index per ${Math.round(1 / f)}px)`;
|
|
1320
1325
|
} else {
|
|
1321
|
-
let
|
|
1322
|
-
u("update:modelValue", l.min + Math.round(i *
|
|
1326
|
+
let r = n.width - 16, i = Math.min(1, Math.max(0, (e.clientX - n.left - 8) / r));
|
|
1327
|
+
u("update:modelValue", l.min + Math.round(i * t)), T.value = "Coarse (Full range)";
|
|
1323
1328
|
}
|
|
1324
1329
|
}, j = (e) => {
|
|
1325
1330
|
if (p.value && !m.value) {
|
|
@@ -1371,7 +1376,7 @@ var N = {
|
|
|
1371
1376
|
], 4)
|
|
1372
1377
|
])) : a("", !0)]))], 64));
|
|
1373
1378
|
}
|
|
1374
|
-
}, [["__scopeId", "data-v-
|
|
1379
|
+
}, [["__scopeId", "data-v-afd79d20"]]);
|
|
1375
1380
|
//#endregion
|
|
1376
1381
|
//#region src/index.js
|
|
1377
1382
|
O.init("nano-ui", "https://analytics.7u.pl");
|