@amateescu/portal-ui-components 0.0.7 → 0.0.9-beta0

package/dist/VModalIcon-D7L4bQLO.js

@@ -0,0 +1,5 @@
+import * as e from "react";
+const o = (t) => /* @__PURE__ */ e.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.createElement("path", { d: "M5 13L9 17L19 7", stroke: "#12121A", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round" }));
+export {
+  o as S
+};

package/dist/assets/index2.css

@@ -1 +1 @@
-._kpiCard_aruiy_1{height:147px;background-color:#f0f0f0;border-radius:8px}._width430_aruiy_7{width:430px}@media (max-width: 1500px){._width430_aruiy_7{width:200px}}._width384_aruiy_16{width:384px}._flexCol_aruiy_20{display:flex;flex-direction:column}._flexRow_aruiy_25{display:flex;flex-direction:row}._title_aruiy_30{font-size:32px;font-weight:500;color:#12121a}@media (max-width: 900px){._title_aruiy_30{font-size:12px}}@media (max-width: 1100px){._title_aruiy_30{font-size:16px}}@media (max-width: 1400px){._title_aruiy_30{font-size:20px}}@media (max-width: 1600px){._title_aruiy_30{font-size:22px}}._content_aruiy_56{font-size:21px;font-weight:400;color:#626367;margin-top:-10px}@media (max-width: 900px){._content_aruiy_56{font-size:8px}}@media (max-width: 1100px){._content_aruiy_56{font-size:12px}}@media (max-width: 1400px){._content_aruiy_56{font-size:14px}}
+._flexRowCenter_14ewh_1{display:flex!important;flex-direction:row;align-items:center}html[dir=rtl] ._mr10_14ewh_7{margin-right:10px}html[dir=ltr] ._mr10_14ewh_7{margin-left:10px}._text18_14ewh_15{font-size:18px}._content_14ewh_19{position:relative;top:-10px}

package/dist/assets/index3.css

@@ -1 +1 @@
-._flexRowCenter_14ewh_1{display:flex!important;flex-direction:row;align-items:center}html[dir=rtl] ._mr10_14ewh_7{margin-right:10px}html[dir=ltr] ._mr10_14ewh_7{margin-left:10px}._text18_14ewh_15{font-size:18px}._content_14ewh_19{position:relative;top:-10px}
+._kpiCard_aruiy_1{height:147px;background-color:#f0f0f0;border-radius:8px}._width430_aruiy_7{width:430px}@media (max-width: 1500px){._width430_aruiy_7{width:200px}}._width384_aruiy_16{width:384px}._flexCol_aruiy_20{display:flex;flex-direction:column}._flexRow_aruiy_25{display:flex;flex-direction:row}._title_aruiy_30{font-size:32px;font-weight:500;color:#12121a}@media (max-width: 900px){._title_aruiy_30{font-size:12px}}@media (max-width: 1100px){._title_aruiy_30{font-size:16px}}@media (max-width: 1400px){._title_aruiy_30{font-size:20px}}@media (max-width: 1600px){._title_aruiy_30{font-size:22px}}._content_aruiy_56{font-size:21px;font-weight:400;color:#626367;margin-top:-10px}@media (max-width: 900px){._content_aruiy_56{font-size:8px}}@media (max-width: 1100px){._content_aruiy_56{font-size:12px}}@media (max-width: 1400px){._content_aruiy_56{font-size:14px}}

package/dist/components/ConfirmationModal/ConfirmationModal.d.ts

@@ -0,0 +1,2 @@
+import { default as ConfirmationModalProps } from './ConfirmationModal.types';
+export declare function ConfirmationModal({ modalOpen, contentText, setModalOpen, commandOnOk, title, approve, cancel }: ConfirmationModalProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ConfirmationModal/ConfirmationModal.js

@@ -0,0 +1,50 @@
+import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import * as o from "react";
+import { S as m } from "../../VModalIcon-D7L4bQLO.js";
+import { M as d } from "../../index-BczMuCik.js";
+import '../../assets/index2.css';const w = (n) => /* @__PURE__ */ o.createElement("svg", { width: 20, height: 20, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...n }, /* @__PURE__ */ o.createElement("path", { d: "M7 10L9 12L13 8M19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10Z", stroke: "#045529", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round" })), p = (n) => /* @__PURE__ */ o.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...n }, /* @__PURE__ */ o.createElement("path", { d: "M6 18L18 6M6 6L18 18", stroke: "#045529", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round" })), x = "_flexRowCenter_14ewh_1", f = "_mr10_14ewh_7", C = "_text18_14ewh_15", k = "_content_14ewh_19", t = {
+  flexRowCenter: x,
+  mr10: f,
+  text18: C,
+  content: k
+};
+function v({ modalOpen: n, contentText: c, setModalOpen: s, commandOnOk: l, title: a, approve: i, cancel: h }) {
+  return /* @__PURE__ */ e(
+    d,
+    {
+      title: /* @__PURE__ */ r("span", { className: t.flexRowCenter, children: [
+        /* @__PURE__ */ e(w, { className: t.mr10 }),
+        /* @__PURE__ */ e("p", { className: t.text18, children: a })
+      ] }),
+      centered: !0,
+      open: n,
+      onOk: () => {
+        l(), s(!1);
+      },
+      onCancel: () => s(!1),
+      closeIcon: !1,
+      okText: /* @__PURE__ */ r("span", { className: t.flexRowCenter, children: [
+        /* @__PURE__ */ e(m, {}),
+        /* @__PURE__ */ e("span", { children: i })
+      ] }),
+      okButtonProps: {
+        style: {
+          backgroundColor: "#05A952"
+        }
+      },
+      cancelButtonProps: {
+        style: {
+          borderColor: "#05A952"
+        }
+      },
+      cancelText: /* @__PURE__ */ r("span", { className: t.flexRowCenter, children: [
+        /* @__PURE__ */ e(p, {}),
+        /* @__PURE__ */ e("span", { children: h })
+      ] }),
+      children: /* @__PURE__ */ e("p", { className: t.content, children: c })
+    }
+  );
+}
+export {
+  v as ConfirmationModal
+};

package/dist/components/ConfirmationModal/ConfirmationModal.types.d.ts

@@ -0,0 +1,11 @@
+import { Dispatch, SetStateAction } from 'react';
+interface ConfirmationModalProps {
+    modalOpen: boolean;
+    contentText: string;
+    setModalOpen: Dispatch<SetStateAction<boolean>>;
+    commandOnOk: () => void | void;
+    title: string;
+    approve: string;
+    cancel: string;
+}
+export default ConfirmationModalProps;

package/dist/components/CustomButton/index.js

@@ -1,19 +1,369 @@
-import { jsx as i } from "react/jsx-runtime";
-import { B as a } from "../../Button-BgbkoKxR.js";
-const d = ({ content: o, height: r = "40px", width: t = "120px", direction: n = "left", ...e }) => /* @__PURE__ */ i(
-  a,
+import { jsx as f, jsxs as D } from "react/jsx-runtime";
+import { _ as F, a as t } from "../../objectWithoutPropertiesLoose-CIT-1_kH.js";
+import * as p from "react";
+import { g as G, a as U, r as A, u as H, c as r, b as q, s as y, d as J, e as v, f as E, P as a } from "../../generateUtilityClasses-CBdP3bZj.js";
+import { B as K } from "../../ButtonBase-Dv90LYxj.js";
+function Q(o) {
+  return G("MuiButton", o);
+}
+const b = U("MuiButton", ["root", "text", "textInherit", "textPrimary", "textSecondary", "textSuccess", "textError", "textInfo", "textWarning", "outlined", "outlinedInherit", "outlinedPrimary", "outlinedSecondary", "outlinedSuccess", "outlinedError", "outlinedInfo", "outlinedWarning", "contained", "containedInherit", "containedPrimary", "containedSecondary", "containedSuccess", "containedError", "containedInfo", "containedWarning", "disableElevation", "focusVisible", "disabled", "colorInherit", "colorPrimary", "colorSecondary", "colorSuccess", "colorError", "colorInfo", "colorWarning", "textSizeSmall", "textSizeMedium", "textSizeLarge", "outlinedSizeSmall", "outlinedSizeMedium", "outlinedSizeLarge", "containedSizeSmall", "containedSizeMedium", "containedSizeLarge", "sizeMedium", "sizeSmall", "sizeLarge", "fullWidth", "startIcon", "endIcon", "icon", "iconSizeSmall", "iconSizeMedium", "iconSizeLarge"]), R = /* @__PURE__ */ p.createContext({});
+process.env.NODE_ENV !== "production" && (R.displayName = "ButtonGroupContext");
+const h = /* @__PURE__ */ p.createContext(void 0);
+process.env.NODE_ENV !== "production" && (h.displayName = "ButtonGroupButtonContext");
+const X = ["children", "color", "component", "className", "disabled", "disableElevation", "disableFocusRipple", "endIcon", "focusVisibleClassName", "fullWidth", "size", "startIcon", "type", "variant"], Y = (o) => {
+  const {
+    color: n,
+    disableElevation: i,
+    fullWidth: e,
+    size: s,
+    variant: l,
+    classes: c
+  } = o, x = {
+    root: ["root", l, `${l}${r(n)}`, `size${r(s)}`, `${l}Size${r(s)}`, `color${r(n)}`, i && "disableElevation", e && "fullWidth"],
+    label: ["label"],
+    startIcon: ["icon", "startIcon", `iconSize${r(s)}`],
+    endIcon: ["icon", "endIcon", `iconSize${r(s)}`]
+  }, g = q(x, Q, c);
+  return t({}, c, g);
+}, N = (o) => t({}, o.size === "small" && {
+  "& > *:nth-of-type(1)": {
+    fontSize: 18
+  }
+}, o.size === "medium" && {
+  "& > *:nth-of-type(1)": {
+    fontSize: 20
+  }
+}, o.size === "large" && {
+  "& > *:nth-of-type(1)": {
+    fontSize: 22
+  }
+}), Z = y(K, {
+  shouldForwardProp: (o) => J(o) || o === "classes",
+  name: "MuiButton",
+  slot: "Root",
+  overridesResolver: (o, n) => {
+    const {
+      ownerState: i
+    } = o;
+    return [n.root, n[i.variant], n[`${i.variant}${r(i.color)}`], n[`size${r(i.size)}`], n[`${i.variant}Size${r(i.size)}`], i.color === "inherit" && n.colorInherit, i.disableElevation && n.disableElevation, i.fullWidth && n.fullWidth];
+  }
+})(({
+  theme: o,
+  ownerState: n
+}) => {
+  var i, e;
+  const s = o.palette.mode === "light" ? o.palette.grey[300] : o.palette.grey[800], l = o.palette.mode === "light" ? o.palette.grey.A100 : o.palette.grey[700];
+  return t({}, o.typography.button, {
+    minWidth: 64,
+    padding: "6px 16px",
+    borderRadius: (o.vars || o).shape.borderRadius,
+    transition: o.transitions.create(["background-color", "box-shadow", "border-color", "color"], {
+      duration: o.transitions.duration.short
+    }),
+    "&:hover": t({
+      textDecoration: "none",
+      backgroundColor: o.vars ? `rgba(${o.vars.palette.text.primaryChannel} / ${o.vars.palette.action.hoverOpacity})` : v(o.palette.text.primary, o.palette.action.hoverOpacity),
+      // Reset on touch devices, it doesn't add specificity
+      "@media (hover: none)": {
+        backgroundColor: "transparent"
+      }
+    }, n.variant === "text" && n.color !== "inherit" && {
+      backgroundColor: o.vars ? `rgba(${o.vars.palette[n.color].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : v(o.palette[n.color].main, o.palette.action.hoverOpacity),
+      // Reset on touch devices, it doesn't add specificity
+      "@media (hover: none)": {
+        backgroundColor: "transparent"
+      }
+    }, n.variant === "outlined" && n.color !== "inherit" && {
+      border: `1px solid ${(o.vars || o).palette[n.color].main}`,
+      backgroundColor: o.vars ? `rgba(${o.vars.palette[n.color].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : v(o.palette[n.color].main, o.palette.action.hoverOpacity),
+      // Reset on touch devices, it doesn't add specificity
+      "@media (hover: none)": {
+        backgroundColor: "transparent"
+      }
+    }, n.variant === "contained" && {
+      backgroundColor: o.vars ? o.vars.palette.Button.inheritContainedHoverBg : l,
+      boxShadow: (o.vars || o).shadows[4],
+      // Reset on touch devices, it doesn't add specificity
+      "@media (hover: none)": {
+        boxShadow: (o.vars || o).shadows[2],
+        backgroundColor: (o.vars || o).palette.grey[300]
+      }
+    }, n.variant === "contained" && n.color !== "inherit" && {
+      backgroundColor: (o.vars || o).palette[n.color].dark,
+      // Reset on touch devices, it doesn't add specificity
+      "@media (hover: none)": {
+        backgroundColor: (o.vars || o).palette[n.color].main
+      }
+    }),
+    "&:active": t({}, n.variant === "contained" && {
+      boxShadow: (o.vars || o).shadows[8]
+    }),
+    [`&.${b.focusVisible}`]: t({}, n.variant === "contained" && {
+      boxShadow: (o.vars || o).shadows[6]
+    }),
+    [`&.${b.disabled}`]: t({
+      color: (o.vars || o).palette.action.disabled
+    }, n.variant === "outlined" && {
+      border: `1px solid ${(o.vars || o).palette.action.disabledBackground}`
+    }, n.variant === "contained" && {
+      color: (o.vars || o).palette.action.disabled,
+      boxShadow: (o.vars || o).shadows[0],
+      backgroundColor: (o.vars || o).palette.action.disabledBackground
+    })
+  }, n.variant === "text" && {
+    padding: "6px 8px"
+  }, n.variant === "text" && n.color !== "inherit" && {
+    color: (o.vars || o).palette[n.color].main
+  }, n.variant === "outlined" && {
+    padding: "5px 15px",
+    border: "1px solid currentColor"
+  }, n.variant === "outlined" && n.color !== "inherit" && {
+    color: (o.vars || o).palette[n.color].main,
+    border: o.vars ? `1px solid rgba(${o.vars.palette[n.color].mainChannel} / 0.5)` : `1px solid ${v(o.palette[n.color].main, 0.5)}`
+  }, n.variant === "contained" && {
+    color: o.vars ? (
+      // this is safe because grey does not change between default light/dark mode
+      o.vars.palette.text.primary
+    ) : (i = (e = o.palette).getContrastText) == null ? void 0 : i.call(e, o.palette.grey[300]),
+    backgroundColor: o.vars ? o.vars.palette.Button.inheritContainedBg : s,
+    boxShadow: (o.vars || o).shadows[2]
+  }, n.variant === "contained" && n.color !== "inherit" && {
+    color: (o.vars || o).palette[n.color].contrastText,
+    backgroundColor: (o.vars || o).palette[n.color].main
+  }, n.color === "inherit" && {
+    color: "inherit",
+    borderColor: "currentColor"
+  }, n.size === "small" && n.variant === "text" && {
+    padding: "4px 5px",
+    fontSize: o.typography.pxToRem(13)
+  }, n.size === "large" && n.variant === "text" && {
+    padding: "8px 11px",
+    fontSize: o.typography.pxToRem(15)
+  }, n.size === "small" && n.variant === "outlined" && {
+    padding: "3px 9px",
+    fontSize: o.typography.pxToRem(13)
+  }, n.size === "large" && n.variant === "outlined" && {
+    padding: "7px 21px",
+    fontSize: o.typography.pxToRem(15)
+  }, n.size === "small" && n.variant === "contained" && {
+    padding: "4px 10px",
+    fontSize: o.typography.pxToRem(13)
+  }, n.size === "large" && n.variant === "contained" && {
+    padding: "8px 22px",
+    fontSize: o.typography.pxToRem(15)
+  }, n.fullWidth && {
+    width: "100%"
+  });
+}, ({
+  ownerState: o
+}) => o.disableElevation && {
+  boxShadow: "none",
+  "&:hover": {
+    boxShadow: "none"
+  },
+  [`&.${b.focusVisible}`]: {
+    boxShadow: "none"
+  },
+  "&:active": {
+    boxShadow: "none"
+  },
+  [`&.${b.disabled}`]: {
+    boxShadow: "none"
+  }
+}), w = y("span", {
+  name: "MuiButton",
+  slot: "StartIcon",
+  overridesResolver: (o, n) => {
+    const {
+      ownerState: i
+    } = o;
+    return [n.startIcon, n[`iconSize${r(i.size)}`]];
+  }
+})(({
+  ownerState: o
+}) => t({
+  display: "inherit",
+  marginRight: 8,
+  marginLeft: -4
+}, o.size === "small" && {
+  marginLeft: -2
+}, N(o))), oo = y("span", {
+  name: "MuiButton",
+  slot: "EndIcon",
+  overridesResolver: (o, n) => {
+    const {
+      ownerState: i
+    } = o;
+    return [n.endIcon, n[`iconSize${r(i.size)}`]];
+  }
+})(({
+  ownerState: o
+}) => t({
+  display: "inherit",
+  marginRight: -4,
+  marginLeft: 8
+}, o.size === "small" && {
+  marginRight: -2
+}, N(o))), O = /* @__PURE__ */ p.forwardRef(function(n, i) {
+  const e = p.useContext(R), s = p.useContext(h), l = A(e, n), c = H({
+    props: l,
+    name: "MuiButton"
+  }), {
+    children: x,
+    color: g = "primary",
+    component: z = "button",
+    className: k,
+    disabled: C = !1,
+    disableElevation: T = !1,
+    disableFocusRipple: I = !1,
+    endIcon: B,
+    focusVisibleClassName: P,
+    fullWidth: W = !1,
+    size: S = "medium",
+    startIcon: $,
+    type: m,
+    variant: M = "text"
+  } = c, V = F(c, X), u = t({}, c, {
+    color: g,
+    component: z,
+    disabled: C,
+    disableElevation: T,
+    disableFocusRipple: I,
+    fullWidth: W,
+    size: S,
+    type: m,
+    variant: M
+  }), d = Y(u), _ = $ && /* @__PURE__ */ f(w, {
+    className: d.startIcon,
+    ownerState: u,
+    children: $
+  }), L = B && /* @__PURE__ */ f(oo, {
+    className: d.endIcon,
+    ownerState: u,
+    children: B
+  }), j = s || "";
+  return /* @__PURE__ */ D(Z, t({
+    ownerState: u,
+    className: E(e.className, d.root, k, j),
+    component: z,
+    disabled: C,
+    focusRipple: !I,
+    focusVisibleClassName: E(d.focusVisible, P),
+    ref: i,
+    type: m
+  }, V, {
+    classes: d,
+    children: [_, x, L]
+  }));
+});
+process.env.NODE_ENV !== "production" && (O.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: a.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: a.object,
+  /**
+   * @ignore
+   */
+  className: a.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'primary'
+   */
+  color: a.oneOfType([a.oneOf(["inherit", "primary", "secondary", "success", "error", "info", "warning"]), a.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: a.elementType,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: a.bool,
+  /**
+   * If `true`, no elevation is used.
+   * @default false
+   */
+  disableElevation: a.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: a.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   *
+   * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
+   * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
+   * @default false
+   */
+  disableRipple: a.bool,
+  /**
+   * Element placed after the children.
+   */
+  endIcon: a.node,
+  /**
+   * @ignore
+   */
+  focusVisibleClassName: a.string,
+  /**
+   * If `true`, the button will take up the full width of its container.
+   * @default false
+   */
+  fullWidth: a.bool,
+  /**
+   * The URL to link to when the button is clicked.
+   * If defined, an `a` element will be used as the root node.
+   */
+  href: a.string,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense button styling.
+   * @default 'medium'
+   */
+  size: a.oneOfType([a.oneOf(["small", "medium", "large"]), a.string]),
+  /**
+   * Element placed before the children.
+   */
+  startIcon: a.node,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: a.oneOfType([a.arrayOf(a.oneOfType([a.func, a.object, a.bool])), a.func, a.object]),
+  /**
+   * @ignore
+   */
+  type: a.oneOfType([a.oneOf(["button", "reset", "submit"]), a.string]),
+  /**
+   * The variant to use.
+   * @default 'text'
+   */
+  variant: a.oneOfType([a.oneOf(["contained", "outlined", "text"]), a.string])
+});
+const to = ({ content: o, height: n = "40px", width: i = "120px", direction: e = "left", ...s }) => /* @__PURE__ */ f(
+  O,
   {
     variant: "outlined",
     disableElevation: !0,
     color: "primary",
     sx: {
-      float: n,
-      height: r,
+      float: e,
+      height: n,
       borderRadius: 2,
       border: "1px solid #E0E0E0",
       color: "#48464A",
       fontWeight: "400",
-      width: t,
+      width: i,
       textTransform: "none",
       // '& .MuiButton-endIcon': {
       //   marginInlineStart: '10px',
@@ -26,10 +376,10 @@ const d = ({ content: o, height: r = "40px", width: t = "120px", direction: n =
         border: "1px solid #E0E0E0"
       }
     },
-    ...e,
+    ...s,
     children: o
   }
 );
 export {
-  d as CustomButton
+  to as CustomButton
 };

package/dist/components/CustomPagination/CustomPagination.d.ts

@@ -0,0 +1,11 @@
+import { default as CustomSvg } from '../../types/CustomSvg';
+type ExternalPaginationProps = {
+    isRtl: boolean;
+    pageCount: number;
+    arrowFirstIcon: CustomSvg;
+    arrowLastIcon: CustomSvg;
+    nextIcon: CustomSvg;
+    previousIcon: CustomSvg;
+};
+export declare function CustomPagination({ isRtl, pageCount, arrowFirstIcon, arrowLastIcon, nextIcon, previousIcon }: ExternalPaginationProps): import("react/jsx-runtime").JSX.Element;
+export {};