@asdp/ferryui 0.1.22-dev.8653 → 0.1.22-dev.8661

package/dist/index.js

@@ -362,11 +362,17 @@ var CarouselWithCustomNav = ({
 var DEFAULT_LABELS3 = {
   id: {
     defaultImageAlt: "Gambar Promo",
-    defaultButtonText: "Lihat Detail"
+    defaultButtonText: "Lihat Detail",
+    promoAriaLabel: "Promo {index} dari {total}",
+    promoAriaLabelSingle: "Promo {index}",
+    loadingContent: "Memuat konten"
   },
   en: {
     defaultImageAlt: "Promo Image",
-    defaultButtonText: "View Details"
+    defaultButtonText: "View Details",
+    promoAriaLabel: "Promo {index} of {total}",
+    promoAriaLabelSingle: "Promo {index}",
+    loadingContent: "Loading content"
   }
 };
 var useStyles3 = reactComponents.makeStyles({
@@ -473,7 +479,10 @@ var CardPromo = ({
   const mergedLabels = { ...DEFAULT_LABELS3[language], ...labels };
   const displayImageAlt = imageAlt || mergedLabels.defaultImageAlt;
   const displayButtonText = buttonText || mergedLabels.defaultButtonText;
-  const ariaLabel = totalCards ? `Card ${index + 1} of ${totalCards}` : `Promo card ${index + 1}`;
+  const ariaLabel = totalCards ? mergedLabels.promoAriaLabel.replace("{index}", (index + 1).toString()).replace("{total}", totalCards.toString()) : mergedLabels.promoAriaLabelSingle.replace(
+    "{index}",
+    (index + 1).toString()
+  );
   if (isLoading) {
     return /* @__PURE__ */ jsxRuntime.jsx(
       reactComponents.CarouselCard,
@@ -481,7 +490,7 @@ var CardPromo = ({
         autoSize: true,
         className: reactComponents.mergeClasses(classes.actionCard, className),
         style: { cursor: "default" },
-        children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Skeleton, { "aria-label": "Loading content", children: [
+        children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Skeleton, { "aria-label": mergedLabels.loadingContent, children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: reactComponents.mergeClasses(classes.imageContainer, imageClassName), children: /* @__PURE__ */ jsxRuntime.jsx(
             reactComponents.SkeletonItem,
             {
@@ -809,7 +818,8 @@ var DEFAULT_LABELS5 = {
     facilitiesLabel: "Fasilitas",
     selectTicketButton: "Pilih Tiket",
     timezoneLabel: "WIB",
-    currencySymbol: "IDR"
+    currencySymbol: "IDR",
+    logoAlt: "Logo ASDP"
   },
   en: {
     availableSeatsLabel: "Available",
@@ -820,7 +830,8 @@ var DEFAULT_LABELS5 = {
     facilitiesLabel: "Facilities",
     selectTicketButton: "Select Ticket",
     timezoneLabel: "WIB",
-    currencySymbol: "IDR"
+    currencySymbol: "IDR",
+    logoAlt: "ASDP Logo"
   }
 };
 var useStyles5 = reactComponents.makeStyles({
@@ -1120,7 +1131,7 @@ var CardTicket = ({
                   {
                     src: "/assets/logo/asdp-default.svg",
                     className: styles.asdpLogo,
-                    alt: "asdp",
+                    alt: mergedLabels.logoAlt,
                     height: 56,
                     width: 82
                   }
@@ -1563,7 +1574,8 @@ var DEFAULT_LABELS6 = {
     hotelLabel: "Hotel",
     hotelDescription: "Layanan pemesanan hotel",
     otherLabel: "Lainnya",
-    otherDescription: "Layanan lainnya"
+    otherDescription: "Layanan lainnya",
+    serviceAriaLabel: "Layanan"
   },
   en: {
     ferryLabel: "Ferry",
@@ -1575,7 +1587,8 @@ var DEFAULT_LABELS6 = {
     hotelLabel: "Hotel",
     hotelDescription: "Hotel Booking Service",
     otherLabel: "Other",
-    otherDescription: "Other Services"
+    otherDescription: "Other Services",
+    serviceAriaLabel: "Service"
   }
 };
 var ALIAS_MENU_ITEMS = {
@@ -1718,6 +1731,7 @@ var CardServiceMenu = ({
         {
           className: getMenuItemClass(item.id),
           onClick: () => onServiceClick?.(item.id),
+          "aria-label": `${mergedLabels.serviceAriaLabel} ${label}`,
           children: [
             /* @__PURE__ */ jsxRuntime.jsx("img", { src: item.logo, alt: label, className: styles.logo }),
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.textContent, children: [
@@ -1773,54 +1787,62 @@ var DatePickerInput = React5.forwardRef(
       }
       onClick?.(e);
     };
-    return /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Popover, { open: isOpen, onOpenChange: (_, data) => setIsOpen(data.open), trapFocus: true, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(reactComponents.PopoverTrigger, { disableButtonEnhancement: true, children: /* @__PURE__ */ jsxRuntime.jsx(
-        reactComponents.Input,
-        {
-          ...restProps,
-          value: formatDate(field.value),
-          readOnly: true,
-          placeholder: placeholder || "Pilih tanggal",
-          disabled,
-          appearance,
-          size,
-          contentBefore,
-          onClick: handleInputClick,
-          style: {
-            cursor: disabled ? "not-allowed" : "pointer",
-            ...style
-          },
-          contentAfter: /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      reactComponents.Popover,
+      {
+        open: isOpen,
+        onOpenChange: (_, data) => setIsOpen(data.open),
+        trapFocus: true,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(reactComponents.PopoverTrigger, { disableButtonEnhancement: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+            reactComponents.Input,
             {
-              onClick: (e) => {
-                e.stopPropagation();
-                if (!disabled) {
-                  setIsOpen(!isOpen);
-                }
-              },
+              ...restProps,
+              value: formatDate(field.value),
+              readOnly: true,
+              placeholder,
+              disabled,
+              appearance,
+              size,
+              contentBefore,
+              onClick: handleInputClick,
               style: {
                 cursor: disabled ? "not-allowed" : "pointer",
-                display: "flex",
-                alignItems: "center"
+                ...style
               },
-              children: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:calendar-24-regular" })
+              contentAfter: /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    if (!disabled) {
+                      setIsOpen(!isOpen);
+                    }
+                  },
+                  style: {
+                    cursor: disabled ? "not-allowed" : "pointer",
+                    display: "flex",
+                    alignItems: "center"
+                  },
+                  children: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:calendar-24-regular" })
+                }
+              )
             }
-          )
-        }
-      ) }),
-      /* @__PURE__ */ jsxRuntime.jsx(reactComponents.PopoverSurface, { tabIndex: -1, style: { maxWidth: "530px" }, children: /* @__PURE__ */ jsxRuntime.jsx(
-        reactCalendarCompat.Calendar,
-        {
-          value: dateValue,
-          onSelectDate,
-          showGoToToday: true,
-          highlightSelectedMonth: true,
-          showMonthPickerAsOverlay: false,
-          maxDate: max ? new Date(max) : void 0
-        }
-      ) })
-    ] });
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsx(reactComponents.PopoverSurface, { tabIndex: -1, style: { maxWidth: "530px" }, children: /* @__PURE__ */ jsxRuntime.jsx(
+            reactCalendarCompat.Calendar,
+            {
+              value: dateValue,
+              onSelectDate,
+              showGoToToday: true,
+              highlightSelectedMonth: true,
+              showMonthPickerAsOverlay: false,
+              maxDate: max ? new Date(max) : void 0
+            }
+          ) })
+        ]
+      }
+    );
   }
 );
 DatePickerInput.displayName = "DatePickerInput";
@@ -1834,7 +1856,14 @@ var DEFAULT_LABELS7 = {
     phonePlaceholder: "Nomor HP",
     identityPlaceholder: "Email, KTP, SIM, Passport, atau Nomor Telepon",
     identityPhonePlaceholder: "Nomor telepon",
-    identityIdPlaceholder: "KTP, SIM, atau Passport"
+    identityIdPlaceholder: "KTP, SIM, atau Passport",
+    showPasswordAriaLabel: "Tampilkan kata sandi",
+    hidePasswordAriaLabel: "Sembunyikan kata sandi",
+    datePickerPlaceholder: "Pilih tanggal",
+    phoneDefaultPlaceholder: "Nomor telepon",
+    requiredFieldError: "Field ini wajib diisi",
+    invalidEmailError: "Email tidak valid",
+    emailOrPhoneRequiredError: "Email atau nomor HP wajib diisi"
   },
   en: {
     emailOrPhonePlaceholder: "Email or Phone Number",
@@ -1842,7 +1871,14 @@ var DEFAULT_LABELS7 = {
     phonePlaceholder: "Phone Number",
     identityPlaceholder: "Email, ID Card, Driving License, Passport, or Phone Number",
     identityPhonePlaceholder: "Phone Number",
-    identityIdPlaceholder: "ID Card, Driving License, or Passport"
+    identityIdPlaceholder: "ID Card, Driving License, or Passport",
+    showPasswordAriaLabel: "Show password",
+    hidePasswordAriaLabel: "Hide password",
+    datePickerPlaceholder: "Select date",
+    phoneDefaultPlaceholder: "Phone number",
+    requiredFieldError: "This field is required",
+    invalidEmailError: "Invalid email",
+    emailOrPhoneRequiredError: "Email or phone number is required"
   }
 };
 var PhoneInput = PhoneInputComponent__default.default.default || PhoneInputComponent__default.default;
@@ -2525,7 +2561,7 @@ var InputDynamic = ({
                   const cleanedValue = cleanPhoneValue(value || "");
                   field.onChange(cleanedValue);
                 },
-                placeholder: placeholder || "Nomor telepon",
+                placeholder: placeholder || mergedLabels.phoneDefaultPlaceholder,
                 disabled,
                 enableSearch: true,
                 disableSearchIcon: true
@@ -2566,7 +2602,7 @@ var InputDynamic = ({
           DatePickerInput_default,
           {
             field,
-            placeholder,
+            placeholder: placeholder || mergedLabels.datePickerPlaceholder,
             disabled,
             appearance: error ? "outline" : appearance,
             size,
@@ -2661,7 +2697,7 @@ var InputDynamic = ({
               {
                 appearance: "transparent",
                 icon: showPassword ? /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:eye-off-24-filled" }) : /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:eye-24-filled" }),
-                "aria-label": showPassword ? "Hide password" : "Show password",
+                "aria-label": showPassword ? mergedLabels.hidePasswordAriaLabel : mergedLabels.showPasswordAriaLabel,
                 onClick: () => setShowPassword(!showPassword),
                 tabIndex: -1,
                 type: "button"
@@ -2826,7 +2862,7 @@ var InputDynamic = ({
   const getValidationRules = () => {
     const rules = {};
     if (required) {
-      rules.required = validationRules?.required || "Field ini wajib diisi";
+      rules.required = validationRules?.required || mergedLabels.requiredFieldError;
     }
     if (validationRules?.minLength) {
       rules.minLength = validationRules.minLength;
@@ -2849,13 +2885,13 @@ var InputDynamic = ({
     if (type === "email") {
       rules.pattern = {
         value: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i,
-        message: "Email tidak valid"
+        message: mergedLabels.invalidEmailError
       };
     }
     if (type === "emailOrPhone") {
       rules.validate = (value) => {
         if (required && !value) {
-          return "Email atau nomor HP wajib diisi";
+          return mergedLabels.emailOrPhoneRequiredError;
         }
         const stringValue = typeof value === "string" ? value : "";
         if (!stringValue) return true;
@@ -3211,7 +3247,13 @@ var DEFAULT_LABELS8 = {
     errorOriginRequired: "Pelabuhan asal wajib diisi",
     errorDestinationRequired: "Pelabuhan tujuan wajib diisi",
     errorDepartureDateRequired: "Tanggal Berangkat wajib diisi",
-    errorReturnDateRequired: "Tanggal Pulang wajib diisi"
+    errorReturnDateRequired: "Tanggal Pulang wajib diisi",
+    switchAriaLabel: "Tukar asal dan tujuan",
+    ferryDescription: "Layanan Penyeberangan Ferry ASDP",
+    ifcsDescription: "Sistem Kontrol Ferry Terintegrasi",
+    skptDescription: "Sistem Tiket Penumpang Terintegrasi",
+    hotelDescription: "Layanan Pemesanan Hotel",
+    otherDescription: "Layanan Lainnya"
   },
   en: {
     fromLabel: "From",
@@ -3233,7 +3275,13 @@ var DEFAULT_LABELS8 = {
     errorOriginRequired: "Origin port is required",
     errorDestinationRequired: "Destination port is required",
     errorDepartureDateRequired: "Departure date is required",
-    errorReturnDateRequired: "Return date is required"
+    errorReturnDateRequired: "Return date is required",
+    switchAriaLabel: "Swap origin and destination",
+    ferryDescription: "ASDP Ferry Crossing Service",
+    ifcsDescription: "Integrated Ferry Control System",
+    skptDescription: "Integrated Passenger Ticketing System",
+    hotelDescription: "Hotel Booking Service",
+    otherDescription: "Other Services"
   }
 };
 var useStyles8 = reactComponents.makeStyles({
@@ -3538,6 +3586,7 @@ var CardTicketSearch = ({
                                 appearance: "secondary",
                                 size: "large",
                                 disabled: switchDisabled,
+                                "aria-label": labels.switchAriaLabel,
                                 icon: /* @__PURE__ */ jsxRuntime.jsx(
                                   "div",
                                   {
@@ -3546,7 +3595,7 @@ var CardTicketSearch = ({
                                       "img",
                                       {
                                         src: "/assets/images/icons/switch.svg",
-                                        alt: "Switch",
+                                        alt: labels.switchAriaLabel,
                                         width: 26,
                                         height: 26
                                       }
@@ -3866,7 +3915,8 @@ var DEFAULT_LABELS9 = {
     serviceClass: "Kelas Layanan",
     typeOfService: "Jenis Layanan",
     totalPassengers: "Jumlah Penumpang",
-    changeSearchButton: "Ganti Pencarian"
+    changeSearchButton: "Ganti Pencarian",
+    swapAriaLabel: "Tukar asal dan tujuan"
   },
   en: {
     originHarbor: "Departure Port",
@@ -3875,7 +3925,8 @@ var DEFAULT_LABELS9 = {
     serviceClass: "Service Class",
     typeOfService: "Service Type",
     totalPassengers: "Total Passengers",
-    changeSearchButton: "Change Search"
+    changeSearchButton: "Change Search",
+    swapAriaLabel: "Swap origin and destination"
   }
 };
 var useStyles9 = reactComponents.makeStyles({
@@ -4055,7 +4106,8 @@ var CardTicketSearchSummary = ({
                     disabled: true,
                     appearance: "secondary",
                     size: "medium",
-                    icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:arrow-swap-24-filled" })
+                    icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:arrow-swap-24-filled" }),
+                    "aria-label": mergedLabels.swapAriaLabel
                   }
                 ) })
               }
@@ -4292,7 +4344,8 @@ var DEFAULT_LABELS10 = {
     clearAllButton: "Hapus Semua",
     allHarborsHeader: "Semua Pelabuhan",
     loadingData: "Memuat data...",
-    harborNotFound: "Pelabuhan tidak ditemukan"
+    harborNotFound: "Pelabuhan tidak ditemukan",
+    closeAriaLabel: "Tutup"
   },
   en: {
     title: "Select Harbor",
@@ -4301,7 +4354,8 @@ var DEFAULT_LABELS10 = {
     clearAllButton: "Clear All",
     allHarborsHeader: "All Harbors",
     loadingData: "Loading data...",
-    harborNotFound: "Harbor not found"
+    harborNotFound: "Harbor not found",
+    closeAriaLabel: "Close"
   }
 };
 var useStyles10 = reactComponents.makeStyles({
@@ -4463,7 +4517,7 @@ var ModalSearchHarbor = ({
               reactComponents.Button,
               {
                 appearance: "subtle",
-                "aria-label": "close",
+                "aria-label": mergedLabels.closeAriaLabel,
                 icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:dismiss-24-regular" }),
                 onClick: handleClose,
                 className: styles.closeButton
@@ -4588,12 +4642,14 @@ var DEFAULT_LABELS11 = {
   id: {
     title: "Pilih Tanggal",
     oneWay: "Sekali Jalan",
-    roundTrip: "Pulang Pergi"
+    roundTrip: "Pulang Pergi",
+    closeAriaLabel: "Tutup"
   },
   en: {
     title: "Select Date",
     oneWay: "One Way",
-    roundTrip: "Round Trip"
+    roundTrip: "Round Trip",
+    closeAriaLabel: "Close"
   }
 };
 var useStyles11 = reactComponents.makeStyles({
@@ -4881,7 +4937,7 @@ var ModalSelectDate = ({
               reactComponents.Button,
               {
                 appearance: "subtle",
-                "aria-label": "close",
+                "aria-label": mergedLabels.closeAriaLabel,
                 icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:dismiss-24-regular" }),
                 onClick: handleClose,
                 className: styles.closeButton
@@ -4946,14 +5002,16 @@ var DEFAULT_LABELS12 = {
     loading: "Memuat...",
     error: "Gagal memuat layanan",
     selectAll: "Pilih Semua",
-    saveButton: "Simpan"
+    saveButton: "Simpan",
+    closeAriaLabel: "Tutup"
   },
   en: {
     title: "Select Service Class",
     loading: "Loading...",
     error: "Error loading services",
     selectAll: "Select All",
-    saveButton: "Save"
+    saveButton: "Save",
+    closeAriaLabel: "Close"
   }
 };
 var useStyles12 = reactComponents.makeStyles({
@@ -5088,7 +5146,7 @@ var ModalService = ({
           reactComponents.Button,
           {
             appearance: "subtle",
-            "aria-label": "close",
+            "aria-label": mergedLabels.closeAriaLabel,
             icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:dismiss-24-regular" }),
             onClick: handleClose,
             className: styles.closeButton
@@ -5156,7 +5214,8 @@ var DEFAULT_LABELS13 = {
     saveButton: "Simpan",
     economy: "Ekonomi",
     business: "Bisnis",
-    executive: "Eksekutif"
+    executive: "Eksekutif",
+    closeAriaLabel: "Tutup"
   },
   en: {
     title: "Select Total Passengers",
@@ -5165,7 +5224,8 @@ var DEFAULT_LABELS13 = {
     saveButton: "Save",
     economy: "Economy",
     business: "Business",
-    executive: "Executive"
+    executive: "Executive",
+    closeAriaLabel: "Close"
   }
 };
 var DEFAULT_SERVICE_CLASSES = [
@@ -5406,7 +5466,7 @@ var ModalTotalPassengers = ({
           reactComponents.Button,
           {
             appearance: "subtle",
-            "aria-label": "close",
+            "aria-label": mergedLabels.closeAriaLabel,
             icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:dismiss-12-regular" }),
             onClick: onClose
           }
@@ -5525,13 +5585,15 @@ var DEFAULT_LABELS14 = {
     title: "Pilih Tipe Layanan",
     cancelButton: "Batal",
     saveButton: "Simpan",
-    vehiclesAlt: "kendaraan"
+    vehiclesAlt: "kendaraan",
+    closeAriaLabel: "Tutup"
   },
   en: {
     title: "Select Service Type",
     cancelButton: "Cancel",
     saveButton: "Save",
-    vehiclesAlt: "vehicles"
+    vehiclesAlt: "vehicles",
+    closeAriaLabel: "Close"
   }
 };
 var DEFAULT_VEHICLE_ICONS = {
@@ -5709,7 +5771,7 @@ var ModalTypeOfService = ({
           reactComponents.Button,
           {
             appearance: "subtle",
-            "aria-label": "close",
+            "aria-label": mergedLabels.closeAriaLabel,
             icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:dismiss-24-regular" }),
             onClick: onClose,
             className: styles.closeButton
@@ -5852,7 +5914,8 @@ var DEFAULT_LABELS15 = {
     highestPrice: "Harga Tertinggi",
     lowestPrice: "Harga Terendah",
     earliestDeparture: "Keberangkatan Paling Awal",
-    latestDeparture: "Keberangkatan Paling Akhir"
+    latestDeparture: "Keberangkatan Paling Akhir",
+    resetSortAriaLabel: "Hapus pengurutan"
   },
   en: {
     filterButtonText: "Filter",
@@ -5862,7 +5925,8 @@ var DEFAULT_LABELS15 = {
     highestPrice: "Highest Price",
     lowestPrice: "Lowest Price",
     earliestDeparture: "Earliest Departure",
-    latestDeparture: "Latest Departure"
+    latestDeparture: "Latest Departure",
+    resetSortAriaLabel: "Clear sort"
   }
 };
 var getSortOptions = (labels) => [
@@ -6007,6 +6071,7 @@ var SortMenu = ({
         type: "button",
         shape: "circular",
         className: styles.button,
+        "aria-label": labels.resetSortAriaLabel,
         children: currentSortLabel
       }
     ),
@@ -6049,7 +6114,8 @@ var DEFAULT_LABELS16 = {
     resetButton: "Reset",
     applyButton: "Terapkan",
     hourUnit: "jam",
-    currencySymbol: "IDR"
+    currencySymbol: "IDR",
+    closeAriaLabel: "Tutup"
   },
   en: {
     title: "Filter by",
@@ -6066,7 +6132,8 @@ var DEFAULT_LABELS16 = {
     resetButton: "Reset",
     applyButton: "Apply",
     hourUnit: "hours",
-    currencySymbol: "IDR"
+    currencySymbol: "IDR",
+    closeAriaLabel: "Close"
   }
 };
 var DEFAULT_SERVICE_TYPES = [
@@ -6345,7 +6412,7 @@ var ModalFilterTicket = ({
           reactComponents.Button,
           {
             appearance: "subtle",
-            "aria-label": "close",
+            "aria-label": mergedLabels.closeAriaLabel,
             icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:dismiss-24-regular" }),
             className: styles.closeButton,
             onClick: () => onOpenChange(false)
@@ -6692,7 +6759,8 @@ var DEFAULT_LABELS18 = {
     typeOfServicePlaceholder: "Pilih Jenis penumpang",
     passengerLabel: "Penumpang",
     passengerPlaceholder: "Pilih Penumpang",
-    searchButton: "Cari Tiket"
+    searchButton: "Cari Tiket",
+    closeAriaLabel: "Tutup"
   },
   en: {
     title: "Search Other Schedules",
@@ -6715,7 +6783,8 @@ var DEFAULT_LABELS18 = {
     typeOfServicePlaceholder: "Select Type of Passenger",
     passengerLabel: "Passenger",
     passengerPlaceholder: "Select Passenger",
-    searchButton: "Search Ticket"
+    searchButton: "Search Ticket",
+    closeAriaLabel: "Close"
   }
 };
 var DEFAULT_FORM_VALUES = {
@@ -6885,7 +6954,7 @@ var ModalSearchTicket = ({
               reactComponents.Button,
               {
                 appearance: "subtle",
-                "aria-label": "close",
+                "aria-label": mergedLabels.closeAriaLabel,
                 className: styles.closeButton,
                 icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:dismiss-24-regular" }),
                 onClick: onClose
@@ -7532,14 +7601,28 @@ var DEFAULT_LABELS21 = {
     sameAsOrderer: "Sama Dengan Pemesan",
     searchPlaceholder: "Cari Penumpang",
     addPassengerButton: "Tambah Penumpang",
-    cancelButton: "Batal"
+    cancelButton: "Batal",
+    editPassengerAriaLabel: "Edit data penumpang",
+    categories: {
+      adult: "Dewasa",
+      child: "Anak",
+      infant: "Bayi",
+      elderly: "Lansia"
+    }
   },
   en: {
     title: "Passenger Details",
     sameAsOrderer: "Same as Orderer",
     searchPlaceholder: "Search Passenger",
     addPassengerButton: "Add Passenger",
-    cancelButton: "Cancel"
+    cancelButton: "Cancel",
+    editPassengerAriaLabel: "Edit passenger data",
+    categories: {
+      adult: "Adult",
+      child: "Child",
+      infant: "Infant",
+      elderly: "Elderly"
+    }
   }
 };
 var useStyles21 = reactComponents.makeStyles({
@@ -7666,20 +7749,31 @@ var ModalListPassenger = ({
                 /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.Subtitle2, { children: [
                   passenger.name,
                   " (",
-                  passenger.category,
+                  (() => {
+                    const cat = passenger.category?.toUpperCase();
+                    if (cat === "ADULT")
+                      return mergedLabels.categories.adult;
+                    if (cat === "CHILD")
+                      return mergedLabels.categories.child;
+                    if (cat === "INFANT")
+                      return mergedLabels.categories.infant;
+                    if (cat === "ELDERLY")
+                      return mergedLabels.categories.elderly;
+                    return passenger.category;
+                  })(),
                   ")"
                 ] }) }),
                 /* @__PURE__ */ jsxRuntime.jsx(
-                  react.Icon,
+                  reactComponents.Button,
                   {
-                    icon: "fluent:chevron-right-24-regular",
+                    appearance: "transparent",
+                    icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:chevron-right-24-regular" }),
                     onClick: (e) => {
                       e.preventDefault();
                       e.stopPropagation();
                       onEditPassenger(passenger);
                     },
-                    width: 20,
-                    height: 20
+                    "aria-label": mergedLabels.editPassengerAriaLabel
                   }
                 )
               ]
@@ -8380,7 +8474,10 @@ var DEFAULT_LABELS25 = {
       unit: "Unit"
     },
     pricePlaceholder: "Rp. 0",
-    currencySymbol: "Rp."
+    currencySymbol: "Rp.",
+    deleteOwnerAriaLabel: "Hapus pemilik",
+    decrementQuantityAriaLabel: "Kurangi jumlah",
+    incrementQuantityAriaLabel: "Tambah jumlah"
   },
   en: {
     title: "Owner & Cargo Information",
@@ -8430,7 +8527,10 @@ var DEFAULT_LABELS25 = {
       unit: "Unit"
     },
     pricePlaceholder: "Rp. 0",
-    currencySymbol: "Rp."
+    currencySymbol: "Rp.",
+    deleteOwnerAriaLabel: "Delete owner",
+    decrementQuantityAriaLabel: "Decrease quantity",
+    incrementQuantityAriaLabel: "Increase quantity"
   }
 };
 var useStyles25 = reactComponents.makeStyles({
@@ -8547,6 +8647,7 @@ var CardVehicleOwnerForm = ({
                           {
                             appearance: "transparent",
                             icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:delete-24-regular" }),
+                            "aria-label": mergedLabels.deleteOwnerAriaLabel,
                             onClick: (e) => {
                               e.stopPropagation();
                               onDeleteOwner(owner.id);
@@ -9013,6 +9114,7 @@ var CardVehicleOwnerForm = ({
                                                         }
                                                       }
                                                     ),
+                                                    "aria-label": mergedLabels.decrementQuantityAriaLabel,
                                                     size: "small",
                                                     onClick: () => {
                                                       const currentVal = getValues(
@@ -9077,6 +9179,7 @@ var CardVehicleOwnerForm = ({
                                                         }
                                                       }
                                                     ),
+                                                    "aria-label": mergedLabels.incrementQuantityAriaLabel,
                                                     size: "small",
                                                     onClick: () => {
                                                       const currentVal = getValues(
@@ -10085,11 +10188,15 @@ var CardAddon = ({
 var DEFAULT_LABELS29 = {
   id: {
     addButton: "Tambah",
-    currencySymbol: "Rp"
+    currencySymbol: "Rp",
+    decrementAriaLabel: "Kurangi jumlah",
+    incrementAriaLabel: "Tambah jumlah"
   },
   en: {
     addButton: "Add",
-    currencySymbol: "Rp"
+    currencySymbol: "Rp",
+    decrementAriaLabel: "Decrease quantity",
+    incrementAriaLabel: "Increase quantity"
   }
 };
 var useStyles29 = reactComponents.makeStyles({
@@ -10293,16 +10400,18 @@ var CardMealCatalog = ({
                 {
                   size: "small",
                   shape: "circular",
+                  "aria-label": mergedLabels.decrementAriaLabel,
                   icon: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.SubtractRegular, {}),
                   onClick: () => onUpdateQuantity(item.id, -1)
                 }
               ),
-              /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: item.quantity }),
+              /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { "aria-live": "polite", children: item.quantity }),
               /* @__PURE__ */ jsxRuntime.jsx(
                 reactComponents.Button,
                 {
                   size: "small",
                   shape: "circular",
+                  "aria-label": mergedLabels.incrementAriaLabel,
                   icon: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.AddRegular, {}),
                   onClick: () => onUpdateQuantity(item.id, 1)
                 }
@@ -10326,8 +10435,12 @@ var CardMealCatalog = ({
 
 // src/components/CardReview/CardReview.constants.ts
 var DEFAULT_LABELS30 = {
-  id: {},
-  en: {}
+  id: {
+    defaultTitle: "Tinjauan"
+  },
+  en: {
+    defaultTitle: "Review"
+  }
 };
 var useStyles30 = reactComponents.makeStyles({
   card: {
@@ -10381,10 +10494,10 @@ var CardReview = ({
   headerAction
 }) => {
   const styles = useStyles30();
-  ({ ...DEFAULT_LABELS30[language], ...labels });
+  const mergedLabels = { ...DEFAULT_LABELS30[language], ...labels };
   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: title }),
+      /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Subtitle1, { className: styles.headerTitle, children: title || mergedLabels.defaultTitle }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.headerLine }),
       headerAction && /* @__PURE__ */ jsxRuntime.jsx("div", { children: headerAction })
     ] }),
@@ -10796,8 +10909,12 @@ var CardPriceDetails = ({
 
 // src/components/CardPaymentMethodList/CardPaymentMethodList.constants.ts
 var DEFAULT_LABELS33 = {
-  id: {},
-  en: {}
+  id: {
+    selectAriaLabel: "Pilih metode pembayaran"
+  },
+  en: {
+    selectAriaLabel: "Select payment method"
+  }
 };
 var useStyles34 = reactComponents.makeStyles({
   container: {
@@ -10860,7 +10977,7 @@ var CardPaymentMethodList = ({
   onSelect
 }) => {
   const styles = useStyles34();
-  ({ ...DEFAULT_LABELS33[language], ...labels });
+  const mergedLabels = { ...DEFAULT_LABELS33[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: [
@@ -10896,7 +11013,8 @@ var CardPaymentMethodList = ({
                 onChange: () => onSelect(option.value),
                 value: option.value,
                 name: "payment-method",
-                disabled: option.disabled
+                disabled: option.disabled,
+                "aria-label": `${mergedLabels.selectAriaLabel} ${option.label}`
               }
             )
           ]
@@ -11147,7 +11265,8 @@ var DEFAULT_LABELS36 = {
     viewTicketButton: "Lihat E-Tiket",
     defaultStatus: "Sudah Dibayar",
     defaultTitle: "Pembayaran berhasil",
-    defaultDescription: "Tiket Anda aktif dan siap digunakan."
+    defaultDescription: "Tiket Anda aktif dan siap digunakan.",
+    illustrationAlt: "Ilustrasi E-Tiket"
   },
   en: {
     detailTitle: "Booking Details",
@@ -11160,7 +11279,8 @@ var DEFAULT_LABELS36 = {
     viewTicketButton: "View E-Ticket",
     defaultStatus: "Paid",
     defaultTitle: "Payment successful",
-    defaultDescription: "Your ticket is active and ready to use."
+    defaultDescription: "Your ticket is active and ready to use.",
+    illustrationAlt: "E-Ticket Illustration"
   }
 };
 var useStyles37 = reactComponents.makeStyles({
@@ -11244,7 +11364,7 @@ var CardStatusOrder = ({
         "img",
         {
           src: illustrationUrl,
-          alt: "E-Ticket",
+          alt: mergedLabels.illustrationAlt,
           width: 406,
           height: 266
         }
@@ -11341,7 +11461,8 @@ var DEFAULT_LABELS37 = {
     ppnNote: "*PPN 11% dikenakan untuk biaya layanan dan biaya admin",
     grandTotalLabel: "Total Pembayaran",
     currencyPrefix: "Rp.",
-    currencyCode: "IDR."
+    currencyCode: "IDR.",
+    closeAriaLabel: "Tutup"
   },
   en: {
     title: "Price Details",
@@ -11352,7 +11473,8 @@ var DEFAULT_LABELS37 = {
     ppnNote: "*VAT 11% is charged for service fees and admin fees",
     grandTotalLabel: "Total Payment",
     currencyPrefix: "Rp.",
-    currencyCode: "IDR."
+    currencyCode: "IDR.",
+    closeAriaLabel: "Close"
   }
 };
 var useStyles38 = reactComponents.makeStyles({
@@ -11499,7 +11621,7 @@ var ModalPriceDetail = ({
               reactComponents.Button,
               {
                 appearance: "subtle",
-                "aria-label": "close",
+                "aria-label": mergedLabels.closeAriaLabel,
                 icon: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
                   "path",
                   {