@dutchiesdk/ecommerce-extensions-sdk 0.21.0 → 0.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/dist/components/remote-boundary.cjs +15 -16
  2. package/dist/components/remote-boundary.d.ts +11 -8
  3. package/dist/context/ecommerce-data-bridge.cjs +1 -1
  4. package/dist/esm/components/remote-boundary.d.ts +11 -8
  5. package/dist/esm/components/remote-boundary.js +16 -17
  6. package/dist/esm/context/ecommerce-data-bridge.js +1 -1
  7. package/dist/esm/types/ecommerce-extension.d.ts +6 -1
  8. package/dist/types/ecommerce-extension.d.ts +6 -1
  9. package/package.json +1 -1
package/dist/components/remote-boundary.cjs CHANGED
@@ -32,10 +32,13 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
32
32
  const external_react_namespaceObject = require("react");
33
33
  const ecommerce_data_bridge_cjs_namespaceObject = require("../context/ecommerce-data-bridge.cjs");
34
34
  const withRemoteBoundary = (WrappedComponent)=>{
35
- function WithRemoteBoundaryComponent({ data }) {
35
+ function WithRemoteBoundaryComponent(props) {
36
+ const { __dsdk__dataBridgeData, data, ...rest } = props;
36
37
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ecommerce_data_bridge_cjs_namespaceObject.DataBridgeContext.Provider, {
37
- value: data,
38
- children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(WrappedComponent, {})
38
+ value: __dsdk__dataBridgeData ?? data,
39
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(WrappedComponent, {
40
+ ...rest
41
+ })
39
42
  });
40
43
  }
41
44
  WithRemoteBoundaryComponent.DataBridgeVersion = ecommerce_data_bridge_cjs_namespaceObject.DataBridgeVersion;
@@ -45,21 +48,19 @@ function createLazyRemoteBoundaryComponent(importFn, options = {}) {
45
48
  const { fallback, onError } = options;
46
49
  const LazyComponent = /*#__PURE__*/ (0, external_react_namespaceObject.lazy)(async ()=>{
47
50
  try {
48
- const module = await importFn();
49
- const WrappedComponent = withRemoteBoundary(module.default);
50
- return {
51
- default: WrappedComponent
52
- };
51
+ return await importFn();
53
52
  } catch (error) {
54
53
  onError?.(error);
55
54
  throw error;
56
55
  }
57
56
  });
58
57
  function LazyRemoteBoundaryWrapper(props) {
59
- return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_namespaceObject.Suspense, {
60
- fallback: fallback || null,
61
- children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(LazyComponent, {
62
- ...props
58
+ const { __dsdk__dataBridgeData, data, ...rest } = props;
59
+ return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ecommerce_data_bridge_cjs_namespaceObject.DataBridgeContext.Provider, {
60
+ value: __dsdk__dataBridgeData ?? data,
61
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_namespaceObject.Suspense, {
62
+ fallback: fallback || null,
63
+ children: /*#__PURE__*/ (0, external_react_namespaceObject.createElement)(LazyComponent, rest)
63
64
  })
64
65
  });
65
66
  }
@@ -67,11 +68,9 @@ function createLazyRemoteBoundaryComponent(importFn, options = {}) {
67
68
  return LazyRemoteBoundaryWrapper;
68
69
  }
69
70
  function createRemoteBoundaryComponent(Component) {
70
- const WrappedComponent = withRemoteBoundary(Component);
71
+ const Wrapped = withRemoteBoundary(Component);
71
72
  function RemoteBoundaryWrapper(props) {
72
- return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(WrappedComponent, {
73
- ...props
74
- });
73
+ return /*#__PURE__*/ (0, external_react_namespaceObject.createElement)(Wrapped, props);
75
74
  }
76
75
  RemoteBoundaryWrapper.DataBridgeVersion = ecommerce_data_bridge_cjs_namespaceObject.DataBridgeVersion;
77
76
  return RemoteBoundaryWrapper;
package/dist/components/remote-boundary.d.ts CHANGED
@@ -1,20 +1,23 @@
1
1
  import { type ComponentType, type ReactNode } from 'react';
2
- import type { RemoteBoundaryComponent } from '../types/ecommerce-extension';
2
+ import type { RemoteBoundaryComponent, SupportedDirectProps } from '../types/ecommerce-extension';
3
3
  import type { CommerceComponentsDataInterface } from '../types/interface';
4
- type WithRemoteBoundaryProps = {
4
+ export type WithRemoteBoundaryProps = {
5
+ __dsdk__dataBridgeData?: CommerceComponentsDataInterface;
6
+ /** @deprecated Use __dsdk__dataBridgeData instead */
5
7
  data?: CommerceComponentsDataInterface;
6
8
  };
7
- export declare const withRemoteBoundary: (WrappedComponent: ComponentType) => {
8
- ({ data }: WithRemoteBoundaryProps): import("react/jsx-runtime").JSX.Element;
9
+ /** Wraps a component so it receives data bridge context, while forwarding SDK-defined props (e.g. ProductCardGridProps). */
10
+ export declare const withRemoteBoundary: <P extends SupportedDirectProps = {}>(WrappedComponent: ComponentType<P>) => {
11
+ (props: P & WithRemoteBoundaryProps): import("react/jsx-runtime").JSX.Element;
9
12
  DataBridgeVersion: string;
10
13
  };
11
14
  interface LazyRemoteBoundaryOptions {
12
15
  fallback?: ReactNode;
13
16
  onError?: (error: Error) => void;
14
17
  }
15
- export declare function createLazyRemoteBoundaryComponent<P extends WithRemoteBoundaryProps = WithRemoteBoundaryProps>(importFn: () => Promise<{
16
- default: ComponentType;
17
- }>, options?: LazyRemoteBoundaryOptions): RemoteBoundaryComponent<P>;
18
+ export declare function createLazyRemoteBoundaryComponent<P extends SupportedDirectProps = {}>(importFn: () => Promise<{
19
+ default: ComponentType<P>;
20
+ }>, options?: LazyRemoteBoundaryOptions): RemoteBoundaryComponent<P & WithRemoteBoundaryProps>;
18
21
  /** Wraps a component with the data bridge context (non-lazy). */
19
- export declare function createRemoteBoundaryComponent<P extends WithRemoteBoundaryProps = WithRemoteBoundaryProps>(Component: ComponentType): RemoteBoundaryComponent<P>;
22
+ export declare function createRemoteBoundaryComponent<P extends SupportedDirectProps = {}>(Component: ComponentType<P>): RemoteBoundaryComponent<P & WithRemoteBoundaryProps>;
20
23
  export {};
package/dist/context/ecommerce-data-bridge.cjs CHANGED
@@ -30,7 +30,7 @@ __webpack_require__.d(__webpack_exports__, {
30
30
  useDataBridge: ()=>useDataBridge
31
31
  });
32
32
  const external_react_namespaceObject = require("react");
33
- const DataBridgeVersion = '0.21.0';
33
+ const DataBridgeVersion = '0.22.0';
34
34
  const DataBridgeContext = (0, external_react_namespaceObject.createContext)(void 0);
35
35
  const useDataBridge = ()=>{
36
36
  const context = (0, external_react_namespaceObject.useContext)(DataBridgeContext);
package/dist/esm/components/remote-boundary.d.ts CHANGED
@@ -1,20 +1,23 @@
1
1
  import { type ComponentType, type ReactNode } from 'react';
2
- import type { RemoteBoundaryComponent } from '../types/ecommerce-extension';
2
+ import type { RemoteBoundaryComponent, SupportedDirectProps } from '../types/ecommerce-extension';
3
3
  import type { CommerceComponentsDataInterface } from '../types/interface';
4
- type WithRemoteBoundaryProps = {
4
+ export type WithRemoteBoundaryProps = {
5
+ __dsdk__dataBridgeData?: CommerceComponentsDataInterface;
6
+ /** @deprecated Use __dsdk__dataBridgeData instead */
5
7
  data?: CommerceComponentsDataInterface;
6
8
  };
7
- export declare const withRemoteBoundary: (WrappedComponent: ComponentType) => {
8
- ({ data }: WithRemoteBoundaryProps): import("react/jsx-runtime").JSX.Element;
9
+ /** Wraps a component so it receives data bridge context, while forwarding SDK-defined props (e.g. ProductCardGridProps). */
10
+ export declare const withRemoteBoundary: <P extends SupportedDirectProps = {}>(WrappedComponent: ComponentType<P>) => {
11
+ (props: P & WithRemoteBoundaryProps): import("react/jsx-runtime").JSX.Element;
9
12
  DataBridgeVersion: string;
10
13
  };
11
14
  interface LazyRemoteBoundaryOptions {
12
15
  fallback?: ReactNode;
13
16
  onError?: (error: Error) => void;
14
17
  }
15
- export declare function createLazyRemoteBoundaryComponent<P extends WithRemoteBoundaryProps = WithRemoteBoundaryProps>(importFn: () => Promise<{
16
- default: ComponentType;
17
- }>, options?: LazyRemoteBoundaryOptions): RemoteBoundaryComponent<P>;
18
+ export declare function createLazyRemoteBoundaryComponent<P extends SupportedDirectProps = {}>(importFn: () => Promise<{
19
+ default: ComponentType<P>;
20
+ }>, options?: LazyRemoteBoundaryOptions): RemoteBoundaryComponent<P & WithRemoteBoundaryProps>;
18
21
  /** Wraps a component with the data bridge context (non-lazy). */
19
- export declare function createRemoteBoundaryComponent<P extends WithRemoteBoundaryProps = WithRemoteBoundaryProps>(Component: ComponentType): RemoteBoundaryComponent<P>;
22
+ export declare function createRemoteBoundaryComponent<P extends SupportedDirectProps = {}>(Component: ComponentType<P>): RemoteBoundaryComponent<P & WithRemoteBoundaryProps>;
20
23
  export {};
package/dist/esm/components/remote-boundary.js CHANGED
@@ -1,11 +1,14 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
- import { Suspense, lazy } from "react";
2
+ import { Suspense, createElement, lazy } from "react";
3
3
  import { DataBridgeContext, DataBridgeVersion } from "../context/ecommerce-data-bridge.js";
4
4
  const withRemoteBoundary = (WrappedComponent)=>{
5
- function WithRemoteBoundaryComponent({ data }) {
5
+ function WithRemoteBoundaryComponent(props) {
6
+ const { __dsdk__dataBridgeData, data, ...rest } = props;
6
7
  return /*#__PURE__*/ jsx(DataBridgeContext.Provider, {
7
- value: data,
8
- children: /*#__PURE__*/ jsx(WrappedComponent, {})
8
+ value: __dsdk__dataBridgeData ?? data,
9
+ children: /*#__PURE__*/ jsx(WrappedComponent, {
10
+ ...rest
11
+ })
9
12
  });
10
13
  }
11
14
  WithRemoteBoundaryComponent.DataBridgeVersion = DataBridgeVersion;
@@ -15,21 +18,19 @@ function createLazyRemoteBoundaryComponent(importFn, options = {}) {
15
18
  const { fallback, onError } = options;
16
19
  const LazyComponent = /*#__PURE__*/ lazy(async ()=>{
17
20
  try {
18
- const module = await importFn();
19
- const WrappedComponent = withRemoteBoundary(module.default);
20
- return {
21
- default: WrappedComponent
22
- };
21
+ return await importFn();
23
22
  } catch (error) {
24
23
  onError?.(error);
25
24
  throw error;
26
25
  }
27
26
  });
28
27
  function LazyRemoteBoundaryWrapper(props) {
29
- return /*#__PURE__*/ jsx(Suspense, {
30
- fallback: fallback || null,
31
- children: /*#__PURE__*/ jsx(LazyComponent, {
32
- ...props
28
+ const { __dsdk__dataBridgeData, data, ...rest } = props;
29
+ return /*#__PURE__*/ jsx(DataBridgeContext.Provider, {
30
+ value: __dsdk__dataBridgeData ?? data,
31
+ children: /*#__PURE__*/ jsx(Suspense, {
32
+ fallback: fallback || null,
33
+ children: /*#__PURE__*/ createElement(LazyComponent, rest)
33
34
  })
34
35
  });
35
36
  }
@@ -37,11 +38,9 @@ function createLazyRemoteBoundaryComponent(importFn, options = {}) {
37
38
  return LazyRemoteBoundaryWrapper;
38
39
  }
39
40
  function createRemoteBoundaryComponent(Component) {
40
- const WrappedComponent = withRemoteBoundary(Component);
41
+ const Wrapped = withRemoteBoundary(Component);
41
42
  function RemoteBoundaryWrapper(props) {
42
- return /*#__PURE__*/ jsx(WrappedComponent, {
43
- ...props
44
- });
43
+ return /*#__PURE__*/ createElement(Wrapped, props);
45
44
  }
46
45
  RemoteBoundaryWrapper.DataBridgeVersion = DataBridgeVersion;
47
46
  return RemoteBoundaryWrapper;
package/dist/esm/context/ecommerce-data-bridge.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { createContext, useContext, useEffect, useState } from "react";
2
- const DataBridgeVersion = '0.21.0';
2
+ const DataBridgeVersion = '0.22.0';
3
3
  const DataBridgeContext = createContext(void 0);
4
4
  const useDataBridge = ()=>{
5
5
  const context = useContext(DataBridgeContext);
package/dist/esm/types/ecommerce-extension.d.ts CHANGED
@@ -2,13 +2,16 @@ import type React from 'react';
2
2
  import type { MenuContext } from './data';
3
3
  import type { Events } from './events';
4
4
  import type { CommerceComponentsDataInterface } from './interface';
5
+ import type { ProductCardGridProps, ProductCardListItemProps } from './product-card';
6
+ /** Union of SDK-defined direct prop types that can be passed through the remote boundary. */
7
+ export type SupportedDirectProps = {} | ProductCardGridProps | ProductCardListItemProps;
5
8
  export type RemoteBoundaryComponent<P = {}> = React.FC<P> & {
6
9
  DataBridgeVersion: string;
7
10
  };
8
11
  export type MenuSpecificRemoteComponent = {
9
12
  [key in MenuContext]?: RemoteBoundaryComponent;
10
13
  };
11
- export type ModuleRegistryEntry = MenuSpecificRemoteComponent | RemoteBoundaryComponent;
14
+ export type ModuleRegistryEntry = MenuSpecificRemoteComponent | RemoteBoundaryComponent | RemoteBoundaryComponent<SupportedDirectProps>;
12
15
  export type RoutablePageRegistryEntry = {
13
16
  component: RemoteBoundaryComponent;
14
17
  path: string;
@@ -55,6 +58,8 @@ export type RemoteModuleRegistry = {
55
58
  StoreFrontHeader?: ModuleRegistryEntry;
56
59
  StoreFrontNavigation?: ModuleRegistryEntry;
57
60
  StoreFrontFooter?: ModuleRegistryEntry;
61
+ /** CSS-in-JS global stylesheet injected at the theme provider level */
62
+ GlobalStyles?: ModuleRegistryEntry;
58
63
  StoreFrontCarouselInterstitials?: ModuleRegistryEntry[];
59
64
  StoreFrontHero?: ModuleRegistryEntry;
60
65
  ProductDetailsPrimary?: ModuleRegistryEntry;
package/dist/types/ecommerce-extension.d.ts CHANGED
@@ -2,13 +2,16 @@ import type React from 'react';
2
2
  import type { MenuContext } from './data';
3
3
  import type { Events } from './events';
4
4
  import type { CommerceComponentsDataInterface } from './interface';
5
+ import type { ProductCardGridProps, ProductCardListItemProps } from './product-card';
6
+ /** Union of SDK-defined direct prop types that can be passed through the remote boundary. */
7
+ export type SupportedDirectProps = {} | ProductCardGridProps | ProductCardListItemProps;
5
8
  export type RemoteBoundaryComponent<P = {}> = React.FC<P> & {
6
9
  DataBridgeVersion: string;
7
10
  };
8
11
  export type MenuSpecificRemoteComponent = {
9
12
  [key in MenuContext]?: RemoteBoundaryComponent;
10
13
  };
11
- export type ModuleRegistryEntry = MenuSpecificRemoteComponent | RemoteBoundaryComponent;
14
+ export type ModuleRegistryEntry = MenuSpecificRemoteComponent | RemoteBoundaryComponent | RemoteBoundaryComponent<SupportedDirectProps>;
12
15
  export type RoutablePageRegistryEntry = {
13
16
  component: RemoteBoundaryComponent;
14
17
  path: string;
@@ -55,6 +58,8 @@ export type RemoteModuleRegistry = {
55
58
  StoreFrontHeader?: ModuleRegistryEntry;
56
59
  StoreFrontNavigation?: ModuleRegistryEntry;
57
60
  StoreFrontFooter?: ModuleRegistryEntry;
61
+ /** CSS-in-JS global stylesheet injected at the theme provider level */
62
+ GlobalStyles?: ModuleRegistryEntry;
58
63
  StoreFrontCarouselInterstitials?: ModuleRegistryEntry[];
59
64
  StoreFrontHero?: ModuleRegistryEntry;
60
65
  ProductDetailsPrimary?: ModuleRegistryEntry;
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
7
- "version": "0.21.0",
7
+ "version": "0.22.0",
8
8
  "license": "MIT",
9
9
  "type": "module",
10
10
  "module": "./dist/esm/index.js",