@asdp/ferryui 0.1.22-dev.8932 → 0.1.22-dev.8978

package/dist/index.js

@@ -4395,7 +4395,8 @@ var DEFAULT_LABELS10 = {
     allHarborsHeader: "Semua Pelabuhan",
     loadingData: "Memuat data...",
     harborNotFound: "Pelabuhan tidak ditemukan",
-    closeAriaLabel: "Tutup"
+    closeAriaLabel: "Tutup",
+    popularHarborHeader: "Pelabuhan Populer"
   },
   en: {
     title: "Select Harbor",
@@ -4405,7 +4406,8 @@ var DEFAULT_LABELS10 = {
     allHarborsHeader: "All Harbors",
     loadingData: "Loading data...",
     harborNotFound: "Harbor not found",
-    closeAriaLabel: "Close"
+    closeAriaLabel: "Close",
+    popularHarborHeader: "Popular Harbor"
   }
 };
 var useStyles10 = reactComponents.makeStyles({
@@ -4482,8 +4484,8 @@ var useStyles10 = reactComponents.makeStyles({
   headerRow: {
     display: "flex",
     justifyContent: "space-between",
-    marginTop: "1rem",
-    marginBottom: "1rem"
+    marginTop: "1rem"
+    // marginBottom: "1rem",
   },
   dangerText: {
     color: reactComponents.tokens.colorStatusDangerForeground1
@@ -4537,7 +4539,8 @@ var ModalSearchHarbor = ({
   onToggleFavorite,
   onAddLastSearched,
   onRemoveLastSearched,
-  onClearLastSearched
+  onClearLastSearched,
+  popularHarbors
 }) => {
   const styles = useStyles10();
   const mergedLabels = { ...DEFAULT_LABELS10[language], ...labels };
@@ -4603,9 +4606,9 @@ var ModalSearchHarbor = ({
               iconPosition: "before",
               className: styles.circularButton,
               icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:ribbon-20-filled" }),
-              children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: harbor.name })
+              children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: harbor.portName + ", " + harbor.branchName })
             },
-            harbor.id
+            harbor.portId
           )) }),
           /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Divider, {}),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.resultList, children: [
@@ -4635,20 +4638,41 @@ var ModalSearchHarbor = ({
                           className: styles.iconMargin
                         }
                       ),
-                      harbor.name
+                      harbor.portName + ", " + harbor.branchName
                     ]
                   }
                 ),
                 /* @__PURE__ */ jsxRuntime.jsx(
                   react.Icon,
                   {
-                    onClick: () => onRemoveLastSearched(harbor.id),
+                    onClick: () => onRemoveLastSearched(harbor),
                     icon: "fluent:dismiss-24-regular",
                     color: reactComponents.tokens.colorStatusDangerForeground1,
                     className: styles.cursorPointer
                   }
                 )
-              ] }, harbor.id)) }),
+              ] }, harbor.portId)) }),
+              /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Divider, {})
+            ] }),
+            popularHarbors.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.headerRow, children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { children: mergedLabels.popularHarborHeader }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { children: popularHarbors.map((harbor) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.historyItem, children: /* @__PURE__ */ jsxRuntime.jsxs(
+                "div",
+                {
+                  style: { cursor: "pointer" },
+                  onClick: () => handleSelect(harbor),
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      react.Icon,
+                      {
+                        icon: "fluent:vehicle-ship-24-regular",
+                        className: styles.iconMargin
+                      }
+                    ),
+                    harbor.portName + ", " + harbor.branchName
+                  ]
+                }
+              ) }, harbor.portId)) }),
               /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Divider, {})
             ] }),
             /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1Strong, { className: styles.sectionTitle, children: mergedLabels.allHarborsHeader }),
@@ -4666,14 +4690,14 @@ var ModalSearchHarbor = ({
                         className: styles.iconMargin
                       }
                     ),
-                    harbor.name
+                    harbor.portName + ", " + harbor.branchName
                   ]
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsx(
                 react.Icon,
                 {
-                  icon: favoriteHarbors.find((fav) => fav.id === harbor.id) ? "fluent:star-24-filled" : "fluent:star-24-regular",
+                  icon: harbor.isFavorite ? "fluent:star-24-filled" : "fluent:star-24-regular",
                   color: reactComponents.tokens.colorBrandBackground,
                   className: styles.cursorPointer,
                   onClick: () => onToggleFavorite(harbor)
@@ -5221,7 +5245,6 @@ var ModalService = ({
           "div",
           {
             className: styles.serviceItem,
-            onClick: () => handleToggleService(service.serviceTypeId),
             children: [
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.serviceContent, children: [
                 /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.serviceName, children: service.serviceTypeName }),
@@ -5262,9 +5285,6 @@ var DEFAULT_LABELS13 = {
     infoMessage: "Anda dapat menambahkan hingga {maxPassengers} penumpang pada golongan kendaraan ini.",
     loading: "Memuat...",
     saveButton: "Simpan",
-    economy: "Ekonomi",
-    business: "Bisnis",
-    executive: "Eksekutif",
     closeAriaLabel: "Tutup"
   },
   en: {
@@ -5272,17 +5292,9 @@ var DEFAULT_LABELS13 = {
     infoMessage: "You can add up to {maxPassengers} passengers in this vehicle category.",
     loading: "Loading...",
     saveButton: "Save",
-    economy: "Economy",
-    business: "Business",
-    executive: "Executive",
     closeAriaLabel: "Close"
   }
 };
-var DEFAULT_SERVICE_CLASSES = [
-  { id: 1, name: "Ekonomi", key: "ekonomi", serviceName: "ECONOMY", labelKey: "economy" },
-  { id: 2, name: "Bisnis", key: "bisnis", serviceName: "BUSINESS", labelKey: "business" },
-  { id: 3, name: "Eksekutif", key: "eksekutif", serviceName: "EXECUTIVE", labelKey: "executive" }
-];
 var useStyles13 = reactComponents.makeStyles({
   dialogSurface: {
     maxWidth: "600px",
@@ -5357,7 +5369,6 @@ var ModalTotalPassengers = ({
   onClose,
   title,
   passengerTypes,
-  serviceClasses = DEFAULT_SERVICE_CLASSES,
   selectedPassengers,
   onSave,
   isLoading = false,
@@ -5376,12 +5387,9 @@ var ModalTotalPassengers = ({
     if (passengerTypes.length === 0) return;
     const defaultPassengers = passengerTypes.map(
       (passengerType) => ({
-        passengerTypeId: passengerType.id,
-        passengerTypeCode: passengerType.passengerTypeCode,
-        passengerTypeName: passengerType.passengerTypeName,
-        services: serviceClasses.map((sc) => ({
-          serviceId: sc.id,
-          serviceName: sc.serviceName,
+        ...passengerType,
+        classes: (passengerType.classes || []).map((cls) => ({
+          ...cls,
           count: 0,
           passengers: []
         }))
@@ -5389,28 +5397,28 @@ var ModalTotalPassengers = ({
     );
     if (selectedPassengers && selectedPassengers.length > 0) {
       const mergedPassengers = defaultPassengers.map((defaultP) => {
-        const selectedP = selectedPassengers.find(
-          (p) => p.passengerTypeCode === defaultP.passengerTypeCode
+        const selectedP = selectedPassengers?.find(
+          (p) => p.passengerAgeCode === defaultP.passengerAgeCode
         );
         if (selectedP) {
-          const mergedServices = defaultP.services.map((defaultS) => {
-            const selectedS = selectedP.services.find(
-              (s) => s.serviceName === defaultS.serviceName
+          const mergedClasses = defaultP.classes.map((defaultC) => {
+            const selectedC = selectedP.classes?.find(
+              (c) => c.classCode === defaultC.classCode
             );
-            return selectedS ? {
-              ...defaultS,
-              count: selectedS.count,
-              passengers: selectedS.passengers || []
-            } : defaultS;
+            return selectedC ? {
+              ...defaultC,
+              count: selectedC.count,
+              passengers: selectedC.passengers || []
+            } : defaultC;
           });
-          return { ...defaultP, services: mergedServices };
+          return { ...defaultP, classes: mergedClasses };
         }
         return defaultP;
       });
       setPassengers(mergedPassengers);
-      const itemsWithData = selectedPassengers.filter((p) => p.services.some((s) => s.count > 0)).map((p) => {
+      const itemsWithData = selectedPassengers.filter((p) => p.classes.some((c) => (c.count ?? 0) > 0)).map((p) => {
         const passengerType = passengerTypes.find(
-          (pt) => pt.passengerTypeCode === p.passengerTypeCode
+          (pt) => pt.passengerAgeCode === p.passengerAgeCode
         );
         return passengerType ? String(passengerType.id) : "";
       }).filter((id) => id !== "");
@@ -5419,54 +5427,55 @@ var ModalTotalPassengers = ({
       setPassengers(defaultPassengers);
       setOpenItems([]);
     }
-  }, [open, passengerTypes, serviceClasses, selectedPassengers]);
-  const getServiceCount = (passengerTypeCode, serviceName) => {
+  }, [open, passengerTypes, selectedPassengers]);
+  const getServiceCount = (passengerAgeCode, classCode) => {
     const passenger = passengers.find(
-      (p) => p.passengerTypeCode === passengerTypeCode
+      (p) => p.passengerAgeCode === passengerAgeCode
     );
     if (!passenger) return 0;
-    const service = passenger.services.find(
-      (s) => s.serviceName === serviceName
+    const cls = passenger.classes.find(
+      (c) => c.classCode === classCode
     );
-    return service?.count || 0;
+    return cls?.count ?? 0;
   };
-  const getTotalForType = (passengerTypeCode) => {
+  const getTotalForType = (passengerAgeCode) => {
     const passenger = passengers.find(
-      (p) => p.passengerTypeCode === passengerTypeCode
+      (p) => p.passengerAgeCode === passengerAgeCode
     );
     if (!passenger) return "0";
     const parts = [];
-    passenger.services.forEach((service) => {
-      if (service.count > 0) {
-        const serviceClass = serviceClasses.find(
-          (sc) => sc.serviceName === service.serviceName
-        );
-        const serviceName = serviceClass ? mergedLabels[serviceClass.labelKey] : service.serviceName;
-        parts.push(`${service.count} ${serviceName}`);
+    passenger.classes.forEach((cls) => {
+      if ((cls.count ?? 0) > 0) {
+        const displayName = cls.classCode?.toUpperCase();
+        parts.push(`${cls.count} ${displayName}`);
       }
     });
     return parts.length > 0 ? parts.join(", ") : "0";
   };
-  const handleIncrement = (passengerTypeCode, serviceName) => {
+  const totalPassengerCount = passengers.reduce(
+    (total, passenger) => total + passenger.classes.reduce((sum, cls) => sum + (cls.count ?? 0), 0),
+    0
+  );
+  const handleIncrement = (passengerAgeCode, classCode) => {
     setPassengers(
       (prev) => prev.map((passenger) => {
-        if (passenger.passengerTypeCode === passengerTypeCode) {
+        if (passenger.passengerAgeCode === passengerAgeCode) {
           return {
             ...passenger,
-            services: passenger.services.map((service) => {
-              if (service.serviceName === serviceName) {
-                const newCount = service.count + 1;
-                const newPassengers = [...service.passengers || []];
+            classes: passenger.classes.map((cls) => {
+              if (cls.classCode === classCode) {
+                const newCount = (cls.count ?? 0) + 1;
+                const newPassengers = [...cls.passengers || []];
                 while (newPassengers.length < newCount) {
                   newPassengers.push({});
                 }
                 return {
-                  ...service,
+                  ...cls,
                   count: newCount,
                   passengers: newPassengers
                 };
               }
-              return service;
+              return cls;
             })
           };
         }
@@ -5474,26 +5483,26 @@ var ModalTotalPassengers = ({
       })
     );
   };
-  const handleDecrement = (passengerTypeCode, serviceName) => {
+  const handleDecrement = (passengerAgeCode, classCode) => {
     setPassengers(
       (prev) => prev.map((passenger) => {
-        if (passenger.passengerTypeCode === passengerTypeCode) {
+        if (passenger.passengerAgeCode === passengerAgeCode) {
           return {
             ...passenger,
-            services: passenger.services.map((service) => {
-              if (service.serviceName === serviceName && service.count > 0) {
-                const newCount = service.count - 1;
-                const newPassengers = (service.passengers || []).slice(
+            classes: passenger.classes.map((cls) => {
+              if (cls.classCode === classCode && (cls.count ?? 0) > 0) {
+                const newCount = (cls.count ?? 0) - 1;
+                const newPassengers = (cls.passengers || []).slice(
                   0,
                   newCount
                 );
                 return {
-                  ...service,
+                  ...cls,
                   count: newCount,
                   passengers: newPassengers
                 };
               }
-              return service;
+              return cls;
             })
           };
         }
@@ -5504,8 +5513,8 @@ var ModalTotalPassengers = ({
   const handleSave = () => {
     const filteredPassengers = passengers.map((passenger) => ({
       ...passenger,
-      services: passenger.services.filter((service) => service.count > 0)
-    })).filter((passenger) => passenger.services.length > 0);
+      classes: passenger.classes.filter((cls) => (cls.count ?? 0) > 0)
+    })).filter((passenger) => passenger.classes.length > 0);
     onSave(filteredPassengers);
   };
   return /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Dialog, { open, onOpenChange: (_, data) => !data.open && onClose(), children: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.DialogSurface, { children: /* @__PURE__ */ jsxRuntime.jsxs(reactComponents.DialogBody, { children: [
@@ -5536,6 +5545,7 @@ var ModalTotalPassengers = ({
             onToggle: (_, data) => setOpenItems(data.openItems),
             className: styles.passengerSection,
             children: passengerTypes.map((passengerType) => {
+              const classes = passengerType.classes || [];
               return /* @__PURE__ */ jsxRuntime.jsxs(
                 reactComponents.AccordionItem,
                 {
@@ -5548,19 +5558,19 @@ var ModalTotalPassengers = ({
                         className: styles.accordionHeader,
                         expandIconPosition: "end",
                         children: [
-                          passengerType.passengerTypeName,
+                          passengerType.passengerAgeName,
                           " (",
-                          getTotalForType(passengerType.passengerTypeCode),
+                          getTotalForType(passengerType.passengerAgeCode),
                           ")"
                         ]
                       }
                     ),
-                    /* @__PURE__ */ jsxRuntime.jsx(reactComponents.AccordionPanel, { className: styles.accordionPanel, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.nestedSection, children: serviceClasses.map((service) => /* @__PURE__ */ jsxRuntime.jsxs(
+                    /* @__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: [
-                          /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: mergedLabels[service.labelKey] }),
+                          /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: cls.classCode.toUpperCase() }),
                           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.passengerCount, children: [
                             /* @__PURE__ */ jsxRuntime.jsx(
                               reactComponents.Button,
@@ -5572,19 +5582,19 @@ var ModalTotalPassengers = ({
                                 onClick: (e) => {
                                   e.stopPropagation();
                                   handleDecrement(
-                                    passengerType.passengerTypeCode,
-                                    service.serviceName
+                                    passengerType.passengerAgeCode,
+                                    cls.classCode
                                   );
                                 },
                                 disabled: getServiceCount(
-                                  passengerType.passengerTypeCode,
-                                  service.serviceName
+                                  passengerType.passengerAgeCode,
+                                  cls.classCode
                                 ) === 0
                               }
                             ),
                             /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { className: styles.countText, children: getServiceCount(
-                              passengerType.passengerTypeCode,
-                              service.serviceName
+                              passengerType.passengerAgeCode,
+                              cls.classCode
                             ) }),
                             /* @__PURE__ */ jsxRuntime.jsx(
                               reactComponents.Button,
@@ -5593,11 +5603,15 @@ var ModalTotalPassengers = ({
                                 className: styles.counterButton,
                                 size: "small",
                                 icon: /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "fluent:add-12-regular" }),
+                                disabled: getServiceCount(
+                                  passengerType.passengerAgeCode,
+                                  cls.classCode
+                                ) >= cls.maxCapacity || totalPassengerCount >= maxPassengers,
                                 onClick: (e) => {
                                   e.stopPropagation();
                                   handleIncrement(
-                                    passengerType.passengerTypeCode,
-                                    service.serviceName
+                                    passengerType.passengerAgeCode,
+                                    cls.classCode
                                   );
                                 }
                               }
@@ -5605,7 +5619,7 @@ var ModalTotalPassengers = ({
                           ] })
                         ]
                       },
-                      service.key
+                      cls.id
                     )) }) })
                   ]
                 },
@@ -5714,22 +5728,22 @@ var ModalTypeOfService = ({
 }) => {
   const styles = useStyles14();
   const mergedLabels = { ...DEFAULT_LABELS14[language], ...labels };
-  const [selectedServiceTitle, setSelectedServiceTitle] = React5.useState(
-    selectedService?.title || ""
+  const [selectedServiceId, setSelectedServiceId] = React5.useState(
+    selectedService?.id || 0
   );
   const [openItems, setOpenItems] = React5.useState(() => {
-    if (!selectedService) return void 0;
+    if (!selectedService) return [];
     for (const item of serviceTypes) {
-      if (item.type === "accordion" && item.child.length > 0) {
-        const hasSelectedChild = item.child.some(
-          (child) => child.title === selectedService.title
+      if (item.children && item.children.length > 0) {
+        const hasSelectedChild = item.children.some(
+          (child) => child.id === selectedService.id
         );
         if (hasSelectedChild) {
-          return item.id;
+          return [item.id];
         }
       }
     }
-    return void 0;
+    return [];
   });
   const defaultRenderImage = ({
     src,
@@ -5748,61 +5762,57 @@ var ModalTypeOfService = ({
   );
   const imageRenderer = renderImage || defaultRenderImage;
   React5.useEffect(() => {
-    const newTitle = selectedService?.title || "";
-    if (newTitle !== selectedServiceTitle) {
-      setSelectedServiceTitle(newTitle);
+    const newId = selectedService?.id || 0;
+    if (newId !== selectedServiceId) {
+      setSelectedServiceId(newId);
     }
     if (selectedService) {
       for (const item of serviceTypes) {
-        if (item.type === "accordion" && item.child.length > 0) {
-          const hasSelectedChild = item.child.some(
-            (child) => child.title === selectedService.title
+        if (item.children && item.children.length > 0) {
+          const hasSelectedChild = item.children.some(
+            (child) => child.id === selectedService.id
           );
-          if (hasSelectedChild && openItems !== item.id) {
-            setOpenItems(item.id);
+          if (hasSelectedChild && !openItems.includes(item.id)) {
+            setOpenItems([item.id]);
             break;
           }
         }
       }
-    } else if (openItems !== void 0) {
-      setOpenItems(void 0);
+    } else if (openItems.length > 0) {
+      setOpenItems([]);
     }
-  }, [open, selectedService?.title]);
+  }, [open, selectedService?.id]);
   const handleConfirm = () => {
-    if (selectedServiceTitle) {
+    if (selectedServiceId) {
       let selectedItem = null;
       for (const item of serviceTypes) {
-        if (item.title === selectedServiceTitle) {
+        if (item.id === selectedServiceId) {
           selectedItem = {
             id: item.id,
-            image: item.image,
+            loadType: item.loadType,
+            group: item.group,
             title: item.title,
             info: item.info,
-            price: item.price,
-            parentTitle: "",
-            parentId: 0,
-            type: item.type,
-            typeOfPassanger: item.typeOfPassanger,
-            child: []
+            image: item.image,
+            children: [],
+            capacity: item.capacity
           };
           break;
         }
-        if (item.child && item.child.length > 0) {
-          const childItem = item.child.find(
-            (child) => child.title === selectedServiceTitle
+        if (item.children && item.children.length > 0) {
+          const childItem = item.children.find(
+            (child) => child.id === selectedServiceId
           );
           if (childItem) {
             selectedItem = {
               id: childItem.id,
-              image: childItem.image,
+              loadType: childItem.loadType,
+              group: childItem.group,
               title: childItem.title,
               info: childItem.info,
-              price: childItem.price,
-              parentTitle: childItem.parentTitle,
-              parentId: childItem.parentId,
-              type: childItem.type,
-              typeOfPassanger: childItem.typeOfPassanger,
-              child: []
+              image: childItem.image,
+              children: [],
+              capacity: childItem.capacity
             };
             break;
           }
@@ -5836,19 +5846,19 @@ var ModalTypeOfService = ({
         {
           collapsible: true,
           openItems,
-          onToggle: (_, data) => setOpenItems(data.openItems[0]),
+          onToggle: (_, data) => setOpenItems(data.openItems),
           className: styles.passengerSection,
           children: /* @__PURE__ */ jsxRuntime.jsx(
             reactComponents.RadioGroup,
             {
-              value: selectedServiceTitle,
-              onChange: (_, data) => setSelectedServiceTitle(data.value),
+              value: String(selectedServiceId),
+              onChange: (_, data) => setSelectedServiceId(Number(data.value)),
               children: serviceTypes.map((item, index) => {
-                if (item.type === "accordion") {
+                if (item.children.length > 0) {
                   return /* @__PURE__ */ jsxRuntime.jsxs(
                     reactComponents.AccordionItem,
                     {
-                      value: item.id,
+                      value: item?.id,
                       className: styles.accordionItem,
                       children: [
                         /* @__PURE__ */ jsxRuntime.jsxs(
@@ -5859,7 +5869,7 @@ var ModalTypeOfService = ({
                             children: [
                               /* @__PURE__ */ jsxRuntime.jsx("div", { children: imageRenderer({
                                 src: item.image,
-                                alt: mergedLabels.vehiclesAlt,
+                                alt: item.title,
                                 width: 74,
                                 height: 74
                               }) }),
@@ -5870,7 +5880,7 @@ var ModalTypeOfService = ({
                             ]
                           }
                         ),
-                        /* @__PURE__ */ jsxRuntime.jsx(reactComponents.AccordionPanel, { className: styles.accordionBody, children: item.child.length > 0 && item.child.map((childItem, childIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
+                        /* @__PURE__ */ jsxRuntime.jsx(reactComponents.AccordionPanel, { className: styles.accordionBody, children: item.children.length > 0 && item.children.map((childItem, childIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
                           "div",
                           {
                             className: reactComponents.mergeClasses(
@@ -5889,7 +5899,7 @@ var ModalTypeOfService = ({
                                 /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Body1, { children: childItem.title }),
                                 /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Caption1, { children: childItem.info })
                               ] }),
-                              /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Radio, { value: childItem.title })
+                              /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Radio, { value: String(childItem.id) })
                             ]
                           },
                           childIndex
@@ -5898,7 +5908,7 @@ var ModalTypeOfService = ({
                     },
                     index
                   );
-                } else if (item.type === "radio") {
+                } else if (item.children.length === 0) {
                   return /* @__PURE__ */ jsxRuntime.jsxs(
                     "div",
                     {
@@ -5925,7 +5935,7 @@ var ModalTypeOfService = ({
                             ]
                           }
                         ),
-                        /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Radio, { value: item.title })
+                        /* @__PURE__ */ jsxRuntime.jsx(reactComponents.Radio, { value: String(item.id) })
                       ]
                     },
                     index
@@ -5945,7 +5955,7 @@ var ModalTypeOfService = ({
             appearance: "primary",
             shape: "circular",
             onClick: handleConfirm,
-            disabled: !selectedServiceTitle,
+            disabled: !selectedServiceId,
             children: mergedLabels.saveButton
           }
         )
@@ -12820,9 +12830,12 @@ var FileUpload = React5__default.default.forwardRef(
                                 action: /* @__PURE__ */ jsxRuntime.jsx(reactComponents.DialogTrigger, { action: "close", children: /* @__PURE__ */ jsxRuntime.jsx(
                                   reactComponents.Button,
                                   {
-                                    appearance: "subtle",
                                     "aria-label": "close",
-                                    icon: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.Dismiss24Regular, {})
+                                    icon: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.Dismiss24Regular, {}),
+                                    style: {
+                                      backgroundColor: reactComponents.tokens.colorNeutralForeground2,
+                                      color: reactComponents.tokens.colorNeutralBackground1
+                                    }
                                   }
                                 ) })
                               }
@@ -13065,7 +13078,11 @@ var FileUpload = React5__default.default.forwardRef(
                                 {
                                   appearance: "subtle",
                                   "aria-label": "close",
-                                  icon: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.Dismiss24Regular, {})
+                                  icon: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.Dismiss24Regular, {}),
+                                  style: {
+                                    backgroundColor: reactComponents.tokens.colorNeutralForeground2,
+                                    color: reactComponents.tokens.colorNeutralBackground1
+                                  }
                                 }
                               ) })
                             }
@@ -13224,7 +13241,6 @@ exports.CarouselWithCustomNav = CarouselWithCustomNav;
 exports.DEFAULT_DURATION_RANGE = DEFAULT_DURATION_RANGE;
 exports.DEFAULT_PRICE_RANGE = DEFAULT_PRICE_RANGE;
 exports.DEFAULT_SCROLL_AMOUNT = DEFAULT_SCROLL_AMOUNT;
-exports.DEFAULT_SERVICE_CLASSES = DEFAULT_SERVICE_CLASSES;
 exports.DEFAULT_SERVICE_TYPES = DEFAULT_SERVICE_TYPES;
 exports.DEFAULT_SORT_OPTIONS = DEFAULT_SORT_OPTIONS;
 exports.DEFAULT_TIME_SLOTS = DEFAULT_TIME_SLOTS;