@aziziaziz/react-components 1.0.1 → 1.0.2

package/dist/index.js

@@ -19,11 +19,15 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  Button: () => Button_default,
+  DatePicker: () => DatePicker_default,
   Input: () => Input_default,
-  SkeletonLoading: () => SkeletonLoading_default
+  SkeletonLoading: () => SkeletonLoading_default,
+  usePostMessage: () => usePostMessage,
+  useSnackbar: () => useSnackbar
 });
 module.exports = __toCommonJS(index_exports);
-var import_index = require("./index-MIFCDIS7.css");
+var import_index = require("./index-2F2GVZE5.css");
 
 // src/components/input/Input.tsx
 var import_react_hook_form = require("react-hook-form");
@@ -82,9 +86,544 @@ var Input = ({
   ] });
 };
 var Input_default = Input;
+
+// src/components/button/Button.tsx
+var import_react = require("react");
+var import_Button = require("./Button-GX4BPUGQ.css");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var Button = ({
+  children,
+  onClick,
+  className,
+  type = "submit",
+  disabled = false,
+  loading = false,
+  size = "default",
+  removeMinWidth = false
+}) => {
+  const buttonClass = (0, import_react.useMemo)(() => {
+    if (disabled || loading) return "disabledBtn";
+    switch (type) {
+      case "submit":
+        return "submitBtn";
+      case "danger":
+        return "dangerBtn";
+      case "warning":
+        return "warningBtn";
+    }
+  }, [type, disabled, loading]);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+    "button",
+    {
+      className: `mainBtn ${className} ${buttonClass} ${`${size}__`} ${removeMinWidth && "noMinWidth__"}`,
+      onClick: () => {
+        if (!disabled) onClick();
+      },
+      disabled: disabled || loading,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: loading ? "hideContent" : "", children }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: `loadingCircle ${loading && "show__"}` })
+      ]
+    }
+  );
+};
+var Button_default = Button;
+
+// src/components/datePicker/DatePicker.tsx
+var import_react4 = require("react");
+var import_DatePicker = require("./DatePicker-ISUX6NNC.css");
+
+// src/components/icon/Icon.tsx
+var import_Icon = require("./Icon-DCSTRBMX.css");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var Icon = ({ src, className, flat = true }) => {
+  const classNames = ["icon", className, flat ? "flat__" : ""].join(" ");
+  return flat ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("img", { className: classNames, src: src && src.toString() }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "i",
+    {
+      className: classNames,
+      style: {
+        maskImage: `url("${src}"`,
+        WebkitMaskImage: `url("${src}")`
+      }
+    }
+  );
+};
+var Icon_default = Icon;
+
+// src/assets/dropdown.svg
+var dropdown_default = 'data:image/svg+xml,<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">%0A%0D<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->%0A<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" stroke="%23000000">%0A%0D<g id="SVGRepo_bgCarrier" stroke-width="0"/>%0A%0D<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>%0A%0D<g id="SVGRepo_iconCarrier"> <path d="M17.9188 8.17969H11.6888H6.07877C5.11877 8.17969 4.63877 9.33969 5.31877 10.0197L10.4988 15.1997C11.3288 16.0297 12.6788 16.0297 13.5088 15.1997L15.4788 13.2297L18.6888 10.0197C19.3588 9.33969 18.8788 8.17969 17.9188 8.17969Z" fill="%23000000"/> </g>%0A%0D</svg>';
+
+// src/components/datePicker/components/webDatePicker/WebDatePicker.tsx
+var import_react2 = require("react");
+var import_WebDatePicker = require("./WebDatePicker-H2XZEEJG.css");
+var import_date_fns = require("date-fns");
+var import_react_hook_form2 = require("react-hook-form");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var daysShortName = ["S", "M", "T", "W", "T", "F", "S"];
+var monthsShortName = [
+  "Jan",
+  "Feb",
+  "Mar",
+  "Apr",
+  "May",
+  "Jun",
+  "Jul",
+  "Aug",
+  "Sep",
+  "Oct",
+  "Nov",
+  "Dec"
+];
+var WebDatePicker = ({
+  id,
+  show,
+  updateShow
+}) => {
+  const [currentMonth, setCurrentMonth] = (0, import_react2.useState)(/* @__PURE__ */ new Date());
+  const [selectionMode, setSelectionMode] = (0, import_react2.useState)(
+    "day"
+  );
+  const [allYears, setAllYears] = (0, import_react2.useState)([]);
+  const {
+    field: { onChange, value }
+  } = (0, import_react_hook_form2.useController)({ name: id });
+  (0, import_react2.useEffect)(() => {
+    if (show && value) {
+      setCurrentMonth(new Date(value));
+    }
+    if (show) {
+      setSelectionMode("day");
+    }
+  }, [show]);
+  const onAdd = () => {
+    if (selectionMode == "day") {
+      setCurrentMonth((0, import_date_fns.addMonths)(currentMonth, 1));
+    } else if (selectionMode == "month") {
+      setCurrentMonth((0, import_date_fns.addYears)(currentMonth, 1));
+    } else if (selectionMode == "year") {
+      setCurrentMonth((0, import_date_fns.addYears)(currentMonth, 10));
+    }
+  };
+  const onMinus = () => {
+    if (selectionMode == "day") {
+      setCurrentMonth((0, import_date_fns.addMonths)(currentMonth, -1));
+    } else if (selectionMode == "month") {
+      setCurrentMonth((0, import_date_fns.addYears)(currentMonth, -1));
+    } else if (selectionMode == "year") {
+      setCurrentMonth((0, import_date_fns.addYears)(currentMonth, -10));
+    }
+  };
+  const switchMode = () => {
+    if (selectionMode == "day") {
+      setSelectionMode("month");
+    } else if (selectionMode == "month") {
+      setSelectionMode("year");
+    }
+  };
+  const allDays = (0, import_react2.useMemo)(() => {
+    const totalDays = (0, import_date_fns.getDaysInMonth)(currentMonth);
+    const firstDay = (0, import_date_fns.startOfMonth)(currentMonth).getDay() || 7;
+    const previousMonth = (0, import_date_fns.addMonths)(currentMonth, -1);
+    const previousMonthTotalDays = (0, import_date_fns.getDaysInMonth)(previousMonth);
+    const nextMonth = (0, import_date_fns.addMonths)(currentMonth, 1);
+    const prevDays = new Array(firstDay).fill("").map((_, index) => {
+      const date = previousMonthTotalDays - index;
+      const thisDate = new Date(
+        previousMonth.getFullYear(),
+        previousMonth.getMonth(),
+        date
+      );
+      let isSelected = false;
+      if (value) {
+        const selectedDate = new Date(value);
+        isSelected = (0, import_date_fns.isSameDay)(selectedDate, thisDate);
+      }
+      return {
+        date,
+        month: previousMonth.getMonth(),
+        isToday: (0, import_date_fns.isToday)(thisDate),
+        isSelected,
+        fullDate: thisDate
+      };
+    }).sort((a, b) => a.date - b.date);
+    const allDays2 = new Array(totalDays).fill("").map((_, index) => {
+      const date = index + 1;
+      const thisDate = new Date(
+        currentMonth.getFullYear(),
+        currentMonth.getMonth(),
+        date
+      );
+      let isSelected = false;
+      if (value) {
+        const selectedDate = new Date(value);
+        isSelected = (0, import_date_fns.isSameDay)(selectedDate, thisDate);
+      }
+      return {
+        date,
+        month: currentMonth.getMonth(),
+        isToday: (0, import_date_fns.isToday)(thisDate),
+        isSelected,
+        fullDate: thisDate
+      };
+    });
+    const nextDays = new Array(
+      42 - prevDays.length - allDays2.length
+    ).fill("").map((_, index) => {
+      const date = index + 1;
+      const thisDate = new Date(
+        nextMonth.getFullYear(),
+        nextMonth.getMonth(),
+        date
+      );
+      let isSelected = false;
+      if (value) {
+        const selectedDate = new Date(value);
+        isSelected = (0, import_date_fns.isSameDay)(selectedDate, thisDate);
+      }
+      return {
+        date,
+        month: nextMonth.getMonth(),
+        isToday: (0, import_date_fns.isToday)(thisDate),
+        isSelected,
+        fullDate: thisDate
+      };
+    });
+    return [...prevDays, ...allDays2, ...nextDays];
+  }, [currentMonth, value]);
+  const pickerTopLabel = (0, import_react2.useMemo)(() => {
+    if (selectionMode == "day") {
+      return (0, import_date_fns.format)(currentMonth, "MMM, yyyy");
+    } else if (selectionMode == "month") {
+      return (0, import_date_fns.format)(currentMonth, "yyyy");
+    } else if (selectionMode == "year") {
+      const currentYear = currentMonth.getFullYear();
+      const startYear = currentYear - currentYear % 10 - 1;
+      const endYear = startYear + 10 + 2;
+      setAllYears(
+        new Array(endYear - startYear).fill("").map((_, ind) => startYear + ind)
+      );
+      return (0, import_date_fns.format)(currentMonth, `${startYear + 1} - ${endYear - 2}`);
+    }
+  }, [currentMonth, selectionMode]);
+  const datesContent = /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "dateMainContainer", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "daysContainer", children: daysShortName.map((day, index) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "dateItem", children: day }, `${day}_${index}`)) }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "dateContainer", children: allDays.map((day) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+      "div",
+      {
+        className: `dateItem ${day.month != currentMonth.getMonth() && "nextPreviousDate__"} ${day.isToday && "isToday__"} ${day.isSelected && "isSelected__"}`,
+        onClick: () => {
+          onChange(day.fullDate);
+          updateShow(false);
+        },
+        children: day.date
+      }
+    )) })
+  ] });
+  const monthsContent = /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "monthContainer", children: monthsShortName.map((mth, mthInd) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    "div",
+    {
+      className: `monthItem ${mth == monthsShortName[(/* @__PURE__ */ new Date()).getMonth()] && (/* @__PURE__ */ new Date()).getFullYear() == currentMonth.getFullYear() && "isToday__"} ${value && mth == monthsShortName[new Date(value).getMonth()] && currentMonth.getFullYear() == new Date(value).getFullYear() && "isSelected__"}`,
+      onClick: () => {
+        setCurrentMonth((0, import_date_fns.setMonth)(currentMonth, mthInd));
+        setTimeout(() => {
+          setSelectionMode("day");
+        }, 10);
+      },
+      children: mth
+    }
+  )) });
+  const yearContent = /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "monthContainer", children: allYears.map((yr, yrInd) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    "div",
+    {
+      className: `monthItem ${(/* @__PURE__ */ new Date()).getFullYear() == yr && "isToday__"} ${value && yr == new Date(value).getFullYear() && "isSelected__"} ${(yrInd == 0 || yrInd == allYears.length - 1) && "nextPreviousDate__"}`,
+      onClick: () => {
+        setCurrentMonth((0, import_date_fns.setYear)(currentMonth, yr));
+        setTimeout(() => {
+          setSelectionMode("month");
+        }, 10);
+      },
+      children: yr
+    }
+  )) });
+  const pickerContent = (0, import_react2.useMemo)(() => {
+    if (selectionMode == "day") {
+      return datesContent;
+    } else if (selectionMode == "month") {
+      return monthsContent;
+    } else if (selectionMode == "year") {
+      return yearContent;
+    }
+  }, [selectionMode, allDays, currentMonth, allYears]);
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: `webDatePickerMainContainer ${show ? "show__" : "hide__"}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "topContainer", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        "div",
+        {
+          className: `monthName ${selectionMode == "year" && "noClick__"}`,
+          onClick: switchMode,
+          children: pickerTopLabel
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { onClick: onMinus, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Icon_default, { className: `nextPreviousIcon previous__`, src: dropdown_default }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { onClick: onAdd, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Icon_default, { className: "nextPreviousIcon", src: dropdown_default }) })
+    ] }),
+    pickerContent,
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+      Button_default,
+      {
+        onClick: () => setCurrentMonth(/* @__PURE__ */ new Date()),
+        className: "todayButton",
+        size: "small",
+        removeMinWidth: true,
+        children: "Today"
+      }
+    )
+  ] });
+};
+var WebDatePicker_default = WebDatePicker;
+
+// src/components/datePicker/DatePicker.tsx
+var import_react_hook_form3 = require("react-hook-form");
+var import_date_fns2 = require("date-fns");
+
+// src/components/drawer/Drawer.tsx
+var import_react3 = require("react");
+var import_Drawer = require("./Drawer-5ZWJQFIQ.css");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var Drawer = ({ show, updateShow, children }) => {
+  (0, import_react3.useEffect)(() => {
+    document.body.style.overflow = show ? "hidden" : "auto";
+  }, [show]);
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "drawerMainContainer", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      "div",
+      {
+        onClick: () => updateShow(false),
+        className: `drawerBackgroundContainer ${show ? "show__" : "hide__"}`
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: `drawerContentContainer ${show ? "show__" : "hide__"}`, children })
+  ] });
+};
+var Drawer_default = Drawer;
+
+// src/components/datePicker/DatePicker.tsx
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var DatePicker = ({
+  id,
+  label = "Label",
+  placeholder = "Placeholder",
+  loading = false,
+  disabled = false
+}) => {
+  const datePickerRef = (0, import_react4.useRef)(null);
+  const isMobile = false;
+  const { getValues } = (0, import_react_hook_form3.useFormContext)();
+  const [showPicker, setShowPicker] = (0, import_react4.useState)(false);
+  const docOnClickHandler = (e) => {
+    if (datePickerRef.current && e.target) {
+      if (datePickerRef.current && !datePickerRef.current.contains(e.target)) {
+        setShowPicker(false);
+      }
+    }
+  };
+  (0, import_react4.useEffect)(() => {
+    document.addEventListener("click", docOnClickHandler);
+    return () => {
+      document.removeEventListener("click", docOnClickHandler);
+    };
+  }, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "datePickerMainContainer", ref: datePickerRef, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+      "div",
+      {
+        className: `pickerContainer ${disabled && disabled}`,
+        onClick: () => {
+          if (!disabled) {
+            setShowPicker(!showPicker);
+          }
+        },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "valueContainer", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: `${!getValues(id) && placeholder}`, children: getValues(id) ? (0, import_date_fns2.format)(getValues(id), "dd MMM yyyy") : placeholder }),
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+              Icon_default,
+              {
+                src: dropdown_default,
+                className: `dropdownIcon ${showPicker ? "dropdownIconFlip" : ""}`
+              }
+            )
+          ] }),
+          loading && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SkeletonLoading_default, { radius: 8 })
+        ]
+      }
+    ),
+    isMobile ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Drawer_default, { show: showPicker, updateShow: setShowPicker, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(WebDatePicker_default, { id, show: showPicker, updateShow: setShowPicker }) }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(WebDatePicker_default, { id, show: showPicker, updateShow: setShowPicker })
+  ] });
+};
+var DatePicker_default = DatePicker;
+
+// src/hooks/useSnackbar.ts
+var import_react5 = require("react");
+var useSnackbar = (body, id = "snackbarRoot", timeout = 3e3) => {
+  const snackbarElement = (0, import_react5.useRef)(null);
+  const timeoutId = (0, import_react5.useRef)(null);
+  let root = document.getElementById(id);
+  const [isShowing, setIsShowing] = (0, import_react5.useState)(false);
+  const hoverInHandler = () => {
+    if (timeoutId.current) {
+      clearTimeout(timeoutId.current);
+    }
+  };
+  const hoverOutHandler = () => {
+    timeoutId.current = setTimeout(() => {
+      closeSnackbar();
+    }, timeout);
+  };
+  (0, import_react5.useEffect)(() => {
+    if (!root) {
+      const rootDiv = document.createElement("div");
+      rootDiv.setAttribute("id", id);
+      const contentDiv = document.createElement("div");
+      contentDiv.className = "snackbarContentContainer";
+      const contentInnerDiv = document.createElement("div");
+      contentInnerDiv.className = "hide__";
+      contentDiv.appendChild(contentInnerDiv);
+      rootDiv.appendChild(contentDiv);
+      if (body) {
+        body.appendChild(rootDiv);
+      } else {
+        document.body.appendChild(rootDiv);
+      }
+      root = rootDiv;
+    }
+    if (root) {
+      const snackbarContainer = root.children[0];
+      if (snackbarContainer) {
+        const snackbar = snackbarContainer.children[0];
+        if (snackbar) {
+          snackbarElement.current = snackbar;
+        }
+      }
+    }
+  }, []);
+  const showSnackbar = (message, type = "info") => {
+    let animTimeout = 0;
+    if (isShowing) {
+      closeSnackbar();
+      animTimeout = 300;
+    }
+    setTimeout(() => {
+      if (snackbarElement.current) {
+        snackbarElement.current.innerHTML = message;
+        snackbarElement.current.className = `show__ ${type}__`;
+        setIsShowing(true);
+      }
+    }, animTimeout);
+  };
+  const closeSnackbar = () => {
+    if (snackbarElement.current) {
+      snackbarElement.current.className = `hide__`;
+      setIsShowing(false);
+    }
+  };
+  (0, import_react5.useEffect)(() => {
+    if (isShowing && snackbarElement.current) {
+      snackbarElement.current.addEventListener("mouseenter", hoverInHandler);
+      snackbarElement.current.addEventListener("mouseleave", hoverOutHandler);
+      if (timeoutId.current) {
+        clearTimeout(timeoutId.current);
+      }
+      timeoutId.current = setTimeout(() => {
+        closeSnackbar();
+      }, timeout);
+    } else if (snackbarElement.current) {
+      snackbarElement.current.removeEventListener("mouseenter", hoverInHandler);
+      snackbarElement.current.removeEventListener(
+        "mouseleave",
+        hoverOutHandler
+      );
+    }
+  }, [isShowing]);
+  return {
+    showSnackbar
+  };
+};
+
+// src/hooks/usePostMessage.ts
+var import_react6 = require("react");
+var usePostMessage = (url) => {
+  const sendDimension = () => {
+    const body = document.body;
+    const html = document.documentElement;
+    const width = Math.max(
+      body.scrollWidth,
+      body.offsetWidth,
+      html.clientWidth,
+      html.scrollWidth,
+      html.offsetWidth
+    );
+    const height = Math.max(
+      body.scrollHeight,
+      body.offsetHeight,
+      html.clientHeight,
+      html.scrollHeight,
+      html.offsetHeight
+    );
+    window.parent.postMessage({ type: "resize", height, width }, url);
+  };
+  const postMessage = (data) => {
+    window.parent.postMessage(data, url);
+  };
+  const postNotification = (data) => {
+    window.parent.postMessage(
+      {
+        type: "noti",
+        data
+      },
+      url
+    );
+  };
+  const postPopup = (data) => {
+    window.parent.postMessage({ type: "popup", data }, url);
+  };
+  const postQuestion = (data) => {
+    window.parent.postMessage({ type: "question", data }, url);
+    let resolve;
+    const prom = new Promise((res) => resolve = res);
+    const messageHandler = (ev) => {
+      resolve(ev.data);
+      window.removeEventListener("message", messageHandler);
+    };
+    window.addEventListener("message", messageHandler);
+    return prom;
+  };
+  (0, import_react6.useEffect)(() => {
+    sendDimension();
+    window.addEventListener("DOMContentLoaded", sendDimension);
+    window.addEventListener("resize", sendDimension);
+    return () => {
+      window.removeEventListener("DOMContentLoaded", sendDimension);
+      window.removeEventListener("resize", sendDimension);
+    };
+  }, []);
+  return {
+    sendDimension,
+    postMessage,
+    postNotification,
+    postPopup,
+    postQuestion
+  };
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  Button,
+  DatePicker,
   Input,
-  SkeletonLoading
+  SkeletonLoading,
+  usePostMessage,
+  useSnackbar
 });
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/components/input/Input.tsx","../src/components/skeletonLoading/SkeletonLoading.tsx"],"sourcesContent":["import \"./index.css\";\r\n\r\nexport { default as Input } from \"./components/input/Input\";\r\nexport { default as SkeletonLoading } from \"./components/skeletonLoading/SkeletonLoading\";\r\nexport type { InputProps } from \"./components/input/types\";\r\nexport type { SkeletonLoadingProps } from \"./components/skeletonLoading/types\";\r\n","import { FC } from \"react\";\r\nimport { useController } from \"react-hook-form\";\r\n\r\nimport \"./Input.css\";\r\nimport SkeletonLoading from \"../skeletonLoading/SkeletonLoading\";\r\nimport { InputProps } from \"./types\";\r\n\r\nconst Input: FC<InputProps> = ({\r\n  id,\r\n  required = false,\r\n  hideLabel = false,\r\n  label = \"Label\",\r\n  placeholder = \"Placeholder\",\r\n  loading = false,\r\n  disabled = false,\r\n}) => {\r\n  // #region Controller\r\n  const {\r\n    field: { value, onChange },\r\n  } = useController({\r\n    name: id,\r\n    rules: {\r\n      required: required,\r\n    },\r\n  });\r\n  // #endregion Controller\r\n\r\n  return (\r\n    <div className=\"inputContainer\">\r\n      {!hideLabel && <div>{label}</div>}\r\n      <div className=\"inputElementContainer\">\r\n        <input\r\n          className=\"input\"\r\n          value={value}\r\n          placeholder={placeholder}\r\n          type=\"text\"\r\n          onChange={(e) => onChange(e.target.value)}\r\n          disabled={disabled}\r\n        />\r\n        {loading && <SkeletonLoading radius={8} />}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default Input;\r\n","import { FC } from \"react\";\r\nimport \"./SkeletonLoading.css\";\r\nimport { SkeletonLoadingProps } from \"./types\";\r\n\r\nconst SkeletonLoading: FC<SkeletonLoadingProps> = ({ radius = 10 }) => {\r\n  return (\r\n    <div\r\n      className={\"skeletonMainContainer\"}\r\n      style={{ borderRadius: `${radius}px` }}\r\n    >\r\n      <div className={\"skeletonAnimContainer\"}></div>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default SkeletonLoading;\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAO;;;ACCP,6BAA8B;AAE9B,mBAAO;;;ACFP,6BAAO;AASD;AANN,IAAM,kBAA4C,CAAC,EAAE,SAAS,GAAG,MAAM;AACrE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACX,OAAO,EAAE,cAAc,GAAG,MAAM,KAAK;AAAA,MAErC,sDAAC,SAAI,WAAW,yBAAyB;AAAA;AAAA,EAC3C;AAEJ;AAEA,IAAO,0BAAQ;;;ADcM,IAAAA,sBAAA;AAtBrB,IAAM,QAAwB,CAAC;AAAA,EAC7B;AAAA,EACA,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,UAAU;AAAA,EACV,WAAW;AACb,MAAM;AAEJ,QAAM;AAAA,IACJ,OAAO,EAAE,OAAO,SAAS;AAAA,EAC3B,QAAI,sCAAc;AAAA,IAChB,MAAM;AAAA,IACN,OAAO;AAAA,MACL;AAAA,IACF;AAAA,EACF,CAAC;AAGD,SACE,8CAAC,SAAI,WAAU,kBACZ;AAAA,KAAC,aAAa,6CAAC,SAAK,iBAAM;AAAA,IAC3B,8CAAC,SAAI,WAAU,yBACb;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV;AAAA,UACA;AAAA,UACA,MAAK;AAAA,UACL,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA,UACxC;AAAA;AAAA,MACF;AAAA,MACC,WAAW,6CAAC,2BAAgB,QAAQ,GAAG;AAAA,OAC1C;AAAA,KACF;AAEJ;AAEA,IAAO,gBAAQ;","names":["import_jsx_runtime"]}
+{"version":3,"sources":["../src/index.ts","../src/components/input/Input.tsx","../src/components/skeletonLoading/SkeletonLoading.tsx","../src/components/button/Button.tsx","../src/components/datePicker/DatePicker.tsx","../src/components/icon/Icon.tsx","../src/components/datePicker/components/webDatePicker/WebDatePicker.tsx","../src/components/drawer/Drawer.tsx","../src/hooks/useSnackbar.ts","../src/hooks/usePostMessage.ts"],"sourcesContent":["import \"./index.css\";\r\n\r\n// #region Components\r\nexport { default as Input } from \"./components/input/Input\";\r\nexport type { InputProps } from \"./components/input/types\";\r\nexport { default as SkeletonLoading } from \"./components/skeletonLoading/SkeletonLoading\";\r\nexport type { SkeletonLoadingProps } from \"./components/skeletonLoading/types\";\r\nexport { default as Button } from \"./components/button/Button\";\r\nexport type { ButtonProps } from \"./components/button/types\";\r\nexport { default as DatePicker } from \"./components/datePicker/DatePicker\";\r\n// #endregion Components\r\n\r\n// #region Hooks\r\nexport { useSnackbar } from \"./hooks/useSnackbar\";\r\nexport { usePostMessage } from \"./hooks/usePostMessage\";\r\nexport type { NotificationType } from \"./hooks/types\";\r\n// #endregion Hooks\r\n","import { FC } from \"react\";\r\nimport { useController } from \"react-hook-form\";\r\n\r\nimport \"./Input.css\";\r\nimport SkeletonLoading from \"../skeletonLoading/SkeletonLoading\";\r\nimport { InputProps } from \"./types\";\r\n\r\n/** Create an input component including label\r\n *\r\n * This component needs to be wrap in FormProvider from react-hook-form\r\n */\r\nconst Input: FC<InputProps> = ({\r\n  id,\r\n  required = false,\r\n  hideLabel = false,\r\n  label = \"Label\",\r\n  placeholder = \"Placeholder\",\r\n  loading = false,\r\n  disabled = false,\r\n}) => {\r\n  // #region Controller\r\n  const {\r\n    field: { value, onChange },\r\n  } = useController({\r\n    name: id,\r\n    rules: {\r\n      required: required,\r\n    },\r\n  });\r\n  // #endregion Controller\r\n\r\n  return (\r\n    <div className=\"inputContainer\">\r\n      {!hideLabel && <div>{label}</div>}\r\n      <div className=\"inputElementContainer\">\r\n        <input\r\n          className=\"input\"\r\n          value={value}\r\n          placeholder={placeholder}\r\n          type=\"text\"\r\n          onChange={(e) => onChange(e.target.value)}\r\n          disabled={disabled}\r\n        />\r\n        {loading && <SkeletonLoading radius={8} />}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default Input;\r\n","import { FC } from \"react\";\r\nimport \"./SkeletonLoading.css\";\r\nimport { SkeletonLoadingProps } from \"./types\";\r\n\r\n/** A skeleton loading with animation\r\n *\r\n * This needs to be wrap in a container with position: relative;\r\n */\r\nconst SkeletonLoading: FC<SkeletonLoadingProps> = ({ radius = 10 }) => {\r\n  return (\r\n    <div\r\n      className={\"skeletonMainContainer\"}\r\n      style={{ borderRadius: `${radius}px` }}\r\n    >\r\n      <div className={\"skeletonAnimContainer\"}></div>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default SkeletonLoading;\r\n","import { FC, useMemo, type PropsWithChildren } from \"react\";\r\n\r\nimport \"./Button.css\";\r\nimport { ButtonProps } from \"./types\";\r\n\r\n/** The button component with size and type */\r\nconst Button: FC<ButtonProps> = ({\r\n  children,\r\n  onClick,\r\n  className,\r\n  type = \"submit\",\r\n  disabled = false,\r\n  loading = false,\r\n  size = \"default\",\r\n  removeMinWidth = false,\r\n}) => {\r\n  // #region UseMemo\r\n  const buttonClass = useMemo((): string => {\r\n    if (disabled || loading) return \"disabledBtn\";\r\n\r\n    switch (type) {\r\n      case \"submit\":\r\n        return \"submitBtn\";\r\n      case \"danger\":\r\n        return \"dangerBtn\";\r\n      case \"warning\":\r\n        return \"warningBtn\";\r\n    }\r\n  }, [type, disabled, loading]);\r\n  // #endregion UseMemo\r\n\r\n  return (\r\n    <button\r\n      className={`mainBtn ${className} ${buttonClass} ${`${size}__`} ${\r\n        removeMinWidth && \"noMinWidth__\"\r\n      }`}\r\n      onClick={() => {\r\n        if (!disabled) onClick();\r\n      }}\r\n      disabled={disabled || loading}\r\n    >\r\n      <div className={loading ? \"hideContent\" : \"\"}>{children}</div>\r\n\r\n      <div className={`loadingCircle ${loading && \"show__\"}`}></div>\r\n    </button>\r\n  );\r\n};\r\n\r\nexport default Button;\r\n","import { useEffect, useRef, useState } from \"react\";\r\nimport SkeletonLoading from \"../skeletonLoading/SkeletonLoading\";\r\n\r\nimport \"./DatePicker.css\";\r\nimport Icon from \"../icon/Icon\";\r\nimport dropdownIcon from \"../../assets/dropdown.svg\";\r\n\r\nimport WebDatePicker from \"./components/webDatePicker/WebDatePicker\";\r\nimport { useFormContext } from \"react-hook-form\";\r\nimport { format } from \"date-fns\";\r\nimport Drawer from \"../drawer/Drawer\";\r\n\r\ninterface DatePickerProps {\r\n  id: string;\r\n  label?: string;\r\n  placeholder?: string;\r\n  loading?: boolean;\r\n  disabled?: boolean;\r\n}\r\n\r\nconst DatePicker: React.FC<DatePickerProps> = ({\r\n  id,\r\n  label = \"Label\",\r\n  placeholder = \"Placeholder\",\r\n  loading = false,\r\n  disabled = false,\r\n}) => {\r\n  const datePickerRef = useRef<HTMLDivElement>(null);\r\n  // const isMobile = useMediaQuery({ maxWidth: 799.98 });\r\n  const isMobile = false;\r\n\r\n  const { getValues } = useFormContext();\r\n\r\n  // #region States\r\n  const [showPicker, setShowPicker] = useState<boolean>(false);\r\n  // #endregion States\r\n\r\n  // #region Click Handler\r\n  const docOnClickHandler = (e: PointerEvent) => {\r\n    if (datePickerRef.current && e.target) {\r\n      if (\r\n        datePickerRef.current &&\r\n        !datePickerRef.current.contains(e.target as Node)\r\n      ) {\r\n        setShowPicker(false);\r\n      }\r\n    }\r\n  };\r\n  useEffect(() => {\r\n    document.addEventListener(\"click\", docOnClickHandler);\r\n\r\n    return () => {\r\n      document.removeEventListener(\"click\", docOnClickHandler);\r\n    };\r\n  }, []);\r\n  // #endregion Click Handler\r\n\r\n  return (\r\n    <div className=\"datePickerMainContainer\" ref={datePickerRef}>\r\n      <div>{label}</div>\r\n      <div\r\n        className={`pickerContainer ${disabled && disabled}`}\r\n        onClick={() => {\r\n          if (!disabled) {\r\n            setShowPicker(!showPicker);\r\n          }\r\n        }}\r\n      >\r\n        <div className=\"valueContainer\">\r\n          <div className={`${!getValues(id) && placeholder}`}>\r\n            {getValues(id)\r\n              ? format(getValues(id) as Date, \"dd MMM yyyy\")\r\n              : placeholder}\r\n          </div>\r\n          <Icon\r\n            src={dropdownIcon}\r\n            className={`dropdownIcon ${showPicker ? \"dropdownIconFlip\" : \"\"}`}\r\n          />\r\n        </div>\r\n        {loading && <SkeletonLoading radius={8} />}\r\n      </div>\r\n\r\n      {isMobile ? (\r\n        <Drawer show={showPicker} updateShow={setShowPicker}>\r\n          <WebDatePicker id={id} show={showPicker} updateShow={setShowPicker} />\r\n        </Drawer>\r\n      ) : (\r\n        <WebDatePicker id={id} show={showPicker} updateShow={setShowPicker} />\r\n      )}\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default DatePicker;\r\n","import \"./Icon.css\";\n\ninterface IconProps {\n  src: string;\n  className?: string;\n  flat?: boolean;\n}\n\nconst Icon: React.FC<IconProps> = ({ src, className, flat = true }) => {\n  const classNames = [\"icon\", className, flat ? \"flat__\" : \"\"].join(\" \");\n\n  return flat ? (\n    <img className={classNames} src={src && src.toString()} />\n  ) : (\n    <i\n      className={classNames}\n      style={{\n        maskImage: `url(\"${src}\"`,\n        WebkitMaskImage: `url(\"${src}\")`,\n      }}\n    ></i>\n  );\n};\n\nexport default Icon;\n\n","import { useEffect, useMemo, useState } from \"react\";\r\nimport Icon from \"../../../icon/Icon\";\r\n\r\nimport \"./WebDatePicker.css\";\r\nimport {\r\n  addMonths,\r\n  addYears,\r\n  format,\r\n  getDaysInMonth,\r\n  isSameDay,\r\n  isToday,\r\n  setMonth,\r\n  setYear,\r\n  startOfMonth,\r\n} from \"date-fns\";\r\nimport { useController } from \"react-hook-form\";\r\nimport Button from \"../../../button/Button\";\r\n\r\nimport dropdownIcon from \"../../../../assets/dropdown.svg\";\r\n\r\ninterface DateDetails {\r\n  month: number;\r\n  date: number;\r\n  isToday: boolean;\r\n  isSelected: boolean;\r\n  fullDate: Date;\r\n}\r\n\r\nconst daysShortName = [\"S\", \"M\", \"T\", \"W\", \"T\", \"F\", \"S\"];\r\nconst monthsShortName = [\r\n  \"Jan\",\r\n  \"Feb\",\r\n  \"Mar\",\r\n  \"Apr\",\r\n  \"May\",\r\n  \"Jun\",\r\n  \"Jul\",\r\n  \"Aug\",\r\n  \"Sep\",\r\n  \"Oct\",\r\n  \"Nov\",\r\n  \"Dec\",\r\n];\r\n\r\ninterface WebDatePickerProps {\r\n  id: string;\r\n  show: boolean;\r\n  updateShow: (_: boolean) => void;\r\n}\r\n\r\nconst WebDatePicker: React.FC<WebDatePickerProps> = ({\r\n  id,\r\n  show,\r\n  updateShow,\r\n}) => {\r\n  // #region States\r\n  const [currentMonth, setCurrentMonth] = useState<Date>(new Date());\r\n  const [selectionMode, setSelectionMode] = useState<\"day\" | \"month\" | \"year\">(\r\n    \"day\"\r\n  );\r\n  const [allYears, setAllYears] = useState<number[]>([]);\r\n  // #endregion States\r\n\r\n  // #region Forms\r\n  const {\r\n    field: { onChange, value },\r\n  } = useController({ name: id });\r\n  // #endregion Forms\r\n\r\n  // #region UseEffect\r\n  useEffect(() => {\r\n    if (show && value) {\r\n      setCurrentMonth(new Date(value));\r\n    }\r\n\r\n    if (show) {\r\n      setSelectionMode(\"day\");\r\n    }\r\n  }, [show]);\r\n  // #endregion UseEffect\r\n\r\n  // #region Methods\r\n  const onAdd = () => {\r\n    if (selectionMode == \"day\") {\r\n      setCurrentMonth(addMonths(currentMonth, 1));\r\n    } else if (selectionMode == \"month\") {\r\n      setCurrentMonth(addYears(currentMonth, 1));\r\n    } else if (selectionMode == \"year\") {\r\n      setCurrentMonth(addYears(currentMonth, 10));\r\n    }\r\n  };\r\n\r\n  const onMinus = () => {\r\n    if (selectionMode == \"day\") {\r\n      setCurrentMonth(addMonths(currentMonth, -1));\r\n    } else if (selectionMode == \"month\") {\r\n      setCurrentMonth(addYears(currentMonth, -1));\r\n    } else if (selectionMode == \"year\") {\r\n      setCurrentMonth(addYears(currentMonth, -10));\r\n    }\r\n  };\r\n\r\n  const switchMode = () => {\r\n    if (selectionMode == \"day\") {\r\n      setSelectionMode(\"month\");\r\n    } else if (selectionMode == \"month\") {\r\n      setSelectionMode(\"year\");\r\n    }\r\n  };\r\n  // #endregion Methods\r\n\r\n  // #region UseMemo\r\n  const allDays = useMemo((): DateDetails[] => {\r\n    const totalDays = getDaysInMonth(currentMonth);\r\n    const firstDay = startOfMonth(currentMonth).getDay() || 7;\r\n\r\n    const previousMonth = addMonths(currentMonth, -1);\r\n    const previousMonthTotalDays = getDaysInMonth(previousMonth);\r\n\r\n    const nextMonth = addMonths(currentMonth, 1);\r\n\r\n    const prevDays: DateDetails[] = new Array(firstDay)\r\n      .fill(\"\")\r\n      .map((_: string, index) => {\r\n        const date = previousMonthTotalDays - index;\r\n        const thisDate = new Date(\r\n          previousMonth.getFullYear(),\r\n          previousMonth.getMonth(),\r\n          date\r\n        );\r\n\r\n        let isSelected = false;\r\n        if (value) {\r\n          const selectedDate = new Date(value);\r\n          isSelected = isSameDay(selectedDate, thisDate);\r\n        }\r\n\r\n        return {\r\n          date: date,\r\n          month: previousMonth.getMonth(),\r\n          isToday: isToday(thisDate),\r\n          isSelected: isSelected,\r\n          fullDate: thisDate,\r\n        };\r\n      })\r\n      .sort((a, b) => a.date - b.date);\r\n    const allDays: DateDetails[] = new Array(totalDays)\r\n      .fill(\"\")\r\n      .map((_: string, index: number) => {\r\n        const date = index + 1;\r\n        const thisDate = new Date(\r\n          currentMonth.getFullYear(),\r\n          currentMonth.getMonth(),\r\n          date\r\n        );\r\n\r\n        let isSelected = false;\r\n        if (value) {\r\n          const selectedDate = new Date(value);\r\n          isSelected = isSameDay(selectedDate, thisDate);\r\n        }\r\n\r\n        return {\r\n          date: date,\r\n          month: currentMonth.getMonth(),\r\n          isToday: isToday(thisDate),\r\n          isSelected: isSelected,\r\n          fullDate: thisDate,\r\n        };\r\n      });\r\n    const nextDays: DateDetails[] = new Array(\r\n      42 - prevDays.length - allDays.length\r\n    )\r\n      .fill(\"\")\r\n      .map((_: string, index: number) => {\r\n        const date = index + 1;\r\n        const thisDate = new Date(\r\n          nextMonth.getFullYear(),\r\n          nextMonth.getMonth(),\r\n          date\r\n        );\r\n\r\n        let isSelected = false;\r\n        if (value) {\r\n          const selectedDate = new Date(value);\r\n          isSelected = isSameDay(selectedDate, thisDate);\r\n        }\r\n\r\n        return {\r\n          date: date,\r\n          month: nextMonth.getMonth(),\r\n          isToday: isToday(thisDate),\r\n          isSelected: isSelected,\r\n          fullDate: thisDate,\r\n        };\r\n      });\r\n\r\n    return [...prevDays, ...allDays, ...nextDays];\r\n  }, [currentMonth, value]);\r\n\r\n  const pickerTopLabel = useMemo(() => {\r\n    if (selectionMode == \"day\") {\r\n      return format(currentMonth, \"MMM, yyyy\");\r\n    } else if (selectionMode == \"month\") {\r\n      return format(currentMonth, \"yyyy\");\r\n    } else if (selectionMode == \"year\") {\r\n      const currentYear = currentMonth.getFullYear();\r\n      const startYear = currentYear - (currentYear % 10) - 1;\r\n      const endYear = startYear + 10 + 2;\r\n\r\n      setAllYears(\r\n        new Array(endYear - startYear)\r\n          .fill(\"\")\r\n          .map((_: string, ind: number) => startYear + ind)\r\n      );\r\n      return format(currentMonth, `${startYear + 1} - ${endYear - 2}`);\r\n    }\r\n  }, [currentMonth, selectionMode]);\r\n  // #endregion UseMemo\r\n\r\n  // #region Content\r\n  const datesContent = (\r\n    <div className=\"dateMainContainer\">\r\n      <div className=\"daysContainer\">\r\n        {daysShortName.map((day, index) => (\r\n          <div key={`${day}_${index}`} className=\"dateItem\">\r\n            {day}\r\n          </div>\r\n        ))}\r\n      </div>\r\n\r\n      <div className=\"dateContainer\">\r\n        {allDays.map((day: DateDetails) => (\r\n          <div\r\n            className={`dateItem ${\r\n              day.month != currentMonth.getMonth() && \"nextPreviousDate__\"\r\n            } ${day.isToday && \"isToday__\"} ${\r\n              day.isSelected && \"isSelected__\"\r\n            }`}\r\n            onClick={() => {\r\n              onChange(day.fullDate);\r\n              updateShow(false);\r\n            }}\r\n          >\r\n            {day.date}\r\n          </div>\r\n        ))}\r\n      </div>\r\n    </div>\r\n  );\r\n\r\n  const monthsContent = (\r\n    <div className=\"monthContainer\">\r\n      {monthsShortName.map((mth: string, mthInd: number) => (\r\n        <div\r\n          className={`monthItem ${\r\n            mth == monthsShortName[new Date().getMonth()] &&\r\n            new Date().getFullYear() == currentMonth.getFullYear() &&\r\n            \"isToday__\"\r\n          } ${\r\n            value &&\r\n            mth == monthsShortName[new Date(value).getMonth()] &&\r\n            currentMonth.getFullYear() == new Date(value).getFullYear() &&\r\n            \"isSelected__\"\r\n          }`}\r\n          onClick={() => {\r\n            setCurrentMonth(setMonth(currentMonth, mthInd));\r\n            setTimeout(() => {\r\n              setSelectionMode(\"day\");\r\n            }, 10);\r\n          }}\r\n        >\r\n          {mth}\r\n        </div>\r\n      ))}\r\n    </div>\r\n  );\r\n\r\n  const yearContent = (\r\n    <div className=\"monthContainer\">\r\n      {allYears.map((yr: number, yrInd: number) => (\r\n        <div\r\n          className={`monthItem ${\r\n            new Date().getFullYear() == yr && \"isToday__\"\r\n          } ${value && yr == new Date(value).getFullYear() && \"isSelected__\"} ${\r\n            (yrInd == 0 || yrInd == allYears.length - 1) && \"nextPreviousDate__\"\r\n          }`}\r\n          onClick={() => {\r\n            setCurrentMonth(setYear(currentMonth, yr));\r\n            setTimeout(() => {\r\n              setSelectionMode(\"month\");\r\n            }, 10);\r\n          }}\r\n        >\r\n          {yr}\r\n        </div>\r\n      ))}\r\n    </div>\r\n  );\r\n\r\n  const pickerContent = useMemo(() => {\r\n    if (selectionMode == \"day\") {\r\n      return datesContent;\r\n    } else if (selectionMode == \"month\") {\r\n      return monthsContent;\r\n    } else if (selectionMode == \"year\") {\r\n      return yearContent;\r\n    }\r\n  }, [selectionMode, allDays, currentMonth, allYears]);\r\n  // #endregion Content\r\n\r\n  return (\r\n    <div className={`webDatePickerMainContainer ${show ? \"show__\" : \"hide__\"}`}>\r\n      <div className=\"topContainer\">\r\n        <div\r\n          className={`monthName ${selectionMode == \"year\" && \"noClick__\"}`}\r\n          onClick={switchMode}\r\n        >\r\n          {pickerTopLabel}\r\n        </div>\r\n        <div onClick={onMinus}>\r\n          <Icon className={`nextPreviousIcon previous__`} src={dropdownIcon} />\r\n        </div>\r\n        <div onClick={onAdd}>\r\n          <Icon className=\"nextPreviousIcon\" src={dropdownIcon} />\r\n        </div>\r\n      </div>\r\n\r\n      {pickerContent}\r\n\r\n      <Button\r\n        onClick={() => setCurrentMonth(new Date())}\r\n        className=\"todayButton\"\r\n        size=\"small\"\r\n        removeMinWidth\r\n      >\r\n        Today\r\n      </Button>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default WebDatePicker;\r\n","import { useEffect, type PropsWithChildren } from \"react\";\r\n\r\nimport \"./Drawer.css\";\r\n\r\ninterface DrawerProps extends PropsWithChildren {\r\n  show: boolean;\r\n  updateShow: (_: boolean) => void;\r\n}\r\n\r\nconst Drawer: React.FC<DrawerProps> = ({ show, updateShow, children }) => {\r\n  // #region UseEffect\r\n  useEffect(() => {\r\n    document.body.style.overflow = show ? \"hidden\" : \"auto\";\r\n  }, [show]);\r\n  // #endregion UseEffect\r\n\r\n  return (\r\n    <div className=\"drawerMainContainer\">\r\n      <div\r\n        onClick={() => updateShow(false)}\r\n        className={`drawerBackgroundContainer ${show ? \"show__\" : \"hide__\"}`}\r\n      ></div>\r\n      <div className={`drawerContentContainer ${show ? \"show__\" : \"hide__\"}`}>\r\n        {children}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default Drawer;\r\n","import { useEffect, useRef, useState } from \"react\";\r\n\r\ntype SnackbarType = \"info\" | \"danger\" | \"warning\" | \"success\";\r\ninterface SnackbarReturn {\r\n  /** To show the snackbar */\r\n  showSnackbar: (\r\n    /** Can be in any string format of the message to show */\r\n    message: string,\r\n    /** info, danger, warning or success - default: info */\r\n    type?: SnackbarType\r\n  ) => void;\r\n}\r\n\r\n/** Init the snackbar container\r\n *\r\n * @param id To set the id of the root container of the snackbar - default: snackbarRoot\r\n * @param timeout To set the timeout on when the snackbar will be auto hide - default: 3000\r\n */\r\nexport const useSnackbar = (\r\n  body?: HTMLElement | null,\r\n  id: string = \"snackbarRoot\",\r\n  timeout: number = 3000\r\n): SnackbarReturn => {\r\n  const snackbarElement = useRef<HTMLDivElement>(null);\r\n  const timeoutId = useRef<any>(null);\r\n  let root = document.getElementById(id);\r\n\r\n  // #region States\r\n  const [isShowing, setIsShowing] = useState<boolean>(false);\r\n  // #endregion States\r\n\r\n  // #region Handler\r\n  const hoverInHandler = () => {\r\n    if (timeoutId.current) {\r\n      clearTimeout(timeoutId.current);\r\n    }\r\n  };\r\n  const hoverOutHandler = () => {\r\n    timeoutId.current = setTimeout(() => {\r\n      closeSnackbar();\r\n    }, timeout);\r\n  };\r\n  // #endregion Handler\r\n\r\n  // #region UseEffect\r\n  useEffect(() => {\r\n    if (!root) {\r\n      const rootDiv = document.createElement(\"div\");\r\n      rootDiv.setAttribute(\"id\", id);\r\n\r\n      const contentDiv = document.createElement(\"div\");\r\n      contentDiv.className = \"snackbarContentContainer\";\r\n\r\n      const contentInnerDiv = document.createElement(\"div\");\r\n      contentInnerDiv.className = \"hide__\";\r\n\r\n      contentDiv.appendChild(contentInnerDiv);\r\n      rootDiv.appendChild(contentDiv);\r\n\r\n      if (body) {\r\n        body.appendChild(rootDiv);\r\n      } else {\r\n        document.body.appendChild(rootDiv);\r\n      }\r\n\r\n      root = rootDiv;\r\n    }\r\n\r\n    if (root) {\r\n      const snackbarContainer = root.children[0];\r\n\r\n      if (snackbarContainer) {\r\n        const snackbar = snackbarContainer.children[0];\r\n\r\n        if (snackbar) {\r\n          snackbarElement.current = snackbar as HTMLDivElement;\r\n        }\r\n      }\r\n    }\r\n  }, []);\r\n  // #endregion UseEffect\r\n\r\n  const showSnackbar = (message: string, type: SnackbarType = \"info\") => {\r\n    let animTimeout = 0;\r\n    if (isShowing) {\r\n      closeSnackbar();\r\n      animTimeout = 300;\r\n    }\r\n\r\n    setTimeout(() => {\r\n      if (snackbarElement.current) {\r\n        snackbarElement.current.innerHTML = message;\r\n        snackbarElement.current.className = `show__ ${type}__`;\r\n\r\n        setIsShowing(true);\r\n      }\r\n    }, animTimeout);\r\n  };\r\n\r\n  const closeSnackbar = () => {\r\n    if (snackbarElement.current) {\r\n      snackbarElement.current.className = `hide__`;\r\n\r\n      setIsShowing(false);\r\n    }\r\n  };\r\n\r\n  useEffect(() => {\r\n    if (isShowing && snackbarElement.current) {\r\n      snackbarElement.current.addEventListener(\"mouseenter\", hoverInHandler);\r\n      snackbarElement.current.addEventListener(\"mouseleave\", hoverOutHandler);\r\n\r\n      if (timeoutId.current) {\r\n        clearTimeout(timeoutId.current);\r\n      }\r\n\r\n      timeoutId.current = setTimeout(() => {\r\n        closeSnackbar();\r\n      }, timeout);\r\n    } else if (snackbarElement.current) {\r\n      snackbarElement.current.removeEventListener(\"mouseenter\", hoverInHandler);\r\n      snackbarElement.current.removeEventListener(\r\n        \"mouseleave\",\r\n        hoverOutHandler\r\n      );\r\n    }\r\n  }, [isShowing]);\r\n\r\n  return {\r\n    showSnackbar,\r\n  };\r\n};\r\n","import { useEffect } from \"react\";\r\nimport {\r\n  NotificationType,\r\n  PopupType,\r\n  QuestionType,\r\n  UsePostMessageReturn,\r\n} from \"./types\";\r\n\r\n/**\r\n * React hook for communicating iframe dimensions and messages\r\n * to a parent window.\r\n *\r\n * This hook automatically:\r\n * - Sends initial iframe dimensions on mount\r\n * - Updates dimensions on DOM content load\r\n * - Updates dimensions on window resize\r\n *\r\n * @param url - The target origin for `postMessage`\r\n *\r\n * @returns Functions for sending dimensions and posting custom messages\r\n */\r\nexport const usePostMessage = (url: string): UsePostMessageReturn => {\r\n  const sendDimension = () => {\r\n    const body = document.body;\r\n    const html = document.documentElement;\r\n\r\n    const width = Math.max(\r\n      body.scrollWidth,\r\n      body.offsetWidth,\r\n      html.clientWidth,\r\n      html.scrollWidth,\r\n      html.offsetWidth\r\n    );\r\n\r\n    const height = Math.max(\r\n      body.scrollHeight,\r\n      body.offsetHeight,\r\n      html.clientHeight,\r\n      html.scrollHeight,\r\n      html.offsetHeight\r\n    );\r\n\r\n    window.parent.postMessage({ type: \"resize\", height, width }, url);\r\n  };\r\n\r\n  const postMessage = (data: any) => {\r\n    window.parent.postMessage(data, url);\r\n  };\r\n\r\n  const postNotification = (data: NotificationType) => {\r\n    window.parent.postMessage(\r\n      {\r\n        type: \"noti\",\r\n        data: data,\r\n      },\r\n      url\r\n    );\r\n  };\r\n\r\n  const postPopup = (data: PopupType) => {\r\n    window.parent.postMessage({ type: \"popup\", data: data }, url);\r\n  };\r\n\r\n  const postQuestion = (data: QuestionType): Promise<string> => {\r\n    window.parent.postMessage({ type: \"question\", data: data }, url);\r\n\r\n    let resolve: (value: string | PromiseLike<string>) => void;\r\n    const prom = new Promise<string>((res) => (resolve = res));\r\n\r\n    const messageHandler = (ev: MessageEvent) => {\r\n      resolve(ev.data);\r\n      window.removeEventListener(\"message\", messageHandler);\r\n    };\r\n    window.addEventListener(\"message\", messageHandler);\r\n\r\n    return prom;\r\n  };\r\n\r\n  useEffect(() => {\r\n    sendDimension();\r\n\r\n    window.addEventListener(\"DOMContentLoaded\", sendDimension);\r\n    window.addEventListener(\"resize\", sendDimension);\r\n\r\n    return () => {\r\n      window.removeEventListener(\"DOMContentLoaded\", sendDimension);\r\n      window.removeEventListener(\"resize\", sendDimension);\r\n    };\r\n  }, []);\r\n\r\n  return {\r\n    sendDimension,\r\n    postMessage,\r\n    postNotification,\r\n    postPopup,\r\n    postQuestion,\r\n  };\r\n};\r\n"],"mappings":"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","names":["import_jsx_runtime","import_jsx_runtime","import_react","import_jsx_runtime","import_react","import_react_hook_form","import_jsx_runtime","allDays","import_react_hook_form","import_date_fns","import_react","import_jsx_runtime","import_jsx_runtime","import_react","import_react"]}