@hobui/viui-cli 0.0.6 → 0.0.7

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 (240) hide show
  1. package/README.md +138 -139
  2. package/dist/adapters/adapter-registry.d.ts +12 -0
  3. package/dist/adapters/adapter-registry.d.ts.map +1 -0
  4. package/dist/adapters/adapter-registry.js +49 -0
  5. package/dist/adapters/adapter-types.d.ts +20 -0
  6. package/dist/adapters/adapter-types.d.ts.map +1 -0
  7. package/dist/adapters/adapter-types.js +1 -0
  8. package/dist/adapters/aider-adapter.d.ts +3 -0
  9. package/dist/adapters/aider-adapter.d.ts.map +1 -0
  10. package/dist/adapters/aider-adapter.js +8 -0
  11. package/dist/adapters/claude-adapter.d.ts +3 -0
  12. package/dist/adapters/claude-adapter.d.ts.map +1 -0
  13. package/dist/adapters/claude-adapter.js +15 -0
  14. package/dist/adapters/cline-adapter.d.ts +3 -0
  15. package/dist/adapters/cline-adapter.d.ts.map +1 -0
  16. package/dist/adapters/cline-adapter.js +8 -0
  17. package/dist/adapters/copilot-adapter.d.ts +5 -0
  18. package/dist/adapters/copilot-adapter.d.ts.map +1 -0
  19. package/dist/adapters/copilot-adapter.js +20 -0
  20. package/dist/adapters/cursor-adapter.d.ts +3 -0
  21. package/dist/adapters/cursor-adapter.d.ts.map +1 -0
  22. package/dist/adapters/cursor-adapter.js +18 -0
  23. package/dist/adapters/external/bolt-adapter.d.ts +3 -0
  24. package/dist/adapters/external/bolt-adapter.d.ts.map +1 -0
  25. package/dist/adapters/external/bolt-adapter.js +15 -0
  26. package/dist/adapters/external/chatgpt-adapter.d.ts +3 -0
  27. package/dist/adapters/external/chatgpt-adapter.d.ts.map +1 -0
  28. package/dist/adapters/external/chatgpt-adapter.js +14 -0
  29. package/dist/adapters/external/external-adapter-base.d.ts +15 -0
  30. package/dist/adapters/external/external-adapter-base.d.ts.map +1 -0
  31. package/dist/adapters/external/external-adapter-base.js +92 -0
  32. package/dist/adapters/external/gemini-adapter.d.ts +3 -0
  33. package/dist/adapters/external/gemini-adapter.d.ts.map +1 -0
  34. package/dist/adapters/external/gemini-adapter.js +14 -0
  35. package/dist/adapters/external/lovable-adapter.d.ts +3 -0
  36. package/dist/adapters/external/lovable-adapter.d.ts.map +1 -0
  37. package/dist/adapters/external/lovable-adapter.js +14 -0
  38. package/dist/adapters/external/v0-adapter.d.ts +3 -0
  39. package/dist/adapters/external/v0-adapter.d.ts.map +1 -0
  40. package/dist/adapters/external/v0-adapter.js +15 -0
  41. package/dist/adapters/windsurf-adapter.d.ts +3 -0
  42. package/dist/adapters/windsurf-adapter.d.ts.map +1 -0
  43. package/dist/adapters/windsurf-adapter.js +23 -0
  44. package/dist/assets/plugins/viui-conf/apply-theme-body.ts +23 -4
  45. package/dist/assets/plugins/viui-conf/defaults/README.md +2 -0
  46. package/dist/assets/plugins/viui-conf/defaults/app-bar.ts +1 -1
  47. package/dist/assets/plugins/viui-conf/defaults/buttons.ts +1 -1
  48. package/dist/assets/plugins/viui-conf/defaults/by-theme/minimalist-2.ts +1 -1
  49. package/dist/assets/plugins/viui-conf/defaults/cards.ts +1 -1
  50. package/dist/assets/plugins/viui-conf/defaults/expansion-panels.ts +16 -0
  51. package/dist/assets/plugins/viui-conf/defaults/index.ts +3 -0
  52. package/dist/assets/plugins/viui-conf/defaults/inputs.ts +11 -1
  53. package/dist/assets/plugins/viui-conf/design-tokens.ts +135 -0
  54. package/dist/assets/plugins/viui-conf/theme-base.ts +1 -1
  55. package/dist/assets/plugins/viui-conf/v-dark.ts +3 -5
  56. package/dist/assets/plugins/viui-conf/v-light.ts +3 -5
  57. package/dist/assets/plugins/vuetify.ts +36 -0
  58. package/dist/assets/prompt-data/components.json +106 -0
  59. package/dist/assets/prompt-data/tokens.json +83 -0
  60. package/dist/assets/themes/_bento-grid.scss +8 -0
  61. package/dist/assets/themes/_glassmorphism.scss +8 -0
  62. package/dist/assets/themes/_material.scss +8 -0
  63. package/dist/assets/themes/_minimalist-2.scss +375 -0
  64. package/dist/assets/themes/_minimalist.scss +9 -0
  65. package/dist/assets/themes/_neo-brutalism.scss +199 -0
  66. package/dist/assets/themes/bento-grid.scss +4 -0
  67. package/dist/assets/themes/glassmorphism.scss +4 -0
  68. package/dist/assets/themes/index.scss +11 -0
  69. package/dist/assets/themes/material.scss +4 -0
  70. package/dist/assets/themes/minimalist-2.scss +5 -0
  71. package/dist/assets/themes/minimalist.scss +4 -0
  72. package/dist/assets/themes/neo-brutalism.scss +5 -0
  73. package/dist/assets/viui-themes/_neo-brutalism.scss +70 -152
  74. package/dist/cli-paths.d.ts +7 -0
  75. package/dist/cli-paths.d.ts.map +1 -0
  76. package/dist/cli-paths.js +19 -0
  77. package/dist/cli.js +28 -578
  78. package/dist/cli.legacy.d.ts +3 -0
  79. package/dist/cli.legacy.d.ts.map +1 -0
  80. package/dist/cli.legacy.js +597 -0
  81. package/dist/commands/audit.d.ts +3 -0
  82. package/dist/commands/audit.d.ts.map +1 -0
  83. package/dist/commands/audit.js +152 -0
  84. package/dist/commands/config/config-export.d.ts +6 -0
  85. package/dist/commands/config/config-export.d.ts.map +1 -0
  86. package/dist/commands/config/config-export.js +23 -0
  87. package/dist/commands/config/config-health.d.ts +6 -0
  88. package/dist/commands/config/config-health.d.ts.map +1 -0
  89. package/dist/commands/config/config-health.js +42 -0
  90. package/dist/commands/config/config-import.d.ts +6 -0
  91. package/dist/commands/config/config-import.d.ts.map +1 -0
  92. package/dist/commands/config/config-import.js +63 -0
  93. package/dist/commands/config/config-rollback.d.ts +6 -0
  94. package/dist/commands/config/config-rollback.d.ts.map +1 -0
  95. package/dist/commands/config/config-rollback.js +47 -0
  96. package/dist/commands/config/config-setup.d.ts +6 -0
  97. package/dist/commands/config/config-setup.d.ts.map +1 -0
  98. package/dist/commands/config/config-setup.js +103 -0
  99. package/dist/commands/config/config-status.d.ts +6 -0
  100. package/dist/commands/config/config-status.d.ts.map +1 -0
  101. package/dist/commands/config/config-status.js +42 -0
  102. package/dist/commands/config/config-uninstall.d.ts +6 -0
  103. package/dist/commands/config/config-uninstall.d.ts.map +1 -0
  104. package/dist/commands/config/config-uninstall.js +74 -0
  105. package/dist/commands/config.d.ts +6 -0
  106. package/dist/commands/config.d.ts.map +1 -0
  107. package/dist/commands/config.js +19 -0
  108. package/dist/commands/docs.d.ts +3 -0
  109. package/dist/commands/docs.d.ts.map +1 -0
  110. package/dist/commands/docs.js +17 -0
  111. package/dist/commands/doctor.d.ts +3 -0
  112. package/dist/commands/doctor.d.ts.map +1 -0
  113. package/dist/commands/doctor.js +93 -0
  114. package/dist/commands/init.d.ts +3 -0
  115. package/dist/commands/init.d.ts.map +1 -0
  116. package/dist/commands/init.js +183 -0
  117. package/dist/commands/sync.d.ts +3 -0
  118. package/dist/commands/sync.d.ts.map +1 -0
  119. package/dist/commands/sync.js +73 -0
  120. package/dist/commands/theme.d.ts +3 -0
  121. package/dist/commands/theme.d.ts.map +1 -0
  122. package/dist/commands/theme.js +86 -0
  123. package/dist/commands/update.d.ts +3 -0
  124. package/dist/commands/update.d.ts.map +1 -0
  125. package/dist/commands/update.js +97 -0
  126. package/dist/prompts/prompt-builder.d.ts +4 -0
  127. package/dist/prompts/prompt-builder.d.ts.map +1 -0
  128. package/dist/prompts/prompt-builder.js +18 -0
  129. package/dist/prompts/prompt-data-loader.d.ts +11 -0
  130. package/dist/prompts/prompt-data-loader.d.ts.map +1 -0
  131. package/dist/prompts/prompt-data-loader.js +15 -0
  132. package/dist/prompts/prompt-sections/section-code-examples.d.ts +2 -0
  133. package/dist/prompts/prompt-sections/section-code-examples.d.ts.map +1 -0
  134. package/dist/prompts/prompt-sections/section-code-examples.js +36 -0
  135. package/dist/prompts/prompt-sections/section-color-tokens.d.ts +2 -0
  136. package/dist/prompts/prompt-sections/section-color-tokens.d.ts.map +1 -0
  137. package/dist/prompts/prompt-sections/section-color-tokens.js +19 -0
  138. package/dist/prompts/prompt-sections/section-component-map.d.ts +3 -0
  139. package/dist/prompts/prompt-sections/section-component-map.d.ts.map +1 -0
  140. package/dist/prompts/prompt-sections/section-component-map.js +12 -0
  141. package/dist/prompts/prompt-sections/section-typography-spacing.d.ts +2 -0
  142. package/dist/prompts/prompt-sections/section-typography-spacing.d.ts.map +1 -0
  143. package/dist/prompts/prompt-sections/section-typography-spacing.js +29 -0
  144. package/dist/services/backup-service.d.ts +7 -0
  145. package/dist/services/backup-service.d.ts.map +1 -0
  146. package/dist/services/backup-service.js +54 -0
  147. package/dist/services/config-service.d.ts +17 -0
  148. package/dist/services/config-service.d.ts.map +1 -0
  149. package/dist/services/config-service.js +64 -0
  150. package/dist/services/diff-engine.d.ts +13 -0
  151. package/dist/services/diff-engine.d.ts.map +1 -0
  152. package/dist/services/diff-engine.js +59 -0
  153. package/dist/services/ide-detector.d.ts +9 -0
  154. package/dist/services/ide-detector.d.ts.map +1 -0
  155. package/dist/services/ide-detector.js +113 -0
  156. package/dist/services/ide-detector.spec.d.ts +2 -0
  157. package/dist/services/ide-detector.spec.d.ts.map +1 -0
  158. package/dist/services/ide-detector.spec.js +108 -0
  159. package/dist/services/lock-file-service.d.ts +15 -0
  160. package/dist/services/lock-file-service.d.ts.map +1 -0
  161. package/dist/services/lock-file-service.js +74 -0
  162. package/dist/services/mcp-config-reader.d.ts +11 -0
  163. package/dist/services/mcp-config-reader.d.ts.map +1 -0
  164. package/dist/services/mcp-config-reader.js +40 -0
  165. package/dist/services/mcp-config-reader.spec.d.ts +2 -0
  166. package/dist/services/mcp-config-reader.spec.d.ts.map +1 -0
  167. package/dist/services/mcp-config-reader.spec.js +125 -0
  168. package/dist/services/mcp-config-writer.d.ts +11 -0
  169. package/dist/services/mcp-config-writer.d.ts.map +1 -0
  170. package/dist/services/mcp-config-writer.js +98 -0
  171. package/dist/services/mcp-config-writer.spec.d.ts +2 -0
  172. package/dist/services/mcp-config-writer.spec.d.ts.map +1 -0
  173. package/dist/services/mcp-config-writer.spec.js +162 -0
  174. package/dist/services/merge-engine.d.ts +12 -0
  175. package/dist/services/merge-engine.d.ts.map +1 -0
  176. package/dist/services/merge-engine.js +54 -0
  177. package/dist/services/vuetify-scaffold-service.d.ts +5 -0
  178. package/dist/services/vuetify-scaffold-service.d.ts.map +1 -0
  179. package/dist/services/vuetify-scaffold-service.js +67 -0
  180. package/dist/templates/vuetify-plugin.d.ts +90 -0
  181. package/dist/templates/vuetify-plugin.d.ts.map +1 -0
  182. package/dist/templates/vuetify-plugin.js +33 -0
  183. package/dist/types/command-types.d.ts +15 -0
  184. package/dist/types/command-types.d.ts.map +1 -0
  185. package/dist/types/command-types.js +2 -0
  186. package/dist/types/config-types.d.ts +29 -0
  187. package/dist/types/config-types.d.ts.map +1 -0
  188. package/dist/types/config-types.js +10 -0
  189. package/dist/types/ide-types.d.ts +29 -0
  190. package/dist/types/ide-types.d.ts.map +1 -0
  191. package/dist/types/ide-types.js +4 -0
  192. package/dist/types/lock-file-types.d.ts +27 -0
  193. package/dist/types/lock-file-types.d.ts.map +1 -0
  194. package/dist/types/lock-file-types.js +2 -0
  195. package/dist/utils/diff-display.d.ts +18 -0
  196. package/dist/utils/diff-display.d.ts.map +1 -0
  197. package/dist/utils/diff-display.js +61 -0
  198. package/dist/utils/fs-safe.d.ts +9 -0
  199. package/dist/utils/fs-safe.d.ts.map +1 -0
  200. package/dist/utils/fs-safe.js +44 -0
  201. package/dist/utils/logger.d.ts +14 -0
  202. package/dist/utils/logger.d.ts.map +1 -0
  203. package/dist/utils/logger.js +28 -0
  204. package/dist/utils/open-browser.d.ts +3 -0
  205. package/dist/utils/open-browser.d.ts.map +1 -0
  206. package/dist/utils/open-browser.js +13 -0
  207. package/package.json +11 -6
  208. package/dist/assets/cursor/.design-system-version +0 -1
  209. package/dist/assets/cursor/commands/audit-accessibility.md +0 -25
  210. package/dist/assets/cursor/commands/audit-ui.md +0 -35
  211. package/dist/assets/cursor/commands/component.md +0 -18
  212. package/dist/assets/cursor/commands/fix-storybook.md +0 -24
  213. package/dist/assets/cursor/commands/generate-component-from-figma.md +0 -26
  214. package/dist/assets/cursor/commands/generate-page-from-figma.md +0 -26
  215. package/dist/assets/cursor/plans/DESIGN_SYSTEM_PLAN.md +0 -177
  216. package/dist/assets/cursor/plans/PLANS_INDEX.md +0 -35
  217. package/dist/assets/cursor/rules/accessibility-contrast.mdc +0 -38
  218. package/dist/assets/cursor/rules/bem-class-style.mdc +0 -107
  219. package/dist/assets/cursor/rules/component-naming.mdc +0 -57
  220. package/dist/assets/cursor/rules/design-system-component-library.mdc +0 -59
  221. package/dist/assets/cursor/rules/design-system-workflow.mdc +0 -48
  222. package/dist/assets/cursor/rules/figma-mapping.mdc +0 -37
  223. package/dist/assets/cursor/rules/icons.mdc +0 -42
  224. package/dist/assets/cursor/rules/project-structure.mdc +0 -137
  225. package/dist/assets/cursor/rules/storybook-component-template.mdc +0 -103
  226. package/dist/assets/cursor/rules/storybook.mdc +0 -68
  227. package/dist/assets/cursor/rules/tokens.mdc +0 -32
  228. package/dist/assets/cursor/rules/viui-themes.mdc +0 -53
  229. package/dist/assets/cursor/rules/vuetify-layout.mdc +0 -52
  230. package/dist/assets/cursor/skills/accessibility.md +0 -75
  231. package/dist/assets/cursor/skills/design-system-thinking.md +0 -40
  232. package/dist/assets/cursor/skills/figma-interpretation.md +0 -38
  233. package/dist/assets/cursor/skills/vue-vuetify-design-system-architect.md +0 -60
  234. package/dist/assets/cursor/sync-manifest.json +0 -6
  235. package/dist/assets/viui-themes/bento-grid-global.scss +0 -5
  236. package/dist/assets/viui-themes/glassmorphism-global.scss +0 -5
  237. package/dist/assets/viui-themes/material-global.scss +0 -5
  238. package/dist/assets/viui-themes/minimalist-2-global.scss +0 -5
  239. package/dist/assets/viui-themes/minimalist-global.scss +0 -5
  240. package/dist/assets/viui-themes/neo-brutalism-global.scss +0 -5
package/dist/assets/themes/_neo-brutalism.scss ADDED
@@ -0,0 +1,199 @@
1
+ /**
2
+ * Neo-Brutalism design style — một file duy nhất.
3
+ * Chỉ dùng selector dạng: .design-style-neo-brutalism .vi-* (vi-button, vi-card, vi-alert, vi-dialog, vi-toast, vi-input, vi-select, vi-checkbox, vi-data-table, vi-pagination, vi-list, vi-section__title) và .v-* cần thiết (v-btn, v-field, v-card-title, v-progress-linear, v-table, v-list-item, v-pagination__item, …).
4
+ * Consumer: thêm class design-style-neo-brutalism vào <body> (vd qua apply-theme-body). Entry: neo-brutalism.scss / neo-brutalism-global (alias).
5
+ * Spec: Figma Design Foundations. Thick borders, bold type, flat colors, offset shadow. Tokens; WCAG AA.
6
+ */
7
+ $neo-border-width: 3px;
8
+ $neo-shadow-offset: 4px 4px 0 0 var(--color-neutral-900, #1e1e1e);
9
+
10
+ /* Một selector cho cả app (body) và Storybook (wrapper) — consumer chỉ cần class trên body */
11
+ .design-style-neo-brutalism {
12
+ --neo-border-width: #{$neo-border-width};
13
+ --neo-radius: var(--radius-sm);
14
+ --neo-shadow-offset: #{$neo-shadow-offset};
15
+ --neo-font-weight: var(--font-weight-bold);
16
+
17
+ /* Button — .v-btn for specificity over Vuetify defaults */
18
+ .vi-button.v-btn {
19
+ border: var(--neo-border-width) solid var(--color-neutral-900) !important;
20
+ border-radius: var(--neo-radius) !important;
21
+ font-weight: var(--neo-font-weight) !important;
22
+ box-shadow: var(--neo-shadow-offset) !important;
23
+ transition: transform var(--duration-fast) var(--easing-default, ease);
24
+
25
+ &:hover:not(:disabled) {
26
+ transform: translate(1px, 1px);
27
+ box-shadow: 3px 3px 0 0 var(--color-neutral-900, #1e1e1e) !important;
28
+ }
29
+
30
+ &:active:not(:disabled) {
31
+ transform: translate(2px, 2px);
32
+ box-shadow: 2px 2px 0 0 var(--color-neutral-900, #1e1e1e) !important;
33
+ }
34
+ }
35
+
36
+ /* Card — !important để thắng selector Vuetify .v-dialog > .v-overlay__content > .v-card */
37
+ .vi-card {
38
+ border: var(--neo-border-width) solid var(--color-neutral-900) !important;
39
+ border-radius: var(--neo-radius) !important;
40
+ box-shadow: var(--neo-shadow-offset) !important;
41
+
42
+ .v-card-title {
43
+ font-weight: var(--neo-font-weight);
44
+ }
45
+ }
46
+
47
+ /* Section — Figma: uppercase, font-black */
48
+ .vi-section__title {
49
+ font-weight: var(--neo-font-weight);
50
+ text-transform: uppercase;
51
+ border-bottom: var(--neo-border-width) solid var(--color-border-default);
52
+ padding-bottom: var(--space-8pt-1);
53
+ }
54
+
55
+ /* Input / Field (Vuetify v-field inside vi-input) */
56
+ .vi-input,
57
+ .v-field {
58
+ border: var(--neo-border-width) solid var(--color-border-default) !important;
59
+ border-radius: var(--neo-radius) !important;
60
+ font-weight: var(--font-weight-medium);
61
+
62
+ &.v-field--focused {
63
+ border-color: var(--color-border-focus) !important;
64
+ box-shadow: 0 0 0 2px var(--color-state-focus);
65
+ }
66
+ }
67
+
68
+ /* Select */
69
+ .vi-select .v-field {
70
+ border: var(--neo-border-width) solid var(--color-border-default) !important;
71
+ border-radius: var(--neo-radius) !important;
72
+ }
73
+
74
+ /* Checkbox */
75
+ .vi-checkbox .v-selection-control .v-checkbox-btn {
76
+ border: var(--neo-border-width) solid var(--color-neutral-900);
77
+ border-radius: var(--radius-sm);
78
+ }
79
+
80
+ /* Alert */
81
+ .vi-alert {
82
+ border: var(--neo-border-width) solid currentColor;
83
+ border-radius: var(--neo-radius);
84
+ font-weight: var(--font-weight-medium);
85
+ }
86
+
87
+ /* Dialog — selector trùng cấu trúc .v-dialog > .v-overlay__content > .v-card để thắng specificity Vuetify */
88
+ .vi-dialog-card,
89
+ .v-dialog .v-overlay__content > .v-card.vi-dialog-card,
90
+ .v-dialog .v-overlay__content > form > .v-card.vi-dialog-card {
91
+ border: var(--neo-border-width) solid var(--color-neutral-900) !important;
92
+ border-radius: var(--neo-radius) !important;
93
+ box-shadow: 8px 8px 0 0 var(--color-neutral-900, #1e1e1e) !important;
94
+ background: var(--color-surface-card, var(--color-neutral-0));
95
+ }
96
+
97
+ .vi-dialog-title {
98
+ font-weight: var(--neo-font-weight);
99
+ text-transform: uppercase;
100
+ border-bottom: var(--neo-border-width) solid var(--color-neutral-900);
101
+ color: var(--color-text-primary);
102
+ }
103
+
104
+ .vi-dialog-content {
105
+ font-weight: var(--font-weight-medium);
106
+ color: var(--color-text-primary);
107
+ }
108
+
109
+ .vi-dialog-actions {
110
+ border-top: var(--neo-border-width) solid var(--color-neutral-900);
111
+ }
112
+
113
+ .vi-dialog .vi-button.v-btn {
114
+ border: var(--neo-border-width) solid var(--color-neutral-900) !important;
115
+ border-radius: var(--neo-radius) !important;
116
+ font-weight: var(--neo-font-weight) !important;
117
+ box-shadow: var(--neo-shadow-offset) !important;
118
+
119
+ &:hover:not(:disabled) {
120
+ box-shadow: 3px 3px 0 0 var(--color-neutral-900, #1e1e1e) !important;
121
+ }
122
+ &:active:not(:disabled) {
123
+ box-shadow: 2px 2px 0 0 var(--color-neutral-900, #1e1e1e) !important;
124
+ }
125
+ }
126
+
127
+ /* Toast (v-snackbar) */
128
+ .vi-toast.v-snackbar .v-snackbar__wrapper {
129
+ border: var(--neo-border-width) solid var(--color-neutral-900);
130
+ border-radius: var(--neo-radius);
131
+ box-shadow: 4px 4px 0 0 var(--color-neutral-900, #1e1e1e);
132
+ font-weight: var(--neo-font-weight);
133
+ }
134
+
135
+ /* Progress linear (Loading) — chỉ style khi visible, không ảnh hưởng card loader ẩn */
136
+ .v-progress-linear:not([style*="height: 0px"]) {
137
+ border: var(--neo-border-width) solid var(--color-neutral-900);
138
+ border-radius: var(--neo-radius);
139
+
140
+ .v-progress-linear__determinate {
141
+ border-radius: 2px;
142
+ }
143
+ }
144
+
145
+ /* DataTable */
146
+ .vi-data-table .v-table {
147
+ border: var(--neo-border-width) solid var(--color-border-default);
148
+
149
+ th,
150
+ td {
151
+ border: 1px solid var(--color-border-subtle);
152
+ font-weight: var(--font-weight-medium);
153
+ }
154
+
155
+ thead th {
156
+ font-weight: var(--neo-font-weight);
157
+ }
158
+ }
159
+
160
+ /* Pagination */
161
+ .vi-pagination .v-pagination__item,
162
+ .vi-pagination .v-pagination__prev,
163
+ .vi-pagination .v-pagination__next {
164
+ border: 2px solid var(--color-border-default);
165
+ border-radius: var(--neo-radius);
166
+ font-weight: var(--font-weight-medium);
167
+ }
168
+
169
+ /* List — thick border, hard shadow, bold typography */
170
+ .vi-list {
171
+ border: var(--neo-border-width) solid var(--color-neutral-900);
172
+ border-radius: var(--neo-radius);
173
+ box-shadow: var(--neo-shadow-offset);
174
+ background: var(--color-surface-card, var(--color-neutral-0));
175
+
176
+ .v-list-item {
177
+ font-weight: var(--font-weight-medium);
178
+ min-height: 48px;
179
+ padding: var(--space-8pt-2) var(--space-8pt-3);
180
+ border-bottom: 1px solid var(--color-border-subtle);
181
+
182
+ &:last-child {
183
+ border-bottom: none;
184
+ }
185
+ }
186
+
187
+ .v-list-item-title {
188
+ font-weight: var(--neo-font-weight);
189
+ text-transform: uppercase;
190
+ color: var(--color-text-primary);
191
+ }
192
+
193
+ .v-list-item-subtitle {
194
+ font-weight: var(--font-weight-medium);
195
+ opacity: 1;
196
+ color: var(--color-text-secondary);
197
+ }
198
+ }
199
+ }
package/dist/assets/themes/bento-grid.scss ADDED
@@ -0,0 +1,4 @@
1
+ /**
2
+ * @viui/themes — Bento Grid entry (scoped).
3
+ */
4
+ @use './_bento-grid' as *;
package/dist/assets/themes/glassmorphism.scss ADDED
@@ -0,0 +1,4 @@
1
+ /**
2
+ * @viui/themes — Glassmorphism entry (scoped).
3
+ */
4
+ @use './_glassmorphism' as *;
package/dist/assets/themes/index.scss ADDED
@@ -0,0 +1,11 @@
1
+ /**
2
+ * @viui/themes — Entry chung: load tất cả design style themes (scoped).
3
+ * Mỗi theme scope theo .components-overview-wrapper.design-style-<id> và body (teleport).
4
+ * Import một lần trong app/Storybook; thêm theme mới: thêm @use và file theo _THEME_CONVENTION.md.
5
+ */
6
+ @use './_neo-brutalism' as *;
7
+ @use './_bento-grid' as *;
8
+ @use './_glassmorphism' as *;
9
+ @use './_minimalist' as *;
10
+ @use './_minimalist-2' as *;
11
+ @use './_material' as *;
package/dist/assets/themes/material.scss ADDED
@@ -0,0 +1,4 @@
1
+ /**
2
+ * @viui/themes — Material entry (scoped).
3
+ */
4
+ @use './_material' as *;
package/dist/assets/themes/minimalist-2.scss ADDED
@@ -0,0 +1,5 @@
1
+ /**
2
+ * @viui/themes — Minimalist 2.0 entry.
3
+ * Scoped to .design-style-minimalist-2 and body.design-style-minimalist-2.
4
+ */
5
+ @use './_minimalist-2' as *;
package/dist/assets/themes/minimalist.scss ADDED
@@ -0,0 +1,4 @@
1
+ /**
2
+ * @viui/themes — Minimalist entry (scoped).
3
+ */
4
+ @use './_minimalist' as *;
package/dist/assets/themes/neo-brutalism.scss ADDED
@@ -0,0 +1,5 @@
1
+ /**
2
+ * @viui/themes — Neo-Brutalism entry.
3
+ * Scoped to .components-overview-wrapper.design-style-neo-brutalism.
4
+ */
5
+ @use './_neo-brutalism' as *;
package/dist/assets/viui-themes/_neo-brutalism.scss CHANGED
@@ -1,12 +1,14 @@
1
1
  /**
2
- * Neo-Brutalism design style — một file duy nhất: scoped (wrapper) + body (teleport + global).
3
- * Entry: neo-brutalism.scss hoặc neo-brutalism-global (alias). Không tạo _*-global.scss riêng.
4
- * Spec: Figma Design Foundations Page. Thick borders, bold type, flat colors, offset shadow. Tokens; WCAG AA.
2
+ * Neo-Brutalism design style — một file duy nhất.
3
+ * Chỉ dùng selector dạng: .design-style-neo-brutalism .vi-* (vi-button, vi-card, vi-alert, vi-dialog, vi-toast, vi-input, vi-select, vi-checkbox, vi-data-table, vi-pagination, vi-list, vi-section__title) và .v-* cần thiết (v-btn, v-field, v-card-title, v-progress-linear, v-table, v-list-item, v-pagination__item, …).
4
+ * Consumer: thêm class design-style-neo-brutalism vào <body> (vd qua apply-theme-body). Entry: neo-brutalism.scss / neo-brutalism-global (alias).
5
+ * Spec: Figma Design Foundations. Thick borders, bold type, flat colors, offset shadow. Tokens; WCAG AA.
5
6
  */
6
7
  $neo-border-width: 3px;
7
8
  $neo-shadow-offset: 4px 4px 0 0 var(--color-neutral-900, #1e1e1e);
8
9
 
9
- .components-overview-wrapper.design-style-neo-brutalism {
10
+ /* Một selector cho cả app (body) và Storybook (wrapper) — consumer chỉ cần class trên body */
11
+ .design-style-neo-brutalism {
10
12
  --neo-border-width: #{$neo-border-width};
11
13
  --neo-radius: var(--radius-sm);
12
14
  --neo-shadow-offset: #{$neo-shadow-offset};
@@ -31,11 +33,11 @@ $neo-shadow-offset: 4px 4px 0 0 var(--color-neutral-900, #1e1e1e);
31
33
  }
32
34
  }
33
35
 
34
- /* Card */
36
+ /* Card — !important để thắng selector Vuetify .v-dialog > .v-overlay__content > .v-card */
35
37
  .vi-card {
36
- border: var(--neo-border-width) solid var(--color-neutral-900);
37
- border-radius: var(--neo-radius);
38
- box-shadow: var(--neo-shadow-offset);
38
+ border: var(--neo-border-width) solid var(--color-neutral-900) !important;
39
+ border-radius: var(--neo-radius) !important;
40
+ box-shadow: var(--neo-shadow-offset) !important;
39
41
 
40
42
  .v-card-title {
41
43
  font-weight: var(--neo-font-weight);
@@ -50,11 +52,6 @@ $neo-shadow-offset: 4px 4px 0 0 var(--color-neutral-900, #1e1e1e);
50
52
  padding-bottom: var(--space-8pt-1);
51
53
  }
52
54
 
53
- /* Demo area background — Figma Design Foundations page bg */
54
- .themes-neo-brutalism__area {
55
- background: #fef3c7;
56
- }
57
-
58
55
  /* Input / Field (Vuetify v-field inside vi-input) */
59
56
  .vi-input,
60
57
  .v-field {
@@ -87,150 +84,37 @@ $neo-shadow-offset: 4px 4px 0 0 var(--color-neutral-900, #1e1e1e);
87
84
  font-weight: var(--font-weight-medium);
88
85
  }
89
86
 
90
- /* Dialog */
91
- .vi-dialog-card {
92
- border: var(--neo-border-width) solid var(--color-neutral-900);
93
- border-radius: var(--neo-radius);
94
- box-shadow: 8px 8px 0 0 var(--color-neutral-900, #1e1e1e);
95
- }
96
-
97
- /* Toast (v-snackbar) */
98
- .vi-toast.v-snackbar .v-snackbar__wrapper {
99
- border: var(--neo-border-width) solid var(--color-neutral-900);
100
- border-radius: var(--neo-radius);
101
- box-shadow: 4px 4px 0 0 var(--color-neutral-900, #1e1e1e);
102
- font-weight: var(--neo-font-weight);
103
- }
104
-
105
- /* Progress linear (Loading) */
106
- .themes-neo-brutalism__progress.v-progress-linear {
107
- border: var(--neo-border-width) solid var(--color-neutral-900);
108
- border-radius: var(--neo-radius);
109
-
110
- .v-progress-linear__determinate {
111
- border-radius: 2px;
112
- }
87
+ /* Dialog — selector trùng cấu trúc .v-dialog > .v-overlay__content > .v-card để thắng specificity Vuetify */
88
+ .vi-dialog-card,
89
+ .v-dialog .v-overlay__content > .v-card.vi-dialog-card,
90
+ .v-dialog .v-overlay__content > form > .v-card.vi-dialog-card {
91
+ border: var(--neo-border-width) solid var(--color-neutral-900) !important;
92
+ border-radius: var(--neo-radius) !important;
93
+ box-shadow: 8px 8px 0 0 var(--color-neutral-900, #1e1e1e) !important;
94
+ background: var(--color-surface-card, var(--color-neutral-0));
113
95
  }
114
96
 
115
97
  .vi-dialog-title {
116
98
  font-weight: var(--neo-font-weight);
117
- border-bottom-width: var(--neo-border-width);
118
- }
119
-
120
- .vi-dialog-actions {
121
- border-top-width: var(--neo-border-width);
122
- }
123
-
124
- /* DataTable */
125
- .vi-data-table .v-table {
126
- border: var(--neo-border-width) solid var(--color-border-default);
127
-
128
- th,
129
- td {
130
- border: 1px solid var(--color-border-subtle);
131
- font-weight: var(--font-weight-medium);
132
- }
133
-
134
- thead th {
135
- font-weight: var(--neo-font-weight);
136
- }
137
- }
138
-
139
- /* Pagination */
140
- .vi-pagination .v-pagination__item,
141
- .vi-pagination .v-pagination__prev,
142
- .vi-pagination .v-pagination__next {
143
- border: 2px solid var(--color-border-default);
144
- border-radius: var(--neo-radius);
145
- font-weight: var(--font-weight-medium);
146
- }
147
- }
148
-
149
- /* Body: teleported content (dialog, snackbar) + global use (consumer adds class to body) */
150
- body.design-style-neo-brutalism {
151
- .vi-button.v-btn {
152
- border: $neo-border-width solid var(--color-neutral-900) !important;
153
- border-radius: var(--radius-lg, var(--radius-sm, 16px)) !important;
154
- font-weight: var(--font-weight-bold) !important;
155
- box-shadow: $neo-shadow-offset !important;
156
- transition: transform var(--duration-fast) var(--easing-default, ease);
157
-
158
- &:hover:not(:disabled) {
159
- transform: translate(1px, 1px);
160
- box-shadow: 3px 3px 0 0 var(--color-neutral-900, #1e1e1e) !important;
161
- }
162
-
163
- &:active:not(:disabled) {
164
- transform: translate(2px, 2px);
165
- box-shadow: 2px 2px 0 0 var(--color-neutral-900, #1e1e1e) !important;
166
- }
167
- }
168
-
169
- .vi-card {
170
- border: $neo-border-width solid var(--color-neutral-900);
171
- border-radius: var(--radius-sm);
172
- box-shadow: $neo-shadow-offset;
173
-
174
- .v-card-title {
175
- font-weight: var(--font-weight-bold);
176
- }
177
- }
178
-
179
- .vi-section__title {
180
- font-weight: var(--font-weight-bold);
181
99
  text-transform: uppercase;
182
- border-bottom: $neo-border-width solid var(--color-border-default);
183
- padding-bottom: var(--space-8pt-1);
100
+ border-bottom: var(--neo-border-width) solid var(--color-neutral-900);
101
+ color: var(--color-text-primary);
184
102
  }
185
103
 
186
- .vi-input,
187
- .v-field {
188
- border: $neo-border-width solid var(--color-border-default) !important;
189
- border-radius: var(--radius-sm) !important;
104
+ .vi-dialog-content {
190
105
  font-weight: var(--font-weight-medium);
191
-
192
- &.v-field--focused {
193
- border-color: var(--color-border-focus) !important;
194
- box-shadow: 0 0 0 2px var(--color-state-focus);
195
- }
196
- }
197
-
198
- .vi-select .v-field {
199
- border: $neo-border-width solid var(--color-border-default) !important;
200
- border-radius: var(--radius-sm) !important;
201
- }
202
-
203
- .vi-checkbox .v-selection-control .v-checkbox-btn {
204
- border: $neo-border-width solid var(--color-neutral-900);
205
- border-radius: var(--radius-sm);
206
- }
207
-
208
- .vi-alert {
209
- border: $neo-border-width solid currentColor;
210
- border-radius: var(--radius-sm);
211
- font-weight: var(--font-weight-medium);
212
- }
213
-
214
- .vi-dialog-card {
215
- border: $neo-border-width solid var(--color-neutral-900);
216
- border-radius: var(--radius-sm);
217
- box-shadow: 8px 8px 0 0 var(--color-neutral-900, #1e1e1e);
218
- }
219
-
220
- .vi-dialog-title {
221
- font-weight: var(--font-weight-bold);
222
- border-bottom-width: $neo-border-width;
106
+ color: var(--color-text-primary);
223
107
  }
224
108
 
225
109
  .vi-dialog-actions {
226
- border-top-width: $neo-border-width;
110
+ border-top: var(--neo-border-width) solid var(--color-neutral-900);
227
111
  }
228
112
 
229
113
  .vi-dialog .vi-button.v-btn {
230
- border: $neo-border-width solid var(--color-neutral-900) !important;
231
- border-radius: var(--radius-sm) !important;
232
- font-weight: var(--font-weight-bold) !important;
233
- box-shadow: $neo-shadow-offset !important;
114
+ border: var(--neo-border-width) solid var(--color-neutral-900) !important;
115
+ border-radius: var(--neo-radius) !important;
116
+ font-weight: var(--neo-font-weight) !important;
117
+ box-shadow: var(--neo-shadow-offset) !important;
234
118
 
235
119
  &:hover:not(:disabled) {
236
120
  box-shadow: 3px 3px 0 0 var(--color-neutral-900, #1e1e1e) !important;
@@ -240,25 +124,27 @@ body.design-style-neo-brutalism {
240
124
  }
241
125
  }
242
126
 
127
+ /* Toast (v-snackbar) */
243
128
  .vi-toast.v-snackbar .v-snackbar__wrapper {
244
- border: $neo-border-width solid var(--color-neutral-900);
245
- border-radius: var(--radius-sm);
129
+ border: var(--neo-border-width) solid var(--color-neutral-900);
130
+ border-radius: var(--neo-radius);
246
131
  box-shadow: 4px 4px 0 0 var(--color-neutral-900, #1e1e1e);
247
- font-weight: var(--font-weight-bold);
132
+ font-weight: var(--neo-font-weight);
248
133
  }
249
134
 
250
- .themes-neo-brutalism__progress.v-progress-linear,
135
+ /* Progress linear (Loading) */
251
136
  .v-progress-linear {
252
- border: $neo-border-width solid var(--color-neutral-900);
253
- border-radius: var(--radius-sm);
137
+ border: var(--neo-border-width) solid var(--color-neutral-900);
138
+ border-radius: var(--neo-radius);
254
139
 
255
140
  .v-progress-linear__determinate {
256
141
  border-radius: 2px;
257
142
  }
258
143
  }
259
144
 
145
+ /* DataTable */
260
146
  .vi-data-table .v-table {
261
- border: $neo-border-width solid var(--color-border-default);
147
+ border: var(--neo-border-width) solid var(--color-border-default);
262
148
 
263
149
  th,
264
150
  td {
@@ -267,15 +153,47 @@ body.design-style-neo-brutalism {
267
153
  }
268
154
 
269
155
  thead th {
270
- font-weight: var(--font-weight-bold);
156
+ font-weight: var(--neo-font-weight);
271
157
  }
272
158
  }
273
159
 
160
+ /* Pagination */
274
161
  .vi-pagination .v-pagination__item,
275
162
  .vi-pagination .v-pagination__prev,
276
163
  .vi-pagination .v-pagination__next {
277
164
  border: 2px solid var(--color-border-default);
278
- border-radius: var(--radius-sm);
165
+ border-radius: var(--neo-radius);
279
166
  font-weight: var(--font-weight-medium);
280
167
  }
168
+
169
+ /* List — thick border, hard shadow, bold typography */
170
+ .vi-list {
171
+ border: var(--neo-border-width) solid var(--color-neutral-900);
172
+ border-radius: var(--neo-radius);
173
+ box-shadow: var(--neo-shadow-offset);
174
+ background: var(--color-surface-card, var(--color-neutral-0));
175
+
176
+ .v-list-item {
177
+ font-weight: var(--font-weight-medium);
178
+ min-height: 48px;
179
+ padding: var(--space-8pt-2) var(--space-8pt-3);
180
+ border-bottom: 1px solid var(--color-border-subtle);
181
+
182
+ &:last-child {
183
+ border-bottom: none;
184
+ }
185
+ }
186
+
187
+ .v-list-item-title {
188
+ font-weight: var(--neo-font-weight);
189
+ text-transform: uppercase;
190
+ color: var(--color-text-primary);
191
+ }
192
+
193
+ .v-list-item-subtitle {
194
+ font-weight: var(--font-weight-medium);
195
+ opacity: 1;
196
+ color: var(--color-text-secondary);
197
+ }
198
+ }
281
199
  }
package/dist/cli-paths.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ /** Get CLI version from package.json */
2
+ export declare function getCliVersion(): string;
3
+ /** Get bundled assets directory (dist/assets/) */
4
+ export declare function getAssetsDir(): string;
5
+ /** Get CLI package name */
6
+ export declare function getCliName(): string;
7
+ //# sourceMappingURL=cli-paths.d.ts.map
package/dist/cli-paths.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"cli-paths.d.ts","sourceRoot":"","sources":["../src/cli-paths.ts"],"names":[],"mappings":"AAQA,wCAAwC;AACxC,wBAAgB,aAAa,IAAI,MAAM,CAGtC;AAED,kDAAkD;AAClD,wBAAgB,YAAY,IAAI,MAAM,CAErC;AAED,2BAA2B;AAC3B,wBAAgB,UAAU,IAAI,MAAM,CAGnC"}
package/dist/cli-paths.js ADDED
@@ -0,0 +1,19 @@
1
+ import path from 'node:path';
2
+ import { fileURLToPath } from 'node:url';
3
+ import { createRequire } from 'node:module';
4
+ const __dirname = path.dirname(fileURLToPath(import.meta.url));
5
+ const require = createRequire(import.meta.url);
6
+ /** Get CLI version from package.json */
7
+ export function getCliVersion() {
8
+ const pkg = require(path.join(__dirname, '..', 'package.json'));
9
+ return pkg.version;
10
+ }
11
+ /** Get bundled assets directory (dist/assets/) */
12
+ export function getAssetsDir() {
13
+ return path.join(__dirname, 'assets');
14
+ }
15
+ /** Get CLI package name */
16
+ export function getCliName() {
17
+ const pkg = require(path.join(__dirname, '..', 'package.json'));
18
+ return pkg.name ?? '@hobui/viui-cli';
19
+ }