@pisell/private-materials 3.2.39 → 3.3.0

package/lib/components/ticketBooking/components/addServiceVariant/addService.js

@@ -0,0 +1,318 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/ticketBooking/components/addServiceVariant/addService.tsx
+var addService_exports = {};
+__export(addService_exports, {
+  default: () => addService_default
+});
+module.exports = __toCommonJS(addService_exports);
+var import_utils = require("@pisell/utils");
+var import_react = __toESM(require("react"));
+var import_ahooks = require("ahooks");
+var import_materials = require("@pisell/materials");
+var import_useEngineContext = __toESM(require("../../../../hooks/useEngineContext"));
+var import_utils2 = require("../../../booking/utils");
+var import_utils3 = require("../../../booking/info2/service/addService/utils");
+var import_status = require("../../../booking/info/service2/status");
+var import_utils4 = require("../../../booking/info/service2/utils");
+var import_utils5 = require("../../../booking/info/utils");
+var import_serve = require("../../../booking/info/service/serve");
+var import_serviceManager = require("../../../booking/info/service/serviceManager");
+var import_productSelect = __toESM(require("../../../productSelect"));
+var import_index = require("./index.less");
+var AddSerivce = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  const { onEdit, state, dispatch, renderMode = "current" } = props;
+  const [loading, setLoading] = (0, import_react.useState)(false);
+  const context = (0, import_useEngineContext.default)();
+  import_utils2.request.setRequest(context.appHelper.utils.request);
+  const { createBookingData, createBooking } = (0, import_serviceManager.useService)({
+    renderMode,
+    onEdit,
+    state,
+    dispatch
+  });
+  const isBooking4 = (0, import_utils5.isBooking4Shop)(
+    (_e = (_d = (_c = (_b = (_a = context.appHelper.utils.store) == null ? void 0 : _a.getState) == null ? void 0 : _b.call(_a)) == null ? void 0 : _c.global) == null ? void 0 : _d.globalConfig) == null ? void 0 : _e.id,
+    state == null ? void 0 : state.renderType
+  );
+  const [currentProduct, setCurrentProduct] = (0, import_react.useState)(null);
+  const setDefaultService = async (list) => {
+    if (state.renderType !== "eventBooking") {
+      return;
+    }
+    if (state.bookingId) {
+      return;
+    }
+    if (list.length !== 1) {
+      return;
+    }
+    let _list = [...state.service.value];
+    if (_list.length !== 0) {
+      return;
+    }
+    setLoading(true);
+    let product = list[0];
+    const detail = await (0, import_serve.getProductDetail)(product.id, {
+      schedule_date: state.date.value.format("YYYY-MM-DD")
+    });
+    const isBundleOrCombination = (0, import_utils5.getIsBundleOrCombination)(detail.data);
+    setLoading(false);
+    if (isBundleOrCombination) return;
+    let _item = {
+      ...product,
+      product_id: product.id,
+      _id: (0, import_utils.getUniqueId)(),
+      _extend: {
+        start_date: state.date.value,
+        startDate: state.date.value,
+        endDate: state.date.value,
+        start_time: "00:00:00",
+        duration: 10,
+        quantity: 1,
+        price: product.price,
+        total: product.price,
+        origin_total: product.price,
+        product_name: product.title
+      }
+    };
+    _list.push(_item);
+    dispatch({
+      type: "setService",
+      payload: {
+        value: _list,
+        edit: true
+      }
+    });
+  };
+  const getServices = async (params) => {
+    var _a2, _b2, _c2;
+    setLoading(true);
+    if (state.renderType === "eventBooking" && !((_b2 = (_a2 = state.eventOtherParams) == null ? void 0 : _a2.productIds) == null ? void 0 : _b2.length)) {
+      dispatch({
+        type: "setService",
+        payload: {
+          services: []
+        }
+      });
+      setLoading(false);
+      return;
+    }
+    let data = await state.apis.getServices({
+      skip: 1,
+      num: 500,
+      extension_type: state.renderType === "eventBooking" ? void 0 : ["appointment_ticket", "session_product", "session_ticket"],
+      with: ["category"],
+      ids: state.renderType === "eventBooking" ? (_c2 = state.eventOtherParams) == null ? void 0 : _c2.productIds : void 0,
+      open_quotation: 1,
+      with_schedule: 1,
+      with_count: ["bundleGroup", "optionGroup"],
+      order_by_string: "sort:desc",
+      status: "published",
+      ...state.isBookingCreatePage ? { schedule_date: params == null ? void 0 : params.schedule_date } : {
+        _config: {
+          useCache: true
+        }
+      }
+    });
+    setLoading(false);
+    if (!state.service.addModal) {
+      setDefaultService(data == null ? void 0 : data.list);
+    }
+    dispatch({
+      type: "setService",
+      payload: {
+        services: (data == null ? void 0 : data.list) || []
+      }
+    });
+  };
+  const handleSelectProduct = (0, import_ahooks.useMemoizedFn)(
+    (item, type = "select") => {
+      const isSession = (0, import_utils2.isSessionProduct)(item);
+      const isEject = type === "detail" || item.bundle_group_count > 0 || isSession;
+      let lock = false;
+      if (isEject) {
+        setCurrentProduct(item);
+      } else {
+        setCurrentProduct(null);
+      }
+      state.action({
+        type: "pisell1.handleOpenProductModal",
+        data: {
+          id: item.id,
+          date: state.date.value.format("YYYY-MM-DD"),
+          showConfig: {
+            option: false,
+            session: isSession,
+            variant: false,
+            package: true
+          },
+          is_eject: isEject ? 1 : 0,
+          isOS: isSession
+        },
+        onCancel: () => {
+          setCurrentProduct(null);
+        },
+        callback: async (e, extension_type, detail) => {
+          var _a2;
+          setCurrentProduct(null);
+          if (lock) {
+            return;
+          }
+          lock = true;
+          setTimeout(() => {
+            lock = false;
+          }, 2e3);
+          (0, import_materials.PisellToast)({
+            content: import_utils.locales.getText("pisell2.ticket-booking.add-to-cart")
+          });
+          if (!isBooking4) {
+            const data = await createBookingData({
+              product: { ...detail || item, _params: e }
+            });
+            createBooking({ booking: data });
+            return;
+          }
+          const _detail = detail || item;
+          const other = JSON.parse(JSON.stringify(e));
+          other.session = e.session;
+          let cacheItem = {
+            ..._detail,
+            product_id: item.id,
+            _id: (0, import_utils.getUniqueId)(),
+            _key: e.key,
+            _extend: {
+              start_date: state.date.value,
+              quantity: 1,
+              price: _detail.price,
+              product_name: item.title,
+              other
+            },
+            new: 1
+          };
+          let _total = (0, import_utils2.getProductTotalPrice)(cacheItem);
+          cacheItem._extend.total = _total;
+          cacheItem._extend.origin_total = _total;
+          const _isEdit = !!state.service.cacheItem;
+          if (_isEdit) {
+            cacheItem._id = (_a2 = state.service.cacheItem) == null ? void 0 : _a2._id;
+            cacheItem.new = 0;
+          }
+          if (renderMode === "current") {
+            cacheItem.currentDefaultTime = state.date.value.format("HH:mm");
+          }
+          cacheItem = (0, import_utils3.getProductExtend)({ cacheItem, state });
+          if (state.renderType === "eventBooking") {
+            cacheItem.autoClose = false;
+          }
+          if (cacheItem.autoClose) {
+            cacheItem.autoClose = false;
+            let _list = [...state.service.value, cacheItem];
+            dispatch({
+              type: "setService",
+              payload: {
+                addModal: false,
+                value: _list,
+                edit: true,
+                changeService: false
+              }
+            });
+          } else {
+            dispatch({
+              type: "setService",
+              payload: {
+                editModal: true,
+                cacheItem,
+                addModal: !cacheItem.autoClose,
+                changeService: false
+              }
+            });
+            onEdit == null ? void 0 : onEdit(cacheItem);
+          }
+        }
+      });
+    }
+  );
+  const renderList = (0, import_react.useMemo)(() => {
+    var _a2;
+    let _list = ((_a2 = state.service) == null ? void 0 : _a2.services) || [];
+    if ((0, import_utils4.isDaysBooking)(state)) {
+      if (!(0, import_utils4.holderId)(state)) {
+        _list = _list.filter(
+          (item) => !import_status.appointmentTypes.includes(item.extension_type)
+        );
+      }
+    }
+    return _list;
+  }, [(_f = state.service) == null ? void 0 : _f.services, state == null ? void 0 : state.activeCartId]);
+  const currentDate = (0, import_react.useMemo)(() => {
+    return state.date.value.format("YYYY-MM-DD");
+  }, [state.date.value]);
+  (0, import_react.useEffect)(() => {
+    if (renderMode === "current") {
+      getServices({ schedule_date: currentDate });
+    }
+  }, [renderMode, currentDate]);
+  (0, import_react.useEffect)(() => {
+    if (state.renderType === "eventBooking" && state.modalOpen) {
+      getServices({ schedule_date: currentDate });
+    }
+  }, [state.renderType, state.modalOpen]);
+  return (0, import_react.useMemo)(() => {
+    if (renderMode === "current") {
+      return /* @__PURE__ */ import_react.default.createElement(
+        import_productSelect.default,
+        {
+          dataSource: renderList,
+          layout: {
+            grid: true,
+            config: "12:12"
+          },
+          onChange: handleSelectProduct,
+          value: currentProduct == null ? void 0 : currentProduct.id,
+          loading
+        }
+      );
+    }
+    return null;
+  }, [
+    (_h = (_g = state.service) == null ? void 0 : _g.cacheItem) == null ? void 0 : _h.autoClose,
+    state.service.addModal,
+    import_utils.locales,
+    renderList,
+    state.amountSymbol,
+    state.renderType,
+    state == null ? void 0 : state.activeCartId,
+    (0, import_utils4.holderId)(state),
+    loading,
+    currentProduct,
+    isBooking4
+  ]);
+};
+var addService_default = AddSerivce;

package/lib/components/ticketBooking/components/addServiceVariant/index.d.ts

@@ -0,0 +1,6 @@
+interface AddServiceVariantProps {
+    globalState: any;
+    setGlobalState: any;
+}
+declare const AddServiceVariant: (props: AddServiceVariantProps) => JSX.Element;
+export default AddServiceVariant;

package/lib/components/ticketBooking/components/addServiceVariant/index.js

@@ -0,0 +1,56 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/ticketBooking/components/addServiceVariant/index.tsx
+var addServiceVariant_exports = {};
+__export(addServiceVariant_exports, {
+  default: () => addServiceVariant_default
+});
+module.exports = __toCommonJS(addServiceVariant_exports);
+var import_react = __toESM(require("react"));
+var import_addService = __toESM(require("./addService"));
+var AddServiceVariant = (props) => {
+  const { globalState, setGlobalState } = props;
+  const stateRef = (0, import_react.useRef)(globalState);
+  stateRef.current = globalState;
+  const dispatch = ({ type, payload }) => {
+    if (type === "setService") {
+      setGlobalState({
+        service: { ...stateRef.current.service, ...payload }
+      });
+    }
+  };
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_addService.default,
+    {
+      state: globalState,
+      dispatch
+    }
+  );
+};
+var addServiceVariant_default = AddServiceVariant;

package/lib/components/ticketBooking/components/menuBar/index.d.ts

@@ -0,0 +1,3 @@
+import './index.less';
+declare const index: () => JSX.Element;
+export default index;

package/lib/components/ticketBooking/components/menuBar/index.js

@@ -0,0 +1,87 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/ticketBooking/components/menuBar/index.tsx
+var menuBar_exports = {};
+__export(menuBar_exports, {
+  default: () => menuBar_default
+});
+module.exports = __toCommonJS(menuBar_exports);
+var import_react = __toESM(require("react"));
+var import_useNetworkStatus = require("../../hooks/useNetworkStatus");
+var import_index = require("./index.less");
+var index = () => {
+  const status = (0, import_useNetworkStatus.useNetworkStatus)();
+  const getStatusText = (status2) => {
+    switch (status2) {
+      case import_useNetworkStatus.NetworkStatus.GOOD:
+        return "Online";
+      case import_useNetworkStatus.NetworkStatus.WEAK:
+        return "Online";
+      case import_useNetworkStatus.NetworkStatus.OFFLINE:
+        return "Offline";
+    }
+  };
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-ticket-booking-menu-bar" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "logo-wrapper" }, /* @__PURE__ */ import_react.default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "44",
+      height: "26",
+      viewBox: "0 0 44 26",
+      fill: "none"
+    },
+    /* @__PURE__ */ import_react.default.createElement(
+      "path",
+      {
+        d: "M35.6532 13.0605C37.0806 11.869 38.5601 10.6336 40.1874 10.9932C41.0631 11.1851 41.7553 11.7931 42.2352 12.8086C43.7869 16.0599 43.1992 20.8314 39.536 22.875C39.0721 23.1309 38.6243 23.4031 38.1845 23.667C35.713 25.1507 33.1574 26.6896 29.3583 25.6699C26.179 24.8181 24.3232 24.5303 22.0038 24.5303C19.6843 24.5303 17.8285 24.8181 14.6493 25.6699C13.7895 25.8979 12.9975 25.998 12.2577 25.998C9.70239 25.998 7.73479 24.8148 5.81531 23.6631C5.37153 23.3992 4.92351 23.127 4.46375 22.8711C0.804523 20.8315 0.211882 16.056 1.76355 12.8047C2.24745 11.793 2.93564 11.1811 3.81141 10.9932C5.43499 10.6333 6.91492 11.8688 8.34656 13.0605C8.77047 13.4125 9.17023 13.749 9.53016 14.001C9.99006 14.3249 10.7382 14.0412 12.4618 13.2734C14.6253 12.3056 17.5928 10.9814 21.9999 10.9814C26.4068 10.9815 29.3705 12.3057 31.538 13.2734C33.2609 14.0449 34.0087 14.3245 34.4686 14.001C34.8286 13.745 35.2293 13.4125 35.6532 13.0605ZM39.58 13.5605C39.176 13.5605 37.9405 14.589 37.3446 15.0889C36.9008 15.4607 36.4369 15.8443 35.9891 16.1602C34.2535 17.3799 32.4134 16.5525 30.4618 15.6807C28.4063 14.7609 25.8469 13.6172 22.0038 13.6172C18.1607 13.6172 15.6013 14.7609 13.5458 15.6807C11.5942 16.5525 9.75007 17.3759 8.01844 16.1602C7.56666 15.8443 7.10675 15.4607 6.66297 15.0889C6.06312 14.593 4.83934 13.5733 4.39539 13.5732H4.37488C4.37692 13.5829 4.274 13.687 4.15516 13.9404C3.1114 16.1239 3.50737 19.3078 5.75477 20.5596C6.24264 20.8315 6.71462 21.1156 7.1825 21.3955C9.45402 22.7632 11.2543 23.8431 13.9657 23.1152C17.3528 22.2075 19.4564 21.8867 22.0038 21.8867C24.5512 21.8867 26.6547 22.2074 30.0419 23.1152C32.7571 23.843 34.5528 22.7631 36.8241 21.3955C37.2919 21.1156 37.7641 20.8315 38.2518 20.5596C40.4994 19.3078 40.8952 16.124 39.8514 13.9404C39.7276 13.6808 39.6236 13.5765 39.5956 13.5605H39.58ZM25.6991 4.86621C26.7868 4.70638 27.9108 5.12611 28.6386 5.96582C29.3784 6.81762 29.598 7.99374 29.2421 9.18945C29.0781 9.76133 28.5502 10.1338 27.9823 10.1338C27.8583 10.1338 27.7303 10.1171 27.6063 10.0771C26.9065 9.86915 26.5108 9.13341 26.7147 8.43359C26.8106 8.10584 26.7902 7.85828 26.6464 7.69434C26.4984 7.52239 26.2467 7.45357 26.0907 7.47754C25.8468 7.51352 25.695 7.62195 25.3153 7.92969C24.7075 8.42155 23.7873 9.16102 21.996 9.16113C20.2045 9.16113 19.2885 8.42158 18.6766 7.92969C18.3007 7.62575 18.1441 7.51353 17.9042 7.47754C17.7442 7.45368 17.4965 7.52248 17.3446 7.69434C17.2049 7.85827 17.1804 8.10593 17.2762 8.43359C17.4842 9.13345 17.0884 9.86919 16.3886 10.0771C15.6887 10.289 14.9529 9.88526 14.745 9.18945C14.3891 7.99375 14.6088 6.81761 15.3446 5.96582C16.0684 5.12611 17.1964 4.70638 18.2841 4.86621C19.2598 5.01017 19.856 5.49012 20.3319 5.87402C20.8317 6.27786 21.1316 6.52237 21.9911 6.52246C22.8469 6.52246 23.1514 6.27794 23.6512 5.87402C24.1271 5.49012 24.7234 5.01017 25.6991 4.86621ZM9.7782 4.7793C11.1078 4.7793 12.1853 5.85699 12.1854 7.18652C12.1854 8.51614 11.1078 9.59375 9.7782 9.59375C8.44863 9.59369 7.37098 8.51611 7.37098 7.18652C7.37108 5.85703 8.4487 4.77936 9.7782 4.7793ZM34.3329 4.7793C35.6624 4.77934 36.74 5.85702 36.7401 7.18652C36.7401 8.51612 35.6625 9.59371 34.3329 9.59375C33.0033 9.59375 31.9257 8.51614 31.9257 7.18652C31.9258 5.85699 33.0033 4.7793 34.3329 4.7793ZM9.66199 0C13.6059 4.10292e-05 15.2458 2.41974 15.3163 2.52734C15.7162 3.13522 15.5482 3.95546 14.9403 4.35938C14.7165 4.50314 14.4645 4.5752 14.2167 4.5752C13.7889 4.57512 13.3651 4.36717 13.1132 3.97949C13.0892 3.9435 12.1294 2.64356 9.6659 2.64355C7.20596 2.64355 6.24558 3.93955 6.20301 3.99902C5.7831 4.5829 4.96685 4.73897 4.37098 4.33105C3.77915 3.92316 3.61089 3.1272 4.00672 2.52734C4.0747 2.42337 5.71483 0 9.66199 0ZM34.329 0C38.2761 0 39.9203 2.42337 39.9843 2.52734C40.3841 3.13521 40.2161 3.95547 39.6083 4.35938C39.3884 4.50328 39.1364 4.57513 38.8886 4.5752C38.4607 4.5752 38.036 4.36736 37.7841 3.97949C37.7601 3.9435 36.8004 2.64355 34.3329 2.64355C31.8713 2.64365 30.9112 3.94138 30.87 3.99902C30.4501 4.5829 29.6338 4.73897 29.038 4.33105C28.4463 3.9231 28.2788 3.12714 28.6747 2.52734C28.7448 2.42029 30.3846 7.62705e-05 34.329 0Z",
+        fill: "#8157D5"
+      }
+    )
+  )), /* @__PURE__ */ import_react.default.createElement("div", { className: "nav-wrapper" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "nav-item active" }, /* @__PURE__ */ import_react.default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "32",
+      height: "25",
+      viewBox: "0 0 34 27",
+      fill: "none"
+    },
+    /* @__PURE__ */ import_react.default.createElement(
+      "path",
+      {
+        d: "M13.8 7.05078V5.48828M13.8 14.082V12.5195M13.8 21.1133V19.5508M6.12 0.800781H27.88C29.6722 0.800781 30.5683 0.800781 31.2528 1.14139C31.8549 1.44099 32.3444 1.91905 32.6512 2.50706C33 3.17554 33 4.05062 33 5.80078V7.83203C29.9072 7.83203 27.4 10.2805 27.4 13.3008C27.4 16.3211 29.9072 18.7695 33 18.7695V20.8008C33 22.5509 33 23.426 32.6512 24.0945C32.3444 24.6825 31.8549 25.1606 31.2528 25.4602C30.5683 25.8008 29.6722 25.8008 27.88 25.8008H6.12C4.32783 25.8008 3.43175 25.8008 2.74723 25.4602C2.14511 25.1606 1.65557 24.6825 1.34878 24.0945C1 23.426 1 22.5509 1 20.8008V18.7695C4.09279 18.7695 6.6 16.3211 6.6 13.3008C6.6 10.2805 4.09279 7.83203 1 7.83203V5.80078C1 4.05062 1 3.17554 1.34878 2.50706C1.65557 1.91905 2.14511 1.44099 2.74723 1.14139C3.43175 0.800781 4.32783 0.800781 6.12 0.800781Z",
+        stroke: "white",
+        "stroke-width": "1.5",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round"
+      }
+    )
+  ))), /* @__PURE__ */ import_react.default.createElement("div", { className: "status-wrapper" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "network-status", style: { background: import_useNetworkStatus.NetworkStatusColor[status] } }, getStatusText(status))));
+};
+var menuBar_default = index;

package/lib/components/ticketBooking/components/menuBar/index.less

@@ -0,0 +1,84 @@
+.pisell-ticket-booking-menu-bar {
+  background-color: #1b1b1b;
+  padding-left: 6px;
+  width: 86px;
+  position: relative;
+
+  .logo-wrapper {
+    margin-top: 24px;
+    display: flex;
+    justify-content: center;
+
+    svg {
+      width: 42.079px;
+      height: 25.999px;
+    }
+  }
+
+  .nav-wrapper {
+    margin-top: 24px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+
+    .nav-item {
+      cursor: pointer;
+      width: 56px;
+      height: 56px;
+      border-radius: 6px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      position: relative;
+      background: var(--Gray-950, #0c111d);
+
+      &.active {
+        background: #8157d5;
+
+        &::before {
+          display: block;
+          content: '';
+          background-color: #8157d5;
+          height: 100%;
+          width: 6px;
+          position: absolute;
+          left: -18px;
+          top: 0;
+          border-radius: 0px 2px 2px 0px;
+        }
+      }
+    }
+  }
+
+  .status-wrapper {
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    height: 20px;
+    display: flex;
+
+    > div {
+      color: #fff;
+      text-align: center;
+      font-family: Inter;
+      font-size: 8px;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 10px; /* 125% */
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      align-self: stretch;
+    }
+
+    .network-status {
+      flex: 1 0 100%;
+    }
+
+    .ITS-status {
+      flex: 1 0 60%;
+      background: #3f9e4d;
+    }
+  }
+}

package/lib/components/ticketBooking/components/ticketBooking/index.d.ts

@@ -0,0 +1,3 @@
+import './index.less';
+declare const TicketBooking: () => JSX.Element;
+export default TicketBooking;