@g1cloud/open-bluesea-core 1.0.0-alpha.7 → 1.0.0-alpha.9

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.
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Vue UI Library for Management Console.",
4
4
  "license": "Proprietary",
5
5
  "private": false,
6
- "version": "1.0.0-alpha.7",
6
+ "version": "1.0.0-alpha.9",
7
7
  "type": "module",
8
8
  "engines": {
9
9
  "node": ">= 24.3.0"
@@ -18,12 +18,14 @@
18
18
  "import": "./dist/open-bluesea-core.es.js",
19
19
  "require": "./dist/open-bluesea-core.umd.js"
20
20
  },
21
+ "./tailwind.preset": "./tailwind.preset.js",
21
22
  "./css/*": "./css/*",
22
23
  "./dist/*": "./dist/*"
23
24
  },
24
25
  "files": [
25
26
  "dist",
26
27
  "css",
28
+ "tailwind.preset.js",
27
29
  "!dist/tests"
28
30
  ],
29
31
  "devDependencies": {
@@ -38,6 +40,7 @@
38
40
  "vue-tsc": "^3.1.3"
39
41
  },
40
42
  "dependencies": {
43
+ "@material-icons/svg": "^1.0.33",
41
44
  "dayjs": "^1.11.19",
42
45
  "tslib": "^2.8.1",
43
46
  "vue": "^3.5.22"
@@ -0,0 +1,221 @@
1
+ /**
2
+ * Bluesea Core Tailwind CSS Preset
3
+ *
4
+ * This preset exposes Bluesea CSS variables as Tailwind theme values.
5
+ * Users can override these values either:
6
+ * 1. Via CSS variables in their stylesheets
7
+ * 2. Via Tailwind theme configuration
8
+ *
9
+ * @example
10
+ * // tailwind.config.js
11
+ * import blueseaPreset from '@g1cloud/open-bluesea-core/tailwind.preset'
12
+ *
13
+ * export default {
14
+ * presets: [blueseaPreset],
15
+ * theme: {
16
+ * extend: {
17
+ * // Override specific values
18
+ * colors: {
19
+ * 'bs-button-bg': '#FF5722',
20
+ * }
21
+ * }
22
+ * }
23
+ * }
24
+ */
25
+
26
+ /** @type {import('tailwindcss').Config} */
27
+ export default {
28
+ theme: {
29
+ extend: {
30
+ colors: {
31
+ // Primary colors
32
+ 'bs-primary': 'var(--primary)',
33
+ 'bs-secondary': 'var(--secondary)',
34
+ 'bs-success': 'var(--success)',
35
+ 'bs-info': 'var(--info)',
36
+ 'bs-warning': 'var(--warning)',
37
+ 'bs-danger': 'var(--danger)',
38
+
39
+ // Button colors
40
+ 'bs-button-bg': 'var(--bs-button-bg)',
41
+ 'bs-button-text': 'var(--bs-button-text)',
42
+ 'bs-button-border': 'var(--bs-button-border)',
43
+ 'bs-button-blue-bg': 'var(--bs-button-blue-bg)',
44
+ 'bs-button-blue-text': 'var(--bs-button-blue-text)',
45
+ 'bs-button-red-bg': 'var(--bs-button-red-bg)',
46
+ 'bs-button-red-text': 'var(--bs-button-red-text)',
47
+ 'bs-button-orange-bg': 'var(--bs-button-orange-bg)',
48
+ 'bs-button-orange-text': 'var(--bs-button-orange-text)',
49
+ 'bs-button-green-bg': 'var(--bs-button-green-bg)',
50
+ 'bs-button-green-text': 'var(--bs-button-green-text)',
51
+ 'bs-button-gray-bg': 'var(--bs-button-gray-bg)',
52
+ 'bs-button-gray-text': 'var(--bs-button-gray-text)',
53
+ 'bs-button-black-bg': 'var(--bs-button-black-bg)',
54
+ 'bs-button-black-text': 'var(--bs-button-black-text)',
55
+
56
+ // Input colors
57
+ 'bs-input-bg': 'var(--bs-input-bg)',
58
+ 'bs-input-text': 'var(--bs-input-text)',
59
+ 'bs-input-border': 'var(--bs-input-border)',
60
+ 'bs-input-border-hover': 'var(--bs-input-border-hover)',
61
+ 'bs-input-border-focus': 'var(--bs-input-border-focus)',
62
+ 'bs-input-placeholder': 'var(--bs-input-placeholder)',
63
+ 'bs-input-disabled-bg': 'var(--bs-input-disabled-bg)',
64
+ 'bs-input-disabled-text': 'var(--bs-input-disabled-text)',
65
+ 'bs-input-modified-border': 'var(--bs-input-modified-border)',
66
+ 'bs-input-error-border': 'var(--bs-input-error-border)',
67
+ 'bs-input-error-text': 'var(--bs-input-error-text)',
68
+ 'bs-input-affix-bg': 'var(--bs-input-affix-bg)',
69
+ 'bs-input-affix-text': 'var(--bs-input-affix-text)',
70
+
71
+ // Checkbox/Radio colors
72
+ 'bs-check-icon-color': 'var(--bs-check-icon-color)',
73
+ 'bs-check-icon-hover': 'var(--bs-check-icon-hover)',
74
+ 'bs-check-icon-focus': 'var(--bs-check-icon-focus)',
75
+ 'bs-check-icon-disabled': 'var(--bs-check-icon-disabled)',
76
+ 'bs-check-icon-modified': 'var(--bs-check-icon-modified)',
77
+ 'bs-check-icon-error': 'var(--bs-check-icon-error)',
78
+
79
+ // Select colors
80
+ 'bs-select-bg': 'var(--bs-select-bg)',
81
+ 'bs-select-text': 'var(--bs-select-text)',
82
+ 'bs-select-border': 'var(--bs-select-border)',
83
+ 'bs-select-border-hover': 'var(--bs-select-border-hover)',
84
+ 'bs-select-border-focus': 'var(--bs-select-border-focus)',
85
+ 'bs-select-placeholder': 'var(--bs-select-placeholder)',
86
+ 'bs-select-disabled-bg': 'var(--bs-select-disabled-bg)',
87
+ 'bs-select-disabled-text': 'var(--bs-select-disabled-text)',
88
+ 'bs-select-modified-border': 'var(--bs-select-modified-border)',
89
+ 'bs-select-error-border': 'var(--bs-select-error-border)',
90
+
91
+ // Radio Button Group colors
92
+ 'bs-radio-switch-bg': 'var(--bs-radio-switch-bg)',
93
+ 'bs-radio-switch-active-bg': 'var(--bs-radio-switch-active-bg)',
94
+ 'bs-radio-switch-active-text': 'var(--bs-radio-switch-active-text)',
95
+ 'bs-radio-switch-inactive-text': 'var(--bs-radio-switch-inactive-text)',
96
+ 'bs-radio-button-bg': 'var(--bs-radio-button-bg)',
97
+ 'bs-radio-button-text': 'var(--bs-radio-button-text)',
98
+ 'bs-radio-button-border': 'var(--bs-radio-button-border)',
99
+ 'bs-radio-button-active-bg': 'var(--bs-radio-button-active-bg)',
100
+ 'bs-radio-button-active-text': 'var(--bs-radio-button-active-text)',
101
+ 'bs-radio-button-active-border': 'var(--bs-radio-button-active-border)',
102
+
103
+ // Date Input colors
104
+ 'bs-date-input-bg': 'var(--bs-date-input-bg)',
105
+ 'bs-date-input-text': 'var(--bs-date-input-text)',
106
+ 'bs-date-input-border': 'var(--bs-date-input-border)',
107
+ 'bs-date-input-border-hover': 'var(--bs-date-input-border-hover)',
108
+ 'bs-date-input-border-focus': 'var(--bs-date-input-border-focus)',
109
+
110
+ // Popup/Tooltip colors
111
+ 'bs-popup-bg': 'var(--bs-popup-bg)',
112
+ 'bs-popup-border': 'var(--bs-popup-border)',
113
+ 'bs-tooltip-bg': 'var(--bs-tooltip-bg)',
114
+ 'bs-tooltip-text': 'var(--bs-tooltip-text)',
115
+
116
+ // Page Navigation colors
117
+ 'bs-page-nav-button-bg': 'var(--bs-page-nav-button-bg)',
118
+ 'bs-page-nav-button-text': 'var(--bs-page-nav-button-text)',
119
+ 'bs-page-nav-button-hover-bg': 'var(--bs-page-nav-button-hover-bg)',
120
+ 'bs-page-nav-button-active-bg': 'var(--bs-page-nav-button-active-bg)',
121
+ 'bs-page-nav-button-active-text': 'var(--bs-page-nav-button-active-text)',
122
+
123
+ // Card Layout colors
124
+ 'bs-card-bg': 'var(--bs-card-bg)',
125
+ 'bs-card-border': 'var(--bs-card-border)',
126
+ 'bs-card-header-bg': 'var(--bs-card-header-bg)',
127
+ 'bs-card-header-text': 'var(--bs-card-header-text)',
128
+
129
+ // Loading
130
+ 'bs-loading-color': 'var(--bs-loading-color)',
131
+
132
+ // Notification colors
133
+ 'bs-notification-bg': 'var(--bs-notification-bg)',
134
+ 'bs-notification-text': 'var(--bs-notification-text)',
135
+ 'bs-notification-success-accent': 'var(--bs-notification-success-accent)',
136
+ 'bs-notification-error-accent': 'var(--bs-notification-error-accent)',
137
+ 'bs-notification-warning-accent': 'var(--bs-notification-warning-accent)',
138
+ 'bs-notification-info-accent': 'var(--bs-notification-info-accent)',
139
+
140
+ // Modal colors
141
+ 'bs-modal-bg': 'var(--bs-modal-bg)',
142
+ 'bs-modal-text': 'var(--bs-modal-text)',
143
+ 'bs-modal-header-bg': 'var(--bs-modal-header-bg)',
144
+ 'bs-modal-header-text': 'var(--bs-modal-header-text)',
145
+ 'bs-modal-overlay-bg': 'var(--bs-modal-overlay-bg)',
146
+
147
+ // Context Menu colors
148
+ 'bs-context-menu-bg': 'var(--bs-context-menu-bg)',
149
+ 'bs-context-menu-text': 'var(--bs-context-menu-text)',
150
+ 'bs-context-menu-border': 'var(--bs-context-menu-border)',
151
+ 'bs-context-menu-item-hover-bg': 'var(--bs-context-menu-item-hover-bg)',
152
+ 'bs-context-menu-separator': 'var(--bs-context-menu-separator)',
153
+ },
154
+
155
+ height: {
156
+ 'bs-input': 'var(--bs-input-height)',
157
+ 'bs-button': 'var(--bs-button-height)',
158
+ 'bs-select': 'var(--bs-select-height)',
159
+ 'bs-date-input': 'var(--bs-date-input-height)',
160
+ 'bs-page-nav-button': 'var(--bs-page-nav-button-size)',
161
+ },
162
+
163
+ width: {
164
+ 'bs-date-input': 'var(--bs-date-input-width)',
165
+ 'bs-page-nav-button': 'var(--bs-page-nav-button-size)',
166
+ 'bs-loading': 'var(--bs-loading-size)',
167
+ },
168
+
169
+ borderRadius: {
170
+ 'bs': 'var(--bs-border-radius)',
171
+ 'bs-input': 'var(--bs-input-border-radius)',
172
+ 'bs-button': 'var(--bs-button-border-radius)',
173
+ 'bs-select': 'var(--bs-select-border-radius)',
174
+ 'bs-date-input': 'var(--bs-date-input-border-radius)',
175
+ 'bs-popup': 'var(--bs-popup-border-radius)',
176
+ 'bs-tooltip': 'var(--bs-tooltip-border-radius)',
177
+ 'bs-page-nav-button': 'var(--bs-page-nav-button-border-radius)',
178
+ 'bs-card': 'var(--bs-card-border-radius)',
179
+ 'bs-notification': 'var(--bs-notification-border-radius)',
180
+ 'bs-modal': 'var(--bs-modal-border-radius)',
181
+ 'bs-context-menu': 'var(--bs-context-menu-border-radius)',
182
+ },
183
+
184
+ padding: {
185
+ 'bs-input-x': 'var(--bs-input-padding-x)',
186
+ 'bs-button-x': 'var(--bs-button-padding-x)',
187
+ 'bs-button-y': 'var(--bs-button-padding-y)',
188
+ 'bs-select-x': 'var(--bs-select-padding-x)',
189
+ 'bs-check-label-x': 'var(--bs-check-label-padding-x)',
190
+ 'bs-check-label-y': 'var(--bs-check-label-padding-y)',
191
+ 'bs-tooltip-x': 'var(--bs-tooltip-padding-x)',
192
+ 'bs-tooltip-y': 'var(--bs-tooltip-padding-y)',
193
+ 'bs-card-header-x': 'var(--bs-card-header-padding-x)',
194
+ 'bs-card-header-y': 'var(--bs-card-header-padding-y)',
195
+ },
196
+
197
+ gap: {
198
+ 'bs-check-group-x': 'var(--bs-check-group-gap-x)',
199
+ 'bs-check-group-y': 'var(--bs-check-group-gap-y)',
200
+ },
201
+
202
+ fontSize: {
203
+ 'bs': 'var(--bs-font-size)',
204
+ 'bs-sm': 'var(--bs-font-size-sm)',
205
+ 'bs-button': 'var(--bs-button-font-size)',
206
+ 'bs-input-affix': 'var(--bs-input-affix-font-size)',
207
+ 'bs-check-icon': 'var(--bs-check-icon-size)',
208
+ 'bs-date-input-icon': 'var(--bs-date-input-icon-size)',
209
+ 'bs-tooltip': 'var(--bs-tooltip-font-size)',
210
+ 'bs-loading': 'var(--bs-loading-size)',
211
+ },
212
+
213
+ boxShadow: {
214
+ 'bs-popup': 'var(--bs-popup-shadow)',
215
+ 'bs-notification': 'var(--bs-notification-shadow)',
216
+ 'bs-modal': 'var(--bs-modal-shadow)',
217
+ 'bs-context-menu': 'var(--bs-context-menu-shadow)',
218
+ },
219
+ },
220
+ },
221
+ }