@asantemedia-org/edwardsvacuum-design-system 1.6.27 → 1.6.28
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.css +98 -22
- package/dist/index.esm.css +98 -22
- package/dist/index.esm.js +11 -7
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +39 -42
- package/dist/index.js.map +1 -1
- package/dist/index.scss +98 -22
- package/dist/src/stories/experiences/QRFormJourney/FormFieldType.d.ts +4 -1
- package/dist/src/stories/experiences/QRFormJourney/Qr-form/Qr-form.d.ts +1 -0
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
package/dist/index.css
CHANGED
|
@@ -1376,6 +1376,26 @@
|
|
|
1376
1376
|
word-wrap: break-word;
|
|
1377
1377
|
}
|
|
1378
1378
|
|
|
1379
|
+
.qr-journey-form-wrapper .disabled-product-fields-section h2:before, .qr-journey-form-wrapper .qr-form-filed-wrapper.info:before {
|
|
1380
|
+
content: "i";
|
|
1381
|
+
left: 0;
|
|
1382
|
+
top: 5px;
|
|
1383
|
+
background-color: rgb(172, 174, 176);
|
|
1384
|
+
text-align: center;
|
|
1385
|
+
width: 23px;
|
|
1386
|
+
height: 23px;
|
|
1387
|
+
color: white;
|
|
1388
|
+
line-height: 1.5em;
|
|
1389
|
+
font-weight: 100;
|
|
1390
|
+
font-size: 16px;
|
|
1391
|
+
border-radius: 50%;
|
|
1392
|
+
position: absolute;
|
|
1393
|
+
}
|
|
1394
|
+
|
|
1395
|
+
.qr-journey-form-wrapper * {
|
|
1396
|
+
font-family: "Calibri", sans-serif;
|
|
1397
|
+
font-size: 16px;
|
|
1398
|
+
}
|
|
1379
1399
|
.qr-journey-form-wrapper h1 {
|
|
1380
1400
|
font-size: 24px;
|
|
1381
1401
|
font-family: "Calibri W05 Light", "Calibri", sans-serif;
|
|
@@ -1398,7 +1418,7 @@
|
|
|
1398
1418
|
font-family: "Calibri", sans-serif;
|
|
1399
1419
|
font-weight: 700;
|
|
1400
1420
|
line-height: 1.6em;
|
|
1401
|
-
color:
|
|
1421
|
+
color: #2d363a;
|
|
1402
1422
|
}
|
|
1403
1423
|
.qr-journey-form-wrapper .qr-form-page {
|
|
1404
1424
|
display: none;
|
|
@@ -1456,6 +1476,42 @@
|
|
|
1456
1476
|
.qr-journey-form-wrapper .qr-form-filed-wrapper {
|
|
1457
1477
|
display: flex;
|
|
1458
1478
|
flex-flow: column;
|
|
1479
|
+
position: relative;
|
|
1480
|
+
}
|
|
1481
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper.disabled label > .label {
|
|
1482
|
+
left: 0;
|
|
1483
|
+
top: 0;
|
|
1484
|
+
color: rgb(87, 94, 97);
|
|
1485
|
+
font-weight: 700;
|
|
1486
|
+
font-size: 16px;
|
|
1487
|
+
line-height: 100%;
|
|
1488
|
+
letter-spacing: -1.7%;
|
|
1489
|
+
}
|
|
1490
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper.checkbox, .qr-journey-form-wrapper .qr-form-filed-wrapper.info {
|
|
1491
|
+
padding-bottom: 1em;
|
|
1492
|
+
}
|
|
1493
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper.checkbox label, .qr-journey-form-wrapper .qr-form-filed-wrapper.info label {
|
|
1494
|
+
display: block;
|
|
1495
|
+
}
|
|
1496
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper.checkbox label .label, .qr-journey-form-wrapper .qr-form-filed-wrapper.info label .label {
|
|
1497
|
+
display: block;
|
|
1498
|
+
padding-left: 25px;
|
|
1499
|
+
border-radius: 0;
|
|
1500
|
+
font-size: 16px;
|
|
1501
|
+
top: 0;
|
|
1502
|
+
line-height: 1.5em;
|
|
1503
|
+
color: rgb(87, 94, 97);
|
|
1504
|
+
}
|
|
1505
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper.checkbox label input, .qr-journey-form-wrapper .qr-form-filed-wrapper.info label input {
|
|
1506
|
+
position: absolute;
|
|
1507
|
+
top: 0;
|
|
1508
|
+
left: 0;
|
|
1509
|
+
width: 1.5em;
|
|
1510
|
+
height: 1.5em;
|
|
1511
|
+
margin: 0;
|
|
1512
|
+
}
|
|
1513
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper.checkbox .formfield-error, .qr-journey-form-wrapper .qr-form-filed-wrapper.info .formfield-error {
|
|
1514
|
+
padding-left: 35px;
|
|
1459
1515
|
}
|
|
1460
1516
|
.qr-journey-form-wrapper .qr-form-filed-wrapper label {
|
|
1461
1517
|
display: flex;
|
|
@@ -1470,7 +1526,7 @@
|
|
|
1470
1526
|
}
|
|
1471
1527
|
.qr-journey-form-wrapper .qr-form-filed-wrapper label input[type=text], .qr-journey-form-wrapper .qr-form-filed-wrapper label input[type=email], .qr-journey-form-wrapper .qr-form-filed-wrapper label input[type=number], .qr-journey-form-wrapper .qr-form-filed-wrapper label input[type=tel], .qr-journey-form-wrapper .qr-form-filed-wrapper label select[type=text], .qr-journey-form-wrapper .qr-form-filed-wrapper label select[type=email], .qr-journey-form-wrapper .qr-form-filed-wrapper label select[type=number], .qr-journey-form-wrapper .qr-form-filed-wrapper label select[type=tel], .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea[type=text], .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea[type=email], .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea[type=number], .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea[type=tel] {
|
|
1472
1528
|
line-height: 1em;
|
|
1473
|
-
padding:
|
|
1529
|
+
padding: 10px 18px 10px 18px;
|
|
1474
1530
|
box-sizing: content-box;
|
|
1475
1531
|
}
|
|
1476
1532
|
.qr-journey-form-wrapper .qr-form-filed-wrapper label input:active, .qr-journey-form-wrapper .qr-form-filed-wrapper label input:focus, .qr-journey-form-wrapper .qr-form-filed-wrapper label input:focus-visible, .qr-journey-form-wrapper .qr-form-filed-wrapper label select:active, .qr-journey-form-wrapper .qr-form-filed-wrapper label select:focus, .qr-journey-form-wrapper .qr-form-filed-wrapper label select:focus-visible, .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea:active, .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea:focus, .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea:focus-visible {
|
|
@@ -1479,50 +1535,70 @@
|
|
|
1479
1535
|
}
|
|
1480
1536
|
.qr-journey-form-wrapper .qr-form-filed-wrapper label select, .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea {
|
|
1481
1537
|
line-height: 1em;
|
|
1482
|
-
padding:
|
|
1538
|
+
padding: 10px 18px 10px 18px;
|
|
1483
1539
|
box-sizing: content-box;
|
|
1484
1540
|
}
|
|
1541
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper label select {
|
|
1542
|
+
padding: 10px 18px 10px 18px;
|
|
1543
|
+
position: relative;
|
|
1544
|
+
}
|
|
1545
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper label select + .select-custom-arrow {
|
|
1546
|
+
height: calc(100% - 1em - 4px);
|
|
1547
|
+
top: 2px;
|
|
1548
|
+
position: absolute;
|
|
1549
|
+
width: 17px;
|
|
1550
|
+
right: 2px;
|
|
1551
|
+
background-color: #FFFFFF;
|
|
1552
|
+
}
|
|
1553
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper label select + .select-custom-arrow:after, .qr-journey-form-wrapper .qr-form-filed-wrapper label select + .select-custom-arrow:before {
|
|
1554
|
+
content: "";
|
|
1555
|
+
border-color: transparent;
|
|
1556
|
+
border-width: 4px;
|
|
1557
|
+
border-style: solid;
|
|
1558
|
+
position: absolute;
|
|
1559
|
+
bottom: 0;
|
|
1560
|
+
height: 0;
|
|
1561
|
+
margin: auto;
|
|
1562
|
+
left: 0;
|
|
1563
|
+
width: 0;
|
|
1564
|
+
pointer-events: none;
|
|
1565
|
+
}
|
|
1566
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper label select + .select-custom-arrow:before {
|
|
1567
|
+
top: 11px;
|
|
1568
|
+
border-top-color: rgb(87, 94, 97);
|
|
1569
|
+
}
|
|
1570
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper label select + .select-custom-arrow:after {
|
|
1571
|
+
top: -11px;
|
|
1572
|
+
border-bottom-color: rgb(87, 94, 97);
|
|
1573
|
+
}
|
|
1485
1574
|
.qr-journey-form-wrapper .qr-form-filed-wrapper label > .label {
|
|
1575
|
+
display: none;
|
|
1486
1576
|
position: relative;
|
|
1487
1577
|
top: 10px;
|
|
1488
|
-
left: 10px;
|
|
1489
1578
|
font-size: 12px;
|
|
1490
1579
|
line-height: 0;
|
|
1580
|
+
left: 10px;
|
|
1491
1581
|
}
|
|
1492
1582
|
.qr-journey-form-wrapper .qr-form-filed-wrapper.error label input {
|
|
1493
1583
|
border: 2px solid rgb(196, 38, 46);
|
|
1494
1584
|
}
|
|
1495
1585
|
.qr-journey-form-wrapper .qr-form-filed-wrapper.error .formfield-error {
|
|
1496
1586
|
position: relative;
|
|
1587
|
+
color: rgb(196, 38, 46);
|
|
1497
1588
|
top: -10px;
|
|
1498
|
-
font-size:
|
|
1589
|
+
font-size: 12px;
|
|
1499
1590
|
line-height: 18px;
|
|
1500
1591
|
}
|
|
1501
1592
|
.qr-journey-form-wrapper .disabled-product-fields-section {
|
|
1502
|
-
background-color: rgb(
|
|
1593
|
+
background-color: rgb(243, 243, 243);
|
|
1503
1594
|
padding: 5px 18px;
|
|
1504
1595
|
margin: 1em 0;
|
|
1505
1596
|
}
|
|
1506
1597
|
.qr-journey-form-wrapper .disabled-product-fields-section h2 {
|
|
1507
|
-
color:
|
|
1598
|
+
color: rgb(87, 94, 97);
|
|
1508
1599
|
padding-left: 1.5em;
|
|
1509
1600
|
position: relative;
|
|
1510
1601
|
}
|
|
1511
|
-
.qr-journey-form-wrapper .disabled-product-fields-section h2:before {
|
|
1512
|
-
content: "i";
|
|
1513
|
-
left: 0;
|
|
1514
|
-
top: 5px;
|
|
1515
|
-
background-color: #2d363a;
|
|
1516
|
-
text-align: center;
|
|
1517
|
-
width: 23px;
|
|
1518
|
-
height: 23px;
|
|
1519
|
-
color: white;
|
|
1520
|
-
line-height: 1.5em;
|
|
1521
|
-
font-weight: 100;
|
|
1522
|
-
font-size: 16px;
|
|
1523
|
-
border-radius: 50%;
|
|
1524
|
-
position: absolute;
|
|
1525
|
-
}
|
|
1526
1602
|
.qr-journey-form-wrapper .disabled-product-fields-section .qr-form-fields {
|
|
1527
1603
|
display: flex;
|
|
1528
1604
|
flex-wrap: wrap;
|
package/dist/index.esm.css
CHANGED
|
@@ -1376,6 +1376,26 @@
|
|
|
1376
1376
|
word-wrap: break-word;
|
|
1377
1377
|
}
|
|
1378
1378
|
|
|
1379
|
+
.qr-journey-form-wrapper .disabled-product-fields-section h2:before, .qr-journey-form-wrapper .qr-form-filed-wrapper.info:before {
|
|
1380
|
+
content: "i";
|
|
1381
|
+
left: 0;
|
|
1382
|
+
top: 5px;
|
|
1383
|
+
background-color: rgb(172, 174, 176);
|
|
1384
|
+
text-align: center;
|
|
1385
|
+
width: 23px;
|
|
1386
|
+
height: 23px;
|
|
1387
|
+
color: white;
|
|
1388
|
+
line-height: 1.5em;
|
|
1389
|
+
font-weight: 100;
|
|
1390
|
+
font-size: 16px;
|
|
1391
|
+
border-radius: 50%;
|
|
1392
|
+
position: absolute;
|
|
1393
|
+
}
|
|
1394
|
+
|
|
1395
|
+
.qr-journey-form-wrapper * {
|
|
1396
|
+
font-family: "Calibri", sans-serif;
|
|
1397
|
+
font-size: 16px;
|
|
1398
|
+
}
|
|
1379
1399
|
.qr-journey-form-wrapper h1 {
|
|
1380
1400
|
font-size: 24px;
|
|
1381
1401
|
font-family: "Calibri W05 Light", "Calibri", sans-serif;
|
|
@@ -1398,7 +1418,7 @@
|
|
|
1398
1418
|
font-family: "Calibri", sans-serif;
|
|
1399
1419
|
font-weight: 700;
|
|
1400
1420
|
line-height: 1.6em;
|
|
1401
|
-
color:
|
|
1421
|
+
color: #2d363a;
|
|
1402
1422
|
}
|
|
1403
1423
|
.qr-journey-form-wrapper .qr-form-page {
|
|
1404
1424
|
display: none;
|
|
@@ -1456,6 +1476,42 @@
|
|
|
1456
1476
|
.qr-journey-form-wrapper .qr-form-filed-wrapper {
|
|
1457
1477
|
display: flex;
|
|
1458
1478
|
flex-flow: column;
|
|
1479
|
+
position: relative;
|
|
1480
|
+
}
|
|
1481
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper.disabled label > .label {
|
|
1482
|
+
left: 0;
|
|
1483
|
+
top: 0;
|
|
1484
|
+
color: rgb(87, 94, 97);
|
|
1485
|
+
font-weight: 700;
|
|
1486
|
+
font-size: 16px;
|
|
1487
|
+
line-height: 100%;
|
|
1488
|
+
letter-spacing: -1.7%;
|
|
1489
|
+
}
|
|
1490
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper.checkbox, .qr-journey-form-wrapper .qr-form-filed-wrapper.info {
|
|
1491
|
+
padding-bottom: 1em;
|
|
1492
|
+
}
|
|
1493
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper.checkbox label, .qr-journey-form-wrapper .qr-form-filed-wrapper.info label {
|
|
1494
|
+
display: block;
|
|
1495
|
+
}
|
|
1496
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper.checkbox label .label, .qr-journey-form-wrapper .qr-form-filed-wrapper.info label .label {
|
|
1497
|
+
display: block;
|
|
1498
|
+
padding-left: 25px;
|
|
1499
|
+
border-radius: 0;
|
|
1500
|
+
font-size: 16px;
|
|
1501
|
+
top: 0;
|
|
1502
|
+
line-height: 1.5em;
|
|
1503
|
+
color: rgb(87, 94, 97);
|
|
1504
|
+
}
|
|
1505
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper.checkbox label input, .qr-journey-form-wrapper .qr-form-filed-wrapper.info label input {
|
|
1506
|
+
position: absolute;
|
|
1507
|
+
top: 0;
|
|
1508
|
+
left: 0;
|
|
1509
|
+
width: 1.5em;
|
|
1510
|
+
height: 1.5em;
|
|
1511
|
+
margin: 0;
|
|
1512
|
+
}
|
|
1513
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper.checkbox .formfield-error, .qr-journey-form-wrapper .qr-form-filed-wrapper.info .formfield-error {
|
|
1514
|
+
padding-left: 35px;
|
|
1459
1515
|
}
|
|
1460
1516
|
.qr-journey-form-wrapper .qr-form-filed-wrapper label {
|
|
1461
1517
|
display: flex;
|
|
@@ -1470,7 +1526,7 @@
|
|
|
1470
1526
|
}
|
|
1471
1527
|
.qr-journey-form-wrapper .qr-form-filed-wrapper label input[type=text], .qr-journey-form-wrapper .qr-form-filed-wrapper label input[type=email], .qr-journey-form-wrapper .qr-form-filed-wrapper label input[type=number], .qr-journey-form-wrapper .qr-form-filed-wrapper label input[type=tel], .qr-journey-form-wrapper .qr-form-filed-wrapper label select[type=text], .qr-journey-form-wrapper .qr-form-filed-wrapper label select[type=email], .qr-journey-form-wrapper .qr-form-filed-wrapper label select[type=number], .qr-journey-form-wrapper .qr-form-filed-wrapper label select[type=tel], .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea[type=text], .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea[type=email], .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea[type=number], .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea[type=tel] {
|
|
1472
1528
|
line-height: 1em;
|
|
1473
|
-
padding:
|
|
1529
|
+
padding: 10px 18px 10px 18px;
|
|
1474
1530
|
box-sizing: content-box;
|
|
1475
1531
|
}
|
|
1476
1532
|
.qr-journey-form-wrapper .qr-form-filed-wrapper label input:active, .qr-journey-form-wrapper .qr-form-filed-wrapper label input:focus, .qr-journey-form-wrapper .qr-form-filed-wrapper label input:focus-visible, .qr-journey-form-wrapper .qr-form-filed-wrapper label select:active, .qr-journey-form-wrapper .qr-form-filed-wrapper label select:focus, .qr-journey-form-wrapper .qr-form-filed-wrapper label select:focus-visible, .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea:active, .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea:focus, .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea:focus-visible {
|
|
@@ -1479,50 +1535,70 @@
|
|
|
1479
1535
|
}
|
|
1480
1536
|
.qr-journey-form-wrapper .qr-form-filed-wrapper label select, .qr-journey-form-wrapper .qr-form-filed-wrapper label textarea {
|
|
1481
1537
|
line-height: 1em;
|
|
1482
|
-
padding:
|
|
1538
|
+
padding: 10px 18px 10px 18px;
|
|
1483
1539
|
box-sizing: content-box;
|
|
1484
1540
|
}
|
|
1541
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper label select {
|
|
1542
|
+
padding: 10px 18px 10px 18px;
|
|
1543
|
+
position: relative;
|
|
1544
|
+
}
|
|
1545
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper label select + .select-custom-arrow {
|
|
1546
|
+
height: calc(100% - 1em - 4px);
|
|
1547
|
+
top: 2px;
|
|
1548
|
+
position: absolute;
|
|
1549
|
+
width: 17px;
|
|
1550
|
+
right: 2px;
|
|
1551
|
+
background-color: #FFFFFF;
|
|
1552
|
+
}
|
|
1553
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper label select + .select-custom-arrow:after, .qr-journey-form-wrapper .qr-form-filed-wrapper label select + .select-custom-arrow:before {
|
|
1554
|
+
content: "";
|
|
1555
|
+
border-color: transparent;
|
|
1556
|
+
border-width: 4px;
|
|
1557
|
+
border-style: solid;
|
|
1558
|
+
position: absolute;
|
|
1559
|
+
bottom: 0;
|
|
1560
|
+
height: 0;
|
|
1561
|
+
margin: auto;
|
|
1562
|
+
left: 0;
|
|
1563
|
+
width: 0;
|
|
1564
|
+
pointer-events: none;
|
|
1565
|
+
}
|
|
1566
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper label select + .select-custom-arrow:before {
|
|
1567
|
+
top: 11px;
|
|
1568
|
+
border-top-color: rgb(87, 94, 97);
|
|
1569
|
+
}
|
|
1570
|
+
.qr-journey-form-wrapper .qr-form-filed-wrapper label select + .select-custom-arrow:after {
|
|
1571
|
+
top: -11px;
|
|
1572
|
+
border-bottom-color: rgb(87, 94, 97);
|
|
1573
|
+
}
|
|
1485
1574
|
.qr-journey-form-wrapper .qr-form-filed-wrapper label > .label {
|
|
1575
|
+
display: none;
|
|
1486
1576
|
position: relative;
|
|
1487
1577
|
top: 10px;
|
|
1488
|
-
left: 10px;
|
|
1489
1578
|
font-size: 12px;
|
|
1490
1579
|
line-height: 0;
|
|
1580
|
+
left: 10px;
|
|
1491
1581
|
}
|
|
1492
1582
|
.qr-journey-form-wrapper .qr-form-filed-wrapper.error label input {
|
|
1493
1583
|
border: 2px solid rgb(196, 38, 46);
|
|
1494
1584
|
}
|
|
1495
1585
|
.qr-journey-form-wrapper .qr-form-filed-wrapper.error .formfield-error {
|
|
1496
1586
|
position: relative;
|
|
1587
|
+
color: rgb(196, 38, 46);
|
|
1497
1588
|
top: -10px;
|
|
1498
|
-
font-size:
|
|
1589
|
+
font-size: 12px;
|
|
1499
1590
|
line-height: 18px;
|
|
1500
1591
|
}
|
|
1501
1592
|
.qr-journey-form-wrapper .disabled-product-fields-section {
|
|
1502
|
-
background-color: rgb(
|
|
1593
|
+
background-color: rgb(243, 243, 243);
|
|
1503
1594
|
padding: 5px 18px;
|
|
1504
1595
|
margin: 1em 0;
|
|
1505
1596
|
}
|
|
1506
1597
|
.qr-journey-form-wrapper .disabled-product-fields-section h2 {
|
|
1507
|
-
color:
|
|
1598
|
+
color: rgb(87, 94, 97);
|
|
1508
1599
|
padding-left: 1.5em;
|
|
1509
1600
|
position: relative;
|
|
1510
1601
|
}
|
|
1511
|
-
.qr-journey-form-wrapper .disabled-product-fields-section h2:before {
|
|
1512
|
-
content: "i";
|
|
1513
|
-
left: 0;
|
|
1514
|
-
top: 5px;
|
|
1515
|
-
background-color: #2d363a;
|
|
1516
|
-
text-align: center;
|
|
1517
|
-
width: 23px;
|
|
1518
|
-
height: 23px;
|
|
1519
|
-
color: white;
|
|
1520
|
-
line-height: 1.5em;
|
|
1521
|
-
font-weight: 100;
|
|
1522
|
-
font-size: 16px;
|
|
1523
|
-
border-radius: 50%;
|
|
1524
|
-
position: absolute;
|
|
1525
|
-
}
|
|
1526
1602
|
.qr-journey-form-wrapper .disabled-product-fields-section .qr-form-fields {
|
|
1527
1603
|
display: flex;
|
|
1528
1604
|
flex-wrap: wrap;
|
package/dist/index.esm.js
CHANGED
|
@@ -771,6 +771,8 @@ function RenderField(field) {
|
|
|
771
771
|
onChange: field.onChange,
|
|
772
772
|
id: field.id
|
|
773
773
|
});
|
|
774
|
+
case "info":
|
|
775
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("p", null, field.label));
|
|
774
776
|
case "hidden":
|
|
775
777
|
return /*#__PURE__*/React.createElement("input", {
|
|
776
778
|
value: field.value,
|
|
@@ -779,7 +781,7 @@ function RenderField(field) {
|
|
|
779
781
|
id: field.id
|
|
780
782
|
});
|
|
781
783
|
case "select":
|
|
782
|
-
return /*#__PURE__*/React.createElement("select", {
|
|
784
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("select", {
|
|
783
785
|
name: field.name,
|
|
784
786
|
onChange: field.onChange,
|
|
785
787
|
disabled: field.isDisabled,
|
|
@@ -792,7 +794,9 @@ function RenderField(field) {
|
|
|
792
794
|
key: o.value,
|
|
793
795
|
value: o.value
|
|
794
796
|
}, o.label);
|
|
795
|
-
})))
|
|
797
|
+
}))), /*#__PURE__*/React.createElement("span", {
|
|
798
|
+
className: "select-custom-arrow"
|
|
799
|
+
}));
|
|
796
800
|
default:
|
|
797
801
|
return null;
|
|
798
802
|
}
|
|
@@ -810,7 +814,7 @@ var QrFormField = function (props) {
|
|
|
810
814
|
}, []);
|
|
811
815
|
var supportsValue = props.type !== "checkbox";
|
|
812
816
|
return props.type ? /*#__PURE__*/React.createElement("div", {
|
|
813
|
-
className: (props.hasError ? "error" : "") + " qr-form-filed-wrapper"
|
|
817
|
+
className: (props.hasError ? "error" : "") + " qr-form-filed-wrapper" + (props.isDisabled ? " disabled" : "") + " " + props.type
|
|
814
818
|
}, /*#__PURE__*/React.createElement("label", {
|
|
815
819
|
htmlFor: inputId
|
|
816
820
|
}, /*#__PURE__*/React.createElement("span", {
|
|
@@ -869,7 +873,7 @@ var QrForm = function (props) {
|
|
|
869
873
|
var buttonProps = props;
|
|
870
874
|
var consentFields = ((_a = props.consents) === null || _a === void 0 ? void 0 : _a.map(function (consent, index) {
|
|
871
875
|
return {
|
|
872
|
-
type: "checkbox",
|
|
876
|
+
type: consent.type === "info" ? "info" : "checkbox",
|
|
873
877
|
name: "consent_".concat(index + 1),
|
|
874
878
|
label: consent.policyText ? consent.policyText : consent.policyLink ? "I accept the policy: ".concat(consent.policyLink) : "Consent ".concat(index + 1),
|
|
875
879
|
value: "true",
|
|
@@ -1229,12 +1233,12 @@ var QrForm = function (props) {
|
|
|
1229
1233
|
}, /*#__PURE__*/React.createElement("h2", null, "Scanned Product Details"), renderFormSection({
|
|
1230
1234
|
pageIndex: 0,
|
|
1231
1235
|
startFromFieldIndex: 0,
|
|
1232
|
-
endFieldIndex:
|
|
1236
|
+
endFieldIndex: 4,
|
|
1233
1237
|
generateButtons: false
|
|
1234
1238
|
})), renderFormSection({
|
|
1235
1239
|
pageIndex: 0,
|
|
1236
|
-
startFromFieldIndex:
|
|
1237
|
-
endFieldIndex:
|
|
1240
|
+
startFromFieldIndex: 4,
|
|
1241
|
+
endFieldIndex: 6,
|
|
1238
1242
|
generateButtons: true
|
|
1239
1243
|
})), renderFormSection({
|
|
1240
1244
|
pageIndex: 1,
|