@vanduo-oss/framework 1.4.5 → 1.4.6

package/js/components/parallax.js

@@ -64,15 +64,17 @@
     initParallax: function (element) {
       element.dataset.parallaxInitialized = 'true';
 
-      // Check if disabled on mobile
-      const disableMobile = element.classList.contains('parallax-disable-mobile');
+      // Check if disabled on mobile (vd- prefixed; unprefixed kept for back-compat)
+      const disableMobile = element.classList.contains('vd-parallax-disable-mobile')
+        || element.classList.contains('parallax-disable-mobile');
       if (disableMobile && this.isMobile) {
         return;
       }
 
       const layers = element.querySelectorAll('.vd-parallax-layer, .vd-parallax-bg');
       const speed = this.getSpeed(element);
-      const direction = element.classList.contains('parallax-horizontal') ? 'horizontal' : 'vertical';
+      const direction = (element.classList.contains('vd-parallax-horizontal')
+        || element.classList.contains('parallax-horizontal')) ? 'horizontal' : 'vertical';
 
       this.parallaxElements.set(element, {
         layers: Array.from(layers),
@@ -91,9 +93,11 @@
      * @returns {number} Speed multiplier
      */
     getSpeed: function (element) {
-      if (element.classList.contains('parallax-slow')) {
+      if (element.classList.contains('vd-parallax-slow')
+        || element.classList.contains('parallax-slow')) {
         return 0.5;
-      } else if (element.classList.contains('parallax-fast')) {
+      } else if (element.classList.contains('vd-parallax-fast')
+        || element.classList.contains('parallax-fast')) {
         return 1.5;
       }
       return 1; // Default medium speed
@@ -150,8 +154,10 @@
       const offset = (scrollProgress - 0.5) * config.speed * 100;
 
       config.layers.forEach((layer, _index) => {
-        // Different layers can have different speeds
-        const layerSpeed = layer.dataset.parallaxSpeed ? parseFloat(layer.dataset.parallaxSpeed) : 1;
+        // Different layers can have different speeds. Accept data-parallax-speed
+        // (canonical) or data-speed (back-compat).
+        const layerSpeedAttr = layer.dataset.parallaxSpeed || layer.dataset.speed;
+        const layerSpeed = layerSpeedAttr ? parseFloat(layerSpeedAttr) : 1;
         const layerOffset = offset * layerSpeed;
 
         if (config.direction === 'horizontal') {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vanduo-oss/framework",
-  "version": "1.4.5",
+  "version": "1.4.6",
   "description": "Zero-dependency CSS/JS framework built on Fibonacci/Golden Ratio design system with Open Color integration",
   "keywords": [
     "css",
@@ -21,13 +21,16 @@
   "type": "module",
   "main": "dist/vanduo.cjs.js",
   "module": "dist/vanduo.esm.js",
+  "types": "./dist/vanduo.d.ts",
   "exports": {
     ".": {
+      "types": "./dist/vanduo.d.ts",
       "import": "./dist/vanduo.esm.js",
       "require": "./dist/vanduo.cjs.js",
       "default": "./dist/vanduo.esm.js"
     },
     "./css": "./dist/vanduo.min.css",
+    "./css/core": "./dist/vanduo-core.min.css",
     "./iife": "./dist/vanduo.min.js",
     "./package.json": "./package.json"
   },
@@ -36,12 +39,13 @@
     "css/",
     "js/",
     "fonts/",
-    "icons/"
+    "icons/",
+    "CHANGELOG.md"
   ],
   "devDependencies": {
     "@eslint/js": "^10.0.1",
     "@playwright/test": "^1.60.0",
-    "esbuild": "^0.28.0",
+    "esbuild": "^0.28.1",
     "eslint": "^10.4.1",
     "husky": "^9.1.7",
     "lightningcss": "^1.32.0",

package/css/components/doc-tabs.css

@@ -1,38 +0,0 @@
-/**
- * Vanduo Documentation Tabs Component
- * Provides styled tab navigation for documentation sections
- */
-
-.doc-tabs {
-    display: flex;
-    gap: 0.5rem;
-    margin: 1rem 0 1.5rem;
-    flex-wrap: wrap;
-}
-
-.doc-tab {
-    display: inline-flex;
-    align-items: center;
-    gap: 0.4rem;
-    padding: 0.6rem 1rem;
-    border: 1px solid var(--vd-border-color);
-    border-radius: var(--vd-btn-border-radius);
-    background: var(--vd-bg-secondary);
-    color: var(--vd-text-primary);
-    text-decoration: none;
-    font-weight: 500;
-    transition: all 0.2s ease;
-}
-
-.doc-tab:hover {
-    border-color: var(--vd-color-primary);
-    color: var(--vd-color-primary);
-    background: var(--vd-color-primary-alpha-08);
-}
-
-.doc-tab.active {
-    border-color: var(--vd-color-primary);
-    color: var(--vd-text-on-primary);
-    background: var(--vd-color-primary);
-    box-shadow: 0 0 0 1px var(--vd-color-primary-alpha-20);
-}