@asdp/ferryui 0.1.22-dev.9339 → 0.1.22-dev.9360

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 +164 -89
  2. package/dist/index.d.ts +164 -89
  3. package/dist/index.js +800 -503
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +798 -501
  6. package/dist/index.mjs.map +1 -1
  7. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -5415,7 +5415,9 @@ var DEFAULT_LABELS10 = {
5415
5415
  harborNotFound: "Pelabuhan tidak ditemukan",
5416
5416
  closeAriaLabel: "Tutup",
5417
5417
  popularHarborHeader: "Pelabuhan Populer",
5418
- favoriteHeader: "Favorit"
5418
+ favoriteHeader: "Favorit",
5419
+ emptyContent: "Pelabuhan",
5420
+ travelPlanHeader: "Rencana Perjalanan"
5419
5421
  },
5420
5422
  en: {
5421
5423
  title: "Select Harbor",
@@ -5427,10 +5429,113 @@ var DEFAULT_LABELS10 = {
5427
5429
  harborNotFound: "Harbor not found",
5428
5430
  closeAriaLabel: "Close",
5429
5431
  popularHarborHeader: "Popular Harbor",
5430
- favoriteHeader: "Favorite"
5432
+ favoriteHeader: "Favorite",
5433
+ emptyContent: "Harbor",
5434
+ travelPlanHeader: "Travel Plan"
5431
5435
  }
5432
5436
  };
5437
+
5438
+ // src/components/EmptyContent/EmptyContent.constants.ts
5439
+ var DEFAULT_LABELS11 = {
5440
+ id: {
5441
+ defaultImageAlt: "Tidak ada konten",
5442
+ defaultTitle: "Data {konten} belum bisa dimuat",
5443
+ defaultMessage: "Silahkan coba muat ulang halaman ini atau cek kembali beberapa saat lagi.",
5444
+ defaultButtonText: "Muat Ulang"
5445
+ },
5446
+ en: {
5447
+ defaultImageAlt: "No content available",
5448
+ defaultTitle: "Data {content} could not be loaded",
5449
+ defaultMessage: "Please try reloading this page or check back in a few moments.",
5450
+ defaultButtonText: "Reload"
5451
+ }
5452
+ };
5453
+ var getFormattedDefaultTitle = (template, content) => {
5454
+ if (content) {
5455
+ return template.replace(/\{(konten|content)\}/g, content);
5456
+ }
5457
+ return template.replace(/\s*\{(konten|content)\}\s*/g, " ").trim();
5458
+ };
5433
5459
  var useStyles11 = reactComponents.makeStyles({
5460
+ root: {
5461
+ display: "flex",
5462
+ flexDirection: "column",
5463
+ alignItems: "center",
5464
+ justifyContent: "center",
5465
+ gap: reactComponents.tokens.spacingVerticalL,
5466
+ textAlign: "center",
5467
+ paddingTop: reactComponents.tokens.spacingVerticalXXL,
5468
+ paddingBottom: reactComponents.tokens.spacingVerticalXXL,
5469
+ paddingLeft: reactComponents.tokens.spacingHorizontalXL,
5470
+ paddingRight: reactComponents.tokens.spacingHorizontalXL,
5471
+ width: "100%"
5472
+ },
5473
+ image: {
5474
+ maxWidth: "100%",
5475
+ height: "auto"
5476
+ },
5477
+ textContainer: {
5478
+ display: "flex",
5479
+ flexDirection: "column",
5480
+ alignItems: "center",
5481
+ gap: reactComponents.tokens.spacingVerticalS,
5482
+ maxWidth: "400px"
5483
+ },
5484
+ title: {
5485
+ fontWeight: "600"
5486
+ },
5487
+ message: {
5488
+ color: reactComponents.tokens.colorNeutralForeground3,
5489
+ textAlign: "center"
5490
+ }
5491
+ });
5492
+ var EmptyContent = ({
5493
+ title,
5494
+ content,
5495
+ message,
5496
+ imageSrc = "/assets/images/illustrations/no-content.svg",
5497
+ imageAlt,
5498
+ imageWidth = 240,
5499
+ imageHeight = 180,
5500
+ actionButton,
5501
+ language = "id",
5502
+ labels,
5503
+ className
5504
+ }) => {
5505
+ const styles = useStyles11();
5506
+ const mergedLabels = { ...DEFAULT_LABELS11[language], ...labels };
5507
+ const displayTitle = title ?? getFormattedDefaultTitle(mergedLabels.defaultTitle, content);
5508
+ const displayMessage = message ?? mergedLabels.defaultMessage;
5509
+ const displayImageAlt = imageAlt ?? mergedLabels.defaultImageAlt;
5510
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: reactComponents.mergeClasses(styles.root, className), children: [
5511
+ /* @__PURE__ */ jsxRuntime.jsx(
5512
+ "img",
5513
+ {
5514
+ src: imageSrc,
5515
+ alt: displayImageAlt,
5516
+ width: imageWidth,
5517
+ height: imageHeight,
5518
+ className: styles.image
5519
+ }
5520
+ ),
5521
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.textContainer, children: [
5522
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { className: styles.title, children: displayTitle }),
5523
+ typeof displayMessage === "string" ? /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.message, children: displayMessage }) : displayMessage
5524
+ ] }),
5525
+ actionButton && /* @__PURE__ */ jsxRuntime.jsx(
5526
+ reactComponents.Button,
5527
+ {
5528
+ type: "button",
5529
+ appearance: actionButton.appearance || "primary",
5530
+ onClick: actionButton.onClick,
5531
+ shape: "circular",
5532
+ style: { width: "100%" },
5533
+ children: actionButton.text
5534
+ }
5535
+ )
5536
+ ] });
5537
+ };
5538
+ var useStyles12 = reactComponents.makeStyles({
5434
5539
  dialogTitle: {
5435
5540
  display: "flex",
5436
5541
  justifyContent: "space-between",
@@ -5568,7 +5673,7 @@ var HarborListItem = ({
5568
5673
  showDivider,
5569
5674
  containerClassName
5570
5675
  }) => {
5571
- const styles = useStyles11();
5676
+ const styles = useStyles12();
5572
5677
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5573
5678
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: containerClassName, children: [
5574
5679
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.listContent, onClick: () => onSelect(harbor), children: [
@@ -5591,6 +5696,57 @@ var HarborListItem = ({
5591
5696
  showDivider && /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Divider, {})
5592
5697
  ] });
5593
5698
  };
5699
+ var HarborListSkeleton = ({
5700
+ count = 5,
5701
+ showFavoriteIcon = false
5702
+ }) => {
5703
+ const styles = useStyles12();
5704
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.harborList, children: Array.from({ length: count }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.harborItem, children: [
5705
+ /* @__PURE__ */ jsxRuntime.jsxs(
5706
+ reactComponents.Skeleton,
5707
+ {
5708
+ style: {
5709
+ display: "flex",
5710
+ alignItems: "center",
5711
+ gap: "0.5rem",
5712
+ width: "70%"
5713
+ },
5714
+ children: [
5715
+ /* @__PURE__ */ jsxRuntime.jsx(
5716
+ reactComponents.SkeletonItem,
5717
+ {
5718
+ style: {
5719
+ width: "24px",
5720
+ height: "24px",
5721
+ borderRadius: "4px"
5722
+ }
5723
+ }
5724
+ ),
5725
+ /* @__PURE__ */ jsxRuntime.jsx(
5726
+ reactComponents.SkeletonItem,
5727
+ {
5728
+ style: {
5729
+ width: "100%",
5730
+ height: "20px",
5731
+ borderRadius: "4px"
5732
+ }
5733
+ }
5734
+ )
5735
+ ]
5736
+ }
5737
+ ),
5738
+ showFavoriteIcon && /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
5739
+ reactComponents.SkeletonItem,
5740
+ {
5741
+ style: {
5742
+ width: "24px",
5743
+ height: "24px",
5744
+ borderRadius: "4px"
5745
+ }
5746
+ }
5747
+ ) })
5748
+ ] }, index)) });
5749
+ };
5594
5750
  var ModalSearchHarbor = ({
5595
5751
  language = "id",
5596
5752
  labels,
@@ -5601,7 +5757,8 @@ var ModalSearchHarbor = ({
5601
5757
  harbors,
5602
5758
  favoriteHarbors,
5603
5759
  lastSearchedHarbors,
5604
- isLoading = false,
5760
+ isLoadingPort = false,
5761
+ isLoadingTravelPlan = false,
5605
5762
  searchQuery,
5606
5763
  onSearchChange,
5607
5764
  onSelectHarbor,
@@ -5610,11 +5767,18 @@ var ModalSearchHarbor = ({
5610
5767
  onRemoveLastSearched,
5611
5768
  onClearLastSearched,
5612
5769
  onClearFavorite,
5770
+ reloadButtonPort,
5771
+ reloadButtonTravelPlan,
5772
+ reloadButtonAll,
5613
5773
  popularHarbors,
5614
- showButtonFavorite = true
5774
+ showButtonFavorite = true,
5775
+ emptyImageSrc = "",
5776
+ isErrorTravelPlan = false,
5777
+ isErrorPort = false
5615
5778
  }) => {
5616
- const styles = useStyles11();
5779
+ const styles = useStyles12();
5617
5780
  const mergedLabels = { ...DEFAULT_LABELS10[language], ...labels };
5781
+ const isError = isErrorTravelPlan && isErrorPort;
5618
5782
  const handleSelect = (harbor) => {
5619
5783
  onAddLastSearched(harbor);
5620
5784
  onSelectHarbor(harbor);
@@ -5650,7 +5814,15 @@ var ModalSearchHarbor = ({
5650
5814
  children: title || mergedLabels.title
5651
5815
  }
5652
5816
  ),
5653
- /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.DialogContent, { className: styles.content, children: [
5817
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.DialogContent, { className: styles.content, children: isError ? /* @__PURE__ */ jsxRuntime.jsx(
5818
+ EmptyContent,
5819
+ {
5820
+ content: mergedLabels.emptyContent,
5821
+ language,
5822
+ actionButton: reloadButtonAll,
5823
+ imageSrc: emptyImageSrc
5824
+ }
5825
+ ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5654
5826
  /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(
5655
5827
  reactComponents.Input,
5656
5828
  {
@@ -5669,177 +5841,154 @@ var ModalSearchHarbor = ({
5669
5841
  }
5670
5842
  ) }),
5671
5843
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.resultList, children: [
5672
- favoriteHarbors.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5673
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.headerRow, children: [
5674
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: mergedLabels.favoriteHeader }),
5675
- /* @__PURE__ */ jsxRuntime.jsx(
5676
- reactComponents.Caption1,
5844
+ isErrorTravelPlan ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {}) : isLoadingTravelPlan ? /* @__PURE__ */ jsxRuntime.jsx(HarborListSkeleton, { count: 3, showFavoriteIcon: false }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5845
+ favoriteHarbors.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5846
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.headerRow, children: [
5847
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: mergedLabels.favoriteHeader }),
5848
+ /* @__PURE__ */ jsxRuntime.jsx(
5849
+ reactComponents.Caption1,
5850
+ {
5851
+ className: reactComponents.mergeClasses(
5852
+ styles.dangerText,
5853
+ styles.cursorPointer
5854
+ ),
5855
+ onClick: onClearFavorite,
5856
+ children: mergedLabels.clearAllButton
5857
+ }
5858
+ )
5859
+ ] }),
5860
+ favoriteHarbors.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.buttonContainer, children: favoriteHarbors.map((harbor) => /* @__PURE__ */ jsxRuntime.jsxs(
5861
+ reactComponents.Button,
5677
5862
  {
5678
- className: reactComponents.mergeClasses(
5679
- styles.dangerText,
5680
- styles.cursorPointer
5863
+ onClick: () => handleSelect(harbor),
5864
+ size: "medium",
5865
+ appearance: "subtle",
5866
+ iconPosition: "before",
5867
+ className: styles.circularButton,
5868
+ icon: /* @__PURE__ */ jsxRuntime.jsx(
5869
+ react.Icon,
5870
+ {
5871
+ icon: "fluent:vehicle-ship-20-regular",
5872
+ fontSize: 20,
5873
+ color: reactComponents.tokens.colorBrandBackground
5874
+ }
5681
5875
  ),
5682
- onClick: onClearFavorite,
5683
- children: mergedLabels.clearAllButton
5684
- }
5685
- )
5876
+ children: [
5877
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.buttonContent, children: [
5878
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: harbor.portName }),
5879
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Caption1, { children: harbor.branchName })
5880
+ ] }),
5881
+ /* @__PURE__ */ jsxRuntime.jsx(
5882
+ react.Icon,
5883
+ {
5884
+ icon: "fluent:star-24-filled",
5885
+ fontSize: 20,
5886
+ color: reactComponents.tokens.colorBrandBackground,
5887
+ style: { marginLeft: 5 }
5888
+ }
5889
+ )
5890
+ ]
5891
+ },
5892
+ harbor.portId
5893
+ )) })
5686
5894
  ] }),
5687
- favoriteHarbors.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.buttonContainer, children: favoriteHarbors.map((harbor) => /* @__PURE__ */ jsxRuntime.jsxs(
5688
- reactComponents.Button,
5689
- {
5690
- onClick: () => handleSelect(harbor),
5691
- size: "medium",
5692
- appearance: "subtle",
5693
- iconPosition: "before",
5694
- className: styles.circularButton,
5695
- icon: /* @__PURE__ */ jsxRuntime.jsx(
5696
- react.Icon,
5895
+ lastSearchedHarbors.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5896
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.headerRow, children: [
5897
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: mergedLabels.lastSearchedHeader }),
5898
+ /* @__PURE__ */ jsxRuntime.jsx(
5899
+ reactComponents.Caption1,
5697
5900
  {
5698
- icon: "fluent:vehicle-ship-20-regular",
5699
- fontSize: 20,
5700
- color: reactComponents.tokens.colorBrandBackground
5901
+ className: reactComponents.mergeClasses(
5902
+ styles.dangerText,
5903
+ styles.cursorPointer
5904
+ ),
5905
+ onClick: onClearLastSearched,
5906
+ children: mergedLabels.clearAllButton
5701
5907
  }
5702
- ),
5703
- children: [
5704
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.buttonContent, children: [
5705
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: harbor.portName }),
5706
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Caption1, { children: harbor.branchName })
5707
- ] }),
5708
- /* @__PURE__ */ jsxRuntime.jsx(
5908
+ )
5909
+ ] }),
5910
+ /* @__PURE__ */ jsxRuntime.jsx("div", { children: lastSearchedHarbors.map((harbor) => /* @__PURE__ */ jsxRuntime.jsx(
5911
+ HarborListItem,
5912
+ {
5913
+ harbor,
5914
+ onSelect: handleSelect,
5915
+ containerClassName: styles.historyItem,
5916
+ trailingIcon: /* @__PURE__ */ jsxRuntime.jsx(
5709
5917
  react.Icon,
5710
5918
  {
5711
- icon: "fluent:star-24-filled",
5919
+ onClick: () => onRemoveLastSearched(harbor),
5920
+ icon: "fluent:dismiss-24-regular",
5712
5921
  fontSize: 20,
5713
- color: reactComponents.tokens.colorBrandBackground,
5714
- style: { marginLeft: 5 }
5922
+ className: styles.cursorPointer
5715
5923
  }
5716
- )
5717
- ]
5718
- },
5719
- harbor.portId
5720
- )) })
5721
- ] }),
5722
- lastSearchedHarbors.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5723
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.headerRow, children: [
5724
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: mergedLabels.lastSearchedHeader }),
5725
- /* @__PURE__ */ jsxRuntime.jsx(
5726
- reactComponents.Caption1,
5727
- {
5728
- className: reactComponents.mergeClasses(
5729
- styles.dangerText,
5730
- styles.cursorPointer
5731
5924
  ),
5732
- onClick: onClearLastSearched,
5733
- children: mergedLabels.clearAllButton
5734
- }
5735
- )
5925
+ showDivider: true
5926
+ },
5927
+ harbor.portId
5928
+ )) })
5736
5929
  ] }),
5737
- /* @__PURE__ */ jsxRuntime.jsx("div", { children: lastSearchedHarbors.map((harbor) => /* @__PURE__ */ jsxRuntime.jsx(
5930
+ popularHarbors.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5931
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.headerRow, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: mergedLabels.popularHarborHeader }) }),
5932
+ /* @__PURE__ */ jsxRuntime.jsx("div", { children: popularHarbors.map((harbor) => /* @__PURE__ */ jsxRuntime.jsx(
5933
+ HarborListItem,
5934
+ {
5935
+ harbor,
5936
+ onSelect: handleSelect,
5937
+ containerClassName: styles.historyItem,
5938
+ showDivider: true
5939
+ },
5940
+ harbor.portId
5941
+ )) })
5942
+ ] })
5943
+ ] }),
5944
+ isErrorPort ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5945
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { className: styles.sectionTitle, children: mergedLabels.allHarborsHeader }),
5946
+ /* @__PURE__ */ jsxRuntime.jsx(
5947
+ EmptyContent,
5948
+ {
5949
+ content: mergedLabels.emptyContent,
5950
+ language,
5951
+ actionButton: reloadButtonPort,
5952
+ imageSrc: emptyImageSrc
5953
+ }
5954
+ )
5955
+ ] }) : isLoadingPort ? /* @__PURE__ */ jsxRuntime.jsx(
5956
+ HarborListSkeleton,
5957
+ {
5958
+ count: 5,
5959
+ showFavoriteIcon: showButtonFavorite
5960
+ }
5961
+ ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5962
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { className: styles.sectionTitle, children: mergedLabels.allHarborsHeader }),
5963
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.harborList, children: harbors.length > 0 ? harbors.map((harbor, index) => /* @__PURE__ */ jsxRuntime.jsx(
5738
5964
  HarborListItem,
5739
5965
  {
5740
5966
  harbor,
5741
5967
  onSelect: handleSelect,
5742
- containerClassName: styles.historyItem,
5743
- trailingIcon: /* @__PURE__ */ jsxRuntime.jsx(
5968
+ containerClassName: styles.harborItem,
5969
+ trailingIcon: showButtonFavorite && /* @__PURE__ */ jsxRuntime.jsx(
5744
5970
  react.Icon,
5745
5971
  {
5746
- onClick: () => onRemoveLastSearched(harbor),
5747
- icon: "fluent:dismiss-24-regular",
5748
- fontSize: 20,
5749
- className: styles.cursorPointer
5972
+ icon: harbor.isFavorite ? "fluent:star-24-filled" : "fluent:star-24-regular",
5973
+ color: reactComponents.tokens.colorBrandBackground,
5974
+ className: styles.cursorPointer,
5975
+ onClick: () => onToggleFavorite(harbor)
5750
5976
  }
5751
5977
  ),
5752
- showDivider: true
5753
- },
5754
- harbor.portId
5755
- )) })
5756
- ] }),
5757
- popularHarbors.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5758
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.headerRow, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: mergedLabels.popularHarborHeader }) }),
5759
- /* @__PURE__ */ jsxRuntime.jsx("div", { children: popularHarbors.map((harbor) => /* @__PURE__ */ jsxRuntime.jsx(
5760
- HarborListItem,
5761
- {
5762
- harbor,
5763
- onSelect: handleSelect,
5764
- containerClassName: styles.historyItem,
5765
- showDivider: true
5978
+ showDivider: index !== harbors.length - 1
5766
5979
  },
5767
- harbor.portId
5768
- )) })
5769
- ] }),
5770
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { className: styles.sectionTitle, children: mergedLabels.allHarborsHeader }),
5771
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.harborList, children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: [1, 2, 3, 4, 5].map((item) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.harborItem, children: [
5772
- /* @__PURE__ */ jsxRuntime.jsxs(
5773
- reactComponents.Skeleton,
5774
- {
5775
- style: {
5776
- display: "flex",
5777
- alignItems: "center",
5778
- gap: "0.5rem",
5779
- width: "70%"
5780
- },
5781
- children: [
5782
- /* @__PURE__ */ jsxRuntime.jsx(
5783
- reactComponents.SkeletonItem,
5784
- {
5785
- style: {
5786
- width: "24px",
5787
- height: "24px",
5788
- borderRadius: "4px"
5789
- }
5790
- }
5791
- ),
5792
- /* @__PURE__ */ jsxRuntime.jsx(
5793
- reactComponents.SkeletonItem,
5794
- {
5795
- style: {
5796
- width: "100%",
5797
- height: "20px",
5798
- borderRadius: "4px"
5799
- }
5800
- }
5801
- )
5802
- ]
5803
- }
5804
- ),
5805
- showButtonFavorite && /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
5806
- reactComponents.SkeletonItem,
5807
- {
5808
- style: {
5809
- width: "24px",
5810
- height: "24px",
5811
- borderRadius: "4px"
5812
- }
5813
- }
5814
- ) })
5815
- ] }, item)) }) : harbors.length > 0 ? harbors.map((harbor, index) => /* @__PURE__ */ jsxRuntime.jsx(
5816
- HarborListItem,
5817
- {
5818
- harbor,
5819
- onSelect: handleSelect,
5820
- containerClassName: styles.harborItem,
5821
- trailingIcon: showButtonFavorite && /* @__PURE__ */ jsxRuntime.jsx(
5822
- react.Icon,
5823
- {
5824
- icon: harbor.isFavorite ? "fluent:star-24-filled" : "fluent:star-24-regular",
5825
- color: reactComponents.tokens.colorBrandBackground,
5826
- className: styles.cursorPointer,
5827
- onClick: () => onToggleFavorite(harbor)
5828
- }
5829
- ),
5830
- showDivider: index !== harbors.length - 1
5831
- },
5832
- harbor.portId || index
5833
- )) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.emptyState, children: mergedLabels.harborNotFound }) })
5980
+ harbor.portId || index
5981
+ )) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.emptyState, children: mergedLabels.harborNotFound }) })
5982
+ ] })
5834
5983
  ] })
5835
- ] })
5984
+ ] }) })
5836
5985
  ] }) })
5837
5986
  }
5838
5987
  );
5839
5988
  };
5840
5989
 
5841
5990
  // src/components/ModalSelectDate/ModalSelectDate.constants.ts
5842
- var DEFAULT_LABELS11 = {
5991
+ var DEFAULT_LABELS12 = {
5843
5992
  id: {
5844
5993
  title: "Pilih Tanggal",
5845
5994
  oneWay: "Sekali Jalan",
@@ -5853,7 +6002,7 @@ var DEFAULT_LABELS11 = {
5853
6002
  closeAriaLabel: "Close"
5854
6003
  }
5855
6004
  };
5856
- var useStyles12 = reactComponents.makeStyles({
6005
+ var useStyles13 = reactComponents.makeStyles({
5857
6006
  dialogSurface: {
5858
6007
  maxWidth: "600px",
5859
6008
  width: "100%"
@@ -5973,8 +6122,8 @@ var ModalSelectDate = ({
5973
6122
  dateFormat = "DD MMMM YYYY",
5974
6123
  showRoundtrip = true
5975
6124
  }) => {
5976
- const styles = useStyles12();
5977
- const mergedLabels = { ...DEFAULT_LABELS11[language], ...labels };
6125
+ const styles = useStyles13();
6126
+ const mergedLabels = { ...DEFAULT_LABELS12[language], ...labels };
5978
6127
  React.useEffect(() => {
5979
6128
  moment__default.default.locale(language === "id" ? "id" : "en");
5980
6129
  }, [language]);
@@ -6197,14 +6346,15 @@ var ModalSelectDate = ({
6197
6346
  };
6198
6347
 
6199
6348
  // src/components/ModalService/ModalService.constants.ts
6200
- var DEFAULT_LABELS12 = {
6349
+ var DEFAULT_LABELS13 = {
6201
6350
  id: {
6202
6351
  title: "Pilih Kelas Layanan",
6203
6352
  loading: "Memuat...",
6204
6353
  error: "Gagal memuat layanan",
6205
6354
  selectAll: "Pilih Semua",
6206
6355
  saveButton: "Simpan",
6207
- closeAriaLabel: "Tutup"
6356
+ closeAriaLabel: "Tutup",
6357
+ emptyContent: "Kelas Layanan"
6208
6358
  },
6209
6359
  en: {
6210
6360
  title: "Select Service Class",
@@ -6212,10 +6362,11 @@ var DEFAULT_LABELS12 = {
6212
6362
  error: "Error loading services",
6213
6363
  selectAll: "Select All",
6214
6364
  saveButton: "Save",
6215
- closeAriaLabel: "Close"
6365
+ closeAriaLabel: "Close",
6366
+ emptyContent: "Service Class"
6216
6367
  }
6217
6368
  };
6218
- var useStyles13 = reactComponents.makeStyles({
6369
+ var useStyles14 = reactComponents.makeStyles({
6219
6370
  dialogSurface: {
6220
6371
  maxWidth: "600px",
6221
6372
  width: "100%"
@@ -6288,6 +6439,66 @@ var useStyles13 = reactComponents.makeStyles({
6288
6439
  borderRadius: reactComponents.tokens.borderRadiusCircular
6289
6440
  }
6290
6441
  });
6442
+ var ServiceListSkeleton = ({
6443
+ count = 3
6444
+ }) => {
6445
+ const styles = useStyles14();
6446
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.serviceList, children: Array.from({ length: count }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.serviceItem, children: [
6447
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.serviceContent, children: /* @__PURE__ */ jsxRuntime.jsxs(
6448
+ reactComponents.Skeleton,
6449
+ {
6450
+ style: {
6451
+ display: "flex",
6452
+ flexDirection: "column",
6453
+ gap: "4px",
6454
+ width: "80%"
6455
+ },
6456
+ children: [
6457
+ /* @__PURE__ */ jsxRuntime.jsx(
6458
+ reactComponents.SkeletonItem,
6459
+ {
6460
+ style: {
6461
+ width: "120px",
6462
+ height: "20px",
6463
+ borderRadius: "4px"
6464
+ }
6465
+ }
6466
+ ),
6467
+ /* @__PURE__ */ jsxRuntime.jsx(
6468
+ reactComponents.SkeletonItem,
6469
+ {
6470
+ style: {
6471
+ width: "80px",
6472
+ height: "16px",
6473
+ borderRadius: "4px"
6474
+ }
6475
+ }
6476
+ ),
6477
+ /* @__PURE__ */ jsxRuntime.jsx(
6478
+ reactComponents.SkeletonItem,
6479
+ {
6480
+ style: {
6481
+ width: "100%",
6482
+ height: "16px",
6483
+ borderRadius: "4px"
6484
+ }
6485
+ }
6486
+ )
6487
+ ]
6488
+ }
6489
+ ) }),
6490
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
6491
+ reactComponents.SkeletonItem,
6492
+ {
6493
+ style: {
6494
+ width: "20px",
6495
+ height: "20px",
6496
+ borderRadius: "4px"
6497
+ }
6498
+ }
6499
+ ) })
6500
+ ] }, index)) });
6501
+ };
6291
6502
  var ModalService = ({
6292
6503
  language = "id",
6293
6504
  labels,
@@ -6298,10 +6509,12 @@ var ModalService = ({
6298
6509
  selectedServiceIds,
6299
6510
  onSave,
6300
6511
  isLoading = false,
6301
- isError = false
6512
+ isError = false,
6513
+ reloadButton,
6514
+ emptyImageSrc = ""
6302
6515
  }) => {
6303
- const styles = useStyles13();
6304
- const mergedLabels = { ...DEFAULT_LABELS12[language], ...labels };
6516
+ const styles = useStyles14();
6517
+ const mergedLabels = { ...DEFAULT_LABELS13[language], ...labels };
6305
6518
  const displayTitle = title || mergedLabels.title;
6306
6519
  const [selectedServices, setSelectedServices] = React.useState(selectedServiceIds);
6307
6520
  React.useEffect(() => {
@@ -6356,7 +6569,15 @@ var ModalService = ({
6356
6569
  children: displayTitle
6357
6570
  }
6358
6571
  ),
6359
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.DialogContent, { className: styles.content, children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: mergedLabels.loading }) : isError ? /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: mergedLabels.error }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
6572
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.DialogContent, { className: styles.content, children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(ServiceListSkeleton, {}) : isError ? /* @__PURE__ */ jsxRuntime.jsx(
6573
+ EmptyContent,
6574
+ {
6575
+ content: mergedLabels.emptyContent,
6576
+ language,
6577
+ actionButton: reloadButton,
6578
+ imageSrc: emptyImageSrc
6579
+ }
6580
+ ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
6360
6581
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.serviceList, children: [
6361
6582
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.headerRow, children: [
6362
6583
  /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: mergedLabels.selectAll }),
@@ -6406,23 +6627,25 @@ var ModalService = ({
6406
6627
  };
6407
6628
 
6408
6629
  // src/components/ModalTotalPassengers/ModalTotalPassengers.constants.ts
6409
- var DEFAULT_LABELS13 = {
6630
+ var DEFAULT_LABELS14 = {
6410
6631
  id: {
6411
6632
  title: "Pilih Jumlah Penumpang",
6412
6633
  infoMessage: "Anda dapat menambahkan hingga {maxPassengers} penumpang pada golongan kendaraan ini.",
6413
6634
  loading: "Memuat...",
6414
6635
  saveButton: "Simpan",
6415
- closeAriaLabel: "Tutup"
6636
+ closeAriaLabel: "Tutup",
6637
+ emptyContent: "Kelas Penumpang"
6416
6638
  },
6417
6639
  en: {
6418
6640
  title: "Select Total Passengers",
6419
6641
  infoMessage: "You can add up to {maxPassengers} passengers in this vehicle category.",
6420
6642
  loading: "Loading...",
6421
6643
  saveButton: "Save",
6422
- closeAriaLabel: "Close"
6644
+ closeAriaLabel: "Close",
6645
+ emptyContent: "Passengers Class"
6423
6646
  }
6424
6647
  };
6425
- var useStyles14 = reactComponents.makeStyles({
6648
+ var useStyles15 = reactComponents.makeStyles({
6426
6649
  dialogSurface: {
6427
6650
  maxWidth: "600px",
6428
6651
  width: "100%"
@@ -6489,6 +6712,62 @@ var useStyles14 = reactComponents.makeStyles({
6489
6712
  margin: 0
6490
6713
  }
6491
6714
  });
6715
+ var TotalPassengersListSkeleton = ({
6716
+ count = 3
6717
+ }) => {
6718
+ const styles = useStyles15();
6719
+ return /* @__PURE__ */ jsxRuntime.jsx(
6720
+ "div",
6721
+ {
6722
+ style: {
6723
+ display: "flex",
6724
+ flexDirection: "column",
6725
+ marginTop: reactComponents.tokens.spacingHorizontalM
6726
+ },
6727
+ children: Array.from({ length: count }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
6728
+ "div",
6729
+ {
6730
+ className: styles.accordionItem,
6731
+ style: { padding: "8px 0" },
6732
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.accordionHeader, style: { padding: "0 12px" }, children: [
6733
+ /* @__PURE__ */ jsxRuntime.jsx(
6734
+ "div",
6735
+ {
6736
+ style: { display: "flex", alignItems: "center", width: "100%" },
6737
+ children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
6738
+ reactComponents.SkeletonItem,
6739
+ {
6740
+ style: {
6741
+ width: "120px",
6742
+ height: "18px"
6743
+ }
6744
+ }
6745
+ ) })
6746
+ }
6747
+ ),
6748
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: "4px" } }),
6749
+ /* @__PURE__ */ jsxRuntime.jsx(
6750
+ "div",
6751
+ {
6752
+ style: { display: "flex", alignItems: "center", width: "100%" },
6753
+ children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
6754
+ reactComponents.SkeletonItem,
6755
+ {
6756
+ style: {
6757
+ width: "48px",
6758
+ height: "14px"
6759
+ }
6760
+ }
6761
+ ) })
6762
+ }
6763
+ )
6764
+ ] })
6765
+ },
6766
+ index
6767
+ ))
6768
+ }
6769
+ );
6770
+ };
6492
6771
  var ModalTotalPassengers = ({
6493
6772
  language = "id",
6494
6773
  labels,
@@ -6499,11 +6778,14 @@ var ModalTotalPassengers = ({
6499
6778
  selectedPassengers,
6500
6779
  onSave,
6501
6780
  isLoading = false,
6781
+ isError = false,
6782
+ reloadButton,
6783
+ emptyImageSrc,
6502
6784
  maxPassengers = 10,
6503
6785
  infoMessage
6504
6786
  }) => {
6505
- const styles = useStyles14();
6506
- const mergedLabels = { ...DEFAULT_LABELS13[language], ...labels };
6787
+ const styles = useStyles15();
6788
+ const mergedLabels = { ...DEFAULT_LABELS14[language], ...labels };
6507
6789
  const [passengers, setPassengers] = React.useState([]);
6508
6790
  const [openItems, setOpenItems] = React.useState([]);
6509
6791
  const defaultInfoMessage = mergedLabels.infoMessage.replace(
@@ -6560,11 +6842,16 @@ var ModalTotalPassengers = ({
6560
6842
  (p) => p.passengerAgeCode === passengerAgeCode
6561
6843
  );
6562
6844
  if (!passenger) return 0;
6563
- const cls = passenger.classes.find(
6564
- (c) => c.classCode === classCode
6565
- );
6845
+ const cls = passenger.classes.find((c) => c.classCode === classCode);
6566
6846
  return cls?.count ?? 0;
6567
6847
  };
6848
+ const getTotalCountForType = (passengerAgeCode) => {
6849
+ const passenger = passengers.find(
6850
+ (p) => p.passengerAgeCode === passengerAgeCode
6851
+ );
6852
+ if (!passenger) return 0;
6853
+ return passenger.classes.reduce((sum, cls) => sum + (cls.count ?? 0), 0);
6854
+ };
6568
6855
  const getTotalForType = (passengerAgeCode) => {
6569
6856
  const passenger = passengers.find(
6570
6857
  (p) => p.passengerAgeCode === passengerAgeCode
@@ -6619,10 +6906,7 @@ var ModalTotalPassengers = ({
6619
6906
  classes: passenger.classes.map((cls) => {
6620
6907
  if (cls.classCode === classCode && (cls.count ?? 0) > 0) {
6621
6908
  const newCount = (cls.count ?? 0) - 1;
6622
- const newPassengers = (cls.passengers || []).slice(
6623
- 0,
6624
- newCount
6625
- );
6909
+ const newPassengers = (cls.passengers || []).slice(0, newCount);
6626
6910
  return {
6627
6911
  ...cls,
6628
6912
  count: newCount,
@@ -6660,131 +6944,134 @@ var ModalTotalPassengers = ({
6660
6944
  children: title || mergedLabels.title
6661
6945
  }
6662
6946
  ),
6663
- /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.DialogContent, { children: [
6947
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.DialogContent, { children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(TotalPassengersListSkeleton, {}) : isError ? /* @__PURE__ */ jsxRuntime.jsx(
6948
+ EmptyContent,
6949
+ {
6950
+ content: mergedLabels.emptyContent,
6951
+ language,
6952
+ actionButton: reloadButton,
6953
+ imageSrc: emptyImageSrc
6954
+ }
6955
+ ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
6664
6956
  /* @__PURE__ */ jsxRuntime.jsx(reactComponents.MessageBar, { shape: "rounded", children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.MessageBarBody, { children: infoMessage || defaultInfoMessage }) }),
6665
- isLoading ? /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: mergedLabels.loading }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
6666
- /* @__PURE__ */ jsxRuntime.jsx(
6667
- reactComponents.Accordion,
6668
- {
6669
- collapsible: true,
6670
- multiple: true,
6671
- openItems,
6672
- onToggle: (_, data) => setOpenItems(data.openItems),
6673
- className: styles.passengerSection,
6674
- children: passengerTypes.map((passengerType) => {
6675
- const classes = passengerType.classes || [];
6676
- return /* @__PURE__ */ jsxRuntime.jsxs(
6677
- reactComponents.AccordionItem,
6678
- {
6679
- value: String(passengerType.id),
6680
- className: styles.accordionItem,
6681
- children: [
6682
- /* @__PURE__ */ jsxRuntime.jsxs(
6683
- reactComponents.AccordionHeader,
6684
- {
6685
- className: styles.accordionHeader,
6686
- expandIconPosition: "end",
6687
- children: [
6688
- passengerType.passengerAgeName,
6689
- " (",
6690
- getTotalForType(passengerType.passengerAgeCode),
6691
- ")"
6692
- ]
6693
- }
6694
- ),
6695
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.AccordionPanel, { className: styles.accordionPanel, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.nestedSection, children: classes.map((cls) => /* @__PURE__ */ jsxRuntime.jsxs(
6696
- "div",
6697
- {
6698
- className: styles.nestedRow,
6699
- children: [
6700
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: (cls?.className || "")?.toUpperCase() }),
6701
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.passengerCount, children: [
6702
- /* @__PURE__ */ jsxRuntime.jsx(
6703
- reactComponents.Button,
6704
- {
6705
- appearance: "outline",
6706
- className: styles.counterButton,
6707
- size: "small",
6708
- icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:subtract-12-regular" }),
6709
- onClick: (e) => {
6710
- e.stopPropagation();
6711
- handleDecrement(
6712
- passengerType.passengerAgeCode,
6713
- cls.classCode
6714
- );
6715
- },
6716
- disabled: getServiceCount(
6717
- passengerType.passengerAgeCode,
6718
- cls.classCode
6719
- ) === 0
6720
- }
6721
- ),
6722
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.countText, children: getServiceCount(
6957
+ /* @__PURE__ */ jsxRuntime.jsx(
6958
+ reactComponents.Accordion,
6959
+ {
6960
+ collapsible: true,
6961
+ multiple: true,
6962
+ openItems,
6963
+ onToggle: (_, data) => setOpenItems(data.openItems),
6964
+ className: styles.passengerSection,
6965
+ children: passengerTypes.map((passengerType) => {
6966
+ const classes = passengerType.classes || [];
6967
+ return /* @__PURE__ */ jsxRuntime.jsxs(
6968
+ reactComponents.AccordionItem,
6969
+ {
6970
+ value: String(passengerType.id),
6971
+ className: styles.accordionItem,
6972
+ children: [
6973
+ /* @__PURE__ */ jsxRuntime.jsxs(
6974
+ reactComponents.AccordionHeader,
6975
+ {
6976
+ className: styles.accordionHeader,
6977
+ expandIconPosition: "end",
6978
+ children: [
6979
+ passengerType.passengerAgeName,
6980
+ " (",
6981
+ getTotalForType(passengerType.passengerAgeCode),
6982
+ ")"
6983
+ ]
6984
+ }
6985
+ ),
6986
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.AccordionPanel, { className: styles.accordionPanel, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.nestedSection, children: classes.map((cls) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.nestedRow, children: [
6987
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: (cls?.className || "")?.toUpperCase() }),
6988
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.passengerCount, children: [
6989
+ /* @__PURE__ */ jsxRuntime.jsx(
6990
+ reactComponents.Button,
6991
+ {
6992
+ appearance: "outline",
6993
+ className: styles.counterButton,
6994
+ size: "small",
6995
+ icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:subtract-12-regular" }),
6996
+ onClick: (e) => {
6997
+ e.stopPropagation();
6998
+ handleDecrement(
6723
6999
  passengerType.passengerAgeCode,
6724
7000
  cls.classCode
6725
- ) }),
6726
- /* @__PURE__ */ jsxRuntime.jsx(
6727
- reactComponents.Button,
6728
- {
6729
- appearance: "outline",
6730
- className: styles.counterButton,
6731
- size: "small",
6732
- icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:add-12-regular" }),
6733
- disabled: getServiceCount(
6734
- passengerType.passengerAgeCode,
6735
- cls.classCode
6736
- ) >= cls.maxCapacity || totalPassengerCount >= maxPassengers,
6737
- onClick: (e) => {
6738
- e.stopPropagation();
6739
- handleIncrement(
6740
- passengerType.passengerAgeCode,
6741
- cls.classCode
6742
- );
6743
- }
6744
- }
6745
- )
6746
- ] })
6747
- ]
6748
- },
6749
- cls.id
6750
- )) }) })
6751
- ]
6752
- },
6753
- passengerType.id
6754
- );
6755
- })
6756
- }
6757
- ),
6758
- /* @__PURE__ */ jsxRuntime.jsx(
6759
- reactComponents.Button,
6760
- {
6761
- appearance: "primary",
6762
- size: "medium",
6763
- className: styles.submitButton,
6764
- onClick: handleSave,
6765
- children: mergedLabels.saveButton
6766
- }
6767
- )
6768
- ] })
6769
- ] })
7001
+ );
7002
+ },
7003
+ disabled: getServiceCount(
7004
+ passengerType.passengerAgeCode,
7005
+ cls.classCode
7006
+ ) === 0 || getTotalCountForType(
7007
+ passengerType.passengerAgeCode
7008
+ ) <= passengerType.minCapacity
7009
+ }
7010
+ ),
7011
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.countText, children: getServiceCount(
7012
+ passengerType.passengerAgeCode,
7013
+ cls.classCode
7014
+ ) }),
7015
+ /* @__PURE__ */ jsxRuntime.jsx(
7016
+ reactComponents.Button,
7017
+ {
7018
+ appearance: "outline",
7019
+ className: styles.counterButton,
7020
+ size: "small",
7021
+ icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:add-12-regular" }),
7022
+ disabled: getServiceCount(
7023
+ passengerType.passengerAgeCode,
7024
+ cls.classCode
7025
+ ) >= cls.maxCapacity || totalPassengerCount >= maxPassengers,
7026
+ onClick: (e) => {
7027
+ e.stopPropagation();
7028
+ handleIncrement(
7029
+ passengerType.passengerAgeCode,
7030
+ cls.classCode
7031
+ );
7032
+ }
7033
+ }
7034
+ )
7035
+ ] })
7036
+ ] }, cls.id)) }) })
7037
+ ]
7038
+ },
7039
+ passengerType.id
7040
+ );
7041
+ })
7042
+ }
7043
+ ),
7044
+ /* @__PURE__ */ jsxRuntime.jsx(
7045
+ reactComponents.Button,
7046
+ {
7047
+ appearance: "primary",
7048
+ size: "medium",
7049
+ className: styles.submitButton,
7050
+ onClick: handleSave,
7051
+ children: mergedLabels.saveButton
7052
+ }
7053
+ )
7054
+ ] }) })
6770
7055
  ] }) }) });
6771
7056
  };
6772
7057
 
6773
7058
  // src/components/ModalTypeOfService/ModalTypeOfService.constants.ts
6774
- var DEFAULT_LABELS14 = {
7059
+ var DEFAULT_LABELS15 = {
6775
7060
  id: {
6776
- title: "Pilih Tipe Layanan",
7061
+ title: "Pilih Jenis Layanan",
6777
7062
  cancelButton: "Batal",
6778
7063
  saveButton: "Simpan",
6779
7064
  vehiclesAlt: "kendaraan",
6780
- closeAriaLabel: "Tutup"
7065
+ closeAriaLabel: "Tutup",
7066
+ emptyContent: "Jenis Layanan"
6781
7067
  },
6782
7068
  en: {
6783
7069
  title: "Select Service Type",
6784
7070
  cancelButton: "Cancel",
6785
7071
  saveButton: "Save",
6786
7072
  vehiclesAlt: "vehicles",
6787
- closeAriaLabel: "Close"
7073
+ closeAriaLabel: "Close",
7074
+ emptyContent: "Service Type"
6788
7075
  }
6789
7076
  };
6790
7077
  var DEFAULT_VEHICLE_ICONS = {
@@ -6799,7 +7086,7 @@ var DEFAULT_VEHICLE_ICONS = {
6799
7086
  bigTruck: "/assets/images/icons/big-truck.webp",
6800
7087
  looseLoad: "/assets/images/icons/loose-load.webp"
6801
7088
  };
6802
- var useStyles15 = reactComponents.makeStyles({
7089
+ var useStyles16 = reactComponents.makeStyles({
6803
7090
  dialogSurface: {
6804
7091
  maxWidth: "600px",
6805
7092
  width: "100%"
@@ -6842,6 +7129,89 @@ var useStyles15 = reactComponents.makeStyles({
6842
7129
  justifyContent: "flex-end"
6843
7130
  }
6844
7131
  });
7132
+ var TypeOfServiceListSkeleton = ({ count = 3 }) => {
7133
+ const styles = useStyles16();
7134
+ return /* @__PURE__ */ jsxRuntime.jsx(
7135
+ "div",
7136
+ {
7137
+ style: {
7138
+ display: "flex",
7139
+ flexDirection: "column",
7140
+ marginTop: reactComponents.tokens.spacingHorizontalM
7141
+ },
7142
+ children: Array.from({ length: count }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
7143
+ "div",
7144
+ {
7145
+ className: styles.accordionItem,
7146
+ style: { padding: "8px 0" },
7147
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.accordionHeader, children: [
7148
+ /* @__PURE__ */ jsxRuntime.jsxs(
7149
+ "div",
7150
+ {
7151
+ style: { display: "flex", alignItems: "center", width: "100%" },
7152
+ children: [
7153
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
7154
+ reactComponents.SkeletonItem,
7155
+ {
7156
+ style: {
7157
+ width: "74px",
7158
+ height: "74px",
7159
+ borderRadius: "8px"
7160
+ }
7161
+ }
7162
+ ) }),
7163
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.accordionTitleAndInfo, style: { flex: 1 }, children: /* @__PURE__ */ jsxRuntime.jsxs(
7164
+ reactComponents.Skeleton,
7165
+ {
7166
+ style: {
7167
+ display: "flex",
7168
+ flexDirection: "column",
7169
+ gap: "4px"
7170
+ },
7171
+ children: [
7172
+ /* @__PURE__ */ jsxRuntime.jsx(
7173
+ reactComponents.SkeletonItem,
7174
+ {
7175
+ style: {
7176
+ width: "120px",
7177
+ height: "20px",
7178
+ borderRadius: "4px"
7179
+ }
7180
+ }
7181
+ ),
7182
+ /* @__PURE__ */ jsxRuntime.jsx(
7183
+ reactComponents.SkeletonItem,
7184
+ {
7185
+ style: {
7186
+ width: "150px",
7187
+ height: "16px",
7188
+ borderRadius: "4px"
7189
+ }
7190
+ }
7191
+ )
7192
+ ]
7193
+ }
7194
+ ) })
7195
+ ]
7196
+ }
7197
+ ),
7198
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Skeleton, { children: /* @__PURE__ */ jsxRuntime.jsx(
7199
+ reactComponents.SkeletonItem,
7200
+ {
7201
+ style: {
7202
+ width: "16px",
7203
+ height: "16px",
7204
+ borderRadius: "50%"
7205
+ }
7206
+ }
7207
+ ) })
7208
+ ] })
7209
+ },
7210
+ index
7211
+ ))
7212
+ }
7213
+ );
7214
+ };
6845
7215
  var ModalTypeOfService = ({
6846
7216
  language = "id",
6847
7217
  labels,
@@ -6851,10 +7221,14 @@ var ModalTypeOfService = ({
6851
7221
  serviceTypes,
6852
7222
  selectedService,
6853
7223
  onSave,
6854
- renderImage
7224
+ renderImage,
7225
+ isLoading = false,
7226
+ isError = false,
7227
+ reloadButton,
7228
+ emptyImageSrc = ""
6855
7229
  }) => {
6856
- const styles = useStyles15();
6857
- const mergedLabels = { ...DEFAULT_LABELS14[language], ...labels };
7230
+ const styles = useStyles16();
7231
+ const mergedLabels = { ...DEFAULT_LABELS15[language], ...labels };
6858
7232
  const [selectedServiceId, setSelectedServiceId] = React.useState(
6859
7233
  selectedService?.id || 0
6860
7234
  );
@@ -6967,7 +7341,15 @@ var ModalTypeOfService = ({
6967
7341
  children: title || mergedLabels.title
6968
7342
  }
6969
7343
  ),
6970
- /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.DialogContent, { children: [
7344
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.DialogContent, { children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(TypeOfServiceListSkeleton, {}) : isError ? /* @__PURE__ */ jsxRuntime.jsx(
7345
+ EmptyContent,
7346
+ {
7347
+ content: mergedLabels.emptyContent,
7348
+ language,
7349
+ actionButton: reloadButton,
7350
+ imageSrc: emptyImageSrc
7351
+ }
7352
+ ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
6971
7353
  /* @__PURE__ */ jsxRuntime.jsx(
6972
7354
  reactComponents.Accordion,
6973
7355
  {
@@ -7014,7 +7396,9 @@ var ModalTypeOfService = ({
7014
7396
  styles.accordionHeader,
7015
7397
  styles.accordionItem
7016
7398
  ),
7017
- style: { padding: reactComponents.tokens.spacingHorizontalXS },
7399
+ style: {
7400
+ padding: reactComponents.tokens.spacingHorizontalXS
7401
+ },
7018
7402
  children: [
7019
7403
  /* @__PURE__ */ jsxRuntime.jsx("div", { children: imageRenderer({
7020
7404
  src: childItem.image,
@@ -7022,10 +7406,16 @@ var ModalTypeOfService = ({
7022
7406
  width: 48,
7023
7407
  height: 48
7024
7408
  }) }),
7025
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.accordionTitleAndInfo, children: [
7026
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: childItem.title }),
7027
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Caption1, { children: childItem.info })
7028
- ] }),
7409
+ /* @__PURE__ */ jsxRuntime.jsxs(
7410
+ "div",
7411
+ {
7412
+ className: styles.accordionTitleAndInfo,
7413
+ children: [
7414
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: childItem.title }),
7415
+ /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Caption1, { children: childItem.info })
7416
+ ]
7417
+ }
7418
+ ),
7029
7419
  /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Radio, { value: String(childItem.id) })
7030
7420
  ]
7031
7421
  },
@@ -7075,7 +7465,15 @@ var ModalTypeOfService = ({
7075
7465
  }
7076
7466
  ),
7077
7467
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.footer, children: [
7078
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Button, { appearance: "secondary", shape: "circular", onClick: onClose, children: mergedLabels.cancelButton }),
7468
+ /* @__PURE__ */ jsxRuntime.jsx(
7469
+ reactComponents.Button,
7470
+ {
7471
+ appearance: "secondary",
7472
+ shape: "circular",
7473
+ onClick: onClose,
7474
+ children: mergedLabels.cancelButton
7475
+ }
7476
+ ),
7079
7477
  /* @__PURE__ */ jsxRuntime.jsx(
7080
7478
  reactComponents.Button,
7081
7479
  {
@@ -7087,12 +7485,12 @@ var ModalTypeOfService = ({
7087
7485
  }
7088
7486
  )
7089
7487
  ] })
7090
- ] })
7488
+ ] }) })
7091
7489
  ] }) }) });
7092
7490
  };
7093
7491
 
7094
7492
  // src/components/SortMenu/SortMenu.constants.ts
7095
- var DEFAULT_LABELS15 = {
7493
+ var DEFAULT_LABELS16 = {
7096
7494
  id: {
7097
7495
  filterButtonText: "Filter",
7098
7496
  sortButtonText: "Urutkan Berdasarkan",
@@ -7134,7 +7532,7 @@ var getSortLabel = (value) => {
7134
7532
  const option = DEFAULT_SORT_OPTIONS.find((opt) => opt.value === value);
7135
7533
  return option?.label || "Rekomendasi";
7136
7534
  };
7137
- var useStyles16 = reactComponents.makeStyles({
7535
+ var useStyles17 = reactComponents.makeStyles({
7138
7536
  container: {
7139
7537
  display: "flex",
7140
7538
  width: "100%",
@@ -7170,10 +7568,10 @@ var SortMenu = ({
7170
7568
  sortButtonText: deprecatedSortButtonText,
7171
7569
  clearFiltersText: deprecatedClearFiltersText
7172
7570
  }) => {
7173
- const styles = useStyles16();
7571
+ const styles = useStyles17();
7174
7572
  const labels = React__default.default.useMemo(
7175
7573
  () => ({
7176
- ...DEFAULT_LABELS15[language],
7574
+ ...DEFAULT_LABELS16[language],
7177
7575
  ...customLabels,
7178
7576
  // Fallback to deprecated props if provided
7179
7577
  ...deprecatedFilterButtonText && {
@@ -7285,7 +7683,7 @@ var SortMenu = ({
7285
7683
  };
7286
7684
 
7287
7685
  // src/components/ModalFilterTicket/ModalFilterTicket.constants.ts
7288
- var DEFAULT_LABELS16 = {
7686
+ var DEFAULT_LABELS17 = {
7289
7687
  id: {
7290
7688
  title: "Filter dengan",
7291
7689
  serviceTypeLabel: "Jenis Layanan",
@@ -7346,7 +7744,7 @@ var DEFAULT_DURATION_RANGE = {
7346
7744
  min: 0,
7347
7745
  max: 8
7348
7746
  };
7349
- var useStyles17 = reactComponents.makeStyles({
7747
+ var useStyles18 = reactComponents.makeStyles({
7350
7748
  dialogSurface: {
7351
7749
  maxWidth: "600px",
7352
7750
  width: "100%"
@@ -7456,8 +7854,8 @@ var ModalFilterTicket = ({
7456
7854
  minDuration = DEFAULT_DURATION_RANGE.min,
7457
7855
  maxDuration = DEFAULT_DURATION_RANGE.max
7458
7856
  }) => {
7459
- const styles = useStyles17();
7460
- const mergedLabels = { ...DEFAULT_LABELS16[language], ...labels };
7857
+ const styles = useStyles18();
7858
+ const mergedLabels = { ...DEFAULT_LABELS17[language], ...labels };
7461
7859
  const [rangeReady, setRangeReady] = React.useState(false);
7462
7860
  React.useEffect(() => {
7463
7861
  if (open) {
@@ -7767,7 +8165,7 @@ var ModalFilterTicket = ({
7767
8165
  };
7768
8166
 
7769
8167
  // src/components/DateFilter/DateFilter.constants.ts
7770
- var DEFAULT_LABELS17 = {
8168
+ var DEFAULT_LABELS18 = {
7771
8169
  id: {
7772
8170
  prevButtonAriaLabel: "Tanggal sebelumnya",
7773
8171
  nextButtonAriaLabel: "Tanggal berikutnya",
@@ -7780,7 +8178,7 @@ var DEFAULT_LABELS17 = {
7780
8178
  }
7781
8179
  };
7782
8180
  var DEFAULT_SCROLL_AMOUNT = 150;
7783
- var useStyles18 = reactComponents.makeStyles({
8181
+ var useStyles19 = reactComponents.makeStyles({
7784
8182
  container: {
7785
8183
  display: "flex",
7786
8184
  alignItems: "stretch",
@@ -7863,10 +8261,10 @@ var DateFilter = ({
7863
8261
  labels,
7864
8262
  isLoading = false
7865
8263
  }) => {
7866
- const styles = useStyles18();
8264
+ const styles = useStyles19();
7867
8265
  const scrollRef = React.useRef(null);
7868
8266
  const mergedLabels = {
7869
- ...DEFAULT_LABELS17[language],
8267
+ ...DEFAULT_LABELS18[language],
7870
8268
  ...labels
7871
8269
  };
7872
8270
  const handlePrev = () => {
@@ -7929,7 +8327,7 @@ var DateFilter = ({
7929
8327
  };
7930
8328
 
7931
8329
  // src/components/ModalSearchTicket/ModalSearchTicket.constants.ts
7932
- var DEFAULT_LABELS18 = {
8330
+ var DEFAULT_LABELS19 = {
7933
8331
  id: {
7934
8332
  title: "Cari Jadwal Lainnya",
7935
8333
  fromLabel: "Dari",
@@ -7989,7 +8387,7 @@ var DEFAULT_FORM_VALUES = {
7989
8387
  typeOfService: "",
7990
8388
  passenger: ""
7991
8389
  };
7992
- var useStyles19 = reactComponents.makeStyles({
8390
+ var useStyles20 = reactComponents.makeStyles({
7993
8391
  dialogSurface: {
7994
8392
  maxWidth: "900px",
7995
8393
  width: "100%"
@@ -8091,8 +8489,8 @@ var ModalSearchTicket = ({
8091
8489
  showRoundTrip = true,
8092
8490
  ...props
8093
8491
  }) => {
8094
- const styles = useStyles19();
8095
- const mergedLabels = { ...DEFAULT_LABELS18[language], ...labels };
8492
+ const styles = useStyles20();
8493
+ const mergedLabels = { ...DEFAULT_LABELS19[language], ...labels };
8096
8494
  const { control, setValue, handleSubmit, watch } = reactHookForm.useForm({
8097
8495
  defaultValues: {
8098
8496
  ...DEFAULT_FORM_VALUES,
@@ -8529,7 +8927,7 @@ var ModalSearchTicket = ({
8529
8927
  };
8530
8928
 
8531
8929
  // src/components/Stepper/Stepper.constants.ts
8532
- var DEFAULT_LABELS19 = {
8930
+ var DEFAULT_LABELS20 = {
8533
8931
  id: {
8534
8932
  stepperBackgroundAlt: "Latar Belakang Stepper",
8535
8933
  ferryIconAlt: "Ikon Kapal"
@@ -8539,7 +8937,7 @@ var DEFAULT_LABELS19 = {
8539
8937
  ferryIconAlt: "Ferry Icon"
8540
8938
  }
8541
8939
  };
8542
- var useStyles20 = reactComponents.makeStyles({
8940
+ var useStyles21 = reactComponents.makeStyles({
8543
8941
  stepperWrapper: {
8544
8942
  position: "relative",
8545
8943
  width: "100%",
@@ -8664,8 +9062,8 @@ var Stepper = ({
8664
9062
  language = "id",
8665
9063
  labels
8666
9064
  }) => {
8667
- const styles = useStyles20();
8668
- const mergedLabels = { ...DEFAULT_LABELS19[language], ...labels };
9065
+ const styles = useStyles21();
9066
+ const mergedLabels = { ...DEFAULT_LABELS20[language], ...labels };
8669
9067
  const currentStepIndex = React.useMemo(() => {
8670
9068
  if (typeof currentStep === "number") {
8671
9069
  return steps.findIndex((step) => step.number === currentStep);
@@ -8721,7 +9119,7 @@ var Stepper = ({
8721
9119
  };
8722
9120
 
8723
9121
  // src/components/CardOrdererInfo/CardOrdererInfo.constants.ts
8724
- var DEFAULT_LABELS20 = {
9122
+ var DEFAULT_LABELS21 = {
8725
9123
  id: {
8726
9124
  title: "Informasi Pemesan",
8727
9125
  ordererName: "Nama Pemesan",
@@ -8735,7 +9133,7 @@ var DEFAULT_LABELS20 = {
8735
9133
  email: "Email"
8736
9134
  }
8737
9135
  };
8738
- var useStyles21 = reactComponents.makeStyles({
9136
+ var useStyles22 = reactComponents.makeStyles({
8739
9137
  card: {
8740
9138
  padding: "1.5rem",
8741
9139
  borderRadius: reactComponents.tokens.borderRadiusXLarge,
@@ -8765,8 +9163,8 @@ var CardOrdererInfo = ({
8765
9163
  labels,
8766
9164
  className
8767
9165
  }) => {
8768
- const styles = useStyles21();
8769
- const mergedLabels = { ...DEFAULT_LABELS20[language], ...labels };
9166
+ const styles = useStyles22();
9167
+ const mergedLabels = { ...DEFAULT_LABELS21[language], ...labels };
8770
9168
  return /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Card, { className: className || styles.card, children: [
8771
9169
  /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Title3, { children: mergedLabels.title }),
8772
9170
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.container, children: [
@@ -8787,7 +9185,7 @@ var CardOrdererInfo = ({
8787
9185
  };
8788
9186
 
8789
9187
  // src/components/ModalListPassenger/ModalListPassenger.constants.ts
8790
- var DEFAULT_LABELS21 = {
9188
+ var DEFAULT_LABELS22 = {
8791
9189
  id: {
8792
9190
  title: "Detail Penumpang",
8793
9191
  // sameAsOrderer: 'Sama Dengan Pemesan',
@@ -8817,7 +9215,7 @@ var DEFAULT_LABELS21 = {
8817
9215
  }
8818
9216
  }
8819
9217
  };
8820
- var useStyles22 = reactComponents.makeStyles({
9218
+ var useStyles23 = reactComponents.makeStyles({
8821
9219
  dialogSurface: {
8822
9220
  maxWidth: "600px",
8823
9221
  width: "100%",
@@ -8872,8 +9270,8 @@ var ModalListPassenger = ({
8872
9270
  // sameAsOrderer,
8873
9271
  // onSameAsOrdererChange,
8874
9272
  }) => {
8875
- const styles = useStyles22();
8876
- const mergedLabels = { ...DEFAULT_LABELS21[language], ...labels };
9273
+ const styles = useStyles23();
9274
+ const mergedLabels = { ...DEFAULT_LABELS22[language], ...labels };
8877
9275
  const displayTitle = title || mergedLabels.title;
8878
9276
  const handleClose = () => {
8879
9277
  onClose();
@@ -9004,7 +9402,7 @@ var ModalListPassenger = ({
9004
9402
  };
9005
9403
 
9006
9404
  // src/components/ModalPassengerForm/ModalPassengerForm.constants.ts
9007
- var DEFAULT_LABELS22 = {
9405
+ var DEFAULT_LABELS23 = {
9008
9406
  id: {
9009
9407
  title: "Detail Penumpang",
9010
9408
  titleLabel: "Title",
@@ -9155,7 +9553,7 @@ var calculateAge = (birthDate) => {
9155
9553
  }
9156
9554
  return { years: Math.max(0, years), months: Math.max(0, months) };
9157
9555
  };
9158
- var useStyles23 = reactComponents.makeStyles({
9556
+ var useStyles24 = reactComponents.makeStyles({
9159
9557
  dialogSurface: {
9160
9558
  maxWidth: "600px",
9161
9559
  width: "100%",
@@ -9335,10 +9733,10 @@ var ModalPassengerForm = ({
9335
9733
  ticketClassOptions,
9336
9734
  onScanComplete
9337
9735
  }) => {
9338
- const styles = useStyles23();
9339
- const mergedLabels = { ...DEFAULT_LABELS22[language], ...labels };
9736
+ const styles = useStyles24();
9737
+ const mergedLabels = { ...DEFAULT_LABELS23[language], ...labels };
9340
9738
  const mergedErrors = {
9341
- ...DEFAULT_LABELS22[language].errors,
9739
+ ...DEFAULT_LABELS23[language].errors,
9342
9740
  ...labels?.errors
9343
9741
  };
9344
9742
  const displayTitle = title || mergedLabels.title;
@@ -10070,7 +10468,7 @@ var ModalPassengerForm = ({
10070
10468
  };
10071
10469
 
10072
10470
  // src/components/CardPassengerList/CardPassengerList.constants.ts
10073
- var DEFAULT_LABELS23 = {
10471
+ var DEFAULT_LABELS24 = {
10074
10472
  id: {
10075
10473
  defaultTitle: "Data Penumpang",
10076
10474
  passengerPrefix: "Penumpang"
@@ -10113,7 +10511,7 @@ var getBadgeConfig = (ticketClass) => {
10113
10511
  };
10114
10512
  }
10115
10513
  };
10116
- var useStyles24 = reactComponents.makeStyles({
10514
+ var useStyles25 = reactComponents.makeStyles({
10117
10515
  card: {
10118
10516
  padding: "1.5rem",
10119
10517
  borderRadius: reactComponents.tokens.borderRadiusXLarge,
@@ -10196,8 +10594,8 @@ var CardPassengerList = ({
10196
10594
  labels,
10197
10595
  className
10198
10596
  }) => {
10199
- const styles = useStyles24();
10200
- const mergedLabels = { ...DEFAULT_LABELS23[language], ...labels };
10597
+ const styles = useStyles25();
10598
+ const mergedLabels = { ...DEFAULT_LABELS24[language], ...labels };
10201
10599
  const displayTitle = title || mergedLabels.defaultTitle;
10202
10600
  return /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Card, { className: className || styles.card, children: [
10203
10601
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.headerContainer, children: [
@@ -10270,7 +10668,7 @@ var CardPassengerList = ({
10270
10668
  };
10271
10669
 
10272
10670
  // src/components/CardVehicleDetail/CardVehicleDetail.constants.ts
10273
- var DEFAULT_LABELS24 = {
10671
+ var DEFAULT_LABELS25 = {
10274
10672
  id: {
10275
10673
  title: "Detail Kendaraan",
10276
10674
  vehicleNumberLabel: "Nomor Kendaraan",
@@ -10288,7 +10686,7 @@ var DEFAULT_LABELS24 = {
10288
10686
  noLabel: "No"
10289
10687
  }
10290
10688
  };
10291
- var useStyles25 = reactComponents.makeStyles({
10689
+ var useStyles26 = reactComponents.makeStyles({
10292
10690
  card: {
10293
10691
  padding: "1.5rem",
10294
10692
  borderRadius: reactComponents.tokens.borderRadiusXLarge,
@@ -10328,8 +10726,8 @@ var CardVehicleDetail = ({
10328
10726
  language = "id",
10329
10727
  labels
10330
10728
  }) => {
10331
- const styles = useStyles25();
10332
- const mergedLabels = { ...DEFAULT_LABELS24[language], ...labels };
10729
+ const styles = useStyles26();
10730
+ const mergedLabels = { ...DEFAULT_LABELS25[language], ...labels };
10333
10731
  return /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Card, { className: styles.card, children: [
10334
10732
  /* @__PURE__ */ jsxRuntime.jsxs(
10335
10733
  "div",
@@ -10391,7 +10789,7 @@ var CardVehicleDetail = ({
10391
10789
  };
10392
10790
 
10393
10791
  // src/components/CardVehicleOwnerForm/CardVehicleOwnerForm.constants.ts
10394
- var DEFAULT_LABELS25 = {
10792
+ var DEFAULT_LABELS26 = {
10395
10793
  id: {
10396
10794
  title: "Informasi Pemilik & Muatan",
10397
10795
  addOwnerButton: "Tambah Pemilik",
@@ -10499,7 +10897,7 @@ var DEFAULT_LABELS25 = {
10499
10897
  incrementQuantityAriaLabel: "Increase quantity"
10500
10898
  }
10501
10899
  };
10502
- var useStyles26 = reactComponents.makeStyles({
10900
+ var useStyles27 = reactComponents.makeStyles({
10503
10901
  card: {
10504
10902
  padding: "1.5rem",
10505
10903
  borderRadius: reactComponents.tokens.borderRadiusXLarge,
@@ -10567,8 +10965,8 @@ var CardVehicleOwnerForm = ({
10567
10965
  language = "id",
10568
10966
  labels
10569
10967
  }) => {
10570
- const styles = useStyles26();
10571
- const mergedLabels = { ...DEFAULT_LABELS25[language], ...labels };
10968
+ const styles = useStyles27();
10969
+ const mergedLabels = { ...DEFAULT_LABELS26[language], ...labels };
10572
10970
  return /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Card, { className: styles.card, children: [
10573
10971
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.header, children: [
10574
10972
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", flex: 1 }, children: [
@@ -11356,7 +11754,7 @@ var CardVehicleOwnerForm = ({
11356
11754
  };
11357
11755
 
11358
11756
  // src/components/CardBookingTicket/CardBookingTicket.constants.ts
11359
- var DEFAULT_LABELS26 = {
11757
+ var DEFAULT_LABELS27 = {
11360
11758
  id: {
11361
11759
  bookingDetails: "Booking Details",
11362
11760
  routeTitle: "Rute Perjalanan",
@@ -11392,7 +11790,7 @@ var DEFAULT_LABELS26 = {
11392
11790
  cancelDialogDismiss: "Cancel"
11393
11791
  }
11394
11792
  };
11395
- var useStyles27 = reactComponents.makeStyles({
11793
+ var useStyles28 = reactComponents.makeStyles({
11396
11794
  container: {
11397
11795
  display: "flex",
11398
11796
  flexDirection: "column",
@@ -11556,8 +11954,8 @@ var CardBookingTicket = ({
11556
11954
  onPrevious,
11557
11955
  className
11558
11956
  }) => {
11559
- const styles = useStyles27();
11560
- const mergedLabels = { ...DEFAULT_LABELS26[language], ...labels };
11957
+ const styles = useStyles28();
11958
+ const mergedLabels = { ...DEFAULT_LABELS27[language], ...labels };
11561
11959
  const [cancelDialogOpen, setCancelDialogOpen] = React.useState(false);
11562
11960
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${styles.container} ${className || ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.bookingDetail, children: [
11563
11961
  /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Card, { className: styles.bookingDetailTop, children: [
@@ -11759,7 +12157,7 @@ var CardBookingTicket = ({
11759
12157
  };
11760
12158
 
11761
12159
  // src/components/CardFAQ/CardFAQ.constants.ts
11762
- var DEFAULT_LABELS27 = {
12160
+ var DEFAULT_LABELS28 = {
11763
12161
  id: {
11764
12162
  title: "Pertanyaan yang sering diajukan"
11765
12163
  },
@@ -11813,7 +12211,7 @@ var DEFAULT_FAQ_ITEMS = {
11813
12211
  }
11814
12212
  ]
11815
12213
  };
11816
- var useStyles28 = reactComponents.makeStyles({
12214
+ var useStyles29 = reactComponents.makeStyles({
11817
12215
  faqSection: {
11818
12216
  // marginTop: '2rem', // Let parent control spacing if needed, or keep consistent
11819
12217
  },
@@ -11837,8 +12235,8 @@ var CardFAQ = ({
11837
12235
  items,
11838
12236
  className
11839
12237
  }) => {
11840
- const styles = useStyles28();
11841
- const mergedLabels = { ...DEFAULT_LABELS27[language], ...labels };
12238
+ const styles = useStyles29();
12239
+ const mergedLabels = { ...DEFAULT_LABELS28[language], ...labels };
11842
12240
  const faqItems = items || DEFAULT_FAQ_ITEMS[language];
11843
12241
  return /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Card, { className: styles.faqCard, children: [
11844
12242
  /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { children: mergedLabels.title }),
@@ -11875,7 +12273,7 @@ var CardFAQ = ({
11875
12273
  };
11876
12274
 
11877
12275
  // src/components/CardAddon/CardAddon.constants.ts
11878
- var DEFAULT_LABELS28 = {
12276
+ var DEFAULT_LABELS29 = {
11879
12277
  id: {
11880
12278
  viewDetail: "Lihat detail",
11881
12279
  totalPrice: "Total Harga",
@@ -11891,7 +12289,7 @@ var DEFAULT_LABELS28 = {
11891
12289
  currencySymbol: "Rp"
11892
12290
  }
11893
12291
  };
11894
- var useStyles29 = reactComponents.makeStyles({
12292
+ var useStyles30 = reactComponents.makeStyles({
11895
12293
  card: {
11896
12294
  backgroundColor: reactComponents.tokens.colorNeutralBackground1,
11897
12295
  boxShadow: reactComponents.tokens.shadow4,
@@ -12064,8 +12462,8 @@ var CardAddon = ({
12064
12462
  children,
12065
12463
  className
12066
12464
  }) => {
12067
- const styles = useStyles29();
12068
- const mergedLabels = { ...DEFAULT_LABELS28[language], ...labels };
12465
+ const styles = useStyles30();
12466
+ const mergedLabels = { ...DEFAULT_LABELS29[language], ...labels };
12069
12467
  return /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Card, { className: `${styles.card} ${className || ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.gapRow, children: [
12070
12468
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.titleDivider, children: [
12071
12469
  /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Title3, { className: styles.textTitle, children: title }),
@@ -12276,7 +12674,7 @@ var CardAddon = ({
12276
12674
  };
12277
12675
 
12278
12676
  // src/components/CardMealCatalog/CardMealCatalog.constants.ts
12279
- var DEFAULT_LABELS29 = {
12677
+ var DEFAULT_LABELS30 = {
12280
12678
  id: {
12281
12679
  addButton: "Tambah",
12282
12680
  currencySymbol: "Rp",
@@ -12292,7 +12690,7 @@ var DEFAULT_LABELS29 = {
12292
12690
  searchPlaceholder: "Search for food or drinks you want"
12293
12691
  }
12294
12692
  };
12295
- var useStyles30 = reactComponents.makeStyles({
12693
+ var useStyles31 = reactComponents.makeStyles({
12296
12694
  container: {
12297
12695
  display: "flex",
12298
12696
  flexDirection: "column",
@@ -12436,8 +12834,8 @@ var CardMealCatalog = ({
12436
12834
  searchValue,
12437
12835
  onSearchChange
12438
12836
  }) => {
12439
- const styles = useStyles30();
12440
- const mergedLabels = { ...DEFAULT_LABELS29[language], ...labels };
12837
+ const styles = useStyles31();
12838
+ const mergedLabels = { ...DEFAULT_LABELS30[language], ...labels };
12441
12839
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${styles.container} ${className || ""}`, children: [
12442
12840
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.banner, children: [
12443
12841
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.bannerOverlay }),
@@ -12542,7 +12940,7 @@ var CardMealCatalog = ({
12542
12940
  };
12543
12941
 
12544
12942
  // src/components/CardReview/CardReview.constants.ts
12545
- var DEFAULT_LABELS30 = {
12943
+ var DEFAULT_LABELS31 = {
12546
12944
  id: {
12547
12945
  defaultTitle: "Tinjauan"
12548
12946
  },
@@ -12550,7 +12948,7 @@ var DEFAULT_LABELS30 = {
12550
12948
  defaultTitle: "Review"
12551
12949
  }
12552
12950
  };
12553
- var useStyles31 = reactComponents.makeStyles({
12951
+ var useStyles32 = reactComponents.makeStyles({
12554
12952
  card: {
12555
12953
  padding: "1.5rem",
12556
12954
  borderRadius: reactComponents.tokens.borderRadiusXLarge,
@@ -12601,8 +12999,8 @@ var CardReview = ({
12601
12999
  className,
12602
13000
  headerAction
12603
13001
  }) => {
12604
- const styles = useStyles31();
12605
- const mergedLabels = { ...DEFAULT_LABELS30[language], ...labels };
13002
+ const styles = useStyles32();
13003
+ const mergedLabels = { ...DEFAULT_LABELS31[language], ...labels };
12606
13004
  return /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Card, { className: `${styles.card} ${className || ""}`, children: [
12607
13005
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.headerContainer, children: [
12608
13006
  /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { className: styles.headerTitle, children: title || mergedLabels.defaultTitle }),
@@ -12649,7 +13047,7 @@ var CardReview = ({
12649
13047
  };
12650
13048
 
12651
13049
  // src/components/CardReviewPassenger/CardReviewPassenger.constants.ts
12652
- var DEFAULT_LABELS31 = {
13050
+ var DEFAULT_LABELS32 = {
12653
13051
  id: {
12654
13052
  title: "Penumpang",
12655
13053
  idNumber: "Nomor ID"
@@ -12659,7 +13057,7 @@ var DEFAULT_LABELS31 = {
12659
13057
  idNumber: "ID Number"
12660
13058
  }
12661
13059
  };
12662
- var useStyles32 = reactComponents.makeStyles({
13060
+ var useStyles33 = reactComponents.makeStyles({
12663
13061
  card: {
12664
13062
  padding: "1.5rem",
12665
13063
  borderRadius: reactComponents.tokens.borderRadiusXLarge,
@@ -12757,8 +13155,8 @@ var CardReviewPassenger = ({
12757
13155
  passengers,
12758
13156
  className
12759
13157
  }) => {
12760
- const styles = useStyles32();
12761
- const mergedLabels = { ...DEFAULT_LABELS31[language], ...labels };
13158
+ const styles = useStyles33();
13159
+ const mergedLabels = { ...DEFAULT_LABELS32[language], ...labels };
12762
13160
  const displayTitle = title || mergedLabels.title;
12763
13161
  return /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Card, { className: `${styles.card} ${className || ""}`, children: [
12764
13162
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.headerContainer, children: [
@@ -12801,7 +13199,7 @@ var CardReviewPassenger = ({
12801
13199
  };
12802
13200
 
12803
13201
  // src/components/CardPriceDetails/CardPriceDetails.constants.ts
12804
- var DEFAULT_LABELS32 = {
13202
+ var DEFAULT_LABELS33 = {
12805
13203
  id: {
12806
13204
  defaultTitle: "Rincian Harga",
12807
13205
  totalPayment: "Total Pembayaran",
@@ -12837,7 +13235,7 @@ var DEFAULT_LABELS32 = {
12837
13235
  currencyPrefix: "Rp. "
12838
13236
  }
12839
13237
  };
12840
- var useStyles33 = reactComponents.makeStyles({
13238
+ var useStyles34 = reactComponents.makeStyles({
12841
13239
  list: {
12842
13240
  margin: 0,
12843
13241
  padding: 0,
@@ -12859,7 +13257,7 @@ var PriceDetailsTerms = ({
12859
13257
  language = "id",
12860
13258
  labels
12861
13259
  }) => {
12862
- const styles = useStyles33();
13260
+ const styles = useStyles34();
12863
13261
  const linkColor = reactComponents.tokens.colorBrandBackground;
12864
13262
  const bookingTerms = labels.bookingTerms;
12865
13263
  const agreementTerms = [
@@ -12879,7 +13277,7 @@ var PriceDetailsTerms = ({
12879
13277
  ] })
12880
13278
  ] });
12881
13279
  };
12882
- var useStyles34 = reactComponents.makeStyles({
13280
+ var useStyles35 = reactComponents.makeStyles({
12883
13281
  card: {
12884
13282
  padding: "1.5rem",
12885
13283
  borderRadius: reactComponents.tokens.borderRadiusXLarge,
@@ -12956,8 +13354,8 @@ var CardPriceDetails = ({
12956
13354
  total,
12957
13355
  labels
12958
13356
  }) => {
12959
- const styles = useStyles34();
12960
- const mergedLabels = { ...DEFAULT_LABELS32[language], ...labels };
13357
+ const styles = useStyles35();
13358
+ const mergedLabels = { ...DEFAULT_LABELS33[language], ...labels };
12961
13359
  const displayTitle = title || mergedLabels.defaultTitle;
12962
13360
  const getVariantClass = (variant) => {
12963
13361
  switch (variant) {
@@ -13016,7 +13414,7 @@ var CardPriceDetails = ({
13016
13414
  };
13017
13415
 
13018
13416
  // src/components/CardPaymentMethodList/CardPaymentMethodList.constants.ts
13019
- var DEFAULT_LABELS33 = {
13417
+ var DEFAULT_LABELS34 = {
13020
13418
  id: {
13021
13419
  selectAriaLabel: "Pilih metode pembayaran"
13022
13420
  },
@@ -13024,7 +13422,7 @@ var DEFAULT_LABELS33 = {
13024
13422
  selectAriaLabel: "Select payment method"
13025
13423
  }
13026
13424
  };
13027
- var useStyles35 = reactComponents.makeStyles({
13425
+ var useStyles36 = reactComponents.makeStyles({
13028
13426
  container: {
13029
13427
  display: "flex",
13030
13428
  flexDirection: "column",
@@ -13084,8 +13482,8 @@ var CardPaymentMethodList = ({
13084
13482
  selectedValue,
13085
13483
  onSelect
13086
13484
  }) => {
13087
- const styles = useStyles35();
13088
- const mergedLabels = { ...DEFAULT_LABELS33[language], ...labels };
13485
+ const styles = useStyles36();
13486
+ const mergedLabels = { ...DEFAULT_LABELS34[language], ...labels };
13089
13487
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.card, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${styles.container}`, children: methods.map((category, index) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
13090
13488
  index > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.dividerContainer, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Divider, {}) }),
13091
13489
  /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Accordion, { multiple: true, collapsible: true, children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.AccordionItem, { value: category.value, children: [
@@ -13134,7 +13532,7 @@ var CardPaymentMethodList = ({
13134
13532
  };
13135
13533
 
13136
13534
  // src/components/CardPaymentGuide/CardPaymentGuide.constants.ts
13137
- var DEFAULT_LABELS34 = {
13535
+ var DEFAULT_LABELS35 = {
13138
13536
  id: {
13139
13537
  title: "Cara Pembayaran"
13140
13538
  },
@@ -13142,7 +13540,7 @@ var DEFAULT_LABELS34 = {
13142
13540
  title: "Payment Method"
13143
13541
  }
13144
13542
  };
13145
- var useStyles36 = reactComponents.makeStyles({
13543
+ var useStyles37 = reactComponents.makeStyles({
13146
13544
  container: {
13147
13545
  display: "flex",
13148
13546
  flexDirection: "column",
@@ -13179,8 +13577,8 @@ var CardPaymentGuide = ({
13179
13577
  guides,
13180
13578
  className
13181
13579
  }) => {
13182
- const styles = useStyles36();
13183
- const mergedLabels = { ...DEFAULT_LABELS34[language], ...labels };
13580
+ const styles = useStyles37();
13581
+ const mergedLabels = { ...DEFAULT_LABELS35[language], ...labels };
13184
13582
  const displayTitle = title || mergedLabels.title;
13185
13583
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${styles.container} ${className || ""}`, children: [
13186
13584
  title && /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.titleContainer, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { className: styles.title, children: displayTitle }) }),
@@ -13199,7 +13597,7 @@ var CardPaymentGuide = ({
13199
13597
  };
13200
13598
 
13201
13599
  // src/components/CardPaymentInfo/CardPaymentInfo.constants.ts
13202
- var DEFAULT_LABELS35 = {
13600
+ var DEFAULT_LABELS36 = {
13203
13601
  id: {
13204
13602
  expiryPrefix: "Kode virtual akun berlaku sampai",
13205
13603
  copyCodeButton: "Salin Kode",
@@ -13217,7 +13615,7 @@ var DEFAULT_LABELS35 = {
13217
13615
  currencySymbol: "Rp."
13218
13616
  }
13219
13617
  };
13220
- var useStyles37 = reactComponents.makeStyles({
13618
+ var useStyles38 = reactComponents.makeStyles({
13221
13619
  container: {
13222
13620
  display: "flex",
13223
13621
  flexDirection: "column",
@@ -13299,8 +13697,8 @@ var CardPaymentInfo = ({
13299
13697
  onCopyVA,
13300
13698
  onCheckStatus
13301
13699
  }) => {
13302
- const styles = useStyles37();
13303
- const mergedLabels = { ...DEFAULT_LABELS35[language], ...labels };
13700
+ const styles = useStyles38();
13701
+ const mergedLabels = { ...DEFAULT_LABELS36[language], ...labels };
13304
13702
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.card, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.container, children: [
13305
13703
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.headerRow, children: [
13306
13704
  /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { children: mergedLabels.expiryPrefix }),
@@ -13358,7 +13756,7 @@ var CardPaymentInfo = ({
13358
13756
  };
13359
13757
 
13360
13758
  // src/components/CardStatusOrder/CardStatusOrder.constants.ts
13361
- var DEFAULT_LABELS36 = {
13759
+ var DEFAULT_LABELS37 = {
13362
13760
  id: {
13363
13761
  detailTitle: "Detail Pemesanan",
13364
13762
  statusLabel: "Status",
@@ -13388,7 +13786,7 @@ var DEFAULT_LABELS36 = {
13388
13786
  illustrationAlt: "E-Ticket Illustration"
13389
13787
  }
13390
13788
  };
13391
- var useStyles38 = reactComponents.makeStyles({
13789
+ var useStyles39 = reactComponents.makeStyles({
13392
13790
  activeCard: {
13393
13791
  width: "100%",
13394
13792
  // padding: tokens.spacingHorizontalNone, // default
@@ -13458,8 +13856,8 @@ var CardStatusOrder = ({
13458
13856
  onClickViewTicket,
13459
13857
  className
13460
13858
  }) => {
13461
- const styles = useStyles38();
13462
- const mergedLabels = { ...DEFAULT_LABELS36[language], ...labels };
13859
+ const styles = useStyles39();
13860
+ const mergedLabels = { ...DEFAULT_LABELS37[language], ...labels };
13463
13861
  const displayStatus = statusLabel || mergedLabels.defaultStatus;
13464
13862
  const displayTitle = title || mergedLabels.defaultTitle;
13465
13863
  const displayDescription = description || mergedLabels.defaultDescription;
@@ -13556,7 +13954,7 @@ var CardStatusOrder = ({
13556
13954
  };
13557
13955
 
13558
13956
  // src/components/ModalPriceDetail/ModalPriceDetail.constants.ts
13559
- var DEFAULT_LABELS37 = {
13957
+ var DEFAULT_LABELS38 = {
13560
13958
  id: {
13561
13959
  title: "Rincian Harga",
13562
13960
  addonHeader: "Add On",
@@ -13582,7 +13980,7 @@ var DEFAULT_LABELS37 = {
13582
13980
  closeAriaLabel: "Close"
13583
13981
  }
13584
13982
  };
13585
- var useStyles39 = reactComponents.makeStyles({
13983
+ var useStyles40 = reactComponents.makeStyles({
13586
13984
  surface: {
13587
13985
  width: "680px",
13588
13986
  maxWidth: "90vw",
@@ -13709,8 +14107,8 @@ var ModalPriceDetail = ({
13709
14107
  grandTotal,
13710
14108
  ...props
13711
14109
  }) => {
13712
- const styles = useStyles39();
13713
- const mergedLabels = { ...DEFAULT_LABELS37[language], ...labels };
14110
+ const styles = useStyles40();
14111
+ const mergedLabels = { ...DEFAULT_LABELS38[language], ...labels };
13714
14112
  return /* @__PURE__ */ jsxRuntime.jsx(
13715
14113
  reactComponents.Dialog,
13716
14114
  {
@@ -13852,7 +14250,7 @@ var ModalPriceDetail = ({
13852
14250
  // src/components/FileUpload/FileUpload.constants.ts
13853
14251
  var ACCEPTED_FILES = ".pdf,.jpg,.jpeg,.png";
13854
14252
  var MAX_FILE_SIZE_MB = 10;
13855
- var DEFAULT_LABELS38 = {
14253
+ var DEFAULT_LABELS39 = {
13856
14254
  id: {
13857
14255
  placeholder: "Ketuk untuk pilih file",
13858
14256
  maxSizeWarning: "Maksimal {maxSize}MB per file dalam format PDF, JPG, JPEG, PNG.",
@@ -13870,7 +14268,7 @@ var DEFAULT_LABELS38 = {
13870
14268
  downloadTemplateDocument: "Download Template Document"
13871
14269
  }
13872
14270
  };
13873
- var useStyles40 = reactComponents.makeStyles({
14271
+ var useStyles41 = reactComponents.makeStyles({
13874
14272
  surface: {
13875
14273
  maxWidth: "90vw",
13876
14274
  maxHeight: "90vh",
@@ -13897,7 +14295,7 @@ var ModalPreviewImage = ({
13897
14295
  imageUrl,
13898
14296
  alt = "Preview"
13899
14297
  }) => {
13900
- const styles = useStyles40();
14298
+ const styles = useStyles41();
13901
14299
  return /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Dialog, { open, onOpenChange: (_, data) => onOpenChange(data.open), children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.DialogSurface, { className: styles.surface, children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.DialogBody, { children: [
13902
14300
  /* @__PURE__ */ jsxRuntime.jsx(
13903
14301
  reactComponents.DialogTitle,
@@ -14010,7 +14408,7 @@ var FileUpload = React__default.default.forwardRef(
14010
14408
  pdfIcon,
14011
14409
  downloadTemplateDocument = false
14012
14410
  }, ref) => {
14013
- const mergedLabels = { ...DEFAULT_LABELS38[language], ...customLabels };
14411
+ const mergedLabels = { ...DEFAULT_LABELS39[language], ...customLabels };
14014
14412
  const styles = uploadStyles();
14015
14413
  const fileInputRef = React.useRef(null);
14016
14414
  const [, setIsDragOver] = React.useState(false);
@@ -14448,11 +14846,11 @@ function hexToRgba(hex, alpha = 1) {
14448
14846
  }
14449
14847
 
14450
14848
  // src/components/CardProfileMenu/CardProfileMenu.constants.ts
14451
- var DEFAULT_LABELS39 = {
14849
+ var DEFAULT_LABELS40 = {
14452
14850
  id: {},
14453
14851
  en: {}
14454
14852
  };
14455
- var useStyles41 = reactComponents.makeStyles({
14853
+ var useStyles42 = reactComponents.makeStyles({
14456
14854
  container: {
14457
14855
  display: "flex",
14458
14856
  flexDirection: "column",
@@ -14512,8 +14910,8 @@ var CardProfileMenu = ({
14512
14910
  selectedValue,
14513
14911
  onTabSelect
14514
14912
  }) => {
14515
- const styles = useStyles41();
14516
- ({ ...DEFAULT_LABELS39[language], ...labels });
14913
+ const styles = useStyles42();
14914
+ ({ ...DEFAULT_LABELS40[language], ...labels });
14517
14915
  const handleTabSelect = (_, data) => {
14518
14916
  onTabSelect(data.value);
14519
14917
  };
@@ -14542,107 +14940,6 @@ var CardProfileMenu = ({
14542
14940
  ) });
14543
14941
  };
14544
14942
 
14545
- // src/components/NoContent/NoContent.constants.ts
14546
- var DEFAULT_LABELS40 = {
14547
- id: {
14548
- defaultImageAlt: "Tidak ada konten",
14549
- defaultTitle: "Data {konten} belum bisa dimuat",
14550
- defaultMessage: "Silahkan coba muat ulang halaman ini atau cek kembali beberapa saat lagi.",
14551
- defaultButtonText: "Muat Ulang"
14552
- },
14553
- en: {
14554
- defaultImageAlt: "No content available",
14555
- defaultTitle: "Data {content} could not be loaded",
14556
- defaultMessage: "Please try reloading this page or check back in a few moments.",
14557
- defaultButtonText: "Reload"
14558
- }
14559
- };
14560
- var getFormattedDefaultTitle = (template, content) => {
14561
- if (content) {
14562
- return template.replace(/\{(konten|content)\}/g, content);
14563
- }
14564
- return template.replace(/\s*\{(konten|content)\}\s*/g, " ").trim();
14565
- };
14566
- var useStyles42 = reactComponents.makeStyles({
14567
- root: {
14568
- display: "flex",
14569
- flexDirection: "column",
14570
- alignItems: "center",
14571
- justifyContent: "center",
14572
- gap: reactComponents.tokens.spacingVerticalL,
14573
- textAlign: "center",
14574
- paddingTop: reactComponents.tokens.spacingVerticalXXL,
14575
- paddingBottom: reactComponents.tokens.spacingVerticalXXL,
14576
- paddingLeft: reactComponents.tokens.spacingHorizontalXL,
14577
- paddingRight: reactComponents.tokens.spacingHorizontalXL,
14578
- width: "100%"
14579
- },
14580
- image: {
14581
- maxWidth: "100%",
14582
- height: "auto"
14583
- },
14584
- textContainer: {
14585
- display: "flex",
14586
- flexDirection: "column",
14587
- alignItems: "center",
14588
- gap: reactComponents.tokens.spacingVerticalS,
14589
- maxWidth: "400px"
14590
- },
14591
- title: {
14592
- fontWeight: "600"
14593
- },
14594
- message: {
14595
- color: reactComponents.tokens.colorNeutralForeground3,
14596
- textAlign: "center"
14597
- }
14598
- });
14599
- var NoContent = ({
14600
- title,
14601
- content,
14602
- message,
14603
- imageSrc = "/assets/images/illustrations/no-content.svg",
14604
- imageAlt,
14605
- imageWidth = 240,
14606
- imageHeight = 180,
14607
- actionButton,
14608
- language = "id",
14609
- labels,
14610
- className
14611
- }) => {
14612
- const styles = useStyles42();
14613
- const mergedLabels = { ...DEFAULT_LABELS40[language], ...labels };
14614
- const displayTitle = title ?? getFormattedDefaultTitle(mergedLabels.defaultTitle, content);
14615
- const displayMessage = message ?? mergedLabels.defaultMessage;
14616
- const displayImageAlt = imageAlt ?? mergedLabels.defaultImageAlt;
14617
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: reactComponents.mergeClasses(styles.root, className), children: [
14618
- /* @__PURE__ */ jsxRuntime.jsx(
14619
- "img",
14620
- {
14621
- src: imageSrc,
14622
- alt: displayImageAlt,
14623
- width: imageWidth,
14624
- height: imageHeight,
14625
- className: styles.image
14626
- }
14627
- ),
14628
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.textContainer, children: [
14629
- /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { className: styles.title, children: displayTitle }),
14630
- typeof displayMessage === "string" ? /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.message, children: displayMessage }) : displayMessage
14631
- ] }),
14632
- actionButton && /* @__PURE__ */ jsxRuntime.jsx(
14633
- reactComponents.Button,
14634
- {
14635
- type: "button",
14636
- appearance: actionButton.appearance || "primary",
14637
- onClick: actionButton.onClick,
14638
- shape: "circular",
14639
- style: { width: "100%" },
14640
- children: actionButton.text
14641
- }
14642
- )
14643
- ] });
14644
- };
14645
-
14646
14943
  exports.API_CONFIG = API_CONFIG;
14647
14944
  exports.API_ENDPOINTS = API_ENDPOINTS;
14648
14945
  exports.API_ERROR_MESSAGES = API_ERROR_MESSAGES;
@@ -14682,7 +14979,9 @@ exports.DEFAULT_SORT_OPTIONS = DEFAULT_SORT_OPTIONS;
14682
14979
  exports.DEFAULT_TIME_SLOTS = DEFAULT_TIME_SLOTS;
14683
14980
  exports.DEFAULT_VEHICLE_ICONS = DEFAULT_VEHICLE_ICONS;
14684
14981
  exports.DateFilter = DateFilter;
14685
- exports.DateFilterDefaultLabels = DEFAULT_LABELS17;
14982
+ exports.DateFilterDefaultLabels = DEFAULT_LABELS18;
14983
+ exports.EmptyContent = EmptyContent;
14984
+ exports.EmptyContentDefaultLabels = DEFAULT_LABELS11;
14686
14985
  exports.FileUpload = FileUpload_default;
14687
14986
  exports.GENDER = GENDER;
14688
14987
  exports.HTTP_STATUS = HTTP_STATUS;
@@ -14693,7 +14992,7 @@ exports.MODAL_PRESETS = MODAL_PRESETS;
14693
14992
  exports.MY_TICKET_STATUS = MY_TICKET_STATUS;
14694
14993
  exports.MY_TICKET_TAB = MY_TICKET_TAB;
14695
14994
  exports.ModalFilterTicket = ModalFilterTicket;
14696
- exports.ModalFilterTicketDefaultLabels = DEFAULT_LABELS16;
14995
+ exports.ModalFilterTicketDefaultLabels = DEFAULT_LABELS17;
14697
14996
  exports.ModalIllustration = ModalIllustration;
14698
14997
  exports.ModalListMenuService = ModalListMenuService;
14699
14998
  exports.ModalListPassenger = ModalListPassenger;
@@ -14706,8 +15005,6 @@ exports.ModalSelectDate = ModalSelectDate;
14706
15005
  exports.ModalService = ModalService;
14707
15006
  exports.ModalTotalPassengers = ModalTotalPassengers;
14708
15007
  exports.ModalTypeOfService = ModalTypeOfService;
14709
- exports.NoContent = NoContent;
14710
- exports.NoContentDefaultLabels = DEFAULT_LABELS40;
14711
15008
  exports.PASSENGER_TYPE = PASSENGER_TYPE;
14712
15009
  exports.SortMenu = SortMenu;
14713
15010
  exports.Stepper = Stepper;