@vaneui/ui 0.1.3 → 0.1.5
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/dist/components/ui/classes/appearanceClasses.d.ts +8 -8
- package/dist/components/ui/classes/typographyClasses.d.ts +1 -1
- package/dist/components/ui/props/keys.d.ts +6 -6
- package/dist/components/ui/theme/appearance/bgAppearanceTheme.d.ts +8 -0
- package/dist/components/ui/theme/appearance/genericVariantTheme.d.ts +14 -0
- package/dist/components/ui/theme/appearance/textAppearanceTheme.d.ts +3 -4
- package/dist/components/ui/theme/badgeTheme.d.ts +6 -5
- package/dist/components/ui/theme/buttonTheme.d.ts +6 -5
- package/dist/components/ui/theme/cardTheme.d.ts +2 -2
- package/dist/components/ui/theme/chipTheme.d.ts +6 -5
- package/dist/components/ui/theme/containerTheme.d.ts +2 -2
- package/dist/components/ui/theme/sectionTheme.d.ts +7 -5
- package/dist/index.esm.js +122 -214
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +122 -214
- package/dist/index.js.map +1 -1
- package/dist/ui.css +0 -72
- package/package.json +1 -1
- package/dist/components/ui/theme/appearance/layoutAppearanceTheme.d.ts +0 -10
- package/dist/components/ui/theme/appearance/variantTheme.d.ts +0 -15
package/dist/ui.css
CHANGED
|
@@ -128,8 +128,6 @@
|
|
|
128
128
|
--background-color-danger: var(--color-red-50, #fef2f2);
|
|
129
129
|
--background-color-warning: var(--color-amber-50, #fffbeb);
|
|
130
130
|
--background-color-info: var(--color-cyan-50, #ecfeff);
|
|
131
|
-
--background-color-muted: var(--color-gray-50, #f9fafb);
|
|
132
|
-
--background-color-link: var(--color-blue-50, #eff6ff);
|
|
133
131
|
--background-color-hover-default: var(--color-gray-50, #f3f4f6);
|
|
134
132
|
--background-color-hover-primary: var(--color-blue-100, #dbeafe);
|
|
135
133
|
--background-color-hover-secondary: var(--color-gray-100, #f3f4f6);
|
|
@@ -139,8 +137,6 @@
|
|
|
139
137
|
--background-color-hover-danger: var(--color-red-100, #fee2e2);
|
|
140
138
|
--background-color-hover-warning: var(--color-amber-100, #fef3c7);
|
|
141
139
|
--background-color-hover-info: var(--color-cyan-100, #cffafe);
|
|
142
|
-
--background-color-hover-muted: var(--color-gray-100, #f3f4f6);
|
|
143
|
-
--background-color-hover-link: var(--color-blue-100, #dbeafe);
|
|
144
140
|
--background-color-active-default: var(--color-gray-100, #e5e7eb);
|
|
145
141
|
--background-color-active-primary: var(--color-blue-200, #bfdbfe);
|
|
146
142
|
--background-color-active-secondary: var(--color-gray-200, #e5e7eb);
|
|
@@ -150,8 +146,6 @@
|
|
|
150
146
|
--background-color-active-danger: var(--color-red-200, #fecaca);
|
|
151
147
|
--background-color-active-warning: var(--color-amber-200, #fde68a);
|
|
152
148
|
--background-color-active-info: var(--color-cyan-200, #a5f3fc);
|
|
153
|
-
--background-color-active-muted: var(--color-gray-200, #e5e7eb);
|
|
154
|
-
--background-color-active-link: var(--color-blue-200, #bfdbfe);
|
|
155
149
|
--filled-background-color-default: var(--color-gray-800, #1f2937);
|
|
156
150
|
--filled-background-color-primary: var(--color-blue-600, #2563eb);
|
|
157
151
|
--filled-background-color-secondary: var(--color-gray-600, #4b5563);
|
|
@@ -161,8 +155,6 @@
|
|
|
161
155
|
--filled-background-color-danger: var(--color-red-600, #dc2626);
|
|
162
156
|
--filled-background-color-warning: var(--color-amber-600, #d97706);
|
|
163
157
|
--filled-background-color-info: var(--color-cyan-600, #0891b2);
|
|
164
|
-
--filled-background-color-muted: var(--color-gray-500, #6b7280);
|
|
165
|
-
--filled-background-color-link: var(--color-blue-600, #2563eb);
|
|
166
158
|
--filled-background-color-hover-default: var(--color-gray-900, #111827);
|
|
167
159
|
--filled-background-color-hover-primary: var(--color-blue-700, #1d4ed8);
|
|
168
160
|
--filled-background-color-hover-secondary: var(--color-gray-700, #374151);
|
|
@@ -172,8 +164,6 @@
|
|
|
172
164
|
--filled-background-color-hover-danger: var(--color-red-700, #b91c1c);
|
|
173
165
|
--filled-background-color-hover-warning: var(--color-amber-700, #b45309);
|
|
174
166
|
--filled-background-color-hover-info: var(--color-cyan-700, #0e7490);
|
|
175
|
-
--filled-background-color-hover-muted: var(--color-gray-600, #4b5563);
|
|
176
|
-
--filled-background-color-hover-link: var(--color-blue-700, #1d4ed8);
|
|
177
167
|
--filled-background-color-active-default: var(--color-gray-950, #030712);
|
|
178
168
|
--filled-background-color-active-primary: var(--color-blue-800, #1e40af);
|
|
179
169
|
--filled-background-color-active-secondary: var(--color-gray-800, #1f2937);
|
|
@@ -183,8 +173,6 @@
|
|
|
183
173
|
--filled-background-color-active-danger: var(--color-red-800, #991b1b);
|
|
184
174
|
--filled-background-color-active-warning: var(--color-amber-800, #92400e);
|
|
185
175
|
--filled-background-color-active-info: var(--color-cyan-800, #155e75);
|
|
186
|
-
--filled-background-color-active-muted: var(--color-gray-700, #374151);
|
|
187
|
-
--filled-background-color-active-link: var(--color-blue-800, #1e40af);
|
|
188
176
|
--layout-background-default: var(--color-white, #ffffff);
|
|
189
177
|
--layout-background-primary: var(--color-white, #ffffff);
|
|
190
178
|
--layout-background-secondary: var(--color-gray-50, #f9fafb);
|
|
@@ -699,12 +687,6 @@
|
|
|
699
687
|
.bg-\(--background-color-info\) {
|
|
700
688
|
background-color: var(--background-color-info);
|
|
701
689
|
}
|
|
702
|
-
.bg-\(--background-color-link\) {
|
|
703
|
-
background-color: var(--background-color-link);
|
|
704
|
-
}
|
|
705
|
-
.bg-\(--background-color-muted\) {
|
|
706
|
-
background-color: var(--background-color-muted);
|
|
707
|
-
}
|
|
708
690
|
.bg-\(--background-color-primary\) {
|
|
709
691
|
background-color: var(--background-color-primary);
|
|
710
692
|
}
|
|
@@ -765,12 +747,6 @@
|
|
|
765
747
|
.bg-\(--filled-background-color-info\) {
|
|
766
748
|
background-color: var(--filled-background-color-info);
|
|
767
749
|
}
|
|
768
|
-
.bg-\(--filled-background-color-link\) {
|
|
769
|
-
background-color: var(--filled-background-color-link);
|
|
770
|
-
}
|
|
771
|
-
.bg-\(--filled-background-color-muted\) {
|
|
772
|
-
background-color: var(--filled-background-color-muted);
|
|
773
|
-
}
|
|
774
750
|
.bg-\(--filled-background-color-primary\) {
|
|
775
751
|
background-color: var(--filled-background-color-primary);
|
|
776
752
|
}
|
|
@@ -1245,20 +1221,6 @@
|
|
|
1245
1221
|
}
|
|
1246
1222
|
}
|
|
1247
1223
|
}
|
|
1248
|
-
.hover\:bg-\(--background-color-hover-link\) {
|
|
1249
|
-
&:hover {
|
|
1250
|
-
@media (hover: hover) {
|
|
1251
|
-
background-color: var(--background-color-hover-link);
|
|
1252
|
-
}
|
|
1253
|
-
}
|
|
1254
|
-
}
|
|
1255
|
-
.hover\:bg-\(--background-color-hover-muted\) {
|
|
1256
|
-
&:hover {
|
|
1257
|
-
@media (hover: hover) {
|
|
1258
|
-
background-color: var(--background-color-hover-muted);
|
|
1259
|
-
}
|
|
1260
|
-
}
|
|
1261
|
-
}
|
|
1262
1224
|
.hover\:bg-\(--background-color-hover-primary\) {
|
|
1263
1225
|
&:hover {
|
|
1264
1226
|
@media (hover: hover) {
|
|
@@ -1322,20 +1284,6 @@
|
|
|
1322
1284
|
}
|
|
1323
1285
|
}
|
|
1324
1286
|
}
|
|
1325
|
-
.hover\:bg-\(--filled-background-color-hover-link\) {
|
|
1326
|
-
&:hover {
|
|
1327
|
-
@media (hover: hover) {
|
|
1328
|
-
background-color: var(--filled-background-color-hover-link);
|
|
1329
|
-
}
|
|
1330
|
-
}
|
|
1331
|
-
}
|
|
1332
|
-
.hover\:bg-\(--filled-background-color-hover-muted\) {
|
|
1333
|
-
&:hover {
|
|
1334
|
-
@media (hover: hover) {
|
|
1335
|
-
background-color: var(--filled-background-color-hover-muted);
|
|
1336
|
-
}
|
|
1337
|
-
}
|
|
1338
|
-
}
|
|
1339
1287
|
.hover\:bg-\(--filled-background-color-hover-primary\) {
|
|
1340
1288
|
&:hover {
|
|
1341
1289
|
@media (hover: hover) {
|
|
@@ -1488,16 +1436,6 @@
|
|
|
1488
1436
|
background-color: var(--background-color-active-info);
|
|
1489
1437
|
}
|
|
1490
1438
|
}
|
|
1491
|
-
.active\:bg-\(--background-color-active-link\) {
|
|
1492
|
-
&:active {
|
|
1493
|
-
background-color: var(--background-color-active-link);
|
|
1494
|
-
}
|
|
1495
|
-
}
|
|
1496
|
-
.active\:bg-\(--background-color-active-muted\) {
|
|
1497
|
-
&:active {
|
|
1498
|
-
background-color: var(--background-color-active-muted);
|
|
1499
|
-
}
|
|
1500
|
-
}
|
|
1501
1439
|
.active\:bg-\(--background-color-active-primary\) {
|
|
1502
1440
|
&:active {
|
|
1503
1441
|
background-color: var(--background-color-active-primary);
|
|
@@ -1543,16 +1481,6 @@
|
|
|
1543
1481
|
background-color: var(--filled-background-color-active-info);
|
|
1544
1482
|
}
|
|
1545
1483
|
}
|
|
1546
|
-
.active\:bg-\(--filled-background-color-active-link\) {
|
|
1547
|
-
&:active {
|
|
1548
|
-
background-color: var(--filled-background-color-active-link);
|
|
1549
|
-
}
|
|
1550
|
-
}
|
|
1551
|
-
.active\:bg-\(--filled-background-color-active-muted\) {
|
|
1552
|
-
&:active {
|
|
1553
|
-
background-color: var(--filled-background-color-active-muted);
|
|
1554
|
-
}
|
|
1555
|
-
}
|
|
1556
1484
|
.active\:bg-\(--filled-background-color-active-primary\) {
|
|
1557
1485
|
&:active {
|
|
1558
1486
|
background-color: var(--filled-background-color-active-primary);
|
package/package.json
CHANGED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { BaseTheme } from "../common/baseTheme";
|
|
2
|
-
import { AppearanceKey, ModeKey } from "../../props/keys";
|
|
3
|
-
export interface LayoutAppearanceTheme extends Record<AppearanceKey, Record<ModeKey, string>> {
|
|
4
|
-
}
|
|
5
|
-
export declare class LayoutAppearanceTheme extends BaseTheme {
|
|
6
|
-
static readonly defaultFullConfig: Record<AppearanceKey, Record<ModeKey, string>>;
|
|
7
|
-
constructor(initialOverrides?: Partial<Record<AppearanceKey, Partial<Record<ModeKey, string>>>>);
|
|
8
|
-
getClasses(props: Record<string, boolean>, defaults: Record<string, boolean>): string[];
|
|
9
|
-
static createDefaultStyle(src?: Partial<Record<ModeKey, Partial<Record<AppearanceKey, string>>>>): LayoutAppearanceTheme;
|
|
10
|
-
}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { BaseTheme } from "../common/baseTheme";
|
|
2
|
-
import { VariantKey } from "../../props/keys";
|
|
3
|
-
import { TextAppearanceTheme } from "./textAppearanceTheme";
|
|
4
|
-
export interface VariantTheme extends Record<VariantKey, TextAppearanceTheme> {
|
|
5
|
-
}
|
|
6
|
-
export declare class VariantTheme extends BaseTheme {
|
|
7
|
-
static readonly defaultInstances: Record<VariantKey, TextAppearanceTheme>;
|
|
8
|
-
constructor(variantInstances?: Record<VariantKey, TextAppearanceTheme>);
|
|
9
|
-
getClasses(props: Record<string, boolean>, defaults: Record<string, boolean>): string[];
|
|
10
|
-
static createDefault(initialInstances?: Partial<Record<VariantKey, TextAppearanceTheme>>): VariantTheme;
|
|
11
|
-
static createDefaultBackground(): VariantTheme;
|
|
12
|
-
static createDefaultText(): VariantTheme;
|
|
13
|
-
static createDefaultBorder(): VariantTheme;
|
|
14
|
-
static createDefaultRing(): VariantTheme;
|
|
15
|
-
}
|