@asdp/ferryui 0.1.22-dev.10214 → 0.1.22-dev.10231
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 +54 -21
- package/dist/index.d.ts +54 -21
- package/dist/index.js +556 -178
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +556 -178
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -275,7 +275,10 @@ var sharedColors = {
|
|
|
275
275
|
"Shared_Red_Primary": "#d13438",
|
|
276
276
|
"Shared_Orange_Shade_20": "#bc4b09",
|
|
277
277
|
"Shared_Orange_Tint_60": "#fff9f5",
|
|
278
|
-
"Shared_Green_Primary": "#107c10"
|
|
278
|
+
"Shared_Green_Primary": "#107c10",
|
|
279
|
+
"Shared_Lilac_Primary": "#b146c2",
|
|
280
|
+
"Shared_Lilac_Tint_40": "#e6bfed",
|
|
281
|
+
"Shared_Lilac_Tint_60": "#fcf6fd"};
|
|
279
282
|
var foundationColors = {
|
|
280
283
|
"Foundation_Danger_error": "#FD3A3A"
|
|
281
284
|
};
|
|
@@ -1154,7 +1157,8 @@ var DEFAULT_LABELS5 = {
|
|
|
1154
1157
|
timezoneLabel: "WIB",
|
|
1155
1158
|
currencySymbol: "IDR",
|
|
1156
1159
|
logoAlt: "Logo ASDP",
|
|
1157
|
-
verifyingTicketButton: "Memeriksa Tiket"
|
|
1160
|
+
verifyingTicketButton: "Memeriksa Tiket",
|
|
1161
|
+
totalPriceMissing: "Lengkapi manifest barang lepas untuk melihat harga"
|
|
1158
1162
|
},
|
|
1159
1163
|
en: {
|
|
1160
1164
|
availableSeatsLabel: "Available",
|
|
@@ -1168,7 +1172,8 @@ var DEFAULT_LABELS5 = {
|
|
|
1168
1172
|
timezoneLabel: "WIB",
|
|
1169
1173
|
currencySymbol: "IDR",
|
|
1170
1174
|
logoAlt: "ASDP Logo",
|
|
1171
|
-
verifyingTicketButton: "Verifying Ticket"
|
|
1175
|
+
verifyingTicketButton: "Verifying Ticket",
|
|
1176
|
+
totalPriceMissing: "Please complete the cargo manifest to see the price"
|
|
1172
1177
|
}
|
|
1173
1178
|
};
|
|
1174
1179
|
|
|
@@ -1304,7 +1309,6 @@ var useStyles5 = makeStyles({
|
|
|
1304
1309
|
display: "flex",
|
|
1305
1310
|
justifyContent: "space-between",
|
|
1306
1311
|
alignItems: "center",
|
|
1307
|
-
flexWrap: "wrap",
|
|
1308
1312
|
[`@media (max-width: ${extendedTokens.breakpointMd})`]: {
|
|
1309
1313
|
padding: "1rem"
|
|
1310
1314
|
}
|
|
@@ -1419,10 +1423,38 @@ var CardTicket = ({
|
|
|
1419
1423
|
justifyContent: "center",
|
|
1420
1424
|
gap: "1rem"
|
|
1421
1425
|
},
|
|
1422
|
-
children: /* @__PURE__ */ jsxs(
|
|
1423
|
-
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
+
children: /* @__PURE__ */ jsxs(
|
|
1427
|
+
Skeleton,
|
|
1428
|
+
{
|
|
1429
|
+
style: {
|
|
1430
|
+
display: "flex",
|
|
1431
|
+
flexDirection: "column",
|
|
1432
|
+
alignItems: "center"
|
|
1433
|
+
},
|
|
1434
|
+
children: [
|
|
1435
|
+
/* @__PURE__ */ jsx(
|
|
1436
|
+
SkeletonItem,
|
|
1437
|
+
{
|
|
1438
|
+
style: {
|
|
1439
|
+
width: "60px",
|
|
1440
|
+
height: "60px",
|
|
1441
|
+
borderRadius: "50%"
|
|
1442
|
+
}
|
|
1443
|
+
}
|
|
1444
|
+
),
|
|
1445
|
+
/* @__PURE__ */ jsx(
|
|
1446
|
+
SkeletonItem,
|
|
1447
|
+
{
|
|
1448
|
+
style: {
|
|
1449
|
+
width: "100px",
|
|
1450
|
+
height: "20px",
|
|
1451
|
+
marginTop: "1rem"
|
|
1452
|
+
}
|
|
1453
|
+
}
|
|
1454
|
+
)
|
|
1455
|
+
]
|
|
1456
|
+
}
|
|
1457
|
+
)
|
|
1426
1458
|
}
|
|
1427
1459
|
) }) : /* @__PURE__ */ jsxs(Row, { style: { height: "100%" }, children: [
|
|
1428
1460
|
/* @__PURE__ */ jsx(
|
|
@@ -1451,7 +1483,10 @@ var CardTicket = ({
|
|
|
1451
1483
|
{
|
|
1452
1484
|
size: "large",
|
|
1453
1485
|
appearance: "filled",
|
|
1454
|
-
style: {
|
|
1486
|
+
style: {
|
|
1487
|
+
backgroundColor: departureItem?.availableTicket <= 0 ? tokens.colorNeutralForeground3 : departureItem?.provider?.serviceColor,
|
|
1488
|
+
padding: "0.5rem"
|
|
1489
|
+
},
|
|
1455
1490
|
iconPosition: "before",
|
|
1456
1491
|
shape: "rounded",
|
|
1457
1492
|
icon: /* @__PURE__ */ jsx(Icon, { icon: "fluent:info-24-regular" }),
|
|
@@ -1567,29 +1602,117 @@ var CardTicket = ({
|
|
|
1567
1602
|
xxl: 4.5,
|
|
1568
1603
|
xxxl: 4.5,
|
|
1569
1604
|
style: { padding: 0, margin: 0 },
|
|
1570
|
-
children: /* @__PURE__ */ jsx(Card, { className: styles.ticketMiddleCard, children: isLoading ? /* @__PURE__ */ jsxs(
|
|
1571
|
-
|
|
1572
|
-
|
|
1573
|
-
|
|
1574
|
-
|
|
1575
|
-
|
|
1576
|
-
|
|
1577
|
-
|
|
1578
|
-
|
|
1579
|
-
|
|
1580
|
-
/* @__PURE__ */ jsx(
|
|
1581
|
-
|
|
1582
|
-
|
|
1583
|
-
|
|
1584
|
-
|
|
1585
|
-
|
|
1586
|
-
|
|
1587
|
-
|
|
1588
|
-
|
|
1589
|
-
|
|
1590
|
-
|
|
1591
|
-
|
|
1592
|
-
|
|
1605
|
+
children: /* @__PURE__ */ jsx(Card, { className: styles.ticketMiddleCard, children: isLoading ? /* @__PURE__ */ jsxs(
|
|
1606
|
+
"div",
|
|
1607
|
+
{
|
|
1608
|
+
style: {
|
|
1609
|
+
display: "flex",
|
|
1610
|
+
flexDirection: "column",
|
|
1611
|
+
height: "100%",
|
|
1612
|
+
justifyContent: "space-between"
|
|
1613
|
+
},
|
|
1614
|
+
children: [
|
|
1615
|
+
/* @__PURE__ */ jsx(Visible, { lg: true, xl: true, xxl: true, xxxl: true, children: /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(
|
|
1616
|
+
SkeletonItem,
|
|
1617
|
+
{
|
|
1618
|
+
style: {
|
|
1619
|
+
width: "80px",
|
|
1620
|
+
height: "28px",
|
|
1621
|
+
borderRadius: "4px"
|
|
1622
|
+
}
|
|
1623
|
+
}
|
|
1624
|
+
) }) }),
|
|
1625
|
+
/* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("div", { className: styles.ticketInfo, children: [
|
|
1626
|
+
/* @__PURE__ */ jsx("div", { className: styles.ticketTime, children: /* @__PURE__ */ jsxs(
|
|
1627
|
+
Skeleton,
|
|
1628
|
+
{
|
|
1629
|
+
style: {
|
|
1630
|
+
display: "flex",
|
|
1631
|
+
flexDirection: "column",
|
|
1632
|
+
gap: "8px"
|
|
1633
|
+
},
|
|
1634
|
+
children: [
|
|
1635
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "60px", height: "14px" } }),
|
|
1636
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "28px" } }),
|
|
1637
|
+
/* @__PURE__ */ jsx(
|
|
1638
|
+
SkeletonItem,
|
|
1639
|
+
{
|
|
1640
|
+
style: { width: "120px", height: "14px" }
|
|
1641
|
+
}
|
|
1642
|
+
)
|
|
1643
|
+
]
|
|
1644
|
+
}
|
|
1645
|
+
) }),
|
|
1646
|
+
/* @__PURE__ */ jsxs("div", { className: styles.ticketDuration, children: [
|
|
1647
|
+
/* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(
|
|
1648
|
+
SkeletonItem,
|
|
1649
|
+
{
|
|
1650
|
+
style: {
|
|
1651
|
+
width: "80px",
|
|
1652
|
+
height: "16px",
|
|
1653
|
+
marginBottom: "8px"
|
|
1654
|
+
}
|
|
1655
|
+
}
|
|
1656
|
+
) }),
|
|
1657
|
+
/* @__PURE__ */ jsx("div", { className: styles.dividerContainer, children: /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(
|
|
1658
|
+
SkeletonItem,
|
|
1659
|
+
{
|
|
1660
|
+
style: { width: "120px", height: "2px" }
|
|
1661
|
+
}
|
|
1662
|
+
) }) })
|
|
1663
|
+
] }),
|
|
1664
|
+
/* @__PURE__ */ jsx(
|
|
1665
|
+
"div",
|
|
1666
|
+
{
|
|
1667
|
+
className: styles.ticketTime,
|
|
1668
|
+
style: { alignItems: "flex-end" },
|
|
1669
|
+
children: /* @__PURE__ */ jsxs(
|
|
1670
|
+
Skeleton,
|
|
1671
|
+
{
|
|
1672
|
+
style: {
|
|
1673
|
+
display: "flex",
|
|
1674
|
+
flexDirection: "column",
|
|
1675
|
+
alignItems: "flex-end",
|
|
1676
|
+
gap: "8px"
|
|
1677
|
+
},
|
|
1678
|
+
children: [
|
|
1679
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "60px", height: "14px" } }),
|
|
1680
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "28px" } }),
|
|
1681
|
+
/* @__PURE__ */ jsx(
|
|
1682
|
+
SkeletonItem,
|
|
1683
|
+
{
|
|
1684
|
+
style: { width: "120px", height: "14px" }
|
|
1685
|
+
}
|
|
1686
|
+
)
|
|
1687
|
+
]
|
|
1688
|
+
}
|
|
1689
|
+
)
|
|
1690
|
+
}
|
|
1691
|
+
)
|
|
1692
|
+
] }) }),
|
|
1693
|
+
/* @__PURE__ */ jsx("div", { className: styles.ticketButtons, children: /* @__PURE__ */ jsxs(
|
|
1694
|
+
Skeleton,
|
|
1695
|
+
{
|
|
1696
|
+
style: { display: "flex", gap: "1rem", width: "100%" },
|
|
1697
|
+
children: [
|
|
1698
|
+
/* @__PURE__ */ jsx(
|
|
1699
|
+
SkeletonItem,
|
|
1700
|
+
{
|
|
1701
|
+
style: { flex: 1, height: "32px", borderRadius: "16px" }
|
|
1702
|
+
}
|
|
1703
|
+
),
|
|
1704
|
+
/* @__PURE__ */ jsx(
|
|
1705
|
+
SkeletonItem,
|
|
1706
|
+
{
|
|
1707
|
+
style: { flex: 1, height: "32px", borderRadius: "16px" }
|
|
1708
|
+
}
|
|
1709
|
+
)
|
|
1710
|
+
]
|
|
1711
|
+
}
|
|
1712
|
+
) })
|
|
1713
|
+
]
|
|
1714
|
+
}
|
|
1715
|
+
) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1593
1716
|
/* @__PURE__ */ jsx(Visible, { lg: true, xl: true, xxl: true, xxxl: true, children: /* @__PURE__ */ jsx(
|
|
1594
1717
|
Badge,
|
|
1595
1718
|
{
|
|
@@ -1617,7 +1740,13 @@ var CardTicket = ({
|
|
|
1617
1740
|
" ",
|
|
1618
1741
|
formatDuration(departureItem?.estimatedSailingMinute)
|
|
1619
1742
|
] }),
|
|
1620
|
-
/* @__PURE__ */ jsx("div", { className: styles.dividerContainer, children: /* @__PURE__ */ jsx(Divider, { children: /* @__PURE__ */ jsx(
|
|
1743
|
+
/* @__PURE__ */ jsx("div", { className: styles.dividerContainer, children: /* @__PURE__ */ jsx(Divider, { children: /* @__PURE__ */ jsx(
|
|
1744
|
+
Icon,
|
|
1745
|
+
{
|
|
1746
|
+
icon: "fluent:vehicle-ship-24-regular",
|
|
1747
|
+
height: 24
|
|
1748
|
+
}
|
|
1749
|
+
) }) })
|
|
1621
1750
|
] }),
|
|
1622
1751
|
/* @__PURE__ */ jsxs("div", { className: styles.ticketTime, children: [
|
|
1623
1752
|
/* @__PURE__ */ jsx(Caption1, { children: departureItem?.arrivedDay }),
|
|
@@ -1638,7 +1767,10 @@ var CardTicket = ({
|
|
|
1638
1767
|
},
|
|
1639
1768
|
icon: /* @__PURE__ */ jsx(Icon, { icon: "fluent:money-24-regular" }),
|
|
1640
1769
|
size: "medium",
|
|
1641
|
-
onClick: () => onPriceDetailClick(
|
|
1770
|
+
onClick: () => onPriceDetailClick(
|
|
1771
|
+
departureItem?.billingDetail,
|
|
1772
|
+
departureItem?.provider
|
|
1773
|
+
),
|
|
1642
1774
|
children: mergedLabels.priceDetailsButton
|
|
1643
1775
|
}
|
|
1644
1776
|
),
|
|
@@ -1673,84 +1805,145 @@ var CardTicket = ({
|
|
|
1673
1805
|
xxl: 4.5,
|
|
1674
1806
|
xxxl: 4.5,
|
|
1675
1807
|
style: { padding: 0, margin: 0 },
|
|
1676
|
-
children: /* @__PURE__ */ jsxs(
|
|
1677
|
-
|
|
1678
|
-
|
|
1679
|
-
|
|
1680
|
-
|
|
1681
|
-
|
|
1808
|
+
children: /* @__PURE__ */ jsxs(
|
|
1809
|
+
Card,
|
|
1810
|
+
{
|
|
1811
|
+
className: styles.ticketRightCard,
|
|
1812
|
+
style: departureItem?.availableTicket <= 0 ? {
|
|
1813
|
+
background: "linear-gradient(75deg, #7A7A7A 0%, #4D4D4D 103.3%)"
|
|
1814
|
+
} : {},
|
|
1815
|
+
children: [
|
|
1816
|
+
isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1817
|
+
/* @__PURE__ */ jsxs("div", { className: styles.priceCard, children: [
|
|
1818
|
+
/* @__PURE__ */ jsxs(
|
|
1819
|
+
Skeleton,
|
|
1820
|
+
{
|
|
1821
|
+
style: {
|
|
1822
|
+
display: "flex",
|
|
1823
|
+
flexDirection: "column",
|
|
1824
|
+
gap: "8px",
|
|
1825
|
+
flex: 1
|
|
1826
|
+
},
|
|
1827
|
+
children: [
|
|
1828
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "20px" } }),
|
|
1829
|
+
/* @__PURE__ */ jsx(
|
|
1830
|
+
SkeletonItem,
|
|
1831
|
+
{
|
|
1832
|
+
style: {
|
|
1833
|
+
width: "140px",
|
|
1834
|
+
height: "32px",
|
|
1835
|
+
borderRadius: "16px"
|
|
1836
|
+
}
|
|
1837
|
+
}
|
|
1838
|
+
)
|
|
1839
|
+
]
|
|
1840
|
+
}
|
|
1841
|
+
),
|
|
1842
|
+
/* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(
|
|
1843
|
+
SkeletonItem,
|
|
1844
|
+
{
|
|
1845
|
+
style: {
|
|
1846
|
+
width: "120px",
|
|
1847
|
+
height: "40px",
|
|
1848
|
+
borderRadius: "20px"
|
|
1849
|
+
}
|
|
1850
|
+
}
|
|
1851
|
+
) })
|
|
1852
|
+
] }),
|
|
1853
|
+
/* @__PURE__ */ jsxs("div", { className: styles.facilitiesSection, children: [
|
|
1854
|
+
/* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(
|
|
1855
|
+
SkeletonItem,
|
|
1856
|
+
{
|
|
1857
|
+
style: {
|
|
1858
|
+
width: "80px",
|
|
1859
|
+
height: "20px",
|
|
1860
|
+
marginBottom: "8px"
|
|
1861
|
+
}
|
|
1862
|
+
}
|
|
1863
|
+
) }),
|
|
1864
|
+
/* @__PURE__ */ jsx("div", { className: styles.facilitiesList, children: [1, 2, 3].map((i) => /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(
|
|
1865
|
+
SkeletonItem,
|
|
1866
|
+
{
|
|
1867
|
+
style: { width: "100px", height: "20px" }
|
|
1868
|
+
}
|
|
1869
|
+
) }, i)) })
|
|
1870
|
+
] })
|
|
1871
|
+
] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1872
|
+
/* @__PURE__ */ jsxs("div", { className: styles.priceCard, children: [
|
|
1873
|
+
/* @__PURE__ */ jsxs(
|
|
1874
|
+
"div",
|
|
1875
|
+
{
|
|
1876
|
+
style: {
|
|
1877
|
+
display: "flex",
|
|
1878
|
+
flexDirection: "column",
|
|
1879
|
+
gap: "0.25rem",
|
|
1880
|
+
flex: 1,
|
|
1881
|
+
minWidth: 0
|
|
1882
|
+
},
|
|
1883
|
+
children: [
|
|
1884
|
+
/* @__PURE__ */ jsx(Subtitle2, { children: mergedLabels.totalPriceLabel }),
|
|
1885
|
+
departureItem?.billingDetail?.total?.formatted ? /* @__PURE__ */ jsx(
|
|
1886
|
+
Title3,
|
|
1887
|
+
{
|
|
1888
|
+
children: departureItem?.billingDetail?.total?.formatted
|
|
1889
|
+
}
|
|
1890
|
+
) : /* @__PURE__ */ jsx(
|
|
1891
|
+
Body1Strong,
|
|
1892
|
+
{
|
|
1893
|
+
style: { wordBreak: "break-word" },
|
|
1894
|
+
children: mergedLabels.totalPriceMissing
|
|
1895
|
+
}
|
|
1896
|
+
)
|
|
1897
|
+
]
|
|
1898
|
+
}
|
|
1899
|
+
),
|
|
1900
|
+
/* @__PURE__ */ jsx(
|
|
1901
|
+
Button,
|
|
1902
|
+
{
|
|
1903
|
+
onClick: onSelectTicket,
|
|
1904
|
+
appearance: "primary",
|
|
1905
|
+
style: isVerifyingTicket || departureItem?.availableTicket <= 0 ? { flexShrink: 0 } : { backgroundColor: brandColors["60"], flexShrink: 0 },
|
|
1906
|
+
size: "medium",
|
|
1907
|
+
shape: "circular",
|
|
1908
|
+
icon: isVerifyingTicket ? null : /* @__PURE__ */ jsx(Icon, { icon: "fluent:ticket-diagonal-24-filled" }),
|
|
1909
|
+
disabled: isVerifyingTicket || departureItem?.availableTicket <= 0,
|
|
1910
|
+
children: isVerifyingTicket ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1911
|
+
/* @__PURE__ */ jsx(
|
|
1912
|
+
Spinner,
|
|
1913
|
+
{
|
|
1914
|
+
size: "extra-tiny",
|
|
1915
|
+
style: { marginRight: "5px" }
|
|
1916
|
+
}
|
|
1917
|
+
),
|
|
1918
|
+
" ",
|
|
1919
|
+
mergedLabels.verifyingTicketButton
|
|
1920
|
+
] }) : buttonText || mergedLabels.selectTicketButton
|
|
1921
|
+
}
|
|
1922
|
+
)
|
|
1923
|
+
] }),
|
|
1924
|
+
/* @__PURE__ */ jsxs("div", { className: styles.facilitiesSection, children: [
|
|
1925
|
+
/* @__PURE__ */ jsx(Subtitle2, { children: mergedLabels.facilitiesLabel }),
|
|
1926
|
+
/* @__PURE__ */ jsx("div", { className: styles.facilitiesList, children: departureItem?.provider?.facilities.map((facility, idx) => /* @__PURE__ */ jsxs("div", { className: styles.facilityItem, children: [
|
|
1927
|
+
/* @__PURE__ */ jsx(Icon, { icon: "fluent:checkmark-circle-24-filled" }),
|
|
1928
|
+
/* @__PURE__ */ jsx(Caption1Strong, { children: facility })
|
|
1929
|
+
] }, idx)) })
|
|
1930
|
+
] })
|
|
1682
1931
|
] }),
|
|
1683
|
-
/* @__PURE__ */ jsx(
|
|
1684
|
-
|
|
1685
|
-
|
|
1686
|
-
|
|
1687
|
-
|
|
1688
|
-
|
|
1689
|
-
|
|
1690
|
-
|
|
1691
|
-
/* @__PURE__ */ jsxs(
|
|
1692
|
-
"div",
|
|
1693
|
-
{
|
|
1694
|
-
style: {
|
|
1695
|
-
display: "flex",
|
|
1696
|
-
flexDirection: "column",
|
|
1697
|
-
gap: "0.25rem"
|
|
1932
|
+
/* @__PURE__ */ jsx(Visible, { xl: true, xxl: true, xxxl: true, children: Array.from({ length: circularVerticalConfig.count }).map(
|
|
1933
|
+
(_, index) => /* @__PURE__ */ jsx(
|
|
1934
|
+
"div",
|
|
1935
|
+
{
|
|
1936
|
+
className: styles.circularRight,
|
|
1937
|
+
style: {
|
|
1938
|
+
top: `${circularVerticalConfig.top + index * circularVerticalConfig.spacing}px`
|
|
1939
|
+
}
|
|
1698
1940
|
},
|
|
1699
|
-
|
|
1700
|
-
|
|
1701
|
-
|
|
1702
|
-
|
|
1703
|
-
|
|
1704
|
-
|
|
1705
|
-
display: "flex",
|
|
1706
|
-
flex: "column",
|
|
1707
|
-
justifyContent: "end"
|
|
1708
|
-
},
|
|
1709
|
-
children: departureItem?.billingDetail?.total?.formatted
|
|
1710
|
-
}
|
|
1711
|
-
)
|
|
1712
|
-
]
|
|
1713
|
-
}
|
|
1714
|
-
),
|
|
1715
|
-
/* @__PURE__ */ jsx(
|
|
1716
|
-
Button,
|
|
1717
|
-
{
|
|
1718
|
-
onClick: onSelectTicket,
|
|
1719
|
-
appearance: "primary",
|
|
1720
|
-
style: isVerifyingTicket || departureItem?.availableTicket <= 0 ? void 0 : { backgroundColor: brandColors["60"] },
|
|
1721
|
-
size: "medium",
|
|
1722
|
-
shape: "circular",
|
|
1723
|
-
icon: isVerifyingTicket ? null : /* @__PURE__ */ jsx(Icon, { icon: "fluent:ticket-diagonal-24-filled" }),
|
|
1724
|
-
disabled: isVerifyingTicket || departureItem?.availableTicket <= 0,
|
|
1725
|
-
children: isVerifyingTicket ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1726
|
-
/* @__PURE__ */ jsx(Spinner, { size: "extra-tiny", style: { marginRight: "5px" } }),
|
|
1727
|
-
" ",
|
|
1728
|
-
mergedLabels.verifyingTicketButton
|
|
1729
|
-
] }) : buttonText || mergedLabels.selectTicketButton
|
|
1730
|
-
}
|
|
1731
|
-
)
|
|
1732
|
-
] }),
|
|
1733
|
-
/* @__PURE__ */ jsxs("div", { className: styles.facilitiesSection, children: [
|
|
1734
|
-
/* @__PURE__ */ jsx(Subtitle2, { children: mergedLabels.facilitiesLabel }),
|
|
1735
|
-
/* @__PURE__ */ jsx("div", { className: styles.facilitiesList, children: departureItem?.provider?.facilities.map((facility, idx) => /* @__PURE__ */ jsxs("div", { className: styles.facilityItem, children: [
|
|
1736
|
-
/* @__PURE__ */ jsx(Icon, { icon: "fluent:checkmark-circle-24-filled" }),
|
|
1737
|
-
/* @__PURE__ */ jsx(Caption1Strong, { children: facility })
|
|
1738
|
-
] }, idx)) })
|
|
1739
|
-
] })
|
|
1740
|
-
] }),
|
|
1741
|
-
/* @__PURE__ */ jsx(Visible, { xl: true, xxl: true, xxxl: true, children: Array.from({ length: circularVerticalConfig.count }).map(
|
|
1742
|
-
(_, index) => /* @__PURE__ */ jsx(
|
|
1743
|
-
"div",
|
|
1744
|
-
{
|
|
1745
|
-
className: styles.circularRight,
|
|
1746
|
-
style: {
|
|
1747
|
-
top: `${circularVerticalConfig.top + index * circularVerticalConfig.spacing}px`
|
|
1748
|
-
}
|
|
1749
|
-
},
|
|
1750
|
-
index
|
|
1751
|
-
)
|
|
1752
|
-
) })
|
|
1753
|
-
] })
|
|
1941
|
+
index
|
|
1942
|
+
)
|
|
1943
|
+
) })
|
|
1944
|
+
]
|
|
1945
|
+
}
|
|
1946
|
+
)
|
|
1754
1947
|
}
|
|
1755
1948
|
)
|
|
1756
1949
|
] });
|
|
@@ -14669,7 +14862,7 @@ var CardAddon = ({
|
|
|
14669
14862
|
/* @__PURE__ */ jsxs(Caption1Stronger, { children: [
|
|
14670
14863
|
mergedLabels.currencySymbol,
|
|
14671
14864
|
" ",
|
|
14672
|
-
footerData.price
|
|
14865
|
+
footerData.price?.toLocaleString(
|
|
14673
14866
|
language === "id" ? "id-ID" : "en-US"
|
|
14674
14867
|
),
|
|
14675
14868
|
footerData.priceUnit
|
|
@@ -14820,7 +15013,7 @@ var CardAddon = ({
|
|
|
14820
15013
|
/* @__PURE__ */ jsxs(Subtitle1, { style: { fontSize: tokens.fontSizeBase600 }, children: [
|
|
14821
15014
|
mergedLabels.currencySymbol,
|
|
14822
15015
|
" ",
|
|
14823
|
-
footerData.price
|
|
15016
|
+
footerData.price?.toLocaleString(
|
|
14824
15017
|
language === "id" ? "id-ID" : "en-US"
|
|
14825
15018
|
)
|
|
14826
15019
|
] })
|
|
@@ -15170,7 +15363,8 @@ var CardReview = ({
|
|
|
15170
15363
|
items,
|
|
15171
15364
|
children,
|
|
15172
15365
|
className,
|
|
15173
|
-
headerAction
|
|
15366
|
+
headerAction,
|
|
15367
|
+
isLoading = false
|
|
15174
15368
|
}) => {
|
|
15175
15369
|
const styles = useStyles33();
|
|
15176
15370
|
const mergedLabels = { ...DEFAULT_LABELS32[language], ...labels };
|
|
@@ -15181,39 +15375,60 @@ var CardReview = ({
|
|
|
15181
15375
|
headerAction && /* @__PURE__ */ jsx("div", { children: headerAction })
|
|
15182
15376
|
] }),
|
|
15183
15377
|
/* @__PURE__ */ jsxs("div", { className: styles.contentContainer, children: [
|
|
15184
|
-
|
|
15185
|
-
|
|
15186
|
-
|
|
15187
|
-
{
|
|
15188
|
-
|
|
15189
|
-
|
|
15190
|
-
|
|
15191
|
-
|
|
15192
|
-
|
|
15193
|
-
|
|
15194
|
-
|
|
15195
|
-
|
|
15196
|
-
|
|
15197
|
-
|
|
15198
|
-
|
|
15199
|
-
|
|
15200
|
-
|
|
15201
|
-
|
|
15202
|
-
|
|
15203
|
-
|
|
15204
|
-
|
|
15205
|
-
|
|
15206
|
-
|
|
15207
|
-
|
|
15208
|
-
|
|
15209
|
-
|
|
15210
|
-
|
|
15211
|
-
|
|
15212
|
-
|
|
15213
|
-
|
|
15214
|
-
|
|
15215
|
-
|
|
15216
|
-
|
|
15378
|
+
isLoading ? /* @__PURE__ */ jsx(Fragment, { children: Array.from({ length: 4 }).map((_, index) => /* @__PURE__ */ jsx("div", { className: styles.row, children: /* @__PURE__ */ jsxs(
|
|
15379
|
+
Skeleton,
|
|
15380
|
+
{
|
|
15381
|
+
style: { width: "100%", display: "flex", gap: "1rem" },
|
|
15382
|
+
children: [
|
|
15383
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "40%", height: "16px" } }),
|
|
15384
|
+
/* @__PURE__ */ jsx(
|
|
15385
|
+
SkeletonItem,
|
|
15386
|
+
{
|
|
15387
|
+
style: { width: "30%", height: "16px", marginLeft: "auto" }
|
|
15388
|
+
}
|
|
15389
|
+
)
|
|
15390
|
+
]
|
|
15391
|
+
}
|
|
15392
|
+
) }, index)) }) : /* @__PURE__ */ jsx(Fragment, { children: items?.map((item, index) => /* @__PURE__ */ jsxs(
|
|
15393
|
+
"div",
|
|
15394
|
+
{
|
|
15395
|
+
className: `${styles.row} ${item.className || ""}`,
|
|
15396
|
+
children: [
|
|
15397
|
+
typeof item.label === "string" ? /* @__PURE__ */ jsx(
|
|
15398
|
+
Caption1,
|
|
15399
|
+
{
|
|
15400
|
+
className: `${styles.defaultLabel} ${item.labelClassName || ""}`,
|
|
15401
|
+
children: item.label
|
|
15402
|
+
}
|
|
15403
|
+
) : (
|
|
15404
|
+
// Clone element to append className if it's a valid React element
|
|
15405
|
+
React.isValidElement(item.label) ? React.cloneElement(item.label, {
|
|
15406
|
+
className: `${styles.defaultLabel} ${item.labelClassName || ""}${item.label.props.className ? " " + item.label.props.className : ""}`
|
|
15407
|
+
}) : /* @__PURE__ */ jsx(
|
|
15408
|
+
"div",
|
|
15409
|
+
{
|
|
15410
|
+
className: `${styles.defaultLabel} ${item.labelClassName || ""}`,
|
|
15411
|
+
children: item.label
|
|
15412
|
+
}
|
|
15413
|
+
)
|
|
15414
|
+
),
|
|
15415
|
+
typeof item.value === "string" || typeof item.value === "number" ? /* @__PURE__ */ jsx(
|
|
15416
|
+
Body1,
|
|
15417
|
+
{
|
|
15418
|
+
className: `${styles.defaultValue} ${item.valueClassName || ""}`,
|
|
15419
|
+
children: item.value
|
|
15420
|
+
}
|
|
15421
|
+
) : /* @__PURE__ */ jsx(
|
|
15422
|
+
"div",
|
|
15423
|
+
{
|
|
15424
|
+
className: `${styles.defaultValue} ${item.valueClassName || ""}`,
|
|
15425
|
+
children: item.value
|
|
15426
|
+
}
|
|
15427
|
+
)
|
|
15428
|
+
]
|
|
15429
|
+
},
|
|
15430
|
+
index
|
|
15431
|
+
)) }),
|
|
15217
15432
|
children
|
|
15218
15433
|
] })
|
|
15219
15434
|
] });
|
|
@@ -15302,7 +15517,8 @@ var CardReviewPassenger = ({
|
|
|
15302
15517
|
labels,
|
|
15303
15518
|
title,
|
|
15304
15519
|
passengers,
|
|
15305
|
-
className
|
|
15520
|
+
className,
|
|
15521
|
+
isLoading = false
|
|
15306
15522
|
}) => {
|
|
15307
15523
|
const styles = useStyles34();
|
|
15308
15524
|
const mergedLabels = { ...DEFAULT_LABELS33[language], ...labels };
|
|
@@ -15312,7 +15528,13 @@ var CardReviewPassenger = ({
|
|
|
15312
15528
|
/* @__PURE__ */ jsx(Subtitle1, { children: displayTitle }),
|
|
15313
15529
|
/* @__PURE__ */ jsx(Divider, { className: styles.titleDivider })
|
|
15314
15530
|
] }) }),
|
|
15315
|
-
|
|
15531
|
+
isLoading ? Array.from({ length: 2 }).map((_, index) => /* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsx(Card, { className: styles.passengerCard, children: /* @__PURE__ */ jsxs(Row, { nogutter: true, className: styles.passengerRow, children: [
|
|
15532
|
+
/* @__PURE__ */ jsx(Col, { children: /* @__PURE__ */ jsxs(Skeleton, { children: [
|
|
15533
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "180px", height: "18px", marginBottom: "8px" } }),
|
|
15534
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "220px", height: "16px" } })
|
|
15535
|
+
] }) }),
|
|
15536
|
+
/* @__PURE__ */ jsx(Col, { xs: "content", children: /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "90px", height: "32px" } }) }) })
|
|
15537
|
+
] }) }) }, index)) : passengers.map((passenger, index) => {
|
|
15316
15538
|
const badgeConfig = getBadgeConfig(passenger.serviceClass);
|
|
15317
15539
|
const passengerMeta = `${passenger.ageLabel} \xB7 ${mergedLabels.idNumber} ${passenger.identityNumber}`;
|
|
15318
15540
|
return /* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsx(Card, { className: styles.passengerCard, children: /* @__PURE__ */ jsxs(Row, { nogutter: true, className: styles.passengerRow, children: [
|
|
@@ -15355,7 +15577,9 @@ var DEFAULT_LABELS34 = {
|
|
|
15355
15577
|
addOnLabel: "Add On",
|
|
15356
15578
|
viewDetail: "Lihat Detail",
|
|
15357
15579
|
noAddOnsLabel: "Tidak ada layanan",
|
|
15358
|
-
serviceLabel: "Layanan"
|
|
15580
|
+
serviceLabel: "Layanan",
|
|
15581
|
+
departureLabel: "Pulang Pergi (Keberangkatan)",
|
|
15582
|
+
returnLabel: "Pulang Pergi (Kepulangan)"
|
|
15359
15583
|
},
|
|
15360
15584
|
en: {
|
|
15361
15585
|
title: "Booking Details",
|
|
@@ -15367,7 +15591,9 @@ var DEFAULT_LABELS34 = {
|
|
|
15367
15591
|
addOnLabel: "Add On",
|
|
15368
15592
|
viewDetail: "View Details",
|
|
15369
15593
|
noAddOnsLabel: "No services",
|
|
15370
|
-
serviceLabel: "Service"
|
|
15594
|
+
serviceLabel: "Service",
|
|
15595
|
+
departureLabel: "Round Trip (Departure)",
|
|
15596
|
+
returnLabel: "Round Trip (Return)"
|
|
15371
15597
|
}
|
|
15372
15598
|
};
|
|
15373
15599
|
var useStyles35 = makeStyles({
|
|
@@ -15390,59 +15616,211 @@ var useStyles35 = makeStyles({
|
|
|
15390
15616
|
alignItems: "center",
|
|
15391
15617
|
justifyContent: "space-between",
|
|
15392
15618
|
width: "100%"
|
|
15619
|
+
},
|
|
15620
|
+
badgeLilac: {
|
|
15621
|
+
borderRadius: tokens.borderRadiusXLarge,
|
|
15622
|
+
border: `0px solid ${sharedColors.Shared_Lilac_Tint_40}`,
|
|
15623
|
+
color: sharedColors.Shared_Lilac_Primary,
|
|
15624
|
+
backgroundColor: sharedColors.Shared_Lilac_Tint_60
|
|
15625
|
+
},
|
|
15626
|
+
badgeOrange: {
|
|
15627
|
+
borderRadius: tokens.borderRadiusXLarge,
|
|
15628
|
+
border: `0px solid ${tokens.colorStatusWarningForeground2}`,
|
|
15629
|
+
color: tokens.colorStatusWarningForeground2,
|
|
15630
|
+
backgroundColor: sharedColors.Shared_Orange_Tint_60
|
|
15393
15631
|
}
|
|
15394
15632
|
});
|
|
15633
|
+
var TripSection = ({ data, label, badgeClassName, mergedLabels, onViewAddOns }) => {
|
|
15634
|
+
const styles = useStyles35();
|
|
15635
|
+
return /* @__PURE__ */ jsxs(Row, { nogutter: true, direction: "column", style: { gap: tokens.spacingHorizontalL }, children: [
|
|
15636
|
+
label && /* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsx(
|
|
15637
|
+
Badge,
|
|
15638
|
+
{
|
|
15639
|
+
size: "extra-large",
|
|
15640
|
+
appearance: "tint",
|
|
15641
|
+
shape: "circular",
|
|
15642
|
+
className: badgeClassName,
|
|
15643
|
+
children: label
|
|
15644
|
+
}
|
|
15645
|
+
) }),
|
|
15646
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsxs(Row, { className: styles.fieldRow, children: [
|
|
15647
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */ jsx(Field, { label: mergedLabels.fromLabel, children: /* @__PURE__ */ jsx(Body1Strong, { children: data.from }) }) }),
|
|
15648
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */ jsx(Field, { label: mergedLabels.toLabel, children: /* @__PURE__ */ jsx(Body1Strong, { children: data.to }) }) })
|
|
15649
|
+
] }) }),
|
|
15650
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsxs(Row, { className: styles.fieldRow, children: [
|
|
15651
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */ jsx(Field, { label: mergedLabels.scheduleLabel, children: /* @__PURE__ */ jsx(Body1Strong, { children: data.scheduleTime }) }) }),
|
|
15652
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */ jsx(Field, { label: mergedLabels.bookingNameLabel, children: /* @__PURE__ */ jsx(Body1Strong, { children: data.bookingName }) }) })
|
|
15653
|
+
] }) }),
|
|
15654
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsxs(Row, { className: styles.fieldRow, children: [
|
|
15655
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */ jsx(Field, { label: mergedLabels.passengerTypeLabel, children: /* @__PURE__ */ jsx(Body1Strong, { children: data.passengerType }) }) }),
|
|
15656
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */ jsx(Field, { label: mergedLabels.addOnLabel, children: /* @__PURE__ */ jsxs("div", { className: styles.addOnRow, children: [
|
|
15657
|
+
/* @__PURE__ */ jsx(Body1Strong, { children: data.addOnsCount === 0 ? mergedLabels.noAddOnsLabel : `${data.addOnsCount} ${data.addOnsCount === 1 ? mergedLabels.serviceLabel : mergedLabels.serviceLabel}` }),
|
|
15658
|
+
data.addOnsCount > 0 && /* @__PURE__ */ jsx(
|
|
15659
|
+
Button,
|
|
15660
|
+
{
|
|
15661
|
+
appearance: "transparent",
|
|
15662
|
+
onClick: onViewAddOns,
|
|
15663
|
+
style: { color: brandColors[80] },
|
|
15664
|
+
children: mergedLabels.viewDetail
|
|
15665
|
+
}
|
|
15666
|
+
)
|
|
15667
|
+
] }) }) })
|
|
15668
|
+
] }) })
|
|
15669
|
+
] });
|
|
15670
|
+
};
|
|
15395
15671
|
var CardReviewDetail = ({
|
|
15396
15672
|
language = "id",
|
|
15397
15673
|
labels,
|
|
15398
|
-
|
|
15399
|
-
|
|
15400
|
-
scheduleTime,
|
|
15401
|
-
bookingName,
|
|
15402
|
-
passengerType,
|
|
15403
|
-
addOnsCount,
|
|
15674
|
+
departureData,
|
|
15675
|
+
returnData,
|
|
15404
15676
|
onViewAddOns,
|
|
15405
|
-
className
|
|
15677
|
+
className,
|
|
15678
|
+
isLoading = false,
|
|
15679
|
+
isRoundTrip = false
|
|
15406
15680
|
}) => {
|
|
15407
15681
|
const styles = useStyles35();
|
|
15408
15682
|
const mergedLabels = { ...DEFAULT_LABELS34[language], ...labels };
|
|
15409
|
-
return /* @__PURE__ */ jsx(Card, { className: `${styles.card} ${className || ""}`, children: /* @__PURE__ */ jsxs(
|
|
15683
|
+
return /* @__PURE__ */ jsx(Card, { className: `${styles.card} ${className || ""}`, children: isLoading ? /* @__PURE__ */ jsxs(
|
|
15410
15684
|
Row,
|
|
15411
15685
|
{
|
|
15412
15686
|
nogutter: true,
|
|
15413
15687
|
direction: "column",
|
|
15414
15688
|
style: { gap: tokens.spacingHorizontalL },
|
|
15415
15689
|
children: [
|
|
15416
|
-
/* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */
|
|
15417
|
-
/* @__PURE__ */ jsx(Subtitle1, { children: mergedLabels.title }),
|
|
15418
|
-
/* @__PURE__ */ jsx(Divider, { style: { width: 0 } })
|
|
15419
|
-
] }) }),
|
|
15690
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "30%", height: "24px" } }) }) }),
|
|
15420
15691
|
/* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsxs(Row, { className: styles.fieldRow, children: [
|
|
15421
|
-
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */
|
|
15422
|
-
|
|
15692
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */ jsxs(Skeleton, { children: [
|
|
15693
|
+
/* @__PURE__ */ jsx(
|
|
15694
|
+
SkeletonItem,
|
|
15695
|
+
{
|
|
15696
|
+
style: {
|
|
15697
|
+
width: "100%",
|
|
15698
|
+
height: "20px",
|
|
15699
|
+
marginBottom: "8px"
|
|
15700
|
+
}
|
|
15701
|
+
}
|
|
15702
|
+
),
|
|
15703
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80%", height: "20px" } })
|
|
15704
|
+
] }) }),
|
|
15705
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */ jsxs(Skeleton, { children: [
|
|
15706
|
+
/* @__PURE__ */ jsx(
|
|
15707
|
+
SkeletonItem,
|
|
15708
|
+
{
|
|
15709
|
+
style: {
|
|
15710
|
+
width: "100%",
|
|
15711
|
+
height: "20px",
|
|
15712
|
+
marginBottom: "8px"
|
|
15713
|
+
}
|
|
15714
|
+
}
|
|
15715
|
+
),
|
|
15716
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80%", height: "20px" } })
|
|
15717
|
+
] }) })
|
|
15423
15718
|
] }) }),
|
|
15424
15719
|
/* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsxs(Row, { className: styles.fieldRow, children: [
|
|
15425
|
-
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */
|
|
15426
|
-
|
|
15720
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */ jsxs(Skeleton, { children: [
|
|
15721
|
+
/* @__PURE__ */ jsx(
|
|
15722
|
+
SkeletonItem,
|
|
15723
|
+
{
|
|
15724
|
+
style: {
|
|
15725
|
+
width: "100%",
|
|
15726
|
+
height: "20px",
|
|
15727
|
+
marginBottom: "8px"
|
|
15728
|
+
}
|
|
15729
|
+
}
|
|
15730
|
+
),
|
|
15731
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80%", height: "20px" } })
|
|
15732
|
+
] }) }),
|
|
15733
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */ jsxs(Skeleton, { children: [
|
|
15734
|
+
/* @__PURE__ */ jsx(
|
|
15735
|
+
SkeletonItem,
|
|
15736
|
+
{
|
|
15737
|
+
style: {
|
|
15738
|
+
width: "100%",
|
|
15739
|
+
height: "20px",
|
|
15740
|
+
marginBottom: "8px"
|
|
15741
|
+
}
|
|
15742
|
+
}
|
|
15743
|
+
),
|
|
15744
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80%", height: "20px" } })
|
|
15745
|
+
] }) })
|
|
15427
15746
|
] }) }),
|
|
15428
15747
|
/* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsxs(Row, { className: styles.fieldRow, children: [
|
|
15429
|
-
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */
|
|
15430
|
-
|
|
15431
|
-
|
|
15432
|
-
addOnsCount > 0 && /* @__PURE__ */ jsx(
|
|
15433
|
-
Button,
|
|
15748
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */ jsxs(Skeleton, { children: [
|
|
15749
|
+
/* @__PURE__ */ jsx(
|
|
15750
|
+
SkeletonItem,
|
|
15434
15751
|
{
|
|
15435
|
-
|
|
15436
|
-
|
|
15437
|
-
|
|
15438
|
-
|
|
15752
|
+
style: {
|
|
15753
|
+
width: "100%",
|
|
15754
|
+
height: "20px",
|
|
15755
|
+
marginBottom: "8px"
|
|
15756
|
+
}
|
|
15439
15757
|
}
|
|
15440
|
-
)
|
|
15441
|
-
|
|
15758
|
+
),
|
|
15759
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80%", height: "20px" } })
|
|
15760
|
+
] }) }),
|
|
15761
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, sm: 12, md: 6, children: /* @__PURE__ */ jsxs(Skeleton, { children: [
|
|
15762
|
+
/* @__PURE__ */ jsx(
|
|
15763
|
+
SkeletonItem,
|
|
15764
|
+
{
|
|
15765
|
+
style: {
|
|
15766
|
+
width: "100%",
|
|
15767
|
+
height: "20px",
|
|
15768
|
+
marginBottom: "8px"
|
|
15769
|
+
}
|
|
15770
|
+
}
|
|
15771
|
+
),
|
|
15772
|
+
/* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80%", height: "20px" } })
|
|
15773
|
+
] }) })
|
|
15442
15774
|
] }) })
|
|
15443
15775
|
]
|
|
15444
15776
|
}
|
|
15445
|
-
)
|
|
15777
|
+
) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
15778
|
+
/* @__PURE__ */ jsxs(
|
|
15779
|
+
Row,
|
|
15780
|
+
{
|
|
15781
|
+
nogutter: true,
|
|
15782
|
+
direction: "column",
|
|
15783
|
+
style: { gap: tokens.spacingHorizontalL },
|
|
15784
|
+
children: [
|
|
15785
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsxs(Row, { nogutter: true, className: styles.titleRow, children: [
|
|
15786
|
+
/* @__PURE__ */ jsx(Subtitle1, { children: mergedLabels.title }),
|
|
15787
|
+
/* @__PURE__ */ jsx(Divider, { style: { width: 0 } })
|
|
15788
|
+
] }) }),
|
|
15789
|
+
/* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsx(
|
|
15790
|
+
TripSection,
|
|
15791
|
+
{
|
|
15792
|
+
data: departureData,
|
|
15793
|
+
label: isRoundTrip ? mergedLabels.departureLabel : void 0,
|
|
15794
|
+
badgeClassName: isRoundTrip ? styles.badgeLilac : void 0,
|
|
15795
|
+
mergedLabels,
|
|
15796
|
+
onViewAddOns
|
|
15797
|
+
}
|
|
15798
|
+
) })
|
|
15799
|
+
]
|
|
15800
|
+
}
|
|
15801
|
+
),
|
|
15802
|
+
isRoundTrip && returnData && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
15803
|
+
/* @__PURE__ */ jsx(Divider, { style: { margin: `${tokens.spacingHorizontalL} 0` } }),
|
|
15804
|
+
/* @__PURE__ */ jsx(
|
|
15805
|
+
Row,
|
|
15806
|
+
{
|
|
15807
|
+
nogutter: true,
|
|
15808
|
+
direction: "column",
|
|
15809
|
+
style: { gap: tokens.spacingHorizontalL },
|
|
15810
|
+
children: /* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsx(
|
|
15811
|
+
TripSection,
|
|
15812
|
+
{
|
|
15813
|
+
data: returnData,
|
|
15814
|
+
label: mergedLabels.returnLabel,
|
|
15815
|
+
badgeClassName: styles.badgeOrange,
|
|
15816
|
+
mergedLabels,
|
|
15817
|
+
onViewAddOns
|
|
15818
|
+
}
|
|
15819
|
+
) })
|
|
15820
|
+
}
|
|
15821
|
+
)
|
|
15822
|
+
] })
|
|
15823
|
+
] }) });
|
|
15446
15824
|
};
|
|
15447
15825
|
|
|
15448
15826
|
// src/components/CardPriceDetails/CardPriceDetails.constants.ts
|