@asdp/ferryui 0.1.22-dev.10162 → 0.1.22-dev.10166

package/dist/index.js

@@ -13836,19 +13836,21 @@ var CardBookingTicket = ({
     /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Card, { className: styles.bookingDetailBottom, children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.totalPrice, children: [
         /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { children: mergedLabels.totalPriceLabel }),
-        /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Title3, { className: styles.priceText, children: [
-          mergedLabels.currencySymbol,
-          " ",
-          totalPrice
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          react.Icon,
-          {
-            icon: "fluent:chevron-down-24-filled",
-            onClick: onPriceDetailClick,
-            style: { cursor: "pointer" }
-          }
-        )
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", gap: reactComponents.tokens.spacingHorizontalL, alignItems: "center" }, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Title3, { className: styles.priceText, children: [
+            mergedLabels.currencySymbol,
+            " ",
+            totalPrice
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            react.Icon,
+            {
+              icon: "fluent:chevron-down-24-filled",
+              onClick: onPriceDetailClick,
+              style: { cursor: "pointer" }
+            }
+          )
+        ] })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.gapButton, children: [
         !(paymentStep === "pay") && /* @__PURE__ */ jsxRuntime.jsx(
@@ -14409,7 +14411,7 @@ var CardAddon = ({
             )
           ] })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.mealActions, children: [
+        mealData.showActions !== false && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.mealActions, children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.qtySelector, children: [
             /* @__PURE__ */ jsxRuntime.jsx(
               reactComponents.Button,
@@ -14767,8 +14769,9 @@ var useStyles32 = reactComponents.makeStyles({
   card: {
     padding: "1.5rem",
     borderRadius: reactComponents.tokens.borderRadiusXLarge,
-    boxShadow: reactComponents.tokens.shadow4,
-    zIndex: 3
+    boxShadow: "none",
+    zIndex: 3,
+    border: `${reactComponents.tokens.strokeWidthThin} solid ${reactComponents.tokens.colorNeutralStroke1}`
   },
   headerContainer: {
     display: "flex",
@@ -14874,93 +14877,69 @@ var DEFAULT_LABELS32 = {
 };
 var useStyles33 = reactComponents.makeStyles({
   card: {
-    padding: "1.5rem",
+    boxShadow: "none",
+    border: `${reactComponents.tokens.strokeWidthThin} solid ${reactComponents.tokens.colorNeutralStroke1}`,
     borderRadius: reactComponents.tokens.borderRadiusXLarge,
-    boxShadow: reactComponents.tokens.shadow4,
-    zIndex: 3
+    padding: `${reactComponents.tokens.spacingHorizontalL} ${reactComponents.tokens.spacingHorizontalXXL}`
   },
-  headerContainer: {
+  titleRow: {
     display: "flex",
     alignItems: "center",
-    marginBottom: "1rem",
-    gap: "1rem"
-  },
-  headerTitle: {
-    whiteSpace: "nowrap",
-    fontWeight: reactComponents.tokens.fontWeightSemibold
+    gap: reactComponents.tokens.spacingHorizontalS
   },
-  headerLine: {
-    height: "1px",
-    flexGrow: 1,
-    backgroundColor: reactComponents.tokens.colorNeutralStroke2
+  titleDivider: {
+    flex: 1
   },
-  contentContainer: {
+  list: {
     display: "flex",
-    flexDirection: "column"
+    flexDirection: "column",
+    rowGap: reactComponents.tokens.spacingVerticalL
   },
-  passengerItem: {
+  passengerCard: {
+    boxShadow: "none",
+    border: `${reactComponents.tokens.strokeWidthThin} solid ${reactComponents.tokens.colorNeutralStroke1}`,
+    borderRadius: reactComponents.tokens.borderRadius3XLarge,
+    padding: reactComponents.tokens.spacingHorizontalL
+  },
+  passengerRow: {
+    width: "100%",
+    alignItems: "center"
+  },
+  passengerInfo: {
     display: "flex",
     flexDirection: "column",
-    gap: reactComponents.tokens.spacingVerticalS,
-    paddingBottom: reactComponents.tokens.spacingVerticalL,
-    paddingTop: reactComponents.tokens.spacingVerticalM,
-    borderBottom: `1px solid ${reactComponents.tokens.colorNeutralStroke2}`,
-    ":last-child": {
-      borderBottom: "none",
-      paddingBottom: 0
-    }
-    // Matches styles.passengerItem in Review.tsx
+    gap: reactComponents.tokens.spacingVerticalXXS
   },
-  itemHeader: {
-    display: "flex",
-    justifyContent: "space-between",
-    alignItems: "center",
-    marginBottom: reactComponents.tokens.spacingVerticalS
+  passengerName: {
+    color: reactComponents.tokens.colorNeutralForeground1
   },
-  name: {
-    color: "#00B8D4",
-    // Cyan color from design
-    fontSize: reactComponents.tokens.fontSizeBase400
+  passengerMeta: {
+    color: reactComponents.tokens.colorNeutralForeground2
   },
-  // Badge Styles
   badgeContainer: {
-    display: "flex",
-    alignItems: "center",
-    position: "relative"
-  },
-  badgeContent: {
-    display: "flex",
+    display: "inline-flex",
     alignItems: "center",
-    padding: "0.25rem 0.75rem 0.25rem 1.5rem",
-    // Extra left padding for the icon overlap
-    borderRadius: "0 4px 4px 0",
-    borderTopRightRadius: "9999px",
-    borderBottomRightRadius: "9999px",
-    color: "white",
-    fontSize: reactComponents.tokens.fontSizeBase200,
-    fontWeight: reactComponents.tokens.fontWeightMedium,
-    marginLeft: "-14px",
-    // Pull the text container under the icon
-    minHeight: "24px"
+    overflow: "hidden",
+    borderRadius: reactComponents.tokens.borderRadiusXLarge,
+    minHeight: "32px",
+    boxShadow: reactComponents.tokens.shadow2
   },
   badgeIcon: {
-    width: "28px",
+    width: "32px",
     height: "32px",
-    zIndex: 1,
-    filter: "drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.1))"
-  },
-  fields: {
-    display: "grid",
-    gridTemplateColumns: "1fr 1fr",
-    gap: reactComponents.tokens.spacingHorizontalL
+    objectFit: "cover",
+    flexShrink: 0,
+    display: "block"
   },
-  inputBox: {
-    border: `1px solid ${reactComponents.tokens.colorNeutralStroke1}`,
-    borderRadius: reactComponents.tokens.borderRadiusMedium,
-    padding: `${reactComponents.tokens.spacingVerticalS} ${reactComponents.tokens.spacingHorizontalM}`,
-    display: "flex",
+  badgeContent: {
+    display: "inline-flex",
     alignItems: "center",
-    height: "32px"
+    minHeight: "32px",
+    padding: `0 ${reactComponents.tokens.spacingHorizontalM}`,
+    color: reactComponents.tokens.colorNeutralForegroundOnBrand,
+    fontSize: reactComponents.tokens.fontSizeBase200,
+    fontWeight: reactComponents.tokens.fontWeightSemibold,
+    whiteSpace: "nowrap"
   }
 });
 var CardReviewPassenger = ({
@@ -14973,48 +14952,140 @@ var CardReviewPassenger = ({
   const styles = useStyles33();
   const mergedLabels = { ...DEFAULT_LABELS32[language], ...labels };
   const displayTitle = title || mergedLabels.title;
-  return /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Card, { className: `${styles.card} ${className || ""}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.headerContainer, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { className: styles.headerTitle, children: displayTitle }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.headerLine })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.contentContainer, children: passengers.map((passenger, index) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Card, { className: `${styles.card} ${className || ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { direction: "column", nogutter: true, className: styles.list, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xs: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { nogutter: true, className: styles.titleRow, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { children: displayTitle }),
+      /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Divider, { className: styles.titleDivider })
+    ] }) }),
+    passengers.map((passenger, index) => {
       const badgeConfig = getBadgeConfig(passenger.serviceClass);
-      return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.passengerItem, children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.itemHeader, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle2, { className: styles.name, children: passenger.name }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.badgeContainer, children: [
-            badgeConfig.icon && /* @__PURE__ */ jsxRuntime.jsx(
-              reactComponents.Image,
-              {
-                src: badgeConfig.icon,
-                alt: passenger.ticketClass,
-                className: styles.badgeIcon,
-                height: 28,
-                width: 24
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "div",
-              {
-                className: styles.badgeContent,
-                style: { backgroundColor: badgeConfig.color },
-                children: passenger.ticketClass
-              }
-            )
-          ] })
+      const passengerMeta = `${passenger.ageLabel} \xB7 ${mergedLabels.idNumber} ${passenger.identityNumber}`;
+      return /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xs: 12, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Card, { className: styles.passengerCard, children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { nogutter: true, className: styles.passengerRow, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.passengerInfo, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle2, { className: styles.passengerName, children: passenger.name }),
+          /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.passengerMeta, children: passengerMeta })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xs: "content", children: /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: styles.badgeContainer,
+            style: { backgroundColor: badgeConfig.color },
+            children: [
+              badgeConfig.icon ? /* @__PURE__ */ jsxRuntime.jsx(
+                "img",
+                {
+                  src: badgeConfig.icon,
+                  alt: passenger.ticketClass,
+                  className: styles.badgeIcon
+                }
+              ) : null,
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.badgeContent, children: passenger.ticketClass })
+            ]
+          }
+        ) })
+      ] }) }) }, passenger.id || index);
+    })
+  ] }) });
+};
+
+// src/components/CardReviewDetail/CardReviewDetail.constants.ts
+var DEFAULT_LABELS33 = {
+  id: {
+    title: "Detail Pemesanan",
+    fromLabel: "Dari",
+    toLabel: "Ke",
+    scheduleLabel: "Jadwal Masuk",
+    bookingNameLabel: "Nama Pemesanan",
+    passengerTypeLabel: "Jenis Penumpang",
+    addOnLabel: "Add On",
+    viewDetail: "Lihat Detail"
+  },
+  en: {
+    title: "Booking Details",
+    fromLabel: "From",
+    toLabel: "To",
+    scheduleLabel: "Entry Schedule",
+    bookingNameLabel: "Booking Name",
+    passengerTypeLabel: "Passenger Type",
+    addOnLabel: "Add On",
+    viewDetail: "View Details"
+  }
+};
+var useStyles34 = reactComponents.makeStyles({
+  card: {
+    boxShadow: "none",
+    border: `${reactComponents.tokens.strokeWidthThin} solid ${reactComponents.tokens.colorNeutralStroke1}`,
+    borderRadius: reactComponents.tokens.borderRadiusXLarge,
+    padding: `${reactComponents.tokens.spacingHorizontalL} ${reactComponents.tokens.spacingHorizontalXXL}`
+  },
+  titleRow: {
+    display: "flex",
+    alignItems: "center",
+    gap: reactComponents.tokens.spacingHorizontalS
+  },
+  fieldRow: {
+    display: "flex",
+    alignItems: "flex-start",
+    gap: reactComponents.tokens.spacingHorizontalL
+  },
+  addOnRow: {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    width: "100%"
+  }
+});
+var CardReviewDetail = ({
+  language = "id",
+  labels,
+  from,
+  to,
+  scheduleTime,
+  bookingName,
+  passengerType,
+  addOnsCount,
+  onViewAddOns,
+  className
+}) => {
+  const styles = useStyles34();
+  const mergedLabels = { ...DEFAULT_LABELS33[language], ...labels };
+  return /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Card, { className: `${styles.card} ${className || ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { nogutter: true, direction: "column", style: { gap: reactComponents.tokens.spacingHorizontalL }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xs: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { nogutter: true, className: styles.titleRow, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { children: mergedLabels.title }),
+      /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Divider, { style: { width: 0 } })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xs: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { nogutter: true, className: styles.fieldRow, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Field, { label: mergedLabels.fromLabel, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: from }) }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Field, { label: mergedLabels.toLabel, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: to }) }) })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xs: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { nogutter: true, className: styles.fieldRow, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Field, { label: mergedLabels.scheduleLabel, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: scheduleTime }) }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Field, { label: mergedLabels.bookingNameLabel, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: bookingName }) }) })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { xs: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(reactGridSystem.Row, { nogutter: true, className: styles.fieldRow, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Field, { label: mergedLabels.passengerTypeLabel, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: passengerType }) }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(reactGridSystem.Col, { children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Field, { label: mergedLabels.addOnLabel, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.addOnRow, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Body1Strong, { children: [
+          addOnsCount,
+          " ",
+          addOnsCount === 1 ? "Layanan" : "Layanan"
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.fields, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Field, { label: mergedLabels.idNumber, size: "small", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.inputBox, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: passenger.identityNumber }) }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Field, { label: passenger.ageLabel, size: "small", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.inputBox, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: passenger.ageValue }) }) })
-        ] })
-      ] }, passenger.id || index);
-    }) })
-  ] });
+        /* @__PURE__ */ jsxRuntime.jsx(
+          reactComponents.Button,
+          {
+            appearance: "transparent",
+            onClick: onViewAddOns,
+            style: { color: brandColors[80] },
+            children: mergedLabels.viewDetail
+          }
+        )
+      ] }) }) })
+    ] }) })
+  ] }) });
 };
 
 // src/components/CardPriceDetails/CardPriceDetails.constants.ts
-var DEFAULT_LABELS33 = {
+var DEFAULT_LABELS34 = {
   id: {
     defaultTitle: "Rincian Harga",
     totalPayment: "Total Pembayaran",
@@ -15050,7 +15121,7 @@ var DEFAULT_LABELS33 = {
     currencyPrefix: "Rp. "
   }
 };
-var useStyles34 = reactComponents.makeStyles({
+var useStyles35 = reactComponents.makeStyles({
   list: {
     margin: 0,
     padding: 0,
@@ -15072,7 +15143,7 @@ var PriceDetailsTerms = ({
   language = "id",
   labels
 }) => {
-  const styles = useStyles34();
+  const styles = useStyles35();
   const linkColor = reactComponents.tokens.colorBrandBackground;
   const bookingTerms = labels.bookingTerms;
   const agreementTerms = [
@@ -15092,7 +15163,7 @@ var PriceDetailsTerms = ({
     ] })
   ] });
 };
-var useStyles35 = reactComponents.makeStyles({
+var useStyles36 = reactComponents.makeStyles({
   card: {
     padding: "1.5rem",
     borderRadius: reactComponents.tokens.borderRadiusXLarge,
@@ -15169,8 +15240,8 @@ var CardPriceDetails = ({
   total,
   labels
 }) => {
-  const styles = useStyles35();
-  const mergedLabels = { ...DEFAULT_LABELS33[language], ...labels };
+  const styles = useStyles36();
+  const mergedLabels = { ...DEFAULT_LABELS34[language], ...labels };
   const displayTitle = title || mergedLabels.defaultTitle;
   const getVariantClass = (variant) => {
     switch (variant) {
@@ -15229,7 +15300,7 @@ var CardPriceDetails = ({
 };
 
 // src/components/CardPaymentMethodList/CardPaymentMethodList.constants.ts
-var DEFAULT_LABELS34 = {
+var DEFAULT_LABELS35 = {
   id: {
     selectAriaLabel: "Pilih metode pembayaran"
   },
@@ -15237,7 +15308,7 @@ var DEFAULT_LABELS34 = {
     selectAriaLabel: "Select payment method"
   }
 };
-var useStyles36 = reactComponents.makeStyles({
+var useStyles37 = reactComponents.makeStyles({
   container: {
     display: "flex",
     flexDirection: "column",
@@ -15297,8 +15368,8 @@ var CardPaymentMethodList = ({
   selectedValue,
   onSelect
 }) => {
-  const styles = useStyles36();
-  const mergedLabels = { ...DEFAULT_LABELS34[language], ...labels };
+  const styles = useStyles37();
+  const mergedLabels = { ...DEFAULT_LABELS35[language], ...labels };
   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: [
     index > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.dividerContainer, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Divider, {}) }),
     /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Accordion, { multiple: true, collapsible: true, children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.AccordionItem, { value: category.value, children: [
@@ -15347,7 +15418,7 @@ var CardPaymentMethodList = ({
 };
 
 // src/components/CardPaymentGuide/CardPaymentGuide.constants.ts
-var DEFAULT_LABELS35 = {
+var DEFAULT_LABELS36 = {
   id: {
     title: "Cara Pembayaran"
   },
@@ -15355,7 +15426,7 @@ var DEFAULT_LABELS35 = {
     title: "Payment Method"
   }
 };
-var useStyles37 = reactComponents.makeStyles({
+var useStyles38 = reactComponents.makeStyles({
   container: {
     display: "flex",
     flexDirection: "column",
@@ -15391,8 +15462,8 @@ var CardPaymentGuide = ({
   guides,
   className
 }) => {
-  const styles = useStyles37();
-  const mergedLabels = { ...DEFAULT_LABELS35[language], ...labels };
+  const styles = useStyles38();
+  const mergedLabels = { ...DEFAULT_LABELS36[language], ...labels };
   const displayTitle = title || mergedLabels.title;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${styles.container} ${className || ""}`, children: [
     displayTitle && /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.titleContainer, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { className: styles.title, children: displayTitle }) }),
@@ -15411,7 +15482,7 @@ var CardPaymentGuide = ({
 };
 
 // src/components/CardPaymentInfo/CardPaymentInfo.constants.ts
-var DEFAULT_LABELS36 = {
+var DEFAULT_LABELS37 = {
   id: {
     expiryPrefix: "Kode virtual akun berlaku sampai",
     copyCodeButton: "Salin Kode",
@@ -15431,7 +15502,7 @@ var DEFAULT_LABELS36 = {
     changePayment: "Change Payment Method"
   }
 };
-var useStyles38 = reactComponents.makeStyles({
+var useStyles39 = reactComponents.makeStyles({
   container: {
     display: "flex",
     flexDirection: "column",
@@ -15523,8 +15594,8 @@ var CardPaymentInfo = ({
   onCheckStatus,
   onChangePayment
 }) => {
-  const styles = useStyles38();
-  const mergedLabels = { ...DEFAULT_LABELS36[language], ...labels };
+  const styles = useStyles39();
+  const mergedLabels = { ...DEFAULT_LABELS37[language], ...labels };
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.card, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.container, children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.headerRow, children: [
       /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { children: mergedLabels.expiryPrefix }),
@@ -15596,7 +15667,7 @@ var CardPaymentInfo = ({
 };
 
 // src/components/CardStatusOrder/CardStatusOrder.constants.ts
-var DEFAULT_LABELS37 = {
+var DEFAULT_LABELS38 = {
   id: {
     detailTitle: "Detail Pemesanan",
     statusLabel: "Status",
@@ -15626,7 +15697,7 @@ var DEFAULT_LABELS37 = {
     illustrationAlt: "E-Ticket Illustration"
   }
 };
-var useStyles39 = reactComponents.makeStyles({
+var useStyles40 = reactComponents.makeStyles({
   activeCard: {
     width: "100%",
     // padding: tokens.spacingHorizontalNone, // default
@@ -15696,8 +15767,8 @@ var CardStatusOrder = ({
   onClickViewTicket,
   className
 }) => {
-  const styles = useStyles39();
-  const mergedLabels = { ...DEFAULT_LABELS37[language], ...labels };
+  const styles = useStyles40();
+  const mergedLabels = { ...DEFAULT_LABELS38[language], ...labels };
   const displayStatus = statusLabel || mergedLabels.defaultStatus;
   const displayTitle = title || mergedLabels.defaultTitle;
   const displayDescription = description || mergedLabels.defaultDescription;
@@ -15794,7 +15865,7 @@ var CardStatusOrder = ({
 };
 
 // src/components/ModalPriceDetail/ModalPriceDetail.constants.ts
-var DEFAULT_LABELS38 = {
+var DEFAULT_LABELS39 = {
   id: {
     title: "Rincian Harga",
     addonHeader: "Add On",
@@ -15820,7 +15891,7 @@ var DEFAULT_LABELS38 = {
     closeAriaLabel: "Close"
   }
 };
-var useStyles40 = reactComponents.makeStyles({
+var useStyles41 = reactComponents.makeStyles({
   surface: {
     width: "680px",
     maxWidth: "90vw",
@@ -15947,8 +16018,8 @@ var ModalPriceDetail = ({
   grandTotal,
   ...props
 }) => {
-  const styles = useStyles40();
-  const mergedLabels = { ...DEFAULT_LABELS38[language], ...labels };
+  const styles = useStyles41();
+  const mergedLabels = { ...DEFAULT_LABELS39[language], ...labels };
   return /* @__PURE__ */ jsxRuntime.jsx(
     reactComponents.Dialog,
     {
@@ -16090,7 +16161,7 @@ var ModalPriceDetail = ({
 // src/components/FileUpload/FileUpload.constants.ts
 var ACCEPTED_FILES = ".pdf,.jpg,.jpeg,.png";
 var MAX_FILE_SIZE_MB = 10;
-var DEFAULT_LABELS39 = {
+var DEFAULT_LABELS40 = {
   id: {
     placeholder: "Ketuk untuk pilih file",
     maxSizeWarning: "Maksimal {maxSize}MB per file dalam format PDF, JPG, JPEG, PNG.",
@@ -16108,7 +16179,7 @@ var DEFAULT_LABELS39 = {
     downloadTemplateDocument: "Download Template Document"
   }
 };
-var useStyles41 = reactComponents.makeStyles({
+var useStyles42 = reactComponents.makeStyles({
   surface: {
     maxWidth: "90vw",
     maxHeight: "90vh",
@@ -16135,7 +16206,7 @@ var ModalPreviewImage = ({
   imageUrl,
   alt = "Preview"
 }) => {
-  const styles = useStyles41();
+  const styles = useStyles42();
   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: [
     /* @__PURE__ */ jsxRuntime.jsx(
       reactComponents.DialogTitle,
@@ -16261,7 +16332,7 @@ var FileUpload = React__default.default.forwardRef(
     downloadTemplateDocument = false,
     infoLabel
   }, ref) => {
-    const mergedLabels = { ...DEFAULT_LABELS39[language], ...customLabels };
+    const mergedLabels = { ...DEFAULT_LABELS40[language], ...customLabels };
     const styles = uploadStyles();
     const fileInputRef = React.useRef(null);
     const [, setIsDragOver] = React.useState(false);
@@ -16698,11 +16769,11 @@ function hexToRgba(hex, alpha = 1) {
 }
 
 // src/components/CardProfileMenu/CardProfileMenu.constants.ts
-var DEFAULT_LABELS40 = {
+var DEFAULT_LABELS41 = {
   id: {},
   en: {}
 };
-var useStyles42 = reactComponents.makeStyles({
+var useStyles43 = reactComponents.makeStyles({
   container: {
     display: "flex",
     flexDirection: "column",
@@ -16762,8 +16833,8 @@ var CardProfileMenu = ({
   selectedValue,
   onTabSelect
 }) => {
-  const styles = useStyles42();
-  ({ ...DEFAULT_LABELS40[language], ...labels });
+  const styles = useStyles43();
+  ({ ...DEFAULT_LABELS41[language], ...labels });
   const handleTabSelect = (_, data) => {
     onTabSelect(data.value);
   };
@@ -16812,6 +16883,7 @@ exports.CardPriceDetails = CardPriceDetails;
 exports.CardProfileMenu = CardProfileMenu;
 exports.CardPromo = CardPromo;
 exports.CardReview = CardReview;
+exports.CardReviewDetail = CardReviewDetail;
 exports.CardReviewPassenger = CardReviewPassenger;
 exports.CardServiceMenu = CardServiceMenu;
 exports.CardStatusOrder = CardStatusOrder;