@asdp/ferryui 0.1.22-dev.10210 → 0.1.22-dev.10229
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.mts +5 -0
- package/dist/index.d.ts +5 -0
- package/dist/index.js +318 -110
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +318 -110
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -435,6 +435,7 @@ interface CardTicketLabels {
|
|
|
435
435
|
currencySymbol: string;
|
|
436
436
|
logoAlt: string;
|
|
437
437
|
verifyingTicketButton: string;
|
|
438
|
+
totalPriceMissing: string;
|
|
438
439
|
}
|
|
439
440
|
interface CardTicketProps {
|
|
440
441
|
/**
|
|
@@ -2898,6 +2899,10 @@ interface CardPassengerListProps {
|
|
|
2898
2899
|
* Callback when a passenger is clicked
|
|
2899
2900
|
*/
|
|
2900
2901
|
onPassengerClick: (passenger: Passenger) => void;
|
|
2902
|
+
/**
|
|
2903
|
+
* Callback when a passenger is clicked
|
|
2904
|
+
*/
|
|
2905
|
+
onIconClick: (event: React.MouseEvent<SVGSVGElement, MouseEvent>, passenger: Passenger, mode: 'add' | 'edit') => void;
|
|
2901
2906
|
/**
|
|
2902
2907
|
* Custom labels override (optional)
|
|
2903
2908
|
* If not provided, default labels based on language will be used
|
package/dist/index.d.ts
CHANGED
|
@@ -435,6 +435,7 @@ interface CardTicketLabels {
|
|
|
435
435
|
currencySymbol: string;
|
|
436
436
|
logoAlt: string;
|
|
437
437
|
verifyingTicketButton: string;
|
|
438
|
+
totalPriceMissing: string;
|
|
438
439
|
}
|
|
439
440
|
interface CardTicketProps {
|
|
440
441
|
/**
|
|
@@ -2898,6 +2899,10 @@ interface CardPassengerListProps {
|
|
|
2898
2899
|
* Callback when a passenger is clicked
|
|
2899
2900
|
*/
|
|
2900
2901
|
onPassengerClick: (passenger: Passenger) => void;
|
|
2902
|
+
/**
|
|
2903
|
+
* Callback when a passenger is clicked
|
|
2904
|
+
*/
|
|
2905
|
+
onIconClick: (event: React.MouseEvent<SVGSVGElement, MouseEvent>, passenger: Passenger, mode: 'add' | 'edit') => void;
|
|
2901
2906
|
/**
|
|
2902
2907
|
* Custom labels override (optional)
|
|
2903
2908
|
* If not provided, default labels based on language will be used
|
package/dist/index.js
CHANGED
|
@@ -1163,7 +1163,8 @@ var DEFAULT_LABELS5 = {
|
|
|
1163
1163
|
timezoneLabel: "WIB",
|
|
1164
1164
|
currencySymbol: "IDR",
|
|
1165
1165
|
logoAlt: "Logo ASDP",
|
|
1166
|
-
verifyingTicketButton: "Memeriksa Tiket"
|
|
1166
|
+
verifyingTicketButton: "Memeriksa Tiket",
|
|
1167
|
+
totalPriceMissing: "Lengkapi manifest barang lepas untuk melihat harga"
|
|
1167
1168
|
},
|
|
1168
1169
|
en: {
|
|
1169
1170
|
availableSeatsLabel: "Available",
|
|
@@ -1177,7 +1178,8 @@ var DEFAULT_LABELS5 = {
|
|
|
1177
1178
|
timezoneLabel: "WIB",
|
|
1178
1179
|
currencySymbol: "IDR",
|
|
1179
1180
|
logoAlt: "ASDP Logo",
|
|
1180
|
-
verifyingTicketButton: "Verifying Ticket"
|
|
1181
|
+
verifyingTicketButton: "Verifying Ticket",
|
|
1182
|
+
totalPriceMissing: "Please complete the cargo manifest to see the price"
|
|
1181
1183
|
}
|
|
1182
1184
|
};
|
|
1183
1185
|
|
|
@@ -1313,7 +1315,6 @@ var useStyles5 = reactComponents.makeStyles({
|
|
|
1313
1315
|
display: "flex",
|
|
1314
1316
|
justifyContent: "space-between",
|
|
1315
1317
|
alignItems: "center",
|
|
1316
|
-
flexWrap: "wrap",
|
|
1317
1318
|
[`@media (max-width: ${extendedTokens.breakpointMd})`]: {
|
|
1318
1319
|
padding: "1rem"
|
|
1319
1320
|
}
|
|
@@ -1428,10 +1429,38 @@ var CardTicket = ({
|
|
|
1428
1429
|
justifyContent: "center",
|
|
1429
1430
|
gap: "1rem"
|
|
1430
1431
|
},
|
|
1431
|
-
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1432
|
-
|
|
1433
|
-
|
|
1434
|
-
|
|
1432
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1433
|
+
reactComponents.Skeleton,
|
|
1434
|
+
{
|
|
1435
|
+
style: {
|
|
1436
|
+
display: "flex",
|
|
1437
|
+
flexDirection: "column",
|
|
1438
|
+
alignItems: "center"
|
|
1439
|
+
},
|
|
1440
|
+
children: [
|
|
1441
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1442
|
+
reactComponents.SkeletonItem,
|
|
1443
|
+
{
|
|
1444
|
+
style: {
|
|
1445
|
+
width: "60px",
|
|
1446
|
+
height: "60px",
|
|
1447
|
+
borderRadius: "50%"
|
|
1448
|
+
}
|
|
1449
|
+
}
|
|
1450
|
+
),
|
|
1451
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1452
|
+
reactComponents.SkeletonItem,
|
|
1453
|
+
{
|
|
1454
|
+
style: {
|
|
1455
|
+
width: "100px",
|
|
1456
|
+
height: "20px",
|
|
1457
|
+
marginTop: "1rem"
|
|
1458
|
+
}
|
|
1459
|
+
}
|
|
1460
|
+
)
|
|
1461
|
+
]
|
|
1462
|
+
}
|
|
1463
|
+
)
|
|
1435
1464
|
}
|
|
1436
1465
|
) }) : /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { style: { height: "100%" }, children: [
|
|
1437
1466
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -1460,7 +1489,10 @@ var CardTicket = ({
|
|
|
1460
1489
|
{
|
|
1461
1490
|
size: "large",
|
|
1462
1491
|
appearance: "filled",
|
|
1463
|
-
style: {
|
|
1492
|
+
style: {
|
|
1493
|
+
backgroundColor: departureItem?.availableTicket <= 0 ? reactComponents.tokens.colorNeutralForeground3 : departureItem?.provider?.serviceColor,
|
|
1494
|
+
padding: "0.5rem"
|
|
1495
|
+
},
|
|
1464
1496
|
iconPosition: "before",
|
|
1465
1497
|
shape: "rounded",
|
|
1466
1498
|
icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:info-24-regular" }),
|
|
@@ -1576,29 +1608,117 @@ var CardTicket = ({
|
|
|
1576
1608
|
xxl: 4.5,
|
|
1577
1609
|
xxxl: 4.5,
|
|
1578
1610
|
style: { padding: 0, margin: 0 },
|
|
1579
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Card, { className: styles.ticketMiddleCard, children: isLoading ? /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1580
|
-
|
|
1581
|
-
|
|
1582
|
-
|
|
1583
|
-
|
|
1584
|
-
|
|
1585
|
-
|
|
1586
|
-
|
|
1587
|
-
|
|
1588
|
-
|
|
1589
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1590
|
-
|
|
1591
|
-
|
|
1592
|
-
|
|
1593
|
-
|
|
1594
|
-
|
|
1595
|
-
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
|
|
1599
|
-
|
|
1600
|
-
|
|
1601
|
-
|
|
1611
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Card, { className: styles.ticketMiddleCard, children: isLoading ? /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1612
|
+
"div",
|
|
1613
|
+
{
|
|
1614
|
+
style: {
|
|
1615
|
+
display: "flex",
|
|
1616
|
+
flexDirection: "column",
|
|
1617
|
+
height: "100%",
|
|
1618
|
+
justifyContent: "space-between"
|
|
1619
|
+
},
|
|
1620
|
+
children: [
|
|
1621
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Visible, { lg: true, xl: true, xxl: true, xxxl: true, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1622
|
+
reactComponents.SkeletonItem,
|
|
1623
|
+
{
|
|
1624
|
+
style: {
|
|
1625
|
+
width: "80px",
|
|
1626
|
+
height: "28px",
|
|
1627
|
+
borderRadius: "4px"
|
|
1628
|
+
}
|
|
1629
|
+
}
|
|
1630
|
+
) }) }),
|
|
1631
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.ticketInfo, children: [
|
|
1632
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.ticketTime, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1633
|
+
reactComponents.Skeleton,
|
|
1634
|
+
{
|
|
1635
|
+
style: {
|
|
1636
|
+
display: "flex",
|
|
1637
|
+
flexDirection: "column",
|
|
1638
|
+
gap: "8px"
|
|
1639
|
+
},
|
|
1640
|
+
children: [
|
|
1641
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.SkeletonItem, { style: { width: "60px", height: "14px" } }),
|
|
1642
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.SkeletonItem, { style: { width: "80px", height: "28px" } }),
|
|
1643
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1644
|
+
reactComponents.SkeletonItem,
|
|
1645
|
+
{
|
|
1646
|
+
style: { width: "120px", height: "14px" }
|
|
1647
|
+
}
|
|
1648
|
+
)
|
|
1649
|
+
]
|
|
1650
|
+
}
|
|
1651
|
+
) }),
|
|
1652
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.ticketDuration, children: [
|
|
1653
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1654
|
+
reactComponents.SkeletonItem,
|
|
1655
|
+
{
|
|
1656
|
+
style: {
|
|
1657
|
+
width: "80px",
|
|
1658
|
+
height: "16px",
|
|
1659
|
+
marginBottom: "8px"
|
|
1660
|
+
}
|
|
1661
|
+
}
|
|
1662
|
+
) }),
|
|
1663
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.dividerContainer, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1664
|
+
reactComponents.SkeletonItem,
|
|
1665
|
+
{
|
|
1666
|
+
style: { width: "120px", height: "2px" }
|
|
1667
|
+
}
|
|
1668
|
+
) }) })
|
|
1669
|
+
] }),
|
|
1670
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1671
|
+
"div",
|
|
1672
|
+
{
|
|
1673
|
+
className: styles.ticketTime,
|
|
1674
|
+
style: { alignItems: "flex-end" },
|
|
1675
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1676
|
+
reactComponents.Skeleton,
|
|
1677
|
+
{
|
|
1678
|
+
style: {
|
|
1679
|
+
display: "flex",
|
|
1680
|
+
flexDirection: "column",
|
|
1681
|
+
alignItems: "flex-end",
|
|
1682
|
+
gap: "8px"
|
|
1683
|
+
},
|
|
1684
|
+
children: [
|
|
1685
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.SkeletonItem, { style: { width: "60px", height: "14px" } }),
|
|
1686
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.SkeletonItem, { style: { width: "80px", height: "28px" } }),
|
|
1687
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1688
|
+
reactComponents.SkeletonItem,
|
|
1689
|
+
{
|
|
1690
|
+
style: { width: "120px", height: "14px" }
|
|
1691
|
+
}
|
|
1692
|
+
)
|
|
1693
|
+
]
|
|
1694
|
+
}
|
|
1695
|
+
)
|
|
1696
|
+
}
|
|
1697
|
+
)
|
|
1698
|
+
] }) }),
|
|
1699
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.ticketButtons, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1700
|
+
reactComponents.Skeleton,
|
|
1701
|
+
{
|
|
1702
|
+
style: { display: "flex", gap: "1rem", width: "100%" },
|
|
1703
|
+
children: [
|
|
1704
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1705
|
+
reactComponents.SkeletonItem,
|
|
1706
|
+
{
|
|
1707
|
+
style: { flex: 1, height: "32px", borderRadius: "16px" }
|
|
1708
|
+
}
|
|
1709
|
+
),
|
|
1710
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1711
|
+
reactComponents.SkeletonItem,
|
|
1712
|
+
{
|
|
1713
|
+
style: { flex: 1, height: "32px", borderRadius: "16px" }
|
|
1714
|
+
}
|
|
1715
|
+
)
|
|
1716
|
+
]
|
|
1717
|
+
}
|
|
1718
|
+
) })
|
|
1719
|
+
]
|
|
1720
|
+
}
|
|
1721
|
+
) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1602
1722
|
/* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Visible, { lg: true, xl: true, xxl: true, xxxl: true, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1603
1723
|
reactComponents.Badge,
|
|
1604
1724
|
{
|
|
@@ -1626,7 +1746,13 @@ var CardTicket = ({
|
|
|
1626
1746
|
" ",
|
|
1627
1747
|
formatDuration(departureItem?.estimatedSailingMinute)
|
|
1628
1748
|
] }),
|
|
1629
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.dividerContainer, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Divider, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1749
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.dividerContainer, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Divider, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1750
|
+
react.Icon,
|
|
1751
|
+
{
|
|
1752
|
+
icon: "fluent:vehicle-ship-24-regular",
|
|
1753
|
+
height: 24
|
|
1754
|
+
}
|
|
1755
|
+
) }) })
|
|
1630
1756
|
] }),
|
|
1631
1757
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.ticketTime, children: [
|
|
1632
1758
|
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.Caption1, { children: departureItem?.arrivedDay }),
|
|
@@ -1647,7 +1773,10 @@ var CardTicket = ({
|
|
|
1647
1773
|
},
|
|
1648
1774
|
icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:money-24-regular" }),
|
|
1649
1775
|
size: "medium",
|
|
1650
|
-
onClick: () => onPriceDetailClick(
|
|
1776
|
+
onClick: () => onPriceDetailClick(
|
|
1777
|
+
departureItem?.billingDetail,
|
|
1778
|
+
departureItem?.provider
|
|
1779
|
+
),
|
|
1651
1780
|
children: mergedLabels.priceDetailsButton
|
|
1652
1781
|
}
|
|
1653
1782
|
),
|
|
@@ -1682,84 +1811,145 @@ var CardTicket = ({
|
|
|
1682
1811
|
xxl: 4.5,
|
|
1683
1812
|
xxxl: 4.5,
|
|
1684
1813
|
style: { padding: 0, margin: 0 },
|
|
1685
|
-
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1686
|
-
|
|
1687
|
-
|
|
1688
|
-
|
|
1689
|
-
|
|
1690
|
-
|
|
1814
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1815
|
+
reactComponents.Card,
|
|
1816
|
+
{
|
|
1817
|
+
className: styles.ticketRightCard,
|
|
1818
|
+
style: departureItem?.availableTicket <= 0 ? {
|
|
1819
|
+
background: "linear-gradient(75deg, #7A7A7A 0%, #4D4D4D 103.3%)"
|
|
1820
|
+
} : {},
|
|
1821
|
+
children: [
|
|
1822
|
+
isLoading ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1823
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.priceCard, children: [
|
|
1824
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
1825
|
+
reactComponents.Skeleton,
|
|
1826
|
+
{
|
|
1827
|
+
style: {
|
|
1828
|
+
display: "flex",
|
|
1829
|
+
flexDirection: "column",
|
|
1830
|
+
gap: "8px",
|
|
1831
|
+
flex: 1
|
|
1832
|
+
},
|
|
1833
|
+
children: [
|
|
1834
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.SkeletonItem, { style: { width: "80px", height: "20px" } }),
|
|
1835
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1836
|
+
reactComponents.SkeletonItem,
|
|
1837
|
+
{
|
|
1838
|
+
style: {
|
|
1839
|
+
width: "140px",
|
|
1840
|
+
height: "32px",
|
|
1841
|
+
borderRadius: "16px"
|
|
1842
|
+
}
|
|
1843
|
+
}
|
|
1844
|
+
)
|
|
1845
|
+
]
|
|
1846
|
+
}
|
|
1847
|
+
),
|
|
1848
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1849
|
+
reactComponents.SkeletonItem,
|
|
1850
|
+
{
|
|
1851
|
+
style: {
|
|
1852
|
+
width: "120px",
|
|
1853
|
+
height: "40px",
|
|
1854
|
+
borderRadius: "20px"
|
|
1855
|
+
}
|
|
1856
|
+
}
|
|
1857
|
+
) })
|
|
1858
|
+
] }),
|
|
1859
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.facilitiesSection, children: [
|
|
1860
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1861
|
+
reactComponents.SkeletonItem,
|
|
1862
|
+
{
|
|
1863
|
+
style: {
|
|
1864
|
+
width: "80px",
|
|
1865
|
+
height: "20px",
|
|
1866
|
+
marginBottom: "8px"
|
|
1867
|
+
}
|
|
1868
|
+
}
|
|
1869
|
+
) }),
|
|
1870
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.facilitiesList, children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1871
|
+
reactComponents.SkeletonItem,
|
|
1872
|
+
{
|
|
1873
|
+
style: { width: "100px", height: "20px" }
|
|
1874
|
+
}
|
|
1875
|
+
) }, i)) })
|
|
1876
|
+
] })
|
|
1877
|
+
] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1878
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.priceCard, children: [
|
|
1879
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
1880
|
+
"div",
|
|
1881
|
+
{
|
|
1882
|
+
style: {
|
|
1883
|
+
display: "flex",
|
|
1884
|
+
flexDirection: "column",
|
|
1885
|
+
gap: "0.25rem",
|
|
1886
|
+
flex: 1,
|
|
1887
|
+
minWidth: 0
|
|
1888
|
+
},
|
|
1889
|
+
children: [
|
|
1890
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle2, { children: mergedLabels.totalPriceLabel }),
|
|
1891
|
+
departureItem?.billingDetail?.total?.formatted ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1892
|
+
reactComponents.Title3,
|
|
1893
|
+
{
|
|
1894
|
+
children: departureItem?.billingDetail?.total?.formatted
|
|
1895
|
+
}
|
|
1896
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
1897
|
+
reactComponents.Body1Strong,
|
|
1898
|
+
{
|
|
1899
|
+
style: { wordBreak: "break-word" },
|
|
1900
|
+
children: mergedLabels.totalPriceMissing
|
|
1901
|
+
}
|
|
1902
|
+
)
|
|
1903
|
+
]
|
|
1904
|
+
}
|
|
1905
|
+
),
|
|
1906
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1907
|
+
reactComponents.Button,
|
|
1908
|
+
{
|
|
1909
|
+
onClick: onSelectTicket,
|
|
1910
|
+
appearance: "primary",
|
|
1911
|
+
style: isVerifyingTicket || departureItem?.availableTicket <= 0 ? { flexShrink: 0 } : { backgroundColor: brandColors["60"], flexShrink: 0 },
|
|
1912
|
+
size: "medium",
|
|
1913
|
+
shape: "circular",
|
|
1914
|
+
icon: isVerifyingTicket ? null : /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:ticket-diagonal-24-filled" }),
|
|
1915
|
+
disabled: isVerifyingTicket || departureItem?.availableTicket <= 0,
|
|
1916
|
+
children: isVerifyingTicket ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1917
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1918
|
+
reactComponents.Spinner,
|
|
1919
|
+
{
|
|
1920
|
+
size: "extra-tiny",
|
|
1921
|
+
style: { marginRight: "5px" }
|
|
1922
|
+
}
|
|
1923
|
+
),
|
|
1924
|
+
" ",
|
|
1925
|
+
mergedLabels.verifyingTicketButton
|
|
1926
|
+
] }) : buttonText || mergedLabels.selectTicketButton
|
|
1927
|
+
}
|
|
1928
|
+
)
|
|
1929
|
+
] }),
|
|
1930
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.facilitiesSection, children: [
|
|
1931
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle2, { children: mergedLabels.facilitiesLabel }),
|
|
1932
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.facilitiesList, children: departureItem?.provider?.facilities.map((facility, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.facilityItem, children: [
|
|
1933
|
+
/* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:checkmark-circle-24-filled" }),
|
|
1934
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.Caption1Strong, { children: facility })
|
|
1935
|
+
] }, idx)) })
|
|
1936
|
+
] })
|
|
1691
1937
|
] }),
|
|
1692
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1693
|
-
|
|
1694
|
-
|
|
1695
|
-
|
|
1696
|
-
|
|
1697
|
-
|
|
1698
|
-
|
|
1699
|
-
|
|
1700
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
1701
|
-
"div",
|
|
1702
|
-
{
|
|
1703
|
-
style: {
|
|
1704
|
-
display: "flex",
|
|
1705
|
-
flexDirection: "column",
|
|
1706
|
-
gap: "0.25rem"
|
|
1938
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Visible, { xl: true, xxl: true, xxxl: true, children: Array.from({ length: circularVerticalConfig.count }).map(
|
|
1939
|
+
(_, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
1940
|
+
"div",
|
|
1941
|
+
{
|
|
1942
|
+
className: styles.circularRight,
|
|
1943
|
+
style: {
|
|
1944
|
+
top: `${circularVerticalConfig.top + index * circularVerticalConfig.spacing}px`
|
|
1945
|
+
}
|
|
1707
1946
|
},
|
|
1708
|
-
|
|
1709
|
-
|
|
1710
|
-
|
|
1711
|
-
|
|
1712
|
-
|
|
1713
|
-
|
|
1714
|
-
display: "flex",
|
|
1715
|
-
flex: "column",
|
|
1716
|
-
justifyContent: "end"
|
|
1717
|
-
},
|
|
1718
|
-
children: departureItem?.billingDetail?.total?.formatted
|
|
1719
|
-
}
|
|
1720
|
-
)
|
|
1721
|
-
]
|
|
1722
|
-
}
|
|
1723
|
-
),
|
|
1724
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1725
|
-
reactComponents.Button,
|
|
1726
|
-
{
|
|
1727
|
-
onClick: onSelectTicket,
|
|
1728
|
-
appearance: "primary",
|
|
1729
|
-
style: isVerifyingTicket || departureItem?.availableTicket <= 0 ? void 0 : { backgroundColor: brandColors["60"] },
|
|
1730
|
-
size: "medium",
|
|
1731
|
-
shape: "circular",
|
|
1732
|
-
icon: isVerifyingTicket ? null : /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:ticket-diagonal-24-filled" }),
|
|
1733
|
-
disabled: isVerifyingTicket || departureItem?.availableTicket <= 0,
|
|
1734
|
-
children: isVerifyingTicket ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1735
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.Spinner, { size: "extra-tiny", style: { marginRight: "5px" } }),
|
|
1736
|
-
" ",
|
|
1737
|
-
mergedLabels.verifyingTicketButton
|
|
1738
|
-
] }) : buttonText || mergedLabels.selectTicketButton
|
|
1739
|
-
}
|
|
1740
|
-
)
|
|
1741
|
-
] }),
|
|
1742
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.facilitiesSection, children: [
|
|
1743
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle2, { children: mergedLabels.facilitiesLabel }),
|
|
1744
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.facilitiesList, children: departureItem?.provider?.facilities.map((facility, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.facilityItem, children: [
|
|
1745
|
-
/* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:checkmark-circle-24-filled" }),
|
|
1746
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactComponents.Caption1Strong, { children: facility })
|
|
1747
|
-
] }, idx)) })
|
|
1748
|
-
] })
|
|
1749
|
-
] }),
|
|
1750
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Visible, { xl: true, xxl: true, xxxl: true, children: Array.from({ length: circularVerticalConfig.count }).map(
|
|
1751
|
-
(_, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
1752
|
-
"div",
|
|
1753
|
-
{
|
|
1754
|
-
className: styles.circularRight,
|
|
1755
|
-
style: {
|
|
1756
|
-
top: `${circularVerticalConfig.top + index * circularVerticalConfig.spacing}px`
|
|
1757
|
-
}
|
|
1758
|
-
},
|
|
1759
|
-
index
|
|
1760
|
-
)
|
|
1761
|
-
) })
|
|
1762
|
-
] })
|
|
1947
|
+
index
|
|
1948
|
+
)
|
|
1949
|
+
) })
|
|
1950
|
+
]
|
|
1951
|
+
}
|
|
1952
|
+
)
|
|
1763
1953
|
}
|
|
1764
1954
|
)
|
|
1765
1955
|
] });
|
|
@@ -11353,6 +11543,15 @@ var ModalPassengerForm = ({
|
|
|
11353
11543
|
const dynamicMinLengthId = idRuleLengthMatch ? parseInt(idRuleLengthMatch[1], 10) : 6;
|
|
11354
11544
|
React.useEffect(() => {
|
|
11355
11545
|
reset(defaultValues);
|
|
11546
|
+
if (defaultValues?.birthdate) {
|
|
11547
|
+
const { years, months } = calculateAge(defaultValues.birthdate);
|
|
11548
|
+
setValue(
|
|
11549
|
+
"age",
|
|
11550
|
+
`${years} ${mergedLabels.yearLabel} ${months} ${mergedLabels.monthLabel}`
|
|
11551
|
+
);
|
|
11552
|
+
} else {
|
|
11553
|
+
setValue("age", "");
|
|
11554
|
+
}
|
|
11356
11555
|
}, [defaultValues, reset]);
|
|
11357
11556
|
React.useEffect(() => {
|
|
11358
11557
|
if (watchIdentityTypeId) {
|
|
@@ -11370,6 +11569,7 @@ var ModalPassengerForm = ({
|
|
|
11370
11569
|
setValue("age", "");
|
|
11371
11570
|
}
|
|
11372
11571
|
}, [
|
|
11572
|
+
open,
|
|
11373
11573
|
watchBirthdate,
|
|
11374
11574
|
setValue,
|
|
11375
11575
|
mergedLabels.yearLabel,
|
|
@@ -12241,6 +12441,7 @@ var CardPassengerList = ({
|
|
|
12241
12441
|
title,
|
|
12242
12442
|
passengers,
|
|
12243
12443
|
onPassengerClick,
|
|
12444
|
+
onIconClick,
|
|
12244
12445
|
labels,
|
|
12245
12446
|
className
|
|
12246
12447
|
}) => {
|
|
@@ -12307,7 +12508,14 @@ var CardPassengerList = ({
|
|
|
12307
12508
|
{
|
|
12308
12509
|
icon: passenger.id && passenger.serviceName ? "fluent:edit-24-regular" : "fluent:chevron-right-24-regular",
|
|
12309
12510
|
width: 20,
|
|
12310
|
-
height: 20
|
|
12511
|
+
height: 20,
|
|
12512
|
+
onClick: (event) => {
|
|
12513
|
+
onIconClick(
|
|
12514
|
+
event,
|
|
12515
|
+
passenger,
|
|
12516
|
+
passenger.id && passenger.serviceName ? "edit" : "add"
|
|
12517
|
+
);
|
|
12518
|
+
}
|
|
12311
12519
|
}
|
|
12312
12520
|
)
|
|
12313
12521
|
]
|