react-layout-sdk 1.1.17 → 1.1.19

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 (5) hide show
  1. package/bin/init.js +4 -4
  2. package/dist/index.js +2 -9
  3. package/dist/index.mjs +2 -9
  4. package/package.json +1 -1
  5. package/src/Layout.tsx +13 -11
package/bin/init.js CHANGED
@@ -146,10 +146,10 @@ async function main() {
146
146
  const footerContent = `import React from 'react';\n\nexport default function Footer(props: any) {\n const text = props?.text || '© 2026 JD Layout';\n return (\n <footer style={{ padding: '20px', background: '#333', color: '#fff', textAlign: 'center', marginTop: '40px' }}>\n <p style={{ margin: 0 }}>{text}</p>\n </footer>\n );\n}\n`;
147
147
  await writeWithPrompt(footerPath, footerContent, 'components/Footer.tsx');
148
148
 
149
- // 4. Create Layout.tsx
150
- const layoutPath = path.join(basePath, 'Layout.tsx');
149
+ // 4. Create layout.tsx (lowercase)
150
+ const layoutPath = path.join(basePath, 'layout.tsx');
151
151
  const layoutContent = `import React from 'react';\n\nexport default function Layout({ layoutData, placeholderComponent: Placeholder }: any) {\n const { route } = layoutData.strapi;\n\n return (\n <>\n <header>\n <div id="header">\n {route && <Placeholder name="headless-header" rendering={route.placeholders['headless-header'] || []} />}\n </div>\n </header>\n\n <main style={{ minHeight: 'calc(100vh - 100px)' }}>\n <div id="content" className="pageContent">\n {route && <Placeholder name="headless-main" rendering={route.placeholders['headless-main'] || []} />}\n </div>\n </main>\n\n <footer>\n <div id="footer">\n {route && <Placeholder name="headless-footer" rendering={route.placeholders['headless-footer'] || []} />}\n </div>\n </footer>\n </>\n );\n}\n`;
152
- await writeWithPrompt(layoutPath, layoutContent, 'Layout.tsx (Root/src level)');
152
+ await writeWithPrompt(layoutPath, layoutContent, 'layout.tsx (Root/src level)');
153
153
 
154
154
  if (hasAppRouter) {
155
155
  console.log('🔍 Detected Next.js App Router');
@@ -168,7 +168,7 @@ async function main() {
168
168
  ensureDirSync(pageDir);
169
169
 
170
170
  const appPagePath = path.join(pageDir, 'page.tsx');
171
- const importLayoutPath = hasSrc ? '@/Layout' : '../Layout';
171
+ const importLayoutPath = hasSrc ? '@/layout' : '../../layout';
172
172
  const appPageContent = `import React from 'react';\nimport { JDPage, generateJDMetadata } from 'react-layout-sdk';\nimport { componentMap } from '@/components/factory';\nimport Layout from '${importLayoutPath}';\n\nconst STRAPI_URL = process.env.NEXT_PUBLIC_STRAPI_URL || 'http://localhost:1337';\n\nexport const generateMetadata = ({ params }: { params: Promise<{ slug?: string[] }> }) => {\n return generateJDMetadata(params, STRAPI_URL);\n}\n\nexport default function Page({ params }: { params: Promise<{ slug?: string[] }> }) {\n return <JDPage params={params} apiUrl={STRAPI_URL} componentMap={componentMap} layoutComponent={Layout} />;\n}\n`;
173
173
  await writeWithPrompt(appPagePath, appPageContent, 'app/[[...slug]]/page.tsx');
174
174
  } else if (hasPagesRouter) {
package/dist/index.js CHANGED
@@ -92,15 +92,8 @@ var Placeholder = ({ name, rendering, customProps, componentMap }) => {
92
92
  // src/Layout.tsx
93
93
  var import_react2 = __toESM(require("react"));
94
94
  var JDLayout = ({ layoutData, placeholderComponent: Placeholder2 }) => {
95
- const { route, context } = layoutData.strapi;
96
- return /* @__PURE__ */ import_react2.default.createElement("div", { className: "flex flex-col min-h-screen", style: { display: "flex", flexDirection: "column", minHeight: "100vh" } }, /* @__PURE__ */ import_react2.default.createElement("header", null, /* @__PURE__ */ import_react2.default.createElement(
97
- Placeholder2,
98
- {
99
- name: "header",
100
- rendering: route.placeholders.header || [],
101
- customProps: { locales: context.locales, currentLocale: context.language }
102
- }
103
- )), /* @__PURE__ */ import_react2.default.createElement("main", { className: "grow", style: { flexGrow: 1 } }, /* @__PURE__ */ import_react2.default.createElement(Placeholder2, { name: "main", rendering: route.placeholders.main || [] })), /* @__PURE__ */ import_react2.default.createElement("footer", null, /* @__PURE__ */ import_react2.default.createElement(Placeholder2, { name: "footer", rendering: route.placeholders.footer || [] })));
95
+ const { route } = layoutData.strapi;
96
+ return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement("header", null, /* @__PURE__ */ import_react2.default.createElement("div", { id: "header" }, route && /* @__PURE__ */ import_react2.default.createElement(Placeholder2, { name: "headless-header", rendering: route.placeholders["headless-header"] || [] }))), /* @__PURE__ */ import_react2.default.createElement("main", { style: { minHeight: "calc(100vh - 100px)" } }, /* @__PURE__ */ import_react2.default.createElement("div", { id: "content", className: "pageContent" }, route && /* @__PURE__ */ import_react2.default.createElement(Placeholder2, { name: "headless-main", rendering: route.placeholders["headless-main"] || [] }))), /* @__PURE__ */ import_react2.default.createElement("footer", null, /* @__PURE__ */ import_react2.default.createElement("div", { id: "footer" }, route && /* @__PURE__ */ import_react2.default.createElement(Placeholder2, { name: "headless-footer", rendering: route.placeholders["headless-footer"] || [] }))));
104
97
  };
105
98
 
106
99
  // src/Page.tsx
package/dist/index.mjs CHANGED
@@ -51,15 +51,8 @@ var Placeholder = ({ name, rendering, customProps, componentMap }) => {
51
51
  // src/Layout.tsx
52
52
  import React2 from "react";
53
53
  var JDLayout = ({ layoutData, placeholderComponent: Placeholder2 }) => {
54
- const { route, context } = layoutData.strapi;
55
- return /* @__PURE__ */ React2.createElement("div", { className: "flex flex-col min-h-screen", style: { display: "flex", flexDirection: "column", minHeight: "100vh" } }, /* @__PURE__ */ React2.createElement("header", null, /* @__PURE__ */ React2.createElement(
56
- Placeholder2,
57
- {
58
- name: "header",
59
- rendering: route.placeholders.header || [],
60
- customProps: { locales: context.locales, currentLocale: context.language }
61
- }
62
- )), /* @__PURE__ */ React2.createElement("main", { className: "grow", style: { flexGrow: 1 } }, /* @__PURE__ */ React2.createElement(Placeholder2, { name: "main", rendering: route.placeholders.main || [] })), /* @__PURE__ */ React2.createElement("footer", null, /* @__PURE__ */ React2.createElement(Placeholder2, { name: "footer", rendering: route.placeholders.footer || [] })));
54
+ const { route } = layoutData.strapi;
55
+ return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("header", null, /* @__PURE__ */ React2.createElement("div", { id: "header" }, route && /* @__PURE__ */ React2.createElement(Placeholder2, { name: "headless-header", rendering: route.placeholders["headless-header"] || [] }))), /* @__PURE__ */ React2.createElement("main", { style: { minHeight: "calc(100vh - 100px)" } }, /* @__PURE__ */ React2.createElement("div", { id: "content", className: "pageContent" }, route && /* @__PURE__ */ React2.createElement(Placeholder2, { name: "headless-main", rendering: route.placeholders["headless-main"] || [] }))), /* @__PURE__ */ React2.createElement("footer", null, /* @__PURE__ */ React2.createElement("div", { id: "footer" }, route && /* @__PURE__ */ React2.createElement(Placeholder2, { name: "headless-footer", rendering: route.placeholders["headless-footer"] || [] }))));
63
56
  };
64
57
 
65
58
  // src/Page.tsx
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-layout-sdk",
3
- "version": "1.1.17",
3
+ "version": "1.1.19",
4
4
  "description": "React components for JD SDK (Sitecore-like routing)",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",
package/src/Layout.tsx CHANGED
@@ -15,25 +15,27 @@ export interface JDLayoutProps {
15
15
  * Uses Tailwind CSS classes by default, with inline styles as fallbacks.
16
16
  */
17
17
  export const JDLayout: React.FC<JDLayoutProps> = ({ layoutData, placeholderComponent: Placeholder }) => {
18
- const { route, context } = layoutData.strapi;
18
+ const { route } = layoutData.strapi;
19
19
 
20
20
  return (
21
- <div className="flex flex-col min-h-screen" style={{ display: 'flex', flexDirection: 'column', minHeight: '100vh' }}>
21
+ <>
22
22
  <header>
23
- <Placeholder
24
- name="header"
25
- rendering={route.placeholders.header || []}
26
- customProps={{ locales: context.locales, currentLocale: context.language }}
27
- />
23
+ <div id="header">
24
+ {route && <Placeholder name="headless-header" rendering={route.placeholders['headless-header'] || []} />}
25
+ </div>
28
26
  </header>
29
27
 
30
- <main className="grow" style={{ flexGrow: 1 }}>
31
- <Placeholder name="main" rendering={route.placeholders.main || []} />
28
+ <main style={{ minHeight: 'calc(100vh - 100px)' }}>
29
+ <div id="content" className="pageContent">
30
+ {route && <Placeholder name="headless-main" rendering={route.placeholders['headless-main'] || []} />}
31
+ </div>
32
32
  </main>
33
33
 
34
34
  <footer>
35
- <Placeholder name="footer" rendering={route.placeholders.footer || []} />
35
+ <div id="footer">
36
+ {route && <Placeholder name="headless-footer" rendering={route.placeholders['headless-footer'] || []} />}
37
+ </div>
36
38
  </footer>
37
- </div>
39
+ </>
38
40
  );
39
41
  };