geoiq-frontend-ui-kit 2.0.0 → 2.0.2

package/dist/index.es42.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es42.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'\n// import { ArrowLeft, ArrowRight } from 'lucide-react'\nimport { Button } from '@/components/atoms/button'\nimport { ChevronLeft, ChevronRight } 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}) => {\n  const returnWrap = (children: React.ReactNode) =>\n    wrapper?.(children) ?? children\n\n  const navbarIcon = (\n    <div\n      className={cn(\n        'flex items-center gap-3 px-3 py-2.5 rounded-md hover:bg-hover-s3 cursor-pointer relative transition-colors',\n        isActive && 'bg-click-s3',\n        collapsed && 'justify-center px-2',\n        className\n      )}\n      {...(onClick && { onClick })}\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={24}\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=\"flex items-center gap-3\">\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  onClick: () => void\n  collapsed: boolean\n}> = ({ credits, onClick, collapsed }) =>\n  credits >= 0 && (\n    <div\n      className={cn(\n        'flex items-center gap-2 cursor-pointer rounded-md transition-colors',\n        collapsed ? 'justify-center p-2' : 'px-3 py-2.5'\n      )}\n      onClick={onClick}\n    >\n      {/* Gradient badge - always same style */}\n      <div className=\"rounded brand-primary-secondary-gradient flex items-center gap-[2px] h-auto box-border p-1 w-auto px-2 justify-center flex-shrink-0\">\n        {credits > 9999 ? (\n          <img\n            src=\"https://frontend-static-files.geoiq.io/strapi/infinity_7d62ad2947.svg\"\n            alt=\"infinity icon\"\n            className=\"w-4 h-4\"\n          />\n        ) : (\n          <Typography variant=\"body5\" className=\"text-dark-1\">\n            {credits}\n          </Typography>\n        )}\n\n        <img\n          src=\"https://frontend-static-files.geoiq.io/strapi/navbar_credits_247858e26a.svg\"\n          alt=\"coin icon\"\n          className=\"w-4 h-4\"\n        />\n      </div>\n\n      {/* Label - only show when expanded */}\n      {!collapsed && (\n        <Typography variant={'body4'} className=\"flex-1 text-sm text-dark-1\">\n          Credits\n        </Typography>\n      )}\n    </div>\n  )\n\nconst SectionTitle: React.FC<{ title: string; collapsed: boolean }> = ({\n  title,\n  collapsed,\n}) =>\n  !collapsed ? (\n    <Typography variant=\"body4\" className=\"px-2 mb-2 uppercase text-dark-1\">\n      {title}\n    </Typography>\n  ) : null\n\nexport const NavbarExtended: React.FC<NavbarExtendedProps> = ({\n  icons,\n  credits = -1,\n  totalCredits = null,\n  profile,\n  logo,\n  className = '',\n  id,\n  clickDisable = false,\n  onRequestCredits,\n  onProceedToPayment,\n  collapsed = false,\n  onCollapsedChange,\n  width = '218px',\n  collapsedWidth = '64px',\n  showToggle = true,\n  togglePosition = { top: '70px', right: '-10px' },\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        {/* Toggle Button */}\n        {showToggle && (\n          <div className=\"absolute z-10\" style={toggleStyle}>\n            <Button\n              onClick={() => onCollapsedChange?.(!collapsed)}\n              size=\"sm\"\n              variant=\"secondary\"\n            >\n              {collapsed ? (\n                <ChevronRight className=\"w-4 h-4\" />\n              ) : (\n                <ChevronLeft className=\"w-4 h-4\" />\n              )}\n            </Button>\n          </div>\n        )}\n\n        {/* Header with Logo */}\n        <div className=\"px-3 py-6\">\n          <Logo {...logo} collapsed={collapsed} />\n        </div>\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              {sectionIndex === 1 && collapsed && <Separator />}\n              <SectionTitle title={section.title} collapsed={collapsed} />\n              <div className=\"flex flex-col gap-3\">\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            {collapsed && <Separator />}\n            <div className=\"flex flex-col gap-3\">\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          >\n            <NavbarIconExtended {...icons.help} collapsed={collapsed} />\n          </div>\n          <Credits\n            credits={credits}\n            onClick={() => setCreditSheetOpen(true)}\n            collapsed={collapsed}\n          />\n\n          <Separator />\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          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","returnWrap","children","navbarIcon","NewBlink","Tooltip","Badge","Separator","Profile","popoverOptions","Dropdown","Avatar","Logo","text","Credits","credits","SectionTitle","title","NavbarExtended","icons","totalCredits","profile","logo","id","clickDisable","onRequestCredits","onProceedToPayment","onCollapsedChange","width","collapsedWidth","showToggle","togglePosition","sections","creditSheetOpen","setCreditSheetOpen","useState","toggleStyle","Button","ChevronRight","ChevronLeft","section","sectionIndex","icon","index","CreditSheet"],"mappings":"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"}
+{"version":3,"file":"index.es42.js","sources":["../src/components/organisms/sheet/sheet.tsx"],"sourcesContent":["import { Typography } from '@/components/atoms/typography'\nimport {\n  Sheet,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n} from './sheet-components'\nimport { SheetProps } from './sheet.types'\nimport React from 'react'\n\nexport function SheetPrimary({\n  trigger,\n  content,\n  triggerProps,\n  contentProps,\n  title,\n  footer,\n  titleProps,\n  description,\n  descriptionProps,\n  onOpenChange,\n  open,\n  modal,\n  onInteractOutside,\n  bodyProps,\n  container,\n}: SheetProps) {\n  return (\n    <Sheet onOpenChange={onOpenChange} open={open} modal={modal}>\n      <SheetTrigger asChild {...triggerProps}>\n        {trigger}\n      </SheetTrigger>\n      <SheetContent\n        onInteractOutside={onInteractOutside}\n        {...contentProps}\n        container={container}\n      >\n        {title && (\n          <SheetHeader className=\"border-b border-neutral-1\">\n            <SheetTitle {...titleProps}>\n              <Typography variant={'h3'} className=\"text-light-2\">\n                {title}\n              </Typography>\n            </SheetTitle>\n          </SheetHeader>\n        )}\n        <div\n          className=\"p-3 overflow-y-auto\"\n          style={{\n            height: footer ? `calc(100vh - 8rem)` : '100%',\n          }}\n          {...bodyProps}\n        >\n          {description && (\n            <SheetDescription className=\"pb-3\" {...descriptionProps}>\n              <Typography variant={'body2'} className=\"text-light-4\">\n                {description}\n              </Typography>\n            </SheetDescription>\n          )}\n\n          {content}\n        </div>\n        {footer && (\n          <SheetFooter className=\"absolute bottom-0 flex items-center w-full p-3 border-t bg-light-2 border-neutral-1\">\n            {footer}\n          </SheetFooter>\n        )}\n      </SheetContent>\n    </Sheet>\n  )\n}\n\nexport { SheetClose }\n"],"names":["SheetPrimary","trigger","content","triggerProps","contentProps","title","footer","titleProps","description","descriptionProps","onOpenChange","open","modal","onInteractOutside","bodyProps","container","React","Sheet","SheetTrigger","SheetContent","SheetHeader","SheetTitle","Typography","SheetDescription","SheetFooter"],"mappings":";;;;AAcO,SAASA,EAAa;AAAA,EAC3B,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AACF,GAAe;AACb,SACEC,gBAAAA,EAAA,cAACC,GAAA,EAAM,cAAAP,GAA4B,MAAAC,GAAY,OAAAC,EAAA,GAC7CI,gBAAAA,EAAA,cAACE,GAAA,EAAa,SAAO,IAAE,GAAGf,EAAA,GACvBF,CACH,GACAe,gBAAAA,EAAA;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,mBAAAN;AAAA,MACC,GAAGT;AAAA,MACJ,WAAAW;AAAA,IAAA;AAAA,IAECV,KACCW,gBAAAA,EAAA,cAACI,GAAA,EAAY,WAAU,4BAAA,mCACpBC,GAAA,EAAY,GAAGd,EAAA,GACdS,gBAAAA,EAAA,cAACM,KAAW,SAAS,MAAM,WAAU,eAAA,GAClCjB,CACH,CACF,CACF;AAAA,IAEFW,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO;AAAA,UACL,QAAQV,IAAS,uBAAuB;AAAA,QAAA;AAAA,QAEzC,GAAGQ;AAAA,MAAA;AAAA,MAEHN,KACCQ,gBAAAA,EAAA,cAACO,GAAA,EAAiB,WAAU,QAAQ,GAAGd,EAAA,GACrCO,gBAAAA,EAAA,cAACM,GAAA,EAAW,SAAS,SAAS,WAAU,eAAA,GACrCd,CACH,CACF;AAAA,MAGDN;AAAA,IAAA;AAAA,IAEFI,KACCU,gBAAAA,EAAA,cAACQ,GAAA,EAAY,WAAU,yFACpBlB,CACH;AAAA,EAAA,CAGN;AAEJ;"}

package/dist/index.es43.js

@@ -1,25 +1,101 @@
-import u from "react";
-import { Breakpoints as c } from "./index.es44.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;
-    {
-      let s = null, p = 0;
-      return i.forEach((a) => {
-        const t = parseInt(
-          r[a]
-        );
-        n >= t && t > p && (s = a, p = t);
-      }), s;
+import * as e from "react";
+import * as t from "@radix-ui/react-dialog";
+import { cva as m } from "class-variance-authority";
+import { X as c } from "lucide-react";
+import { cn as r } from "./index.es89.js";
+const v = t.Root, w = t.Trigger, E = t.Close, f = t.Portal, n = e.forwardRef(({ className: a, ...o }, s) => /* @__PURE__ */ e.createElement(
+  t.Overlay,
+  {
+    className: r(
+      "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      a
+    ),
+    ...o,
+    ref: s
+  }
+));
+n.displayName = t.Overlay.displayName;
+const p = m(
+  "fixed z-50 gap-4 bg-background shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
+  {
+    variants: {
+      side: {
+        top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
+        bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
+        left: "inset-y-0 left-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",
+        right: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
+        custom: ""
+        // custom is to place the sheet anywhere on the screen
+      }
+    },
+    defaultVariants: {
+      side: "right"
     }
-  }, [n, r, e]);
-  return o ? e[o] : d;
-};
+  }
+), u = e.forwardRef(({ side: a = "right", className: o, children: s, container: i, ...l }, d) => /* @__PURE__ */ e.createElement(f, { container: i }, /* @__PURE__ */ e.createElement(n, null), /* @__PURE__ */ e.createElement(
+  t.Content,
+  {
+    ref: d,
+    className: r(p({ side: a }), o),
+    ...l
+  },
+  s,
+  /* @__PURE__ */ e.createElement(t.Close, { className: "ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:pointer-events-none" }, /* @__PURE__ */ e.createElement(c, { className: "w-4 h-4" }), /* @__PURE__ */ e.createElement("span", { className: "sr-only" }, "Close"))
+)));
+u.displayName = t.Content.displayName;
+const g = ({
+  className: a,
+  ...o
+}) => /* @__PURE__ */ e.createElement(
+  "div",
+  {
+    className: r("flex flex-col p-3 text-center sm:text-left", a),
+    ...o
+  }
+);
+g.displayName = "SheetHeader";
+const h = ({
+  className: a,
+  ...o
+}) => /* @__PURE__ */ e.createElement(
+  "div",
+  {
+    className: r(
+      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+      a
+    ),
+    ...o
+  }
+);
+h.displayName = "SheetFooter";
+const y = e.forwardRef(({ className: a, ...o }, s) => /* @__PURE__ */ e.createElement(
+  t.Title,
+  {
+    ref: s,
+    className: r("text-foreground text-lg font-semibold", a),
+    ...o
+  }
+));
+y.displayName = t.Title.displayName;
+const x = e.forwardRef(({ className: a, ...o }, s) => /* @__PURE__ */ e.createElement(
+  t.Description,
+  {
+    ref: s,
+    className: r("text-muted-foreground text-sm", a),
+    ...o
+  }
+));
+x.displayName = t.Description.displayName;
 export {
-  b as Responsive
+  v as Sheet,
+  E as SheetClose,
+  u as SheetContent,
+  x as SheetDescription,
+  h as SheetFooter,
+  g as SheetHeader,
+  n as SheetOverlay,
+  f as SheetPortal,
+  y as SheetTitle,
+  w as SheetTrigger
 };
 //# sourceMappingURL=index.es43.js.map

package/dist/index.es43.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es43.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;"}
+{"version":3,"file":"index.es43.js","sources":["../src/components/organisms/sheet/sheet-components.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as SheetPrimitive from '@radix-ui/react-dialog'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { X } from 'lucide-react'\n\nimport { cn } from '@/lib/utils'\n\n// const Sheet = React.forwardRef<\n//   React.ElementRef<typeof SheetPrimitive.Root>,\n//   React.ComponentPropsWithoutRef<typeof SheetPrimitive.Root> & {\n//     id?: string\n//   }\n// >(({ ...props }, ref) => (\n//   // <div id={id}>\n//   <SheetPrimitive.Root ref={ref} {...props} />\n//   // {/* </div> */}\n// ))\nconst Sheet = SheetPrimitive.Root\nconst SheetTrigger = SheetPrimitive.Trigger\n\nconst SheetClose = SheetPrimitive.Close\n\nconst SheetPortal = SheetPrimitive.Portal\n\nconst SheetOverlay = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Overlay>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Overlay\n    className={cn(\n      'fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n      className\n    )}\n    {...props}\n    ref={ref}\n  />\n))\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName\n\nconst sheetVariants = cva(\n  'fixed z-50 gap-4 bg-background shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500',\n  {\n    variants: {\n      side: {\n        top: 'inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top',\n        bottom:\n          'inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom',\n        left: 'inset-y-0 left-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        right:\n          'inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm',\n        custom: '', // custom is to place the sheet anywhere on the screen\n      },\n    },\n    defaultVariants: {\n      side: 'right',\n    },\n  }\n)\n\ninterface SheetContentProps\n  extends\n    React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,\n    VariantProps<typeof sheetVariants> {\n  container?: Element | DocumentFragment | null | undefined\n}\n\nconst SheetContent = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Content>,\n  SheetContentProps\n>(({ side = 'right', className, children, container, ...props }, ref) => (\n  <SheetPortal container={container}>\n    <SheetOverlay />\n    <SheetPrimitive.Content\n      ref={ref}\n      className={cn(sheetVariants({ side }), className)}\n      {...props}\n    >\n      {children}\n\n      <SheetPrimitive.Close className=\"ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:pointer-events-none\">\n        <X className=\"w-4 h-4\" />\n        <span className=\"sr-only\">Close</span>\n      </SheetPrimitive.Close>\n    </SheetPrimitive.Content>\n  </SheetPortal>\n))\nSheetContent.displayName = SheetPrimitive.Content.displayName\n\nconst SheetHeader = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn('flex flex-col p-3 text-center sm:text-left', className)}\n    {...props}\n  />\n)\nSheetHeader.displayName = 'SheetHeader'\n\nconst SheetFooter = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      'flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2',\n      className\n    )}\n    {...props}\n  />\n)\nSheetFooter.displayName = 'SheetFooter'\n\nconst SheetTitle = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Title\n    ref={ref}\n    className={cn('text-foreground text-lg font-semibold', className)}\n    {...props}\n  />\n))\nSheetTitle.displayName = SheetPrimitive.Title.displayName\n\nconst SheetDescription = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Description\n    ref={ref}\n    className={cn('text-muted-foreground text-sm', className)}\n    {...props}\n  />\n))\nSheetDescription.displayName = SheetPrimitive.Description.displayName\n\nexport {\n  Sheet,\n  SheetPortal,\n  SheetOverlay,\n  SheetTrigger,\n  SheetClose,\n  SheetContent,\n  SheetHeader,\n  SheetFooter,\n  SheetTitle,\n  SheetDescription,\n}\n\nexport type { SheetContentProps }\n"],"names":["Sheet","SheetPrimitive","SheetTrigger","SheetClose","SheetPortal","SheetOverlay","React","className","props","ref","cn","sheetVariants","cva","SheetContent","side","children","container","X","SheetHeader","SheetFooter","SheetTitle","SheetDescription"],"mappings":";;;;;AAmBA,MAAMA,IAAQC,EAAe,MACvBC,IAAeD,EAAe,SAE9BE,IAAaF,EAAe,OAE5BG,IAAcH,EAAe,QAE7BI,IAAeC,EAAM,WAGzB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAC1B,gBAAAH,EAAA;AAAA,EAACL,EAAe;AAAA,EAAf;AAAA,IACC,WAAWS;AAAA,MACT;AAAA,MACAH;AAAA,IAAA;AAAA,IAED,GAAGC;AAAA,IACJ,KAAAC;AAAA,EAAA;AACF,CACD;AACDJ,EAAa,cAAcJ,EAAe,QAAQ;AAElD,MAAMU,IAAgBC;AAAA,EACpB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,KAAK;AAAA,QACL,QACE;AAAA,QACF,MAAM;AAAA,QACN,OACE;AAAA,QACF,QAAQ;AAAA;AAAA,MAAA;AAAA,IACV;AAAA,IAEF,iBAAiB;AAAA,MACf,MAAM;AAAA,IAAA;AAAA,EACR;AAEJ,GASMC,IAAeP,EAAM,WAGzB,CAAC,EAAE,MAAAQ,IAAO,SAAS,WAAAP,GAAW,UAAAQ,GAAU,WAAAC,GAAW,GAAGR,EAAA,GAASC,MAC/D,gBAAAH,EAAA,cAACF,KAAY,WAAAY,EAAA,GACX,gBAAAV,EAAA,cAACD,OAAa,GACd,gBAAAC,EAAA;AAAA,EAACL,EAAe;AAAA,EAAf;AAAA,IACC,KAAAQ;AAAA,IACA,WAAWC,EAAGC,EAAc,EAAE,MAAAG,EAAA,CAAM,GAAGP,CAAS;AAAA,IAC/C,GAAGC;AAAA,EAAA;AAAA,EAEHO;AAAA,kCAEAd,EAAe,OAAf,EAAqB,WAAU,8OAC9B,gBAAAK,EAAA,cAACW,GAAA,EAAE,WAAU,UAAA,CAAU,GACvB,gBAAAX,EAAA,cAAC,QAAA,EAAK,WAAU,UAAA,GAAU,OAAK,CACjC;AACF,CACF,CACD;AACDO,EAAa,cAAcZ,EAAe,QAAQ;AAElD,MAAMiB,IAAc,CAAC;AAAA,EACnB,WAAAX;AAAA,EACA,GAAGC;AACL,MACE,gBAAAF,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWI,EAAG,8CAA8CH,CAAS;AAAA,IACpE,GAAGC;AAAA,EAAA;AACN;AAEFU,EAAY,cAAc;AAE1B,MAAMC,IAAc,CAAC;AAAA,EACnB,WAAAZ;AAAA,EACA,GAAGC;AACL,MACE,gBAAAF,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWI;AAAA,MACT;AAAA,MACAH;AAAA,IAAA;AAAA,IAED,GAAGC;AAAA,EAAA;AACN;AAEFW,EAAY,cAAc;AAE1B,MAAMC,IAAad,EAAM,WAGvB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAC1B,gBAAAH,EAAA;AAAA,EAACL,EAAe;AAAA,EAAf;AAAA,IACC,KAAAQ;AAAA,IACA,WAAWC,EAAG,yCAAyCH,CAAS;AAAA,IAC/D,GAAGC;AAAA,EAAA;AACN,CACD;AACDY,EAAW,cAAcnB,EAAe,MAAM;AAE9C,MAAMoB,IAAmBf,EAAM,WAG7B,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAC1B,gBAAAH,EAAA;AAAA,EAACL,EAAe;AAAA,EAAf;AAAA,IACC,KAAAQ;AAAA,IACA,WAAWC,EAAG,iCAAiCH,CAAS;AAAA,IACvD,GAAGC;AAAA,EAAA;AACN,CACD;AACDa,EAAiB,cAAcpB,EAAe,YAAY;"}

package/dist/index.es44.js

@@ -1,12 +1,18 @@
-const x = {
-  sm: "640px",
-  md: "768px",
-  lg: "1024px",
-  xl: "1280px",
-  xl2: "1536px"
-  // Renamed from 2xl to xl2 for JS Object key compatibility
-};
+import { Slot as p } from "@radix-ui/react-slot";
+import m, { useImperativeHandle as f } from "react";
+import { useImageEditor as l } from "./index.es45.js";
+const n = m.forwardRef(({ trigger: i, image: o, backgroundImage: r, state: t, ...a }, d) => {
+  const e = l({ image: o, backgroundImage: r, state: t, ...a });
+  return f(d, () => e, [e]), /* @__PURE__ */ m.createElement(
+    p,
+    {
+      onClick: () => e.open({ image: o ?? r, state: t })
+    },
+    i
+  );
+});
+n.displayName = "ImageEditor";
 export {
-  x as Breakpoints
+  n as ImageEditor
 };
 //# sourceMappingURL=index.es44.js.map

package/dist/index.es44.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es44.js","sources":["../src/components/ui/responsive/responsive.config.ts"],"sourcesContent":["import { ResponsiveTypesNS } from './responsive.types'\n\n/**\n *  Actually Tailwind's default Breakpoints.\n *  For more info see: https://tailwindcss.com/docs/responsive-design#customizing-your-theme\n */\nexport const Breakpoints = {\n  sm: '640px',\n  md: '768px',\n  lg: '1024px',\n  xl: '1280px',\n  xl2: '1536px', // Renamed from 2xl to xl2 for JS Object key compatibility\n} satisfies ResponsiveTypesNS<unknown>['BreakpointsType']\n"],"names":["Breakpoints"],"mappings":"AAMO,MAAMA,IAAc;AAAA,EACzB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,KAAK;AAAA;AACP;"}
+{"version":3,"file":"index.es44.js","sources":["../src/components/organisms/image-editor/image-editor.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport React, { useImperativeHandle } from 'react'\n\nimport { ImageEditorInstance, ImageEditorProps } from './image-editor.types'\nimport { useImageEditor } from './use-image-editor'\n\nexport const ImageEditor = React.forwardRef<\n  ImageEditorInstance,\n  ImageEditorProps\n>(({ trigger, image, backgroundImage, state, ...config }, ref) => {\n  const editor = useImageEditor({ image, backgroundImage, state, ...config })\n\n  useImperativeHandle(ref, () => editor, [editor])\n\n  return (\n    <Slot\n      onClick={() => editor.open({ image: image ?? backgroundImage, state })}\n    >\n      {trigger}\n    </Slot>\n  )\n})\n\nImageEditor.displayName = 'ImageEditor'\n"],"names":["ImageEditor","React","trigger","image","backgroundImage","state","config","ref","editor","useImageEditor","useImperativeHandle","Slot"],"mappings":";;;AAMO,MAAMA,IAAcC,EAAM,WAG/B,CAAC,EAAE,SAAAC,GAAS,OAAAC,GAAO,iBAAAC,GAAiB,OAAAC,GAAO,GAAGC,EAAA,GAAUC,MAAQ;AAChE,QAAMC,IAASC,EAAe,EAAE,OAAAN,GAAO,iBAAAC,GAAiB,OAAAC,GAAO,GAAGC,GAAQ;AAE1E,SAAAI,EAAoBH,GAAK,MAAMC,GAAQ,CAACA,CAAM,CAAC,GAG7CP,gBAAAA,EAAA;AAAA,IAACU;AAAA,IAAA;AAAA,MACC,SAAS,MAAMH,EAAO,KAAK,EAAE,OAAOL,KAASC,GAAiB,OAAAC,EAAA,CAAO;AAAA,IAAA;AAAA,IAEpEH;AAAA,EAAA;AAGP,CAAC;AAEDF,EAAY,cAAc;"}

package/dist/index.es45.js

@@ -1,23 +1,67 @@
-import p from "react";
-import { Breakpoints as u } from "./index.es44.js";
-const b = (a) => {
-  const e = a ?? u;
-  let t = 0;
-  return typeof window < "u" && (t = window?.innerWidth ?? 0), p.useMemo(() => {
-    const r = Object.keys(e);
-    if (r.length === 0) return "base";
-    {
-      let o = "base", i = 0;
-      return r.forEach((s) => {
-        const n = parseInt(
-          e[s]
-        );
-        t >= n && n > i && (o = s, i = n);
-      }), o;
-    }
-  }, [t, e]);
-};
+import k, { useRef as c, useState as y, useEffect as f } from "react";
+import { createRoot as I } from "./index.es115.js";
+import { ImageEditorModal as w } from "./index.es116.js";
+import { notifyNativeImageEditorState as m } from "./index.es117.js";
+import U from "./index.es118.js";
+function A(u) {
+  const s = c(u);
+  s.current = u;
+  const n = c(null), [p, v] = y(null), [d, g] = y(!1);
+  if (!n.current && typeof window < "u") {
+    const e = s.current;
+    n.current = U.create({
+      ...e,
+      image: e.image ?? e.backgroundImage,
+      onSave: async (t, o) => {
+        const a = s.current;
+        if (a.onAssetUpload) {
+          const R = t.type === "image/jpeg" ? "jpg" : "png", E = new File([t.blob], `edit.${R}`, {
+            type: t.type
+          }), b = await a.onAssetUpload(E);
+          a.onSave({ ...t, ...b }, o);
+          return;
+        }
+        a.onSave(t, o);
+      },
+      onUiChange: v
+    });
+  }
+  f(() => {
+    const e = n.current;
+    if (!e) return;
+    const t = () => {
+      g(!0), m(!0);
+    }, o = () => {
+      g(!1), m(!1);
+    };
+    return e.on("open", t), e.on("close", o), () => {
+      e.off("open", t), e.off("close", o), m(!1), e.destroy();
+    };
+  }, []);
+  const l = (u.stickers ?? []).join(" "), S = c(null);
+  f(() => {
+    const e = n.current;
+    !e || S.current === l || (S.current = l, e.setStickers(u.stickers ?? []));
+  }, [l]);
+  const i = c(null), r = c(null);
+  return f(() => () => {
+    i.current?.unmount(), r.current?.remove(), i.current = null, r.current = null;
+  }, []), f(() => {
+    const e = n.current;
+    e && (r.current || (r.current = document.createElement("div"), document.body.appendChild(r.current), i.current = I(r.current)), i.current.render(
+      /* @__PURE__ */ k.createElement(
+        w,
+        {
+          engine: e,
+          ui: p,
+          isOpen: d,
+          saveLabel: s.current.saveLabel || "Save"
+        }
+      )
+    ));
+  }, [p, d]), n.current;
+}
 export {
-  b as useResponsive
+  A as useImageEditor
 };
 //# sourceMappingURL=index.es45.js.map

package/dist/index.es45.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es45.js","sources":["../src/components/ui/responsive/use-responsive.ts"],"sourcesContent":["import React from 'react'\nimport { Breakpoints } from './responsive.config'\nimport { ResponsiveTypesNS } from './responsive.types'\n\ntype ReturnType<T> = keyof T | 'base'\n\nexport const useResponsive = <\n  T extends ResponsiveTypesNS<unknown>['BreakpointsType'] = typeof Breakpoints,\n>(\n  breakpointsObj?: T\n): ReturnType<T> => {\n  const breakpoints = breakpointsObj ?? Breakpoints\n\n  let innerWidth = 0\n  if (typeof window !== 'undefined') innerWidth = window?.innerWidth ?? 0\n\n  const currentBreakpoint = React.useMemo((): ReturnType<T> => {\n    const keys = Object.keys(breakpoints)\n\n    if (keys.length === 0) return 'base'\n    else {\n      let breakpointReturn: ReturnType<T> = 'base'\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 as ReturnType<T>\n          breakpointLimit = breakpointValue\n        }\n      })\n\n      return breakpointReturn\n    }\n  }, [innerWidth, breakpoints])\n\n  return currentBreakpoint\n}\n"],"names":["useResponsive","breakpointsObj","breakpoints","Breakpoints","innerWidth","React","keys","breakpointReturn","breakpointLimit","key","breakpointValue"],"mappings":";;AAMO,MAAMA,IAAgB,CAG3BC,MACkB;AAClB,QAAMC,IAAcD,KAAkBE;AAEtC,MAAIC,IAAa;AACjB,SAAI,OAAO,SAAW,QAAaA,IAAa,QAAQ,cAAc,IAE5CC,EAAM,QAAQ,MAAqB;AAC3D,UAAMC,IAAO,OAAO,KAAKJ,CAAW;AAEpC,QAAII,EAAK,WAAW,EAAG,QAAO;AACzB;AACH,UAAIC,IAAkC,QAClCC,IAAkB;AAEtB,aAAAF,EAAK,QAAQ,CAACG,MAAQ;AACpB,cAAMC,IAAkB;AAAA,UACtBR,EAAYO,CAAqC;AAAA,QAAA;AAEnD,QACEL,KAAcM,KACdA,IAAkBF,MAElBD,IAAmBE,GACnBD,IAAkBE;AAAA,MAEtB,CAAC,GAEMH;AAAA,IACT;AAAA,EACF,GAAG,CAACH,GAAYF,CAAW,CAAC;AAG9B;"}
+{"version":3,"file":"index.es45.js","sources":["../src/components/organisms/image-editor/use-image-editor.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react'\nimport { createRoot, type Root } from 'react-dom/client'\n\nimport { ImageEditorModal } from './image-editor-modal'\nimport {\n  ImageEditorConfig,\n  ImageEditorEngine,\n  ImageEditorInstance,\n  ImageEditorUiState,\n} from './image-editor.types'\nimport { notifyNativeImageEditorState } from './native-bridge'\nimport PictureStudioEngine from './picture-studio-engine'\n\nexport function useImageEditor(config: ImageEditorConfig): ImageEditorInstance {\n  const configRef = useRef(config)\n  configRef.current = config\n\n  const engineRef = useRef<ImageEditorEngine | null>(null)\n  const [uiState, setUiState] = useState<ImageEditorUiState | null>(null)\n  const [isOpen, setIsOpen] = useState(false)\n\n  if (!engineRef.current && typeof window !== 'undefined') {\n    const initial = configRef.current\n    engineRef.current = PictureStudioEngine.create({\n      ...initial,\n      image: initial.image ?? initial.backgroundImage,\n      onSave: async (result, studio) => {\n        const current = configRef.current\n        if (current.onAssetUpload) {\n          const ext = result.type === 'image/jpeg' ? 'jpg' : 'png'\n          const file = new File([result.blob], `edit.${ext}`, {\n            type: result.type,\n          })\n          const asset = await current.onAssetUpload(file)\n          current.onSave({ ...result, ...asset }, studio)\n          return\n        }\n        current.onSave(result, studio)\n      },\n      onUiChange: setUiState,\n    }) as ImageEditorEngine\n  }\n\n  useEffect(() => {\n    const engine = engineRef.current\n    if (!engine) return\n    const onOpen = () => {\n      setIsOpen(true)\n      notifyNativeImageEditorState(true)\n    }\n    const onClose = () => {\n      setIsOpen(false)\n      notifyNativeImageEditorState(false)\n    }\n    engine.on('open', onOpen)\n    engine.on('close', onClose)\n    return () => {\n      engine.off('open', onOpen)\n      engine.off('close', onClose)\n      notifyNativeImageEditorState(false)\n      engine.destroy()\n    }\n  }, [])\n\n  const stickersKey = (config.stickers ?? []).join(' ')\n  const lastStickersKeyRef = useRef<string | null>(null)\n  useEffect(() => {\n    const engine = engineRef.current\n    if (!engine || lastStickersKeyRef.current === stickersKey) return\n    lastStickersKeyRef.current = stickersKey\n    engine.setStickers(config.stickers ?? [])\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [stickersKey])\n\n  const rootRef = useRef<Root | null>(null)\n  const containerRef = useRef<HTMLDivElement | null>(null)\n  useEffect(() => {\n    return () => {\n      rootRef.current?.unmount()\n      containerRef.current?.remove()\n      rootRef.current = null\n      containerRef.current = null\n    }\n  }, [])\n\n  useEffect(() => {\n    const engine = engineRef.current\n    if (!engine) return\n    if (!containerRef.current) {\n      containerRef.current = document.createElement('div')\n      document.body.appendChild(containerRef.current)\n      rootRef.current = createRoot(containerRef.current)\n    }\n    rootRef.current!.render(\n      <ImageEditorModal\n        engine={engine}\n        ui={uiState}\n        isOpen={isOpen}\n        saveLabel={configRef.current.saveLabel || 'Save'}\n      />\n    )\n  }, [uiState, isOpen])\n\n  return engineRef.current as ImageEditorInstance\n}\n"],"names":["useImageEditor","config","configRef","useRef","engineRef","uiState","setUiState","useState","isOpen","setIsOpen","initial","PictureStudioEngine","result","studio","current","ext","file","asset","useEffect","engine","onOpen","notifyNativeImageEditorState","onClose","stickersKey","lastStickersKeyRef","rootRef","containerRef","createRoot","React","ImageEditorModal"],"mappings":";;;;;AAaO,SAASA,EAAeC,GAAgD;AAC7E,QAAMC,IAAYC,EAAOF,CAAM;AAC/B,EAAAC,EAAU,UAAUD;AAEpB,QAAMG,IAAYD,EAAiC,IAAI,GACjD,CAACE,GAASC,CAAU,IAAIC,EAAoC,IAAI,GAChE,CAACC,GAAQC,CAAS,IAAIF,EAAS,EAAK;AAE1C,MAAI,CAACH,EAAU,WAAW,OAAO,SAAW,KAAa;AACvD,UAAMM,IAAUR,EAAU;AAC1B,IAAAE,EAAU,UAAUO,EAAoB,OAAO;AAAA,MAC7C,GAAGD;AAAA,MACH,OAAOA,EAAQ,SAASA,EAAQ;AAAA,MAChC,QAAQ,OAAOE,GAAQC,MAAW;AAChC,cAAMC,IAAUZ,EAAU;AAC1B,YAAIY,EAAQ,eAAe;AACzB,gBAAMC,IAAMH,EAAO,SAAS,eAAe,QAAQ,OAC7CI,IAAO,IAAI,KAAK,CAACJ,EAAO,IAAI,GAAG,QAAQG,CAAG,IAAI;AAAA,YAClD,MAAMH,EAAO;AAAA,UAAA,CACd,GACKK,IAAQ,MAAMH,EAAQ,cAAcE,CAAI;AAC9C,UAAAF,EAAQ,OAAO,EAAE,GAAGF,GAAQ,GAAGK,EAAA,GAASJ,CAAM;AAC9C;AAAA,QACF;AACA,QAAAC,EAAQ,OAAOF,GAAQC,CAAM;AAAA,MAC/B;AAAA,MACA,YAAYP;AAAA,IAAA,CACb;AAAA,EACH;AAEA,EAAAY,EAAU,MAAM;AACd,UAAMC,IAASf,EAAU;AACzB,QAAI,CAACe,EAAQ;AACb,UAAMC,IAAS,MAAM;AACnB,MAAAX,EAAU,EAAI,GACdY,EAA6B,EAAI;AAAA,IACnC,GACMC,IAAU,MAAM;AACpB,MAAAb,EAAU,EAAK,GACfY,EAA6B,EAAK;AAAA,IACpC;AACA,WAAAF,EAAO,GAAG,QAAQC,CAAM,GACxBD,EAAO,GAAG,SAASG,CAAO,GACnB,MAAM;AACX,MAAAH,EAAO,IAAI,QAAQC,CAAM,GACzBD,EAAO,IAAI,SAASG,CAAO,GAC3BD,EAA6B,EAAK,GAClCF,EAAO,QAAA;AAAA,IACT;AAAA,EACF,GAAG,CAAA,CAAE;AAEL,QAAMI,KAAetB,EAAO,YAAY,CAAA,GAAI,KAAK,GAAG,GAC9CuB,IAAqBrB,EAAsB,IAAI;AACrD,EAAAe,EAAU,MAAM;AACd,UAAMC,IAASf,EAAU;AACzB,IAAI,CAACe,KAAUK,EAAmB,YAAYD,MAC9CC,EAAmB,UAAUD,GAC7BJ,EAAO,YAAYlB,EAAO,YAAY,CAAA,CAAE;AAAA,EAE1C,GAAG,CAACsB,CAAW,CAAC;AAEhB,QAAME,IAAUtB,EAAoB,IAAI,GAClCuB,IAAevB,EAA8B,IAAI;AACvD,SAAAe,EAAU,MACD,MAAM;AACX,IAAAO,EAAQ,SAAS,QAAA,GACjBC,EAAa,SAAS,OAAA,GACtBD,EAAQ,UAAU,MAClBC,EAAa,UAAU;AAAA,EACzB,GACC,CAAA,CAAE,GAELR,EAAU,MAAM;AACd,UAAMC,IAASf,EAAU;AACzB,IAAKe,MACAO,EAAa,YAChBA,EAAa,UAAU,SAAS,cAAc,KAAK,GACnD,SAAS,KAAK,YAAYA,EAAa,OAAO,GAC9CD,EAAQ,UAAUE,EAAWD,EAAa,OAAO,IAEnDD,EAAQ,QAAS;AAAA,MACfG,gBAAAA,EAAA;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,QAAAV;AAAA,UACA,IAAId;AAAA,UACJ,QAAAG;AAAA,UACA,WAAWN,EAAU,QAAQ,aAAa;AAAA,QAAA;AAAA,MAAA;AAAA,IAC5C;AAAA,EAEJ,GAAG,CAACG,GAASG,CAAM,CAAC,GAEbJ,EAAU;AACnB;"}

package/dist/index.es46.js

@@ -1,74 +1,172 @@
-import { Typography as m } from "./index.es17.js";
-import e from "react";
-import { Skeleton as S } from "./index.es12.js";
-const u = {
-  /**
-   * utility function to get full and half stars count
-   */
-  getStarsCount: (r) => {
-    if (r < 0 || r > 100) return { full: 0, half: 0, error: !0 };
-    const a = (i, n) => ({
-      full: i,
-      half: n,
-      error: !1
-    }), t = Math.floor(r / 20), l = r % 20;
-    return l === 0 ? a(t, 0) : l / 10 <= 1 ? a(t, 1) : a(t + 1, 0);
-  },
-  /**
-   * utility function to convert score from string to 'out of 5'
-   */
-  getScoreOutOf5: function(r) {
-    const { full: a = 0, half: t = 0, error: l = !1 } = this.getStarsCount(r);
-    return l ? 0 : a * 1 + t * 0.5;
-  }
-}, x = (r) => {
-  const {
-    score: a = 0,
-    starSize: t = 24,
-    starGap: l = 1,
-    isLoading: i = !1,
-    showScore: n = !1,
-    showScorePercentage: p = !1
-  } = r, f = isFinite(a) ? +a : 0, {
-    full: g = 0,
-    half: h = 0,
-    error: d = !1
-  } = u.getStarsCount(f), y = 5 - (g + h), c = {
-    height: t,
-    width: t
-  };
-  if (i) {
-    const o = 5 * t + 4 * l, s = t;
-    return /* @__PURE__ */ e.createElement(S, { style: { width: o, height: s } });
+import { Badge as y } from "./index.es8.js";
+import w from "./index.es18.js";
+import { Typography as d } from "./index.es19.js";
+import { Dropdown as _ } from "./index.es22.js";
+import { cn as f } from "./index.es89.js";
+import e, { useState as S } from "react";
+import { NavbarIconVariants as k } from "./index.es113.js";
+import { AvatarDemo as A } from "./index.es6.js";
+import { CreditSheet as I } from "./index.es114.js";
+const O = ({ name: t = "", email: a = "" }) => {
+  if (!(t || a)) return null;
+  const r = "text-ellipsis overflow-hidden";
+  return /* @__PURE__ */ e.createElement("div", { className: "flex flex-col px-2" }, t && /* @__PURE__ */ e.createElement(
+    d,
+    {
+      variant: "body4",
+      className: f("text-light-1", r)
+    },
+    t
+  ), a && /* @__PURE__ */ e.createElement(
+    d,
+    {
+      variant: "body5",
+      className: f("text-light-3", r)
+    },
+    a
+  ));
+}, m = ({
+  alt: t,
+  className: a,
+  isActive: r = !1,
+  isNew: l = !1,
+  src: p,
+  tooltipText: n = "",
+  wrapper: E = null,
+  onClick: i
+}) => {
+  const c = (s) => E?.(s) ?? s, o = /* @__PURE__ */ e.createElement(
+    "div",
+    {
+      className: f(k({ isActive: r }), a),
+      ...i && { onClick: i }
+    },
+    /* @__PURE__ */ e.createElement("img", { src: p, alt: t }),
+    /* @__PURE__ */ e.createElement(D, { isNew: l })
+  );
+  return c(
+    n ? /* @__PURE__ */ e.createElement("div", { className: "relative" }, /* @__PURE__ */ e.createElement(
+      w,
+      {
+        content: "",
+        headerText: /* @__PURE__ */ e.createElement("div", { className: "flex items-center gap-2" }, l && /* @__PURE__ */ e.createElement(y, { variant: "gradient", size: "sm" }, "NEW"), /* @__PURE__ */ e.createElement("div", null, n)),
+        sideOffset: 24,
+        triggerElement: o,
+        delayDuration: 100,
+        side: "right"
+      }
+    )) : o
+  );
+}, C = () => /* @__PURE__ */ e.createElement("div", { className: "my-1 h-[1px] w-10 bg-white opacity-20" }), D = ({ isNew: t }) => t ? /* @__PURE__ */ e.createElement("div", { className: "absolute w-[6px] h-[6px] rounded-full bottom-1 right-1 bg-secondary-2" }) : null, L = ({
+  src: t,
+  popoverOptions: a,
+  name: r = "",
+  email: l = ""
+}) => /* @__PURE__ */ e.createElement(
+  _,
+  {
+    dropdownContentProps: { sideOffset: 24, side: "right", align: "end" },
+    trigger: (
+      // div required as unable to open up the popup without it
+      /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement(
+        A,
+        {
+          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 cursor-pointer"
+            }
+          )
+        }
+      ))
+    ),
+    header: /* @__PURE__ */ e.createElement(O, { name: r, email: l }),
+    optionGroups: a
   }
-  return d ? /* @__PURE__ */ e.createElement(m, { variant: "display1", className: "text-light-1" }, "NA") : /* @__PURE__ */ e.createElement("div", { className: "flex items-center", style: { gap: l } }, /* @__PURE__ */ e.createElement("div", { className: "flex", style: { gap: l } }, Array(g).fill(1).map((o, s) => /* @__PURE__ */ e.createElement(
+), q = ({
+  onClick: t
+}) => /* @__PURE__ */ e.createElement(
+  d,
+  {
+    variant: "body4",
+    className: "text-center text-white cursor-pointer",
+    onClick: t
+  },
+  "Login"
+), P = ({ src: t, alt: a }) => /* @__PURE__ */ e.createElement("img", { src: t, alt: a, className: "w-10 h-auto" }), $ = ({
+  credits: t,
+  onClick: a
+}) => t >= 0 && /* @__PURE__ */ e.createElement(
+  "div",
+  {
+    className: "rounded brand-primary-secondary-gradient flex gap-[2px] h-auto box-border p-1 w-10 flex-wrap justify-center cursor-pointer",
+    onClick: a
+  },
+  t > 9999 ? /* @__PURE__ */ e.createElement(
     "img",
     {
-      key: s,
-      src: "https://frontend-static-files.geoiq.io/strapi/rating_star_full_0ddf33ca2f.svg",
-      alt: "full-star",
-      ...c
+      src: "https://frontend-static-files.geoiq.io/strapi/infinity_7d62ad2947.svg",
+      alt: "infinity icon",
+      className: "w-4 h-4"
     }
-  )), Array(h).fill(1).map((o, s) => /* @__PURE__ */ e.createElement(
+  ) : /* @__PURE__ */ e.createElement(d, { variant: "body5", className: "text-white" }, t),
+  /* @__PURE__ */ e.createElement(
     "img",
     {
-      key: s,
-      src: "https://frontend-static-files.geoiq.io/strapi/rating_star_half_dbe5b8f659.svg",
-      alt: "half-star",
-      ...c
+      src: "https://frontend-static-files.geoiq.io/strapi/navbar_credits_247858e26a.svg",
+      alt: "coin icon",
+      className: "w-4 h-4"
     }
-  )), Array(y).fill(1).map((o, s) => /* @__PURE__ */ e.createElement(
-    "img",
+  )
+), V = ({
+  login: t,
+  icons: a,
+  credits: r = -1,
+  totalCredits: l = null,
+  profile: p,
+  clickDisable: n = !0,
+  logo: E,
+  className: i = "",
+  id: c,
+  onRequestCredits: o,
+  onProceedToPayment: s,
+  buyCreditsOptions: v,
+  minimumCreditsToBuy: u,
+  requestOnly: h
+}) => {
+  const [x, g] = S(!1);
+  return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
+    "div",
+    {
+      className: f(
+        "w-16 bg-dark-2 px-3 py-4 h-full flex flex-col justify-between",
+        i
+      ),
+      id: c
+    },
+    /* @__PURE__ */ e.createElement("div", { className: "flex flex-col items-center gap-8" }, /* @__PURE__ */ e.createElement(P, { ...E }), /* @__PURE__ */ e.createElement("div", { className: "flex flex-col gap-3" }, (a?.list ?? []).map((b, N) => /* @__PURE__ */ e.createElement(m, { key: N, ...b })))),
+    /* @__PURE__ */ e.createElement("div", { className: "flex flex-col items-center gap-2" }, a.chat && /* @__PURE__ */ e.createElement(m, { ...a.chat }), a.notification && /* @__PURE__ */ e.createElement(m, { ...a.notification }), /* @__PURE__ */ e.createElement(m, { ...a.help }), /* @__PURE__ */ e.createElement($, { credits: r, onClick: () => g(!0) }), /* @__PURE__ */ e.createElement(C, null), t?.isLoggedIn ? /* @__PURE__ */ e.createElement(L, { ...p }) : /* @__PURE__ */ e.createElement(q, { ...t }))
+  ), !n && /* @__PURE__ */ e.createElement(
+    I,
     {
-      key: s,
-      src: "https://frontend-static-files.geoiq.io/strapi/rating_star_empty_e05d9a2463.svg",
-      alt: "empty-star",
-      ...c
+      open: x,
+      onClose: () => g(!1),
+      credit_details: l ? `Available: ${r}/${l}` : `Available: ${r}`,
+      onRequestCredits: o,
+      onProceedToPayment: s,
+      containerId: "navbar-container",
+      buyCreditsOptions: v,
+      minimumCreditsToBuy: u,
+      requestOnly: h
     }
-  ))), n ? /* @__PURE__ */ e.createElement(m, { variant: "body5", className: "ml-1 text-light-3" }, u.getScoreOutOf5(f).toFixed(1), "/5") : null, p ? /* @__PURE__ */ e.createElement(m, { variant: "body5", className: "ml-1 text-light-3" }, "(", f, "%)") : null);
+  ));
 };
 export {
-  x as StarScore,
-  u as StarScoreUtils
+  V as NavbarDesktop
 };
 //# sourceMappingURL=index.es46.js.map