@mercurjs/admin 2.0.0-canary.100

package/dist/chunk-UQITHKTH.js

@@ -0,0 +1,342 @@
+import {
+  ActionMenu
+} from "./chunk-BDGZ4EQO.js";
+import {
+  useQueryParams
+} from "./chunk-THHRRYRS.js";
+
+// src/components/data-table/data-table.tsx
+import {
+  DataTable as UiDataTable,
+  useDataTable,
+  Heading,
+  Text,
+  Button
+} from "@medusajs/ui";
+import React, { useCallback, useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import { Link, useNavigate, useSearchParams } from "react-router-dom";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DataTable = ({
+  data = [],
+  columns,
+  filters,
+  commands,
+  action,
+  actions,
+  actionMenu,
+  getRowId,
+  rowCount = 0,
+  enablePagination = true,
+  enableSearch = true,
+  autoFocusSearch = false,
+  enableFilterMenu,
+  rowHref,
+  heading,
+  headingLevel = "h1",
+  subHeading,
+  prefix,
+  pageSize = 10,
+  emptyState,
+  rowSelection,
+  isLoading = false,
+  layout = "auto",
+  enableColumnVisibility = false,
+  initialColumnVisibility = {},
+  onColumnVisibilityChange,
+  columnOrder,
+  onColumnOrderChange,
+  enableViewSelector = false,
+  entity,
+  currentColumns,
+  filterBarContent
+}) => {
+  const { t } = useTranslation();
+  const enableFiltering = filters && filters.length > 0;
+  const showFilterMenu = enableFilterMenu !== void 0 ? enableFilterMenu : enableFiltering;
+  const enableCommands = commands && commands.length > 0;
+  const enableSorting = columns.some((column) => column.enableSorting);
+  const [columnVisibility, setColumnVisibility] = React.useState(initialColumnVisibility);
+  React.useEffect(() => {
+    const currentKeys = Object.keys(columnVisibility).sort();
+    const newKeys = Object.keys(initialColumnVisibility).sort();
+    const hasChanged = currentKeys.length !== newKeys.length || currentKeys.some((key, index) => key !== newKeys[index]) || Object.entries(initialColumnVisibility).some(
+      ([key, value]) => columnVisibility[key] !== value
+    );
+    if (hasChanged) {
+      setColumnVisibility(initialColumnVisibility);
+    }
+  }, [initialColumnVisibility]);
+  const handleColumnVisibilityChange = React.useCallback(
+    (visibility) => {
+      setColumnVisibility(visibility);
+      onColumnVisibilityChange?.(visibility);
+    },
+    [onColumnVisibilityChange]
+  );
+  const filterIds = useMemo(() => filters?.map((f) => f.id) ?? [], [filters]);
+  const prefixedFilterIds = filterIds.map((id) => getQueryParamKey(id, prefix));
+  const { offset, order, q, ...filterParams } = useQueryParams(
+    [
+      ...filterIds,
+      ...enableSorting ? ["order"] : [],
+      ...enableSearch ? ["q"] : [],
+      ...enablePagination ? ["offset"] : []
+    ],
+    prefix
+  );
+  const [_, setSearchParams] = useSearchParams();
+  const search = useMemo(() => {
+    return q ?? "";
+  }, [q]);
+  const handleSearchChange = (value) => {
+    setSearchParams((prev) => {
+      if (value) {
+        prev.set(getQueryParamKey("q", prefix), value);
+      } else {
+        prev.delete(getQueryParamKey("q", prefix));
+      }
+      return prev;
+    });
+  };
+  const pagination = useMemo(() => {
+    return offset ? parsePaginationState(offset, pageSize) : { pageIndex: 0, pageSize };
+  }, [offset, pageSize]);
+  const handlePaginationChange = (value) => {
+    setSearchParams((prev) => {
+      if (value.pageIndex === 0) {
+        prev.delete(getQueryParamKey("offset", prefix));
+      } else {
+        prev.set(
+          getQueryParamKey("offset", prefix),
+          transformPaginationState(value).toString()
+        );
+      }
+      return prev;
+    });
+  };
+  const filtering = useMemo(
+    () => parseFilterState(filterIds, filterParams),
+    [filterIds, filterParams]
+  );
+  const handleFilteringChange = (value) => {
+    setSearchParams((prev) => {
+      Array.from(prev.keys()).forEach((key) => {
+        if (prefixedFilterIds.includes(key)) {
+          const unprefixedKey = prefix ? key.replace(`${prefix}_`, "") : key;
+          if (!(unprefixedKey in value)) {
+            prev.delete(key);
+          }
+        }
+      });
+      Object.entries(value).forEach(([key, filter]) => {
+        const prefixedKey = getQueryParamKey(key, prefix);
+        if (filter !== void 0) {
+          prev.set(prefixedKey, JSON.stringify(filter));
+        } else {
+          prev.delete(prefixedKey);
+        }
+      });
+      return prev;
+    });
+  };
+  const sorting = useMemo(() => {
+    return order ? parseSortingState(order) : null;
+  }, [order]);
+  const currentConfiguration = useMemo(
+    () => ({
+      filters: filtering,
+      sorting,
+      search
+    }),
+    [filtering, sorting, search]
+  );
+  const handleSortingChange = (value) => {
+    setSearchParams((prev) => {
+      if (value) {
+        const valueToStore = transformSortingState(value);
+        prev.set(getQueryParamKey("order", prefix), valueToStore);
+      } else {
+        prev.delete(getQueryParamKey("order", prefix));
+      }
+      return prev;
+    });
+  };
+  const { pagination: paginationTranslations, toolbar: toolbarTranslations } = useDataTableTranslations();
+  const navigate = useNavigate();
+  const onRowClick = useCallback(
+    (event, row) => {
+      if (!rowHref) {
+        return;
+      }
+      const href = rowHref(row);
+      const basePath = "/";
+      const hrefWithBasePath = `${basePath === "/" ? "" : basePath}${href}`;
+      if (event.metaKey || event.ctrlKey || event.button === 1) {
+        window.open(hrefWithBasePath, "_blank", "noreferrer");
+        return;
+      }
+      if (event.shiftKey) {
+        window.open(hrefWithBasePath, void 0, "noreferrer");
+        return;
+      }
+      navigate(href);
+    },
+    [navigate, rowHref]
+  );
+  const instance = useDataTable({
+    data,
+    columns,
+    filters,
+    commands,
+    rowCount,
+    getRowId,
+    onRowClick: rowHref ? onRowClick : void 0,
+    pagination: enablePagination ? {
+      state: pagination,
+      onPaginationChange: handlePaginationChange
+    } : void 0,
+    filtering: enableFiltering ? {
+      state: filtering,
+      onFilteringChange: handleFilteringChange
+    } : void 0,
+    sorting: enableSorting ? {
+      state: sorting,
+      onSortingChange: handleSortingChange
+    } : void 0,
+    search: enableSearch ? {
+      state: search,
+      onSearchChange: handleSearchChange
+    } : void 0,
+    rowSelection,
+    isLoading,
+    columnVisibility: enableColumnVisibility ? {
+      state: columnVisibility,
+      onColumnVisibilityChange: handleColumnVisibilityChange
+    } : void 0,
+    columnOrder: columnOrder && onColumnOrderChange ? {
+      state: columnOrder,
+      onColumnOrderChange
+    } : void 0
+  });
+  const shouldRenderHeading = heading || subHeading;
+  return /* @__PURE__ */ jsxs(
+    UiDataTable,
+    {
+      instance,
+      className: layout === "fill" ? "h-full [&_tr]:last-of-type:!border-b" : void 0,
+      children: [
+        /* @__PURE__ */ jsx(
+          UiDataTable.Toolbar,
+          {
+            className: "flex flex-col items-start justify-between gap-2 md:flex-row md:items-center",
+            translations: toolbarTranslations,
+            filterBarContent,
+            children: /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center justify-between gap-2", children: [
+              /* @__PURE__ */ jsx("div", { className: "flex items-center gap-x-4", children: shouldRenderHeading && /* @__PURE__ */ jsxs("div", { children: [
+                heading && /* @__PURE__ */ jsx(Heading, { level: headingLevel, children: heading }),
+                subHeading && /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: subHeading })
+              ] }) }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
+                showFilterMenu && /* @__PURE__ */ jsx(UiDataTable.FilterMenu, {}),
+                enableSorting && /* @__PURE__ */ jsx(UiDataTable.SortingMenu, {}),
+                enableSearch && /* @__PURE__ */ jsx("div", { className: "w-full md:w-auto", children: /* @__PURE__ */ jsx(
+                  UiDataTable.Search,
+                  {
+                    placeholder: t("filters.searchLabel"),
+                    autoFocus: autoFocusSearch
+                  }
+                ) }),
+                actionMenu && /* @__PURE__ */ jsx(ActionMenu, { variant: "primary", ...actionMenu }),
+                actions && actions.length > 0 && /* @__PURE__ */ jsx(DataTableActions, { actions }),
+                !actions && action && /* @__PURE__ */ jsx(DataTableAction, { ...action })
+              ] })
+            ] })
+          }
+        ),
+        /* @__PURE__ */ jsx(UiDataTable.Table, { emptyState }),
+        enablePagination && /* @__PURE__ */ jsx(UiDataTable.Pagination, { translations: paginationTranslations }),
+        enableCommands && /* @__PURE__ */ jsx(
+          UiDataTable.CommandBar,
+          {
+            selectedLabel: (count) => `${count} selected`
+          }
+        )
+      ]
+    }
+  );
+};
+function transformSortingState(value) {
+  return value.desc ? `-${value.id}` : value.id;
+}
+function parseSortingState(value) {
+  return value.startsWith("-") ? { id: value.slice(1), desc: true } : { id: value, desc: false };
+}
+function transformPaginationState(value) {
+  return value.pageIndex * value.pageSize;
+}
+function parsePaginationState(value, pageSize) {
+  const offset = parseInt(value);
+  return {
+    pageIndex: Math.floor(offset / pageSize),
+    pageSize
+  };
+}
+function parseFilterState(filterIds, value) {
+  if (!value) {
+    return {};
+  }
+  const filters = {};
+  for (const id of filterIds) {
+    const filterValue = value[id];
+    if (filterValue !== void 0) {
+      filters[id] = JSON.parse(filterValue);
+    }
+  }
+  return filters;
+}
+function getQueryParamKey(key, prefix) {
+  return prefix ? `${prefix}_${key}` : key;
+}
+var useDataTableTranslations = () => {
+  const { t } = useTranslation();
+  const paginationTranslations = {
+    of: t("general.of"),
+    results: t("general.results"),
+    pages: t("general.pages"),
+    prev: t("general.prev"),
+    next: t("general.next")
+  };
+  const toolbarTranslations = {
+    clearAll: t("actions.clearAll"),
+    sort: t("filters.sortLabel"),
+    columns: "Columns"
+  };
+  return {
+    pagination: paginationTranslations,
+    toolbar: toolbarTranslations
+  };
+};
+var DataTableAction = ({
+  label,
+  disabled,
+  ...props
+}) => {
+  const buttonProps = {
+    size: "small",
+    disabled: disabled ?? false,
+    type: "button",
+    variant: "secondary"
+  };
+  if ("to" in props) {
+    return /* @__PURE__ */ jsx(Button, { ...buttonProps, asChild: true, children: /* @__PURE__ */ jsx(Link, { to: props.to, children: label }) });
+  }
+  return /* @__PURE__ */ jsx(Button, { ...buttonProps, onClick: props.onClick, children: label });
+};
+var DataTableActions = ({ actions }) => {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center gap-x-2", children: actions.map((action, index) => /* @__PURE__ */ jsx(DataTableAction, { ...action }, index)) });
+};
+
+export {
+  DataTable
+};

package/dist/chunk-UXD3VNBO.js

@@ -0,0 +1,53 @@
+import {
+  castNumber
+} from "./chunk-SMQT3ZNO.js";
+
+// src/lib/validation.ts
+import i18next from "i18next";
+import { z } from "zod";
+var optionalInt = z.union([z.string(), z.number()]).optional().refine(
+  (value) => {
+    if (value === "" || value === void 0) {
+      return true;
+    }
+    return Number.isInteger(castNumber(value));
+  },
+  {
+    message: i18next.t("validation.mustBeInt")
+  }
+).refine(
+  (value) => {
+    if (value === "" || value === void 0) {
+      return true;
+    }
+    return castNumber(value) >= 0;
+  },
+  {
+    message: i18next.t("validation.mustBePositive")
+  }
+);
+var optionalFloat = z.union([z.string(), z.number()]).optional().refine(
+  (value) => {
+    if (value === "" || value === void 0) {
+      return true;
+    }
+    return castNumber(value) >= 0;
+  },
+  {
+    message: i18next.t("validation.mustBePositive")
+  }
+);
+var metadataFormSchema = z.array(
+  z.object({
+    key: z.string(),
+    value: z.unknown(),
+    isInitial: z.boolean().optional(),
+    isDeleted: z.boolean().optional(),
+    isIgnored: z.boolean().optional()
+  })
+);
+
+export {
+  optionalInt,
+  optionalFloat
+};

package/dist/chunk-UZWFZMOX.js

@@ -0,0 +1,40 @@
+import {
+  languages
+} from "./chunk-XQNVC4Q7.js";
+
+// src/hooks/use-date.tsx
+import { format, formatDistance, sub } from "date-fns";
+import { enUS } from "date-fns/locale";
+import { useTranslation } from "react-i18next";
+var useDate = () => {
+  const { i18n } = useTranslation();
+  const locale = languages.find((l) => l.code === i18n.language)?.date_locale || enUS;
+  const getFullDate = ({
+    date,
+    includeTime = false
+  }) => {
+    const ensuredDate = new Date(date);
+    if (isNaN(ensuredDate.getTime())) {
+      return "";
+    }
+    const timeFormat = includeTime ? "p" : "";
+    return format(ensuredDate, `PP ${timeFormat}`, {
+      locale
+    });
+  };
+  function getRelativeDate(date) {
+    const now = /* @__PURE__ */ new Date();
+    return formatDistance(sub(new Date(date), { minutes: 0 }), now, {
+      addSuffix: true,
+      locale
+    });
+  }
+  return {
+    getFullDate,
+    getRelativeDate
+  };
+};
+
+export {
+  useDate
+};

package/dist/chunk-V5J73NPW.js

@@ -0,0 +1,117 @@
+import {
+  JsonViewSection,
+  MetadataSection
+} from "./chunk-XIZLPYEE.js";
+
+// src/components/layout/pages/two-column-page/two-column-page.tsx
+import { clx } from "@medusajs/ui";
+import { Children } from "react";
+import { Outlet } from "react-router-dom";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Root = ({
+  children,
+  /**
+   * Widgets to be rendered in the main content area and sidebar.
+   */
+  /**
+   * Data to be passed to widgets, JSON view, and Metadata view.
+   */
+  data,
+  /**
+   * Whether to show JSON view of the data. Defaults to false.
+   */
+  showJSON = false,
+  /**
+   * Whether to show metadata view of the data. Defaults to false.
+   */
+  showMetadata = false,
+  /**
+   * Whether to render an outlet for children routes. Defaults to true.
+   */
+  hasOutlet = true
+}) => {
+  if (showJSON && !data) {
+    if (process.env.NODE_ENV === "development") {
+      console.warn(
+        "`showJSON` is true but no data is provided. To display JSON, provide data prop."
+      );
+    }
+    showJSON = false;
+  }
+  if (showMetadata && !data) {
+    if (process.env.NODE_ENV === "development") {
+      console.warn(
+        "`showMetadata` is true but no data is provided. To display metadata, provide data prop."
+      );
+    }
+    showMetadata = false;
+  }
+  const childrenArray = Children.toArray(children);
+  if (childrenArray.length !== 2) {
+    throw new Error("TwoColumnPage expects exactly two children");
+  }
+  const [main, sidebar] = childrenArray;
+  const showExtraData = showJSON || showMetadata;
+  return /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-y-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col items-start gap-x-4 gap-y-3 xl:grid xl:grid-cols-[minmax(0,_1fr)_440px]", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex w-full min-w-0 flex-col gap-y-3", children: [
+        main,
+        showExtraData && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "hidden flex-col gap-y-3 xl:flex",
+            "data-testid": "product-extra-data-desktop",
+            children: [
+              showMetadata && /* @__PURE__ */ jsx(MetadataSection, { data }),
+              showJSON && /* @__PURE__ */ jsx(JsonViewSection, { data })
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-y-3 xl:mt-0", children: [
+        sidebar,
+        showExtraData && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex flex-col gap-y-3 xl:hidden",
+            "data-testid": "product-extra-data-mobile",
+            children: [
+              showMetadata && /* @__PURE__ */ jsx(MetadataSection, { data }),
+              showJSON && /* @__PURE__ */ jsx(JsonViewSection, { data })
+            ]
+          }
+        )
+      ] })
+    ] }),
+    hasOutlet && /* @__PURE__ */ jsx(Outlet, {})
+  ] });
+};
+var Main = ({
+  children,
+  className,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx("div", { className: clx("flex w-full flex-col gap-y-3", className), ...props, children });
+};
+var Sidebar = ({
+  children,
+  className,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: clx(
+        "flex w-full max-w-[100%] flex-col gap-y-3 xl:mt-0 xl:max-w-[440px]",
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+};
+var TwoColumnPage = Object.assign(Root, { Main, Sidebar });
+
+export {
+  TwoColumnPage
+};