geoiq-frontend-ui-kit 2.0.1 → 2.0.2

package/dist/index.es48.js

@@ -1,126 +1,317 @@
-import * as e from "react";
-import { cn as i } from "./index.es81.js";
-import { AnimatedInputContainerVariants as F, AnimatedInputStyles as w, DynamicComponentStyles as y } from "./index.es95.js";
-import { Typography as A } from "./index.es17.js";
-import { XCircle as R } from "lucide-react";
-const b = e.forwardRef(
-  ({
-    className: h,
-    type: v,
-    isError: m,
-    message: f,
-    prefix: p,
-    suffix: c,
-    id: E,
-    placeholder: o = "",
-    placeholders: n = [],
-    value: l = "",
-    onChange: g,
-    ...I
-  }, N) => {
-    const S = e.useRef(null), $ = N || S, [a, r] = e.useState(!1), [s, k] = e.useState(0), [t, d] = e.useState(!1);
-    e.useEffect(() => {
-      if (n.length === 0 || a || l.toString().length > 0)
-        return;
-      const u = setInterval(() => {
-        d(!1), k((C) => (C + 1) % n.length), d(!0);
-      }, 2e3);
-      return () => clearInterval(u);
-    }, [n.length, a, l]);
-    const x = () => {
-      g?.({
-        target: { value: "" }
-      });
-    };
-    return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
-      "div",
+import { Typography as s } from "./index.es19.js";
+import { Dropdown as z } from "./index.es22.js";
+import { cn as l } from "./index.es89.js";
+import e, { useState as I } from "react";
+import { AvatarDemo as T } from "./index.es6.js";
+import { CreditSheet as _ } from "./index.es114.js";
+import { CreditsIndicator as F } from "./index.es55.js";
+import { BrandSwitcher as $ } from "./index.es56.js";
+import { ChevronLeft as L } from "lucide-react";
+import U from "./index.es18.js";
+import { Badge as q } from "./index.es8.js";
+const G = ({ name: t = "", email: a = "" }) => {
+  if (!(t || a)) return null;
+  const n = "text-ellipsis overflow-hidden";
+  return /* @__PURE__ */ e.createElement("div", { className: "flex flex-col px-2" }, t && /* @__PURE__ */ e.createElement(
+    s,
+    {
+      variant: "body4",
+      className: l("text-light-1", n)
+    },
+    t
+  ), a && /* @__PURE__ */ e.createElement(
+    s,
+    {
+      variant: "body5",
+      className: l("text-light-3", n)
+    },
+    a
+  ));
+}, f = ({
+  alt: t,
+  className: a,
+  isActive: n = !1,
+  isNew: i = !1,
+  src: m,
+  label: p,
+  tooltipText: d = "",
+  collapsed: c = !1,
+  wrapper: v = null,
+  onClick: b,
+  disabled: o = !1
+}) => {
+  const x = (r) => v?.(r) ?? r, h = (r) => {
+    if (o) {
+      r.preventDefault(), r.stopPropagation();
+      return;
+    }
+    b?.();
+  }, u = /* @__PURE__ */ e.createElement(
+    "div",
+    {
+      className: l(
+        "flex items-center gap-3 px-3 py-2 rounded-md hover:bg-hover-s3 cursor-pointer relative transition-colors",
+        n && "bg-primary-3/15 overflow-hidden before:content-[''] before:absolute before:left-0 before:inset-y-0 before:w-[3px] before:bg-gradient-to-b before:from-[#F19089] before:via-[#B16DBA] before:to-[#6D48EF]",
+        c && "justify-center px-2 mx-2",
+        o && "opacity-50 cursor-not-allowed pointer-events-auto",
+        a
+      ),
+      onClick: h,
+      "aria-disabled": o,
+      tabIndex: o ? -1 : 0
+    },
+    /* @__PURE__ */ e.createElement("div", { className: "relative flex items-center justify-center flex-shrink-0 w-5 h-5" }, /* @__PURE__ */ e.createElement("img", { src: m, alt: t, className: "w-5 h-5" }), /* @__PURE__ */ e.createElement(H, { isNew: i })),
+    !c && /* @__PURE__ */ e.createElement(s, { variant: "body4", className: "flex-1 truncate text-dark-1" }, p)
+  );
+  return x(
+    c && d ? (
+      // REMOVE the <div className="relative"> wrapper
+      /* @__PURE__ */ e.createElement(
+        U,
+        {
+          content: "",
+          headerText: /* @__PURE__ */ e.createElement("div", { className: "flex items-center gap-2" }, i && /* @__PURE__ */ e.createElement(q, { variant: "gradient", size: "sm" }, "NEW"), /* @__PURE__ */ e.createElement("div", null, d)),
+          sideOffset: 12,
+          triggerElement: u,
+          delayDuration: 100,
+          side: "right"
+        }
+      )
+    ) : u
+  );
+}, y = () => /* @__PURE__ */ e.createElement("div", { className: "my-2 h-[1px] w-full bg-white opacity-20" }), H = ({ isNew: t }) => t ? /* @__PURE__ */ e.createElement("div", { className: "absolute w-[6px] h-[6px] rounded-full bottom-0 right-0 bg-secondary-2" }) : null, P = ({
+  src: t,
+  popoverOptions: a,
+  name: n = "",
+  email: i = "",
+  collapsed: m = !1
+}) => /* @__PURE__ */ e.createElement(
+  z,
+  {
+    dropdownContentProps: {
+      sideOffset: 8,
+      side: "right",
+      align: "end",
+      style: { width: "200px" }
+    },
+    trigger: /* @__PURE__ */ e.createElement(
+      "button",
       {
-        className: i(
-          F({
-            isError: m,
-            isFocused: a,
-            disabled: I.disabled,
-            className: h
-          })
-        ),
-        id: E,
-        style: { overflow: "hidden" }
+        className: l(
+          "flex w-full items-center gap-3 p-3 hover:bg-hover-s3 transition-colors rounded-md cursor-pointer",
+          m && "justify-center p-2"
+        )
       },
-      p && /* @__PURE__ */ e.createElement(
-        "div",
-        {
-          onClick: () => {
-            r(!0);
-          }
-        },
-        p
-      ),
-      /* @__PURE__ */ e.createElement("div", { className: "h-[38px] w-full relative " }, /* @__PURE__ */ e.createElement(
-        "input",
+      /* @__PURE__ */ e.createElement(
+        T,
         {
-          type: v,
-          className: i(w({ isError: m })),
-          placeholder: a ? "What are you searching for?" : o,
-          onFocus: () => {
-            r(!0), d(!1);
-          },
-          onBlur: () => r(!1),
-          ref: $,
-          value: l,
-          onChange: (u) => g?.(u)
+          imageSrc: t ?? "",
+          size: "md",
+          alt: "avatar",
+          fallback: /* @__PURE__ */ e.createElement(
+            "img",
+            {
+              src: "https://frontend-static-files.geoiq.io/strapi/Avatar_e5ab891e67.svg",
+              alt: "avatar",
+              className: "w-10 h-10"
+            }
+          )
         }
-      ), !a && l.toString().length === 0 && /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
-        "div",
+      ),
+      !m && /* @__PURE__ */ e.createElement("div", { className: "flex-1 text-left" }, /* @__PURE__ */ e.createElement(
+        s,
         {
-          key: `placeholder-${s}-${t}`,
-          className: i(y({ animate: t })),
-          style: {
-            left: `${o.length * 0.92}ch`,
-            animation: t ? "animatedInputMiddleToTop 0.6s forwards" : "none",
-            opacity: t ? 1 : 0
-          }
+          variant: "body4",
+          className: "text-dark-1 mb-0.5 truncate",
+          style: { maxWidth: "140px" }
         },
-        n[s]
+        n
       ), /* @__PURE__ */ e.createElement(
-        "div",
+        s,
         {
-          key: `next-placeholder-${(s + 1) % n.length}-${t}`,
-          className: i(y({ animate: t })),
-          style: {
-            left: `${o.length * 0.92}ch`,
-            animation: t ? "animatedInputFadeInBottom 1.5s forwards 0.2s" : "none",
-            opacity: t ? 0 : 1
-          }
+          variant: "body6",
+          className: "truncate text-dark-1",
+          style: { maxWidth: "140px" }
         },
-        n[(s + 1) % n.length]
-      ))),
+        i
+      ))
+    ),
+    header: /* @__PURE__ */ e.createElement(G, { name: n, email: i }),
+    optionGroups: a
+  }
+), R = ({
+  src: t,
+  alt: a,
+  text: n,
+  collapsed: i
+}) => /* @__PURE__ */ e.createElement("div", { className: l("flex items-center gap-3", i && "justify-center") }, /* @__PURE__ */ e.createElement("div", { className: "flex-shrink-0" }, /* @__PURE__ */ e.createElement("img", { src: t, alt: a, className: "w-10 h-10" })), !i && /* @__PURE__ */ e.createElement(s, { variant: "h3", className: "text-dark-1" }, n)), J = ({ credits: t, totalCredits: a, collapsed: n, onTopUp: i, topUpWrapper: m }) => t < 0 ? null : /* @__PURE__ */ e.createElement("div", { className: l("pb-4", n ? "flex justify-center" : "px-3") }, /* @__PURE__ */ e.createElement(
+  F,
+  {
+    remaining: t,
+    total: a ?? t,
+    collapsed: n,
+    onTopUp: i,
+    topUpWrapper: m,
+    size: "md",
+    className: n ? "" : "w-full"
+  }
+)), K = ({
+  title: t,
+  collapsed: a
+}) => /* @__PURE__ */ e.createElement(
+  s,
+  {
+    variant: "body6",
+    className: l(
+      "mb-2 text-white/50 truncate",
+      a ? "text-[10px] text-center px-1" : "px-2"
+    )
+  },
+  t
+), le = ({
+  icons: t,
+  credits: a = -1,
+  totalCredits: n = null,
+  profile: i,
+  logo: m,
+  brandSwitcher: p,
+  className: d = "",
+  id: c,
+  clickDisable: v = !1,
+  onRequestCredits: b,
+  onProceedToPayment: o,
+  buyCreditsOptions: x,
+  minimumCreditsToBuy: h,
+  requestOnly: u,
+  collapsed: r = !1,
+  onCollapsedChange: w,
+  width: k = "218px",
+  collapsedWidth: C = "72px",
+  showToggle: j = !0,
+  togglePosition: E = { top: "24px", right: "-14px" },
+  sections: S = [
+    { title: "Analyse", items: [] },
+    { title: "Expand", items: [] }
+  ]
+}) => {
+  const [A, D] = I(!1), B = {
+    top: E.top,
+    right: E.right,
+    left: E.left,
+    bottom: E.bottom
+  };
+  return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
+    "div",
+    {
+      className: l(
+        "bg-dark-2 h-full flex flex-col transition-all duration-300 ease-in-out relative",
+        d
+      ),
+      style: {
+        width: r ? C : k
+      },
+      id: c
+    },
+    j && /* @__PURE__ */ e.createElement("div", { className: "absolute z-10", style: B }, /* @__PURE__ */ e.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => w?.(!r),
+        "aria-label": r ? "Expand sidebar" : "Collapse sidebar",
+        className: l(
+          "flex items-center justify-center w-7 h-7 rounded-full",
+          "bg-dark-2 border border-white/60 shadow-md",
+          "text-white/60 hover:text-white hover:bg-[rgb(45,45,45)]",
+          "transition-colors"
+        )
+      },
       /* @__PURE__ */ e.createElement(
-        "div",
+        L,
         {
-          className: "flex items-center cursor-pointer",
-          onClick: () => c && r(!0)
-        },
-        c ? /* @__PURE__ */ e.createElement("div", { className: "flex items-center" }, c) : /* @__PURE__ */ e.createElement(
-          "div",
-          {
-            className: a ? "" : "opacity-0",
-            onClick: x
-          },
-          /* @__PURE__ */ e.createElement(R, { size: 16, className: "stroke-light-2" })
-        )
+          className: l(
+            "w-3.5 h-3.5 transition-transform duration-300",
+            r && "rotate-180"
+          )
+        }
       )
-    ), f && /* @__PURE__ */ e.createElement(
-      A,
+    )),
+    /* @__PURE__ */ e.createElement("div", { className: "px-3 py-4" }, /* @__PURE__ */ e.createElement(R, { ...m, collapsed: r })),
+    p && /* @__PURE__ */ e.createElement("div", { className: l("pb-3", r ? "px-2" : "px-3") }, /* @__PURE__ */ e.createElement($, { ...p, collapsed: r })),
+    /* @__PURE__ */ e.createElement(
+      J,
+      {
+        credits: a,
+        totalCredits: n,
+        collapsed: r,
+        onTopUp: t.invoices?.onClick,
+        topUpWrapper: t.invoices?.wrapper ?? void 0
+      }
+    ),
+    /* @__PURE__ */ e.createElement("div", { className: "flex-1 px-2 overflow-y-auto" }, S.map((g, N) => /* @__PURE__ */ e.createElement(
+      "div",
       {
-        variant: "body2",
-        className: `${m ? "text-danger-1" : "text-light-3"} mt-1.5`
+        key: N,
+        className: l(
+          "mb-4",
+          N > 0 && "mt-6"
+          // Add extra top margin to sections after the first one
+        )
       },
-      f
-    ));
-  }
-);
-b.displayName = "AnimatedInput";
+      /* @__PURE__ */ e.createElement(K, { title: g.title, collapsed: r }),
+      /* @__PURE__ */ e.createElement("div", { className: "flex flex-col gap-1" }, g.items.map((O, W) => /* @__PURE__ */ e.createElement(
+        f,
+        {
+          key: W,
+          ...O,
+          collapsed: r
+        }
+      )))
+    )), /* @__PURE__ */ e.createElement("div", { className: "pt-4 mt-4" }, /* @__PURE__ */ e.createElement(y, null), /* @__PURE__ */ e.createElement("div", { className: "flex flex-col gap-2" }, t.invoices && /* @__PURE__ */ e.createElement(f, { ...t.invoices, collapsed: r }), t.notification && /* @__PURE__ */ e.createElement(
+      f,
+      {
+        ...t.notification,
+        collapsed: r
+      }
+    ), t.chat && /* @__PURE__ */ e.createElement(f, { ...t.chat, collapsed: r })))),
+    /* @__PURE__ */ e.createElement("div", { className: "pb-2" }, /* @__PURE__ */ e.createElement(
+      "div",
+      {
+        className: l(
+          "flex items-center gap-2 cursor-pointer rounded-md transition-colors",
+          r ? "justify-center p-2" : "p-2 py-2.5"
+        )
+      }
+    ), /* @__PURE__ */ e.createElement(
+      "div",
+      {
+        className: l(
+          "flex items-center gap-2 cursor-pointer rounded-md transition-colors",
+          r ? "justify-center p-2" : "p-2 py-2.5"
+        )
+      },
+      /* @__PURE__ */ e.createElement(f, { ...t.help, collapsed: r })
+    ), /* @__PURE__ */ e.createElement("div", { className: "px-2" }, /* @__PURE__ */ e.createElement(y, null)), /* @__PURE__ */ e.createElement(P, { ...i, collapsed: r }))
+  ), !v && /* @__PURE__ */ e.createElement(
+    _,
+    {
+      open: A,
+      onClose: () => D(!1),
+      credit_details: n ? `Available: ${a}/${n}` : `Available: ${a}`,
+      onRequestCredits: b,
+      onProceedToPayment: o,
+      containerId: "navbar-container",
+      buyCreditsOptions: x,
+      minimumCreditsToBuy: h,
+      requestOnly: u,
+      className: l(
+        "bg-light-1 pb-12 inset-y-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
+        r ? "left-[66px]" : "left-[218px]"
+      ),
+      dialogClassName: "h-[150px] w-[150px] ml-4"
+    }
+  ));
+};
 export {
-  b as AnimatedInput
+  le as NavbarExtended
 };
 //# sourceMappingURL=index.es48.js.map

package/dist/index.es48.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es48.js","sources":["../src/components/ui/animated-input/animated-input.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '@/lib/utils'\nimport { AnimatedInputProps } from './animated-input.types'\nimport {\n  AnimatedInputContainerVariants,\n  DynamicComponentStyles,\n  AnimatedInputStyles,\n} from './animated-input.styles'\nimport { Typography } from '../../atoms/typography'\nimport { XCircle } from 'lucide-react'\n\nconst AnimatedInput = React.forwardRef<HTMLInputElement, AnimatedInputProps>(\n  (\n    {\n      className,\n      type,\n      isError,\n      message,\n      prefix,\n      suffix,\n      id,\n      placeholder = '',\n      placeholders = [],\n      value = '',\n      onChange,\n      ...props\n    },\n    ref\n  ) => {\n    const inputRef = React.useRef<HTMLInputElement>(null)\n    const combinedRef = (ref as React.RefObject<HTMLInputElement>) || inputRef\n    const [isFocused, setIsFocused] = React.useState(false)\n    const [index, setIndex] = React.useState(0)\n    const [animate, setAnimate] = React.useState(false)\n\n    React.useEffect(() => {\n      if (placeholders.length === 0 || isFocused || value.toString().length > 0)\n        return\n\n      const interval = setInterval(() => {\n        setAnimate(false)\n        setIndex((prevIndex) => (prevIndex + 1) % placeholders.length)\n        setAnimate(true)\n      }, 2000)\n\n      return () => clearInterval(interval)\n    }, [placeholders.length, isFocused, value])\n\n    const clearInput = () => {\n      onChange?.({\n        target: { value: '' },\n      } as React.ChangeEvent<HTMLInputElement>)\n    }\n\n    return (\n      <>\n        <div\n          className={cn(\n            AnimatedInputContainerVariants({\n              isError,\n              isFocused,\n              disabled: props.disabled,\n              className,\n            })\n          )}\n          id={id}\n          style={{ overflow: 'hidden' }}\n        >\n          {prefix && (\n            <div\n              onClick={() => {\n                setIsFocused(true)\n              }}\n            >\n              {prefix}\n            </div>\n          )}\n\n          <div className=\"h-[38px] w-full relative \">\n            <input\n              type={type}\n              className={cn(AnimatedInputStyles({ isError }))}\n              placeholder={\n                isFocused ? 'What are you searching for?' : placeholder\n              }\n              onFocus={() => {\n                setIsFocused(true)\n                setAnimate(false)\n              }}\n              onBlur={() => setIsFocused(false)}\n              ref={combinedRef}\n              value={value}\n              onChange={(e) => onChange?.(e)}\n            />\n\n            {/* Dynamic placeholder animation shown when input is not focused and empty */}\n            {!isFocused && value.toString().length === 0 && (\n              <>\n                <div\n                  key={`placeholder-${index}-${animate}`}\n                  className={cn(DynamicComponentStyles({ animate }))}\n                  style={{\n                    left: `${placeholder.length * 0.92}ch`,\n                    animation: animate\n                      ? 'animatedInputMiddleToTop 0.6s forwards'\n                      : 'none',\n                    opacity: animate ? 1 : 0,\n                  }}\n                >\n                  {placeholders[index]}\n                </div>\n\n                <div\n                  key={`next-placeholder-${(index + 1) % placeholders.length}-${animate}`}\n                  className={cn(DynamicComponentStyles({ animate }))}\n                  style={{\n                    left: `${placeholder.length * 0.92}ch`,\n                    animation: animate\n                      ? 'animatedInputFadeInBottom 1.5s forwards 0.2s'\n                      : 'none',\n                    opacity: animate ? 0 : 1,\n                  }}\n                >\n                  {placeholders[(index + 1) % placeholders.length]}\n                </div>\n              </>\n            )}\n          </div>\n\n          {/* Optional suffix element (or clear button) displayed after input */}\n          <div\n            className=\"flex items-center cursor-pointer\"\n            onClick={() => suffix && setIsFocused(true)}\n          >\n            {suffix ? (\n              <div className=\"flex items-center\">{suffix}</div>\n            ) : (\n              <div\n                className={!isFocused ? 'opacity-0' : ''}\n                onClick={clearInput}\n              >\n                <XCircle size={16} className=\"stroke-light-2\" />\n              </div>\n            )}\n          </div>\n        </div>\n\n        {/* Optional message displayed below the input */}\n        {message && (\n          <Typography\n            variant=\"body2\"\n            className={`${isError ? 'text-danger-1' : 'text-light-3'} mt-1.5`}\n          >\n            {message}\n          </Typography>\n        )}\n      </>\n    )\n  }\n)\n\nAnimatedInput.displayName = 'AnimatedInput'\n\nexport { AnimatedInput }\n"],"names":["AnimatedInput","React","className","type","isError","message","prefix","suffix","id","placeholder","placeholders","value","onChange","props","ref","inputRef","combinedRef","isFocused","setIsFocused","index","setIndex","animate","setAnimate","interval","prevIndex","clearInput","cn","AnimatedInputContainerVariants","AnimatedInputStyles","e","DynamicComponentStyles","XCircle","Typography"],"mappings":"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"}
+{"version":3,"file":"index.es48.js","sources":["../src/components/organisms/navbar/navbar-extended.tsx"],"sourcesContent":["import { Typography } from '@/components/atoms/typography'\nimport { Dropdown } from '@/components/molecules/dropdown-menu/dropdown-menu'\nimport { cn } from '@/lib/utils'\nimport React, { useState } from 'react'\nimport { NavbarExtendedProps, IconExtendedProps } from './navbar.types'\nimport { Avatar } from '@/components/atoms/avatar'\nimport { CreditSheet } from '@/components/ui/credit-sheet/credit-sheet'\nimport { CreditsIndicator } from '@/components/ui/credits-indicator'\nimport { BrandSwitcher } from '@/components/ui/brand-switcher'\n// import { ArrowLeft, ArrowRight } from 'lucide-react'\nimport { ChevronLeft } from 'lucide-react'\nimport Tooltip from '@/components/atoms/tooltip'\nimport { Badge } from '@/components/atoms/badge'\n\nconst ProfileHeader = ({ name = '', email = '' }) => {\n  if (!(name || email)) return null\n\n  const classEllipsisAndOverflow: React.ComponentProps<'div'>['className'] =\n    'text-ellipsis overflow-hidden'\n\n  return (\n    <div className=\"flex flex-col px-2\">\n      {name && (\n        <Typography\n          variant=\"body4\"\n          className={cn('text-light-1', classEllipsisAndOverflow)}\n        >\n          {name}\n        </Typography>\n      )}\n      {email && (\n        <Typography\n          variant=\"body5\"\n          className={cn('text-light-3', classEllipsisAndOverflow)}\n        >\n          {email}\n        </Typography>\n      )}\n    </div>\n  )\n}\n\nconst NavbarIconExtended: React.FC<IconExtendedProps> = ({\n  alt,\n  className,\n  isActive = false,\n  isNew = false,\n  src,\n  label,\n  tooltipText = '',\n  collapsed = false,\n  wrapper = null,\n  onClick,\n  disabled = false,\n}) => {\n  const returnWrap = (children: React.ReactNode) =>\n    wrapper?.(children) ?? children\n\n  const handleClick = (e: React.MouseEvent<HTMLDivElement>) => {\n    if (disabled) {\n      e.preventDefault()\n      e.stopPropagation()\n      return\n    }\n    onClick?.()\n  }\n\n  const navbarIcon = (\n    <div\n      className={cn(\n        'flex items-center gap-3 px-3 py-2 rounded-md hover:bg-hover-s3 cursor-pointer relative transition-colors',\n        isActive &&\n          \"bg-primary-3/15 overflow-hidden before:content-[''] before:absolute before:left-0 before:inset-y-0 before:w-[3px] before:bg-gradient-to-b before:from-[#F19089] before:via-[#B16DBA] before:to-[#6D48EF]\",\n        collapsed && 'justify-center px-2 mx-2',\n        disabled && 'opacity-50 cursor-not-allowed pointer-events-auto',\n        className\n      )}\n      onClick={handleClick}\n      aria-disabled={disabled}\n      tabIndex={disabled ? -1 : 0}\n    >\n      <div className=\"relative flex items-center justify-center flex-shrink-0 w-5 h-5\">\n        <img src={src} alt={alt} className=\"w-5 h-5\" />\n        <NewBlink isNew={isNew} />\n      </div>\n      {!collapsed && (\n        <Typography variant={'body4'} className=\"flex-1 truncate text-dark-1\">\n          {label}\n        </Typography>\n      )}\n    </div>\n  )\n\n  // Show tooltip only when collapsed and tooltipText exists\n  if (collapsed && tooltipText) {\n    return returnWrap(\n      // REMOVE the <div className=\"relative\"> wrapper\n      <Tooltip\n        content=\"\"\n        headerText={\n          (\n            <div className=\"flex items-center gap-2\">\n              {isNew && (\n                <Badge variant=\"gradient\" size=\"sm\">\n                  NEW\n                </Badge>\n              )}\n              <div>{tooltipText}</div>\n            </div>\n          ) as unknown as string\n        }\n        sideOffset={12}\n        triggerElement={navbarIcon}\n        delayDuration={100}\n        side=\"right\"\n      />\n    )\n  }\n\n  return returnWrap(navbarIcon)\n}\n\nconst Separator = () => (\n  <div className=\"my-2 h-[1px] w-full bg-white opacity-20\" />\n)\n\nconst NewBlink: React.FC<Pick<IconExtendedProps, 'isNew'>> = ({ isNew }) =>\n  isNew ? (\n    <div className=\"absolute w-[6px] h-[6px] rounded-full bottom-0 right-0 bg-secondary-2\" />\n  ) : null\n\nconst Profile: React.FC<NavbarExtendedProps['profile']> = ({\n  src,\n  popoverOptions,\n  name = '',\n  email = '',\n  collapsed = false,\n}) => (\n  <Dropdown\n    dropdownContentProps={{\n      sideOffset: 8,\n      side: 'right',\n      align: 'end',\n      style: { width: '200px' },\n    }}\n    trigger={\n      <button\n        className={cn(\n          'flex w-full items-center gap-3 p-3 hover:bg-hover-s3 transition-colors rounded-md cursor-pointer',\n          collapsed && 'justify-center p-2'\n        )}\n      >\n        <Avatar\n          imageSrc={src ?? ''}\n          size=\"md\"\n          alt=\"avatar\"\n          fallback={\n            <img\n              src=\"https://frontend-static-files.geoiq.io/strapi/Avatar_e5ab891e67.svg\"\n              alt=\"avatar\"\n              className=\"w-10 h-10\"\n            />\n          }\n        />\n        {!collapsed && (\n          <div className=\"flex-1 text-left\">\n            <Typography\n              variant=\"body4\"\n              className=\"text-dark-1 mb-0.5 truncate\"\n              style={{ maxWidth: '140px' }}\n            >\n              {name}\n            </Typography>\n            <Typography\n              variant=\"body6\"\n              className=\"truncate text-dark-1\"\n              style={{ maxWidth: '140px' }}\n            >\n              {email}\n            </Typography>\n          </div>\n        )}\n      </button>\n    }\n    header={<ProfileHeader {...{ name, email }} />}\n    optionGroups={popoverOptions}\n  />\n)\n\nconst Logo: React.FC<NavbarExtendedProps['logo'] & { collapsed: boolean }> = ({\n  src,\n  alt,\n  text,\n  collapsed,\n}) => (\n  <div className={cn('flex items-center gap-3', collapsed && 'justify-center')}>\n    <div className=\"flex-shrink-0\">\n      <img src={src} alt={alt} className=\"w-10 h-10\" />\n    </div>\n    {!collapsed && (\n      <Typography variant=\"h3\" className=\"text-dark-1\">\n        {text}\n      </Typography>\n    )}\n  </div>\n)\n\nconst Credits: React.FC<{\n  credits: number\n  totalCredits?: number | null\n  collapsed: boolean\n  onTopUp?: () => void\n  topUpWrapper?: (children: React.ReactNode) => React.ReactElement\n}> = ({ credits, totalCredits, collapsed, onTopUp, topUpWrapper }) => {\n  if (credits < 0) return null\n  return (\n    <div className={cn('pb-4', collapsed ? 'flex justify-center' : 'px-3')}>\n      <CreditsIndicator\n        remaining={credits}\n        total={totalCredits ?? credits}\n        collapsed={collapsed}\n        onTopUp={onTopUp}\n        topUpWrapper={topUpWrapper}\n        size=\"md\"\n        className={collapsed ? '' : 'w-full'}\n      />\n    </div>\n  )\n}\n\nconst SectionTitle: React.FC<{ title: string; collapsed: boolean }> = ({\n  title,\n  collapsed,\n}) => (\n  <Typography\n    variant=\"body6\"\n    className={cn(\n      'mb-2 text-white/50 truncate',\n      collapsed ? 'text-[10px] text-center px-1' : 'px-2'\n    )}\n  >\n    {title}\n  </Typography>\n)\n\nexport const NavbarExtended: React.FC<NavbarExtendedProps> = ({\n  icons,\n  credits = -1,\n  totalCredits = null,\n  profile,\n  logo,\n  brandSwitcher,\n  className = '',\n  id,\n  clickDisable = false,\n  onRequestCredits,\n  onProceedToPayment,\n  buyCreditsOptions,\n  minimumCreditsToBuy,\n  requestOnly,\n  collapsed = false,\n  onCollapsedChange,\n  width = '218px',\n  collapsedWidth = '72px',\n  showToggle = true,\n  togglePosition = { top: '24px', right: '-14px' },\n  sections = [\n    { title: 'Analyse', items: [] },\n    { title: 'Expand', items: [] },\n  ],\n}) => {\n  const [creditSheetOpen, setCreditSheetOpen] = useState(false)\n\n  const toggleStyle: React.CSSProperties = {\n    top: togglePosition.top,\n    right: togglePosition.right,\n    left: togglePosition.left,\n    bottom: togglePosition.bottom,\n  }\n\n  return (\n    <>\n      <div\n        className={cn(\n          'bg-dark-2 h-full flex flex-col transition-all duration-300 ease-in-out relative',\n          className\n        )}\n        style={{\n          width: collapsed ? collapsedWidth : width,\n        }}\n        id={id}\n      >\n        {showToggle && (\n          <div className=\"absolute z-10\" style={toggleStyle}>\n            <button\n              type=\"button\"\n              onClick={() => onCollapsedChange?.(!collapsed)}\n              aria-label={collapsed ? 'Expand sidebar' : 'Collapse sidebar'}\n              className={cn(\n                'flex items-center justify-center w-7 h-7 rounded-full',\n                'bg-dark-2 border border-white/60 shadow-md',\n                'text-white/60 hover:text-white hover:bg-[rgb(45,45,45)]',\n                'transition-colors'\n              )}\n            >\n              <ChevronLeft\n                className={cn(\n                  'w-3.5 h-3.5 transition-transform duration-300',\n                  collapsed && 'rotate-180'\n                )}\n              />\n            </button>\n          </div>\n        )}\n\n        {/* Header with Logo */}\n        <div className=\"px-3 py-4\">\n          <Logo {...logo} collapsed={collapsed} />\n        </div>\n\n        {/* Brand Switcher */}\n        {brandSwitcher && (\n          <div className={cn('pb-3', collapsed ? 'px-2' : 'px-3')}>\n            <BrandSwitcher {...brandSwitcher} collapsed={collapsed} />\n          </div>\n        )}\n\n        <Credits\n          credits={credits}\n          totalCredits={totalCredits}\n          collapsed={collapsed}\n          onTopUp={icons.invoices?.onClick}\n          topUpWrapper={icons.invoices?.wrapper ?? undefined}\n        />\n        {/* Main Content - Scrollable */}\n        <div className=\"flex-1 px-2 overflow-y-auto\">\n          {/* Main Icons by Sections */}\n          {sections.map((section, sectionIndex) => (\n            <div\n              key={sectionIndex}\n              className={cn(\n                'mb-4',\n                sectionIndex > 0 && 'mt-6' // Add extra top margin to sections after the first one\n              )}\n            >\n              <SectionTitle title={section.title} collapsed={collapsed} />\n              <div className=\"flex flex-col gap-1\">\n                {section.items.map((icon, index) => (\n                  <NavbarIconExtended\n                    key={index}\n                    {...icon}\n                    collapsed={collapsed}\n                  />\n                ))}\n              </div>\n            </div>\n          ))}\n\n          {/* Bottom Icons Section */}\n          <div className=\"pt-4 mt-4\">\n            <Separator />\n            <div className=\"flex flex-col gap-2\">\n              {icons.invoices && (\n                <NavbarIconExtended {...icons.invoices} collapsed={collapsed} />\n              )}\n              {icons.notification && (\n                <NavbarIconExtended\n                  {...icons.notification}\n                  collapsed={collapsed}\n                />\n              )}\n              {icons.chat && (\n                <NavbarIconExtended {...icons.chat} collapsed={collapsed} />\n              )}\n            </div>\n          </div>\n        </div>\n\n        {/* Footer - Fixed at Bottom */}\n        <div className=\"pb-2\">\n          {/* Credits */}\n          <div\n            className={cn(\n              'flex items-center gap-2 cursor-pointer rounded-md transition-colors',\n              collapsed ? 'justify-center p-2' : 'p-2 py-2.5'\n            )}\n          ></div>\n          <div\n            className={cn(\n              'flex items-center gap-2 cursor-pointer rounded-md transition-colors',\n              collapsed ? 'justify-center p-2' : 'p-2 py-2.5'\n            )}\n          >\n            <NavbarIconExtended {...icons.help} collapsed={collapsed} />\n          </div>\n\n          <div className=\"px-2\">\n            <Separator />\n          </div>\n\n          {/* Profile */}\n          <Profile {...profile} collapsed={collapsed} />\n        </div>\n      </div>\n\n      {/* Credit Sheet */}\n      {!clickDisable && (\n        <CreditSheet\n          open={creditSheetOpen}\n          onClose={() => setCreditSheetOpen(false)}\n          credit_details={\n            totalCredits\n              ? `Available: ${credits}/${totalCredits}`\n              : `Available: ${credits}`\n          }\n          onRequestCredits={onRequestCredits}\n          onProceedToPayment={onProceedToPayment}\n          containerId=\"navbar-container\"\n          buyCreditsOptions={buyCreditsOptions}\n          minimumCreditsToBuy={minimumCreditsToBuy}\n          requestOnly={requestOnly}\n          className={cn(\n            'bg-light-1 pb-12 inset-y-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm',\n            collapsed ? 'left-[66px]' : 'left-[218px]'\n          )}\n          dialogClassName=\"h-[150px] w-[150px] ml-4\"\n        />\n      )}\n    </>\n  )\n}\n"],"names":["ProfileHeader","name","email","classEllipsisAndOverflow","React","Typography","cn","NavbarIconExtended","alt","className","isActive","isNew","src","label","tooltipText","collapsed","wrapper","onClick","disabled","returnWrap","children","handleClick","e","navbarIcon","NewBlink","Tooltip","Badge","Separator","Profile","popoverOptions","Dropdown","Avatar","Logo","text","Credits","credits","totalCredits","onTopUp","topUpWrapper","CreditsIndicator","SectionTitle","title","NavbarExtended","icons","profile","logo","brandSwitcher","id","clickDisable","onRequestCredits","onProceedToPayment","buyCreditsOptions","minimumCreditsToBuy","requestOnly","onCollapsedChange","width","collapsedWidth","showToggle","togglePosition","sections","creditSheetOpen","setCreditSheetOpen","useState","toggleStyle","ChevronLeft","BrandSwitcher","section","sectionIndex","icon","index","CreditSheet"],"mappings":";;;;;;;;;;;AAcA,MAAMA,IAAgB,CAAC,EAAE,MAAAC,IAAO,IAAI,OAAAC,IAAQ,SAAS;AACnD,MAAI,EAAED,KAAQC,GAAQ,QAAO;AAE7B,QAAMC,IACJ;AAEF,SACEC,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,qBAAA,GACZH,KACCG,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,WAAWC,EAAG,gBAAgBH,CAAwB;AAAA,IAAA;AAAA,IAErDF;AAAA,EAAA,GAGJC,KACCE,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,WAAWC,EAAG,gBAAgBH,CAAwB;AAAA,IAAA;AAAA,IAErDD;AAAA,EAAA,CAGP;AAEJ,GAEMK,IAAkD,CAAC;AAAA,EACvD,KAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,OAAAC,IAAQ;AAAA,EACR,KAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,WAAAC,IAAY;AAAA,EACZ,SAAAC,IAAU;AAAA,EACV,SAAAC;AAAA,EACA,UAAAC,IAAW;AACb,MAAM;AACJ,QAAMC,IAAa,CAACC,MAClBJ,IAAUI,CAAQ,KAAKA,GAEnBC,IAAc,CAACC,MAAwC;AAC3D,QAAIJ,GAAU;AACZ,MAAAI,EAAE,eAAA,GACFA,EAAE,gBAAA;AACF;AAAA,IACF;AACA,IAAAL,IAAA;AAAA,EACF,GAEMM,IACJnB,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWE;AAAA,QACT;AAAA,QACAI,KACE;AAAA,QACFK,KAAa;AAAA,QACbG,KAAY;AAAA,QACZT;AAAA,MAAA;AAAA,MAEF,SAASY;AAAA,MACT,iBAAeH;AAAA,MACf,UAAUA,IAAW,KAAK;AAAA,IAAA;AAAA,IAE1Bd,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,qGACZ,OAAA,EAAI,KAAAQ,GAAU,KAAAJ,GAAU,WAAU,UAAA,CAAU,GAC7CJ,gBAAAA,EAAA,cAACoB,GAAA,EAAS,OAAAb,GAAc,CAC1B;AAAA,IACC,CAACI,KACAX,gBAAAA,EAAA,cAACC,GAAA,EAAW,SAAS,SAAS,WAAU,iCACrCQ,CACH;AAAA,EAAA;AAMN,SACSM;AAAA,IADLJ,KAAaD;AAAA;AAAA,MAGbV,gBAAAA,EAAA;AAAA,QAACqB;AAAA,QAAA;AAAA,UACC,SAAQ;AAAA,UACR,YAEIrB,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,0BAAA,GACZO,KACCP,gBAAAA,EAAA,cAACsB,GAAA,EAAM,SAAQ,YAAW,MAAK,KAAA,GAAK,KAEpC,GAEFtB,gBAAAA,EAAA,cAAC,OAAA,MAAKU,CAAY,CACpB;AAAA,UAGJ,YAAY;AAAA,UACZ,gBAAgBS;AAAA,UAChB,eAAe;AAAA,UACf,MAAK;AAAA,QAAA;AAAA,MAAA;AAAA,QAKOA;AAAA,EAJd;AAKN,GAEMI,IAAY,MAChBvB,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,2CAA0C,GAGrDoB,IAAuD,CAAC,EAAE,OAAAb,EAAA,MAC9DA,IACEP,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,wEAAA,CAAwE,IACrF,MAEAwB,IAAoD,CAAC;AAAA,EACzD,KAAAhB;AAAA,EACA,gBAAAiB;AAAA,EACA,MAAA5B,IAAO;AAAA,EACP,OAAAC,IAAQ;AAAA,EACR,WAAAa,IAAY;AACd,MACEX,gBAAAA,EAAA;AAAA,EAAC0B;AAAA,EAAA;AAAA,IACC,sBAAsB;AAAA,MACpB,YAAY;AAAA,MACZ,MAAM;AAAA,MACN,OAAO;AAAA,MACP,OAAO,EAAE,OAAO,QAAA;AAAA,IAAQ;AAAA,IAE1B,SACE1B,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWE;AAAA,UACT;AAAA,UACAS,KAAa;AAAA,QAAA;AAAA,MACf;AAAA,MAEAX,gBAAAA,EAAA;AAAA,QAAC2B;AAAAA,QAAA;AAAA,UACC,UAAUnB,KAAO;AAAA,UACjB,MAAK;AAAA,UACL,KAAI;AAAA,UACJ,UACER,gBAAAA,EAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAI;AAAA,cACJ,KAAI;AAAA,cACJ,WAAU;AAAA,YAAA;AAAA,UAAA;AAAA,QACZ;AAAA,MAAA;AAAA,MAGH,CAACW,KACAX,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,sBACbA,gBAAAA,EAAA;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAAQ;AAAA,UACR,WAAU;AAAA,UACV,OAAO,EAAE,UAAU,QAAA;AAAA,QAAQ;AAAA,QAE1BJ;AAAA,MAAA,GAEHG,gBAAAA,EAAA;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAAQ;AAAA,UACR,WAAU;AAAA,UACV,OAAO,EAAE,UAAU,QAAA;AAAA,QAAQ;AAAA,QAE1BH;AAAA,MAAA,CAEL;AAAA,IAAA;AAAA,IAIN,QAAQE,gBAAAA,EAAA,cAACJ,GAAA,EAAoB,MAAAC,GAAM,OAAAC,GAAS;AAAA,IAC5C,cAAc2B;AAAA,EAAA;AAChB,GAGIG,IAAuE,CAAC;AAAA,EAC5E,KAAApB;AAAA,EACA,KAAAJ;AAAA,EACA,MAAAyB;AAAA,EACA,WAAAlB;AACF,MACEX,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAWE,EAAG,2BAA2BS,KAAa,gBAAgB,EAAA,GACzEX,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,gBAAA,GACbA,gBAAAA,EAAA,cAAC,OAAA,EAAI,KAAAQ,GAAU,KAAAJ,GAAU,WAAU,aAAY,CACjD,GACC,CAACO,KACAX,gBAAAA,EAAA,cAACC,GAAA,EAAW,SAAQ,MAAK,WAAU,cAAA,GAChC4B,CACH,CAEJ,GAGIC,IAMD,CAAC,EAAE,SAAAC,GAAS,cAAAC,GAAc,WAAArB,GAAW,SAAAsB,GAAS,cAAAC,QAC7CH,IAAU,IAAU,OAEtB/B,gBAAAA,EAAA,cAAC,SAAI,WAAWE,EAAG,QAAQS,IAAY,wBAAwB,MAAM,EAAA,GACnEX,gBAAAA,EAAA;AAAA,EAACmC;AAAA,EAAA;AAAA,IACC,WAAWJ;AAAA,IACX,OAAOC,KAAgBD;AAAA,IACvB,WAAApB;AAAA,IACA,SAAAsB;AAAA,IACA,cAAAC;AAAA,IACA,MAAK;AAAA,IACL,WAAWvB,IAAY,KAAK;AAAA,EAAA;AAAA,CAEhC,GAIEyB,IAAgE,CAAC;AAAA,EACrE,OAAAC;AAAA,EACA,WAAA1B;AACF,MACEX,gBAAAA,EAAA;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,SAAQ;AAAA,IACR,WAAWC;AAAA,MACT;AAAA,MACAS,IAAY,iCAAiC;AAAA,IAAA;AAAA,EAC/C;AAAA,EAEC0B;AACH,GAGWC,KAAgD,CAAC;AAAA,EAC5D,OAAAC;AAAA,EACA,SAAAR,IAAU;AAAA,EACV,cAAAC,IAAe;AAAA,EACf,SAAAQ;AAAA,EACA,MAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAArC,IAAY;AAAA,EACZ,IAAAsC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,kBAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAtC,IAAY;AAAA,EACZ,mBAAAuC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,gBAAAC,IAAiB;AAAA,EACjB,YAAAC,IAAa;AAAA,EACb,gBAAAC,IAAiB,EAAE,KAAK,QAAQ,OAAO,QAAA;AAAA,EACvC,UAAAC,IAAW;AAAA,IACT,EAAE,OAAO,WAAW,OAAO,GAAC;AAAA,IAC5B,EAAE,OAAO,UAAU,OAAO,CAAA,EAAC;AAAA,EAAE;AAEjC,MAAM;AACJ,QAAM,CAACC,GAAiBC,CAAkB,IAAIC,EAAS,EAAK,GAEtDC,IAAmC;AAAA,IACvC,KAAKL,EAAe;AAAA,IACpB,OAAOA,EAAe;AAAA,IACtB,MAAMA,EAAe;AAAA,IACrB,QAAQA,EAAe;AAAA,EAAA;AAGzB,SACEtD,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MACEA,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWE;AAAA,QACT;AAAA,QACAG;AAAA,MAAA;AAAA,MAEF,OAAO;AAAA,QACL,OAAOM,IAAYyC,IAAiBD;AAAA,MAAA;AAAA,MAEtC,IAAAR;AAAA,IAAA;AAAA,IAECU,KACCrD,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,iBAAgB,OAAO2D,KACpC3D,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS,MAAMkD,IAAoB,CAACvC,CAAS;AAAA,QAC7C,cAAYA,IAAY,mBAAmB;AAAA,QAC3C,WAAWT;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,MAEAF,gBAAAA,EAAA;AAAA,QAAC4D;AAAA,QAAA;AAAA,UACC,WAAW1D;AAAA,YACT;AAAA,YACAS,KAAa;AAAA,UAAA;AAAA,QACf;AAAA,MAAA;AAAA,IACF,CAEJ;AAAA,IAIFX,gBAAAA,EAAA,cAAC,SAAI,WAAU,YAAA,mCACZ4B,GAAA,EAAM,GAAGa,GAAM,WAAA9B,EAAA,CAAsB,CACxC;AAAA,IAGC+B,KACC1C,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAWE,EAAG,QAAQS,IAAY,SAAS,MAAM,KACpDX,gBAAAA,EAAA,cAAC6D,GAAA,EAAe,GAAGnB,GAAe,WAAA/B,GAAsB,CAC1D;AAAA,IAGFX,gBAAAA,EAAA;AAAA,MAAC8B;AAAA,MAAA;AAAA,QACC,SAAAC;AAAA,QACA,cAAAC;AAAA,QACA,WAAArB;AAAA,QACA,SAAS4B,EAAM,UAAU;AAAA,QACzB,cAAcA,EAAM,UAAU,WAAW;AAAA,MAAA;AAAA,IAAA;AAAA,IAG3CvC,gBAAAA,EAAA,cAAC,SAAI,WAAU,8BAAA,GAEZuD,EAAS,IAAI,CAACO,GAASC,MACtB/D,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK+D;AAAA,QACL,WAAW7D;AAAA,UACT;AAAA,UACA6D,IAAe,KAAK;AAAA;AAAA,QAAA;AAAA,MACtB;AAAA,MAEA/D,gBAAAA,EAAA,cAACoC,GAAA,EAAa,OAAO0B,EAAQ,OAAO,WAAAnD,GAAsB;AAAA,MAC1DX,gBAAAA,EAAA,cAAC,SAAI,WAAU,sBAAA,GACZ8D,EAAQ,MAAM,IAAI,CAACE,GAAMC,MACxBjE,gBAAAA,EAAA;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,KAAK8D;AAAA,UACJ,GAAGD;AAAA,UACJ,WAAArD;AAAA,QAAA;AAAA,MAAA,CAEH,CACH;AAAA,IAAA,CAEH,GAGDX,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,YAAA,GACbA,gBAAAA,EAAA,cAACuB,GAAA,IAAU,GACXvB,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,sBAAA,GACZuC,EAAM,YACLvC,gBAAAA,EAAA,cAACG,GAAA,EAAoB,GAAGoC,EAAM,UAAU,WAAA5B,EAAA,CAAsB,GAE/D4B,EAAM,gBACLvC,gBAAAA,EAAA;AAAA,MAACG;AAAA,MAAA;AAAA,QACE,GAAGoC,EAAM;AAAA,QACV,WAAA5B;AAAA,MAAA;AAAA,IAAA,GAGH4B,EAAM,QACLvC,gBAAAA,EAAA,cAACG,GAAA,EAAoB,GAAGoC,EAAM,MAAM,WAAA5B,EAAA,CAAsB,CAE9D,CACF,CACF;AAAA,IAGAX,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,OAAA,GAEbA,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWE;AAAA,UACT;AAAA,UACAS,IAAY,uBAAuB;AAAA,QAAA;AAAA,MACrC;AAAA,IAAA,GAEFX,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWE;AAAA,UACT;AAAA,UACAS,IAAY,uBAAuB;AAAA,QAAA;AAAA,MACrC;AAAA,MAEAX,gBAAAA,EAAA,cAACG,GAAA,EAAoB,GAAGoC,EAAM,MAAM,WAAA5B,EAAA,CAAsB;AAAA,IAAA,GAG5DX,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,UACbA,gBAAAA,EAAA,cAACuB,GAAA,IAAU,CACb,GAGAvB,gBAAAA,EAAA,cAACwB,GAAA,EAAS,GAAGgB,GAAS,WAAA7B,GAAsB,CAC9C;AAAA,EAAA,GAID,CAACiC,KACA5C,gBAAAA,EAAA;AAAA,IAACkE;AAAA,IAAA;AAAA,MACC,MAAMV;AAAA,MACN,SAAS,MAAMC,EAAmB,EAAK;AAAA,MACvC,gBACEzB,IACI,cAAcD,CAAO,IAAIC,CAAY,KACrC,cAAcD,CAAO;AAAA,MAE3B,kBAAAc;AAAA,MACA,oBAAAC;AAAA,MACA,aAAY;AAAA,MACZ,mBAAAC;AAAA,MACA,qBAAAC;AAAA,MACA,aAAAC;AAAA,MACA,WAAW/C;AAAA,QACT;AAAA,QACAS,IAAY,gBAAgB;AAAA,MAAA;AAAA,MAE9B,iBAAgB;AAAA,IAAA;AAAA,EAAA,CAGtB;AAEJ;"}

package/dist/index.es49.js

@@ -1,37 +1,25 @@
-import s, { useState as u } from "react";
-import { Alert as c } from "./index.es18.js";
-import { RequestCreditsDialog as d } from "./index.es94.js";
-const p = ({
-  onRequestCredits: o,
-  onProceedToPayment: r
-}) => {
-  const [a, e] = u(!1), l = (t, n) => {
-    o(t, n), e(!1);
-  }, i = (t, n) => {
-    r?.(t, n), e(!1);
-  };
-  return /* @__PURE__ */ s.createElement("div", null, /* @__PURE__ */ s.createElement(
-    c,
+import u from "react";
+import { Breakpoints as c } from "./index.es50.js";
+const b = (l) => {
+  const { children: d, breakpoints: r = c, ...e } = l;
+  let n = 0;
+  typeof window < "u" && (n = window?.innerWidth ?? 0);
+  const o = u.useMemo(() => {
+    const i = Object.keys(e);
+    if (i.length === 0) return null;
     {
-      className: "select-none",
-      buttonLabel: "Request for Credits",
-      onButtonClick: () => e(!0),
-      shortContent: !0,
-      showButton: !0,
-      title: "Insufficient Credits available!",
-      variant: "warning"
+      let s = null, p = 0;
+      return i.forEach((a) => {
+        const t = parseInt(
+          r[a]
+        );
+        n >= t && t > p && (s = a, p = t);
+      }), s;
     }
-  ), /* @__PURE__ */ s.createElement(
-    d,
-    {
-      open: a,
-      onClose: () => e(!1),
-      onRequestCredits: l,
-      onProceedToPayment: i
-    }
-  ));
+  }, [n, r, e]);
+  return o ? e[o] : d;
 };
 export {
-  p as default
+  b as Responsive
 };
 //# sourceMappingURL=index.es49.js.map

package/dist/index.es49.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es49.js","sources":["../src/components/ui/request-credits-view/request-credits-view.tsx"],"sourcesContent":["import React, { FC, useState } from 'react'\nimport { RequestCreditsViewNS } from './request-credits-view.types'\nimport { Alert } from '@/components/molecules/alert'\nimport { RequestCreditsDialog } from './component/request-credit-dialog'\n\nconst RequestCreditsView: FC<RequestCreditsViewNS.RequestCreditsViewProps> = ({\n  onRequestCredits,\n  onProceedToPayment,\n}) => {\n  const [isOpen, setIsOpen] = useState(false)\n\n  const handleRequestCredits = (credits: string, phoneNumber: string) => {\n    onRequestCredits(credits, phoneNumber)\n    setIsOpen(false)\n  }\n\n  const handleProceedToPayment = (credits: string, phoneNumber: string) => {\n    onProceedToPayment?.(credits, phoneNumber)\n    setIsOpen(false)\n  }\n\n  return (\n    <div>\n      <Alert\n        className=\"select-none\"\n        buttonLabel=\"Request for Credits\"\n        onButtonClick={() => setIsOpen(true)}\n        shortContent\n        showButton\n        title=\"Insufficient Credits available!\"\n        variant=\"warning\"\n      />\n      <RequestCreditsDialog\n        open={isOpen}\n        onClose={() => setIsOpen(false)}\n        onRequestCredits={handleRequestCredits}\n        onProceedToPayment={handleProceedToPayment}\n      />\n    </div>\n  )\n}\n\nexport default RequestCreditsView\n"],"names":["RequestCreditsView","onRequestCredits","onProceedToPayment","isOpen","setIsOpen","useState","handleRequestCredits","credits","phoneNumber","handleProceedToPayment","React","Alert","RequestCreditsDialog"],"mappings":";;;AAKA,MAAMA,IAAuE,CAAC;AAAA,EAC5E,kBAAAC;AAAA,EACA,oBAAAC;AACF,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK,GAEpCC,IAAuB,CAACC,GAAiBC,MAAwB;AACrE,IAAAP,EAAiBM,GAASC,CAAW,GACrCJ,EAAU,EAAK;AAAA,EACjB,GAEMK,IAAyB,CAACF,GAAiBC,MAAwB;AACvE,IAAAN,IAAqBK,GAASC,CAAW,GACzCJ,EAAU,EAAK;AAAA,EACjB;AAEA,yCACG,OAAA,MACCM,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,aAAY;AAAA,MACZ,eAAe,MAAMP,EAAU,EAAI;AAAA,MACnC,cAAY;AAAA,MACZ,YAAU;AAAA,MACV,OAAM;AAAA,MACN,SAAQ;AAAA,IAAA;AAAA,EAAA,GAEVM,gBAAAA,EAAA;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,MAAMT;AAAA,MACN,SAAS,MAAMC,EAAU,EAAK;AAAA,MAC9B,kBAAkBE;AAAA,MAClB,oBAAoBG;AAAA,IAAA;AAAA,EAAA,CAExB;AAEJ;"}
+{"version":3,"file":"index.es49.js","sources":["../src/components/ui/responsive/responsive.tsx"],"sourcesContent":["import React from 'react'\nimport { Breakpoints } from './responsive.config'\nimport { type ResponsiveTypesNS } from './responsive.types'\n\nexport const Responsive = <T = typeof Breakpoints,>(\n  props: ResponsiveTypesNS<T>['ResponsiveProps']\n) => {\n  const { children, breakpoints = Breakpoints, ...breakpointRenders } = props\n\n  let innerWidth = 0\n  if (typeof window !== 'undefined') innerWidth = window?.innerWidth ?? 0\n\n  const toRenderBreakpoint = React.useMemo((): keyof T | null => {\n    const keys = Object.keys(breakpointRenders)\n\n    if (keys.length === 0) return null\n    else {\n      let breakpointReturn = null\n      let breakpointLimit = 0\n\n      keys.forEach((key) => {\n        const breakpointValue = parseInt(\n          breakpoints[key as keyof (T | typeof Breakpoints)] as string\n        )\n        if (\n          innerWidth >= breakpointValue &&\n          breakpointValue > breakpointLimit\n        ) {\n          breakpointReturn = key\n          breakpointLimit = breakpointValue\n        }\n      })\n      return breakpointReturn\n    }\n  }, [innerWidth, breakpoints, breakpointRenders])\n\n  return toRenderBreakpoint\n    ? breakpointRenders[toRenderBreakpoint as keyof typeof breakpointRenders]\n    : children\n}\n"],"names":["Responsive","props","children","breakpoints","Breakpoints","breakpointRenders","innerWidth","toRenderBreakpoint","React","keys","breakpointReturn","breakpointLimit","key","breakpointValue"],"mappings":";;AAIO,MAAMA,IAAa,CACxBC,MACG;AACH,QAAM,EAAE,UAAAC,GAAU,aAAAC,IAAcC,GAAa,GAAGC,MAAsBJ;AAEtE,MAAIK,IAAa;AACjB,EAAI,OAAO,SAAW,QAAaA,IAAa,QAAQ,cAAc;AAEtE,QAAMC,IAAqBC,EAAM,QAAQ,MAAsB;AAC7D,UAAMC,IAAO,OAAO,KAAKJ,CAAiB;AAE1C,QAAII,EAAK,WAAW,EAAG,QAAO;AACzB;AACH,UAAIC,IAAmB,MACnBC,IAAkB;AAEtB,aAAAF,EAAK,QAAQ,CAACG,MAAQ;AACpB,cAAMC,IAAkB;AAAA,UACtBV,EAAYS,CAAqC;AAAA,QAAA;AAEnD,QACEN,KAAcO,KACdA,IAAkBF,MAElBD,IAAmBE,GACnBD,IAAkBE;AAAA,MAEtB,CAAC,GACMH;AAAA,IACT;AAAA,EACF,GAAG,CAACJ,GAAYH,GAAaE,CAAiB,CAAC;AAE/C,SAAOE,IACHF,EAAkBE,CAAoD,IACtEL;AACN;"}