@vanduo-oss/framework 1.3.9 → 1.4.0

package/css/utilities/table.css

@@ -5,11 +5,11 @@
 
 :root {
   /* Table Colors */
-  --table-bg: var(--color-white);
-  --table-border-color: var(--border-color);
-  --table-striped-bg: var(--bg-secondary);
+  --table-bg: var(--vd-color-white);
+  --table-border-color: var(--vd-border-color);
+  --table-striped-bg: var(--vd-bg-secondary);
   --table-hover-bg: rgba(0, 0, 0, 0.075);
-  --table-active-bg: var(--color-primary-alpha-10);
+  --table-active-bg: var(--vd-color-primary-alpha-10);
 
   /* Table Spacing (Fibonacci) */
   --table-padding-y: 0.5rem;
@@ -27,7 +27,7 @@
 .table {
   width: 100%;
   margin-bottom: 1rem;
-  color: var(--text-primary);
+  color: var(--vd-text-primary);
   background-color: var(--table-bg);
   border-collapse: collapse;
 }
@@ -46,7 +46,7 @@
   vertical-align: bottom;
   border-bottom: 2px solid var(--table-border-color);
   font-weight: var(--font-weight-semibold);
-  color: var(--text-primary);
+  color: var(--vd-text-primary);
 }
 
 .vd-table tbody+tbody,
@@ -118,8 +118,8 @@
 .table-primary,
 .table-primary>th,
 .table-primary>td {
-  color: var(--color-white);
-  background-color: var(--color-primary);
+  color: var(--vd-color-white);
+  background-color: var(--vd-color-primary);
 }
 
 .vd-table-secondary,
@@ -128,8 +128,8 @@
 .table-secondary,
 .table-secondary>th,
 .table-secondary>td {
-  color: var(--color-white);
-  background-color: var(--color-secondary);
+  color: var(--vd-color-white);
+  background-color: var(--vd-color-secondary);
 }
 
 .vd-table-success,
@@ -138,8 +138,8 @@
 .table-success,
 .table-success>th,
 .table-success>td {
-  color: var(--color-white);
-  background-color: var(--color-success);
+  color: var(--vd-color-white);
+  background-color: var(--vd-color-success);
 }
 
 .vd-table-warning,
@@ -148,8 +148,8 @@
 .table-warning,
 .table-warning>th,
 .table-warning>td {
-  color: var(--color-gray-900);
-  background-color: var(--color-warning);
+  color: var(--vd-color-gray-900);
+  background-color: var(--vd-color-warning);
 }
 
 .vd-table-error,
@@ -158,8 +158,8 @@
 .table-error,
 .table-error>th,
 .table-error>td {
-  color: var(--color-white);
-  background-color: var(--color-error);
+  color: var(--vd-color-white);
+  background-color: var(--vd-color-error);
 }
 
 .vd-table-info,
@@ -168,15 +168,15 @@
 .table-info,
 .table-info>th,
 .table-info>td {
-  color: var(--color-white);
-  background-color: var(--color-info);
+  color: var(--vd-color-white);
+  background-color: var(--vd-color-info);
 }
 
 /* Table Sections */
 .vd-table-header,
 .table-header,
 thead {
-  background-color: var(--bg-secondary);
+  background-color: var(--vd-bg-secondary);
 }
 
 .vd-table-header th,
@@ -196,7 +196,7 @@ tbody {
 .vd-table-footer,
 .table-footer,
 tfoot {
-  background-color: var(--bg-secondary);
+  background-color: var(--vd-bg-secondary);
   font-weight: var(--font-weight-semibold);
 }
 
@@ -287,8 +287,8 @@ tfoot {
 /* Dark Table Variant */
 .vd-table-dark,
 .table-dark {
-  color: var(--color-white);
-  background-color: var(--color-gray-800);
+  color: var(--vd-color-white);
+  background-color: var(--vd-color-gray-800);
 }
 
 .vd-table-dark th,
@@ -315,13 +315,13 @@ tfoot {
 /* Dark Mode Table Overrides */
 [data-theme="dark"] .vd-table,
 [data-theme="dark"] .table {
-  --table-bg: var(--bg-primary);
-  --table-border-color: var(--border-color);
-  --table-striped-bg: var(--bg-secondary);
+  --table-bg: var(--vd-bg-primary);
+  --table-border-color: var(--vd-border-color);
+  --table-striped-bg: var(--vd-bg-secondary);
   --table-hover-bg: rgba(255, 255, 255, 0.05);
 
   background-color: var(--table-bg);
-  color: var(--text-primary);
+  color: var(--vd-text-primary);
 }
 
 [data-theme="dark"] .vd-table th,
@@ -334,7 +334,7 @@ tfoot {
 [data-theme="dark"] .vd-table thead th,
 [data-theme="dark"] .table thead th {
   border-color: var(--table-border-color);
-  color: var(--text-primary);
+  color: var(--vd-text-primary);
 }
 
 [data-theme="dark"] .vd-table-striped tbody tr:nth-of-type(odd),
@@ -344,7 +344,7 @@ tfoot {
 
 [data-theme="dark"] .vd-table thead,
 [data-theme="dark"] thead {
-  background-color: var(--bg-secondary);
+  background-color: var(--vd-bg-secondary);
 }
 
 /* Dark mode support for system preference */
@@ -352,13 +352,13 @@ tfoot {
 
   :root:not([data-theme]) .vd-table,
   :root:not([data-theme]) .table {
-    --table-bg: var(--bg-primary);
-    --table-border-color: var(--border-color);
-    --table-striped-bg: var(--bg-secondary);
+    --table-bg: var(--vd-bg-primary);
+    --table-border-color: var(--vd-border-color);
+    --table-striped-bg: var(--vd-bg-secondary);
     --table-hover-bg: rgba(255, 255, 255, 0.05);
 
     background-color: var(--table-bg);
-    color: var(--text-primary);
+    color: var(--vd-text-primary);
   }
 
   :root:not([data-theme]) .vd-table th,
@@ -371,7 +371,7 @@ tfoot {
   :root:not([data-theme]) .vd-table thead th,
   :root:not([data-theme]) .table thead th {
     border-color: var(--table-border-color);
-    color: var(--text-primary);
+    color: var(--vd-text-primary);
   }
 
   :root:not([data-theme]) .vd-table-striped tbody tr:nth-of-type(odd),
@@ -381,6 +381,6 @@ tfoot {
 
   :root:not([data-theme]) .vd-table thead,
   :root:not([data-theme]) thead {
-    background-color: var(--bg-secondary);
+    background-color: var(--vd-bg-secondary);
   }
 }

package/css/utilities/transitions.css

@@ -32,9 +32,15 @@
 
 /* Transition Duration Utilities */
 .vd-transition-none { transition: none; }
-.vd-transition-fast { transition-duration: var(--transition-duration-fast); }
+.vd-transition-fast {
+  transition: var(--transition-fast);
+  transition-duration: var(--transition-duration-fast);
+}
 .vd-transition-base { transition-duration: var(--transition-duration-base); }
-.vd-transition-slow { transition-duration: var(--transition-duration-slow); }
+.vd-transition-slow {
+  transition: var(--transition-slow);
+  transition-duration: var(--transition-duration-slow);
+}
 .vd-transition-slower { transition-duration: var(--transition-duration-slower); }
 .vd-transition-slowest { transition-duration: var(--transition-duration-slowest); }
 
@@ -48,20 +54,26 @@
 /* Transition Property Utilities */
 .vd-transition-all { transition-property: all; }
 .vd-transition-colors { transition-property: color, background-color, border-color; }
-.vd-transition-opacity { transition-property: opacity; }
-.vd-transition-transform { transition-property: transform; }
-.vd-transition-shadow { transition-property: box-shadow; }
+.vd-transition-opacity {
+  transition: var(--transition-opacity);
+  transition-property: opacity;
+}
+
+.vd-transition-transform {
+  transition: var(--transition-transform);
+  transition-property: transform;
+}
+
+.vd-transition-shadow {
+  transition: var(--transition-shadow);
+  transition-property: box-shadow;
+}
 
 /* Combined Transition Utilities */
 .vd-transition { transition: var(--transition-base); }
-.vd-transition-fast { transition: var(--transition-fast); }
-.vd-transition-slow { transition: var(--transition-slow); }
 .vd-transition-color { transition: var(--transition-color); }
 .vd-transition-bg { transition: var(--transition-bg); }
 .vd-transition-border { transition: var(--transition-border); }
-.vd-transition-opacity { transition: var(--transition-opacity); }
-.vd-transition-transform { transition: var(--transition-transform); }
-.vd-transition-shadow { transition: var(--transition-shadow); }
 
 /* Delay Utilities */
 .vd-transition-delay-none { transition-delay: 0ms; }

package/css/vanduo.css

@@ -3,10 +3,10 @@
  * Import all framework modules
  */
 
-/* CSS Reset - Must be first */
+/* Layer 0: Reset */
 @import url('core/reset.css');
 
-/* Core Foundation */
+/* Layer 1: Foundation (palette -> canonical tokens -> compatibility aliases) */
 @import url('core/colors.css');
 @import url('core/fonts.css');
 @import url('core/typography.css');
@@ -15,43 +15,34 @@
 @import url('core/grid.css');
 @import url('core/helpers.css');
 
-/* Icons - All Phosphor Weights */
+/* Layer 2: Icons */
 @import url('icons/icons-all.css');
 
-/* Utilities - Phase 2 */
+/* Layer 3: Utilities */
 @import url('utilities/shadow.css');
-
-/* Utilities - Phase 4 */
 @import url('utilities/transitions.css');
 @import url('utilities/transforms.css');
+@import url('utilities/media.css');
+@import url('utilities/table.css');
+@import url('utilities/color-utilities.css');
 
-/* Components - Phase 2 */
+/* Layer 4: Components */
 @import url('components/buttons.css');
 @import url('components/forms.css');
 @import url('components/cards.css');
 @import url('components/expanding-cards.css');
-
-/* Components - Phase 3 */
 @import url('components/navbar.css');
 @import url('components/footer.css');
 @import url('components/breadcrumbs.css');
-
-/* Components - Phase 5 */
 @import url('components/tooltips.css');
 @import url('components/collapsible.css');
 @import url('components/dropdown.css');
 @import url('components/modals.css');
-
-/* Components - Phase 6 */
 @import url('components/badges.css');
 @import url('components/collections.css');
 @import url('components/pagination.css');
 @import url('components/sidenav.css');
-
-/* Components - Phase 7 */
 @import url('components/preloader.css');
-
-/* Components - Phase 8 (New) */
 @import url('components/alerts.css');
 @import url('components/chips.css');
 @import url('components/avatar.css');
@@ -66,23 +57,7 @@
 @import url('components/image-box.css');
 @import url('components/doc-tabs.css');
 @import url('components/doc-search.css');
-
-/* Utilities - Phase 7 */
-@import url('utilities/media.css');
-@import url('utilities/table.css');
-
-/* Utilities - Color palette (per-hue bg/text classes) */
-@import url('utilities/color-utilities.css');
-
-/* Effects - Phase 7 */
-@import url('effects/parallax.css');
-@import url('effects/glass.css');
-@import url('effects/morph.css');
-
-/* Components - Phase 9 (New) */
 @import url('components/draggable.css');
-
-/* Components - Phase 10 (v1.2.7) */
 @import url('components/flow.css');
 @import url('components/bubble.css');
 @import url('components/waypoint.css');
@@ -100,5 +75,10 @@
 @import url('components/spotlight.css');
 @import url('components/music-player.css');
 
-/* Print Styles */
+/* Layer 5: Effects */
+@import url('effects/parallax.css');
+@import url('effects/glass.css');
+@import url('effects/morph.css');
+
+/* Layer 6: Print */
 @import url('utilities/print.css');

package/dist/build-info.json

@@ -1,6 +1,6 @@
 {
-  "version": "1.3.9",
-  "builtAt": "2026-05-10T18:54:59.798Z",
-  "commit": "2945a85",
+  "version": "1.4.0",
+  "builtAt": "2026-05-20T14:51:00.085Z",
+  "commit": "46420b0",
   "mode": "development+production"
 }