bananas-commerce-admin 0.19.5 → 0.19.6

package/dist/esm/components/Card/CardPill.js

@@ -1,10 +1,26 @@
 import React from "react";
 import CancelIcon from "@mui/icons-material/Cancel";
 import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import WarningIcon from "@mui/icons-material/Warning";
 import Chip from "../Chip";
 // TODO Logic for picking icon
-export const CardPill = ({ label, color, icon, size = "small" }) => {
-    return (React.createElement(Chip, { color: color ?? "success", icon: icon ?? (color === "success" ? React.createElement(CheckCircleIcon, null) : React.createElement(CancelIcon, null)), label: label, size: size }));
+export const CardPill = ({ label, color, icon, size = "small", variant, }) => {
+    let resolvedIcon;
+    if (icon === undefined) {
+        if (color === "success") {
+            resolvedIcon = React.createElement(CheckCircleIcon, null);
+        }
+        else if (color === "warning") {
+            resolvedIcon = React.createElement(WarningIcon, null);
+        }
+        else {
+            resolvedIcon = React.createElement(CancelIcon, null);
+        }
+    }
+    else {
+        resolvedIcon = icon ?? undefined;
+    }
+    return (React.createElement(Chip, { color: color ?? "success", icon: resolvedIcon, label: label, size: size, variant: variant }));
 };
 export default CardPill;
 //# sourceMappingURL=CardPill.js.map

package/dist/esm/components/Card/CardPill.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardPill.js","sourceRoot":"","sources":["../../../../src/components/Card/CardPill.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,UAAU,MAAM,4BAA4B,CAAC;AACpD,OAAO,eAAe,MAAM,iCAAiC,CAAC;AAI9D,OAAO,IAAI,MAAM,SAAS,CAAC;AAQ3B,8BAA8B;AAC9B,MAAM,CAAC,MAAM,QAAQ,GAA4B,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,GAAG,OAAO,EAAE,EAAE,EAAE;IAC1F,OAAO,CACL,oBAAC,IAAI,IACH,KAAK,EAAE,KAAK,IAAI,SAAS,EACzB,IAAI,EAAE,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,oBAAC,eAAe,OAAG,CAAC,CAAC,CAAC,oBAAC,UAAU,OAAG,CAAC,EAC1E,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,GACV,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"CardPill.js","sourceRoot":"","sources":["../../../../src/components/Card/CardPill.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,UAAU,MAAM,4BAA4B,CAAC;AACpD,OAAO,eAAe,MAAM,iCAAiC,CAAC;AAC9D,OAAO,WAAW,MAAM,6BAA6B,CAAC;AAItD,OAAO,IAAI,MAAM,SAAS,CAAC;AAS3B,8BAA8B;AAC9B,MAAM,CAAC,MAAM,QAAQ,GAA4B,CAAC,EAChD,KAAK,EACL,KAAK,EACL,IAAI,EACJ,IAAI,GAAG,OAAO,EACd,OAAO,GACR,EAAE,EAAE;IACH,IAAI,YAA4C,CAAC;IACjD,IAAI,IAAI,KAAK,SAAS,EAAE,CAAC;QACvB,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;YACxB,YAAY,GAAG,oBAAC,eAAe,OAAG,CAAC;QACrC,CAAC;aAAM,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;YAC/B,YAAY,GAAG,oBAAC,WAAW,OAAG,CAAC;QACjC,CAAC;aAAM,CAAC;YACN,YAAY,GAAG,oBAAC,UAAU,OAAG,CAAC;QAChC,CAAC;IACH,CAAC;SAAM,CAAC;QACN,YAAY,GAAG,IAAI,IAAI,SAAS,CAAC;IACnC,CAAC;IAED,OAAO,CACL,oBAAC,IAAI,IACH,KAAK,EAAE,KAAK,IAAI,SAAS,EACzB,IAAI,EAAE,YAAY,EAClB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,GAChB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/dist/esm/components/Chip.js

@@ -8,6 +8,9 @@ export const Chip = styled(MuiChip)(({ theme }) => theme.unstable_sx({
     ".MuiChip-labelMedium": {
         pl: 1,
     },
+    ".MuiChip-label": {
+        fontWeight: theme.typography.fontWeightRegular,
+    },
 }));
 export default Chip;
 //# sourceMappingURL=Chip.js.map

package/dist/esm/components/Chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../src/components/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,oBAAoB,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAE9C,MAAM,CAAC,MAAM,IAAI,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAChD,KAAK,CAAC,WAAW,CAAC;IAChB,YAAY,EAAE,CAAC;IACf,qBAAqB,EAAE;QACrB,MAAM,EAAE,EAAE;KACX;IACD,sBAAsB,EAAE;QACtB,EAAE,EAAE,CAAC;KACN;CACF,CAAC,CACH,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../src/components/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,oBAAoB,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAE9C,MAAM,CAAC,MAAM,IAAI,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAChD,KAAK,CAAC,WAAW,CAAC;IAChB,YAAY,EAAE,CAAC;IACf,qBAAqB,EAAE;QACrB,MAAM,EAAE,EAAE;KACX;IACD,sBAAsB,EAAE;QACtB,EAAE,EAAE,CAAC;KACN;IACD,gBAAgB,EAAE;QAChB,UAAU,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB;KAC/C;CACF,CAAC,CACH,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/esm/extensions/catalog/contrib/SiteAvailability.js

@@ -0,0 +1,66 @@
+import React from "react";
+import LocalOfferOutlinedIcon from "@mui/icons-material/LocalOfferOutlined";
+import ReportIcon from "@mui/icons-material/Report";
+import WarningIcon from "@mui/icons-material/Warning";
+import { Grid2 as Grid, Stack, Typography } from "@mui/material";
+import Card from "../../../components/Card";
+import CardContent from "../../../components/Card/CardContent";
+import CardHeader from "../../../components/Card/CardHeader";
+import CardPill from "../../../components/Card/CardPill";
+import Content from "../../../containers/Content";
+const parseStatus = (value) => {
+    if (!value) {
+        return { codes: [] };
+    }
+    const trimmed = value.trim();
+    const match = /^([^[]+)\[([^\]]*)\]>?$/.exec(trimmed);
+    if (!match) {
+        return { label: trimmed, codes: [] };
+    }
+    const [, label, codes] = match;
+    return {
+        label: label.trim(),
+        codes: codes
+            .split(",")
+            .map((code) => code.trim())
+            .filter(Boolean),
+    };
+};
+const formatItem = (label, value) => (React.createElement(Stack, { key: label, direction: "row", justifyContent: "space-between", spacing: 2 },
+    React.createElement(Typography, { color: "text.secondary", variant: "body2" }, label),
+    typeof value === "string" || typeof value === "number" ? (React.createElement(Typography, { variant: "body2" }, value)) : (value)));
+const ItemCard = ({ item }) => {
+    const { label: errorLabel, codes: errorCodes } = parseStatus(item.error);
+    const { label: warningLabel, codes: warningCodes } = parseStatus(item.warning);
+    return (React.createElement(Card, null,
+        React.createElement(CardHeader, { title: item.site_code }),
+        React.createElement(CardContent, null,
+            React.createElement(Stack, { spacing: 1 },
+                formatItem("Reference", item.reference),
+                formatItem("Name", item.name),
+                formatItem("Variant", item.variant || "—"),
+                formatItem("Price", item.base_price !== item.price ? (React.createElement(Stack, { alignItems: "center", direction: "row", spacing: 1 },
+                    React.createElement(Typography, { color: "text.disabled", sx: { textDecoration: "line-through" }, variant: "body2" },
+                        item.base_price,
+                        " ",
+                        item.currency),
+                    React.createElement(LocalOfferOutlinedIcon, { color: "error", fontSize: "small" }),
+                    React.createElement(Typography, { color: "error", variant: "body2" },
+                        item.price,
+                        " ",
+                        item.currency))) : (`${item.price} ${item.currency}`)),
+                React.createElement(Stack, { alignItems: "center", alignSelf: "flex-start", direction: "row", flexWrap: "wrap", gap: 1 },
+                    errorLabel && React.createElement(CardPill, { color: "error", icon: React.createElement(ReportIcon, null), label: errorLabel }),
+                    errorCodes.map((code) => (React.createElement(CardPill, { key: `error-${code}`, color: "error", icon: null, label: code, variant: "outlined" }))),
+                    warningLabel && (React.createElement(CardPill, { color: "warning", icon: React.createElement(WarningIcon, null), label: warningLabel })),
+                    warningCodes.map((code) => (React.createElement(CardPill, { key: `warning-${code}`, color: "warning", icon: null, label: code, variant: "outlined" }))),
+                    React.createElement(CardPill, { color: item.is_available ? "success" : "warning", label: item.is_available ? "Available" : "Unavailable" }))))));
+};
+const SiteAvailability = ({ data }) => {
+    const items = data.items ?? [];
+    return (React.createElement(Content, { layout: "fullWidth" }, items.length > 0 ? (React.createElement(Grid, { container: true, columns: 12, spacing: 2, width: "100%" }, items.map((item) => (React.createElement(Grid, { key: `${item.site_code}-${item.reference}`, size: { xs: 12, md: 4 } },
+        React.createElement(Stack, { spacing: 2 },
+            React.createElement(ItemCard, { item: item }))))))) : (React.createElement(Typography, { color: "text.secondary", variant: "body2" }, "No items found"))));
+};
+export default SiteAvailability;
+//# sourceMappingURL=SiteAvailability.js.map

package/dist/esm/extensions/catalog/contrib/SiteAvailability.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SiteAvailability.js","sourceRoot":"","sources":["../../../../../src/extensions/catalog/contrib/SiteAvailability.tsx"],"names":[],"mappings":"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"}

package/dist/esm/extensions/catalog/index.js

@@ -1,5 +1,7 @@
+import StorefrontIcon from "@mui/icons-material/Storefront";
 import WorkspacesIcon from "../../assets/symbols/Workspaces";
 export * from "./types/article";
+export * from "./types/contrib";
 const routes = {
     article: {
         create: { page: async () => (await import("./pages/article/create")).default, offline: true },
@@ -26,4 +28,15 @@ export const navigation = {
         permission: "catalog.view_article",
     },
 };
+export const contrib = {
+    pos: {
+        "catalog:article:detail:items": {
+            title: "Availability",
+            icon: StorefrontIcon,
+            component: async () => (await import("./contrib/SiteAvailability")).default,
+            variant: "tab",
+            permission: "catalog.view_article",
+        },
+    },
+};
 //# sourceMappingURL=index.js.map

package/dist/esm/extensions/catalog/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/extensions/catalog/index.tsx"],"names":[],"mappings":"AAEA,OAAO,cAAc,MAAM,iCAAiC,CAAC;AAI7D,cAAc,iBAAiB,CAAC;AAEhC,MAAM,MAAM,GAYR;IACF,OAAO,EAAE;QACP,MAAM,EAAE,EAAE,IAAI,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,MAAM,CAAC,wBAAwB,CAAC,CAAC,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;QAC7F,MAAM,EAAE,EAAE,IAAI,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,MAAM,CAAC,wBAAwB,CAAC,CAAC,CAAC,OAAO,EAAE;QAC9E,IAAI,EAAE,EAAE,IAAI,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,MAAM,CAAC,sBAAsB,CAAC,CAAC,CAAC,OAAO,EAAE;KAC3E;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAoB;IACrC,GAAG,EAAE,SAAS;IACd,KAAK,EAAE,CAAC,KAAK,EAAE,EAAE;QACf,MAAM,EAAE,IAAI,EAAE,GAAG,GAAG,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;QAElE,IAAI,IAAI,IAAI,IAAI,EAAE,CAAC;YACjB,OAAO;gBACL,IAAI,EAAE,IAAI,EAAE;gBACZ,GAAG,GAAG;aACP,CAAC;QACJ,CAAC;QAED,OAAO,SAAS,CAAC;IACnB,CAAC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAwB;IAC7C,sBAAsB,EAAE;QACtB,IAAI,EAAE,cAAc;QACpB,UAAU,EAAE,sBAAsB;KACnC;CACO,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/extensions/catalog/index.tsx"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,gCAAgC,CAAC;AAI5D,OAAO,cAAc,MAAM,iCAAiC,CAAC;AAI7D,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAEhC,MAAM,MAAM,GAYR;IACF,OAAO,EAAE;QACP,MAAM,EAAE,EAAE,IAAI,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,MAAM,CAAC,wBAAwB,CAAC,CAAC,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;QAC7F,MAAM,EAAE,EAAE,IAAI,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,MAAM,CAAC,wBAAwB,CAAC,CAAC,CAAC,OAAO,EAAE;QAC9E,IAAI,EAAE,EAAE,IAAI,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,MAAM,CAAC,sBAAsB,CAAC,CAAC,CAAC,OAAO,EAAE;KAC3E;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAoB;IACrC,GAAG,EAAE,SAAS;IACd,KAAK,EAAE,CAAC,KAAK,EAAE,EAAE;QACf,MAAM,EAAE,IAAI,EAAE,GAAG,GAAG,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;QAElE,IAAI,IAAI,IAAI,IAAI,EAAE,CAAC;YACjB,OAAO;gBACL,IAAI,EAAE,IAAI,EAAE;gBACZ,GAAG,GAAG;aACP,CAAC;QACJ,CAAC;QAED,OAAO,SAAS,CAAC;IACnB,CAAC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAwB;IAC7C,sBAAsB,EAAE;QACtB,IAAI,EAAE,cAAc;QACpB,UAAU,EAAE,sBAAsB;KACnC;CACO,CAAC;AAEX,MAAM,CAAC,MAAM,OAAO,GAAwC;IAC1D,GAAG,EAAE;QACH,8BAA8B,EAAE;YAC9B,KAAK,EAAE,cAAc;YACrB,IAAI,EAAE,cAAc;YACpB,SAAS,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,MAAM,CAAC,4BAA4B,CAAC,CAAC,CAAC,OAAO;YAC3E,OAAO,EAAE,KAAK;YACd,UAAU,EAAE,sBAAsB;SACnC;KACF;CACO,CAAC"}

package/dist/esm/extensions/catalog/types/contrib.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=contrib.js.map

package/dist/esm/extensions/catalog/types/contrib.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contrib.js","sourceRoot":"","sources":["../../../../../src/extensions/catalog/types/contrib.ts"],"names":[],"mappings":""}

package/dist/types/components/Card/CardPill.d.ts

@@ -4,6 +4,7 @@ import { OverridableStringUnion } from "@mui/types";
 import { Pill } from "./shared";
 export interface CardPillProps extends Pill {
     size?: OverridableStringUnion<"small" | "medium", ChipPropsSizeOverrides>;
+    variant?: "filled" | "outlined";
 }
 export declare const CardPill: React.FC<CardPillProps>;
 export default CardPill;

package/dist/types/components/Card/shared.d.ts

@@ -6,7 +6,7 @@ export interface FormOption {
 export interface Pill {
     label: string;
     color?: "success" | "error" | "warning" | "info" | "default";
-    icon?: React.ReactElement;
+    icon?: React.ReactElement | null;
 }
 export interface CardFieldBaseProps extends React.PropsWithChildren {
     formName: string;

package/dist/types/extensions/catalog/contrib/SiteAvailability.d.ts

@@ -0,0 +1,4 @@
+import { ContribComponent } from "../../../types";
+import { SiteItemsResponse } from "../types/contrib";
+declare const SiteAvailability: ContribComponent<SiteItemsResponse>;
+export default SiteAvailability;

package/dist/types/extensions/catalog/index.d.ts

@@ -1,5 +1,7 @@
 import { RouterExtension } from "../../router/Router";
-import { NavigationOverrides } from "../../types";
+import { ContribComponentMap, NavigationOverrides } from "../../types";
 export * from "./types/article";
+export * from "./types/contrib";
 export declare const router: RouterExtension;
 export declare const navigation: NavigationOverrides;
+export declare const contrib: Record<string, ContribComponentMap>;

package/dist/types/extensions/catalog/types/contrib.d.ts

@@ -0,0 +1,15 @@
+export interface SiteItem {
+    site_code: string;
+    currency: string;
+    reference: string;
+    name: string;
+    variant: string;
+    base_price: string;
+    price: string;
+    is_available: boolean;
+    error?: string | null;
+    warning?: string | null;
+}
+export interface SiteItemsResponse {
+    items: SiteItem[];
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bananas-commerce-admin",
-  "version": "0.19.5",
+  "version": "0.19.6",
   "description": "What's this, an admin for apes?",
   "keywords": [
     "admin",

package/src/components/Card/CardPill.tsx

@@ -2,6 +2,7 @@ import React from "react";
 
 import CancelIcon from "@mui/icons-material/Cancel";
 import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import WarningIcon from "@mui/icons-material/Warning";
 import { ChipPropsSizeOverrides } from "@mui/material/Chip";
 import { OverridableStringUnion } from "@mui/types";
 
@@ -11,16 +12,37 @@ import { Pill } from "./shared";
 
 export interface CardPillProps extends Pill {
   size?: OverridableStringUnion<"small" | "medium", ChipPropsSizeOverrides>;
+  variant?: "filled" | "outlined";
 }
 
 // TODO Logic for picking icon
-export const CardPill: React.FC<CardPillProps> = ({ label, color, icon, size = "small" }) => {
+export const CardPill: React.FC<CardPillProps> = ({
+  label,
+  color,
+  icon,
+  size = "small",
+  variant,
+}) => {
+  let resolvedIcon: React.ReactElement | undefined;
+  if (icon === undefined) {
+    if (color === "success") {
+      resolvedIcon = <CheckCircleIcon />;
+    } else if (color === "warning") {
+      resolvedIcon = <WarningIcon />;
+    } else {
+      resolvedIcon = <CancelIcon />;
+    }
+  } else {
+    resolvedIcon = icon ?? undefined;
+  }
+
   return (
     <Chip
       color={color ?? "success"}
-      icon={icon ?? (color === "success" ? <CheckCircleIcon /> : <CancelIcon />)}
+      icon={resolvedIcon}
       label={label}
       size={size}
+      variant={variant}
     />
   );
 };

package/src/components/Card/shared.ts

@@ -8,7 +8,7 @@ export interface FormOption {
 export interface Pill {
   label: string;
   color?: "success" | "error" | "warning" | "info" | "default";
-  icon?: React.ReactElement;
+  icon?: React.ReactElement | null;
 }
 
 export interface CardFieldBaseProps extends React.PropsWithChildren {

package/src/components/Chip.tsx

@@ -10,6 +10,9 @@ export const Chip = styled(MuiChip)(({ theme }) =>
     ".MuiChip-labelMedium": {
       pl: 1,
     },
+    ".MuiChip-label": {
+      fontWeight: theme.typography.fontWeightRegular,
+    },
   }),
 );
 

package/src/extensions/catalog/contrib/SiteAvailability.tsx

@@ -0,0 +1,138 @@
+import React from "react";
+
+import LocalOfferOutlinedIcon from "@mui/icons-material/LocalOfferOutlined";
+import ReportIcon from "@mui/icons-material/Report";
+import WarningIcon from "@mui/icons-material/Warning";
+import { Grid2 as Grid, Stack, Typography } from "@mui/material";
+
+import Card from "../../../components/Card";
+import CardContent from "../../../components/Card/CardContent";
+import CardHeader from "../../../components/Card/CardHeader";
+import CardPill from "../../../components/Card/CardPill";
+import Content from "../../../containers/Content";
+import { ContribComponent } from "../../../types";
+import { SiteItem, SiteItemsResponse } from "../types/contrib";
+
+const parseStatus = (value: string | null | undefined): { label?: string; codes: string[] } => {
+  if (!value) {
+    return { codes: [] };
+  }
+  const trimmed = value.trim();
+  const match = /^([^[]+)\[([^\]]*)\]>?$/.exec(trimmed);
+  if (!match) {
+    return { label: trimmed, codes: [] };
+  }
+  const [, label, codes] = match;
+  return {
+    label: label.trim(),
+    codes: codes
+      .split(",")
+      .map((code) => code.trim())
+      .filter(Boolean),
+  };
+};
+
+const formatItem = (label: string, value: React.ReactNode) => (
+  <Stack key={label} direction="row" justifyContent="space-between" spacing={2}>
+    <Typography color="text.secondary" variant="body2">
+      {label}
+    </Typography>
+    {typeof value === "string" || typeof value === "number" ? (
+      <Typography variant="body2">{value}</Typography>
+    ) : (
+      value
+    )}
+  </Stack>
+);
+
+const ItemCard: React.FC<{ item: SiteItem }> = ({ item }) => {
+  const { label: errorLabel, codes: errorCodes } = parseStatus(item.error);
+  const { label: warningLabel, codes: warningCodes } = parseStatus(item.warning);
+
+  return (
+    <Card>
+      <CardHeader title={item.site_code} />
+      <CardContent>
+        <Stack spacing={1}>
+          {formatItem("Reference", item.reference)}
+          {formatItem("Name", item.name)}
+          {formatItem("Variant", item.variant || "—")}
+          {formatItem(
+            "Price",
+            item.base_price !== item.price ? (
+              <Stack alignItems="center" direction="row" spacing={1}>
+                <Typography
+                  color="text.disabled"
+                  sx={{ textDecoration: "line-through" }}
+                  variant="body2"
+                >
+                  {item.base_price} {item.currency}
+                </Typography>
+                <LocalOfferOutlinedIcon color="error" fontSize="small" />
+                <Typography color="error" variant="body2">
+                  {item.price} {item.currency}
+                </Typography>
+              </Stack>
+            ) : (
+              `${item.price} ${item.currency}`
+            ),
+          )}
+          <Stack alignItems="center" alignSelf="flex-start" direction="row" flexWrap="wrap" gap={1}>
+            {errorLabel && <CardPill color="error" icon={<ReportIcon />} label={errorLabel} />}
+            {errorCodes.map((code) => (
+              <CardPill
+                key={`error-${code}`}
+                color="error"
+                icon={null}
+                label={code}
+                variant="outlined"
+              />
+            ))}
+            {warningLabel && (
+              <CardPill color="warning" icon={<WarningIcon />} label={warningLabel} />
+            )}
+            {warningCodes.map((code) => (
+              <CardPill
+                key={`warning-${code}`}
+                color="warning"
+                icon={null}
+                label={code}
+                variant="outlined"
+              />
+            ))}
+            <CardPill
+              color={item.is_available ? "success" : "warning"}
+              label={item.is_available ? "Available" : "Unavailable"}
+            />
+          </Stack>
+        </Stack>
+      </CardContent>
+    </Card>
+  );
+};
+
+const SiteAvailability: ContribComponent<SiteItemsResponse> = ({ data }) => {
+  const items = data.items ?? [];
+
+  return (
+    <Content layout="fullWidth">
+      {items.length > 0 ? (
+        <Grid container columns={12} spacing={2} width="100%">
+          {items.map((item) => (
+            <Grid key={`${item.site_code}-${item.reference}`} size={{ xs: 12, md: 4 }}>
+              <Stack spacing={2}>
+                <ItemCard item={item} />
+              </Stack>
+            </Grid>
+          ))}
+        </Grid>
+      ) : (
+        <Typography color="text.secondary" variant="body2">
+          No items found
+        </Typography>
+      )}
+    </Content>
+  );
+};
+
+export default SiteAvailability;

package/src/extensions/catalog/index.tsx

@@ -1,10 +1,13 @@
+import StorefrontIcon from "@mui/icons-material/Storefront";
+
 import { OpenAPI } from "openapi-types";
 
 import WorkspacesIcon from "../../assets/symbols/Workspaces";
 import { RouterExtension } from "../../router/Router";
-import { NavigationOverrides, PageComponent } from "../../types";
+import { ContribComponentMap, NavigationOverrides, PageComponent } from "../../types";
 
 export * from "./types/article";
+export * from "./types/contrib";
 
 const routes: Record<
   string,
@@ -48,3 +51,15 @@ export const navigation: NavigationOverrides = {
     permission: "catalog.view_article",
   },
 } as const;
+
+export const contrib: Record<string, ContribComponentMap> = {
+  pos: {
+    "catalog:article:detail:items": {
+      title: "Availability",
+      icon: StorefrontIcon,
+      component: async () => (await import("./contrib/SiteAvailability")).default,
+      variant: "tab",
+      permission: "catalog.view_article",
+    },
+  },
+} as const;

package/src/extensions/catalog/types/contrib.ts

@@ -0,0 +1,16 @@
+export interface SiteItem {
+  site_code: string;
+  currency: string;
+  reference: string;
+  name: string;
+  variant: string;
+  base_price: string;
+  price: string;
+  is_available: boolean;
+  error?: string | null;
+  warning?: string | null;
+}
+
+export interface SiteItemsResponse {
+  items: SiteItem[];
+}