catchup-library-web 1.0.0

package/dist/index.js

@@ -0,0 +1,674 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  ApproveButton: () => ApproveButton_default,
+  BaseImage: () => BaseImage_default,
+  BaseLoading: () => BaseLoading_default,
+  CancelButton: () => CancelButton_default,
+  CreateButton: () => CreateButton_default,
+  DeleteButton: () => DeleteButton_default,
+  PrimaryButton: () => PrimaryButton_default,
+  SecondaryButton: () => SecondaryButton_default
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/components/buttons/PrimaryButton.tsx
+var import_react2 = require("react");
+
+// src/components/images/BaseImage.tsx
+var import_react = require("react");
+
+// src/components/loading/BaseLoading.tsx
+var import_react_loader_spinner = require("react-loader-spinner");
+var import_jsx_runtime = require("react/jsx-runtime");
+var BaseLoading = ({
+  height,
+  width,
+  size,
+  primaryColor,
+  secondaryColor
+}) => {
+  let currentHeight;
+  let currentWidth;
+  if (size === "small") {
+    currentHeight = 18;
+    currentWidth = 18;
+  } else if (size === "medium") {
+    currentHeight = 48;
+    currentWidth = 48;
+  } else if (size === "large") {
+    currentHeight = 72;
+    currentWidth = 72;
+  } else if (size === "xlarge") {
+    currentHeight = 96;
+    currentWidth = 96;
+  } else {
+    currentHeight = height;
+    currentWidth = width;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex justify-center items-center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_react_loader_spinner.Oval,
+    {
+      height: currentHeight,
+      width: currentWidth,
+      wrapperStyle: {},
+      wrapperClass: "",
+      visible: true,
+      ariaLabel: "oval-loading",
+      color: primaryColor,
+      secondaryColor,
+      strokeWidth: 2,
+      strokeWidthSecondary: 2
+    }
+  ) });
+};
+var BaseLoading_default = BaseLoading;
+
+// src/components/images/BaseImage.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var BaseImage = (props) => {
+  const {
+    ref,
+    size,
+    className,
+    widthClassName,
+    heightClassName,
+    src,
+    alt,
+    showLoading,
+    onLoad,
+    onClick,
+    dataToolTipId,
+    dataToolTipContent,
+    dataToolTipPlace,
+    dataToolTipVariant,
+    dataToolTipHTML
+  } = props;
+  const [loading, setLoading] = (0, import_react.useState)(false);
+  const handleOnClick = (e) => {
+    e.preventDefault();
+    if (showLoading) {
+      setLoading(true);
+      onClick && onClick(e);
+      setLoading(false);
+    } else {
+      onClick && onClick(e);
+    }
+  };
+  if (!src) return null;
+  let currentClassName;
+  let currentWidthClassName;
+  let currentHeightClassName;
+  if (size === "xsmall") {
+    currentWidthClassName = "w-4";
+    currentHeightClassName = "h-4";
+  } else if (size === "small") {
+    currentWidthClassName = "w-6";
+    currentHeightClassName = "h-6";
+  } else if (size === "medium") {
+    currentWidthClassName = "w-8";
+    currentHeightClassName = "h-8";
+  } else if (size === "large") {
+    currentWidthClassName = "w-10";
+    currentHeightClassName = "h-10";
+  } else if (size === "xlarge") {
+    currentWidthClassName = "w-12";
+    currentHeightClassName = "h-12";
+  } else if (size === "2xlarge") {
+    currentWidthClassName = "w-14";
+    currentHeightClassName = "h-14";
+  } else if (size === "3xlarge") {
+    currentWidthClassName = "w-16";
+    currentHeightClassName = "h-16";
+  } else if (size === "custom") {
+    currentClassName = className;
+    currentWidthClassName = widthClassName;
+    currentHeightClassName = heightClassName;
+  }
+  return loading ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(BaseLoading_default, { size: "small", primaryColor: "#57C2D3", secondaryColor: "#57C2D3" }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "div",
+    {
+      className: `${currentWidthClassName ? currentWidthClassName : ""} ${currentHeightClassName ? currentHeightClassName : ""} ${currentClassName ? currentClassName : ""} cursor-pointer`,
+      onClick: handleOnClick,
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+        "img",
+        {
+          ref,
+          className: "w-full",
+          src,
+          alt,
+          onLoad,
+          "data-tooltip-id": dataToolTipId,
+          "data-tooltip-content": dataToolTipContent,
+          "data-tooltip-place": dataToolTipPlace,
+          "data-tooltip-variant": dataToolTipVariant,
+          "data-tooltip-html": dataToolTipHTML
+        }
+      )
+    }
+  );
+};
+var BaseImage_default = BaseImage;
+
+// src/components/buttons/PrimaryButton.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var PrimaryButton = ({
+  title,
+  size,
+  onClick,
+  disabled,
+  iconPosition,
+  textOnly,
+  iconOnly
+}) => {
+  const [loading, setLoading] = (0, import_react2.useState)(false);
+  const internalOnClick = () => __async(void 0, null, function* () {
+    if (loading) return;
+    if (disabled) return;
+    setLoading(true);
+    yield onClick();
+    setLoading(false);
+  });
+  let currentWidthClassName;
+  let currentHeightClassName;
+  let currentLoadingSize;
+  if (size === "small") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-8";
+    currentLoadingSize = 14;
+  } else if (size === "medium") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-10";
+    currentLoadingSize = 16;
+  } else if (size === "large") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-12";
+    currentLoadingSize = 18;
+  } else if (size === "unlimited") {
+    currentLoadingSize = 14;
+    currentHeightClassName = "h-8";
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "button",
+    {
+      className: `border border-catchup-blue-500 bg-catchup-blue-500 text-catchup-white rounded-catchup-button ${loading ? "" : disabled ? "opacity-50" : "hover:bg-catchup-blue-700 active:bg-catchup-blue-500"} transition duration-300 ${currentWidthClassName} ${currentHeightClassName}`,
+      onClick: internalOnClick,
+      children: loading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+        BaseLoading_default,
+        {
+          height: currentLoadingSize,
+          width: currentLoadingSize,
+          primaryColor: "#ffffff",
+          secondaryColor: "#ffffff"
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex flex-row justify-center items-center gap-x-2 px-4", children: [
+        iconPosition === "left" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          BaseImage_default,
+          {
+            src: "/icons/new/primary-button-arrow-left.png",
+            alt: "arrow-left",
+            size: "xsmall"
+          }
+        ) : null,
+        iconOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: "", children: title }),
+        textOnly || iconPosition === "left" ? null : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          BaseImage_default,
+          {
+            src: "/icons/primary-button-arrow-right.png",
+            alt: "arrow-right",
+            size: "xsmall"
+          }
+        )
+      ] })
+    }
+  );
+};
+var PrimaryButton_default = PrimaryButton;
+
+// src/components/buttons/SecondaryButton.tsx
+var import_react3 = require("react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var SecondaryButton = ({
+  title,
+  size,
+  onClick,
+  disabled,
+  iconPosition,
+  textOnly,
+  iconOnly
+}) => {
+  const [loading, setLoading] = (0, import_react3.useState)(false);
+  const [isHovered, setIsHovered] = (0, import_react3.useState)(false);
+  const internalOnClick = () => __async(void 0, null, function* () {
+    if (loading) return;
+    if (disabled) return;
+    setLoading(true);
+    yield onClick();
+    setLoading(false);
+  });
+  let currentWidthClassName;
+  let currentHeightClassName;
+  let currentLoadingSize;
+  if (size === "small") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-8";
+    currentLoadingSize = 14;
+  } else if (size === "medium") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-10";
+    currentLoadingSize = 16;
+  } else if (size === "large") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-12";
+    currentLoadingSize = 18;
+  } else if (size === "unlimited") {
+    currentLoadingSize = 14;
+    currentHeightClassName = "h-8";
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "button",
+    {
+      className: `border border-catchup-gray-400 bg-catchup-white text-catchup-gray-600 rounded-catchup-button ${loading ? "" : disabled ? "opacity-50" : "hover:bg-catchup-gray-400 hover:text-catchup-white hover:border-catchup-gray-400 active:bg-catchup-gray-500 active:border-catchup-gray-500 active:text-catchup-white"} transition duration-300 ${currentWidthClassName} ${currentHeightClassName}`,
+      onClick: internalOnClick,
+      onMouseEnter: () => {
+        setIsHovered(true);
+      },
+      onMouseLeave: () => {
+        setIsHovered(false);
+      },
+      children: loading ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        BaseLoading_default,
+        {
+          height: currentLoadingSize,
+          width: currentLoadingSize,
+          primaryColor: "#55777f",
+          secondaryColor: "#55777f"
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex flex-row justify-center items-center gap-x-2 px-4", children: [
+        iconPosition === "left" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          BaseImage_default,
+          {
+            src: "/icons/new/secondary-button-arrow-left.png",
+            alt: "arrow-left",
+            size: "xsmall"
+          }
+        ) : null,
+        iconOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "", children: title }),
+        textOnly || iconPosition === "left" ? null : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          BaseImage_default,
+          {
+            src: "/icons/secondary-button-arrow-right.png",
+            alt: "arrow-right",
+            size: "xsmall"
+          }
+        )
+      ] })
+    }
+  );
+};
+var SecondaryButton_default = SecondaryButton;
+
+// src/components/buttons/CreateButton.tsx
+var import_react4 = require("react");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var CreateButton = ({
+  title,
+  size,
+  onClick,
+  disabled,
+  iconPosition,
+  textOnly,
+  iconOnly
+}) => {
+  const [loading, setLoading] = (0, import_react4.useState)(false);
+  const internalOnClick = () => __async(void 0, null, function* () {
+    if (loading) return;
+    if (disabled) return;
+    setLoading(true);
+    yield onClick();
+    setLoading(false);
+  });
+  let currentWidthClassName;
+  let currentHeightClassName;
+  let currentLoadingSize;
+  if (size === "small") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-8";
+    currentLoadingSize = 14;
+  } else if (size === "medium") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-10";
+    currentLoadingSize = 16;
+  } else if (size === "large") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-12";
+    currentLoadingSize = 18;
+  } else if (size === "unlimited") {
+    currentLoadingSize = 14;
+    currentHeightClassName = "h-8";
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    "button",
+    {
+      className: `border border-catchup-blue-500 bg-catchup-blue-500 text-catchup-white rounded-catchup-button ${loading ? "" : disabled ? "opacity-50" : "hover:bg-catchup-blue-700 active:bg-catchup-blue-500"} transition duration-300 ${currentWidthClassName} ${currentHeightClassName}`,
+      onClick: internalOnClick,
+      children: loading ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        BaseLoading_default,
+        {
+          height: currentLoadingSize,
+          width: currentLoadingSize,
+          primaryColor: "#ffffff",
+          secondaryColor: "#ffffff"
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex flex-row justify-center items-center gap-x-2 px-4", children: [
+        iconPosition === "left" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          BaseImage_default,
+          {
+            src: "/icons/primary-button-create-white.png",
+            alt: "create",
+            size: "xsmall"
+          }
+        ) : null,
+        iconOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "", children: title }),
+        textOnly || iconPosition === "left" ? null : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          BaseImage_default,
+          {
+            src: "/icons/primary-button-create-white.png",
+            alt: "create",
+            size: "xsmall"
+          }
+        )
+      ] })
+    }
+  );
+};
+var CreateButton_default = CreateButton;
+
+// src/components/buttons/DeleteButton.tsx
+var import_react5 = require("react");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var DeleteButton = ({
+  title,
+  size,
+  onClick,
+  disabled,
+  iconPosition,
+  textOnly,
+  iconOnly
+}) => {
+  const [loading, setLoading] = (0, import_react5.useState)(false);
+  const [isHovered, setIsHovered] = (0, import_react5.useState)(false);
+  const internalOnClick = () => __async(void 0, null, function* () {
+    if (loading) return;
+    if (disabled) return;
+    setLoading(true);
+    yield onClick();
+    setLoading(false);
+  });
+  let currentWidthClassName;
+  let currentHeightClassName;
+  let currentLoadingSize;
+  if (size === "small") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-8";
+    currentLoadingSize = 14;
+  } else if (size === "medium") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-10";
+    currentLoadingSize = 16;
+  } else if (size === "large") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-12";
+    currentLoadingSize = 18;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    "button",
+    {
+      className: `border border-catchup-red bg-catchup-white text-catchup-red rounded-catchup-button ${loading ? "" : disabled ? "opacity-50" : "hover:bg-catchup-red hover:text-catchup-white hover:border-catchup-red active:bg-catchup-red active:hover:border-catchup-red active:text-catchup-white active:opacity-80"} transition duration-300 ${currentWidthClassName} ${currentHeightClassName}`,
+      onClick: internalOnClick,
+      onMouseEnter: () => {
+        setIsHovered(true);
+      },
+      onMouseLeave: () => {
+        setIsHovered(false);
+      },
+      children: loading ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        BaseLoading_default,
+        {
+          height: currentLoadingSize,
+          width: currentLoadingSize,
+          primaryColor: "#55777f",
+          secondaryColor: "#55777f"
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex flex-row justify-center items-center gap-x-2", children: [
+        iconPosition === "left" ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          BaseImage_default,
+          {
+            src: `${isHovered ? "/icons/remove-white.png" : "/icons/remove-red.png"}`,
+            alt: "remove-white",
+            size: "xsmall"
+          }
+        ) : null,
+        iconOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "", children: title }),
+        textOnly || iconPosition === "left" ? null : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          BaseImage_default,
+          {
+            src: `${isHovered ? "/icons/remove-white.png" : "/icons/remove-red.png"}`,
+            alt: "remove-white",
+            size: "xsmall"
+          }
+        )
+      ] })
+    }
+  );
+};
+var DeleteButton_default = DeleteButton;
+
+// src/components/buttons/CancelButton.tsx
+var import_react6 = require("react");
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var CancelButton = ({
+  title,
+  size,
+  onClick,
+  disabled,
+  iconPosition,
+  textOnly,
+  iconOnly
+}) => {
+  const [loading, setLoading] = (0, import_react6.useState)(false);
+  const [isHovered, setIsHovered] = (0, import_react6.useState)(false);
+  const internalOnClick = () => __async(void 0, null, function* () {
+    if (loading) return;
+    if (disabled) return;
+    setLoading(true);
+    yield onClick();
+    setLoading(false);
+  });
+  let currentWidthClassName;
+  let currentHeightClassName;
+  let currentLoadingSize;
+  if (size === "small") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-8";
+    currentLoadingSize = 14;
+  } else if (size === "medium") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-10";
+    currentLoadingSize = 16;
+  } else if (size === "large") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-12";
+    currentLoadingSize = 18;
+  } else if (size === "unlimited") {
+    currentLoadingSize = 14;
+    currentHeightClassName = "h-8";
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    "button",
+    {
+      className: `border border-catchup-gray-400 bg-catchup-white text-catchup-gray-600 rounded-catchup-button ${loading ? "" : disabled ? "opacity-50" : "hover:bg-catchup-gray-400 hover:text-catchup-white hover:border-catchup-gray-400 active:bg-catchup-gray-500 active:border-catchup-gray-500 active:text-catchup-white"} transition duration-300 ${currentWidthClassName} ${currentHeightClassName}`,
+      onClick: internalOnClick,
+      onMouseEnter: () => {
+        setIsHovered(true);
+      },
+      onMouseLeave: () => {
+        setIsHovered(false);
+      },
+      children: loading ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        BaseLoading_default,
+        {
+          height: currentLoadingSize,
+          width: currentLoadingSize,
+          primaryColor: "#55777f",
+          secondaryColor: "#55777f"
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex flex-row justify-center items-center gap-x-2", children: [
+        iconPosition === "left" ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          BaseImage_default,
+          {
+            src: `${isHovered ? "/icons/cancel-button-arrow-left-white.png" : "/icons/cancel-button-arrow-left.png"}`,
+            alt: "arrow-left",
+            size: "xsmall"
+          }
+        ) : null,
+        iconOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "", children: title }),
+        textOnly || iconPosition === "left" ? null : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          BaseImage_default,
+          {
+            src: `${isHovered ? "/icons/cancel-button-arrow-left-white.png" : "/icons/cancel-button-arrow-left.png"}`,
+            alt: "arrow-left",
+            size: "xsmall"
+          }
+        )
+      ] })
+    }
+  );
+};
+var CancelButton_default = CancelButton;
+
+// src/components/buttons/ApproveButton.tsx
+var import_react7 = require("react");
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var ApproveButton = ({
+  title,
+  size,
+  onClick,
+  disabled,
+  iconPosition,
+  textOnly,
+  iconOnly
+}) => {
+  const [loading, setLoading] = (0, import_react7.useState)(false);
+  const internalOnClick = () => __async(void 0, null, function* () {
+    if (loading) return;
+    if (disabled) return;
+    setLoading(true);
+    yield onClick();
+    setLoading(false);
+  });
+  let currentWidthClassName;
+  let currentHeightClassName;
+  let currentLoadingSize;
+  if (size === "small") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-8";
+    currentLoadingSize = 14;
+  } else if (size === "medium") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-10";
+    currentLoadingSize = 16;
+  } else if (size === "large") {
+    currentWidthClassName = "w-32";
+    currentHeightClassName = "h-12";
+    currentLoadingSize = 18;
+  } else if (size === "unlimited") {
+    currentLoadingSize = 14;
+    currentHeightClassName = "h-8";
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    "button",
+    {
+      className: `border border-catchup-green bg-catchup-green text-catchup-white rounded-catchup-button ${loading ? "" : disabled ? "opacity-50" : "hover:bg-catchup-hover-green active:bg-catchup-green"} transition duration-300 ${currentWidthClassName} ${currentHeightClassName}`,
+      onClick: internalOnClick,
+      children: loading ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        BaseLoading_default,
+        {
+          height: currentLoadingSize,
+          width: currentLoadingSize,
+          primaryColor: "#ffffff",
+          secondaryColor: "#ffffff"
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex flex-row justify-center items-center gap-x-2 px-4", children: [
+        iconPosition === "left" ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+          BaseImage_default,
+          {
+            src: "/icons/primary-button-arrow-left.png",
+            alt: "arrow-left",
+            size: "xsmall"
+          }
+        ) : null,
+        iconOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "", children: title }),
+        textOnly || iconPosition === "left" ? null : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+          BaseImage_default,
+          {
+            src: "/icons/primary-button-arrow-right.png",
+            alt: "arrow-right",
+            size: "xsmall"
+          }
+        )
+      ] })
+    }
+  );
+};
+var ApproveButton_default = ApproveButton;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ApproveButton,
+  BaseImage,
+  BaseLoading,
+  CancelButton,
+  CreateButton,
+  DeleteButton,
+  PrimaryButton,
+  SecondaryButton
+});