@sc-360-v2/storefront-cms-library 0.5.53 → 0.5.54

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 (17) hide show
  1. package/dist/allocationDetails.scss +9 -248
  2. package/dist/allocations-quota-details.scss +451 -0
  3. package/dist/allocations.scss +112 -0
  4. package/dist/builder.js +1 -1
  5. package/dist/hotspot.scss +1 -1
  6. package/dist/language-selector.scss +4 -4
  7. package/dist/login.scss +49 -9
  8. package/dist/order-status.scss +228 -136
  9. package/dist/repeater-item.scss +2 -2
  10. package/dist/request-for-quotes.scss +1 -1
  11. package/dist/types/builder/tools/element-edit/cartSummary.d.ts +187 -0
  12. package/dist/types/builder/tools/element-edit/icon-list.d.ts +22 -0
  13. package/dist/types/builder/tools/element-edit/language-menu.d.ts +0 -1
  14. package/dist/types/builder/tools/element-edit/orderStatus.d.ts +320 -187
  15. package/dist/types/builder/tools/element-edit/userElements.d.ts +192 -7
  16. package/dist/user-elements.scss +253 -221
  17. package/package.json +1 -1
package/dist/allocationDetails.scss CHANGED
@@ -1,4 +1,4 @@
1
- @use "sass:map";
1
+ @use "sass:map";
2
2
  @use "sass:list";
3
3
  @use "./functions.scss" as *;
4
4
  $overflowSelector: ".flex__overflow";
@@ -12,7 +12,7 @@ $defaultValues: (
12
12
  );
13
13
  // ---------------------------------------------------------------------------
14
14
  // Tree view (Allocations View = "Tree"). Generated CSS-var bases for
15
- // design.sidebarDesign.* — the path shortcodes come from splitCamelCaseAndJoin.
15
+ // design.sidebarDesign.* — the path shortcodes come from splitCamelCaseAndJoin.
16
16
  // The rules below are the Category Groups sidebar rules, kept deliberately
17
17
  // identical so the two trees look and behave the same; only the var bases and
18
18
  // class prefix differ.
@@ -1350,248 +1350,9 @@ $ad-widget: "--_ctm-dn-wt-se"; // design.widgetStyle (divider)
1350
1350
  }
1351
1351
  }
1352
1352
 
1353
- .quota__details__element {
1354
- background-color: var(
1355
- --_ctm-mob-dn-qa-ds-wt-se-bd-cr,
1356
- var(--_ctm-tab-dn-qa-ds-wt-se-bd-cr, var(--_ctm-dn-qa-ds-wt-se-bd-cr))
1357
- );
1358
- padding: var(
1359
- --_ctm-mob-dn-qa-ds-wt-se-pg,
1360
- var(--_ctm-tab-dn-qa-ds-wt-se-pg, var(--_ctm-dn-qa-ds-wt-se-pg))
1361
- );
1362
- display: flex;
1363
- flex-direction: column;
1364
- --_sf-gp: var(
1365
- --_ctm-mob-dn-qa-ds-wt-se-im-sg,
1366
- var(
1367
- --_ctm-tab-dn-qa-ds-wt-se-im-sg,
1368
- var(--_ctm-dn-qa-ds-wt-se-im-sg, var(--_ctm-dn-qa-ds-wt-se-im-sg), 16px)
1369
- )
1370
- );
1371
- --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
1372
- row-gap: var(--_sf-gp);
1373
- width: 100%;
1374
- height: 100%;
1375
- border-color: var(
1376
- --_ctm-mob-dn-qa-ds-wt-se-br-cr,
1377
- var(--_ctm-tab-dn-qa-ds-wt-se-br-cr, var(--_ctm-dn-qa-ds-wt-se-br-cr))
1378
- );
1379
- border-style: var(
1380
- --_ctm-mob-dn-qa-ds-wt-se-br-se,
1381
- var(--_ctm-tab-dn-qa-ds-wt-se-br-se, var(--_ctm-dn-qa-ds-wt-se-br-se))
1382
- );
1383
- border-width: var(
1384
- --_ctm-mob-dn-qa-ds-wt-se-br-wh,
1385
- var(--_ctm-tab-dn-qa-ds-wt-se-br-wh, var(--_ctm-dn-qa-ds-wt-se-br-wh))
1386
- );
1387
- border-radius: var(
1388
- --_ctm-mob-dn-qa-ds-wt-se-br-rs,
1389
- var(--_ctm-tab-dn-qa-ds-wt-se-br-rs, var(--_ctm-dn-qa-ds-wt-se-br-rs))
1390
- );
1391
- box-shadow: var(
1392
- --_show-shadow,
1393
- var(
1394
- --_ctm-mob-dn-qa-ds-wt-se-sw-ae,
1395
- var(--_ctm-tab-dn-qa-ds-wt-se-sw-ae, var(--_ctm-dn-qa-ds-wt-se-sw-ae))
1396
- )
1397
- var(
1398
- --_ctm-mob-dn-qa-ds-wt-se-sw-br,
1399
- var(--_ctm-tab-dn-qa-ds-wt-se-sw-br, var(--_ctm-dn-qa-ds-wt-se-sw-br))
1400
- )
1401
- var(
1402
- --_ctm-mob-dn-qa-ds-wt-se-sw-sd,
1403
- var(--_ctm-tab-dn-qa-ds-wt-se-sw-sd, var(--_ctm-dn-qa-ds-wt-se-sw-sd))
1404
- )
1405
- var(
1406
- --_ctm-mob-dn-qa-ds-wt-se-sw-cr,
1407
- var(--_ctm-tab-dn-qa-ds-wt-se-sw-cr, var(--_ctm-dn-qa-ds-wt-se-sw-cr))
1408
- )
1409
- );
1410
-
1411
- .product__hilights {
1412
- display: flex;
1413
- align-items: var(
1414
- --_ctm-mob-dn-qa-ds-wt-se-wt-at,
1415
- var(--_ctm-tab-dn-qa-ds-wt-se-wt-at, var(--_ctm-dn-qa-ds-wt-se-wt-at))
1416
- );
1417
- justify-content: var(
1418
- --_ctm-mob-dn-qa-ds-wt-se-hl-at,
1419
- var(--_ctm-tab-dn-qa-ds-wt-se-hl-at, var(--_ctm-dn-qa-ds-wt-se-hl-at))
1420
- );
1421
- gap: var(
1422
- --_ctm-mob-dn-qa-ds-wt-se-im-sg,
1423
- var(--_ctm-tab-dn-qa-ds-wt-se-im-sg, var(--_ctm-dn-qa-ds-wt-se-im-sg))
1424
- );
1425
- width: 100%;
1426
-
1427
- height: 100%;
1428
-
1429
- &[data-show-dividers="true"] {
1430
- .product__list__item {
1431
- position: relative;
1432
- &:not(:last-child)::after {
1433
- content: "";
1434
- width: var(
1435
- --_ctm-mob-dn-qa-ds-dr-dr-wh,
1436
- var(--_ctm-tab-dn-qa-ds-dr-dr-wh, var(--_ctm-dn-qa-ds-dr-dr-wh))
1437
- );
1438
- height: 100%;
1439
- position: absolute;
1440
- right: calc(
1441
- (
1442
- -1 *
1443
- var(
1444
- --_ctm-mob-dn-qa-ds-wt-se-im-sg,
1445
- var(--_ctm-tab-dn-qa-ds-wt-se-im-sg, var(--_ctm-dn-qa-ds-wt-se-im-sg))
1446
- ) /
1447
- 2
1448
- ) -
1449
- (
1450
- var(
1451
- --_ctm-mob-dn-qa-ds-dr-dr-wh,
1452
- var(--_ctm-tab-dn-qa-ds-dr-dr-wh, var(--_ctm-dn-qa-ds-dr-dr-wh))
1453
- ) /
1454
- 2
1455
- )
1456
- );
1457
- background-color: var(
1458
- --_ctm-mob-dn-qa-ds-dr-dr-cr,
1459
- var(--_ctm-tab-dn-qa-ds-dr-dr-cr, var(--_ctm-dn-qa-ds-dr-dr-cr))
1460
- );
1461
- }
1462
- }
1463
- }
1464
- .product__list__item {
1465
- display: flex;
1466
- align-items: center;
1467
- gap: 4px;
1468
-
1469
- .svg_icon {
1470
- display: flex;
1471
- }
1472
- }
1473
- .quota__left {
1474
- .count {
1475
- // padding-inline: var(--_sf-cd-gp);
1476
- color: var(
1477
- --_ctm-mob-dn-qa-ds-qa-lt-cr,
1478
- var(--_ctm-tab-dn-qa-ds-qa-lt-cr, var(--_ctm-dn-qa-ds-qa-lt-cr))
1479
- );
1480
- font-family: var(
1481
- --_ctm-mob-dn-qa-ds-qa-lt-ft-fy,
1482
- var(--_ctm-tab-dn-qa-ds-qa-lt-ft-fy, var(--_ctm-dn-qa-ds-qa-lt-ft-fy))
1483
- );
1484
- font-size: var(
1485
- --_ctm-mob-dn-qa-ds-qa-lt-ft-se,
1486
- var(--_ctm-tab-dn-qa-ds-qa-lt-ft-se, var(--_ctm-dn-qa-ds-qa-lt-ft-se))
1487
- );
1488
- font-weight: var(
1489
- --_ctm-mob-dn-qa-ds-qa-lt-ft-wt,
1490
- var(--_ctm-tab-dn-qa-ds-qa-lt-ft-wt, var(--_ctm-dn-qa-ds-qa-lt-ft-wt))
1491
- );
1492
- font-style: var(
1493
- --_ctm-mob-dn-qa-ds-qa-lt-ft-se-ic,
1494
- var(--_ctm-tab-dn-qa-ds-qa-lt-ft-se-ic, var(--_ctm-dn-qa-ds-qa-lt-ft-se-ic))
1495
- );
1496
- text-align: var(
1497
- --_ctm-mob-dn-qa-ds-qa-lt-tt-an,
1498
- var(--_ctm-tab-dn-qa-ds-qa-lt-tt-an, var(--_ctm-dn-qa-ds-qa-lt-tt-an))
1499
- );
1500
- letter-spacing: var(
1501
- --_ctm-mob-dn-qa-ds-qa-lt-lr-sg,
1502
- var(--_ctm-tab-dn-qa-ds-qa-lt-lr-sg, var(--_ctm-dn-qa-ds-qa-lt-lr-sg))
1503
- );
1504
- line-height: var(
1505
- --_ctm-mob-dn-qa-ds-qa-lt-le-ht,
1506
- var(--_ctm-tab-dn-qa-ds-qa-lt-le-ht, var(--_ctm-dn-qa-ds-qa-lt-le-ht-dc))
1507
- );
1508
- text-decoration: var(
1509
- --_ctm-mob-dn-qa-ds-qa-lt-ue,
1510
- var(--_ctm-tab-dn-qa-ds-qa-lt-ue, var(--_ctm-dn-qa-ds-qa-lt-ue))
1511
- );
1512
- }
1513
- .icon {
1514
- display: var(--_sf-show-icon-ff, flex);
1515
- svg {
1516
- width: var(
1517
- --_ctm-mab-dn-qa-lt-in-se,
1518
- var(--_ctm-tab-dn-qa-ds-qa-lt-in-se, var(--_ctm-dn-qa-ds-qa-lt-in-se))
1519
- );
1520
- height: var(
1521
- --_ctm-mob-dn-qa-ds-qa-lt-in-se,
1522
- var(--_ctm-tab-dn-qa-ds-qa-lt-in-se, var(--_ctm-dn-qa-ds-qa-lt-in-se))
1523
- );
1524
- path {
1525
- stroke: var(
1526
- --_ctm-mob-dn-qa-ds-qa-lt-in-c1,
1527
- var(--_ctm-tab-dn-qa-ds-qa-lt-in-c1, var(--_ctm-dn-qa-ds-qa-lt-in-c1))
1528
- );
1529
- }
1530
- }
1531
- }
1532
- }
1533
- .days__left {
1534
- .count {
1535
- // padding-inline: var(--_sf-cd-gp);
1536
- color: var(
1537
- --_ctm-mob-dn-qa-ds-ds-lt-cr,
1538
- var(--_ctm-tab-dn-qa-ds-ds-lt-cr, var(--_ctm-dn-qa-ds-ds-lt-cr))
1539
- );
1540
- font-family: var(
1541
- --_ctm-mob-dn-qa-ds-ds-lt-ft-fy,
1542
- var(--_ctm-tab-dn-qa-ds-ds-lt-ft-fy, var(--_ctm-dn-qa-ds-ds-lt-ft-fy))
1543
- );
1544
- font-size: var(
1545
- --_ctm-mob-dn-qa-ds-ds-lt-ft-se,
1546
- var(--_ctm-tab-dn-qa-ds-ds-lt-ft-se, var(--_ctm-dn-qa-ds-ds-lt-ft-se))
1547
- );
1548
- font-weight: var(
1549
- --_ctm-mob-dn-qa-ds-ds-lt-ft-wt,
1550
- var(--_ctm-tab-dn-qa-ds-ds-lt-ft-wt, var(--_ctm-dn-qa-ds-ds-lt-ft-wt))
1551
- );
1552
- font-style: var(
1553
- --_ctm-mob-dn-qa-ds-ds-lt-ft-se-ic,
1554
- var(--_ctm-tab-dn-qa-ds-ds-lt-ft-se-ic, var(--_ctm-dn-qa-ds-ds-lt-ft-se-ic))
1555
- );
1556
- text-align: var(
1557
- --_ctm-mob-dn-qa-ds-ds-lt-tt-an,
1558
- var(--_ctm-tab-dn-qa-ds-ds-lt-tt-an, var(--_ctm-dn-qa-ds-ds-lt-tt-an))
1559
- );
1560
- letter-spacing: var(
1561
- --_ctm-mob-dn-qa-ds-ds-lt-lr-sg,
1562
- var(--_ctm-tab-dn-qa-ds-ds-lt-lr-sg, var(--_ctm-dn-qa-ds-ds-lt-lr-sg))
1563
- );
1564
- line-height: var(
1565
- --_ctm-mob-dn-qa-ds-ds-lt-le-ht,
1566
- var(--_ctm-tab-dn-qa-ds-ds-lt-le-ht, var(--_ctm-dn-qa-ds-ds-lt-le-ht-dc))
1567
- );
1568
- text-decoration: var(
1569
- --_ctm-mob-dn-qa-ds-ds-lt-ue,
1570
- var(--_ctm-tab-dn-qa-ds-ds-lt-ue, var(--_ctm-dn-qa-ds-ds-lt-ue))
1571
- );
1572
- }
1573
- .icon {
1574
- display: var(--_sf-show-icon-ff, flex);
1575
- svg {
1576
- width: var(
1577
- --_ctm-mab-dn-ds-lt-in-se,
1578
- var(--_ctm-tab-dn-qa-ds-ds-lt-in-se, var(--_ctm-dn-qa-ds-ds-lt-in-se))
1579
- );
1580
- height: var(
1581
- --_ctm-mob-dn-qa-ds-ds-lt-in-se,
1582
- var(--_ctm-tab-dn-qa-ds-ds-lt-in-se, var(--_ctm-dn-qa-ds-ds-lt-in-se))
1583
- );
1584
- path {
1585
- stroke: var(
1586
- --_ctm-mob-dn-qa-ds-ds-lt-in-c1,
1587
- var(--_ctm-tab-dn-qa-ds-ds-lt-in-c1, var(--_ctm-dn-qa-ds-ds-lt-in-c1))
1588
- );
1589
- }
1590
- }
1591
- }
1592
- }
1593
- }
1594
- }
1353
+ // Quota details styling for the embedded QuotaDetailsContent, rebound to
1354
+ // the Allocations quotaDetails CSS-variable paths.
1355
+ @import "./allocations-quota-details.scss";
1595
1356
  }
1596
1357
  }
1597
1358
 
@@ -2432,7 +2193,7 @@ $ad-widget: "--_ctm-dn-wt-se"; // design.widgetStyle (divider)
2432
2193
  .ad_sidebar {
2433
2194
  display: flex;
2434
2195
  flex-direction: column;
2435
- // Sidebar Container → gap (heading ↔ tree) + padding.
2196
+ // Sidebar Container → gap (heading ↔ tree) + padding.
2436
2197
  gap: prepareMediaVariable(#{$ad-sidebar}-im-gp, 12px);
2437
2198
  padding: prepareMediaVariable(#{$ad-sidebar}-pg, 0);
2438
2199
  width: 260px;
@@ -2452,7 +2213,7 @@ $ad-widget: "--_ctm-dn-wt-se"; // design.widgetStyle (divider)
2452
2213
  .ad_allocation_tree {
2453
2214
  display: flex;
2454
2215
  flex-direction: column;
2455
- // Gap BETWEEN profile rows (Sidebar Container → Profile Gap).
2216
+ // Gap BETWEEN profile rows (Sidebar Container → Profile Gap).
2456
2217
  gap: prepareMediaVariable(#{$ad-sidebar}-pe-gp, 8px);
2457
2218
  width: 100%;
2458
2219
  }
@@ -2460,7 +2221,7 @@ $ad-widget: "--_ctm-dn-wt-se"; // design.widgetStyle (divider)
2460
2221
  .ad_tree_node {
2461
2222
  display: flex;
2462
2223
  align-items: center;
2463
- // Profile Row → item gap (icon ↔ label).
2224
+ // Profile Row → item gap (icon ↔ label).
2464
2225
  gap: prepareMediaVariable(#{$ad-tree}-dt-se-im-gp, 4px);
2465
2226
  padding: prepareMediaVariable(#{$ad-tree}-dt-se-pg, 4px 0);
2466
2227
  cursor: pointer;
@@ -2544,7 +2305,7 @@ $ad-widget: "--_ctm-dn-wt-se"; // design.widgetStyle (divider)
2544
2305
  .ad_subtree {
2545
2306
  display: flex;
2546
2307
  flex-direction: column;
2547
- // Gap BETWEEN allocation rows (Sidebar Container → Allocation Gap).
2308
+ // Gap BETWEEN allocation rows (Sidebar Container → Allocation Gap).
2548
2309
  gap: prepareMediaVariable(#{$ad-sidebar}-an-gp, 8px);
2549
2310
  padding-left: 31px;
2550
2311
  width: 100%;