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

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

import e, { useState as A } from "react";
import { Typography as a } from "./index.es17.js";
import { Badge as E } from "./index.es6.js";
import { StarScore as O } from "./index.es45.js";
import { Button as z } from "./index.es7.js";
import { Skeleton as l } from "./index.es12.js";
import { StoreInsightsSection as B, StoreOverviewSection as G, FootfallChartSection as I, CannibalisationChartSection as R, ReportSnippetGalleryView as P } from "./index.es118.js";
const M = ({
  map: d,
  title: g,
  subTitle: v,
  tag: p,
  score: c,
  searched_on: x,
  streetViewData: n,
  highlights: s,
  isStreetViewDataLoading: N,
  handleStreetViewClick: y,
  storeHighlights: u,
  isLoading: r,
  catchmentInsights: f,
  footfallChartData: o,
  cannibalisationChartData: i
  // customButton,
}) => {
  const [h, S] = A(!1), [_, w] = e.useState(0), j = new Date(Number(x) * 1e3).toLocaleDateString("en-US", {
    year: "numeric",
    month: "long",
    day: "numeric"
  }), k = n?.every(
    (t) => t.image_url === null
  ), b = () => {
    S((t) => !t);
  };
  return /* @__PURE__ */ e.createElement("div", { className: "flex flex-col h-full " }, d && 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 " })) : d && d, /* @__PURE__ */ e.createElement("div", { className: "flex flex-col " }, /* @__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" }, g), 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(E, { variant: "neutral", size: "sm", showBorder: !0 }, p) : /* @__PURE__ */ e.createElement("div", null), v !== void 0 && /* @__PURE__ */ e.createElement(
    a,
    {
      variant: "body4",
      className: "text-light-4 fit-content w-1/2"
    },
    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(
    O,
    {
      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(
    E,
    {
      variant: "default",
      size: "sm",
      showBorder: !0
    },
    `Added on: ${j}`
  ))), /* @__PURE__ */ e.createElement("div", 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(
    E,
    {
      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(
    z,
    {
      variant: "secondary",
      size: "sm",
      className: "flex gap-2 px-4 py-2 focus:ring-0",
      onClick: y
    },
    /* @__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]"
      }
    )) : k ? /* @__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: () => {
              w(Number(m)), b();
            }
          }
        ) : null)
      )
    )
  ))), /* @__PURE__ */ e.createElement("div", { className: "flex flex-col gap-3 p-3" }, f ? 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: "bg-light-2 p-3 border border-neutral-1 rounded-lg" }, /* @__PURE__ */ e.createElement(a, { variant: "body4", className: "text-light-2 mb-2" }, /* @__PURE__ */ e.createElement(l, { className: "w-full h-7" })), /* @__PURE__ */ e.createElement("div", { className: "flex gap-1 flex-wrap" }, /* @__PURE__ */ e.createElement(l, { className: "w-32 h-8 rounded-[24px]" }), /* @__PURE__ */ e.createElement(l, { className: "w-32 h-8 rounded-[24px]" })))) : f.length > 0 ? /* @__PURE__ */ e.createElement(
    B,
    {
      insights: f
    }
  ) : null : null, u ? r ? /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement(a, { variant: "body4", className: "text-light-2 mb-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 justify-center items-center gap-4 flex-wrap" }, [...Array(4)].map((t, m) => /* @__PURE__ */ e.createElement(
    l,
    {
      key: m,
      className: "w-20 h-20 rounded-[8px]"
    }
  ))))) : u.length > 0 ? /* @__PURE__ */ e.createElement(G, { highlights: u }) : null : 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: "text-light-2 mb-4" }, /* @__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(I, { data: o }) : 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: "text-light-2 mb-4" }, /* @__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(R, { data: i }) : null)), /* @__PURE__ */ e.createElement(
    P,
    {
      onToggle: b,
      isOpen: h,
      data: n,
      galleryActiveIndex: _,
      setgalleryActiveIndex: w
    }
  ));
};
export {
  M as default
};
//# sourceMappingURL=index.es46.js.map