@bgord/design 2.0.9 → 2.1.0
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/index.d.ts +54 -28
- package/dist/lib.d.ts +2 -26
- package/dist/lib.js +2 -26
- package/dist/main.min.css +1 -1
- package/dist/main.min.css.br +0 -0
- package/dist/main.min.css.gz +0 -0
- package/package.json +2 -2
- package/readme.md +0 -2
package/dist/index.d.ts
CHANGED
|
@@ -5,16 +5,16 @@ export {};
|
|
|
5
5
|
import "react";
|
|
6
6
|
declare module "react" {
|
|
7
7
|
interface HTMLAttributes<T> {
|
|
8
|
-
"data-disp"?: "flex" | "block" | "inline-block" | "none";
|
|
9
|
-
"data-md-disp"?: "flex" | "block" | "inline-block" | "none";
|
|
10
8
|
"data-stack"?: "x" | "y";
|
|
11
9
|
"data-md-stack"?: "x" | "y";
|
|
10
|
+
"data-disp"?: "flex" | "block" | "inline-block" | "none";
|
|
11
|
+
"data-md-disp"?: "flex" | "block" | "inline-block" | "none";
|
|
12
12
|
"data-dir"?: "row" | "row-reverse" | "column" | "column-reverse";
|
|
13
13
|
"data-md-dir"?: "row" | "row-reverse" | "column" | "column-reverse";
|
|
14
14
|
"data-wrap"?: "nowrap" | "wrap" | "wrap-reverse" | "unset";
|
|
15
15
|
"data-md-wrap"?: "nowrap" | "wrap" | "wrap-reverse" | "unset";
|
|
16
16
|
"data-main"?: "start" | "end" | "around" | "evenly" | "between" | "center";
|
|
17
|
-
"data-cross"?: "start" | "end" | "center" | "baseline";
|
|
17
|
+
"data-cross"?: "start" | "end" | "center" | "baseline" | "stretch";
|
|
18
18
|
"data-md-main"?:
|
|
19
19
|
| "start"
|
|
20
20
|
| "end"
|
|
@@ -22,7 +22,7 @@ declare module "react" {
|
|
|
22
22
|
| "evenly"
|
|
23
23
|
| "between"
|
|
24
24
|
| "center";
|
|
25
|
-
"data-md-cross"?: "start" | "end" | "center" | "baseline";
|
|
25
|
+
"data-md-cross"?: "start" | "end" | "center" | "baseline" | "stretch";
|
|
26
26
|
"data-self"?: "auto" | "start" | "end" | "center" | "stretch" | "baseline";
|
|
27
27
|
"data-md-self"?:
|
|
28
28
|
| "auto"
|
|
@@ -1042,7 +1042,8 @@ declare module "react" {
|
|
|
1042
1042
|
| "warning-900"
|
|
1043
1043
|
| "alpha-subtle"
|
|
1044
1044
|
| "alpha-soft"
|
|
1045
|
-
| "alpha-medium"
|
|
1045
|
+
| "alpha-medium"
|
|
1046
|
+
| "alpha-strong";
|
|
1046
1047
|
"data-hover-bg"?:
|
|
1047
1048
|
| "neutral-0"
|
|
1048
1049
|
| "neutral-50"
|
|
@@ -1088,7 +1089,8 @@ declare module "react" {
|
|
|
1088
1089
|
| "warning-900"
|
|
1089
1090
|
| "alpha-subtle"
|
|
1090
1091
|
| "alpha-soft"
|
|
1091
|
-
| "alpha-medium"
|
|
1092
|
+
| "alpha-medium"
|
|
1093
|
+
| "alpha-strong";
|
|
1092
1094
|
"data-focus-bg"?:
|
|
1093
1095
|
| "neutral-0"
|
|
1094
1096
|
| "neutral-50"
|
|
@@ -1134,7 +1136,8 @@ declare module "react" {
|
|
|
1134
1136
|
| "warning-900"
|
|
1135
1137
|
| "alpha-subtle"
|
|
1136
1138
|
| "alpha-soft"
|
|
1137
|
-
| "alpha-medium"
|
|
1139
|
+
| "alpha-medium"
|
|
1140
|
+
| "alpha-strong";
|
|
1138
1141
|
"data-md-bg"?:
|
|
1139
1142
|
| "neutral-0"
|
|
1140
1143
|
| "neutral-50"
|
|
@@ -1180,7 +1183,8 @@ declare module "react" {
|
|
|
1180
1183
|
| "warning-900"
|
|
1181
1184
|
| "alpha-subtle"
|
|
1182
1185
|
| "alpha-soft"
|
|
1183
|
-
| "alpha-medium"
|
|
1186
|
+
| "alpha-medium"
|
|
1187
|
+
| "alpha-strong";
|
|
1184
1188
|
"data-md-hover-bg"?:
|
|
1185
1189
|
| "neutral-0"
|
|
1186
1190
|
| "neutral-50"
|
|
@@ -1226,7 +1230,8 @@ declare module "react" {
|
|
|
1226
1230
|
| "warning-900"
|
|
1227
1231
|
| "alpha-subtle"
|
|
1228
1232
|
| "alpha-soft"
|
|
1229
|
-
| "alpha-medium"
|
|
1233
|
+
| "alpha-medium"
|
|
1234
|
+
| "alpha-strong";
|
|
1230
1235
|
"data-md-focus-bg"?:
|
|
1231
1236
|
| "neutral-0"
|
|
1232
1237
|
| "neutral-50"
|
|
@@ -1272,7 +1277,8 @@ declare module "react" {
|
|
|
1272
1277
|
| "warning-900"
|
|
1273
1278
|
| "alpha-subtle"
|
|
1274
1279
|
| "alpha-soft"
|
|
1275
|
-
| "alpha-medium"
|
|
1280
|
+
| "alpha-medium"
|
|
1281
|
+
| "alpha-strong";
|
|
1276
1282
|
"data-backdrop"?: "none" | "weak" | "medium" | "strong" | "stronger";
|
|
1277
1283
|
"data-md-backdrop"?: "none" | "weak" | "medium" | "strong" | "stronger";
|
|
1278
1284
|
"data-bc"?:
|
|
@@ -1320,7 +1326,8 @@ declare module "react" {
|
|
|
1320
1326
|
| "warning-900"
|
|
1321
1327
|
| "alpha-subtle"
|
|
1322
1328
|
| "alpha-soft"
|
|
1323
|
-
| "alpha-medium"
|
|
1329
|
+
| "alpha-medium"
|
|
1330
|
+
| "alpha-strong";
|
|
1324
1331
|
"data-bct"?:
|
|
1325
1332
|
| "neutral-0"
|
|
1326
1333
|
| "neutral-50"
|
|
@@ -1366,7 +1373,8 @@ declare module "react" {
|
|
|
1366
1373
|
| "warning-900"
|
|
1367
1374
|
| "alpha-subtle"
|
|
1368
1375
|
| "alpha-soft"
|
|
1369
|
-
| "alpha-medium"
|
|
1376
|
+
| "alpha-medium"
|
|
1377
|
+
| "alpha-strong";
|
|
1370
1378
|
"data-bcr"?:
|
|
1371
1379
|
| "neutral-0"
|
|
1372
1380
|
| "neutral-50"
|
|
@@ -1412,7 +1420,8 @@ declare module "react" {
|
|
|
1412
1420
|
| "warning-900"
|
|
1413
1421
|
| "alpha-subtle"
|
|
1414
1422
|
| "alpha-soft"
|
|
1415
|
-
| "alpha-medium"
|
|
1423
|
+
| "alpha-medium"
|
|
1424
|
+
| "alpha-strong";
|
|
1416
1425
|
"data-bcb"?:
|
|
1417
1426
|
| "neutral-0"
|
|
1418
1427
|
| "neutral-50"
|
|
@@ -1458,7 +1467,8 @@ declare module "react" {
|
|
|
1458
1467
|
| "warning-900"
|
|
1459
1468
|
| "alpha-subtle"
|
|
1460
1469
|
| "alpha-soft"
|
|
1461
|
-
| "alpha-medium"
|
|
1470
|
+
| "alpha-medium"
|
|
1471
|
+
| "alpha-strong";
|
|
1462
1472
|
"data-bcl"?:
|
|
1463
1473
|
| "neutral-0"
|
|
1464
1474
|
| "neutral-50"
|
|
@@ -1504,7 +1514,8 @@ declare module "react" {
|
|
|
1504
1514
|
| "warning-900"
|
|
1505
1515
|
| "alpha-subtle"
|
|
1506
1516
|
| "alpha-soft"
|
|
1507
|
-
| "alpha-medium"
|
|
1517
|
+
| "alpha-medium"
|
|
1518
|
+
| "alpha-strong";
|
|
1508
1519
|
"data-bcx"?:
|
|
1509
1520
|
| "neutral-0"
|
|
1510
1521
|
| "neutral-50"
|
|
@@ -1550,7 +1561,8 @@ declare module "react" {
|
|
|
1550
1561
|
| "warning-900"
|
|
1551
1562
|
| "alpha-subtle"
|
|
1552
1563
|
| "alpha-soft"
|
|
1553
|
-
| "alpha-medium"
|
|
1564
|
+
| "alpha-medium"
|
|
1565
|
+
| "alpha-strong";
|
|
1554
1566
|
"data-bcy"?:
|
|
1555
1567
|
| "neutral-0"
|
|
1556
1568
|
| "neutral-50"
|
|
@@ -1596,7 +1608,8 @@ declare module "react" {
|
|
|
1596
1608
|
| "warning-900"
|
|
1597
1609
|
| "alpha-subtle"
|
|
1598
1610
|
| "alpha-soft"
|
|
1599
|
-
| "alpha-medium"
|
|
1611
|
+
| "alpha-medium"
|
|
1612
|
+
| "alpha-strong";
|
|
1600
1613
|
"data-hover-bc"?:
|
|
1601
1614
|
| "neutral-0"
|
|
1602
1615
|
| "neutral-50"
|
|
@@ -1642,7 +1655,8 @@ declare module "react" {
|
|
|
1642
1655
|
| "warning-900"
|
|
1643
1656
|
| "alpha-subtle"
|
|
1644
1657
|
| "alpha-soft"
|
|
1645
|
-
| "alpha-medium"
|
|
1658
|
+
| "alpha-medium"
|
|
1659
|
+
| "alpha-strong";
|
|
1646
1660
|
"data-focus-bc"?:
|
|
1647
1661
|
| "neutral-0"
|
|
1648
1662
|
| "neutral-50"
|
|
@@ -1688,7 +1702,8 @@ declare module "react" {
|
|
|
1688
1702
|
| "warning-900"
|
|
1689
1703
|
| "alpha-subtle"
|
|
1690
1704
|
| "alpha-soft"
|
|
1691
|
-
| "alpha-medium"
|
|
1705
|
+
| "alpha-medium"
|
|
1706
|
+
| "alpha-strong";
|
|
1692
1707
|
"data-md-bc"?:
|
|
1693
1708
|
| "neutral-0"
|
|
1694
1709
|
| "neutral-50"
|
|
@@ -1734,7 +1749,8 @@ declare module "react" {
|
|
|
1734
1749
|
| "warning-900"
|
|
1735
1750
|
| "alpha-subtle"
|
|
1736
1751
|
| "alpha-soft"
|
|
1737
|
-
| "alpha-medium"
|
|
1752
|
+
| "alpha-medium"
|
|
1753
|
+
| "alpha-strong";
|
|
1738
1754
|
"data-md-bct"?:
|
|
1739
1755
|
| "neutral-0"
|
|
1740
1756
|
| "neutral-50"
|
|
@@ -1780,7 +1796,8 @@ declare module "react" {
|
|
|
1780
1796
|
| "warning-900"
|
|
1781
1797
|
| "alpha-subtle"
|
|
1782
1798
|
| "alpha-soft"
|
|
1783
|
-
| "alpha-medium"
|
|
1799
|
+
| "alpha-medium"
|
|
1800
|
+
| "alpha-strong";
|
|
1784
1801
|
"data-md-bcr"?:
|
|
1785
1802
|
| "neutral-0"
|
|
1786
1803
|
| "neutral-50"
|
|
@@ -1826,7 +1843,8 @@ declare module "react" {
|
|
|
1826
1843
|
| "warning-900"
|
|
1827
1844
|
| "alpha-subtle"
|
|
1828
1845
|
| "alpha-soft"
|
|
1829
|
-
| "alpha-medium"
|
|
1846
|
+
| "alpha-medium"
|
|
1847
|
+
| "alpha-strong";
|
|
1830
1848
|
"data-md-bcb"?:
|
|
1831
1849
|
| "neutral-0"
|
|
1832
1850
|
| "neutral-50"
|
|
@@ -1872,7 +1890,8 @@ declare module "react" {
|
|
|
1872
1890
|
| "warning-900"
|
|
1873
1891
|
| "alpha-subtle"
|
|
1874
1892
|
| "alpha-soft"
|
|
1875
|
-
| "alpha-medium"
|
|
1893
|
+
| "alpha-medium"
|
|
1894
|
+
| "alpha-strong";
|
|
1876
1895
|
"data-md-bcl"?:
|
|
1877
1896
|
| "neutral-0"
|
|
1878
1897
|
| "neutral-50"
|
|
@@ -1918,7 +1937,8 @@ declare module "react" {
|
|
|
1918
1937
|
| "warning-900"
|
|
1919
1938
|
| "alpha-subtle"
|
|
1920
1939
|
| "alpha-soft"
|
|
1921
|
-
| "alpha-medium"
|
|
1940
|
+
| "alpha-medium"
|
|
1941
|
+
| "alpha-strong";
|
|
1922
1942
|
"data-md-bcx"?:
|
|
1923
1943
|
| "neutral-0"
|
|
1924
1944
|
| "neutral-50"
|
|
@@ -1964,7 +1984,8 @@ declare module "react" {
|
|
|
1964
1984
|
| "warning-900"
|
|
1965
1985
|
| "alpha-subtle"
|
|
1966
1986
|
| "alpha-soft"
|
|
1967
|
-
| "alpha-medium"
|
|
1987
|
+
| "alpha-medium"
|
|
1988
|
+
| "alpha-strong";
|
|
1968
1989
|
"data-md-bcy"?:
|
|
1969
1990
|
| "neutral-0"
|
|
1970
1991
|
| "neutral-50"
|
|
@@ -2010,7 +2031,8 @@ declare module "react" {
|
|
|
2010
2031
|
| "warning-900"
|
|
2011
2032
|
| "alpha-subtle"
|
|
2012
2033
|
| "alpha-soft"
|
|
2013
|
-
| "alpha-medium"
|
|
2034
|
+
| "alpha-medium"
|
|
2035
|
+
| "alpha-strong";
|
|
2014
2036
|
"data-md-hover-bc"?:
|
|
2015
2037
|
| "neutral-0"
|
|
2016
2038
|
| "neutral-50"
|
|
@@ -2056,7 +2078,8 @@ declare module "react" {
|
|
|
2056
2078
|
| "warning-900"
|
|
2057
2079
|
| "alpha-subtle"
|
|
2058
2080
|
| "alpha-soft"
|
|
2059
|
-
| "alpha-medium"
|
|
2081
|
+
| "alpha-medium"
|
|
2082
|
+
| "alpha-strong";
|
|
2060
2083
|
"data-md-focus-bc"?:
|
|
2061
2084
|
| "neutral-0"
|
|
2062
2085
|
| "neutral-50"
|
|
@@ -2102,7 +2125,8 @@ declare module "react" {
|
|
|
2102
2125
|
| "warning-900"
|
|
2103
2126
|
| "alpha-subtle"
|
|
2104
2127
|
| "alpha-soft"
|
|
2105
|
-
| "alpha-medium"
|
|
2128
|
+
| "alpha-medium"
|
|
2129
|
+
| "alpha-strong";
|
|
2106
2130
|
"data-bw"?:
|
|
2107
2131
|
| "none"
|
|
2108
2132
|
| "hairline"
|
|
@@ -2381,6 +2405,7 @@ declare module "react" {
|
|
|
2381
2405
|
| "truncate"
|
|
2382
2406
|
| "center"
|
|
2383
2407
|
| "nowrap"
|
|
2408
|
+
| "pre-line"
|
|
2384
2409
|
| "none"
|
|
2385
2410
|
| "line-clamp"
|
|
2386
2411
|
| "font-variant-numeric";
|
|
@@ -2392,6 +2417,7 @@ declare module "react" {
|
|
|
2392
2417
|
| "truncate"
|
|
2393
2418
|
| "center"
|
|
2394
2419
|
| "nowrap"
|
|
2420
|
+
| "pre-line"
|
|
2395
2421
|
| "none"
|
|
2396
2422
|
| "line-clamp"
|
|
2397
2423
|
| "font-variant-numeric";
|
package/dist/lib.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ export declare const AlphaTokens: {
|
|
|
2
2
|
readonly "color-alpha-subtle": "rgba(255 255 255 / 0.06)";
|
|
3
3
|
readonly "color-alpha-soft": "rgba(255 255 255 / 0.1)";
|
|
4
4
|
readonly "color-alpha-medium": "rgba(255 255 255 / 0.16)";
|
|
5
|
+
readonly "color-alpha-strong": "rgba(255 255 255 / 0.24)";
|
|
5
6
|
};
|
|
6
7
|
export type AlphaTokenType = keyof typeof AlphaTokens;
|
|
7
8
|
export declare const BackdropsTokens: {
|
|
@@ -219,32 +220,7 @@ export declare const MotionTokens: {
|
|
|
219
220
|
export type MotionTokenType = keyof typeof MotionTokens;
|
|
220
221
|
export declare const FocusRingTokens: {
|
|
221
222
|
readonly "focus-ring-brand": "var(--color-brand-500)";
|
|
222
|
-
readonly "focus-ring-neutral": "var(--
|
|
223
|
+
readonly "focus-ring-neutral": "var(--color-neutral-300)";
|
|
223
224
|
readonly "focus-ring-danger": "var(--color-danger-200)";
|
|
224
225
|
};
|
|
225
226
|
export type FocusRingTokenType = keyof typeof FocusRingTokens;
|
|
226
|
-
export declare const SemanticTokens: {
|
|
227
|
-
readonly "color-scheme": "dark";
|
|
228
|
-
readonly "surface-base": "var(--color-neutral-950)";
|
|
229
|
-
readonly "surface-raised": "var(--color-neutral-900)";
|
|
230
|
-
readonly "surface-overlay": "var(--color-neutral-850)";
|
|
231
|
-
readonly "surface-sunken": "var(--color-neutral-950)";
|
|
232
|
-
readonly "text-strong": "var(--color-neutral-100)";
|
|
233
|
-
readonly "text-primary": "var(--color-neutral-200)";
|
|
234
|
-
readonly "text-secondary": "var(--color-neutral-300)";
|
|
235
|
-
readonly "text-muted": "var(--color-neutral-400)";
|
|
236
|
-
readonly "text-disabled": "var(--color-neutral-500)";
|
|
237
|
-
readonly "text-inverted": "var(--color-neutral-950)";
|
|
238
|
-
readonly "text-link": "var(--color-brand-300)";
|
|
239
|
-
readonly "text-link-hover": "var(--color-brand-200)";
|
|
240
|
-
readonly "border-subtle": "var(--color-alpha-subtle)";
|
|
241
|
-
readonly "border-default": "var(--color-alpha-soft)";
|
|
242
|
-
readonly "border-strong": "var(--color-alpha-medium)";
|
|
243
|
-
readonly "interactive-rest": "var(--color-neutral-850)";
|
|
244
|
-
readonly "interactive-disabled": "var(--color-neutral-900)";
|
|
245
|
-
readonly "fill-muted": "var(--color-neutral-800)";
|
|
246
|
-
readonly "fill-strong": "var(--color-neutral-700)";
|
|
247
|
-
readonly "fill-inverted": "var(--color-neutral-200)";
|
|
248
|
-
readonly "fill-inverted-hover": "var(--color-neutral-0)";
|
|
249
|
-
};
|
|
250
|
-
export type SemanticTokenType = keyof typeof SemanticTokens;
|
package/dist/lib.js
CHANGED
|
@@ -3,6 +3,7 @@ var AlphaTokens = {
|
|
|
3
3
|
"color-alpha-subtle": "rgba(255 255 255 / 0.06)",
|
|
4
4
|
"color-alpha-soft": "rgba(255 255 255 / 0.1)",
|
|
5
5
|
"color-alpha-medium": "rgba(255 255 255 / 0.16)",
|
|
6
|
+
"color-alpha-strong": "rgba(255 255 255 / 0.24)",
|
|
6
7
|
};
|
|
7
8
|
var BackdropsTokens = {
|
|
8
9
|
"backdrop-none": "none",
|
|
@@ -205,33 +206,9 @@ var MotionTokens = {
|
|
|
205
206
|
};
|
|
206
207
|
var FocusRingTokens = {
|
|
207
208
|
"focus-ring-brand": "var(--color-brand-500)",
|
|
208
|
-
"focus-ring-neutral": "var(--
|
|
209
|
+
"focus-ring-neutral": "var(--color-neutral-300)",
|
|
209
210
|
"focus-ring-danger": "var(--color-danger-200)",
|
|
210
211
|
};
|
|
211
|
-
var SemanticTokens = {
|
|
212
|
-
"color-scheme": "dark",
|
|
213
|
-
"surface-base": "var(--color-neutral-950)",
|
|
214
|
-
"surface-raised": "var(--color-neutral-900)",
|
|
215
|
-
"surface-overlay": "var(--color-neutral-850)",
|
|
216
|
-
"surface-sunken": "var(--color-neutral-950)",
|
|
217
|
-
"text-strong": "var(--color-neutral-100)",
|
|
218
|
-
"text-primary": "var(--color-neutral-200)",
|
|
219
|
-
"text-secondary": "var(--color-neutral-300)",
|
|
220
|
-
"text-muted": "var(--color-neutral-400)",
|
|
221
|
-
"text-disabled": "var(--color-neutral-500)",
|
|
222
|
-
"text-inverted": "var(--color-neutral-950)",
|
|
223
|
-
"text-link": "var(--color-brand-300)",
|
|
224
|
-
"text-link-hover": "var(--color-brand-200)",
|
|
225
|
-
"border-subtle": "var(--color-alpha-subtle)",
|
|
226
|
-
"border-default": "var(--color-alpha-soft)",
|
|
227
|
-
"border-strong": "var(--color-alpha-medium)",
|
|
228
|
-
"interactive-rest": "var(--color-neutral-850)",
|
|
229
|
-
"interactive-disabled": "var(--color-neutral-900)",
|
|
230
|
-
"fill-muted": "var(--color-neutral-800)",
|
|
231
|
-
"fill-strong": "var(--color-neutral-700)",
|
|
232
|
-
"fill-inverted": "var(--color-neutral-200)",
|
|
233
|
-
"fill-inverted-hover": "var(--color-neutral-0)",
|
|
234
|
-
};
|
|
235
212
|
export {
|
|
236
213
|
AlphaTokens,
|
|
237
214
|
BackdropsTokens,
|
|
@@ -251,7 +228,6 @@ export {
|
|
|
251
228
|
OpacityTokens,
|
|
252
229
|
PositiveTokens,
|
|
253
230
|
RadiusTokens,
|
|
254
|
-
SemanticTokens,
|
|
255
231
|
ShadowTokens,
|
|
256
232
|
SizeTokens,
|
|
257
233
|
SpacingTokens,
|