@vanduo-oss/framework 1.4.5 → 1.5.0
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/CHANGELOG.md +82 -0
- package/README.md +23 -9
- package/css/primitives/primitives.css +257 -0
- package/css/utilities/print.css +19 -17
- package/css/vanduo.css +9 -3
- package/dist/build-info.json +3 -3
- package/dist/vanduo-core.css +19701 -0
- package/dist/vanduo-core.css.map +1 -0
- package/dist/vanduo-core.min.css +2 -0
- package/dist/vanduo-core.min.css.map +1 -0
- package/dist/vanduo.cjs.js +39 -19
- package/dist/vanduo.cjs.js.map +2 -2
- package/dist/vanduo.cjs.min.js +5 -5
- package/dist/vanduo.cjs.min.js.map +3 -3
- package/dist/vanduo.css +628 -33585
- package/dist/vanduo.css.map +1 -1
- package/dist/vanduo.d.ts +77 -0
- package/dist/vanduo.esm.js +39 -19
- package/dist/vanduo.esm.js.map +2 -2
- package/dist/vanduo.esm.min.js +5 -5
- package/dist/vanduo.esm.min.js.map +3 -3
- package/dist/vanduo.js +39 -19
- package/dist/vanduo.js.map +2 -2
- package/dist/vanduo.min.css +2 -2
- package/dist/vanduo.min.css.map +1 -1
- package/dist/vanduo.min.js +5 -5
- package/dist/vanduo.min.js.map +3 -3
- package/js/components/parallax.js +13 -7
- package/js/components/spotlight.js +46 -16
- package/package.json +7 -3
- package/css/components/doc-tabs.css +0 -38
- package/dist/icons/phosphor/bold/Phosphor-Bold.svg +0 -3057
- package/dist/icons/phosphor/bold/Phosphor-Bold.ttf +0 -0
- package/dist/icons/phosphor/bold/Phosphor-Bold.woff +0 -0
- package/dist/icons/phosphor/bold/Phosphor-Bold.woff2 +0 -0
- package/dist/icons/phosphor/bold/style.css +0 -4627
- package/dist/icons/phosphor/duotone/Phosphor-Duotone.svg +0 -3054
- package/dist/icons/phosphor/duotone/Phosphor-Duotone.ttf +0 -0
- package/dist/icons/phosphor/duotone/Phosphor-Duotone.woff +0 -0
- package/dist/icons/phosphor/duotone/Phosphor-Duotone.woff2 +0 -0
- package/dist/icons/phosphor/duotone/style.css +0 -12115
- package/dist/icons/phosphor/light/Phosphor-Light.svg +0 -3057
- package/dist/icons/phosphor/light/Phosphor-Light.ttf +0 -0
- package/dist/icons/phosphor/light/Phosphor-Light.woff +0 -0
- package/dist/icons/phosphor/light/Phosphor-Light.woff2 +0 -0
- package/dist/icons/phosphor/light/style.css +0 -4627
- package/dist/icons/phosphor/thin/Phosphor-Thin.svg +0 -3057
- package/dist/icons/phosphor/thin/Phosphor-Thin.ttf +0 -0
- package/dist/icons/phosphor/thin/Phosphor-Thin.woff +0 -0
- package/dist/icons/phosphor/thin/Phosphor-Thin.woff2 +0 -0
- package/dist/icons/phosphor/thin/style.css +0 -4627
- package/js/components/vd-hex.js +0 -838
- package/js/utils/hex-math.js +0 -233
package/dist/vanduo.cjs.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/*! Vanduo v1.
|
|
1
|
+
/*! Vanduo v1.5.0 | Built: 2026-06-18T19:13:58.613Z | git:8f0e1b5 | development */
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
@@ -201,7 +201,7 @@ module.exports = __toCommonJS(index_exports);
|
|
|
201
201
|
// js/vanduo.js
|
|
202
202
|
(function() {
|
|
203
203
|
"use strict";
|
|
204
|
-
const VANDUO_VERSION = true ? "1.
|
|
204
|
+
const VANDUO_VERSION = true ? "1.5.0" : "0.0.0-dev";
|
|
205
205
|
const hasOwn = Object.prototype.hasOwnProperty;
|
|
206
206
|
const Vanduo2 = {
|
|
207
207
|
version: VANDUO_VERSION,
|
|
@@ -3104,13 +3104,13 @@ module.exports = __toCommonJS(index_exports);
|
|
|
3104
3104
|
*/
|
|
3105
3105
|
initParallax: function(element) {
|
|
3106
3106
|
element.dataset.parallaxInitialized = "true";
|
|
3107
|
-
const disableMobile = element.classList.contains("parallax-disable-mobile");
|
|
3107
|
+
const disableMobile = element.classList.contains("vd-parallax-disable-mobile") || element.classList.contains("parallax-disable-mobile");
|
|
3108
3108
|
if (disableMobile && this.isMobile) {
|
|
3109
3109
|
return;
|
|
3110
3110
|
}
|
|
3111
3111
|
const layers = element.querySelectorAll(".vd-parallax-layer, .vd-parallax-bg");
|
|
3112
3112
|
const speed = this.getSpeed(element);
|
|
3113
|
-
const direction = element.classList.contains("parallax-horizontal") ? "horizontal" : "vertical";
|
|
3113
|
+
const direction = element.classList.contains("vd-parallax-horizontal") || element.classList.contains("parallax-horizontal") ? "horizontal" : "vertical";
|
|
3114
3114
|
this.parallaxElements.set(element, {
|
|
3115
3115
|
layers: Array.from(layers),
|
|
3116
3116
|
speed,
|
|
@@ -3125,9 +3125,9 @@ module.exports = __toCommonJS(index_exports);
|
|
|
3125
3125
|
* @returns {number} Speed multiplier
|
|
3126
3126
|
*/
|
|
3127
3127
|
getSpeed: function(element) {
|
|
3128
|
-
if (element.classList.contains("parallax-slow")) {
|
|
3128
|
+
if (element.classList.contains("vd-parallax-slow") || element.classList.contains("parallax-slow")) {
|
|
3129
3129
|
return 0.5;
|
|
3130
|
-
} else if (element.classList.contains("parallax-fast")) {
|
|
3130
|
+
} else if (element.classList.contains("vd-parallax-fast") || element.classList.contains("parallax-fast")) {
|
|
3131
3131
|
return 1.5;
|
|
3132
3132
|
}
|
|
3133
3133
|
return 1;
|
|
@@ -3174,7 +3174,8 @@ module.exports = __toCommonJS(index_exports);
|
|
|
3174
3174
|
));
|
|
3175
3175
|
const offset = (scrollProgress - 0.5) * config.speed * 100;
|
|
3176
3176
|
config.layers.forEach((layer, _index) => {
|
|
3177
|
-
const
|
|
3177
|
+
const layerSpeedAttr = layer.dataset.parallaxSpeed || layer.dataset.speed;
|
|
3178
|
+
const layerSpeed = layerSpeedAttr ? parseFloat(layerSpeedAttr) : 1;
|
|
3178
3179
|
const layerOffset = offset * layerSpeed;
|
|
3179
3180
|
if (config.direction === "horizontal") {
|
|
3180
3181
|
layer.style.transform = `translateX(${layerOffset}px)`;
|
|
@@ -10440,6 +10441,7 @@ module.exports = __toCommonJS(index_exports);
|
|
|
10440
10441
|
_cleanup: [],
|
|
10441
10442
|
_boundTriggers: /* @__PURE__ */ new WeakMap(),
|
|
10442
10443
|
_triggerElement: null,
|
|
10444
|
+
_currentTarget: null,
|
|
10443
10445
|
init: function(root) {
|
|
10444
10446
|
const triggers = window.Vanduo.queryAll(root, "[data-vd-spotlight]");
|
|
10445
10447
|
triggers.forEach((trigger) => {
|
|
@@ -10508,8 +10510,29 @@ module.exports = __toCommonJS(index_exports);
|
|
|
10508
10510
|
document.addEventListener("keydown", escHandler);
|
|
10509
10511
|
this._cleanup.push(() => document.removeEventListener("keydown", escHandler));
|
|
10510
10512
|
overlay.addEventListener("click", () => this.stop());
|
|
10513
|
+
const reposition = () => {
|
|
10514
|
+
if (this._active && this._currentTarget) this._positionTooltip(this._currentTarget);
|
|
10515
|
+
};
|
|
10516
|
+
window.addEventListener("scroll", reposition, { passive: true });
|
|
10517
|
+
window.addEventListener("resize", reposition);
|
|
10518
|
+
this._cleanup.push(() => window.removeEventListener("scroll", reposition));
|
|
10519
|
+
this._cleanup.push(() => window.removeEventListener("resize", reposition));
|
|
10511
10520
|
this._showStep(this._currentStep);
|
|
10512
10521
|
},
|
|
10522
|
+
_positionTooltip: function(target) {
|
|
10523
|
+
const tooltip = this._elements.tooltip;
|
|
10524
|
+
if (!tooltip || !target || !target.isConnected) return;
|
|
10525
|
+
const rect = target.getBoundingClientRect();
|
|
10526
|
+
const tRect = tooltip.getBoundingClientRect();
|
|
10527
|
+
let top = rect.bottom + 12 + window.scrollY;
|
|
10528
|
+
let left = rect.left + (rect.width - tRect.width) / 2 + window.scrollX;
|
|
10529
|
+
left = Math.max(8, Math.min(left, window.innerWidth - tRect.width - 8));
|
|
10530
|
+
if (top + tRect.height > window.innerHeight + window.scrollY) {
|
|
10531
|
+
top = rect.top - tRect.height - 12 + window.scrollY;
|
|
10532
|
+
}
|
|
10533
|
+
tooltip.style.top = top + "px";
|
|
10534
|
+
tooltip.style.left = left + "px";
|
|
10535
|
+
},
|
|
10513
10536
|
_showStep: function(index) {
|
|
10514
10537
|
const step = this._steps[index];
|
|
10515
10538
|
if (!step) return;
|
|
@@ -10582,19 +10605,15 @@ module.exports = __toCommonJS(index_exports);
|
|
|
10582
10605
|
footer.appendChild(counter);
|
|
10583
10606
|
footer.appendChild(actions);
|
|
10584
10607
|
tooltip.appendChild(footer);
|
|
10608
|
+
this._currentTarget = target || null;
|
|
10585
10609
|
if (target) {
|
|
10586
|
-
|
|
10587
|
-
|
|
10588
|
-
|
|
10589
|
-
|
|
10590
|
-
|
|
10591
|
-
|
|
10592
|
-
|
|
10593
|
-
top = rect.top - tRect.height - 12 + window.scrollY;
|
|
10594
|
-
}
|
|
10595
|
-
tooltip.style.top = top + "px";
|
|
10596
|
-
tooltip.style.left = left + "px";
|
|
10597
|
-
});
|
|
10610
|
+
let frames = 0;
|
|
10611
|
+
const settle = () => {
|
|
10612
|
+
if (!this._active || this._currentTarget !== target) return;
|
|
10613
|
+
this._positionTooltip(target);
|
|
10614
|
+
if (frames++ < 30) requestAnimationFrame(settle);
|
|
10615
|
+
};
|
|
10616
|
+
requestAnimationFrame(settle);
|
|
10598
10617
|
}
|
|
10599
10618
|
document.dispatchEvent(new CustomEvent("spotlight:step", {
|
|
10600
10619
|
detail: { index, step: index, total, data: step }
|
|
@@ -10635,6 +10654,7 @@ module.exports = __toCommonJS(index_exports);
|
|
|
10635
10654
|
this._elements = {};
|
|
10636
10655
|
this._steps = [];
|
|
10637
10656
|
this._currentStep = 0;
|
|
10657
|
+
this._currentTarget = null;
|
|
10638
10658
|
if (this._triggerElement && this._triggerElement.isConnected && typeof this._triggerElement.focus === "function") {
|
|
10639
10659
|
this._triggerElement.focus();
|
|
10640
10660
|
}
|