@vanduo-oss/framework 1.3.9 → 1.4.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.
Files changed (124) hide show
  1. package/README.md +89 -42
  2. package/css/components/affix.css +12 -12
  3. package/css/components/alerts.css +70 -70
  4. package/css/components/avatar.css +78 -78
  5. package/css/components/badges.css +67 -67
  6. package/css/components/breadcrumbs.css +32 -32
  7. package/css/components/bubble.css +40 -40
  8. package/css/components/button-group.css +2 -2
  9. package/css/components/buttons.css +157 -157
  10. package/css/components/cards.css +79 -79
  11. package/css/components/chips.css +50 -50
  12. package/css/components/code-snippet.css +132 -132
  13. package/css/components/collapsible.css +67 -67
  14. package/css/components/collections.css +68 -68
  15. package/css/components/datepicker.css +54 -54
  16. package/css/components/doc-search.css +96 -103
  17. package/css/components/doc-tabs.css +11 -11
  18. package/css/components/draggable.css +77 -77
  19. package/css/components/dropdown.css +50 -50
  20. package/css/components/expanding-cards.css +1 -1
  21. package/css/components/fab.css +61 -61
  22. package/css/components/flow.css +55 -55
  23. package/css/components/footer.css +62 -62
  24. package/css/components/forms.css +437 -425
  25. package/css/components/image-box.css +50 -54
  26. package/css/components/modals.css +51 -51
  27. package/css/components/music-player.css +150 -150
  28. package/css/components/navbar.css +80 -80
  29. package/css/components/pagination.css +51 -51
  30. package/css/components/preloader.css +19 -19
  31. package/css/components/progress.css +20 -20
  32. package/css/components/rating.css +19 -19
  33. package/css/components/ripple.css +10 -10
  34. package/css/components/sidenav.css +72 -72
  35. package/css/components/skeleton.css +17 -16
  36. package/css/components/spinner.css +33 -33
  37. package/css/components/spotlight.css +33 -33
  38. package/css/components/stepper.css +39 -39
  39. package/css/components/suggest.css +37 -37
  40. package/css/components/tabs.css +60 -60
  41. package/css/components/theme-customizer.css +154 -154
  42. package/css/components/timeline.css +50 -50
  43. package/css/components/timepicker.css +29 -29
  44. package/css/components/toast.css +53 -53
  45. package/css/components/tooltips.css +78 -78
  46. package/css/components/transfer.css +37 -37
  47. package/css/components/tree.css +28 -28
  48. package/css/components/waypoint.css +12 -12
  49. package/css/core/colors.css +640 -640
  50. package/css/core/grid.css +127 -132
  51. package/css/core/helpers.css +349 -349
  52. package/css/core/tokens.css +133 -67
  53. package/css/core/typography.css +105 -103
  54. package/css/effects/morph.css +21 -21
  55. package/css/effects/parallax.css +6 -6
  56. package/css/utilities/color-utilities.css +273 -273
  57. package/css/utilities/media.css +4 -4
  58. package/css/utilities/shadow.css +75 -75
  59. package/css/utilities/table.css +64 -64
  60. package/css/utilities/transitions.css +53 -41
  61. package/css/vanduo.css +14 -35
  62. package/dist/build-info.json +3 -3
  63. package/dist/vanduo.cjs.js +947 -307
  64. package/dist/vanduo.cjs.js.map +3 -3
  65. package/dist/vanduo.cjs.min.js +7 -7
  66. package/dist/vanduo.cjs.min.js.map +3 -3
  67. package/dist/vanduo.css +9650 -9656
  68. package/dist/vanduo.css.map +1 -1
  69. package/dist/vanduo.esm.js +947 -307
  70. package/dist/vanduo.esm.js.map +3 -3
  71. package/dist/vanduo.esm.min.js +7 -7
  72. package/dist/vanduo.esm.min.js.map +3 -3
  73. package/dist/vanduo.js +947 -307
  74. package/dist/vanduo.js.map +3 -3
  75. package/dist/vanduo.min.css +2 -2
  76. package/dist/vanduo.min.css.map +1 -1
  77. package/dist/vanduo.min.js +7 -7
  78. package/dist/vanduo.min.js.map +3 -3
  79. package/js/components/affix.js +4 -4
  80. package/js/components/bubble.js +3 -3
  81. package/js/components/code-snippet.js +129 -5
  82. package/js/components/collapsible.js +2 -3
  83. package/js/components/datepicker.js +2 -2
  84. package/js/components/doc-search.js +69 -11
  85. package/js/components/draggable.js +4 -4
  86. package/js/components/dropdown.js +2 -3
  87. package/js/components/expanding-cards.js +2 -2
  88. package/js/components/flow.js +2 -2
  89. package/js/components/font-switcher.js +23 -13
  90. package/js/components/glass.js +2 -2
  91. package/js/components/grid.js +19 -8
  92. package/js/components/image-box.js +51 -12
  93. package/js/components/lazy-load.js +81 -9
  94. package/js/components/modals.js +28 -12
  95. package/js/components/morph.js +3 -3
  96. package/js/components/music-player.js +13 -13
  97. package/js/components/navbar.js +3 -3
  98. package/js/components/pagination.js +2 -3
  99. package/js/components/parallax.js +9 -10
  100. package/js/components/preloader.js +15 -6
  101. package/js/components/rating.js +2 -2
  102. package/js/components/ripple.js +2 -2
  103. package/js/components/select.js +2 -3
  104. package/js/components/sidenav.js +43 -14
  105. package/js/components/spotlight.js +2 -2
  106. package/js/components/stepper.js +2 -2
  107. package/js/components/suggest.js +9 -3
  108. package/js/components/tabs.js +2 -2
  109. package/js/components/theme-customizer.js +155 -25
  110. package/js/components/theme-switcher.js +27 -16
  111. package/js/components/timeline.js +41 -12
  112. package/js/components/timepicker.js +2 -2
  113. package/js/components/toast.js +1 -1
  114. package/js/components/tooltips.js +4 -4
  115. package/js/components/transfer.js +2 -2
  116. package/js/components/tree.js +2 -2
  117. package/js/components/validate.js +2 -2
  118. package/js/components/vd-hex.js +10 -6
  119. package/js/components/waypoint.js +2 -2
  120. package/js/utils/helpers.js +7 -4
  121. package/js/utils/lifecycle.js +158 -83
  122. package/js/vanduo.js +203 -34
  123. package/package.json +2 -1
  124. package/css/core/vd-aliases.css +0 -60
package/css/components/bubble.css CHANGED
@@ -6,40 +6,40 @@
6
6
 
7
7
  :root {
8
8
  /* Bubble Colors */
9
- --bubble-bg: var(--card-bg, #fff);
10
- --bubble-text: var(--text-primary, #212529);
11
- --bubble-border-color: var(--border-color, #dee2e6);
12
- --bubble-shadow: 0 0.5rem 1.3125rem rgba(0, 0, 0, 0.12); /* 8px 21px - fib */
9
+ --vd-bubble-bg: var(--vd-card-bg, #fff);
10
+ --vd-bubble-text: var(--vd-text-primary, #212529);
11
+ --vd-bubble-border-color: var(--vd-border-color, #dee2e6);
12
+ --vd-bubble-shadow: 0 0.5rem 1.3125rem rgba(0, 0, 0, 0.12); /* 8px 21px - fib */
13
13
 
14
14
  /* Bubble Spacing (Fibonacci) */
15
- --bubble-padding: 0.8125rem; /* 13px - fib */
16
- --bubble-header-padding: 0.5rem 0.8125rem; /* 8px 13px */
17
- --bubble-arrow-size: 8px; /* fib */
15
+ --vd-bubble-padding: 0.8125rem; /* 13px - fib */
16
+ --vd-bubble-header-padding: 0.5rem 0.8125rem; /* 8px 13px */
17
+ --vd-bubble-arrow-size: 8px; /* fib */
18
18
 
19
19
  /* Bubble Sizing */
20
- --bubble-max-width: 21rem; /* 336px - fib×16 */
21
- --bubble-min-width: 8rem;
22
- --bubble-border-radius: var(--border-radius, 0.5rem);
20
+ --vd-bubble-max-width: 21rem; /* 336px - fib×16 */
21
+ --vd-bubble-min-width: 8rem;
22
+ --vd-bubble-border-radius: var(--vd-border-radius, 0.5rem);
23
23
 
24
24
  /* Bubble Z-index */
25
- --bubble-z-index: 1060;
25
+ --vd-bubble-z-index: 1060;
26
26
 
27
27
  /* Bubble Font */
28
- --bubble-font-size: var(--font-size-sm, 0.875rem);
28
+ --vd-bubble-font-size: var(--vd-font-size-sm, 0.875rem);
29
29
  }
30
30
 
31
31
  /* Dark Theme */
32
32
  [data-theme="dark"] {
33
- --bubble-bg: var(--card-bg, #2d2d44);
34
- --bubble-border-color: var(--border-color, #3d3d5c);
35
- --bubble-shadow: 0 0.5rem 1.3125rem rgba(0, 0, 0, 0.3);
33
+ --vd-bubble-bg: var(--vd-card-bg, #2d2d44);
34
+ --vd-bubble-border-color: var(--vd-border-color, #3d3d5c);
35
+ --vd-bubble-shadow: 0 0.5rem 1.3125rem rgba(0, 0, 0, 0.3);
36
36
  }
37
37
 
38
38
  @media (prefers-color-scheme: dark) {
39
39
  :root:not([data-theme]) {
40
- --bubble-bg: var(--card-bg, #2d2d44);
41
- --bubble-border-color: var(--border-color, #3d3d5c);
42
- --bubble-shadow: 0 0.5rem 1.3125rem rgba(0, 0, 0, 0.3);
40
+ --vd-bubble-bg: var(--vd-card-bg, #2d2d44);
41
+ --vd-bubble-border-color: var(--vd-border-color, #3d3d5c);
42
+ --vd-bubble-shadow: 0 0.5rem 1.3125rem rgba(0, 0, 0, 0.3);
43
43
  }
44
44
  }
45
45
 
@@ -48,15 +48,15 @@
48
48
  .vd-bubble-content,
49
49
  .vd-popover-content {
50
50
  position: absolute;
51
- z-index: var(--bubble-z-index);
52
- max-width: var(--bubble-max-width);
53
- min-width: var(--bubble-min-width);
54
- background: var(--bubble-bg);
55
- color: var(--bubble-text);
56
- border: 1px solid var(--bubble-border-color);
57
- border-radius: var(--bubble-border-radius);
58
- box-shadow: var(--bubble-shadow);
59
- font-size: var(--bubble-font-size);
51
+ z-index: var(--vd-bubble-z-index);
52
+ max-width: var(--vd-bubble-max-width);
53
+ min-width: var(--vd-bubble-min-width);
54
+ background: var(--vd-bubble-bg);
55
+ color: var(--vd-bubble-text);
56
+ border: 1px solid var(--vd-bubble-border-color);
57
+ border-radius: var(--vd-bubble-border-radius);
58
+ box-shadow: var(--vd-bubble-shadow);
59
+ font-size: var(--vd-bubble-font-size);
60
60
  opacity: 0;
61
61
  visibility: hidden;
62
62
  transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
@@ -78,15 +78,15 @@
78
78
  display: flex;
79
79
  align-items: center;
80
80
  justify-content: space-between;
81
- padding: var(--bubble-header-padding);
82
- border-bottom: 1px solid var(--bubble-border-color);
81
+ padding: var(--vd-bubble-header-padding);
82
+ border-bottom: 1px solid var(--vd-bubble-border-color);
83
83
  font-weight: 600;
84
84
  }
85
85
 
86
86
  /* ========== Body ========== */
87
87
 
88
88
  .vd-bubble-body {
89
- padding: var(--bubble-padding);
89
+ padding: var(--vd-bubble-padding);
90
90
  }
91
91
 
92
92
  /* ========== Close Button ========== */
@@ -102,7 +102,7 @@
102
102
  border: none;
103
103
  border-radius: 50%;
104
104
  background: transparent;
105
- color: var(--bubble-text);
105
+ color: var(--vd-bubble-text);
106
106
  font-size: 1.125rem;
107
107
  line-height: 1;
108
108
  cursor: pointer;
@@ -120,7 +120,7 @@
120
120
  position: absolute;
121
121
  width: 0;
122
122
  height: 0;
123
- border: var(--bubble-arrow-size) solid transparent;
123
+ border: var(--vd-bubble-arrow-size) solid transparent;
124
124
  }
125
125
 
126
126
  /* Arrow: top placement (popover below trigger) */
@@ -128,38 +128,38 @@
128
128
  bottom: 100%;
129
129
  left: 50%;
130
130
  transform: translateX(-50%);
131
- border-bottom-color: var(--bubble-border-color);
131
+ border-bottom-color: var(--vd-bubble-border-color);
132
132
  }
133
133
 
134
134
  .vd-bubble-content[data-placement="top"]::before {
135
135
  top: 100%;
136
136
  left: 50%;
137
137
  transform: translateX(-50%);
138
- border-top-color: var(--bubble-border-color);
138
+ border-top-color: var(--vd-bubble-border-color);
139
139
  }
140
140
 
141
141
  .vd-bubble-content[data-placement="left"]::before {
142
142
  left: 100%;
143
143
  top: 50%;
144
144
  transform: translateY(-50%);
145
- border-left-color: var(--bubble-border-color);
145
+ border-left-color: var(--vd-bubble-border-color);
146
146
  }
147
147
 
148
148
  .vd-bubble-content[data-placement="right"]::before {
149
149
  right: 100%;
150
150
  top: 50%;
151
151
  transform: translateY(-50%);
152
- border-right-color: var(--bubble-border-color);
152
+ border-right-color: var(--vd-bubble-border-color);
153
153
  }
154
154
 
155
155
  /* ========== Size Variants ========== */
156
156
 
157
157
  .vd-bubble-sm .vd-bubble-body {
158
- --bubble-padding: 0.5rem; /* 8px - fib */
159
- --bubble-font-size: var(--font-size-xs, 0.75rem);
158
+ --vd-bubble-padding: 0.5rem; /* 8px - fib */
159
+ --vd-bubble-font-size: var(--vd-font-size-xs, 0.75rem);
160
160
  }
161
161
 
162
162
  .vd-bubble-lg .vd-bubble-body {
163
- --bubble-padding: 1.3125rem; /* 21px - fib */
164
- --bubble-max-width: 34rem;
163
+ --vd-bubble-padding: 1.3125rem; /* 21px - fib */
164
+ --vd-bubble-max-width: 34rem;
165
165
  }
package/css/components/button-group.css CHANGED
@@ -62,12 +62,12 @@
62
62
 
63
63
  /* Sizing - inherit from button sizes */
64
64
  .vd-btn-group-sm>.vd-btn {
65
- font-size: var(--font-size-sm);
65
+ font-size: var(--vd-font-size-sm);
66
66
  padding: 0.3125rem 0.625rem;
67
67
  }
68
68
 
69
69
  .vd-btn-group-lg>.vd-btn {
70
- font-size: var(--font-size-lg);
70
+ font-size: var(--vd-font-size-lg);
71
71
  padding: 0.625rem 1.25rem;
72
72
  }
73
73