geoiq-frontend-ui-kit 2.0.2 → 2.0.4

package/dist/index.es134.js

@@ -1,10 +1,91 @@
-function o(n, t) {
-  return n.replace(/\{\{(\w+)\}\}/g, (l, e) => {
-    const r = t[e];
-    return r != null ? String(r) : "";
-  });
-}
+import * as e from "react";
+import { Slot as o } from "@radix-ui/react-slot";
+import { ChevronRight as l, MoreHorizontal as c } from "lucide-react";
+import { cn as m } from "./index.es89.js";
+const i = e.forwardRef(({ ...r }, a) => /* @__PURE__ */ e.createElement("nav", { ref: a, "aria-label": "breadcrumb", ...r }));
+i.displayName = "Breadcrumb";
+const d = e.forwardRef(({ className: r, ...a }, t) => /* @__PURE__ */ e.createElement(
+  "ol",
+  {
+    ref: t,
+    className: m(
+      "flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5",
+      r
+    ),
+    ...a
+  }
+));
+d.displayName = "BreadcrumbList";
+const p = e.forwardRef(({ className: r, ...a }, t) => /* @__PURE__ */ e.createElement(
+  "li",
+  {
+    ref: t,
+    className: m("inline-flex items-center gap-1.5", r),
+    ...a
+  }
+));
+p.displayName = "BreadcrumbItem";
+const u = e.forwardRef(({ asChild: r, className: a, ...t }, s) => {
+  const n = r ? o : "a";
+  return /* @__PURE__ */ e.createElement(
+    n,
+    {
+      ref: s,
+      className: m("transition-colors hover:text-foreground", a),
+      ...t
+    }
+  );
+});
+u.displayName = "BreadcrumbLink";
+const f = e.forwardRef(({ className: r, ...a }, t) => /* @__PURE__ */ e.createElement(
+  "span",
+  {
+    ref: t,
+    role: "link",
+    "aria-disabled": "true",
+    "aria-current": "page",
+    className: m("font-normal text-foreground", r),
+    ...a
+  }
+));
+f.displayName = "BreadcrumbPage";
+const b = ({
+  children: r,
+  className: a,
+  ...t
+}) => /* @__PURE__ */ e.createElement(
+  "li",
+  {
+    role: "presentation",
+    "aria-hidden": "true",
+    className: m("[&>svg]:size-3.5", a),
+    ...t
+  },
+  r ?? /* @__PURE__ */ e.createElement(l, null)
+);
+b.displayName = "BreadcrumbSeparator";
+const N = ({
+  className: r,
+  ...a
+}) => /* @__PURE__ */ e.createElement(
+  "span",
+  {
+    role: "presentation",
+    "aria-hidden": "true",
+    className: m("flex h-9 w-9 items-center justify-center", r),
+    ...a
+  },
+  /* @__PURE__ */ e.createElement(c, { className: "h-4 w-4" }),
+  /* @__PURE__ */ e.createElement("span", { className: "sr-only" }, "More")
+);
+N.displayName = "BreadcrumbElipssis";
 export {
-  o as interpolateUrl
+  i as Breadcrumb,
+  N as BreadcrumbEllipsis,
+  p as BreadcrumbItem,
+  u as BreadcrumbLink,
+  d as BreadcrumbList,
+  f as BreadcrumbPage,
+  b as BreadcrumbSeparator
 };
 //# sourceMappingURL=index.es134.js.map

package/dist/index.es134.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es134.js","sources":["../src/components/molecules/creatable-multi-combobox/creatable-multi-combobox.types.ts"],"sourcesContent":["import { PopoverContent } from '@/components/unstyled/popover/popover-components'\nimport React from 'react'\n\nexport type CreatableOption = {\n  id: string\n  name: string\n  disabled?: boolean\n  icon?: React.ReactElement\n}\n\nexport type PopoverContentProps = React.ComponentPropsWithoutRef<\n  typeof PopoverContent\n>\n\n/** Replaces {{fieldId}} in URL with urlTemplateData[fieldId] */\nexport function interpolateUrl(\n  url: string,\n  data: Record<string, unknown>\n): string {\n  return url.replace(/\\{\\{(\\w+)\\}\\}/g, (_, key) => {\n    const val = data[key]\n    return val != null ? String(val) : ''\n  })\n}\n\nexport type CreatableMultiComboboxPropsType = {\n  /** API URL to fetch options (POST). Supports {{fieldId}} for form value interpolation. Ignored if fetchOptions provided */\n  optionsUrl?: string\n  /** API URL to create new option (POST). Supports {{fieldId}} for form value interpolation. Ignored if createOption provided */\n  createOptionUrl?: string\n  /** Override: custom fetch for options. When provided, optionsUrl is ignored */\n  fetchOptions?: () => Promise<CreatableOption[]>\n  /** Override: custom create handler. When provided, createOptionUrl is ignored */\n  createOption?: (value: string) => Promise<CreatableOption>\n  /** Headers to include in API requests (e.g. Authorization from cookie). Can be sync or async */\n  requestHeaders?:\n    | Record<string, string>\n    | (() => Record<string, string> | Promise<Record<string, string>>)\n  /** Request body for fetch options API. When provided, overrides default { ...urlTemplateData, fieldId } */\n  optionsRequestBody?: Record<string, unknown>\n  /** Request body for create/upsert option API. Merged with { [createOptionValueKey]: value }. E.g. { type: \"zone\" } */\n  createOptionRequestBody?: Record<string, unknown>\n  /** Key for the typed value in create body. Default \"value\". Use \"email\" if API expects that key */\n  createOptionValueKey?: string\n  /** Extra body fields for create (e.g. { email: userEmail } from cookie). Merged last */\n  createOptionExtraBody?:\n    | Record<string, unknown>\n    | (() => Record<string, unknown> | Promise<Record<string, unknown>>)\n  /** When true, createOptionExtraBody is not merged (use when value key is \"email\" and extra would conflict) */\n  skipCreateOptionExtraBody?: boolean\n  /** Form values for URL interpolation (e.g. {{country}} -> values.country) */\n  urlTemplateData?: Record<string, unknown>\n  value: string[]\n  fieldId: string\n  placeholder?: string\n  searchPlaceholder?: string\n  emptyMessage?: string\n  addCustomMessage?: (typedValue: string) => string\n  /** Minimum number of values that must be selected */\n  minSelected?: number\n  /** Maximum number of values that can be selected */\n  maxSelected?: number\n  onChange: (value: string[]) => void\n  container?: Element | null | undefined\n}\n"],"names":["interpolateUrl","url","data","_","key","val"],"mappings":"AAeO,SAASA,EACdC,GACAC,GACQ;AACR,SAAOD,EAAI,QAAQ,kBAAkB,CAACE,GAAGC,MAAQ;AAC/C,UAAMC,IAAMH,EAAKE,CAAG;AACpB,WAAOC,KAAO,OAAO,OAAOA,CAAG,IAAI;AAAA,EACrC,CAAC;AACH;"}
+{"version":3,"file":"index.es134.js","sources":["../src/components/molecules/breadcrumb/breadcrumb-components.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { ChevronRight, MoreHorizontal } from 'lucide-react'\n\nimport { cn } from '@/lib/utils'\n\nconst Breadcrumb = React.forwardRef<\n  HTMLElement,\n  React.ComponentPropsWithoutRef<'nav'> & {\n    separator?: React.ReactNode\n  }\n>(({ ...props }, ref) => <nav ref={ref} aria-label=\"breadcrumb\" {...props} />)\nBreadcrumb.displayName = 'Breadcrumb'\n\nconst BreadcrumbList = React.forwardRef<\n  HTMLOListElement,\n  React.ComponentPropsWithoutRef<'ol'>\n>(({ className, ...props }, ref) => (\n  <ol\n    ref={ref}\n    className={cn(\n      'flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5',\n      className\n    )}\n    {...props}\n  />\n))\nBreadcrumbList.displayName = 'BreadcrumbList'\n\nconst BreadcrumbItem = React.forwardRef<\n  HTMLLIElement,\n  React.ComponentPropsWithoutRef<'li'>\n>(({ className, ...props }, ref) => (\n  <li\n    ref={ref}\n    className={cn('inline-flex items-center gap-1.5', className)}\n    {...props}\n  />\n))\nBreadcrumbItem.displayName = 'BreadcrumbItem'\n\nconst BreadcrumbLink = React.forwardRef<\n  HTMLAnchorElement,\n  React.ComponentPropsWithoutRef<'a'> & {\n    asChild?: boolean\n  }\n>(({ asChild, className, ...props }, ref) => {\n  const Comp = asChild ? Slot : 'a'\n\n  return (\n    <Comp\n      ref={ref}\n      className={cn('transition-colors hover:text-foreground', className)}\n      {...props}\n    />\n  )\n})\nBreadcrumbLink.displayName = 'BreadcrumbLink'\n\nconst BreadcrumbPage = React.forwardRef<\n  HTMLSpanElement,\n  React.ComponentPropsWithoutRef<'span'>\n>(({ className, ...props }, ref) => (\n  <span\n    ref={ref}\n    role=\"link\"\n    aria-disabled=\"true\"\n    aria-current=\"page\"\n    className={cn('font-normal text-foreground', className)}\n    {...props}\n  />\n))\nBreadcrumbPage.displayName = 'BreadcrumbPage'\n\nconst BreadcrumbSeparator = ({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<'li'>) => (\n  <li\n    role=\"presentation\"\n    aria-hidden=\"true\"\n    className={cn('[&>svg]:size-3.5', className)}\n    {...props}\n  >\n    {children ?? <ChevronRight />}\n  </li>\n)\nBreadcrumbSeparator.displayName = 'BreadcrumbSeparator'\n\nconst BreadcrumbEllipsis = ({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) => (\n  <span\n    role=\"presentation\"\n    aria-hidden=\"true\"\n    className={cn('flex h-9 w-9 items-center justify-center', className)}\n    {...props}\n  >\n    <MoreHorizontal className=\"h-4 w-4\" />\n    <span className=\"sr-only\">More</span>\n  </span>\n)\nBreadcrumbEllipsis.displayName = 'BreadcrumbElipssis'\n\nexport {\n  Breadcrumb,\n  BreadcrumbList,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n  BreadcrumbEllipsis,\n}\n"],"names":["Breadcrumb","React","props","ref","BreadcrumbList","className","cn","BreadcrumbItem","BreadcrumbLink","asChild","Comp","Slot","BreadcrumbPage","BreadcrumbSeparator","children","ChevronRight","BreadcrumbEllipsis","MoreHorizontal"],"mappings":";;;;AAMA,MAAMA,IAAaC,EAAM,WAKvB,CAAC,EAAE,GAAGC,EAAA,GAASC,MAAQ,gBAAAF,EAAA,cAAC,SAAI,KAAAE,GAAU,cAAW,cAAc,GAAGD,GAAO,CAAE;AAC7EF,EAAW,cAAc;AAEzB,MAAMI,IAAiBH,EAAM,WAG3B,CAAC,EAAE,WAAAI,GAAW,GAAGH,EAAA,GAASC,MAC1B,gBAAAF,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAE;AAAA,IACA,WAAWG;AAAA,MACT;AAAA,MACAD;AAAA,IAAA;AAAA,IAED,GAAGH;AAAA,EAAA;AACN,CACD;AACDE,EAAe,cAAc;AAE7B,MAAMG,IAAiBN,EAAM,WAG3B,CAAC,EAAE,WAAAI,GAAW,GAAGH,EAAA,GAASC,MAC1B,gBAAAF,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAE;AAAA,IACA,WAAWG,EAAG,oCAAoCD,CAAS;AAAA,IAC1D,GAAGH;AAAA,EAAA;AACN,CACD;AACDK,EAAe,cAAc;AAE7B,MAAMC,IAAiBP,EAAM,WAK3B,CAAC,EAAE,SAAAQ,GAAS,WAAAJ,GAAW,GAAGH,EAAA,GAASC,MAAQ;AAC3C,QAAMO,IAAOD,IAAUE,IAAO;AAE9B,SACE,gBAAAV,EAAA;AAAA,IAACS;AAAA,IAAA;AAAA,MACC,KAAAP;AAAA,MACA,WAAWG,EAAG,2CAA2CD,CAAS;AAAA,MACjE,GAAGH;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;AACDM,EAAe,cAAc;AAE7B,MAAMI,IAAiBX,EAAM,WAG3B,CAAC,EAAE,WAAAI,GAAW,GAAGH,EAAA,GAASC,MAC1B,gBAAAF,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAE;AAAA,IACA,MAAK;AAAA,IACL,iBAAc;AAAA,IACd,gBAAa;AAAA,IACb,WAAWG,EAAG,+BAA+BD,CAAS;AAAA,IACrD,GAAGH;AAAA,EAAA;AACN,CACD;AACDU,EAAe,cAAc;AAE7B,MAAMC,IAAsB,CAAC;AAAA,EAC3B,UAAAC;AAAA,EACA,WAAAT;AAAA,EACA,GAAGH;AACL,MACE,gBAAAD,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,MAAK;AAAA,IACL,eAAY;AAAA,IACZ,WAAWK,EAAG,oBAAoBD,CAAS;AAAA,IAC1C,GAAGH;AAAA,EAAA;AAAA,EAEHY,qCAAaC,GAAA,IAAa;AAC7B;AAEFF,EAAoB,cAAc;AAElC,MAAMG,IAAqB,CAAC;AAAA,EAC1B,WAAAX;AAAA,EACA,GAAGH;AACL,MACE,gBAAAD,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,MAAK;AAAA,IACL,eAAY;AAAA,IACZ,WAAWK,EAAG,4CAA4CD,CAAS;AAAA,IAClE,GAAGH;AAAA,EAAA;AAAA,EAEJ,gBAAAD,EAAA,cAACgB,GAAA,EAAe,WAAU,UAAA,CAAU;AAAA,EACpC,gBAAAhB,EAAA,cAAC,QAAA,EAAK,WAAU,UAAA,GAAU,MAAI;AAChC;AAEFe,EAAmB,cAAc;"}

package/dist/index.es135.js

@@ -1,40 +1,20 @@
-import * as e from "react";
-import { ChevronLeft as r, ChevronRight as s, MoreHorizontal as l } from "lucide-react";
-import { Button as n } from "./index.es9.js";
-import { Typography as o } from "./index.es19.js";
-const m = ({ className: a, ...t }) => /* @__PURE__ */ e.createElement(
-  "nav",
+import { cva as t } from "class-variance-authority";
+const r = t(
+  "rounded hover:text-light-2 hover:stroke-light-1 hover:bg-light-3 ",
   {
-    role: "navigation",
-    "aria-label": "pagination",
-    className: `mx-auto flex w-full justify-center ${a}`,
-    ...t
+    variants: {
+      type: {
+        icon: "p-1",
+        text: "px-2 py-1"
+      },
+      isSelected: {
+        true: "text-light-2 stroke-light-1 bg-light-3",
+        false: "text-light-3 stroke-light-2"
+      }
+    }
   }
 );
-m.displayName = "Pagination";
-const c = e.forwardRef(({ className: a, ...t }, i) => /* @__PURE__ */ e.createElement(
-  "ul",
-  {
-    ref: i,
-    className: `flex flex-row items-center gap-1 ${a}`,
-    ...t
-  }
-));
-c.displayName = "PaginationContent";
-const g = e.forwardRef(({ className: a, ...t }, i) => /* @__PURE__ */ e.createElement("li", { ref: i, className: a, ...t }));
-g.displayName = "PaginationItem";
-const p = (a) => /* @__PURE__ */ e.createElement(n, { variant: "teritiary", size: "sm", ...a }, /* @__PURE__ */ e.createElement(r, { className: "w-4 h-4" }), /* @__PURE__ */ e.createElement(o, { variant: "body4" }, "Previous"));
-p.displayName = "PaginationPrevious";
-const P = (a) => /* @__PURE__ */ e.createElement(n, { variant: "teritiary", size: "sm", ...a }, /* @__PURE__ */ e.createElement(o, { variant: "body4" }, "Next"), /* @__PURE__ */ e.createElement(s, { className: "w-4 h-4" }));
-P.displayName = "PaginationNext";
-const f = (a) => /* @__PURE__ */ e.createElement(n, { variant: "teritiary", size: "sm", ...a }, /* @__PURE__ */ e.createElement(l, { className: "w-4 h-4 stroke-light-1" }));
-f.displayName = "PaginationEllipsis";
 export {
-  m as Pagination,
-  c as PaginationContent,
-  f as PaginationEllipsis,
-  g as PaginationItem,
-  P as PaginationNext,
-  p as PaginationPrevious
+  r as CrumbVariants
 };
 //# sourceMappingURL=index.es135.js.map

package/dist/index.es135.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es135.js","sources":["../src/components/molecules/pagination/pagination-components.tsx"],"sourcesContent":["import * as React from 'react'\nimport { ChevronLeft, ChevronRight, MoreHorizontal } from 'lucide-react'\nimport { Button } from '@/components/atoms/button'\nimport { Typography } from '@/components/atoms/typography'\n\n// import { ButtonProps } from 'geoiq-frontend-ui-kit'\n\nconst Pagination = ({ className, ...props }: React.ComponentProps<'nav'>) => (\n  <nav\n    role=\"navigation\"\n    aria-label=\"pagination\"\n    className={`mx-auto flex w-full justify-center ${className}`}\n    {...props}\n  />\n)\nPagination.displayName = 'Pagination'\n\nconst PaginationContent = React.forwardRef<\n  HTMLUListElement,\n  React.ComponentProps<'ul'>\n>(({ className, ...props }, ref) => (\n  <ul\n    ref={ref}\n    className={`flex flex-row items-center gap-1 ${className}`}\n    {...props}\n  />\n))\nPaginationContent.displayName = 'PaginationContent'\n\nconst PaginationItem = React.forwardRef<\n  HTMLLIElement,\n  React.ComponentProps<'li'>\n>(({ className, ...props }, ref) => (\n  <li ref={ref} className={className} {...props} />\n))\nPaginationItem.displayName = 'PaginationItem'\n\n// type PaginationLinkProps = RemixLinkProps &\n//   React.RefAttributes<HTMLAnchorElement>\n// Pick<ButtonProps, 'size'> &\n\n// const PaginationLink = (props: PaginationLinkProps) => <Link {...props} />\n\n// PaginationLink.displayName = 'PaginationLink'\n\nconst PaginationPrevious = (props: React.ComponentProps<typeof Button>) => (\n  <Button variant=\"teritiary\" size=\"sm\" {...props}>\n    <ChevronLeft className=\"w-4 h-4\" />\n    <Typography variant=\"body4\">Previous</Typography>\n  </Button>\n)\nPaginationPrevious.displayName = 'PaginationPrevious'\n\nconst PaginationNext = (props: React.ComponentProps<typeof Button>) => (\n  <Button variant=\"teritiary\" size=\"sm\" {...props}>\n    <Typography variant=\"body4\">Next</Typography>\n    <ChevronRight className=\"w-4 h-4\" />\n  </Button>\n)\nPaginationNext.displayName = 'PaginationNext'\n\nconst PaginationEllipsis = (props: React.ComponentProps<typeof Button>) => (\n  <Button variant=\"teritiary\" size=\"sm\" {...props}>\n    <MoreHorizontal className=\"w-4 h-4 stroke-light-1\" />\n  </Button>\n)\nPaginationEllipsis.displayName = 'PaginationEllipsis'\n\nexport {\n  Pagination,\n  PaginationContent,\n  PaginationEllipsis,\n  PaginationItem,\n  // PaginationLink,\n  PaginationNext,\n  PaginationPrevious,\n}\n"],"names":["Pagination","className","props","React","PaginationContent","ref","PaginationItem","PaginationPrevious","Button","ChevronLeft","Typography","PaginationNext","ChevronRight","PaginationEllipsis","MoreHorizontal"],"mappings":";;;;AAOA,MAAMA,IAAa,CAAC,EAAE,WAAAC,GAAW,GAAGC,QAClC,gBAAAC,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,MAAK;AAAA,IACL,cAAW;AAAA,IACX,WAAW,sCAAsCF,CAAS;AAAA,IACzD,GAAGC;AAAA,EAAA;AACN;AAEFF,EAAW,cAAc;AAEzB,MAAMI,IAAoBD,EAAM,WAG9B,CAAC,EAAE,WAAAF,GAAW,GAAGC,EAAA,GAASG,MAC1B,gBAAAF,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAE;AAAA,IACA,WAAW,oCAAoCJ,CAAS;AAAA,IACvD,GAAGC;AAAA,EAAA;AACN,CACD;AACDE,EAAkB,cAAc;AAEhC,MAAME,IAAiBH,EAAM,WAG3B,CAAC,EAAE,WAAAF,GAAW,GAAGC,KAASG,sCACzB,MAAA,EAAG,KAAAA,GAAU,WAAAJ,GAAuB,GAAGC,GAAO,CAChD;AACDI,EAAe,cAAc;AAU7B,MAAMC,IAAqB,CAACL,MAC1B,gBAAAC,EAAA,cAACK,KAAO,SAAQ,aAAY,MAAK,MAAM,GAAGN,KACxC,gBAAAC,EAAA,cAACM,GAAA,EAAY,WAAU,UAAA,CAAU,mCAChCC,GAAA,EAAW,SAAQ,QAAA,GAAQ,UAAQ,CACtC;AAEFH,EAAmB,cAAc;AAEjC,MAAMI,IAAiB,CAACT,MACtB,gBAAAC,EAAA,cAACK,KAAO,SAAQ,aAAY,MAAK,MAAM,GAAGN,KACxC,gBAAAC,EAAA,cAACO,GAAA,EAAW,SAAQ,QAAA,GAAQ,MAAI,GAChC,gBAAAP,EAAA,cAACS,GAAA,EAAa,WAAU,UAAA,CAAU,CACpC;AAEFD,EAAe,cAAc;AAE7B,MAAME,IAAqB,CAACX,MAC1B,gBAAAC,EAAA,cAACK,KAAO,SAAQ,aAAY,MAAK,MAAM,GAAGN,EAAA,GACxC,gBAAAC,EAAA,cAACW,GAAA,EAAe,WAAU,0BAAyB,CACrD;AAEFD,EAAmB,cAAc;"}
+{"version":3,"file":"index.es135.js","sources":["../src/components/molecules/breadcrumb/breadcrumb.styles.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nexport const CrumbVariants = cva(\n  'rounded hover:text-light-2 hover:stroke-light-1 hover:bg-light-3 ',\n  {\n    variants: {\n      type: {\n        icon: 'p-1',\n        text: 'px-2 py-1',\n      },\n      isSelected: {\n        true: 'text-light-2 stroke-light-1 bg-light-3',\n        false: 'text-light-3 stroke-light-2',\n      },\n    },\n  }\n)\n"],"names":["CrumbVariants","cva"],"mappings":";AAEO,MAAMA,IAAgBC;AAAA,EAC3B;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,MAAM;AAAA,QACN,MAAM;AAAA,MAAA;AAAA,MAER,YAAY;AAAA,QACV,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,IACT;AAAA,EACF;AAEJ;"}

package/dist/index.es136.js

@@ -1,43 +1,277 @@
-import { cva as t } from "class-variance-authority";
-const e = t(
-  "inline-flex items-center justify-evenly p-1 text-muted-foreground",
-  {
-    variants: {
-      variant: {
-        primary: "bg-light-3 border rounded-xl  border-neutral-1",
-        secondary: "bg-background "
-      },
-      size: {
-        sm: "h-10 rounded-xl ",
-        md: "h-12 rounded-xl "
-      }
-    },
-    defaultVariants: {
-      variant: "primary",
-      size: "md"
+import e from "react";
+import { FONT_FAMILY as v } from "./index.es163.js";
+import { _Dialog as N } from "./index.es41.js";
+import { X as w, ChevronLeft as S, ChevronRight as C } from "lucide-react";
+import { Typography as i } from "./index.es19.js";
+import { ResponsiveContainer as d, BarChart as u, CartesianGrid as f, XAxis as g, YAxis as h, Tooltip as p, Bar as E } from "recharts";
+import { trendBoxStyles as k, trendValueStyles as F } from "./index.es164.js";
+const I = ({
+  data: r,
+  onToggle: t,
+  isOpen: n,
+  galleryActiveIndex: a,
+  setgalleryActiveIndex: l
+}) => {
+  const o = r && r.length, b = () => {
+    r && l((s) => (s + 1) % r?.length);
+  }, y = () => {
+    r && l(
+      (s) => (s - 1 + r.length) % r.length
+    );
+  }, x = (s) => {
+    l(s);
+  }, m = () => {
+    t();
+  };
+  return /* @__PURE__ */ e.createElement(
+    N,
+    {
+      open: n,
+      trigger: null,
+      contentClassName: "bg-transparent w-fit  border-0",
+      onInteractOutside: m,
+      body: /* @__PURE__ */ e.createElement("div", { className: "flex flex-col items-center justify-center w-full h-full max-w-3xl mx-auto" }, /* @__PURE__ */ e.createElement(
+        w,
+        {
+          size: 24,
+          color: "white",
+          className: "absolute z-50 cursor-pointer -right-10 -top-10",
+          onClick: m
+        }
+      ), /* @__PURE__ */ e.createElement("div", { className: "relative" }, /* @__PURE__ */ e.createElement("div", { className: "relative " }, o && /* @__PURE__ */ e.createElement(
+        "img",
+        {
+          key: r[a].image_url,
+          src: r[a].image_url,
+          alt: `Street ${a + 1}`,
+          className: "w-[500px] max-h-[80vh] object-contain flex-shrink-0"
+        }
+      )), /* @__PURE__ */ e.createElement("div", { className: "relative top-[-50%]  left-[-10%] flex row  w-[120%] justify-between" }, /* @__PURE__ */ e.createElement("div", { role: "button", tabIndex: 0, onClick: y }, /* @__PURE__ */ e.createElement(S, { size: 30, color: "white" })), /* @__PURE__ */ e.createElement("div", { role: "button", tabIndex: 0, onClick: b }, /* @__PURE__ */ e.createElement(C, { size: 30, color: "white" })))), /* @__PURE__ */ e.createElement("div", { className: "flex justify-center p-2 mt-4 space-x-2 rounded-lg" }, o && r.map((s, c) => /* @__PURE__ */ e.createElement(
+        "img",
+        {
+          key: c,
+          src: s.image_url,
+          alt: `Thumbnail ${c + 1}`,
+          onClick: () => x(c),
+          className: `w-20 h-auto rounded-lg cursor-pointer ${c === a ? "ring-2 ring-primary-1" : "ring-2 ring-transparent"} hover:ring-gray-300`
+        }
+      ))))
     }
+  );
+}, $ = ({ active: r, payload: t, label: n, year: a }) => {
+  if (r && t && t.length) {
+    const l = t[0]?.payload?.year, o = t[0]?.value;
+    return /* @__PURE__ */ e.createElement("div", { className: "flex flex-col bg-light-1 p-4 rounded-lg shadow-md min-w-[200px] gap-1" }, /* @__PURE__ */ e.createElement(i, { variant: "body6", className: "text-primary" }, `${n}'${l}`), /* @__PURE__ */ e.createElement("div", { className: "my-2 w-full h-px border border-stroke-1" }), /* @__PURE__ */ e.createElement("div", { className: "flex" }, /* @__PURE__ */ e.createElement(
+      "div",
+      {
+        className: "h-4 w-1 rounded-lg",
+        style: { backgroundColor: "#6D48EF" }
+      }
+    ), /* @__PURE__ */ e.createElement(i, { variant: "body6", className: "text-secondary mx-1" }, "Visits"), /* @__PURE__ */ e.createElement(i, { variant: "body4", className: "text-secondary ml-auto" }, ` ${o}`)));
   }
-), i = t(
-  "inline-flex w-full items-center justify-center whitespace-nowrap text-sm text-light-2 font-medium  disabled:pointer-events-none disabled:opacity-50  ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring ",
-  {
-    variants: {
-      size: {
-        sm: "h-8 text-[14px] p-1.5 ",
-        md: "h-10 text-[16px] p-2 "
+  return null;
+}, z = ({ active: r, payload: t, label: n }) => {
+  if (r && t && t.length) {
+    const a = t[0]?.payload?.distance, l = t[0]?.value;
+    return /* @__PURE__ */ e.createElement("div", { className: "flex bg-light-1 items-center justify-between rounded-lg shadow-md min-w-45 max-w-80 gap-2 p-2" }, /* @__PURE__ */ e.createElement(i, { variant: "body6", className: "text-primary" }, /* @__PURE__ */ e.createElement("div", { className: "flex h-full justify-between items-center p-2 gap-4" }, /* @__PURE__ */ e.createElement("div", null, n), /* @__PURE__ */ e.createElement("div", null, " ", a + "km"))), /* @__PURE__ */ e.createElement(
+      i,
+      {
+        variant: "body4",
+        className: "text-normal text-danger-1 ml-auto p-2"
       },
-      variant: {
-        primary: "rounded-lg data-[state=active]:bg-rest-s1 data-[state=active]:text-primary-1 data-[state=active]:border data-[state=active]:border-neutral-1 data-[state=active]:font-semibold data-[state=active]:shadow-sm ",
-        secondary: "data-[state=active]:bg-background data-[state=active]:text-primary-1 data-[state=active]:font-semibold data-[state=active]:border-b-2 data-[state=active]:border-primary-2 "
-      }
+      `${l}%`
+    ));
+  }
+  return null;
+}, K = ({ insights: r }) => /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement("div", { className: "flex flex-row mb-4 justify-between" }, /* @__PURE__ */ e.createElement(i, { variant: "body4", className: "text-light-2" }, "Store Insight:")), /* @__PURE__ */ e.createElement("div", { className: "bg-light-2 p-3 border border-neutral-1 rounded-lg" }, /* @__PURE__ */ e.createElement(i, { variant: "body4", className: "text-light-2 mb-2" }, "Presence of other brands in catchment:"), /* @__PURE__ */ e.createElement("div", { className: "flex gap-1 flex-wrap" }, r.map((t) => /* @__PURE__ */ e.createElement(
+  "div",
+  {
+    key: t.type,
+    className: "flex items-center gap-1 bg-light-1 px-2 py-1 rounded-full border border-neutral-1"
+  },
+  /* @__PURE__ */ e.createElement(
+    "img",
+    {
+      src: t.iconUrl,
+      alt: `${t.type} Icon`,
+      className: "w-4 h-4"
+    }
+  ),
+  /* @__PURE__ */ e.createElement(i, { variant: "body6", className: "text-light-2" }, t.count),
+  /* @__PURE__ */ e.createElement("div", { className: "flex items-center gap-1" }, /* @__PURE__ */ e.createElement(i, { variant: "body6", className: "text-light-2" }, t.type === "competitor" ? "Competitors" : "Complementary"))
+))))), R = ({
+  highlights: r
+}) => /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement(i, { variant: "body4", className: "text-light-2 mb-2" }, "Store Overview:"), /* @__PURE__ */ e.createElement("div", { className: "bg-light-2 p-1 border border-neutral-1 rounded-lg" }, /* @__PURE__ */ e.createElement("div", { className: "flex justify-evenly items-center" }, r.map((t, n) => /* @__PURE__ */ e.createElement(e.Fragment, { key: n }, /* @__PURE__ */ e.createElement("div", { className: "flex flex-col items-center justify-center text-center gap-1 p-" }, /* @__PURE__ */ e.createElement(
+  "div",
+  {
+    className: k({
+      trend: t.trend?.toString()
+    })
+  },
+  t.trend === 1 && /* @__PURE__ */ e.createElement(
+    "img",
+    {
+      src: "https://frontend-static-files.geoiq.io/strapi/trending_up_9d73d6fac5.svg",
+      alt: "High Trend",
+      className: "w-3 h-3"
+    }
+  ),
+  t.trend === -1 && /* @__PURE__ */ e.createElement(
+    "img",
+    {
+      src: "https://frontend-static-files.geoiq.io/strapi/trending_down_87adc7f3a6.svg",
+      alt: "Low Trend",
+      className: "w-3 h-3"
+    }
+  ),
+  t.value && t.trend ? /* @__PURE__ */ e.createElement(
+    i,
+    {
+      variant: "body5",
+      className: F({
+        trend: t.trend?.toString()
+      })
     },
-    defaultVariants: {
-      variant: "primary",
-      size: "md"
+    `${t.value}%`
+  ) : /* @__PURE__ */ e.createElement(i, { variant: "body5", className: "text-sm" }, "-")
+), t.name && /* @__PURE__ */ e.createElement(i, { variant: "body6", className: "text-light-2" }, t.name)), n < r.length - 1 && /* @__PURE__ */ e.createElement("div", { className: "border-l border-stroke-light-1 h-20 mx-1" })))))), M = ({ data: r }) => !r || r.every((t) => t.footfall === null) ? null : /* @__PURE__ */ e.createElement("div", { className: "w-full h-full bg-light-2 border border-neutral-1 p-3 rounded-lg" }, /* @__PURE__ */ e.createElement(i, { variant: "body4", className: "text-light-2 mb-4" }, "Footfall trends"), /* @__PURE__ */ e.createElement(d, { width: "100%", height: 300 }, /* @__PURE__ */ e.createElement(
+  u,
+  {
+    data: r,
+    margin: {
+      top: 3,
+      right: 3,
+      bottom: -10,
+      left: 3
+    },
+    barSize: 24
+  },
+  /* @__PURE__ */ e.createElement(f, { strokeDasharray: "10 10" }),
+  /* @__PURE__ */ e.createElement(
+    g,
+    {
+      dataKey: "month",
+      style: {
+        font: v,
+        fontSize: "12px",
+        fontWeight: "500",
+        color: "#4A4A4A"
+      }
     }
-  }
-);
+  ),
+  /* @__PURE__ */ e.createElement(
+    h,
+    {
+      className: "text-4-grey",
+      style: { fontSize: "12px", fontWeight: "500" },
+      tickFormatter: (t) => t > 1e6 ? `${t / 1e6}M` : t > 1e3 ? `${t / 1e3}K` : t,
+      label: {
+        value: "AVG FOOTFALL FOR A 3-MONTH PERIOD",
+        angle: -90,
+        position: "insideLeft",
+        dy: -5,
+        style: {
+          textAnchor: "middle",
+          fontSize: "12px",
+          fontWeight: "500"
+        }
+      }
+    }
+  ),
+  /* @__PURE__ */ e.createElement(p, { content: /* @__PURE__ */ e.createElement($, null) }),
+  /* @__PURE__ */ e.createElement(
+    E,
+    {
+      dataKey: "footfall",
+      fill: "#6D48EF",
+      radius: [4, 4, 4, 4],
+      style: { cursor: "pointer" }
+    }
+  )
+))), W = ({
+  data: r
+}) => {
+  if (!r || r.every((n) => n.cannibalisation === null))
+    return null;
+  const t = (n) => {
+    const a = r.length;
+    let l;
+    return a <= 1 ? l = 50 : a <= 6 ? l = 22 - (a - 1) * 4 : l = 6, n.length > l ? `${n.slice(0, l)}...` : n;
+  };
+  return /* @__PURE__ */ e.createElement("div", { className: "w-full h-full bg-light-2 border border-neutral-1 p-3 rounded-lg" }, /* @__PURE__ */ e.createElement(i, { variant: "body4", className: "text-light-2 mb-4" }, "Cannibalisation effects"), /* @__PURE__ */ e.createElement(d, { width: "100%", height: 300 }, /* @__PURE__ */ e.createElement(
+    u,
+    {
+      data: r,
+      margin: {
+        top: 3,
+        right: 3,
+        bottom: 5,
+        left: 3
+      },
+      barSize: 24
+    },
+    /* @__PURE__ */ e.createElement(f, { strokeDasharray: "10 10" }),
+    /* @__PURE__ */ e.createElement(
+      g,
+      {
+        dataKey: "store_name",
+        tickFormatter: t,
+        tickMargin: 10,
+        tick: (n) => {
+          const { x: a, y: l, payload: o } = n;
+          return /* @__PURE__ */ e.createElement("text", { x: a, y: l, textAnchor: "end", fill: "#666" }, /* @__PURE__ */ e.createElement("tspan", { x: a, style: { fontSize: 12 } }, t(o.value)), /* @__PURE__ */ e.createElement(
+            "tspan",
+            {
+              x: a,
+              dy: "1.5em",
+              style: {
+                fontSize: 10,
+                whiteSpace: "nowrap",
+                paddingTop: "2px"
+              }
+            },
+            r[o.index].distance + " kms"
+          ));
+        }
+      }
+    ),
+    /* @__PURE__ */ e.createElement(
+      h,
+      {
+        className: "text-4-grey",
+        style: { fontSize: "12px", fontWeight: "500" },
+        tickFormatter: (n) => n > 1e6 ? `${n / 1e6}M` : n > 1e3 ? `${n / 1e3}K` : n,
+        label: {
+          value: "CANNIBALISATION IN %",
+          angle: -90,
+          position: "insideLeft",
+          dy: -5,
+          style: {
+            textAnchor: "middle",
+            fontSize: "12px",
+            fontWeight: "500"
+          }
+        },
+        domain: [0, 100]
+      }
+    ),
+    /* @__PURE__ */ e.createElement(p, { content: /* @__PURE__ */ e.createElement(z, null) }),
+    /* @__PURE__ */ e.createElement(
+      E,
+      {
+        dataKey: "cannibalisation",
+        fill: "#F93232",
+        radius: [4, 4, 4, 4],
+        style: { cursor: "pointer" }
+      }
+    )
+  )));
+};
 export {
-  i as TabTriggerVariants,
-  e as TabsVariants
+  W as CannibalisationChartSection,
+  M as FootfallChartSection,
+  I as ReportSnippetGalleryView,
+  K as StoreInsightsSection,
+  R as StoreOverviewSection
 };
 //# sourceMappingURL=index.es136.js.map

package/dist/index.es136.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es136.js","sources":["../src/components/molecules/tabs/tabs.styles.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nexport const TabsVariants = cva(\n  'inline-flex items-center justify-evenly p-1 text-muted-foreground',\n  {\n    variants: {\n      variant: {\n        primary: 'bg-light-3 border rounded-xl  border-neutral-1',\n        secondary: 'bg-background ',\n      },\n      size: {\n        sm: 'h-10 rounded-xl ',\n        md: 'h-12 rounded-xl ',\n      },\n    },\n    defaultVariants: {\n      variant: 'primary',\n      size: 'md',\n    },\n  }\n)\n\nexport const TabTriggerVariants = cva(\n  'inline-flex w-full items-center justify-center whitespace-nowrap text-sm text-light-2 font-medium  disabled:pointer-events-none disabled:opacity-50  ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring ',\n  {\n    variants: {\n      size: {\n        sm: 'h-8 text-[14px] p-1.5 ',\n        md: 'h-10 text-[16px] p-2 ',\n      },\n      variant: {\n        primary:\n          'rounded-lg data-[state=active]:bg-rest-s1 data-[state=active]:text-primary-1 data-[state=active]:border data-[state=active]:border-neutral-1 data-[state=active]:font-semibold data-[state=active]:shadow-sm ',\n        secondary:\n          'data-[state=active]:bg-background data-[state=active]:text-primary-1 data-[state=active]:font-semibold data-[state=active]:border-b-2 data-[state=active]:border-primary-2 ',\n      },\n    },\n    defaultVariants: {\n      variant: 'primary',\n      size: 'md',\n    },\n  }\n)\n"],"names":["TabsVariants","cva","TabTriggerVariants"],"mappings":";AAEO,MAAMA,IAAeC;AAAA,EAC1B;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,WAAW;AAAA,MAAA;AAAA,MAEb,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IACN;AAAA,IAEF,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,MAAM;AAAA,IAAA;AAAA,EACR;AAEJ,GAEaC,IAAqBD;AAAA,EAChC;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,MAEN,SAAS;AAAA,QACP,SACE;AAAA,QACF,WACE;AAAA,MAAA;AAAA,IACJ;AAAA,IAEF,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,MAAM;AAAA,IAAA;AAAA,EACR;AAEJ;"}
+{"version":3,"file":"index.es136.js","sources":["../src/components/ui/report-snippet-view/report-snippet-view-components.tsx"],"sourcesContent":["import React, { FC } from 'react'\nimport { ReportSnippetViewNS } from './report-snippet-view.types'\n\nimport { FONT_FAMILY } from '@/lib/constants'\n\nimport { Dialog } from '@/components/organisms/dialog'\nimport { ChevronLeft, ChevronRight, X } from 'lucide-react'\nimport { Typography } from '@/components/atoms/typography'\nimport {\n  BarChart,\n  Bar,\n  XAxis,\n  YAxis,\n  CartesianGrid,\n  Tooltip,\n  ResponsiveContainer,\n} from 'recharts'\nimport { trendBoxStyles, trendValueStyles } from './report-snippet-view-style'\n\nconst ReportSnippetGalleryView: FC<{\n  onToggle: () => void\n  isOpen: boolean\n  data?: ReportSnippetViewNS.StreetViewData\n  galleryActiveIndex: number\n  setgalleryActiveIndex: React.Dispatch<React.SetStateAction<number>>\n}> = ({\n  data,\n  onToggle,\n  isOpen,\n  galleryActiveIndex,\n  setgalleryActiveIndex,\n}) => {\n  // Current active item\n\n  const isDataAvailable = data && data.length\n\n  // Handle next click\n  const handleNext = () => {\n    if (!data) return\n    setgalleryActiveIndex((prevIndex) => (prevIndex + 1) % data?.length)\n  }\n\n  // Handle previous click\n  const handlePrev = () => {\n    if (!data) return\n    setgalleryActiveIndex(\n      (prevIndex) => (prevIndex - 1 + data.length) % data.length\n    )\n  }\n\n  const handleThumbnailClick = (index: number) => {\n    setgalleryActiveIndex(index)\n  }\n\n  const toggleGallery = () => {\n    onToggle()\n  }\n\n  return (\n    <Dialog\n      open={isOpen}\n      trigger={null}\n      contentClassName=\"bg-transparent w-fit  border-0\"\n      onInteractOutside={toggleGallery}\n      body={\n        <div className=\"flex flex-col items-center justify-center w-full h-full max-w-3xl mx-auto\">\n          <X\n            size={24}\n            color=\"white\"\n            className=\"absolute z-50 cursor-pointer -right-10 -top-10\"\n            onClick={toggleGallery}\n          />\n\n          {/* Main Carousel */}\n          <div className=\"relative\">\n            <div className=\"relative \">\n              {isDataAvailable && (\n                <img\n                  key={data[galleryActiveIndex].image_url}\n                  src={data[galleryActiveIndex].image_url}\n                  alt={`Street ${galleryActiveIndex + 1}`}\n                  className=\"w-[500px] max-h-[80vh] object-contain flex-shrink-0\"\n                />\n              )}\n            </div>\n\n            {/* Navigation Buttons */}\n            <div className=\"relative top-[-50%]  left-[-10%] flex row  w-[120%] justify-between\">\n              <div role=\"button\" tabIndex={0} onClick={handlePrev}>\n                <ChevronLeft size={30} color=\"white\" />\n              </div>\n              <div role=\"button\" tabIndex={0} onClick={handleNext}>\n                <ChevronRight size={30} color=\"white\" />\n              </div>\n            </div>\n          </div>\n\n          {/* Thumbnails */}\n          <div className=\"flex justify-center p-2 mt-4 space-x-2 rounded-lg\">\n            {isDataAvailable &&\n              data.map((item, index) => (\n                <img\n                  key={index}\n                  src={item.image_url}\n                  alt={`Thumbnail ${index + 1}`}\n                  onClick={() => handleThumbnailClick(index)}\n                  className={`w-20 h-auto rounded-lg cursor-pointer ${\n                    index === galleryActiveIndex\n                      ? 'ring-2 ring-primary-1'\n                      : 'ring-2 ring-transparent'\n                  } hover:ring-gray-300`}\n                />\n              ))}\n          </div>\n        </div>\n      }\n    />\n  )\n}\n// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars\nconst CustomTooltipFootfall = ({ active, payload, label, year }: any) => {\n  if (active && payload && payload.length) {\n    const year = payload[0]?.payload?.year\n    const footfall = payload[0]?.value\n    return (\n      <div className=\"flex flex-col bg-light-1 p-4 rounded-lg shadow-md min-w-[200px] gap-1\">\n        {/* Month Information */}\n        <Typography variant={'body6'} className=\"text-primary\">\n          {`${label}'${year}`}\n        </Typography>\n\n        {/* Separator */}\n        <div className=\"my-2 w-full h-px border border-stroke-1\" />\n\n        {/* Footfall/Visits Information */}\n        <div className=\"flex\">\n          <div\n            className=\"h-4 w-1 rounded-lg\"\n            style={{ backgroundColor: '#6D48EF' }}\n          />\n          <Typography variant={'body6'} className=\"text-secondary mx-1\">\n            Visits\n          </Typography>\n          <Typography variant={'body4'} className=\"text-secondary ml-auto\">\n            {` ${footfall}`}\n          </Typography>\n        </div>\n      </div>\n    )\n  }\n  return null\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst CustomTooltipCannibalisation = ({ active, payload, label }: any) => {\n  if (active && payload && payload.length) {\n    const distance = payload[0]?.payload?.distance\n    const cannibalisation = payload[0]?.value\n    return (\n      <div className=\"flex bg-light-1 items-center justify-between rounded-lg shadow-md min-w-45 max-w-80 gap-2 p-2\">\n        {/* Month Information */}\n        <Typography variant={'body6'} className=\"text-primary\">\n          {\n            <div className=\"flex h-full justify-between items-center p-2 gap-4\">\n              <div>{label}</div>\n              <div> {distance + 'km'}</div>\n            </div>\n          }\n        </Typography>\n        {/* Footfall/Visits Information */}\n        <Typography\n          variant={'body4'}\n          className=\"text-normal text-danger-1 ml-auto p-2\"\n        >\n          {`${cannibalisation}%`}\n        </Typography>\n      </div>\n    )\n  }\n  return null\n}\n\n{\n  /*--------- Store insights ----------*/\n}\ninterface StoreInsightsSectionProps {\n  insights: ReportSnippetViewNS.CatchmentInsights[]\n  // customButton?: React.ReactNode\n}\n\nconst StoreInsightsSection: FC<StoreInsightsSectionProps> = ({ insights }) => {\n  return (\n    <div>\n      <div className=\"flex flex-row mb-4 justify-between\">\n        <Typography variant=\"body4\" className=\"text-light-2\">\n          Store Insight:\n        </Typography>\n      </div>\n\n      <div className=\"bg-light-2 p-3 border border-neutral-1 rounded-lg\">\n        <Typography variant=\"body4\" className=\"text-light-2 mb-2\">\n          Presence of other brands in catchment:\n        </Typography>\n\n        {/* Render store insights data */}\n        <div className=\"flex gap-1 flex-wrap\">\n          {insights.map((item) => (\n            <div\n              key={item.type}\n              className=\"flex items-center gap-1 bg-light-1 px-2 py-1 rounded-full border border-neutral-1\"\n            >\n              {/* Icon */}\n              <img\n                src={item.iconUrl}\n                alt={`${item.type} Icon`}\n                className=\"w-4 h-4\"\n              />\n\n              {/* Name and Count */}\n              <Typography variant=\"body6\" className=\"text-light-2\">\n                {item.count}\n              </Typography>\n              <div className=\"flex items-center gap-1\">\n                <Typography variant=\"body6\" className=\"text-light-2\">\n                  {item.type === 'competitor' ? 'Competitors' : 'Complementary'}\n                </Typography>\n              </div>\n            </div>\n          ))}\n        </div>\n      </div>\n    </div>\n  )\n}\n\n{\n  /*--------- Store Overview ----------*/\n}\ninterface StoreOverviewSectionProps {\n  highlights: ReportSnippetViewNS.StoreHighlights[]\n}\n\nconst StoreOverviewSection: FC<StoreOverviewSectionProps> = ({\n  highlights,\n}) => {\n  return (\n    <div>\n      <Typography variant={'body4'} className=\"text-light-2 mb-2\">\n        Store Overview:\n      </Typography>\n      <div className=\"bg-light-2 p-1 border border-neutral-1 rounded-lg\">\n        <div className=\"flex justify-evenly items-center\">\n          {highlights.map((item, index) => (\n            <React.Fragment key={index}>\n              <div className=\"flex flex-col items-center justify-center text-center gap-1 p-\">\n                {/* Trend Box */}\n                <div\n                  className={trendBoxStyles({\n                    trend: item.trend?.toString() as '1' | '-1' | '0' | null,\n                  })}\n                >\n                  {item.trend === 1 && (\n                    <img\n                      src=\"https://frontend-static-files.geoiq.io/strapi/trending_up_9d73d6fac5.svg\"\n                      alt=\"High Trend\"\n                      className={'w-3 h-3'}\n                    />\n                  )}\n                  {item.trend === -1 && (\n                    <img\n                      src=\"https://frontend-static-files.geoiq.io/strapi/trending_down_87adc7f3a6.svg\"\n                      alt=\"Low Trend\"\n                      className={'w-3 h-3'}\n                    />\n                  )}\n                  {item.value && item.trend ? (\n                    <Typography\n                      variant=\"body5\"\n                      className={trendValueStyles({\n                        trend: item.trend?.toString() as\n                          | '1'\n                          | '-1'\n                          | '0'\n                          | null,\n                      })}\n                    >\n                      {`${item.value}%`}\n                    </Typography>\n                  ) : (\n                    <Typography variant=\"body5\" className=\"text-sm\">\n                      -\n                    </Typography>\n                  )}\n                </div>\n\n                {/* Name */}\n                {item.name && (\n                  <Typography variant={'body6'} className=\"text-light-2\">\n                    {item.name}\n                  </Typography>\n                )}\n              </div>\n\n              {/* Separator */}\n              {index < highlights.length - 1 && (\n                <div className=\"border-l border-stroke-light-1 h-20 mx-1\" />\n              )}\n            </React.Fragment>\n          ))}\n        </div>\n      </div>\n    </div>\n  )\n}\n\n{\n  /*----------------- Footfall Trends ------------------*/\n}\ninterface FootfallChartSectionProps {\n  data: ReportSnippetViewNS.FootfallChartData[]\n}\n\nconst FootfallChartSection: FC<FootfallChartSectionProps> = ({ data }) => {\n  if (!data || data.every((item) => item.footfall === null)) {\n    return null\n  }\n  return (\n    <div className=\"w-full h-full bg-light-2 border border-neutral-1 p-3 rounded-lg\">\n      {/* Section heading */}\n      <Typography variant={'body4'} className=\"text-light-2 mb-4\">\n        Footfall trends\n      </Typography>\n\n      {/* Bar Chart */}\n      <ResponsiveContainer width=\"100%\" height={300}>\n        <BarChart\n          data={data}\n          margin={{\n            top: 3,\n            right: 3,\n            bottom: -10,\n            left: 3,\n          }}\n          barSize={24}\n        >\n          <CartesianGrid strokeDasharray=\"10 10\" />\n          <XAxis\n            dataKey=\"month\"\n            style={{\n              font: FONT_FAMILY,\n              fontSize: '12px',\n              fontWeight: '500',\n              color: '#4A4A4A',\n            }}\n          />\n          <YAxis\n            className=\"text-4-grey\"\n            style={{ fontSize: '12px', fontWeight: '500' }}\n            tickFormatter={(val) => {\n              if (val > 1000000) {\n                return `${val / 1000000}M`\n              }\n              if (val > 1000) {\n                return `${val / 1000}K`\n              }\n              return val\n            }}\n            label={{\n              value: 'AVG FOOTFALL FOR A 3-MONTH PERIOD',\n              angle: -90,\n              position: 'insideLeft',\n              dy: -5,\n              style: {\n                textAnchor: 'middle',\n                fontSize: '12px',\n                fontWeight: '500',\n              },\n            }}\n          />\n          <Tooltip content={<CustomTooltipFootfall />} />\n          <Bar\n            dataKey=\"footfall\"\n            fill=\"#6D48EF\"\n            radius={[4, 4, 4, 4]}\n            style={{ cursor: 'pointer' }}\n          />\n        </BarChart>\n      </ResponsiveContainer>\n    </div>\n  )\n}\n\n{\n  /* -----------------Cannibalisation Effect------------------ */\n}\ninterface CannibalisationChartSectionProps {\n  data: ReportSnippetViewNS.CannibalisationChartData[]\n}\n\nconst CannibalisationChartSection: FC<CannibalisationChartSectionProps> = ({\n  data,\n}) => {\n  if (!data || data.every((item) => item.cannibalisation === null)) {\n    return null\n  }\n  const formatXAxisLabel = (label: string) => {\n    const barCount = data.length\n    let maxLength\n\n    if (barCount <= 1) {\n      maxLength = 50\n    } else if (barCount <= 6) {\n      maxLength = 22 - (barCount - 1) * 4\n    } else {\n      maxLength = 6\n    }\n\n    return label.length > maxLength ? `${label.slice(0, maxLength)}...` : label\n  }\n  return (\n    <div className=\"w-full h-full bg-light-2 border border-neutral-1 p-3 rounded-lg\">\n      {/* Section heading */}\n      <Typography variant={'body4'} className=\"text-light-2 mb-4\">\n        Cannibalisation effects\n      </Typography>\n\n      {/* Bar Chart */}\n      <ResponsiveContainer width=\"100%\" height={300}>\n        <BarChart\n          data={data}\n          margin={{\n            top: 3,\n            right: 3,\n            bottom: 5,\n            left: 3,\n          }}\n          barSize={24}\n        >\n          <CartesianGrid strokeDasharray=\"10 10\" />\n          <XAxis\n            dataKey=\"store_name\"\n            tickFormatter={formatXAxisLabel}\n            tickMargin={10}\n            tick={(props) => {\n              const { x, y, payload } = props\n              return (\n                <text x={x} y={y} textAnchor={'end'} fill=\"#666\">\n                  <tspan x={x} style={{ fontSize: 12 }}>\n                    {formatXAxisLabel(payload.value)}\n                  </tspan>\n                  <tspan\n                    x={x}\n                    dy=\"1.5em\"\n                    style={{\n                      fontSize: 10,\n                      whiteSpace: 'nowrap',\n                      paddingTop: '2px',\n                    }}\n                  >\n                    {data[payload.index].distance + ' kms'}\n                  </tspan>\n                </text>\n              )\n            }}\n          />\n          <YAxis\n            className=\"text-4-grey\"\n            style={{ fontSize: '12px', fontWeight: '500' }}\n            tickFormatter={(val) => {\n              if (val > 1000000) {\n                return `${val / 1000000}M`\n              }\n              if (val > 1000) {\n                return `${val / 1000}K`\n              }\n              return val\n            }}\n            label={{\n              value: 'CANNIBALISATION IN %',\n              angle: -90,\n              position: 'insideLeft',\n              dy: -5,\n              style: {\n                textAnchor: 'middle',\n                fontSize: '12px',\n                fontWeight: '500',\n              },\n            }}\n            domain={[0, 100]}\n          />\n          <Tooltip content={<CustomTooltipCannibalisation />} />\n          <Bar\n            dataKey=\"cannibalisation\"\n            fill=\"#F93232\"\n            radius={[4, 4, 4, 4]}\n            style={{ cursor: 'pointer' }}\n          />\n        </BarChart>\n      </ResponsiveContainer>\n    </div>\n  )\n}\n\nexport {\n  ReportSnippetGalleryView,\n  StoreInsightsSection,\n  StoreOverviewSection,\n  FootfallChartSection,\n  CannibalisationChartSection,\n}\n"],"names":["ReportSnippetGalleryView","data","onToggle","isOpen","galleryActiveIndex","setgalleryActiveIndex","isDataAvailable","handleNext","prevIndex","handlePrev","handleThumbnailClick","index","toggleGallery","React","Dialog","X","ChevronLeft","ChevronRight","item","CustomTooltipFootfall","active","payload","label","year","footfall","Typography","CustomTooltipCannibalisation","distance","cannibalisation","StoreInsightsSection","insights","StoreOverviewSection","highlights","trendBoxStyles","trendValueStyles","FootfallChartSection","ResponsiveContainer","BarChart","CartesianGrid","XAxis","FONT_FAMILY","YAxis","val","Tooltip","Bar","CannibalisationChartSection","formatXAxisLabel","barCount","maxLength","props","x","y"],"mappings":"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"}

package/dist/index.es137.js

@@ -1,5 +1,10 @@
-const a = "Plus Jakarta Sans";
+import { createContext as t, useContext as o } from "react";
+const e = t(null);
+function n() {
+  return o(e);
+}
 export {
-  a as FONT_FAMILY
+  e as ImageEditorPortalContext,
+  n as useImageEditorPortalContainer
 };
 //# sourceMappingURL=index.es137.js.map

package/dist/index.es137.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es137.js","sources":["../src/lib/constants.ts"],"sourcesContent":["export const FONT_FAMILY = 'Plus Jakarta Sans'\n"],"names":["FONT_FAMILY"],"mappings":"AAAO,MAAMA,IAAc;"}
+{"version":3,"file":"index.es137.js","sources":["../src/components/organisms/image-editor/components/portal-context.tsx"],"sourcesContent":["import { createContext, useContext } from 'react'\n\nexport const ImageEditorPortalContext = createContext<HTMLElement | null>(null)\n\nexport function useImageEditorPortalContainer() {\n  return useContext(ImageEditorPortalContext)\n}\n"],"names":["ImageEditorPortalContext","createContext","useImageEditorPortalContainer","useContext"],"mappings":";AAEO,MAAMA,IAA2BC,EAAkC,IAAI;AAEvE,SAASC,IAAgC;AAC9C,SAAOC,EAAWH,CAAwB;AAC5C;"}