@pingux/astro 2.149.2-alpha.0 → 2.150.0-alpha.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.
Files changed (30) hide show
  1. package/lib/cjs/components/Icon/Icon.js +2 -2
  2. package/lib/cjs/components/IconButton/IconButton.stories.js +18 -28
  3. package/lib/cjs/components/Tabs/Tabs.style.js +2 -2
  4. package/lib/cjs/hooks/useGetTheme/useGetTheme.d.ts +2 -0
  5. package/lib/cjs/hooks/useTShirtSize/useTShirtSize.test.js +51 -1
  6. package/lib/cjs/styles/themeOverrides/nextGenDarkMode/customProperties/index.d.ts +1 -0
  7. package/lib/cjs/styles/themeOverrides/nextGenDarkMode/variants/buttons.d.ts +7 -45
  8. package/lib/cjs/styles/themeOverrides/nextGenDarkMode/variants/buttons.js +10 -23
  9. package/lib/cjs/styles/themes/astro/customProperties/index.d.ts +1 -0
  10. package/lib/cjs/styles/themes/astro/customProperties/index.js +2 -0
  11. package/lib/cjs/styles/themes/next-gen/colors/colors.js +1 -1
  12. package/lib/cjs/styles/themes/next-gen/customProperties/index.d.ts +4 -2
  13. package/lib/cjs/styles/themes/next-gen/customProperties/index.js +2 -0
  14. package/lib/cjs/styles/themes/next-gen/customProperties/tShirtSizes.js +13 -13
  15. package/lib/cjs/styles/themes/next-gen/next-gen.d.ts +145 -245
  16. package/lib/cjs/styles/themes/next-gen/variants/badges.d.ts +18 -20
  17. package/lib/cjs/styles/themes/next-gen/variants/button.d.ts +136 -235
  18. package/lib/cjs/styles/themes/next-gen/variants/button.js +48 -105
  19. package/lib/cjs/styles/themes/next-gen/variants/variants.d.ts +9 -10
  20. package/lib/components/Icon/Icon.js +2 -2
  21. package/lib/components/IconButton/IconButton.stories.js +18 -28
  22. package/lib/components/Tabs/Tabs.style.js +2 -2
  23. package/lib/hooks/useTShirtSize/useTShirtSize.test.js +51 -1
  24. package/lib/styles/themeOverrides/nextGenDarkMode/variants/buttons.js +10 -23
  25. package/lib/styles/themes/astro/customProperties/index.js +2 -0
  26. package/lib/styles/themes/next-gen/colors/colors.js +1 -1
  27. package/lib/styles/themes/next-gen/customProperties/index.js +2 -0
  28. package/lib/styles/themes/next-gen/customProperties/tShirtSizes.js +13 -13
  29. package/lib/styles/themes/next-gen/variants/button.js +48 -105
  30. package/package.json +1 -1
@@ -783,19 +783,16 @@ declare const _default: {
783
783
  };
784
784
  badgeDeleteButton: {
785
785
  transition: string;
786
- height: number;
787
786
  p: number;
787
+ height: number;
788
788
  width: number;
789
- border: string;
790
789
  '&.is-focused': {
791
- backgroundColor: string;
792
790
  outline: string;
793
791
  outlineColor: string;
794
792
  outlineOffset: string;
795
793
  };
796
794
  '&.is-pressed': {
797
795
  backgroundColor: string;
798
- borderColor: string;
799
796
  path: {
800
797
  fill: string;
801
798
  };
@@ -803,29 +800,27 @@ declare const _default: {
803
800
  '&.is-hovered': {
804
801
  bg: string;
805
802
  };
806
- cursor: string;
807
- outline: string;
808
- borderRadius: string;
809
- borderColor: string;
810
803
  path: {
811
804
  fill: string;
812
805
  };
806
+ outline: string;
807
+ borderRadius: string;
808
+ border: string;
809
+ cursor: string;
810
+ boxShadow: string;
813
811
  };
814
812
  invertedBadgeDeleteButton: {
815
813
  transition: string;
816
- height: number;
817
814
  p: number;
815
+ height: number;
818
816
  width: number;
819
- border: string;
820
817
  '&.is-focused': {
821
- backgroundColor: string;
822
818
  outline: string;
823
819
  outlineColor: string;
824
820
  outlineOffset: string;
825
821
  };
826
822
  '&.is-pressed': {
827
823
  backgroundColor: string;
828
- borderColor: string;
829
824
  path: {
830
825
  fill: string;
831
826
  };
@@ -833,13 +828,14 @@ declare const _default: {
833
828
  '&.is-hovered': {
834
829
  bg: string;
835
830
  };
836
- cursor: string;
837
- outline: string;
838
- borderRadius: string;
839
- borderColor: string;
840
831
  path: {
841
832
  fill: string;
842
833
  };
834
+ outline: string;
835
+ borderRadius: string;
836
+ border: string;
837
+ cursor: string;
838
+ boxShadow: string;
843
839
  };
844
840
  clearSelectionButton: {
845
841
  top: string;
@@ -848,34 +844,26 @@ declare const _default: {
848
844
  '.is-float-label &': {
849
845
  top: string;
850
846
  };
847
+ path: {
848
+ fill: string;
849
+ };
851
850
  width: string;
852
851
  height: string;
853
- border: string;
854
852
  position: string;
855
- '& > svg': {
856
- minWidth: string;
857
- width: string;
858
- height: string;
859
- };
860
853
  '&.is-hovered': {
861
854
  bg: string;
855
+ boxShadow: string;
862
856
  };
863
857
  '&.is-pressed': {
864
858
  bg: string;
865
859
  };
866
- cursor: string;
860
+ p: string;
867
861
  transition: string;
868
862
  outline: string;
869
863
  borderRadius: string;
870
- borderColor: string;
871
- path: {
872
- fill: string;
873
- };
874
- '&.is-focused': {
875
- outline: string;
876
- outlineColor: string;
877
- outlineOffset: string;
878
- };
864
+ border: string;
865
+ cursor: string;
866
+ boxShadow: string;
879
867
  };
880
868
  };
881
869
  withIcon: {
@@ -1130,35 +1118,6 @@ declare const _default: {
1130
1118
  };
1131
1119
  iconButtons: {
1132
1120
  base: {
1133
- cursor: string;
1134
- transition: string;
1135
- outline: string;
1136
- borderRadius: string;
1137
- border: string;
1138
- borderColor: string;
1139
- path: {
1140
- fill: string;
1141
- };
1142
- '&.is-focused': {
1143
- outline: string;
1144
- outlineColor: string;
1145
- outlineOffset: string;
1146
- };
1147
- '&.is-hovered': {
1148
- backgroundColor: string;
1149
- path: {
1150
- fill: string;
1151
- };
1152
- };
1153
- '&.is-pressed': {
1154
- backgroundColor: string;
1155
- borderColor: string;
1156
- path: {
1157
- fill: string;
1158
- };
1159
- };
1160
- };
1161
- nextGen: {
1162
1121
  path: {
1163
1122
  fill: string;
1164
1123
  };
@@ -1170,50 +1129,30 @@ declare const _default: {
1170
1129
  };
1171
1130
  '&.is-pressed': {
1172
1131
  backgroundColor: string;
1173
- borderColor: string;
1174
1132
  path: {
1175
1133
  fill: string;
1176
1134
  };
1177
1135
  };
1178
- maxHeight: string;
1179
- maxWidth: string;
1180
- width: string;
1181
- p: string;
1182
- display: string;
1183
- alignItems: string;
1184
- justifyContent: string;
1185
- backgroundColor: string;
1186
- borderColor: string;
1187
- color: string;
1188
- flexShrink: number;
1189
- minWidth: string;
1190
- cursor: string;
1191
- fontFamily: string;
1192
- fontSize: string;
1193
- fontWeight: number;
1194
- textAlign: string;
1195
- verticalAlign: string;
1196
- lineHeight: number;
1197
- borderRadius: string;
1198
- border: string;
1199
- px: string;
1200
- py: string;
1201
- height: string;
1202
- '&.is-disabled': {
1203
- opacity: number;
1204
- };
1205
1136
  '&.is-focused': {
1206
1137
  outline: string;
1207
1138
  outlineColor: string;
1208
1139
  outlineOffset: string;
1209
1140
  };
1141
+ p: string;
1210
1142
  transition: string;
1211
1143
  outline: string;
1144
+ borderRadius: string;
1145
+ border: string;
1146
+ cursor: string;
1147
+ boxShadow: string;
1212
1148
  };
1213
1149
  onyx: {
1214
1150
  path: {
1215
1151
  fill: string;
1216
1152
  };
1153
+ display: string;
1154
+ alignItems: string;
1155
+ justifyContent: string;
1217
1156
  '&.is-hovered': {
1218
1157
  backgroundColor: string;
1219
1158
  path: {
@@ -1222,65 +1161,31 @@ declare const _default: {
1222
1161
  };
1223
1162
  '&.is-pressed': {
1224
1163
  backgroundColor: string;
1225
- borderColor: string;
1226
1164
  path: {
1227
1165
  fill: string;
1228
1166
  };
1229
1167
  };
1230
- maxHeight: string;
1231
- maxWidth: string;
1232
- width: string;
1233
- p: string;
1234
- display: string;
1235
- alignItems: string;
1236
- justifyContent: string;
1237
- backgroundColor: string;
1238
- borderColor: string;
1239
- color: string;
1240
- flexShrink: number;
1241
- minWidth: string;
1242
- cursor: string;
1243
- fontFamily: string;
1244
- fontSize: string;
1245
- fontWeight: number;
1246
- textAlign: string;
1247
- verticalAlign: string;
1248
- lineHeight: number;
1249
- borderRadius: string;
1250
- border: string;
1251
- px: string;
1252
- py: string;
1253
- height: string;
1254
- '&.is-disabled': {
1255
- opacity: number;
1256
- };
1257
1168
  '&.is-focused': {
1258
1169
  outline: string;
1259
1170
  outlineColor: string;
1260
1171
  outlineOffset: string;
1261
1172
  };
1173
+ p: string;
1262
1174
  transition: string;
1263
1175
  outline: string;
1176
+ borderRadius: string;
1177
+ border: string;
1178
+ cursor: string;
1179
+ boxShadow: string;
1264
1180
  };
1265
1181
  responseToolbar: {
1266
1182
  '&.is-not-loaded': {
1267
1183
  display: string;
1268
1184
  };
1269
1185
  display: string;
1270
- cursor: string;
1271
- transition: string;
1272
- outline: string;
1273
- borderRadius: string;
1274
- border: string;
1275
- borderColor: string;
1276
1186
  path: {
1277
1187
  fill: string;
1278
1188
  };
1279
- '&.is-focused': {
1280
- outline: string;
1281
- outlineColor: string;
1282
- outlineOffset: string;
1283
- };
1284
1189
  '&.is-hovered': {
1285
1190
  backgroundColor: string;
1286
1191
  path: {
@@ -1289,30 +1194,30 @@ declare const _default: {
1289
1194
  };
1290
1195
  '&.is-pressed': {
1291
1196
  backgroundColor: string;
1292
- borderColor: string;
1293
1197
  path: {
1294
1198
  fill: string;
1295
1199
  };
1296
1200
  };
1201
+ '&.is-focused': {
1202
+ outline: string;
1203
+ outlineColor: string;
1204
+ outlineOffset: string;
1205
+ };
1206
+ p: string;
1207
+ transition: string;
1208
+ outline: string;
1209
+ borderRadius: string;
1210
+ border: string;
1211
+ cursor: string;
1212
+ boxShadow: string;
1297
1213
  };
1298
1214
  modalCloseButton: {
1299
1215
  position: string;
1300
1216
  top: number;
1301
1217
  right: number;
1302
- cursor: string;
1303
- transition: string;
1304
- outline: string;
1305
- borderRadius: string;
1306
- border: string;
1307
- borderColor: string;
1308
1218
  path: {
1309
1219
  fill: string;
1310
1220
  };
1311
- '&.is-focused': {
1312
- outline: string;
1313
- outlineColor: string;
1314
- outlineOffset: string;
1315
- };
1316
1221
  '&.is-hovered': {
1317
1222
  backgroundColor: string;
1318
1223
  path: {
@@ -1321,11 +1226,22 @@ declare const _default: {
1321
1226
  };
1322
1227
  '&.is-pressed': {
1323
1228
  backgroundColor: string;
1324
- borderColor: string;
1325
1229
  path: {
1326
1230
  fill: string;
1327
1231
  };
1328
1232
  };
1233
+ '&.is-focused': {
1234
+ outline: string;
1235
+ outlineColor: string;
1236
+ outlineOffset: string;
1237
+ };
1238
+ p: string;
1239
+ transition: string;
1240
+ outline: string;
1241
+ borderRadius: string;
1242
+ border: string;
1243
+ cursor: string;
1244
+ boxShadow: string;
1329
1245
  };
1330
1246
  badge: {
1331
1247
  deleteButton: {
@@ -1343,14 +1259,10 @@ declare const _default: {
1343
1259
  };
1344
1260
  '&.is-pressed': {
1345
1261
  backgroundColor: string;
1346
- borderColor: string;
1347
1262
  path: {
1348
1263
  fill: string;
1349
1264
  };
1350
1265
  };
1351
- outline: string;
1352
- border: string;
1353
- borderColor: string;
1354
1266
  path: {
1355
1267
  fill: string;
1356
1268
  };
@@ -1360,6 +1272,9 @@ declare const _default: {
1360
1272
  fill: string;
1361
1273
  };
1362
1274
  };
1275
+ outline: string;
1276
+ border: string;
1277
+ boxShadow: string;
1363
1278
  };
1364
1279
  };
1365
1280
  messageCloseButton: {
@@ -1374,20 +1289,9 @@ declare const _default: {
1374
1289
  fill: string;
1375
1290
  };
1376
1291
  };
1377
- cursor: string;
1378
- transition: string;
1379
- outline: string;
1380
- borderRadius: string;
1381
- border: string;
1382
- borderColor: string;
1383
1292
  path: {
1384
1293
  fill: string;
1385
1294
  };
1386
- '&.is-focused': {
1387
- outline: string;
1388
- outlineColor: string;
1389
- outlineOffset: string;
1390
- };
1391
1295
  '&.is-hovered': {
1392
1296
  backgroundColor: string;
1393
1297
  path: {
@@ -1396,41 +1300,51 @@ declare const _default: {
1396
1300
  };
1397
1301
  '&.is-pressed': {
1398
1302
  backgroundColor: string;
1399
- borderColor: string;
1400
1303
  path: {
1401
1304
  fill: string;
1402
1305
  };
1403
1306
  };
1307
+ '&.is-focused': {
1308
+ outline: string;
1309
+ outlineColor: string;
1310
+ outlineOffset: string;
1311
+ };
1312
+ p: string;
1313
+ transition: string;
1314
+ outline: string;
1315
+ borderRadius: string;
1316
+ border: string;
1317
+ cursor: string;
1318
+ boxShadow: string;
1404
1319
  };
1405
1320
  headerNav: {
1406
- borderRadius: string;
1407
1321
  path: {
1408
1322
  fill: string;
1409
1323
  };
1410
- px: string;
1411
- py: string;
1412
- width: string;
1413
- height: string;
1414
1324
  '&.is-hovered': {
1325
+ backgroundColor: string;
1415
1326
  path: {
1416
1327
  fill: string;
1417
1328
  };
1418
1329
  };
1419
1330
  '&.is-pressed': {
1331
+ backgroundColor: string;
1420
1332
  path: {
1421
1333
  fill: string;
1422
1334
  };
1423
1335
  };
1424
1336
  '&.is-focused': {
1425
- outlineOffset: string;
1426
1337
  outline: string;
1427
1338
  outlineColor: string;
1339
+ outlineOffset: string;
1428
1340
  };
1429
- cursor: string;
1341
+ p: string;
1430
1342
  transition: string;
1431
1343
  outline: string;
1344
+ borderRadius: string;
1432
1345
  border: string;
1433
- borderColor: string;
1346
+ cursor: string;
1347
+ boxShadow: string;
1434
1348
  };
1435
1349
  copyButton: {
1436
1350
  mx: string;
@@ -1441,99 +1355,84 @@ declare const _default: {
1441
1355
  };
1442
1356
  deleteAttachment: {
1443
1357
  backgroundColor: string;
1444
- border: string;
1445
- borderColor: string;
1446
1358
  size: string;
1447
- p: string;
1448
1359
  '&.is-hovered': {
1449
1360
  backgroundColor: string;
1450
1361
  };
1451
- cursor: string;
1452
- transition: string;
1453
- outline: string;
1454
- borderRadius: string;
1455
1362
  path: {
1456
1363
  fill: string;
1457
1364
  };
1458
- '&.is-focused': {
1459
- outline: string;
1460
- outlineColor: string;
1461
- outlineOffset: string;
1462
- };
1463
1365
  '&.is-pressed': {
1464
1366
  backgroundColor: string;
1465
- borderColor: string;
1466
1367
  path: {
1467
1368
  fill: string;
1468
1369
  };
1469
1370
  };
1470
- };
1471
- inverted: {
1472
- cursor: string;
1473
- transition: string;
1474
- outline: string;
1475
- path: {
1476
- fill: string;
1477
- };
1478
1371
  '&.is-focused': {
1479
1372
  outline: string;
1480
1373
  outlineColor: string;
1481
1374
  outlineOffset: string;
1482
1375
  };
1483
- '&.is-pressed': {
1376
+ p: string;
1377
+ transition: string;
1378
+ outline: string;
1379
+ borderRadius: string;
1380
+ border: string;
1381
+ cursor: string;
1382
+ boxShadow: string;
1383
+ };
1384
+ inverted: {
1385
+ '&.is-hovered': {
1386
+ boxShadow: string;
1484
1387
  backgroundColor: string;
1485
- borderColor: string;
1486
1388
  };
1487
- '&.is-hovered': {
1488
- border: string;
1489
- borderColor: string;
1389
+ '&.is-pressed': {
1490
1390
  backgroundColor: string;
1491
- boxShadow: string;
1492
1391
  };
1493
1392
  '&.is-disabled': {
1494
1393
  backgroundColor: string;
1495
1394
  };
1395
+ '&.is-focused': {
1396
+ outline: string;
1397
+ outlineColor: string;
1398
+ outlineOffset: string;
1399
+ };
1400
+ p: string;
1401
+ transition: string;
1402
+ outline: string;
1403
+ borderRadius: string;
1404
+ border: string;
1405
+ cursor: string;
1406
+ boxShadow: string;
1496
1407
  };
1497
1408
  searchClearButton: {
1409
+ path: {
1410
+ fill: string;
1411
+ };
1498
1412
  width: string;
1499
1413
  height: string;
1500
- border: string;
1501
1414
  position: string;
1502
1415
  right: string;
1503
- '& > svg': {
1504
- minWidth: string;
1505
- width: string;
1506
- height: string;
1507
- };
1508
1416
  '&.is-hovered': {
1509
1417
  bg: string;
1418
+ boxShadow: string;
1510
1419
  };
1511
1420
  '&.is-pressed': {
1512
1421
  bg: string;
1513
1422
  };
1514
- cursor: string;
1423
+ p: string;
1515
1424
  transition: string;
1516
1425
  outline: string;
1517
1426
  borderRadius: string;
1518
- borderColor: string;
1519
- path: {
1520
- fill: string;
1521
- };
1522
- '&.is-focused': {
1523
- outline: string;
1524
- outlineColor: string;
1525
- outlineOffset: string;
1526
- };
1427
+ border: string;
1428
+ cursor: string;
1429
+ boxShadow: string;
1527
1430
  };
1528
1431
  filter: {
1529
- bg: string;
1530
- border: string;
1531
- borderColor: string;
1532
1432
  width: string;
1533
1433
  height: string;
1534
1434
  '&.is-hovered': {
1535
- border: string;
1536
- borderColor: string;
1435
+ boxShadow: string;
1537
1436
  backgroundColor: string;
1538
1437
  path: {
1539
1438
  fill: string;
@@ -1541,15 +1440,10 @@ declare const _default: {
1541
1440
  };
1542
1441
  '&.is-pressed': {
1543
1442
  backgroundColor: string;
1544
- borderColor: string;
1545
1443
  path: {
1546
1444
  fill: string;
1547
1445
  };
1548
1446
  };
1549
- cursor: string;
1550
- transition: string;
1551
- outline: string;
1552
- borderRadius: string;
1553
1447
  path: {
1554
1448
  fill: string;
1555
1449
  };
@@ -1558,43 +1452,39 @@ declare const _default: {
1558
1452
  outlineColor: string;
1559
1453
  outlineOffset: string;
1560
1454
  };
1455
+ p: string;
1456
+ transition: string;
1457
+ outline: string;
1458
+ borderRadius: string;
1459
+ border: string;
1460
+ cursor: string;
1461
+ boxShadow: string;
1561
1462
  };
1562
1463
  hintButton: {
1563
1464
  backgroundColor: string;
1564
1465
  path: {
1565
1466
  fill: string;
1566
1467
  };
1567
- '&.is-focused': {
1568
- outline: string;
1569
- outlineColor: string;
1570
- outlineOffset: string;
1571
- };
1572
1468
  '&.is-hovered': {
1573
1469
  backgroundColor: string;
1574
1470
  path: {
1575
1471
  fill: string;
1576
1472
  };
1577
1473
  };
1474
+ '&.is-focused': {
1475
+ outline: string;
1476
+ outlineColor: string;
1477
+ outlineOffset: string;
1478
+ };
1578
1479
  };
1579
1480
  };
1580
1481
  modalCloseButton: {
1581
1482
  position: string;
1582
1483
  top: number;
1583
1484
  right: number;
1584
- cursor: string;
1585
- transition: string;
1586
- outline: string;
1587
- borderRadius: string;
1588
- border: string;
1589
- borderColor: string;
1590
1485
  path: {
1591
1486
  fill: string;
1592
1487
  };
1593
- '&.is-focused': {
1594
- outline: string;
1595
- outlineColor: string;
1596
- outlineOffset: string;
1597
- };
1598
1488
  '&.is-hovered': {
1599
1489
  backgroundColor: string;
1600
1490
  path: {
@@ -1603,11 +1493,22 @@ declare const _default: {
1603
1493
  };
1604
1494
  '&.is-pressed': {
1605
1495
  backgroundColor: string;
1606
- borderColor: string;
1607
1496
  path: {
1608
1497
  fill: string;
1609
1498
  };
1610
1499
  };
1500
+ '&.is-focused': {
1501
+ outline: string;
1502
+ outlineColor: string;
1503
+ outlineOffset: string;
1504
+ };
1505
+ p: string;
1506
+ transition: string;
1507
+ outline: string;
1508
+ borderRadius: string;
1509
+ border: string;
1510
+ cursor: string;
1511
+ boxShadow: string;
1611
1512
  };
1612
1513
  aiChat: {
1613
1514
  maxWidth: string;
@@ -2827,18 +2728,9 @@ declare const _default: {
2827
2728
  height: number;
2828
2729
  p: number;
2829
2730
  width: number;
2830
- transition: string;
2831
- outline: string;
2832
- border: string;
2833
- borderColor: string;
2834
2731
  path: {
2835
2732
  fill: string;
2836
2733
  };
2837
- '&.is-focused': {
2838
- outline: string;
2839
- outlineColor: string;
2840
- outlineOffset: string;
2841
- };
2842
2734
  '&.is-hovered': {
2843
2735
  backgroundColor: string;
2844
2736
  path: {
@@ -2847,11 +2739,19 @@ declare const _default: {
2847
2739
  };
2848
2740
  '&.is-pressed': {
2849
2741
  backgroundColor: string;
2850
- borderColor: string;
2851
2742
  path: {
2852
2743
  fill: string;
2853
2744
  };
2854
2745
  };
2746
+ '&.is-focused': {
2747
+ outline: string;
2748
+ outlineColor: string;
2749
+ outlineOffset: string;
2750
+ };
2751
+ transition: string;
2752
+ outline: string;
2753
+ border: string;
2754
+ boxShadow: string;
2855
2755
  };
2856
2756
  itemBadgeWithSlot: {
2857
2757
  bg: string;