geoiq-frontend-ui-kit/dist/index.es50.js

This project is a UI kit for GeoIQ's frontend. It's built with React, TypeScript, and Vite.

import e, { useState as z } from "react";
import { Typography as a } from "./index.es19.js";
import { Badge as f } from "./index.es8.js";
import { StarScore as B } from "./index.es49.js";
import { Button as G } from "./index.es9.js";
import { Skeleton as l } from "./index.es14.js";
import { StoreInsightsSection as I, StoreOverviewSection as R, FootfallChartSection as P, CannibalisationChartSection as q, ReportSnippetGalleryView as F } from "./index.es113.js";
const Y = ({
  map: E,
  title: y,
  subTitle: v,
  tag: p,
  score: c,
  searched_on: x,
  streetViewData: n,
  highlights: s,
  isStreetViewDataLoading: N,
  handleStreetViewClick: S,
  storeHighlights: d,
  isLoading: r,
  catchmentInsights: u,
  footfallChartData: i,
  cannibalisationChartData: o,
  customModelSection: w,
  customSection: b
  // customButton,
}) => {
  const [_, k] = z(!1), [j, g] = e.useState(0), A = new Date(Number(x) * 1e3).toLocaleDateString("en-US", {
    year: "numeric",
    month: "long",
    day: "numeric"
  }), O = n?.every(
    (t) => t.image_url === null
  ), h = () => {
    k((t) => !t);
  };
  return /* @__PURE__ */ e.createElement("div", { className: "flex flex-col h-full min-h-0" }, E ? /* @__PURE__ */ e.createElement("div", { className: "flex-shrink-0" }, r ? /* @__PURE__ */ e.createElement("div", { className: "flex flex-row-reverse items-center justify-between w-full p-1" }, /* @__PURE__ */ e.createElement(l, { className: "w-full h-40 " })) : /* @__PURE__ */ e.createElement("div", { className: "h-[200px]" }, E)) : null, /* @__PURE__ */ e.createElement("div", { className: "flex-shrink-0" }, /* @__PURE__ */ e.createElement("div", { className: "flex flex-col gap-1 p-3" }, r ? /* @__PURE__ */ e.createElement(l, { className: "w-full h-8 " }) : /* @__PURE__ */ e.createElement(a, { variant: "h3" }, y), r ? /* @__PURE__ */ e.createElement("div", { className: "flex flex-row-reverse items-center justify-between w-full" }, /* @__PURE__ */ e.createElement(l, { className: "w-20 h-5 " }), /* @__PURE__ */ e.createElement(l, { className: "w-32 h-5 " })) : /* @__PURE__ */ e.createElement("div", { className: "flex flex-row-reverse items-center justify-between w-full " }, p ? /* @__PURE__ */ e.createElement(f, { variant: "neutral", size: "sm", showBorder: !0 }, p) : /* @__PURE__ */ e.createElement("div", null), v !== void 0 && /* @__PURE__ */ e.createElement(
    a,
    {
      variant: "body4",
      className: "w-1/2 text-light-4 fit-content"
    },
    v
  ))), /* @__PURE__ */ e.createElement("div", { className: "w-full p-3 border-b border-neutral-1" }, r ? /* @__PURE__ */ e.createElement("div", { className: "flex flex-row-reverse items-center justify-between w-full" }, /* @__PURE__ */ e.createElement(l, { className: "h-6 w-[120px]" }), /* @__PURE__ */ e.createElement(l, { className: "h-6 w-[120px]" })) : /* @__PURE__ */ e.createElement("div", { className: "flex flex-row items-center justify-between" }, c?.value && /* @__PURE__ */ e.createElement("div", { className: "flex items-center justify-between gap-1" }, /* @__PURE__ */ e.createElement(
    B,
    {
      score: c.value,
      starGap: 1,
      starSize: 24,
      isLoading: r || c?.isLoading
    }
  ), !c.isLoading && /* @__PURE__ */ e.createElement(a, { variant: "body5", className: "text-light-3" }, "(", c.value, "%)")), x && /* @__PURE__ */ e.createElement(
    f,
    {
      variant: "default",
      size: "sm",
      showBorder: !0
    },
    `Added on: ${A}`
  )))), /* @__PURE__ */ e.createElement("div", { className: "flex-1 min-h-0 overflow-y-auto flex flex-col" }, w ? /* @__PURE__ */ e.createElement("div", { className: "p-3" }, w) : null, /* @__PURE__ */ e.createElement("div", null, s && r ? /* @__PURE__ */ e.createElement("div", { className: "flex flex-col gap-3 p-3" }, /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement(a, { variant: "body6", className: "text-light-2" }, /* @__PURE__ */ e.createElement(l, { className: "w-28 h-7" }), " ")), /* @__PURE__ */ e.createElement("div", { className: "flex flex-row flex-wrap gap-2" }, [...Array(6)].map((t, m) => /* @__PURE__ */ e.createElement(l, { key: m, className: "w-28 h-7" })))) : s && s.length > 0 ? /* @__PURE__ */ e.createElement("div", { className: "flex flex-col gap-3 p-3" }, /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement(a, { variant: "body6", className: "text-light-2" }, "Location Highlights")), /* @__PURE__ */ e.createElement("div", { className: "flex flex-row flex-wrap gap-2" }, s.map((t, m) => /* @__PURE__ */ e.createElement(
    f,
    {
      key: m,
      variant: t.variant,
      showBorder: !0,
      className: "normal-case"
    },
    t.name
  )))) : null), n !== void 0 && /* @__PURE__ */ e.createElement("div", { className: "z-10 flex flex-col items-start justify-between p-3 pb-0 gap-1" }, n === null && N === !1 ? /* @__PURE__ */ e.createElement("div", { className: "w-fit" }, /* @__PURE__ */ e.createElement(
    G,
    {
      variant: "secondary",
      size: "sm",
      className: "flex gap-2 px-4 py-2 focus:ring-0",
      onClick: S
    },
    /* @__PURE__ */ e.createElement(
      "img",
      {
        src: "https://frontend-static-files.geoiq.io/strapi/download_cloud_7761a0bc2a.svg",
        height: 16,
        width: 16,
        alt: "download-btn"
      }
    ),
    "Street-view Photos"
  )) : /* @__PURE__ */ e.createElement(a, { variant: "body6", className: "text-light-2" }, "Street-view Photos"), /* @__PURE__ */ e.createElement(
    "div",
    {
      id: "street",
      className: "flex flex-row max-w-full gap-2 overflow-x-scroll",
      style: { scrollbarWidth: "none" }
    },
    N ? [...Array(4)].map((t, m) => /* @__PURE__ */ e.createElement(
      l,
      {
        key: m,
        className: "rounded-lg min-h-[160px] min-w-[120px]"
      }
    )) : O ? /* @__PURE__ */ e.createElement(a, { variant: "body1" }, "No Images Available") : n && n?.map(
      (t, m) => /* @__PURE__ */ e.createElement(
        "div",
        {
          key: m,
          className: "relative min-h-[160px] min-w-[120px]"
        },
        /* @__PURE__ */ e.createElement("div", { className: "inline" }, t?.image_url && t?.image_url !== null ? /* @__PURE__ */ e.createElement(
          "img",
          {
            src: t?.image_url,
            alt: "map_img",
            className: "object-cover w-full h-full rounded-lg cursor-pointer",
            role: "button",
            tabIndex: 0,
            onClick: () => {
              g(Number(m)), h();
            }
          }
        ) : null)
      )
    )
  )), /* @__PURE__ */ e.createElement("div", { className: "flex flex-col gap-3 p-3" }, u ? r ? /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement("div", { className: "flex mb-4" }, /* @__PURE__ */ e.createElement(a, { variant: "body4", className: "text-light-2" }, /* @__PURE__ */ e.createElement(l, { className: "w-28 h-7" }))), /* @__PURE__ */ e.createElement("div", { className: "p-3 border rounded-lg bg-light-2 border-neutral-1" }, /* @__PURE__ */ e.createElement(a, { variant: "body4", className: "mb-2 text-light-2" }, /* @__PURE__ */ e.createElement(l, { className: "w-full h-7" })), /* @__PURE__ */ e.createElement("div", { className: "flex flex-wrap gap-1" }, /* @__PURE__ */ e.createElement(l, { className: "w-32 h-8 rounded-[24px]" }), /* @__PURE__ */ e.createElement(l, { className: "w-32 h-8 rounded-[24px]" })))) : u.length > 0 ? /* @__PURE__ */ e.createElement(
    I,
    {
      insights: u
    }
  ) : null : null, d ? r ? /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement(a, { variant: "body4", className: "mb-2 text-light-2" }, /* @__PURE__ */ e.createElement(l, { className: "w-28 h-7" })), /* @__PURE__ */ e.createElement("div", { className: "bg-light-2 p-1 border border-neutral-1 rounded-[8px]" }, /* @__PURE__ */ e.createElement("div", { className: "flex flex-wrap items-center justify-center gap-4" }, [...Array(4)].map((t, m) => /* @__PURE__ */ e.createElement(
    l,
    {
      key: m,
      className: "w-20 h-20 rounded-[8px]"
    }
  ))))) : d.length > 0 ? /* @__PURE__ */ e.createElement(R, { highlights: d }) : null : null, i && r ? /* @__PURE__ */ e.createElement("div", { className: "w-full bg-light-2 border border-neutral-1 p-3 rounded-[8px]" }, /* @__PURE__ */ e.createElement(a, { variant: "body4", className: "mb-4 text-light-2" }, /* @__PURE__ */ e.createElement(l, { className: "w-28 h-7" }), " "), /* @__PURE__ */ e.createElement(l, { className: "w-full h-[400px]" })) : i && i.length > 0 ? /* @__PURE__ */ e.createElement(P, { data: i }) : null, o && r ? /* @__PURE__ */ e.createElement("div", { className: "w-full bg-light-2 border border-neutral-1 p-3 rounded-[8px]" }, /* @__PURE__ */ e.createElement(a, { variant: "body4", className: "mb-4 text-light-2" }, /* @__PURE__ */ e.createElement(l, { className: "w-28 h-7" }), " "), /* @__PURE__ */ e.createElement(l, { className: "w-full h-[400px]" })) : o && o.length > 0 ? /* @__PURE__ */ e.createElement(q, { data: o }) : null, b ? /* @__PURE__ */ e.createElement("div", { className: "w-full" }, b) : null)), /* @__PURE__ */ e.createElement(
    F,
    {
      onToggle: h,
      isOpen: _,
      data: n,
      galleryActiveIndex: j,
      setgalleryActiveIndex: g
    }
  ));
};
export {
  Y as default
};
//# sourceMappingURL=index.es50.js.map