@pack/react 4.2.1 → 4.3.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.
- package/dist/index.d.ts +2 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -2
- package/dist/pack/render-sections.d.ts +10 -1
- package/dist/pack/render-sections.d.ts.map +1 -1
- package/dist/pack/render-sections.js +27 -14
- package/dist/version.js +1 -1
- package/package.json +2 -2
package/dist/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { RenderSections, useSections } from "./pack/render-sections";
|
|
1
|
+
import { RenderSection, RenderSections, useSections } from "./pack/render-sections";
|
|
2
2
|
import { PackProvider, PreviewProvider } from "./pack/pack-context";
|
|
3
3
|
import { usePackContext } from "./pack/pack-context";
|
|
4
4
|
import { PackErrorBoundary } from "@pack/errors-react";
|
|
@@ -8,5 +8,5 @@ import { useOverlayScript } from "./use-overlay-script";
|
|
|
8
8
|
import { registerSection } from "./register-section";
|
|
9
9
|
import { registerStorefrontSettingsSchema } from "./register-storefront-settings-schema";
|
|
10
10
|
export type { ErrorTrackingOptions, PackErrorBoundaryFallbackRenderArgs, } from "@pack/errors-react";
|
|
11
|
-
export { PackErrorBoundary, PackProvider, PreviewProvider, RenderSections, registerSection, registerStorefrontSettingsSchema, useLocale, useOverlayScript, usePackContext, useSections, useSiteSettings, };
|
|
11
|
+
export { PackErrorBoundary, PackProvider, PreviewProvider, RenderSection, RenderSections, registerSection, registerStorefrontSettingsSchema, useLocale, useOverlayScript, usePackContext, useSections, useSiteSettings, };
|
|
12
12
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AACpF,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,gCAAgC,EAAE,MAAM,uCAAuC,CAAC;AAEzF,YAAY,EACV,oBAAoB,EACpB,mCAAmC,GACpC,MAAM,oBAAoB,CAAC;AAE5B,OAAO,EACL,iBAAiB,EACjB,YAAY,EACZ,eAAe,EACf,aAAa,EACb,cAAc,EACd,eAAe,EACf,gCAAgC,EAChC,SAAS,EACT,gBAAgB,EAChB,cAAc,EACd,WAAW,EACX,eAAe,GAChB,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { RenderSections, useSections } from "./pack/render-sections";
|
|
1
|
+
import { RenderSection, RenderSections, useSections } from "./pack/render-sections";
|
|
2
2
|
import { PackProvider, PreviewProvider } from "./pack/pack-context";
|
|
3
3
|
import { usePackContext } from "./pack/pack-context";
|
|
4
4
|
import { PackErrorBoundary } from "@pack/errors-react";
|
|
@@ -7,4 +7,4 @@ import { useLocale } from "./use-locale";
|
|
|
7
7
|
import { useOverlayScript } from "./use-overlay-script";
|
|
8
8
|
import { registerSection } from "./register-section";
|
|
9
9
|
import { registerStorefrontSettingsSchema } from "./register-storefront-settings-schema";
|
|
10
|
-
export { PackErrorBoundary, PackProvider, PreviewProvider, RenderSections, registerSection, registerStorefrontSettingsSchema, useLocale, useOverlayScript, usePackContext, useSections, useSiteSettings, };
|
|
10
|
+
export { PackErrorBoundary, PackProvider, PreviewProvider, RenderSection, RenderSections, registerSection, registerStorefrontSettingsSchema, useLocale, useOverlayScript, usePackContext, useSections, useSiteSettings, };
|
|
@@ -1,8 +1,17 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
interface RenderSectionProps {
|
|
3
|
+
/** Section node. Must carry an `id` or `clientId`. */
|
|
4
|
+
section: any;
|
|
5
|
+
}
|
|
6
|
+
/**
|
|
7
|
+
* Renders one section against the registry populated by `registerSection`.
|
|
8
|
+
* Use for nested-section blocks; for full-page rendering, use `RenderSections`.
|
|
9
|
+
*/
|
|
10
|
+
export declare function RenderSection({ section }: RenderSectionProps): React.JSX.Element | null;
|
|
2
11
|
interface RenderSectionsProps {
|
|
3
12
|
content?: any;
|
|
4
13
|
}
|
|
5
14
|
export declare function RenderSections(props: RenderSectionsProps): React.JSX.Element | null;
|
|
6
|
-
export declare function useSections(props: RenderSectionsProps):
|
|
15
|
+
export declare function useSections(props: RenderSectionsProps): React.JSX.Element[] | null;
|
|
7
16
|
export {};
|
|
8
17
|
//# sourceMappingURL=render-sections.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"render-sections.d.ts","sourceRoot":"","sources":["../../src/pack/render-sections.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"render-sections.d.ts","sourceRoot":"","sources":["../../src/pack/render-sections.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAMlD,UAAU,kBAAkB;IAC1B,sDAAsD;IACtD,OAAO,EAAE,GAAG,CAAC;CACd;AAED;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,EAAE,kBAAkB,4BA6B5D;AAyBD,UAAU,mBAAmB;IAC3B,OAAO,CAAC,EAAE,GAAG,CAAC;CACf;AA8BD,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,4BAKxD;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,mBAAmB,8BAOrD"}
|
|
@@ -2,26 +2,39 @@ import React, { useMemo, useEffect } from "react";
|
|
|
2
2
|
import { usePackContext } from "./pack-context";
|
|
3
3
|
import { sectionMap } from "../register-section";
|
|
4
4
|
import { generateSectionStylesheet } from "../lib/style-utils";
|
|
5
|
+
/**
|
|
6
|
+
* Renders one section against the registry populated by `registerSection`.
|
|
7
|
+
* Use for nested-section blocks; for full-page rendering, use `RenderSections`.
|
|
8
|
+
*/
|
|
9
|
+
export function RenderSection({ section }) {
|
|
10
|
+
if (!section)
|
|
11
|
+
return null;
|
|
12
|
+
const key = section.id || section.clientId;
|
|
13
|
+
const data = section.data || section;
|
|
14
|
+
const elementStyles = section.styles?.elements || [];
|
|
15
|
+
data.dataSource = section.dataSource;
|
|
16
|
+
const schemaKey = data._template;
|
|
17
|
+
const Component = sectionMap.get(schemaKey);
|
|
18
|
+
if (!Component)
|
|
19
|
+
return null;
|
|
20
|
+
if (data?.sectionVisibility === "hidden")
|
|
21
|
+
return null;
|
|
22
|
+
const stylesheet = generateSectionStylesheet(key, elementStyles);
|
|
23
|
+
return (React.createElement(React.Fragment, null,
|
|
24
|
+
React.createElement("style", { id: `section-styles-${key}`, dangerouslySetInnerHTML: {
|
|
25
|
+
__html: stylesheet,
|
|
26
|
+
} }),
|
|
27
|
+
React.createElement("section", { "data-comp": schemaKey, "data-comp-id": key },
|
|
28
|
+
React.createElement(Component, { "comp-name": schemaKey, cms: data }))));
|
|
29
|
+
}
|
|
5
30
|
function renderSectionContent(sections) {
|
|
6
31
|
if (!sections)
|
|
7
32
|
return null;
|
|
8
33
|
return sections
|
|
9
34
|
.map((section) => {
|
|
10
35
|
const key = section.id || section.clientId;
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
data.dataSource = section.dataSource;
|
|
14
|
-
const schemaKey = data._template;
|
|
15
|
-
const Component = sectionMap.get(schemaKey);
|
|
16
|
-
if (!Component)
|
|
17
|
-
return null;
|
|
18
|
-
const stylesheet = generateSectionStylesheet(key, elementStyles);
|
|
19
|
-
return data?.sectionVisibility === "hidden" ? null : (React.createElement(React.Fragment, { key: key },
|
|
20
|
-
React.createElement("style", { id: `section-styles-${key}`, dangerouslySetInnerHTML: {
|
|
21
|
-
__html: stylesheet,
|
|
22
|
-
} }),
|
|
23
|
-
React.createElement("section", { "data-comp": schemaKey, "data-comp-id": key },
|
|
24
|
-
React.createElement(Component, { "comp-name": schemaKey, cms: data }))));
|
|
36
|
+
return (React.createElement(React.Fragment, { key: key },
|
|
37
|
+
React.createElement(RenderSection, { section: section })));
|
|
25
38
|
})
|
|
26
39
|
.filter(Boolean);
|
|
27
40
|
}
|
package/dist/version.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export const VERSION = "4.
|
|
1
|
+
export const VERSION = "4.3.0";
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pack/react",
|
|
3
3
|
"description": "React",
|
|
4
|
-
"version": "4.
|
|
4
|
+
"version": "4.3.0",
|
|
5
5
|
"exports": "./dist/index.js",
|
|
6
6
|
"types": "./dist/index.d.ts",
|
|
7
7
|
"engines": {
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
],
|
|
24
24
|
"dependencies": {
|
|
25
25
|
"@pack/errors-react": "^0.1.1",
|
|
26
|
-
"@pack/types": "^0.
|
|
26
|
+
"@pack/types": "^0.2.0"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
29
|
"@types/react": "^18.2.20",
|