@dutchiesdk/ecommerce-extensions-sdk 0.19.3 → 0.20.0

package/README.md

@@ -380,6 +380,8 @@ import type {
   // Component types
   RemoteBoundaryComponent,
   RemoteModuleRegistry,
+  ListPageEntry,
+  ListPageCategory,
 
   // Data types
   Actions,
@@ -951,6 +953,11 @@ type RemoteModuleRegistry = {
   StoreFrontHero?: ModuleRegistryEntry;
   StoreFrontCarouselInterstitials?: ModuleRegistryEntry[];
   ProductDetailsPrimary?: ModuleRegistryEntry;
+  ListPageHero?: ModuleRegistryEntry;
+
+  // Category page components (indexed by pagination page number)
+  CategoryPageInterstitials?: ListPageEntry[];
+  CategoryPageSlots?: ListPageEntry[];
 
   // Custom routable pages
   RouteablePages?: RoutablePageRegistryEntry[];
@@ -979,6 +986,27 @@ type RoutablePageRegistryEntry = {
   path: string;
   component: RemoteBoundaryComponent;
 };
+
+type ListPageCategory =
+  | "accessories"
+  | "apparel"
+  | "cbd"
+  | "clones"
+  | "concentrates"
+  | "edibles"
+  | "flower"
+  | "orals"
+  | "pre-rolls"
+  | "seeds"
+  | "tinctures"
+  | "topicals"
+  | "vaporizers"
+  | string;
+
+type ListPageEntry = {
+  category?: ListPageCategory;
+  components: RemoteBoundaryComponent[];
+};
 ```
 
 **Basic Registry:**
@@ -1038,6 +1066,119 @@ export default {
 } satisfies RemoteModuleRegistry;
 ```
 
+#### Category Page Components
+
+The `CategoryPageInterstitials` and `CategoryPageSlots` registry entries allow you to inject custom components into category listing pages. Both use the same configuration structure but appear in different locations on the page.
+
+**Type:**
+
+```typescript
+type ListPageCategory =
+  | "accessories"
+  | "apparel"
+  | "cbd"
+  | "clones"
+  | "concentrates"
+  | "edibles"
+  | "flower"
+  | "orals"
+  | "pre-rolls"
+  | "seeds"
+  | "tinctures"
+  | "topicals"
+  | "vaporizers"
+  | string; // Custom category names are also supported
+
+type ListPageEntry = {
+  category?: ListPageCategory; // Category to match, or undefined for fallback
+  components: RemoteBoundaryComponent[]; // Components indexed by page number
+};
+```
+
+**Category Matching:**
+
+- **Predefined category**: When `category` matches a built-in category (e.g., `"edibles"`, `"flower"`), the components display on that category's listing page
+- **Custom category string**: When `category` is a string that doesn't match a predefined category, it matches a custom category with that name
+- **Fallback (undefined)**: When `category` is omitted, the entry serves as a fallback used when no other category-specific entries match
+
+**Page-Based Component Selection:**
+
+The `components` array is indexed by the current pagination page number:
+
+- `components[0]` displays on page 1
+- `components[1]` displays on page 2
+- And so on...
+
+If the current page number exceeds the array length, no component is displayed for that page.
+
+**Example:**
+
+```tsx
+import type { RemoteModuleRegistry } from "@dutchiesdk/ecommerce-extensions-sdk";
+import { createLazyRemoteBoundaryComponent } from "@dutchiesdk/ecommerce-extensions-sdk";
+
+export default {
+  CategoryPageInterstitials: [
+    // Components for the "edibles" category
+    {
+      category: "edibles",
+      components: [
+        createLazyRemoteBoundaryComponent(
+          () => import("./interstitials/EdiblesPage1")
+        ),
+        createLazyRemoteBoundaryComponent(
+          () => import("./interstitials/EdiblesPage2")
+        ),
+      ],
+    },
+    // Components for a custom category
+    {
+      category: "limited-edition",
+      components: [
+        createLazyRemoteBoundaryComponent(
+          () => import("./interstitials/LimitedEditionPromo")
+        ),
+      ],
+    },
+    // Fallback for all other categories
+    {
+      // No category specified - this is the fallback
+      components: [
+        createLazyRemoteBoundaryComponent(
+          () => import("./interstitials/DefaultPage1")
+        ),
+        createLazyRemoteBoundaryComponent(
+          () => import("./interstitials/DefaultPage2")
+        ),
+        createLazyRemoteBoundaryComponent(
+          () => import("./interstitials/DefaultPage3")
+        ),
+      ],
+    },
+  ],
+
+  CategoryPageSlots: [
+    // Slots specific to flower category
+    {
+      category: "flower",
+      components: [
+        createLazyRemoteBoundaryComponent(
+          () => import("./slots/FlowerFeatured")
+        ),
+      ],
+    },
+    // Fallback slots for all other categories
+    {
+      components: [
+        createLazyRemoteBoundaryComponent(
+          () => import("./slots/GenericPromo")
+        ),
+      ],
+    },
+  ],
+} satisfies RemoteModuleRegistry;
+```
+
 ### Meta Fields & SEO
 
 The `getStoreFrontMetaFields` function allows you to dynamically generate page metadata (title, description, Open Graph tags, structured data) based on the current page and available data.
@@ -1553,6 +1694,11 @@ export default {
     () => import("./components/Hero")
   ),
 
+  // Hero on Product List pages
+  ListPageHero: createLazyRemoteBoundaryComponent(
+    () => import("./store-front/list-page-hero")
+  ),
+
   // Custom product page
   ProductDetailsPrimary: createLazyRemoteBoundaryComponent(
     () => import("./components/ProductDetails")

package/dist/context/ecommerce-data-bridge.cjs

@@ -30,7 +30,7 @@ __webpack_require__.d(__webpack_exports__, {
     useDataBridge: ()=>useDataBridge
 });
 const external_react_namespaceObject = require("react");
-const DataBridgeVersion = '0.19.3';
+const DataBridgeVersion = '0.20.0';
 const DataBridgeContext = (0, external_react_namespaceObject.createContext)(void 0);
 const useDataBridge = ()=>{
     const context = (0, external_react_namespaceObject.useContext)(DataBridgeContext);

package/dist/esm/context/ecommerce-data-bridge.js

@@ -1,5 +1,5 @@
 import { createContext, useContext, useEffect, useState } from "react";
-const DataBridgeVersion = '0.19.3';
+const DataBridgeVersion = '0.20.0';
 const DataBridgeContext = createContext(void 0);
 const useDataBridge = ()=>{
     const context = useContext(DataBridgeContext);

package/dist/esm/types/ecommerce-extension.d.ts

@@ -58,6 +58,7 @@ export type RemoteModuleRegistry = {
     StoreFrontCarouselInterstitials?: ModuleRegistryEntry[];
     StoreFrontHero?: ModuleRegistryEntry;
     ProductDetailsPrimary?: ModuleRegistryEntry;
+    ListPageHero?: ModuleRegistryEntry;
     /**
      * Function that provides meta fields for the current page.
      * Replaces the StoreFrontMeta component approach.

package/dist/types/ecommerce-extension.d.ts

@@ -58,6 +58,7 @@ export type RemoteModuleRegistry = {
     StoreFrontCarouselInterstitials?: ModuleRegistryEntry[];
     StoreFrontHero?: ModuleRegistryEntry;
     ProductDetailsPrimary?: ModuleRegistryEntry;
+    ListPageHero?: ModuleRegistryEntry;
     /**
      * Function that provides meta fields for the current page.
      * Replaces the StoreFrontMeta component approach.

package/package.json

@@ -4,7 +4,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.19.3",
+  "version": "0.20.0",
   "license": "MIT",
   "type": "module",
   "module": "./dist/esm/index.js",