@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.
Files changed (53) hide show
  1. package/CHANGELOG.md +82 -0
  2. package/README.md +23 -9
  3. package/css/primitives/primitives.css +257 -0
  4. package/css/utilities/print.css +19 -17
  5. package/css/vanduo.css +9 -3
  6. package/dist/build-info.json +3 -3
  7. package/dist/vanduo-core.css +19701 -0
  8. package/dist/vanduo-core.css.map +1 -0
  9. package/dist/vanduo-core.min.css +2 -0
  10. package/dist/vanduo-core.min.css.map +1 -0
  11. package/dist/vanduo.cjs.js +39 -19
  12. package/dist/vanduo.cjs.js.map +2 -2
  13. package/dist/vanduo.cjs.min.js +5 -5
  14. package/dist/vanduo.cjs.min.js.map +3 -3
  15. package/dist/vanduo.css +628 -33585
  16. package/dist/vanduo.css.map +1 -1
  17. package/dist/vanduo.d.ts +77 -0
  18. package/dist/vanduo.esm.js +39 -19
  19. package/dist/vanduo.esm.js.map +2 -2
  20. package/dist/vanduo.esm.min.js +5 -5
  21. package/dist/vanduo.esm.min.js.map +3 -3
  22. package/dist/vanduo.js +39 -19
  23. package/dist/vanduo.js.map +2 -2
  24. package/dist/vanduo.min.css +2 -2
  25. package/dist/vanduo.min.css.map +1 -1
  26. package/dist/vanduo.min.js +5 -5
  27. package/dist/vanduo.min.js.map +3 -3
  28. package/js/components/parallax.js +13 -7
  29. package/js/components/spotlight.js +46 -16
  30. package/package.json +7 -3
  31. package/css/components/doc-tabs.css +0 -38
  32. package/dist/icons/phosphor/bold/Phosphor-Bold.svg +0 -3057
  33. package/dist/icons/phosphor/bold/Phosphor-Bold.ttf +0 -0
  34. package/dist/icons/phosphor/bold/Phosphor-Bold.woff +0 -0
  35. package/dist/icons/phosphor/bold/Phosphor-Bold.woff2 +0 -0
  36. package/dist/icons/phosphor/bold/style.css +0 -4627
  37. package/dist/icons/phosphor/duotone/Phosphor-Duotone.svg +0 -3054
  38. package/dist/icons/phosphor/duotone/Phosphor-Duotone.ttf +0 -0
  39. package/dist/icons/phosphor/duotone/Phosphor-Duotone.woff +0 -0
  40. package/dist/icons/phosphor/duotone/Phosphor-Duotone.woff2 +0 -0
  41. package/dist/icons/phosphor/duotone/style.css +0 -12115
  42. package/dist/icons/phosphor/light/Phosphor-Light.svg +0 -3057
  43. package/dist/icons/phosphor/light/Phosphor-Light.ttf +0 -0
  44. package/dist/icons/phosphor/light/Phosphor-Light.woff +0 -0
  45. package/dist/icons/phosphor/light/Phosphor-Light.woff2 +0 -0
  46. package/dist/icons/phosphor/light/style.css +0 -4627
  47. package/dist/icons/phosphor/thin/Phosphor-Thin.svg +0 -3057
  48. package/dist/icons/phosphor/thin/Phosphor-Thin.ttf +0 -0
  49. package/dist/icons/phosphor/thin/Phosphor-Thin.woff +0 -0
  50. package/dist/icons/phosphor/thin/Phosphor-Thin.woff2 +0 -0
  51. package/dist/icons/phosphor/thin/style.css +0 -4627
  52. package/js/components/vd-hex.js +0 -838
  53. package/js/utils/hex-math.js +0 -233
@@ -1,4 +1,4 @@
1
- /*! Vanduo v1.4.5 | Built: 2026-06-11T18:11:31.153Z | git:70ed923 | development */
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.4.5" : "0.0.0-dev";
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 layerSpeed = layer.dataset.parallaxSpeed ? parseFloat(layer.dataset.parallaxSpeed) : 1;
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
- requestAnimationFrame(() => {
10587
- const rect = target.getBoundingClientRect();
10588
- const tRect = tooltip.getBoundingClientRect();
10589
- let top = rect.bottom + 12 + window.scrollY;
10590
- let left = rect.left + (rect.width - tRect.width) / 2 + window.scrollX;
10591
- left = Math.max(8, Math.min(left, window.innerWidth - tRect.width - 8));
10592
- if (top + tRect.height > window.innerHeight + window.scrollY) {
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
  }