@veracity/vui 2.1.0 → 2.2.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/cjs/avatar/theme.d.ts +1 -0
- package/dist/cjs/avatar/theme.d.ts.map +1 -1
- package/dist/cjs/avatar/theme.js +2 -1
- package/dist/cjs/badge/theme.d.ts +1 -0
- package/dist/cjs/badge/theme.d.ts.map +1 -1
- package/dist/cjs/badge/theme.js +2 -1
- package/dist/cjs/button/theme.d.ts +1 -0
- package/dist/cjs/button/theme.d.ts.map +1 -1
- package/dist/cjs/button/theme.js +2 -1
- package/dist/cjs/divider/divider.js +1 -1
- package/dist/cjs/dragAndDrop/dragAndDrop.d.ts +1 -1
- package/dist/cjs/dragAndDrop/dragAndDrop.d.ts.map +1 -1
- package/dist/cjs/dragAndDrop/dragAndDrop.js +3 -3
- package/dist/cjs/dragAndDrop/dragAndDrop.types.d.ts +1 -1
- package/dist/cjs/dragAndDrop/dragAndDrop.types.d.ts.map +1 -1
- package/dist/cjs/dragAndDrop/theme.d.ts +18 -3
- package/dist/cjs/dragAndDrop/theme.d.ts.map +1 -1
- package/dist/cjs/dragAndDrop/theme.js +23 -3
- package/dist/cjs/index.d.ts +1 -0
- package/dist/cjs/index.d.ts.map +1 -1
- package/dist/cjs/index.js +1 -0
- package/dist/cjs/input/consts.d.ts +17 -3
- package/dist/cjs/input/consts.d.ts.map +1 -1
- package/dist/cjs/input/consts.js +27 -13
- package/dist/cjs/input/helpText.js +2 -2
- package/dist/cjs/input/input.d.ts.map +1 -1
- package/dist/cjs/input/input.js +8 -11
- package/dist/cjs/input/input.types.d.ts +6 -6
- package/dist/cjs/input/input.types.d.ts.map +1 -1
- package/dist/cjs/input/inputIcon.d.ts.map +1 -1
- package/dist/cjs/input/inputIcon.js +2 -1
- package/dist/cjs/input/theme.d.ts +33 -17
- package/dist/cjs/input/theme.d.ts.map +1 -1
- package/dist/cjs/input/theme.js +32 -22
- package/dist/cjs/skeleton/skeleton.types.d.ts +1 -1
- package/dist/cjs/skeleton/skeleton.types.d.ts.map +1 -1
- package/dist/cjs/skeleton/theme.d.ts +10 -14
- package/dist/cjs/skeleton/theme.d.ts.map +1 -1
- package/dist/cjs/skeleton/theme.js +10 -21
- package/dist/cjs/tag/theme.d.ts +1 -0
- package/dist/cjs/tag/theme.d.ts.map +1 -1
- package/dist/cjs/tag/theme.js +2 -1
- package/dist/cjs/theme/components.d.ts +110 -19
- package/dist/cjs/theme/components.d.ts.map +1 -1
- package/dist/cjs/theme/components.js +3 -1
- package/dist/cjs/theme/defaultTheme.d.ts +110 -19
- package/dist/cjs/theme/defaultTheme.d.ts.map +1 -1
- package/dist/cjs/tooltip/tooltip.js +1 -1
- package/dist/cjs/tooltip/tooltipContent.d.ts +1 -1
- package/dist/cjs/tooltip/tooltipContent.d.ts.map +1 -1
- package/dist/cjs/tooltip/tooltipContent.js +1 -4
- package/dist/cjs/tree/context.d.ts +5 -0
- package/dist/cjs/tree/context.d.ts.map +1 -0
- package/dist/cjs/tree/context.js +7 -0
- package/dist/cjs/tree/index.d.ts +8 -0
- package/dist/cjs/tree/index.d.ts.map +1 -0
- package/dist/cjs/tree/index.js +28 -0
- package/dist/cjs/tree/theme.d.ts +59 -0
- package/dist/cjs/tree/theme.d.ts.map +1 -0
- package/dist/cjs/tree/theme.js +69 -0
- package/dist/cjs/tree/tree.d.ts +14 -0
- package/dist/cjs/tree/tree.d.ts.map +1 -0
- package/dist/cjs/tree/tree.js +116 -0
- package/dist/cjs/tree/tree.types.d.ts +58 -0
- package/dist/cjs/tree/tree.types.d.ts.map +1 -0
- package/dist/cjs/tree/tree.types.js +2 -0
- package/dist/cjs/tree/treeIcon.d.ts +5 -0
- package/dist/cjs/tree/treeIcon.d.ts.map +1 -0
- package/dist/cjs/tree/treeIcon.js +29 -0
- package/dist/cjs/tree/treeItem.d.ts +8 -0
- package/dist/cjs/tree/treeItem.d.ts.map +1 -0
- package/dist/cjs/tree/treeItem.js +131 -0
- package/dist/cjs/tree/treeText.d.ts +5 -0
- package/dist/cjs/tree/treeText.d.ts.map +1 -0
- package/dist/cjs/tree/treeText.js +29 -0
- package/dist/cjs/tree/useTreeState.d.ts +9 -0
- package/dist/cjs/tree/useTreeState.d.ts.map +1 -0
- package/dist/cjs/tree/useTreeState.js +10 -0
- package/dist/esm/avatar/theme.d.ts +1 -0
- package/dist/esm/avatar/theme.d.ts.map +1 -1
- package/dist/esm/avatar/theme.js +2 -1
- package/dist/esm/badge/theme.d.ts +1 -0
- package/dist/esm/badge/theme.d.ts.map +1 -1
- package/dist/esm/badge/theme.js +2 -1
- package/dist/esm/button/theme.d.ts +1 -0
- package/dist/esm/button/theme.d.ts.map +1 -1
- package/dist/esm/button/theme.js +2 -1
- package/dist/esm/divider/divider.js +1 -1
- package/dist/esm/dragAndDrop/dragAndDrop.d.ts +1 -1
- package/dist/esm/dragAndDrop/dragAndDrop.d.ts.map +1 -1
- package/dist/esm/dragAndDrop/dragAndDrop.js +3 -3
- package/dist/esm/dragAndDrop/dragAndDrop.types.d.ts +1 -1
- package/dist/esm/dragAndDrop/dragAndDrop.types.d.ts.map +1 -1
- package/dist/esm/dragAndDrop/theme.d.ts +18 -3
- package/dist/esm/dragAndDrop/theme.d.ts.map +1 -1
- package/dist/esm/dragAndDrop/theme.js +23 -3
- package/dist/esm/index.d.ts +1 -0
- package/dist/esm/index.d.ts.map +1 -1
- package/dist/esm/index.js +1 -0
- package/dist/esm/input/consts.d.ts +17 -3
- package/dist/esm/input/consts.d.ts.map +1 -1
- package/dist/esm/input/consts.js +26 -12
- package/dist/esm/input/helpText.js +3 -3
- package/dist/esm/input/input.d.ts.map +1 -1
- package/dist/esm/input/input.js +6 -9
- package/dist/esm/input/input.types.d.ts +6 -6
- package/dist/esm/input/input.types.d.ts.map +1 -1
- package/dist/esm/input/inputIcon.d.ts.map +1 -1
- package/dist/esm/input/inputIcon.js +2 -1
- package/dist/esm/input/theme.d.ts +33 -17
- package/dist/esm/input/theme.d.ts.map +1 -1
- package/dist/esm/input/theme.js +32 -22
- package/dist/esm/skeleton/skeleton.types.d.ts +1 -1
- package/dist/esm/skeleton/skeleton.types.d.ts.map +1 -1
- package/dist/esm/skeleton/theme.d.ts +10 -14
- package/dist/esm/skeleton/theme.d.ts.map +1 -1
- package/dist/esm/skeleton/theme.js +10 -21
- package/dist/esm/tag/theme.d.ts +1 -0
- package/dist/esm/tag/theme.d.ts.map +1 -1
- package/dist/esm/tag/theme.js +2 -1
- package/dist/esm/theme/components.d.ts +110 -19
- package/dist/esm/theme/components.d.ts.map +1 -1
- package/dist/esm/theme/components.js +3 -1
- package/dist/esm/theme/defaultTheme.d.ts +110 -19
- package/dist/esm/theme/defaultTheme.d.ts.map +1 -1
- package/dist/esm/tooltip/tooltip.js +1 -1
- package/dist/esm/tooltip/tooltipContent.d.ts +1 -1
- package/dist/esm/tooltip/tooltipContent.d.ts.map +1 -1
- package/dist/esm/tooltip/tooltipContent.js +1 -4
- package/dist/esm/tree/context.d.ts +5 -0
- package/dist/esm/tree/context.d.ts.map +1 -0
- package/dist/esm/tree/context.js +3 -0
- package/dist/esm/tree/index.d.ts +8 -0
- package/dist/esm/tree/index.d.ts.map +1 -0
- package/dist/esm/tree/index.js +7 -0
- package/dist/esm/tree/theme.d.ts +59 -0
- package/dist/esm/tree/theme.d.ts.map +1 -0
- package/dist/esm/tree/theme.js +67 -0
- package/dist/esm/tree/tree.d.ts +14 -0
- package/dist/esm/tree/tree.d.ts.map +1 -0
- package/dist/esm/tree/tree.js +74 -0
- package/dist/esm/tree/tree.types.d.ts +58 -0
- package/dist/esm/tree/tree.types.d.ts.map +1 -0
- package/dist/esm/tree/tree.types.js +1 -0
- package/dist/esm/tree/treeIcon.d.ts +5 -0
- package/dist/esm/tree/treeIcon.d.ts.map +1 -0
- package/dist/esm/tree/treeIcon.js +12 -0
- package/dist/esm/tree/treeItem.d.ts +8 -0
- package/dist/esm/tree/treeItem.d.ts.map +1 -0
- package/dist/esm/tree/treeItem.js +91 -0
- package/dist/esm/tree/treeText.d.ts +5 -0
- package/dist/esm/tree/treeText.d.ts.map +1 -0
- package/dist/esm/tree/treeText.js +12 -0
- package/dist/esm/tree/useTreeState.d.ts +9 -0
- package/dist/esm/tree/useTreeState.d.ts.map +1 -0
- package/dist/esm/tree/useTreeState.js +6 -0
- package/package.json +1 -1
- package/src/avatar/theme.ts +2 -1
- package/src/badge/theme.ts +2 -1
- package/src/button/theme.ts +2 -1
- package/src/divider/divider.tsx +1 -1
- package/src/dragAndDrop/dragAndDrop.tsx +3 -3
- package/src/dragAndDrop/dragAndDrop.types.ts +1 -1
- package/src/dragAndDrop/theme.ts +24 -3
- package/src/index.ts +1 -0
- package/src/input/consts.ts +27 -12
- package/src/input/helpText.tsx +3 -3
- package/src/input/input.tsx +5 -14
- package/src/input/input.types.ts +6 -6
- package/src/input/inputIcon.tsx +2 -1
- package/src/input/theme.ts +31 -27
- package/src/skeleton/skeleton.types.ts +1 -1
- package/src/skeleton/theme.ts +9 -28
- package/src/tag/theme.ts +2 -1
- package/src/theme/components.ts +3 -1
- package/src/tooltip/tooltip.tsx +1 -1
- package/src/tooltip/tooltipContent.tsx +17 -21
- package/src/tree/context.ts +5 -0
- package/src/tree/index.ts +7 -0
- package/src/tree/theme.ts +76 -0
- package/src/tree/tree.tsx +121 -0
- package/src/tree/tree.types.ts +65 -0
- package/src/tree/treeIcon.tsx +16 -0
- package/src/tree/treeItem.tsx +177 -0
- package/src/tree/treeText.tsx +26 -0
- package/src/tree/useTreeState.ts +10 -0
|
@@ -520,6 +520,7 @@ declare const defaultTheme: {
|
|
|
520
520
|
colorScheme: string;
|
|
521
521
|
size: string;
|
|
522
522
|
variant: string;
|
|
523
|
+
fontWeight: string;
|
|
523
524
|
};
|
|
524
525
|
sizes: {
|
|
525
526
|
xs: {
|
|
@@ -568,6 +569,7 @@ declare const defaultTheme: {
|
|
|
568
569
|
defaultProps: {
|
|
569
570
|
size: string;
|
|
570
571
|
variant: string;
|
|
572
|
+
fontWeight: string;
|
|
571
573
|
};
|
|
572
574
|
parts: string[];
|
|
573
575
|
sizes: {
|
|
@@ -719,6 +721,7 @@ declare const defaultTheme: {
|
|
|
719
721
|
defaultProps: {
|
|
720
722
|
size: string;
|
|
721
723
|
variant: string;
|
|
724
|
+
fontWeight: string;
|
|
722
725
|
};
|
|
723
726
|
parts: string[];
|
|
724
727
|
sizes: {
|
|
@@ -1054,10 +1057,25 @@ declare const defaultTheme: {
|
|
|
1054
1057
|
variants: {};
|
|
1055
1058
|
};
|
|
1056
1059
|
DragAndDrop: {
|
|
1057
|
-
baseStyle: {
|
|
1058
|
-
|
|
1060
|
+
baseStyle: {
|
|
1061
|
+
borderWidth: number;
|
|
1062
|
+
borderStyle: string;
|
|
1063
|
+
borderColor: string;
|
|
1064
|
+
bg: string;
|
|
1065
|
+
color: string;
|
|
1066
|
+
hoverBg: string;
|
|
1067
|
+
};
|
|
1068
|
+
defaultProps: {
|
|
1069
|
+
variant: string;
|
|
1070
|
+
};
|
|
1059
1071
|
sizes: {};
|
|
1060
|
-
variants: {
|
|
1072
|
+
variants: {
|
|
1073
|
+
default: {};
|
|
1074
|
+
outlined: {
|
|
1075
|
+
borderColor: string;
|
|
1076
|
+
borderStyle: string;
|
|
1077
|
+
};
|
|
1078
|
+
};
|
|
1061
1079
|
};
|
|
1062
1080
|
Footer: {
|
|
1063
1081
|
baseStyle: {};
|
|
@@ -1291,15 +1309,24 @@ declare const defaultTheme: {
|
|
|
1291
1309
|
variants: {};
|
|
1292
1310
|
};
|
|
1293
1311
|
Input: {
|
|
1294
|
-
baseStyle: {
|
|
1312
|
+
baseStyle: {
|
|
1313
|
+
container: {
|
|
1314
|
+
focusWithinRing: number;
|
|
1315
|
+
color: string;
|
|
1316
|
+
};
|
|
1317
|
+
input: {
|
|
1318
|
+
color: {
|
|
1319
|
+
placeholder: string;
|
|
1320
|
+
};
|
|
1321
|
+
};
|
|
1322
|
+
};
|
|
1295
1323
|
defaultProps: {
|
|
1296
|
-
colorScheme: string;
|
|
1297
1324
|
size: string;
|
|
1298
1325
|
variant: string;
|
|
1299
1326
|
};
|
|
1300
1327
|
parts: string[];
|
|
1301
1328
|
sizes: {
|
|
1302
|
-
|
|
1329
|
+
sm: {
|
|
1303
1330
|
container: {
|
|
1304
1331
|
fontSize: string;
|
|
1305
1332
|
h: number;
|
|
@@ -1309,7 +1336,7 @@ declare const defaultTheme: {
|
|
|
1309
1336
|
};
|
|
1310
1337
|
input: {};
|
|
1311
1338
|
};
|
|
1312
|
-
|
|
1339
|
+
md: {
|
|
1313
1340
|
container: {
|
|
1314
1341
|
fontSize: string;
|
|
1315
1342
|
h: number;
|
|
@@ -1319,7 +1346,7 @@ declare const defaultTheme: {
|
|
|
1319
1346
|
};
|
|
1320
1347
|
input: {};
|
|
1321
1348
|
};
|
|
1322
|
-
|
|
1349
|
+
lg: {
|
|
1323
1350
|
container: {
|
|
1324
1351
|
fontSize: string;
|
|
1325
1352
|
h: number;
|
|
@@ -1329,7 +1356,7 @@ declare const defaultTheme: {
|
|
|
1329
1356
|
};
|
|
1330
1357
|
input: {};
|
|
1331
1358
|
};
|
|
1332
|
-
|
|
1359
|
+
xl: {
|
|
1333
1360
|
container: {
|
|
1334
1361
|
fontSize: string;
|
|
1335
1362
|
h: number;
|
|
@@ -1341,14 +1368,23 @@ declare const defaultTheme: {
|
|
|
1341
1368
|
};
|
|
1342
1369
|
};
|
|
1343
1370
|
variants: {
|
|
1344
|
-
|
|
1371
|
+
grey: {
|
|
1372
|
+
container: {
|
|
1373
|
+
borderColor: string;
|
|
1374
|
+
focusWithinRingColor: string;
|
|
1375
|
+
};
|
|
1376
|
+
};
|
|
1377
|
+
green: {
|
|
1378
|
+
container: {
|
|
1379
|
+
borderColor: string;
|
|
1380
|
+
focusWithinRingColor: string;
|
|
1381
|
+
};
|
|
1382
|
+
};
|
|
1383
|
+
red: {
|
|
1345
1384
|
container: {
|
|
1346
1385
|
borderColor: string;
|
|
1347
|
-
focusWithinRing: number;
|
|
1348
1386
|
focusWithinRingColor: string;
|
|
1349
1387
|
};
|
|
1350
|
-
icon: {};
|
|
1351
|
-
input: {};
|
|
1352
1388
|
};
|
|
1353
1389
|
};
|
|
1354
1390
|
};
|
|
@@ -1812,9 +1848,10 @@ declare const defaultTheme: {
|
|
|
1812
1848
|
variants: {};
|
|
1813
1849
|
};
|
|
1814
1850
|
Skeleton: {
|
|
1815
|
-
baseStyle: {
|
|
1851
|
+
baseStyle: {
|
|
1852
|
+
bg: string;
|
|
1853
|
+
};
|
|
1816
1854
|
defaultProps: {
|
|
1817
|
-
colorScheme: string;
|
|
1818
1855
|
size: string;
|
|
1819
1856
|
variant: string;
|
|
1820
1857
|
};
|
|
@@ -1833,13 +1870,11 @@ declare const defaultTheme: {
|
|
|
1833
1870
|
};
|
|
1834
1871
|
};
|
|
1835
1872
|
variants: {
|
|
1836
|
-
circle:
|
|
1873
|
+
circle: {
|
|
1837
1874
|
borderRadius: string;
|
|
1838
|
-
bg: string;
|
|
1839
1875
|
};
|
|
1840
|
-
rect:
|
|
1876
|
+
rect: {
|
|
1841
1877
|
borderRadius: string;
|
|
1842
|
-
bg: string;
|
|
1843
1878
|
w: string;
|
|
1844
1879
|
};
|
|
1845
1880
|
};
|
|
@@ -2102,6 +2137,7 @@ declare const defaultTheme: {
|
|
|
2102
2137
|
defaultProps: {
|
|
2103
2138
|
size: string;
|
|
2104
2139
|
variant: string;
|
|
2140
|
+
fontWeight: string;
|
|
2105
2141
|
};
|
|
2106
2142
|
parts: string[];
|
|
2107
2143
|
sizes: {
|
|
@@ -2344,6 +2380,61 @@ declare const defaultTheme: {
|
|
|
2344
2380
|
};
|
|
2345
2381
|
};
|
|
2346
2382
|
};
|
|
2383
|
+
Tree: {
|
|
2384
|
+
baseStyle: {};
|
|
2385
|
+
defaultProps: {
|
|
2386
|
+
size: string;
|
|
2387
|
+
variant: string;
|
|
2388
|
+
};
|
|
2389
|
+
parts: string[];
|
|
2390
|
+
sizes: {
|
|
2391
|
+
sm: {
|
|
2392
|
+
icon: {
|
|
2393
|
+
size: string;
|
|
2394
|
+
};
|
|
2395
|
+
item: {
|
|
2396
|
+
fontSize: string;
|
|
2397
|
+
h: number;
|
|
2398
|
+
py: string;
|
|
2399
|
+
};
|
|
2400
|
+
};
|
|
2401
|
+
md: {
|
|
2402
|
+
icon: {
|
|
2403
|
+
size: string;
|
|
2404
|
+
};
|
|
2405
|
+
item: {
|
|
2406
|
+
fontSize: string;
|
|
2407
|
+
h: number;
|
|
2408
|
+
py: string;
|
|
2409
|
+
};
|
|
2410
|
+
};
|
|
2411
|
+
lg: {
|
|
2412
|
+
item: {
|
|
2413
|
+
fontSize: string;
|
|
2414
|
+
h: number;
|
|
2415
|
+
py: string;
|
|
2416
|
+
};
|
|
2417
|
+
icon: {
|
|
2418
|
+
size: string;
|
|
2419
|
+
};
|
|
2420
|
+
};
|
|
2421
|
+
xl: {
|
|
2422
|
+
item: {
|
|
2423
|
+
fontSize: string;
|
|
2424
|
+
h: number;
|
|
2425
|
+
py: string;
|
|
2426
|
+
};
|
|
2427
|
+
icon: {
|
|
2428
|
+
scale: number;
|
|
2429
|
+
};
|
|
2430
|
+
};
|
|
2431
|
+
};
|
|
2432
|
+
variants: {
|
|
2433
|
+
default: (props: import("..").Dict<any>) => {
|
|
2434
|
+
item: import("..").Dict<any>;
|
|
2435
|
+
};
|
|
2436
|
+
};
|
|
2437
|
+
};
|
|
2347
2438
|
};
|
|
2348
2439
|
};
|
|
2349
2440
|
export default defaultTheme;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"defaultTheme.d.ts","sourceRoot":"","sources":["../../../src/theme/defaultTheme.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,YAAY
|
|
1
|
+
{"version":3,"file":"defaultTheme.d.ts","sourceRoot":"","sources":["../../../src/theme/defaultTheme.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGjB,CAAA;AAED,eAAe,YAAY,CAAA"}
|
|
@@ -26,7 +26,7 @@ const Tooltip = (props) => {
|
|
|
26
26
|
text,
|
|
27
27
|
!!linkText && (react_2.default.createElement(react_2.default.Fragment, null,
|
|
28
28
|
"\u00A0",
|
|
29
|
-
react_2.default.createElement(link_1.Link, Object.assign({ variant: "
|
|
29
|
+
react_2.default.createElement(link_1.Link, Object.assign({ variant: "white" }, linkProps), linkText))))), interactive: true, offset: [0, 2], placement: placement, popperOptions: {
|
|
30
30
|
modifiers: [
|
|
31
31
|
{
|
|
32
32
|
name: 'flip',
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { TooltipProps } from './tooltip.types';
|
|
2
|
-
export declare const TooltipContent: (
|
|
2
|
+
export declare const TooltipContent: ({ children, fontSize, maxWidth }: TooltipProps) => JSX.Element;
|
|
3
3
|
//# sourceMappingURL=tooltipContent.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltipContent.d.ts","sourceRoot":"","sources":["../../../src/tooltip/tooltipContent.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE9C,eAAO,MAAM,cAAc,
|
|
1
|
+
{"version":3,"file":"tooltipContent.d.ts","sourceRoot":"","sources":["../../../src/tooltip/tooltipContent.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE9C,eAAO,MAAM,cAAc,qCAAyD,YAAY,gBAgB/F,CAAA"}
|
|
@@ -7,8 +7,5 @@ exports.TooltipContent = void 0;
|
|
|
7
7
|
const react_1 = __importDefault(require("react"));
|
|
8
8
|
const box_1 = __importDefault(require("../box"));
|
|
9
9
|
const tooltip_setup_1 = require("./tooltip.setup");
|
|
10
|
-
const TooltipContent = (
|
|
11
|
-
const { children, fontSize = '16px', maxWidth = '400px' } = props;
|
|
12
|
-
return (react_1.default.createElement(box_1.default, { bg: tooltip_setup_1.color, borderRadius: "md", boxShadow: "2", className: "vui-tooltip-content", color: "white", fontSize: fontSize, m: 1, maxW: maxWidth, overflowY: "auto", p: 1, pl: 2, pr: 2 }, children));
|
|
13
|
-
};
|
|
10
|
+
const TooltipContent = ({ children, fontSize = '16px', maxWidth = '400px' }) => (react_1.default.createElement(box_1.default, { bg: tooltip_setup_1.color, boxShadow: "2", className: "vui-tooltip-content", color: "white", fontSize: fontSize, m: 1, maxW: maxWidth, overflowY: "auto", p: 1, pl: 2, pr: 2 }, children));
|
|
14
11
|
exports.TooltipContent = TooltipContent;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/tree/context.ts"],"names":[],"mappings":";AAAA,OAAO,EAAiB,IAAI,EAAE,MAAM,UAAU,CAAA;AAE9C,QAAA,MAAO,YAAY,uCAAE,cAAc,iBAA6C,CAAA;AAEhF,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,CAAA"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useTreeContext = exports.TreeProvider = void 0;
|
|
4
|
+
const utils_1 = require("../utils");
|
|
5
|
+
const [TreeProvider, useTreeContext] = (0, utils_1.createContext)({ isOptional: true });
|
|
6
|
+
exports.TreeProvider = TreeProvider;
|
|
7
|
+
exports.useTreeContext = useTreeContext;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/tree/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,QAAQ,CAAA;AACtB,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAA;AAChC,cAAc,cAAc,CAAA;AAC5B,cAAc,YAAY,CAAA;AAC1B,cAAc,YAAY,CAAA;AAC1B,cAAc,YAAY,CAAA"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
+
};
|
|
16
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
17
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
18
|
+
};
|
|
19
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
20
|
+
exports.default = void 0;
|
|
21
|
+
__exportStar(require("./context"), exports);
|
|
22
|
+
__exportStar(require("./tree"), exports);
|
|
23
|
+
var tree_1 = require("./tree");
|
|
24
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(tree_1).default; } });
|
|
25
|
+
__exportStar(require("./tree.types"), exports);
|
|
26
|
+
__exportStar(require("./treeIcon"), exports);
|
|
27
|
+
__exportStar(require("./treeItem"), exports);
|
|
28
|
+
__exportStar(require("./treeText"), exports);
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { Dict } from '../utils';
|
|
2
|
+
declare function variantDefault(props: Dict): {
|
|
3
|
+
item: Dict<any>;
|
|
4
|
+
};
|
|
5
|
+
declare const _default: {
|
|
6
|
+
baseStyle: {};
|
|
7
|
+
defaultProps: {
|
|
8
|
+
size: string;
|
|
9
|
+
variant: string;
|
|
10
|
+
};
|
|
11
|
+
parts: string[];
|
|
12
|
+
sizes: {
|
|
13
|
+
sm: {
|
|
14
|
+
icon: {
|
|
15
|
+
size: string;
|
|
16
|
+
};
|
|
17
|
+
item: {
|
|
18
|
+
fontSize: string;
|
|
19
|
+
h: number;
|
|
20
|
+
py: string;
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
md: {
|
|
24
|
+
icon: {
|
|
25
|
+
size: string;
|
|
26
|
+
};
|
|
27
|
+
item: {
|
|
28
|
+
fontSize: string;
|
|
29
|
+
h: number;
|
|
30
|
+
py: string;
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
lg: {
|
|
34
|
+
item: {
|
|
35
|
+
fontSize: string;
|
|
36
|
+
h: number;
|
|
37
|
+
py: string;
|
|
38
|
+
};
|
|
39
|
+
icon: {
|
|
40
|
+
size: string;
|
|
41
|
+
};
|
|
42
|
+
};
|
|
43
|
+
xl: {
|
|
44
|
+
item: {
|
|
45
|
+
fontSize: string;
|
|
46
|
+
h: number;
|
|
47
|
+
py: string;
|
|
48
|
+
};
|
|
49
|
+
icon: {
|
|
50
|
+
scale: number;
|
|
51
|
+
};
|
|
52
|
+
};
|
|
53
|
+
};
|
|
54
|
+
variants: {
|
|
55
|
+
default: typeof variantDefault;
|
|
56
|
+
};
|
|
57
|
+
};
|
|
58
|
+
export default _default;
|
|
59
|
+
//# sourceMappingURL=theme.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/tree/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAE/B,iBAAS,cAAc,CAAC,KAAK,EAAE,IAAI;;EASlC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0DD,wBAMC"}
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
function variantDefault(props) {
|
|
4
|
+
const item = {
|
|
5
|
+
activeBg: 'skyBlue.30',
|
|
6
|
+
hoverBg: 'skyBlue.20',
|
|
7
|
+
selectedBg: 'skyBlue.10',
|
|
8
|
+
px: 2
|
|
9
|
+
};
|
|
10
|
+
return { item };
|
|
11
|
+
}
|
|
12
|
+
const baseStyle = {};
|
|
13
|
+
const defaultProps = {
|
|
14
|
+
size: 'md',
|
|
15
|
+
variant: 'default'
|
|
16
|
+
};
|
|
17
|
+
const parts = ['container', 'icon', 'item', 'text'];
|
|
18
|
+
const sizes = {
|
|
19
|
+
sm: {
|
|
20
|
+
icon: {
|
|
21
|
+
size: 'xs'
|
|
22
|
+
},
|
|
23
|
+
item: {
|
|
24
|
+
fontSize: 'md',
|
|
25
|
+
h: 32,
|
|
26
|
+
py: '3px'
|
|
27
|
+
}
|
|
28
|
+
},
|
|
29
|
+
md: {
|
|
30
|
+
icon: {
|
|
31
|
+
size: 'sm'
|
|
32
|
+
},
|
|
33
|
+
item: {
|
|
34
|
+
fontSize: 'md',
|
|
35
|
+
h: 40,
|
|
36
|
+
py: '5px'
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
lg: {
|
|
40
|
+
item: {
|
|
41
|
+
fontSize: 'md',
|
|
42
|
+
h: 48,
|
|
43
|
+
py: '7px'
|
|
44
|
+
},
|
|
45
|
+
icon: {
|
|
46
|
+
size: 'md'
|
|
47
|
+
}
|
|
48
|
+
},
|
|
49
|
+
xl: {
|
|
50
|
+
item: {
|
|
51
|
+
fontSize: 'lg',
|
|
52
|
+
h: 56,
|
|
53
|
+
py: '9px'
|
|
54
|
+
},
|
|
55
|
+
icon: {
|
|
56
|
+
scale: 2
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
};
|
|
60
|
+
const variants = {
|
|
61
|
+
default: variantDefault
|
|
62
|
+
};
|
|
63
|
+
exports.default = {
|
|
64
|
+
baseStyle,
|
|
65
|
+
defaultProps,
|
|
66
|
+
parts,
|
|
67
|
+
sizes,
|
|
68
|
+
variants
|
|
69
|
+
};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { VuiComponent } from '../core';
|
|
2
|
+
import { TreeProps } from './tree.types';
|
|
3
|
+
import TreeIcon from './treeIcon';
|
|
4
|
+
import TreeItem from './treeItem';
|
|
5
|
+
import TreeText from './treeText';
|
|
6
|
+
export declare const TreeBase: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("..").SystemProps, never>;
|
|
7
|
+
/** Displays a tree of tree link items and optional heading. Exposes some props to the children via context. */
|
|
8
|
+
export declare const Tree: VuiComponent<"div", TreeProps> & {
|
|
9
|
+
Icon: typeof TreeIcon;
|
|
10
|
+
Item: typeof TreeItem;
|
|
11
|
+
Text: typeof TreeText;
|
|
12
|
+
};
|
|
13
|
+
export default Tree;
|
|
14
|
+
//# sourceMappingURL=tree.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tree.d.ts","sourceRoot":"","sources":["../../../src/tree/tree.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAGnE,OAAO,EAA6B,SAAS,EAAE,MAAM,cAAc,CAAA;AACnE,OAAO,QAAQ,MAAM,YAAY,CAAA;AACjC,OAAO,QAAQ,MAAM,YAAY,CAAA;AACjC,OAAO,QAAQ,MAAM,YAAY,CAAA;AAGjC,eAAO,MAAM,QAAQ,+HAKpB,CAAA;AAED,+GAA+G;AAC/G,eAAO,MAAM,IAAI;UA4FT,eAAe;UACf,eAAe;UACf,eAAe;CACtB,CAAA;AAMD,eAAe,IAAI,CAAA"}
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
26
|
+
var t = {};
|
|
27
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
28
|
+
t[p] = s[p];
|
|
29
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
30
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
31
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
32
|
+
t[p[i]] = s[p[i]];
|
|
33
|
+
}
|
|
34
|
+
return t;
|
|
35
|
+
};
|
|
36
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
|
+
};
|
|
39
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
+
exports.Tree = exports.TreeBase = void 0;
|
|
41
|
+
const react_1 = __importStar(require("react"));
|
|
42
|
+
const core_1 = require("../core");
|
|
43
|
+
const utils_1 = require("../utils");
|
|
44
|
+
const context_1 = require("./context");
|
|
45
|
+
const treeIcon_1 = __importDefault(require("./treeIcon"));
|
|
46
|
+
const treeItem_1 = __importDefault(require("./treeItem"));
|
|
47
|
+
const treeText_1 = __importDefault(require("./treeText"));
|
|
48
|
+
const useTreeState_1 = require("./useTreeState");
|
|
49
|
+
exports.TreeBase = core_1.styled.divBox `
|
|
50
|
+
display: flex;
|
|
51
|
+
height: auto;
|
|
52
|
+
align-content: flex-start;
|
|
53
|
+
flex-direction: column;
|
|
54
|
+
`;
|
|
55
|
+
/** Displays a tree of tree link items and optional heading. Exposes some props to the children via context. */
|
|
56
|
+
exports.Tree = (0, core_1.vui)((props, ref) => {
|
|
57
|
+
const { activeItemId, children, className, iconCollapse = 'falMinus', iconExpand = 'falPlus', items, onClickItem, size, variant } = props, rest = __rest(props, ["activeItemId", "children", "className", "iconCollapse", "iconExpand", "items", "onClickItem", "size", "variant"]);
|
|
58
|
+
const styles = (0, core_1.useStyleConfig)('Tree', props);
|
|
59
|
+
const { itemsInternal, setItemsInternal, activeItemIndex, setActiveItemIndex } = (0, useTreeState_1.useTreeState)(activeItemId);
|
|
60
|
+
const context = (0, react_1.useMemo)(() => (0, utils_1.filterUndefined)({ size, variant }), [size, variant]);
|
|
61
|
+
const transformChildrenToItems = (children) => {
|
|
62
|
+
const t = [];
|
|
63
|
+
if (children) {
|
|
64
|
+
;
|
|
65
|
+
react_1.Children.toArray(children).forEach((child, index) => {
|
|
66
|
+
var _a;
|
|
67
|
+
if ((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.text) {
|
|
68
|
+
let items = [];
|
|
69
|
+
if (child.props.children) {
|
|
70
|
+
items = transformChildrenToItems(child.props.children);
|
|
71
|
+
}
|
|
72
|
+
t.push({
|
|
73
|
+
id: child.props.id,
|
|
74
|
+
text: child.props.text,
|
|
75
|
+
isActive: child.props.isActive,
|
|
76
|
+
items: child.props.items || items,
|
|
77
|
+
isCollapsed: child.props.isCollapsed,
|
|
78
|
+
disabled: child.props.disabled,
|
|
79
|
+
onClickTreeItem: onClickTreeItem
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
});
|
|
83
|
+
}
|
|
84
|
+
return t;
|
|
85
|
+
};
|
|
86
|
+
(0, react_1.useEffect)(() => {
|
|
87
|
+
if (items) {
|
|
88
|
+
setItemsInternal(items);
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
const t = [];
|
|
92
|
+
if (children) {
|
|
93
|
+
const transformed = transformChildrenToItems(children);
|
|
94
|
+
t.push(...transformed);
|
|
95
|
+
}
|
|
96
|
+
setItemsInternal(t);
|
|
97
|
+
if (activeItemId !== undefined && (t === null || t === void 0 ? void 0 : t.find((i) => i.id === activeItemId))) {
|
|
98
|
+
setActiveItemIndex(activeItemId);
|
|
99
|
+
}
|
|
100
|
+
}, [children, activeItemId]);
|
|
101
|
+
const onClickTreeItem = (id) => {
|
|
102
|
+
setActiveItemIndex(id);
|
|
103
|
+
if (onClickItem) {
|
|
104
|
+
onClickItem(id);
|
|
105
|
+
}
|
|
106
|
+
};
|
|
107
|
+
return (react_1.default.createElement(context_1.TreeProvider, { value: context },
|
|
108
|
+
react_1.default.createElement(exports.TreeBase, Object.assign({ className: (0, utils_1.cs)('vui-tree', className), ref: ref }, styles.container, rest), itemsInternal === null || itemsInternal === void 0 ? void 0 : itemsInternal.map((_a, index) => {
|
|
109
|
+
var { id, isActive } = _a, props = __rest(_a, ["id", "isActive"]);
|
|
110
|
+
return (react_1.default.createElement(treeItem_1.default, Object.assign({ activeItemIndex: activeItemIndex, iconCollapse: iconCollapse, iconExpand: iconExpand, id: id, isActive: activeItemIndex ? activeItemIndex === id : false, key: id !== null && id !== void 0 ? id : index, onClickTreeItem: onClickTreeItem }, props)));
|
|
111
|
+
}))));
|
|
112
|
+
});
|
|
113
|
+
exports.Tree.Icon = treeIcon_1.default;
|
|
114
|
+
exports.Tree.Item = treeItem_1.default;
|
|
115
|
+
exports.Tree.Text = treeText_1.default;
|
|
116
|
+
exports.default = exports.Tree;
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import { ReactNode, ReactText } from 'react';
|
|
2
|
+
import { IconProp } from '../icon';
|
|
3
|
+
import { LinkProps } from '../link';
|
|
4
|
+
import { SystemProps } from '../system';
|
|
5
|
+
import { ThemingProps } from '../theme';
|
|
6
|
+
import { PropsOf } from '../utils';
|
|
7
|
+
export declare type TreeProps = SystemProps & ThemingProps<'Tree'> & {
|
|
8
|
+
/** Currently selected item. */
|
|
9
|
+
activeItemId?: TreeItemId;
|
|
10
|
+
/** Socket defining the collapse icon on the left. */
|
|
11
|
+
iconCollapse?: IconProp;
|
|
12
|
+
/** Socket defining the expand icon on the left. */
|
|
13
|
+
iconExpand?: IconProp;
|
|
14
|
+
/** Socket displaying a tree of items. */
|
|
15
|
+
items?: PropsOf<'div', TreeItemProps>[] | JSX.Element;
|
|
16
|
+
/** Socket defining the size of the tree. */
|
|
17
|
+
onClickItem?: (id: TreeItemId) => void;
|
|
18
|
+
};
|
|
19
|
+
export declare type TreeItemLinkProps = PropsOf<'a', LinkProps> | object;
|
|
20
|
+
export declare type TreeItemId = string | number;
|
|
21
|
+
export declare type TreeOnToggleEvent = {
|
|
22
|
+
id: TreeItemId;
|
|
23
|
+
collapsed: boolean;
|
|
24
|
+
};
|
|
25
|
+
export declare type TreeItemProps = SystemProps & ThemingProps<'Tree'> & {
|
|
26
|
+
activeItemId?: TreeItemId;
|
|
27
|
+
/** internal, not exposed */
|
|
28
|
+
activeItemIndex?: TreeItemId;
|
|
29
|
+
/** Unique ID */
|
|
30
|
+
id: TreeItemId;
|
|
31
|
+
/** Centers the content vertically and horizontally. @deprecated */
|
|
32
|
+
center?: boolean;
|
|
33
|
+
/** Centers the content horizontally. @deprecated */
|
|
34
|
+
centerH?: boolean;
|
|
35
|
+
/** Centers the content vertically. @deprecated */
|
|
36
|
+
centerV?: boolean;
|
|
37
|
+
/** Socket defining the collapse icon on the left. */
|
|
38
|
+
iconCollapse?: IconProp;
|
|
39
|
+
/** Socket defining the expand icon on the left. */
|
|
40
|
+
iconExpand?: IconProp;
|
|
41
|
+
/** The children of this tree item. */
|
|
42
|
+
items?: PropsOf<'div', TreeItemProps>[];
|
|
43
|
+
children?: ReactNode;
|
|
44
|
+
/** Collapsed state */
|
|
45
|
+
isCollapsed?: boolean;
|
|
46
|
+
/** Displays item and its content in disabled state with appropriate styling. */
|
|
47
|
+
disabled?: boolean;
|
|
48
|
+
/** Displays item in selected state with appropriate styling. */
|
|
49
|
+
isActive?: boolean;
|
|
50
|
+
/** If provided, content is wrapper with a link and the props are provided to the element. */
|
|
51
|
+
linkProps?: TreeItemLinkProps;
|
|
52
|
+
/** Socket displaying text within the item. */
|
|
53
|
+
text: ReactText | JSX.Element;
|
|
54
|
+
/** Collapse change state */
|
|
55
|
+
onToggle?: (event: TreeOnToggleEvent) => void;
|
|
56
|
+
onClickTreeItem?: (id: TreeItemId) => void;
|
|
57
|
+
};
|
|
58
|
+
//# sourceMappingURL=tree.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tree.types.d.ts","sourceRoot":"","sources":["../../../src/tree/tree.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAE5C,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AACnC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;AAElC,oBAAY,SAAS,GAAG,WAAW,GACjC,YAAY,CAAC,MAAM,CAAC,GAAG;IACrB,gCAAgC;IAChC,YAAY,CAAC,EAAE,UAAU,CAAA;IACzB,qDAAqD;IACrD,YAAY,CAAC,EAAE,QAAQ,CAAA;IACvB,mDAAmD;IACnD,UAAU,CAAC,EAAE,QAAQ,CAAA;IACrB,yCAAyC;IACzC,KAAK,CAAC,EAAE,OAAO,CAAC,KAAK,EAAE,aAAa,CAAC,EAAE,GAAG,GAAG,CAAC,OAAO,CAAA;IACrD,4CAA4C;IAC5C,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,UAAU,KAAK,IAAI,CAAA;CACvC,CAAA;AAEH,oBAAY,iBAAiB,GAAG,OAAO,CAAC,GAAG,EAAE,SAAS,CAAC,GAAG,MAAM,CAAA;AAEhE,oBAAY,UAAU,GAAG,MAAM,GAAG,MAAM,CAAA;AAExC,oBAAY,iBAAiB,GAAG;IAC9B,EAAE,EAAE,UAAU,CAAA;IACd,SAAS,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,oBAAY,aAAa,GAAG,WAAW,GACrC,YAAY,CAAC,MAAM,CAAC,GAAG;IACrB,YAAY,CAAC,EAAE,UAAU,CAAA;IACzB,4BAA4B;IAC5B,eAAe,CAAC,EAAE,UAAU,CAAA;IAC5B,gBAAgB;IAChB,EAAE,EAAE,UAAU,CAAA;IACd,mEAAmE;IACnE,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,oDAAoD;IACpD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,kDAAkD;IAClD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,qDAAqD;IACrD,YAAY,CAAC,EAAE,QAAQ,CAAA;IACvB,mDAAmD;IACnD,UAAU,CAAC,EAAE,QAAQ,CAAA;IACrB,sCAAsC;IACtC,KAAK,CAAC,EAAE,OAAO,CAAC,KAAK,EAAE,aAAa,CAAC,EAAE,CAAA;IACvC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,sBAAsB;IACtB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,gFAAgF;IAChF,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,gEAAgE;IAChE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,6FAA6F;IAC7F,SAAS,CAAC,EAAE,iBAAiB,CAAA;IAC7B,8CAA8C;IAC9C,IAAI,EAAE,SAAS,GAAG,GAAG,CAAC,OAAO,CAAA;IAC7B,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAA;IAC7C,eAAe,CAAC,EAAE,CAAC,EAAE,EAAE,UAAU,KAAK,IAAI,CAAA;CAC3C,CAAA"}
|