@mercurjs/admin 2.0.0-canary.100

package/dist/chunk-CP5IL4P6.js

@@ -0,0 +1,98 @@
+import {
+  IconAvatar
+} from "./chunk-U2EI2ZLM.js";
+
+// src/components/common/logo-box/avatar-box.tsx
+import { motion } from "motion/react";
+import config from "virtual:mercur/config";
+import { jsx, jsxs } from "react/jsx-runtime";
+function AvatarBox({ checked }) {
+  const fallbackLetter = config.name?.charAt(0)?.toUpperCase() ?? "M";
+  return /* @__PURE__ */ jsxs(
+    IconAvatar,
+    {
+      size: "xlarge",
+      className: "bg-ui-button-neutral shadow-buttons-neutral after:button-neutral-gradient relative mb-4 flex h-[50px] w-[50px] items-center justify-center rounded-xl after:inset-0 after:content-['']",
+      children: [
+        checked && /* @__PURE__ */ jsx(
+          motion.div,
+          {
+            className: "absolute -right-[5px] -top-1 flex size-5 items-center justify-center rounded-full border-[0.5px] border-[rgba(3,7,18,0.2)] bg-[#3B82F6] bg-gradient-to-b from-white/0 to-white/20 shadow-[0px_1px_2px_0px_rgba(3,7,18,0.12),0px_1px_2px_0px_rgba(255,255,255,0.10)_inset,0px_-1px_5px_0px_rgba(255,255,255,0.10)_inset,0px_0px_0px_0px_rgba(3,7,18,0.06)_inset]",
+            initial: { opacity: 0, scale: 0.5 },
+            animate: { opacity: 1, scale: 1 },
+            transition: {
+              duration: 1.2,
+              delay: 0.8,
+              ease: [0, 0.71, 0.2, 1.01]
+            },
+            children: /* @__PURE__ */ jsx(
+              "svg",
+              {
+                xmlns: "http://www.w3.org/2000/svg",
+                width: "20",
+                height: "20",
+                viewBox: "0 0 20 20",
+                fill: "none",
+                children: /* @__PURE__ */ jsx(
+                  motion.path,
+                  {
+                    d: "M5.8335 10.4167L9.16683 13.75L14.1668 6.25",
+                    stroke: "white",
+                    strokeWidth: "1.5",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round",
+                    initial: { pathLength: 0, opacity: 0 },
+                    animate: { pathLength: 1, opacity: 1 },
+                    transition: {
+                      duration: 1.3,
+                      delay: 1.1,
+                      bounce: 0.6,
+                      ease: [0.1, 0.8, 0.2, 1.01]
+                    }
+                  }
+                )
+              }
+            )
+          }
+        ),
+        config.logo ? /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: config.logo,
+            alt: config.name ?? "",
+            className: "h-full w-full rounded-[10px] object-cover"
+          }
+        ) : /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            className: "rounded-[10px]",
+            viewBox: "0 0 400 400",
+            fill: "none",
+            xmlns: "http://www.w3.org/2000/svg",
+            children: [
+              /* @__PURE__ */ jsx("rect", { width: "400", height: "400", rx: "40", fill: "#18181B" }),
+              /* @__PURE__ */ jsx(
+                "text",
+                {
+                  x: "200",
+                  y: "200",
+                  textAnchor: "middle",
+                  dominantBaseline: "central",
+                  fill: "white",
+                  fontSize: "200",
+                  fontWeight: "bold",
+                  fontFamily: "Inter, system-ui, sans-serif",
+                  children: fallbackLetter
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+export {
+  AvatarBox
+};

package/dist/chunk-DB6ANJBO.js

@@ -0,0 +1,35 @@
+// src/components/table/table-cells/common/status-cell/status-cell.tsx
+import { clx } from "@medusajs/ui";
+import { jsx, jsxs } from "react/jsx-runtime";
+var StatusCell = ({ color, children }) => {
+  return /* @__PURE__ */ jsxs("div", { className: "txt-compact-small text-ui-fg-subtle flex h-full w-full items-center gap-x-2 overflow-hidden", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "presentation",
+        className: "flex h-5 w-2 items-center justify-center",
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: clx(
+              "h-2 w-2 rounded-sm shadow-[0px_0px_0px_1px_rgba(0,0,0,0.12)_inset]",
+              {
+                "bg-ui-tag-neutral-icon": color === "grey",
+                "bg-ui-tag-green-icon": color === "green",
+                "bg-ui-tag-red-icon": color === "red",
+                "bg-ui-tag-blue-icon": color === "blue",
+                "bg-ui-tag-orange-icon": color === "orange",
+                "bg-ui-tag-purple-icon": color === "purple"
+              }
+            )
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { className: "truncate", children })
+  ] });
+};
+
+export {
+  StatusCell
+};

package/dist/chunk-DBYUB2YI.js

@@ -0,0 +1,174 @@
+import {
+  DisplayIdCell,
+  DisplayIdHeader,
+  TotalCell,
+  TotalHeader
+} from "./chunk-NOWUEJ74.js";
+import {
+  FulfillmentStatusCell,
+  FulfillmentStatusHeader,
+  PaymentStatusCell,
+  PaymentStatusHeader
+} from "./chunk-TZSOL34K.js";
+import {
+  DateCell,
+  DateHeader
+} from "./chunk-25LYVP3C.js";
+import {
+  PlaceholderCell
+} from "./chunk-PHOCVOZ5.js";
+
+// src/hooks/table/columns/use-order-table-columns.tsx
+import {
+  createColumnHelper
+} from "@tanstack/react-table";
+import { useMemo } from "react";
+
+// src/components/table/table-cells/order/country-cell/country-cell.tsx
+import { Tooltip } from "@medusajs/ui";
+import ReactCountryFlag from "react-country-flag";
+import { jsx } from "react/jsx-runtime";
+var CountryCell = ({
+  country
+}) => {
+  if (!country) {
+    return /* @__PURE__ */ jsx(PlaceholderCell, {});
+  }
+  return /* @__PURE__ */ jsx("div", { className: "flex size-5 items-center justify-center", children: /* @__PURE__ */ jsx(Tooltip, { content: country.display_name, children: /* @__PURE__ */ jsx("div", { className: "flex size-4 items-center justify-center overflow-hidden rounded-sm", children: /* @__PURE__ */ jsx(
+    ReactCountryFlag,
+    {
+      countryCode: country.iso_2.toUpperCase(),
+      svg: true,
+      style: {
+        width: "16px",
+        height: "16px"
+      },
+      "aria-label": country.display_name
+    }
+  ) }) }) });
+};
+
+// src/components/table/table-cells/order/customer-cell/customer-cell.tsx
+import { useTranslation } from "react-i18next";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var CustomerCell = ({
+  customer
+}) => {
+  if (!customer) {
+    return /* @__PURE__ */ jsx2("span", { className: "text-ui-fg-muted", children: "-" });
+  }
+  const { first_name, last_name, email } = customer;
+  const name = [first_name, last_name].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx2("div", { className: "flex h-full w-full items-center", children: /* @__PURE__ */ jsx2("span", { className: "truncate", children: name || email }) });
+};
+var CustomerHeader = () => {
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsx2("div", { className: "flex h-full w-full items-center", children: /* @__PURE__ */ jsx2("span", { className: "truncate", children: t("fields.customer") }) });
+};
+
+// src/components/table/table-cells/order/sales-channel-cell/sales-channel-cell.tsx
+import { useTranslation as useTranslation2 } from "react-i18next";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var SalesChannelCell = ({
+  channel
+}) => {
+  if (!channel) {
+    return /* @__PURE__ */ jsx3("span", { className: "text-ui-fg-muted", children: "-" });
+  }
+  const { name } = channel;
+  return /* @__PURE__ */ jsx3("div", { className: "flex h-full w-full items-center overflow-hidden", children: /* @__PURE__ */ jsx3("span", { className: "truncate", children: name }) });
+};
+var SalesChannelHeader = () => {
+  const { t } = useTranslation2();
+  return /* @__PURE__ */ jsx3("div", { className: "flex h-full w-full items-center", children: /* @__PURE__ */ jsx3("span", { className: "truncate", children: t("fields.salesChannel") }) });
+};
+
+// src/hooks/table/columns/use-order-table-columns.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var columnHelper = createColumnHelper();
+var useOrderTableColumns = (props) => {
+  const { exclude = [] } = props ?? {};
+  const columns = useMemo(
+    () => [
+      columnHelper.accessor("display_id", {
+        header: () => /* @__PURE__ */ jsx4(DisplayIdHeader, {}),
+        cell: ({ getValue }) => {
+          const id = getValue();
+          return /* @__PURE__ */ jsx4(DisplayIdCell, { displayId: id });
+        }
+      }),
+      columnHelper.accessor("created_at", {
+        header: () => /* @__PURE__ */ jsx4(DateHeader, {}),
+        cell: ({ getValue }) => {
+          const date = new Date(getValue());
+          return /* @__PURE__ */ jsx4(DateCell, { date });
+        }
+      }),
+      columnHelper.accessor("customer", {
+        header: () => /* @__PURE__ */ jsx4(CustomerHeader, {}),
+        cell: ({ getValue }) => {
+          const customer = getValue();
+          return /* @__PURE__ */ jsx4(CustomerCell, { customer });
+        }
+      }),
+      columnHelper.accessor("sales_channel", {
+        header: () => /* @__PURE__ */ jsx4(SalesChannelHeader, {}),
+        cell: ({ getValue }) => {
+          const channel = getValue();
+          return /* @__PURE__ */ jsx4(SalesChannelCell, { channel });
+        }
+      }),
+      columnHelper.accessor("payment_status", {
+        header: () => /* @__PURE__ */ jsx4(PaymentStatusHeader, {}),
+        cell: ({ getValue }) => {
+          const status = getValue();
+          return /* @__PURE__ */ jsx4(PaymentStatusCell, { status });
+        }
+      }),
+      columnHelper.accessor("fulfillment_status", {
+        header: () => /* @__PURE__ */ jsx4(FulfillmentStatusHeader, {}),
+        cell: ({ getValue }) => {
+          const status = getValue();
+          return /* @__PURE__ */ jsx4(FulfillmentStatusCell, { status });
+        }
+      }),
+      columnHelper.accessor("total", {
+        header: () => /* @__PURE__ */ jsx4(TotalHeader, {}),
+        cell: ({ getValue, row }) => {
+          const total = getValue();
+          const currencyCode = row.original.currency_code;
+          return /* @__PURE__ */ jsx4(TotalCell, { currencyCode, total });
+        }
+      }),
+      columnHelper.display({
+        id: "actions",
+        cell: ({ row }) => {
+          const country = row.original.shipping_address?.country;
+          return /* @__PURE__ */ jsx4(CountryCell, { country });
+        }
+      })
+    ],
+    []
+  );
+  const isAccessorColumnDef = (c) => {
+    return c.accessorKey !== void 0;
+  };
+  const isDisplayColumnDef = (c) => {
+    return c.id !== void 0;
+  };
+  const shouldExclude = (c) => {
+    if (isAccessorColumnDef(c)) {
+      return exclude.includes(c.accessorKey);
+    } else if (isDisplayColumnDef(c)) {
+      return exclude.includes(c.id);
+    }
+    return false;
+  };
+  return columns.filter(
+    (c) => !shouldExclude(c)
+  );
+};
+
+export {
+  useOrderTableColumns
+};