react-layout-sdk 1.1.10 → 1.1.12

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 (2) hide show
  1. package/bin/init.js +11 -3
  2. package/package.json +1 -1
package/bin/init.js CHANGED
@@ -142,7 +142,15 @@ if (command === 'init') {
142
142
  console.log('✅ Created components/Footer.tsx');
143
143
  }
144
144
 
145
- // 4. Generate Page routing
145
+ // 4. Create Layout.tsx
146
+ const layoutPath = path.join(componentsDir, 'Layout.tsx');
147
+ const layoutContent = `import React from 'react';\n\nexport default function Layout({ layoutData, placeholderComponent: Placeholder }: any) {\n const { route } = layoutData.strapi;\n return (\n <div className="layout-wrapper" style={{ display: 'flex', flexDirection: 'column', minHeight: '100vh' }}>\n <header>\n <Placeholder name="header" rendering={route.placeholders.header || []} />\n </header>\n \n <main style={{ flexGrow: 1 }}>\n <div id="content" className="pageContent">\n <Placeholder name="main" rendering={route.placeholders.main || []} />\n </div>\n </main>\n \n <footer>\n <Placeholder name="footer" rendering={route.placeholders.footer || []} />\n </footer>\n </div>\n );\n}\n`;
148
+ if (!fs.existsSync(layoutPath)) {
149
+ fs.writeFileSync(layoutPath, layoutContent);
150
+ console.log('✅ Created components/Layout.tsx');
151
+ }
152
+
153
+ // 5. Generate Page routing
146
154
  if (hasAppRouter) {
147
155
  console.log('🔍 Detected Next.js App Router');
148
156
 
@@ -157,7 +165,7 @@ if (command === 'init') {
157
165
  ensureDirSync(pageDir);
158
166
 
159
167
  const appPagePath = path.join(pageDir, 'page.tsx');
160
- const appPageContent = `import React from 'react';\nimport { fetchJDLayout, Placeholder } from 'react-layout-sdk';\nimport { componentMap } from '@/components/factory';\n\nexport default async function Page({ params }: { params: Promise<{ slug?: string[] }> }) {\n const resolvedParams = await params;\n const slugArray = resolvedParams?.slug || [];\n const path = slugArray.join('/') || '/';\n const STRAPI_URL = process.env.NEXT_PUBLIC_STRAPI_URL || 'http://localhost:1337';\n \n try {\n const layoutData = await fetchJDLayout(STRAPI_URL, path, 'en');\n if (!layoutData || !layoutData.strapi) return <h1>404 - Not Found</h1>;\n\n const { route } = layoutData.strapi;\n\n return (\n <div className="layout-wrapper">\n <Placeholder name="header" rendering={route.placeholders.header || []} componentMap={componentMap} />\n <main style={{ minHeight: '60vh', padding: '20px' }}>\n <Placeholder name="main" rendering={route.placeholders.main || []} componentMap={componentMap} />\n </main>\n <Placeholder name="footer" rendering={route.placeholders.footer || []} componentMap={componentMap} />\n </div>\n );\n } catch (error) {\n return <h1>Error Loading Layout</h1>;\n }\n}\n`;
168
+ const appPageContent = `import React from 'react';\nimport { JDPage, generateJDMetadata } from 'react-layout-sdk';\nimport { componentMap } from '@/components/factory';\nimport Layout from '@/components/Layout';\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`;
161
169
  if (!fs.existsSync(appPagePath)) {
162
170
  fs.writeFileSync(appPagePath, appPageContent);
163
171
  console.log('✅ Created app/[[...slug]]/page.tsx');
@@ -173,7 +181,7 @@ if (command === 'init') {
173
181
  }
174
182
 
175
183
  const pagePath = path.join(basePath, 'pages', '[[...slug]].tsx');
176
- const pagesContent = `import React from 'react';\nimport { fetchJDLayout, Placeholder } from 'react-layout-sdk';\nimport { componentMap } from '@/components/factory';\n\nexport default function LayoutPage({ layoutData, error }: any) {\n if (error || !layoutData?.strapi) return <h1>404 - Layout Not Found</h1>;\n\n const { route } = layoutData.strapi;\n return (\n <div className="layout-wrapper">\n <Placeholder name="header" rendering={route.placeholders.header || []} componentMap={componentMap} />\n <main style={{ minHeight: '60vh', padding: '20px' }}>\n <Placeholder name="main" rendering={route.placeholders.main || []} componentMap={componentMap} />\n </main>\n <Placeholder name="footer" rendering={route.placeholders.footer || []} componentMap={componentMap} />\n </div>\n );\n}\n\nexport async function getServerSideProps(context: any) {\n const slugArray = context.params?.slug || [];\n const path = slugArray.join('/') || '/';\n const STRAPI_URL = process.env.NEXT_PUBLIC_STRAPI_URL || 'http://localhost:1337';\n\n try {\n const layoutData = await fetchJDLayout(STRAPI_URL, path, 'en');\n if (!layoutData) return { notFound: true };\n\n return { props: { layoutData } };\n } catch (error) {\n return { props: { error: true } };\n }\n}\n`;
184
+ const pagesContent = `import React from 'react';\nimport { fetchJDLayout, Placeholder } from 'react-layout-sdk';\nimport { componentMap } from '@/components/factory';\nimport Layout from '@/components/Layout';\n\nexport default function LayoutPage({ layoutData, error }: any) {\n if (error || !layoutData?.strapi) return <h1>404 - Layout Not Found</h1>;\n\n const CustomPlaceholder = (props: any) => <Placeholder {...props} componentMap={componentMap} />;\n\n return <Layout layoutData={layoutData} placeholderComponent={CustomPlaceholder} />;\n}\n\nexport async function getServerSideProps(context: any) {\n const slugArray = context.params?.slug || [];\n const path = slugArray.join('/') || '/';\n const STRAPI_URL = process.env.NEXT_PUBLIC_STRAPI_URL || 'http://localhost:1337';\n\n try {\n const layoutData = await fetchJDLayout(STRAPI_URL, path, 'en');\n if (!layoutData) return { notFound: true };\n\n return { props: { layoutData } };\n } catch (error) {\n return { props: { error: true } };\n }\n}\n`;
177
185
  if (!fs.existsSync(pagePath)) {
178
186
  fs.writeFileSync(pagePath, pagesContent);
179
187
  console.log('✅ Created pages/[[...slug]].tsx');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-layout-sdk",
3
- "version": "1.1.10",
3
+ "version": "1.1.12",
4
4
  "description": "React components for JD SDK (Sitecore-like routing)",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",