@asdp/ferryui 0.1.22-dev.10214 → 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.
Files changed (7) hide show
  1. package/dist/index.d.mts +1 -0
  2. package/dist/index.d.ts +1 -0
  3. package/dist/index.js +299 -109
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +299 -109
  6. package/dist/index.mjs.map +1 -1
  7. package/package.json +1 -1
package/dist/index.mjs CHANGED
@@ -1154,7 +1154,8 @@ var DEFAULT_LABELS5 = {
1154
1154
  timezoneLabel: "WIB",
1155
1155
  currencySymbol: "IDR",
1156
1156
  logoAlt: "Logo ASDP",
1157
- verifyingTicketButton: "Memeriksa Tiket"
1157
+ verifyingTicketButton: "Memeriksa Tiket",
1158
+ totalPriceMissing: "Lengkapi manifest barang lepas untuk melihat harga"
1158
1159
  },
1159
1160
  en: {
1160
1161
  availableSeatsLabel: "Available",
@@ -1168,7 +1169,8 @@ var DEFAULT_LABELS5 = {
1168
1169
  timezoneLabel: "WIB",
1169
1170
  currencySymbol: "IDR",
1170
1171
  logoAlt: "ASDP Logo",
1171
- verifyingTicketButton: "Verifying Ticket"
1172
+ verifyingTicketButton: "Verifying Ticket",
1173
+ totalPriceMissing: "Please complete the cargo manifest to see the price"
1172
1174
  }
1173
1175
  };
1174
1176
 
@@ -1304,7 +1306,6 @@ var useStyles5 = makeStyles({
1304
1306
  display: "flex",
1305
1307
  justifyContent: "space-between",
1306
1308
  alignItems: "center",
1307
- flexWrap: "wrap",
1308
1309
  [`@media (max-width: ${extendedTokens.breakpointMd})`]: {
1309
1310
  padding: "1rem"
1310
1311
  }
@@ -1419,10 +1420,38 @@ var CardTicket = ({
1419
1420
  justifyContent: "center",
1420
1421
  gap: "1rem"
1421
1422
  },
1422
- children: /* @__PURE__ */ jsxs(Skeleton, { style: { display: "flex", flexDirection: "column", alignItems: "center" }, children: [
1423
- /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "60px", height: "60px", borderRadius: "50%" } }),
1424
- /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "100px", height: "20px", marginTop: "1rem" } })
1425
- ] })
1423
+ children: /* @__PURE__ */ jsxs(
1424
+ Skeleton,
1425
+ {
1426
+ style: {
1427
+ display: "flex",
1428
+ flexDirection: "column",
1429
+ alignItems: "center"
1430
+ },
1431
+ children: [
1432
+ /* @__PURE__ */ jsx(
1433
+ SkeletonItem,
1434
+ {
1435
+ style: {
1436
+ width: "60px",
1437
+ height: "60px",
1438
+ borderRadius: "50%"
1439
+ }
1440
+ }
1441
+ ),
1442
+ /* @__PURE__ */ jsx(
1443
+ SkeletonItem,
1444
+ {
1445
+ style: {
1446
+ width: "100px",
1447
+ height: "20px",
1448
+ marginTop: "1rem"
1449
+ }
1450
+ }
1451
+ )
1452
+ ]
1453
+ }
1454
+ )
1426
1455
  }
1427
1456
  ) }) : /* @__PURE__ */ jsxs(Row, { style: { height: "100%" }, children: [
1428
1457
  /* @__PURE__ */ jsx(
@@ -1451,7 +1480,10 @@ var CardTicket = ({
1451
1480
  {
1452
1481
  size: "large",
1453
1482
  appearance: "filled",
1454
- style: { backgroundColor: departureItem?.availableTicket <= 0 ? tokens.colorNeutralForeground3 : departureItem?.provider?.serviceColor, padding: "0.5rem" },
1483
+ style: {
1484
+ backgroundColor: departureItem?.availableTicket <= 0 ? tokens.colorNeutralForeground3 : departureItem?.provider?.serviceColor,
1485
+ padding: "0.5rem"
1486
+ },
1455
1487
  iconPosition: "before",
1456
1488
  shape: "rounded",
1457
1489
  icon: /* @__PURE__ */ jsx(Icon, { icon: "fluent:info-24-regular" }),
@@ -1567,29 +1599,117 @@ var CardTicket = ({
1567
1599
  xxl: 4.5,
1568
1600
  xxxl: 4.5,
1569
1601
  style: { padding: 0, margin: 0 },
1570
- children: /* @__PURE__ */ jsx(Card, { className: styles.ticketMiddleCard, children: isLoading ? /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", height: "100%", justifyContent: "space-between" }, children: [
1571
- /* @__PURE__ */ jsx(Visible, { lg: true, xl: true, xxl: true, xxxl: true, children: /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "28px", borderRadius: "4px" } }) }) }),
1572
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("div", { className: styles.ticketInfo, children: [
1573
- /* @__PURE__ */ jsx("div", { className: styles.ticketTime, children: /* @__PURE__ */ jsxs(Skeleton, { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [
1574
- /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "60px", height: "14px" } }),
1575
- /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "28px" } }),
1576
- /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "120px", height: "14px" } })
1577
- ] }) }),
1578
- /* @__PURE__ */ jsxs("div", { className: styles.ticketDuration, children: [
1579
- /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "16px", marginBottom: "8px" } }) }),
1580
- /* @__PURE__ */ jsx("div", { className: styles.dividerContainer, children: /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "120px", height: "2px" } }) }) })
1581
- ] }),
1582
- /* @__PURE__ */ jsx("div", { className: styles.ticketTime, style: { alignItems: "flex-end" }, children: /* @__PURE__ */ jsxs(Skeleton, { style: { display: "flex", flexDirection: "column", alignItems: "flex-end", gap: "8px" }, children: [
1583
- /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "60px", height: "14px" } }),
1584
- /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "28px" } }),
1585
- /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "120px", height: "14px" } })
1586
- ] }) })
1587
- ] }) }),
1588
- /* @__PURE__ */ jsx("div", { className: styles.ticketButtons, children: /* @__PURE__ */ jsxs(Skeleton, { style: { display: "flex", gap: "1rem", width: "100%" }, children: [
1589
- /* @__PURE__ */ jsx(SkeletonItem, { style: { flex: 1, height: "32px", borderRadius: "16px" } }),
1590
- /* @__PURE__ */ jsx(SkeletonItem, { style: { flex: 1, height: "32px", borderRadius: "16px" } })
1591
- ] }) })
1592
- ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
1602
+ children: /* @__PURE__ */ jsx(Card, { className: styles.ticketMiddleCard, children: isLoading ? /* @__PURE__ */ jsxs(
1603
+ "div",
1604
+ {
1605
+ style: {
1606
+ display: "flex",
1607
+ flexDirection: "column",
1608
+ height: "100%",
1609
+ justifyContent: "space-between"
1610
+ },
1611
+ children: [
1612
+ /* @__PURE__ */ jsx(Visible, { lg: true, xl: true, xxl: true, xxxl: true, children: /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(
1613
+ SkeletonItem,
1614
+ {
1615
+ style: {
1616
+ width: "80px",
1617
+ height: "28px",
1618
+ borderRadius: "4px"
1619
+ }
1620
+ }
1621
+ ) }) }),
1622
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("div", { className: styles.ticketInfo, children: [
1623
+ /* @__PURE__ */ jsx("div", { className: styles.ticketTime, children: /* @__PURE__ */ jsxs(
1624
+ Skeleton,
1625
+ {
1626
+ style: {
1627
+ display: "flex",
1628
+ flexDirection: "column",
1629
+ gap: "8px"
1630
+ },
1631
+ children: [
1632
+ /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "60px", height: "14px" } }),
1633
+ /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "28px" } }),
1634
+ /* @__PURE__ */ jsx(
1635
+ SkeletonItem,
1636
+ {
1637
+ style: { width: "120px", height: "14px" }
1638
+ }
1639
+ )
1640
+ ]
1641
+ }
1642
+ ) }),
1643
+ /* @__PURE__ */ jsxs("div", { className: styles.ticketDuration, children: [
1644
+ /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(
1645
+ SkeletonItem,
1646
+ {
1647
+ style: {
1648
+ width: "80px",
1649
+ height: "16px",
1650
+ marginBottom: "8px"
1651
+ }
1652
+ }
1653
+ ) }),
1654
+ /* @__PURE__ */ jsx("div", { className: styles.dividerContainer, children: /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(
1655
+ SkeletonItem,
1656
+ {
1657
+ style: { width: "120px", height: "2px" }
1658
+ }
1659
+ ) }) })
1660
+ ] }),
1661
+ /* @__PURE__ */ jsx(
1662
+ "div",
1663
+ {
1664
+ className: styles.ticketTime,
1665
+ style: { alignItems: "flex-end" },
1666
+ children: /* @__PURE__ */ jsxs(
1667
+ Skeleton,
1668
+ {
1669
+ style: {
1670
+ display: "flex",
1671
+ flexDirection: "column",
1672
+ alignItems: "flex-end",
1673
+ gap: "8px"
1674
+ },
1675
+ children: [
1676
+ /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "60px", height: "14px" } }),
1677
+ /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "28px" } }),
1678
+ /* @__PURE__ */ jsx(
1679
+ SkeletonItem,
1680
+ {
1681
+ style: { width: "120px", height: "14px" }
1682
+ }
1683
+ )
1684
+ ]
1685
+ }
1686
+ )
1687
+ }
1688
+ )
1689
+ ] }) }),
1690
+ /* @__PURE__ */ jsx("div", { className: styles.ticketButtons, children: /* @__PURE__ */ jsxs(
1691
+ Skeleton,
1692
+ {
1693
+ style: { display: "flex", gap: "1rem", width: "100%" },
1694
+ children: [
1695
+ /* @__PURE__ */ jsx(
1696
+ SkeletonItem,
1697
+ {
1698
+ style: { flex: 1, height: "32px", borderRadius: "16px" }
1699
+ }
1700
+ ),
1701
+ /* @__PURE__ */ jsx(
1702
+ SkeletonItem,
1703
+ {
1704
+ style: { flex: 1, height: "32px", borderRadius: "16px" }
1705
+ }
1706
+ )
1707
+ ]
1708
+ }
1709
+ ) })
1710
+ ]
1711
+ }
1712
+ ) : /* @__PURE__ */ jsxs(Fragment, { children: [
1593
1713
  /* @__PURE__ */ jsx(Visible, { lg: true, xl: true, xxl: true, xxxl: true, children: /* @__PURE__ */ jsx(
1594
1714
  Badge,
1595
1715
  {
@@ -1617,7 +1737,13 @@ var CardTicket = ({
1617
1737
  " ",
1618
1738
  formatDuration(departureItem?.estimatedSailingMinute)
1619
1739
  ] }),
1620
- /* @__PURE__ */ jsx("div", { className: styles.dividerContainer, children: /* @__PURE__ */ jsx(Divider, { children: /* @__PURE__ */ jsx(Icon, { icon: "fluent:vehicle-ship-24-regular", height: 24 }) }) })
1740
+ /* @__PURE__ */ jsx("div", { className: styles.dividerContainer, children: /* @__PURE__ */ jsx(Divider, { children: /* @__PURE__ */ jsx(
1741
+ Icon,
1742
+ {
1743
+ icon: "fluent:vehicle-ship-24-regular",
1744
+ height: 24
1745
+ }
1746
+ ) }) })
1621
1747
  ] }),
1622
1748
  /* @__PURE__ */ jsxs("div", { className: styles.ticketTime, children: [
1623
1749
  /* @__PURE__ */ jsx(Caption1, { children: departureItem?.arrivedDay }),
@@ -1638,7 +1764,10 @@ var CardTicket = ({
1638
1764
  },
1639
1765
  icon: /* @__PURE__ */ jsx(Icon, { icon: "fluent:money-24-regular" }),
1640
1766
  size: "medium",
1641
- onClick: () => onPriceDetailClick(departureItem?.billingDetail, departureItem?.provider),
1767
+ onClick: () => onPriceDetailClick(
1768
+ departureItem?.billingDetail,
1769
+ departureItem?.provider
1770
+ ),
1642
1771
  children: mergedLabels.priceDetailsButton
1643
1772
  }
1644
1773
  ),
@@ -1673,84 +1802,145 @@ var CardTicket = ({
1673
1802
  xxl: 4.5,
1674
1803
  xxxl: 4.5,
1675
1804
  style: { padding: 0, margin: 0 },
1676
- children: /* @__PURE__ */ jsxs(Card, { className: styles.ticketRightCard, style: departureItem?.availableTicket <= 0 ? { background: "linear-gradient(75deg, #7A7A7A 0%, #4D4D4D 103.3%)" } : {}, children: [
1677
- isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
1678
- /* @__PURE__ */ jsxs("div", { className: styles.priceCard, children: [
1679
- /* @__PURE__ */ jsxs(Skeleton, { style: { display: "flex", flexDirection: "column", gap: "8px", flex: 1 }, children: [
1680
- /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "20px" } }),
1681
- /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "140px", height: "32px", borderRadius: "16px" } })
1805
+ children: /* @__PURE__ */ jsxs(
1806
+ Card,
1807
+ {
1808
+ className: styles.ticketRightCard,
1809
+ style: departureItem?.availableTicket <= 0 ? {
1810
+ background: "linear-gradient(75deg, #7A7A7A 0%, #4D4D4D 103.3%)"
1811
+ } : {},
1812
+ children: [
1813
+ isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
1814
+ /* @__PURE__ */ jsxs("div", { className: styles.priceCard, children: [
1815
+ /* @__PURE__ */ jsxs(
1816
+ Skeleton,
1817
+ {
1818
+ style: {
1819
+ display: "flex",
1820
+ flexDirection: "column",
1821
+ gap: "8px",
1822
+ flex: 1
1823
+ },
1824
+ children: [
1825
+ /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "20px" } }),
1826
+ /* @__PURE__ */ jsx(
1827
+ SkeletonItem,
1828
+ {
1829
+ style: {
1830
+ width: "140px",
1831
+ height: "32px",
1832
+ borderRadius: "16px"
1833
+ }
1834
+ }
1835
+ )
1836
+ ]
1837
+ }
1838
+ ),
1839
+ /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(
1840
+ SkeletonItem,
1841
+ {
1842
+ style: {
1843
+ width: "120px",
1844
+ height: "40px",
1845
+ borderRadius: "20px"
1846
+ }
1847
+ }
1848
+ ) })
1849
+ ] }),
1850
+ /* @__PURE__ */ jsxs("div", { className: styles.facilitiesSection, children: [
1851
+ /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(
1852
+ SkeletonItem,
1853
+ {
1854
+ style: {
1855
+ width: "80px",
1856
+ height: "20px",
1857
+ marginBottom: "8px"
1858
+ }
1859
+ }
1860
+ ) }),
1861
+ /* @__PURE__ */ jsx("div", { className: styles.facilitiesList, children: [1, 2, 3].map((i) => /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(
1862
+ SkeletonItem,
1863
+ {
1864
+ style: { width: "100px", height: "20px" }
1865
+ }
1866
+ ) }, i)) })
1867
+ ] })
1868
+ ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
1869
+ /* @__PURE__ */ jsxs("div", { className: styles.priceCard, children: [
1870
+ /* @__PURE__ */ jsxs(
1871
+ "div",
1872
+ {
1873
+ style: {
1874
+ display: "flex",
1875
+ flexDirection: "column",
1876
+ gap: "0.25rem",
1877
+ flex: 1,
1878
+ minWidth: 0
1879
+ },
1880
+ children: [
1881
+ /* @__PURE__ */ jsx(Subtitle2, { children: mergedLabels.totalPriceLabel }),
1882
+ departureItem?.billingDetail?.total?.formatted ? /* @__PURE__ */ jsx(
1883
+ Title3,
1884
+ {
1885
+ children: departureItem?.billingDetail?.total?.formatted
1886
+ }
1887
+ ) : /* @__PURE__ */ jsx(
1888
+ Body1Strong,
1889
+ {
1890
+ style: { wordBreak: "break-word" },
1891
+ children: mergedLabels.totalPriceMissing
1892
+ }
1893
+ )
1894
+ ]
1895
+ }
1896
+ ),
1897
+ /* @__PURE__ */ jsx(
1898
+ Button,
1899
+ {
1900
+ onClick: onSelectTicket,
1901
+ appearance: "primary",
1902
+ style: isVerifyingTicket || departureItem?.availableTicket <= 0 ? { flexShrink: 0 } : { backgroundColor: brandColors["60"], flexShrink: 0 },
1903
+ size: "medium",
1904
+ shape: "circular",
1905
+ icon: isVerifyingTicket ? null : /* @__PURE__ */ jsx(Icon, { icon: "fluent:ticket-diagonal-24-filled" }),
1906
+ disabled: isVerifyingTicket || departureItem?.availableTicket <= 0,
1907
+ children: isVerifyingTicket ? /* @__PURE__ */ jsxs(Fragment, { children: [
1908
+ /* @__PURE__ */ jsx(
1909
+ Spinner,
1910
+ {
1911
+ size: "extra-tiny",
1912
+ style: { marginRight: "5px" }
1913
+ }
1914
+ ),
1915
+ " ",
1916
+ mergedLabels.verifyingTicketButton
1917
+ ] }) : buttonText || mergedLabels.selectTicketButton
1918
+ }
1919
+ )
1920
+ ] }),
1921
+ /* @__PURE__ */ jsxs("div", { className: styles.facilitiesSection, children: [
1922
+ /* @__PURE__ */ jsx(Subtitle2, { children: mergedLabels.facilitiesLabel }),
1923
+ /* @__PURE__ */ jsx("div", { className: styles.facilitiesList, children: departureItem?.provider?.facilities.map((facility, idx) => /* @__PURE__ */ jsxs("div", { className: styles.facilityItem, children: [
1924
+ /* @__PURE__ */ jsx(Icon, { icon: "fluent:checkmark-circle-24-filled" }),
1925
+ /* @__PURE__ */ jsx(Caption1Strong, { children: facility })
1926
+ ] }, idx)) })
1927
+ ] })
1682
1928
  ] }),
1683
- /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "120px", height: "40px", borderRadius: "20px" } }) })
1684
- ] }),
1685
- /* @__PURE__ */ jsxs("div", { className: styles.facilitiesSection, children: [
1686
- /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "20px", marginBottom: "8px" } }) }),
1687
- /* @__PURE__ */ jsx("div", { className: styles.facilitiesList, children: [1, 2, 3].map((i) => /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "100px", height: "20px" } }) }, i)) })
1688
- ] })
1689
- ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
1690
- /* @__PURE__ */ jsxs("div", { className: styles.priceCard, children: [
1691
- /* @__PURE__ */ jsxs(
1692
- "div",
1693
- {
1694
- style: {
1695
- display: "flex",
1696
- flexDirection: "column",
1697
- gap: "0.25rem"
1929
+ /* @__PURE__ */ jsx(Visible, { xl: true, xxl: true, xxxl: true, children: Array.from({ length: circularVerticalConfig.count }).map(
1930
+ (_, index) => /* @__PURE__ */ jsx(
1931
+ "div",
1932
+ {
1933
+ className: styles.circularRight,
1934
+ style: {
1935
+ top: `${circularVerticalConfig.top + index * circularVerticalConfig.spacing}px`
1936
+ }
1698
1937
  },
1699
- children: [
1700
- /* @__PURE__ */ jsx(Subtitle2, { children: mergedLabels.totalPriceLabel }),
1701
- /* @__PURE__ */ jsx(
1702
- Title3,
1703
- {
1704
- style: {
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
- ] })
1938
+ index
1939
+ )
1940
+ ) })
1941
+ ]
1942
+ }
1943
+ )
1754
1944
  }
1755
1945
  )
1756
1946
  ] });