@ukpc-lib/react 0.2.8 → 0.2.11

package/web-components-bundle/global-topbar/index.js

@@ -1,236 +1,5 @@
-import { j as e, s as u, r as a, S as j, L as k } from "../react-to-web-component-8933be15.js";
-function m({ primaryColor: r = "#009d4f" }) {
-  return /* @__PURE__ */ e.jsxs(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "24",
-      height: "25",
-      viewBox: "0 0 24 25",
-      fill: "none",
-      children: [
-        /* @__PURE__ */ e.jsx(
-          "path",
-          {
-            d: "M8.5 19.5H8C4 19.5 2 18.5 2 13.5V8.5C2 4.5 4 2.5 8 2.5H16C20 2.5 22 4.5 22 8.5V13.5C22 17.5 20 19.5 16 19.5H15.5C15.19 19.5 14.89 19.65 14.7 19.9L13.2 21.9C12.54 22.78 11.46 22.78 10.8 21.9L9.3 19.9C9.14 19.68 8.77 19.5 8.5 19.5Z",
-            stroke: r,
-            "stroke-width": "1.5",
-            "stroke-miterlimit": "10",
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round"
-          }
-        ),
-        /* @__PURE__ */ e.jsx(
-          "path",
-          {
-            d: "M15.9965 11.5H16.0054",
-            stroke: r,
-            "stroke-width": "2",
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round"
-          }
-        ),
-        /* @__PURE__ */ e.jsx(
-          "path",
-          {
-            d: "M11.9955 11.5H12.0045",
-            stroke: r,
-            "stroke-width": "2",
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round"
-          }
-        ),
-        /* @__PURE__ */ e.jsx(
-          "path",
-          {
-            d: "M7.99451 11.5H8.00349",
-            stroke: r,
-            "stroke-width": "2",
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round"
-          }
-        )
-      ]
-    }
-  );
-}
-function b({
-  primaryColor: r = "#009d4f"
-}) {
-  return /* @__PURE__ */ e.jsxs(
-    "svg",
-    {
-      width: "24",
-      height: "25",
-      viewBox: "0 0 24 25",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      children: [
-        /* @__PURE__ */ e.jsx(
-          "path",
-          {
-            fillRule: "evenodd",
-            clipRule: "evenodd",
-            d: "M11.7968 17.4705C16.5901 17.4705 18.8076 16.8556 19.0218 14.3874C19.0218 11.921 17.4757 12.0796 17.4757 9.05334C17.4757 6.68952 15.2352 4 11.7968 4C8.35833 4 6.1178 6.68952 6.1178 9.05334C6.1178 12.0796 4.57178 11.921 4.57178 14.3874C4.78679 16.8649 7.00428 17.4705 11.7968 17.4705Z",
-            stroke: r,
-            strokeWidth: "1.5",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
-          }
-        ),
-        /* @__PURE__ */ e.jsx(
-          "path",
-          {
-            d: "M13.8274 20.0286C12.6679 21.3161 10.8591 21.3313 9.68848 20.0286",
-            stroke: r,
-            strokeWidth: "1.5",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
-          }
-        ),
-        /* @__PURE__ */ e.jsx("circle", { cx: "16.928", cy: "7", r: "2", fill: "#E01B00", stroke: r })
-      ]
-    }
-  );
-}
-const y = `.avatar-dropdown-item{padding:.5rem;font-size:.875rem;line-height:1.25rem;cursor:pointer;border-radius:.25rem}.avartarDropdownMenu{background-color:#fff;padding:.5rem;width:13rem;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);position:absolute;left:-10rem;top:3.2rem}.avartarDropdownMenu ul{list-style:none;padding-inline-start:0;margin-block-end:0}.navbar{position:fixed;display:flex;z-index:30;background:black;top:0;width:100%;padding-left:2.5rem;height:64px}.navbar-container{display:flex;flex-direction:row;align-items:center;width:100%;justify-content:space-between}.logo-container{padding:16px 0;height:100%}.right-side-container{display:flex;flex-direction:row;align-items:center;text-align:center;margin-right:2.5rem;gap:1rem}.userContainer{display:flex;align-items:center;gap:.5rem}.userFullName{color:#fff;font-weight:400;font-size:.875rem;line-height:1.25rem}.userAvatar{width:2.5rem;height:2.5rem;cursor:pointer;-o-object-fit:cover;object-fit:cover;border-radius:9999px;border:2px solid #FFFFFF}.userAvatarNull{width:2.5rem;height:2.5rem;background:#DDDDDD;border-radius:100%;color:#fff;font-size:20px;font-weight:400;display:flex;align-items:center;justify-content:center}.relative{position:relative}.cursor-pointer{cursor:pointer}
-`;
-function N({
-  logo: r,
-  user: t,
-  baseUrl: c,
-  style: o,
-  classNames: s = "",
-  customColors: n
-}) {
-  const i = r || "/public/assets/icons/logo-header.png", l = {
-    ...o,
-    color: (n == null ? void 0 : n.color) || "black",
-    backgroundColor: (n == null ? void 0 : n.bgColor) || "black"
-  }, [p, d] = a.useState(!1), h = () => {
-    window.location.href = `${c}/authentication/logout?callbackUrl=${window.location.href}`;
-  };
-  return /* @__PURE__ */ e.jsxs(j, { styles: [y], style: { zIndex: 1202 }, children: [
-    /* @__PURE__ */ e.jsx(
-      "nav",
-      {
-        className: `navbar ${s}`,
-        style: n ? l : o,
-        children: /* @__PURE__ */ e.jsxs("div", { className: "navbar-container", children: [
-          /* @__PURE__ */ e.jsx("div", { className: "logo-container", children: /* @__PURE__ */ e.jsx("img", { src: i, alt: "logo-header" }) }),
-          /* @__PURE__ */ e.jsxs("div", { className: "right-side-container", children: [
-            /* @__PURE__ */ e.jsx("span", { className: "cursor-pointer", children: /* @__PURE__ */ e.jsx(b, { primaryColor: n == null ? void 0 : n.primaryColor }) }),
-            /* @__PURE__ */ e.jsx("span", { className: "cursor-pointer", children: /* @__PURE__ */ e.jsx(m, { primaryColor: n == null ? void 0 : n.primaryColor }) }),
-            /* @__PURE__ */ e.jsxs("div", { className: "userContainer", children: [
-              /* @__PURE__ */ e.jsx(
-                L,
-                {
-                  primaryColor: n == null ? void 0 : n.primaryColor,
-                  avatarUrl: t == null ? void 0 : t.avatarUrl,
-                  userName: t == null ? void 0 : t.firstName,
-                  setShowConfirmModal: d
-                }
-              ),
-              /* @__PURE__ */ e.jsx("p", { className: "userFullName", children: `${(t == null ? void 0 : t.firstName) || "Unknown"} ${(t == null ? void 0 : t.lastName) || "User"}` })
-            ] })
-          ] })
-        ] })
-      }
-    ),
-    /* @__PURE__ */ e.jsx(
-      k,
-      {
-        isOpen: p,
-        onClose: () => d(!1),
-        onConfirm: h
-      }
-    )
-  ] });
-}
-function L({
-  avatarUrl: r,
-  userName: t,
-  setShowConfirmModal: c,
-  primaryColor: o = "#009d4f"
-}) {
-  const [s, n] = a.useState(!1), i = a.useRef(null), l = a.useRef(null), [p, d] = a.useState(!1), [h, f] = a.useState(!1), w = {
-    backgroundColor: p ? o : "transparent"
-  }, v = {
-    backgroundColor: h ? o : "transparent"
-  };
-  return a.useEffect(() => {
-    const x = (g) => {
-      i.current && !i.current.contains(g.target) && n(!1), l.current && !l.current.contains(g.target) && n(!1);
-    };
-    return document.addEventListener("click", x, !0), () => {
-      document.removeEventListener("click", x, !0);
-    };
-  }, [i]), /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsxs("div", { style: { position: "relative" }, children: [
-    r ? /* @__PURE__ */ e.jsx(
-      "img",
-      {
-        onClick: () => n(!s),
-        ref: i,
-        alt: "user avatar",
-        className: "userAvatar",
-        src: r
-      }
-    ) : /* @__PURE__ */ e.jsx(
-      "div",
-      {
-        onClick: () => n(!s),
-        ref: i,
-        className: "userAvatarNull",
-        children: (t == null ? void 0 : t.charAt(0)) ?? ""
-      }
-    ),
-    /* @__PURE__ */ e.jsx(
-      "div",
-      {
-        style: { display: s ? "block" : "none" },
-        className: "avartarDropdownMenu",
-        ref: l,
-        children: /* @__PURE__ */ e.jsxs("ul", { children: [
-          /* @__PURE__ */ e.jsx(
-            "li",
-            {
-              onMouseEnter: () => f(!0),
-              onMouseLeave: () => f(!1),
-              style: v,
-              className: "avatar-dropdown-item",
-              children: "Profile"
-            }
-          ),
-          /* @__PURE__ */ e.jsx(
-            "li",
-            {
-              onMouseEnter: () => d(!0),
-              onMouseLeave: () => d(!1),
-              style: w,
-              onClick: () => c(!0),
-              className: "avatar-dropdown-item",
-              children: "Logout"
-            }
-          )
-        ] })
-      }
-    )
-  ] }) });
-}
-{
-  const r = u(N, {
-    props: {
-      logo: "string",
-      user: "json",
-      baseUrl: "string",
-      classNames: "string",
-      style: "json",
-      customColors: "json"
-    },
-    shadow: "open"
-  });
-  customElements.define("global-topbar", r);
-}
+import "../index-75324537.js";
+import { T as a } from "../index-1b59168e.js";
 export {
-  N as TopBar
+  a as TopBar
 };