@actuate-media/cms-admin 0.4.0 → 0.7.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/AdminRoot.d.ts.map +1 -1
- package/dist/AdminRoot.js +35 -0
- package/dist/AdminRoot.js.map +1 -1
- package/dist/actuate-admin.css +1 -1
- package/dist/components/Breadcrumbs.d.ts.map +1 -1
- package/dist/components/Breadcrumbs.js +1 -0
- package/dist/components/Breadcrumbs.js.map +1 -1
- package/dist/components/ErrorBoundary.js +1 -1
- package/dist/components/ErrorBoundary.js.map +1 -1
- package/dist/hooks/useBuilderState.d.ts +49 -0
- package/dist/hooks/useBuilderState.d.ts.map +1 -0
- package/dist/hooks/useBuilderState.js +238 -0
- package/dist/hooks/useBuilderState.js.map +1 -0
- package/dist/index.d.ts +7 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +4 -0
- package/dist/index.js.map +1 -1
- package/dist/layout/Sidebar.d.ts.map +1 -1
- package/dist/layout/Sidebar.js +2 -2
- package/dist/layout/Sidebar.js.map +1 -1
- package/dist/views/ForgotPassword.d.ts +5 -0
- package/dist/views/ForgotPassword.d.ts.map +1 -0
- package/dist/views/ForgotPassword.js +41 -0
- package/dist/views/ForgotPassword.js.map +1 -0
- package/dist/views/ResetPassword.d.ts +6 -0
- package/dist/views/ResetPassword.d.ts.map +1 -0
- package/dist/views/ResetPassword.js +46 -0
- package/dist/views/ResetPassword.js.map +1 -0
- package/dist/views/ScriptTagEditor.d.ts +6 -0
- package/dist/views/ScriptTagEditor.d.ts.map +1 -0
- package/dist/views/ScriptTagEditor.js +109 -0
- package/dist/views/ScriptTagEditor.js.map +1 -0
- package/dist/views/ScriptTags.d.ts +5 -0
- package/dist/views/ScriptTags.d.ts.map +1 -0
- package/dist/views/ScriptTags.js +54 -0
- package/dist/views/ScriptTags.js.map +1 -0
- package/dist/views/page-builder/AIBlockAssist.d.ts +9 -0
- package/dist/views/page-builder/AIBlockAssist.d.ts.map +1 -0
- package/dist/views/page-builder/AIBlockAssist.js +40 -0
- package/dist/views/page-builder/AIBlockAssist.js.map +1 -0
- package/dist/views/page-builder/AIGenerateDialog.d.ts +8 -0
- package/dist/views/page-builder/AIGenerateDialog.d.ts.map +1 -0
- package/dist/views/page-builder/AIGenerateDialog.js +170 -0
- package/dist/views/page-builder/AIGenerateDialog.js.map +1 -0
- package/dist/views/page-builder/BlockEditor.d.ts +11 -0
- package/dist/views/page-builder/BlockEditor.d.ts.map +1 -0
- package/dist/views/page-builder/BlockEditor.js +67 -0
- package/dist/views/page-builder/BlockEditor.js.map +1 -0
- package/dist/views/page-builder/BlockPicker.d.ts +7 -0
- package/dist/views/page-builder/BlockPicker.d.ts.map +1 -0
- package/dist/views/page-builder/BlockPicker.js +102 -0
- package/dist/views/page-builder/BlockPicker.js.map +1 -0
- package/dist/views/page-builder/BottomBar.d.ts +9 -0
- package/dist/views/page-builder/BottomBar.d.ts.map +1 -0
- package/dist/views/page-builder/BottomBar.js +13 -0
- package/dist/views/page-builder/BottomBar.js.map +1 -0
- package/dist/views/page-builder/BuilderToolbar.d.ts +21 -0
- package/dist/views/page-builder/BuilderToolbar.d.ts.map +1 -0
- package/dist/views/page-builder/BuilderToolbar.js +18 -0
- package/dist/views/page-builder/BuilderToolbar.js.map +1 -0
- package/dist/views/page-builder/ContextPanel.d.ts +20 -0
- package/dist/views/page-builder/ContextPanel.d.ts.map +1 -0
- package/dist/views/page-builder/ContextPanel.js +40 -0
- package/dist/views/page-builder/ContextPanel.js.map +1 -0
- package/dist/views/page-builder/DesignScore.d.ts +6 -0
- package/dist/views/page-builder/DesignScore.d.ts.map +1 -0
- package/dist/views/page-builder/DesignScore.js +93 -0
- package/dist/views/page-builder/DesignScore.js.map +1 -0
- package/dist/views/page-builder/NodeSettings.d.ts +12 -0
- package/dist/views/page-builder/NodeSettings.d.ts.map +1 -0
- package/dist/views/page-builder/NodeSettings.js +80 -0
- package/dist/views/page-builder/NodeSettings.js.map +1 -0
- package/dist/views/page-builder/PageBuilder.d.ts +8 -0
- package/dist/views/page-builder/PageBuilder.d.ts.map +1 -0
- package/dist/views/page-builder/PageBuilder.js +126 -0
- package/dist/views/page-builder/PageBuilder.js.map +1 -0
- package/dist/views/page-builder/PageSettings.d.ts +7 -0
- package/dist/views/page-builder/PageSettings.d.ts.map +1 -0
- package/dist/views/page-builder/PageSettings.js +27 -0
- package/dist/views/page-builder/PageSettings.js.map +1 -0
- package/dist/views/page-builder/SEOPanel.d.ts +10 -0
- package/dist/views/page-builder/SEOPanel.d.ts.map +1 -0
- package/dist/views/page-builder/SEOPanel.js +105 -0
- package/dist/views/page-builder/SEOPanel.js.map +1 -0
- package/dist/views/page-builder/SavedSections.d.ts +6 -0
- package/dist/views/page-builder/SavedSections.d.ts.map +1 -0
- package/dist/views/page-builder/SavedSections.js +145 -0
- package/dist/views/page-builder/SavedSections.js.map +1 -0
- package/dist/views/page-builder/TemplatePicker.d.ts +7 -0
- package/dist/views/page-builder/TemplatePicker.d.ts.map +1 -0
- package/dist/views/page-builder/TemplatePicker.js +68 -0
- package/dist/views/page-builder/TemplatePicker.js.map +1 -0
- package/dist/views/page-builder/block-renderers/CTAPreview.d.ts +3 -0
- package/dist/views/page-builder/block-renderers/CTAPreview.d.ts.map +1 -0
- package/dist/views/page-builder/block-renderers/CTAPreview.js +19 -0
- package/dist/views/page-builder/block-renderers/CTAPreview.js.map +1 -0
- package/dist/views/page-builder/block-renderers/CardsPreview.d.ts +3 -0
- package/dist/views/page-builder/block-renderers/CardsPreview.d.ts.map +1 -0
- package/dist/views/page-builder/block-renderers/CardsPreview.js +22 -0
- package/dist/views/page-builder/block-renderers/CardsPreview.js.map +1 -0
- package/dist/views/page-builder/block-renderers/CodePreview.d.ts +3 -0
- package/dist/views/page-builder/block-renderers/CodePreview.d.ts.map +1 -0
- package/dist/views/page-builder/block-renderers/CodePreview.js +16 -0
- package/dist/views/page-builder/block-renderers/CodePreview.js.map +1 -0
- package/dist/views/page-builder/block-renderers/FAQPreview.d.ts +3 -0
- package/dist/views/page-builder/block-renderers/FAQPreview.d.ts.map +1 -0
- package/dist/views/page-builder/block-renderers/FAQPreview.js +24 -0
- package/dist/views/page-builder/block-renderers/FAQPreview.js.map +1 -0
- package/dist/views/page-builder/block-renderers/FallbackPreview.d.ts +6 -0
- package/dist/views/page-builder/block-renderers/FallbackPreview.d.ts.map +1 -0
- package/dist/views/page-builder/block-renderers/FallbackPreview.js +7 -0
- package/dist/views/page-builder/block-renderers/FallbackPreview.js.map +1 -0
- package/dist/views/page-builder/block-renderers/FormPreview.d.ts +3 -0
- package/dist/views/page-builder/block-renderers/FormPreview.d.ts.map +1 -0
- package/dist/views/page-builder/block-renderers/FormPreview.js +14 -0
- package/dist/views/page-builder/block-renderers/FormPreview.js.map +1 -0
- package/dist/views/page-builder/block-renderers/GalleryPreview.d.ts +3 -0
- package/dist/views/page-builder/block-renderers/GalleryPreview.d.ts.map +1 -0
- package/dist/views/page-builder/block-renderers/GalleryPreview.js +21 -0
- package/dist/views/page-builder/block-renderers/GalleryPreview.js.map +1 -0
- package/dist/views/page-builder/block-renderers/HeroPreview.d.ts +3 -0
- package/dist/views/page-builder/block-renderers/HeroPreview.d.ts.map +1 -0
- package/dist/views/page-builder/block-renderers/HeroPreview.js +19 -0
- package/dist/views/page-builder/block-renderers/HeroPreview.js.map +1 -0
- package/dist/views/page-builder/block-renderers/ImagePreview.d.ts +3 -0
- package/dist/views/page-builder/block-renderers/ImagePreview.d.ts.map +1 -0
- package/dist/views/page-builder/block-renderers/ImagePreview.js +17 -0
- package/dist/views/page-builder/block-renderers/ImagePreview.js.map +1 -0
- package/dist/views/page-builder/block-renderers/TextPreview.d.ts +3 -0
- package/dist/views/page-builder/block-renderers/TextPreview.d.ts.map +1 -0
- package/dist/views/page-builder/block-renderers/TextPreview.js +26 -0
- package/dist/views/page-builder/block-renderers/TextPreview.js.map +1 -0
- package/dist/views/page-builder/block-renderers/VideoPreview.d.ts +3 -0
- package/dist/views/page-builder/block-renderers/VideoPreview.d.ts.map +1 -0
- package/dist/views/page-builder/block-renderers/VideoPreview.js +21 -0
- package/dist/views/page-builder/block-renderers/VideoPreview.js.map +1 -0
- package/dist/views/page-builder/block-renderers/index.d.ts +9 -0
- package/dist/views/page-builder/block-renderers/index.d.ts.map +1 -0
- package/dist/views/page-builder/block-renderers/index.js +25 -0
- package/dist/views/page-builder/block-renderers/index.js.map +1 -0
- package/dist/views/page-builder/canvas/BlockRenderer.d.ts +8 -0
- package/dist/views/page-builder/canvas/BlockRenderer.d.ts.map +1 -0
- package/dist/views/page-builder/canvas/BlockRenderer.js +30 -0
- package/dist/views/page-builder/canvas/BlockRenderer.js.map +1 -0
- package/dist/views/page-builder/canvas/BuilderCanvas.d.ts +10 -0
- package/dist/views/page-builder/canvas/BuilderCanvas.d.ts.map +1 -0
- package/dist/views/page-builder/canvas/BuilderCanvas.js +26 -0
- package/dist/views/page-builder/canvas/BuilderCanvas.js.map +1 -0
- package/dist/views/page-builder/canvas/ColumnRenderer.d.ts +8 -0
- package/dist/views/page-builder/canvas/ColumnRenderer.d.ts.map +1 -0
- package/dist/views/page-builder/canvas/ColumnRenderer.js +36 -0
- package/dist/views/page-builder/canvas/ColumnRenderer.js.map +1 -0
- package/dist/views/page-builder/canvas/ContainerRenderer.d.ts +8 -0
- package/dist/views/page-builder/canvas/ContainerRenderer.d.ts.map +1 -0
- package/dist/views/page-builder/canvas/ContainerRenderer.js +33 -0
- package/dist/views/page-builder/canvas/ContainerRenderer.js.map +1 -0
- package/dist/views/page-builder/canvas/RowRenderer.d.ts +8 -0
- package/dist/views/page-builder/canvas/RowRenderer.d.ts.map +1 -0
- package/dist/views/page-builder/canvas/RowRenderer.js +32 -0
- package/dist/views/page-builder/canvas/RowRenderer.js.map +1 -0
- package/dist/views/page-builder/canvas/SectionRenderer.d.ts +8 -0
- package/dist/views/page-builder/canvas/SectionRenderer.d.ts.map +1 -0
- package/dist/views/page-builder/canvas/SectionRenderer.js +54 -0
- package/dist/views/page-builder/canvas/SectionRenderer.js.map +1 -0
- package/dist/views/page-builder/canvas/index.d.ts +3 -0
- package/dist/views/page-builder/canvas/index.d.ts.map +1 -0
- package/dist/views/page-builder/canvas/index.js +2 -0
- package/dist/views/page-builder/canvas/index.js.map +1 -0
- package/package.json +7 -4
- package/src/AdminRoot.tsx +41 -0
- package/src/components/Breadcrumbs.tsx +1 -0
- package/src/components/ErrorBoundary.tsx +3 -3
- package/src/hooks/useBuilderState.ts +328 -0
- package/src/index.ts +8 -0
- package/src/layout/Sidebar.tsx +7 -0
- package/src/views/ForgotPassword.tsx +136 -0
- package/src/views/ResetPassword.tsx +192 -0
- package/src/views/ScriptTagEditor.tsx +361 -0
- package/src/views/ScriptTags.tsx +174 -0
- package/src/views/page-builder/AIBlockAssist.tsx +68 -0
- package/src/views/page-builder/AIGenerateDialog.tsx +574 -0
- package/src/views/page-builder/BlockEditor.tsx +352 -0
- package/src/views/page-builder/BlockPicker.tsx +338 -0
- package/src/views/page-builder/BottomBar.tsx +64 -0
- package/src/views/page-builder/BuilderToolbar.tsx +218 -0
- package/src/views/page-builder/ContextPanel.tsx +145 -0
- package/src/views/page-builder/DesignScore.tsx +258 -0
- package/src/views/page-builder/NodeSettings.tsx +515 -0
- package/src/views/page-builder/PageBuilder.tsx +288 -0
- package/src/views/page-builder/PageSettings.tsx +161 -0
- package/src/views/page-builder/SEOPanel.tsx +485 -0
- package/src/views/page-builder/SavedSections.tsx +486 -0
- package/src/views/page-builder/TemplatePicker.tsx +201 -0
- package/src/views/page-builder/block-renderers/CTAPreview.tsx +81 -0
- package/src/views/page-builder/block-renderers/CardsPreview.tsx +71 -0
- package/src/views/page-builder/block-renderers/CodePreview.tsx +46 -0
- package/src/views/page-builder/block-renderers/FAQPreview.tsx +90 -0
- package/src/views/page-builder/block-renderers/FallbackPreview.tsx +18 -0
- package/src/views/page-builder/block-renderers/FormPreview.tsx +69 -0
- package/src/views/page-builder/block-renderers/GalleryPreview.tsx +93 -0
- package/src/views/page-builder/block-renderers/HeroPreview.tsx +103 -0
- package/src/views/page-builder/block-renderers/ImagePreview.tsx +54 -0
- package/src/views/page-builder/block-renderers/TextPreview.tsx +81 -0
- package/src/views/page-builder/block-renderers/VideoPreview.tsx +78 -0
- package/src/views/page-builder/block-renderers/index.ts +34 -0
- package/src/views/page-builder/canvas/BlockRenderer.tsx +62 -0
- package/src/views/page-builder/canvas/BuilderCanvas.tsx +90 -0
- package/src/views/page-builder/canvas/ColumnRenderer.tsx +86 -0
- package/src/views/page-builder/canvas/ContainerRenderer.tsx +71 -0
- package/src/views/page-builder/canvas/RowRenderer.tsx +72 -0
- package/src/views/page-builder/canvas/SectionRenderer.tsx +97 -0
- package/src/views/page-builder/canvas/index.ts +2 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ImagePreview.d.ts","sourceRoot":"","sources":["../../../../src/views/page-builder/block-renderers/ImagePreview.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAEpD,wBAAgB,YAAY,CAAC,EAAE,IAAI,EAAE,OAAsB,EAAE,EAAE,iBAAiB,2CAgD/E"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { Image } from 'lucide-react';
|
|
4
|
+
export function ImagePreview({ data, variant = 'full-width' }) {
|
|
5
|
+
const src = data.src;
|
|
6
|
+
const alt = data.alt || '';
|
|
7
|
+
const caption = data.caption || '';
|
|
8
|
+
const aspectRatio = data.aspectRatio || '16/9';
|
|
9
|
+
const roundedClass = variant === 'rounded' ? 'rounded-xl' : 'rounded-md';
|
|
10
|
+
const ImagePlaceholder = ({ className = '' }) => (_jsx("div", { className: `flex items-center justify-center bg-muted ${roundedClass} ${className}`, style: { aspectRatio }, children: _jsx(Image, { size: 32, className: "text-muted-foreground" }) }));
|
|
11
|
+
const ImageElement = ({ className = '' }) => src ? (_jsx("img", { src: src, alt: alt, className: `h-auto w-full object-cover ${roundedClass} ${className}`, style: { aspectRatio } })) : (_jsx(ImagePlaceholder, { className: className }));
|
|
12
|
+
if (variant === 'side-by-side') {
|
|
13
|
+
return (_jsxs("div", { className: "grid grid-cols-2 gap-3 rounded-md border border-border p-4", children: [_jsx(ImageElement, {}), _jsx(ImagePlaceholder, {})] }));
|
|
14
|
+
}
|
|
15
|
+
return (_jsxs("figure", { className: "overflow-hidden rounded-md border border-border p-4", children: [_jsx(ImageElement, {}), (variant === 'captioned' || caption) && (_jsx("figcaption", { className: "mt-2 text-center text-sm text-muted-foreground", children: caption || 'Image caption' }))] }));
|
|
16
|
+
}
|
|
17
|
+
//# sourceMappingURL=ImagePreview.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ImagePreview.js","sourceRoot":"","sources":["../../../../src/views/page-builder/block-renderers/ImagePreview.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAGrC,MAAM,UAAU,YAAY,CAAC,EAAE,IAAI,EAAE,OAAO,GAAG,YAAY,EAAqB;IAC9E,MAAM,GAAG,GAAG,IAAI,CAAC,GAAyB,CAAC;IAC3C,MAAM,GAAG,GAAI,IAAI,CAAC,GAAc,IAAI,EAAE,CAAC;IACvC,MAAM,OAAO,GAAI,IAAI,CAAC,OAAkB,IAAI,EAAE,CAAC;IAC/C,MAAM,WAAW,GAAI,IAAI,CAAC,WAAsB,IAAI,MAAM,CAAC;IAE3D,MAAM,YAAY,GAAG,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC;IAEzE,MAAM,gBAAgB,GAAG,CAAC,EAAE,SAAS,GAAG,EAAE,EAA0B,EAAE,EAAE,CAAC,CACvE,cACE,SAAS,EAAE,6CAA6C,YAAY,IAAI,SAAS,EAAE,EACnF,KAAK,EAAE,EAAE,WAAW,EAAE,YAEtB,KAAC,KAAK,IAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAC,uBAAuB,GAAG,GACjD,CACP,CAAC;IAEF,MAAM,YAAY,GAAG,CAAC,EAAE,SAAS,GAAG,EAAE,EAA0B,EAAE,EAAE,CAClE,GAAG,CAAC,CAAC,CAAC,CACJ,cACE,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,8BAA8B,YAAY,IAAI,SAAS,EAAE,EACpE,KAAK,EAAE,EAAE,WAAW,EAAE,GACtB,CACH,CAAC,CAAC,CAAC,CACF,KAAC,gBAAgB,IAAC,SAAS,EAAE,SAAS,GAAI,CAC3C,CAAC;IAEJ,IAAI,OAAO,KAAK,cAAc,EAAE,CAAC;QAC/B,OAAO,CACL,eAAK,SAAS,EAAC,4DAA4D,aACzE,KAAC,YAAY,KAAG,EAChB,KAAC,gBAAgB,KAAG,IAChB,CACP,CAAC;IACJ,CAAC;IAED,OAAO,CACL,kBAAQ,SAAS,EAAC,qDAAqD,aACrE,KAAC,YAAY,KAAG,EACf,CAAC,OAAO,KAAK,WAAW,IAAI,OAAO,CAAC,IAAI,CACvC,qBAAY,SAAS,EAAC,gDAAgD,YACnE,OAAO,IAAI,eAAe,GAChB,CACd,IACM,CACV,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TextPreview.d.ts","sourceRoot":"","sources":["../../../../src/views/page-builder/block-renderers/TextPreview.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAEpD,wBAAgB,WAAW,CAAC,EAAE,IAAI,EAAE,OAAiB,EAAE,EAAE,iBAAiB,2CA4EzE"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
export function TextPreview({ data, variant = 'prose' }) {
|
|
4
|
+
const body = data.body || '';
|
|
5
|
+
const heading = data.heading || '';
|
|
6
|
+
const headingLevel = data.headingLevel || 'h2';
|
|
7
|
+
const truncatedBody = body.length > 300 ? body.slice(0, 300) + '…' : body;
|
|
8
|
+
const validLevels = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
|
|
9
|
+
const HeadingTag = (validLevels.includes(headingLevel) ? headingLevel : 'h2');
|
|
10
|
+
const headingSizeClass = HeadingTag === 'h1'
|
|
11
|
+
? 'text-2xl'
|
|
12
|
+
: HeadingTag === 'h2'
|
|
13
|
+
? 'text-xl'
|
|
14
|
+
: 'text-lg';
|
|
15
|
+
if (variant === 'two-column') {
|
|
16
|
+
const midpoint = Math.ceil(truncatedBody.length / 2);
|
|
17
|
+
const col1 = truncatedBody.slice(0, midpoint);
|
|
18
|
+
const col2 = truncatedBody.slice(midpoint);
|
|
19
|
+
return (_jsxs("div", { className: "rounded-md border border-border p-5", children: [heading && (_jsx(HeadingTag, { className: `${headingSizeClass} mb-3 font-medium text-foreground`, children: heading })), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsx("p", { className: "text-sm leading-relaxed text-muted-foreground", children: col1 || 'Column one text content…' }), _jsx("p", { className: "text-sm leading-relaxed text-muted-foreground", children: col2 || 'Column two text content…' })] })] }));
|
|
20
|
+
}
|
|
21
|
+
if (variant === 'with-sidebar') {
|
|
22
|
+
return (_jsxs("div", { className: "grid grid-cols-[1fr_200px] gap-4 rounded-md border border-border p-5", children: [_jsxs("div", { children: [heading && (_jsx(HeadingTag, { className: `${headingSizeClass} mb-3 font-medium text-foreground`, children: heading })), _jsx("p", { className: "text-sm leading-relaxed text-muted-foreground", children: truncatedBody || 'Body text content goes here…' })] }), _jsxs("aside", { className: "rounded-md bg-muted p-3", children: [_jsx("div", { className: "h-3 w-3/4 rounded bg-border" }), _jsx("div", { className: "mt-2 h-2 w-full rounded bg-border" }), _jsx("div", { className: "mt-1 h-2 w-2/3 rounded bg-border" })] })] }));
|
|
23
|
+
}
|
|
24
|
+
return (_jsxs("div", { className: "rounded-md border border-border p-5", children: [heading && (_jsx(HeadingTag, { className: `${headingSizeClass} mb-3 font-medium text-foreground`, children: heading })), _jsx("p", { className: "text-sm leading-relaxed text-muted-foreground", children: truncatedBody || (_jsx("span", { className: "italic", children: "Body text content goes here\u2026" })) })] }));
|
|
25
|
+
}
|
|
26
|
+
//# sourceMappingURL=TextPreview.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TextPreview.js","sourceRoot":"","sources":["../../../../src/views/page-builder/block-renderers/TextPreview.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAIb,MAAM,UAAU,WAAW,CAAC,EAAE,IAAI,EAAE,OAAO,GAAG,OAAO,EAAqB;IACxE,MAAM,IAAI,GAAI,IAAI,CAAC,IAAe,IAAI,EAAE,CAAC;IACzC,MAAM,OAAO,GAAI,IAAI,CAAC,OAAkB,IAAI,EAAE,CAAC;IAC/C,MAAM,YAAY,GAAI,IAAI,CAAC,YAAuB,IAAI,IAAI,CAAC;IAE3D,MAAM,aAAa,GAAG,IAAI,CAAC,MAAM,GAAG,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC;IAE1E,MAAM,WAAW,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAU,CAAC;IAClE,MAAM,UAAU,GAAG,CAAC,WAAW,CAAC,QAAQ,CAAC,YAAmB,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAA4C,CAAC;IAChI,MAAM,gBAAgB,GACpB,UAAU,KAAK,IAAI;QACjB,CAAC,CAAC,UAAU;QACZ,CAAC,CAAC,UAAU,KAAK,IAAI;YACnB,CAAC,CAAC,SAAS;YACX,CAAC,CAAC,SAAS,CAAC;IAElB,IAAI,OAAO,KAAK,YAAY,EAAE,CAAC;QAC7B,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACrD,MAAM,IAAI,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;QAC9C,MAAM,IAAI,GAAG,aAAa,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QAE3C,OAAO,CACL,eAAK,SAAS,EAAC,qCAAqC,aACjD,OAAO,IAAI,CACV,KAAC,UAAU,IAAC,SAAS,EAAE,GAAG,gBAAgB,mCAAmC,YAC1E,OAAO,GACG,CACd,EACD,eAAK,SAAS,EAAC,wBAAwB,aACrC,YAAG,SAAS,EAAC,+CAA+C,YACzD,IAAI,IAAI,0BAA0B,GACjC,EACJ,YAAG,SAAS,EAAC,+CAA+C,YACzD,IAAI,IAAI,0BAA0B,GACjC,IACA,IACF,CACP,CAAC;IACJ,CAAC;IAED,IAAI,OAAO,KAAK,cAAc,EAAE,CAAC;QAC/B,OAAO,CACL,eAAK,SAAS,EAAC,sEAAsE,aACnF,0BACG,OAAO,IAAI,CACV,KAAC,UAAU,IAAC,SAAS,EAAE,GAAG,gBAAgB,mCAAmC,YAC1E,OAAO,GACG,CACd,EACD,YAAG,SAAS,EAAC,+CAA+C,YACzD,aAAa,IAAI,8BAA8B,GAC9C,IACA,EACN,iBAAO,SAAS,EAAC,yBAAyB,aACxC,cAAK,SAAS,EAAC,6BAA6B,GAAG,EAC/C,cAAK,SAAS,EAAC,mCAAmC,GAAG,EACrD,cAAK,SAAS,EAAC,kCAAkC,GAAG,IAC9C,IACJ,CACP,CAAC;IACJ,CAAC;IAED,OAAO,CACL,eAAK,SAAS,EAAC,qCAAqC,aACjD,OAAO,IAAI,CACV,KAAC,UAAU,IAAC,SAAS,EAAE,GAAG,gBAAgB,mCAAmC,YAC1E,OAAO,GACG,CACd,EACD,YAAG,SAAS,EAAC,+CAA+C,YACzD,aAAa,IAAI,CAChB,eAAM,SAAS,EAAC,QAAQ,kDAAoC,CAC7D,GACC,IACA,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"VideoPreview.d.ts","sourceRoot":"","sources":["../../../../src/views/page-builder/block-renderers/VideoPreview.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAEpD,wBAAgB,YAAY,CAAC,EAAE,IAAI,EAAE,OAAkB,EAAE,EAAE,iBAAiB,2CAwE3E"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { Play } from 'lucide-react';
|
|
4
|
+
export function VideoPreview({ data, variant = 'inline' }) {
|
|
5
|
+
const poster = data.poster;
|
|
6
|
+
const autoplay = data.autoplay;
|
|
7
|
+
const loop = data.loop;
|
|
8
|
+
const badges = [
|
|
9
|
+
autoplay ? 'Autoplay' : '',
|
|
10
|
+
loop ? 'Loop' : '',
|
|
11
|
+
].filter((b) => b !== '');
|
|
12
|
+
const content = (_jsxs("div", { className: "relative flex aspect-video items-center justify-center overflow-hidden rounded-md bg-muted", children: [poster ? (_jsx("img", { src: poster, alt: "", className: "absolute inset-0 h-full w-full object-cover" })) : (_jsx("div", { className: "absolute inset-0 bg-card" })), _jsx("div", { className: "relative z-10 flex h-12 w-12 items-center justify-center rounded-full bg-primary/90 shadow-sm", children: _jsx(Play, { size: 20, className: "text-primary-foreground" }) }), badges.length > 0 && (_jsx("div", { className: "absolute bottom-2 right-2 z-10 flex gap-1", children: badges.map((badge) => (_jsx("span", { className: "rounded bg-background/80 px-1.5 py-0.5 text-xs text-muted-foreground", children: badge }, badge))) }))] }));
|
|
13
|
+
if (variant === 'background') {
|
|
14
|
+
return (_jsx("div", { className: "overflow-hidden rounded-md border border-border", children: _jsxs("div", { className: "relative aspect-[21/9]", children: [poster ? (_jsx("img", { src: poster, alt: "", className: "absolute inset-0 h-full w-full object-cover" })) : (_jsx("div", { className: "absolute inset-0 bg-card" })), _jsx("div", { className: "absolute inset-0 flex items-center justify-center bg-background/30", children: _jsx("div", { className: "flex h-14 w-14 items-center justify-center rounded-full bg-primary/90 shadow-sm", children: _jsx(Play, { size: 24, className: "text-primary-foreground" }) }) })] }) }));
|
|
15
|
+
}
|
|
16
|
+
if (variant === 'lightbox') {
|
|
17
|
+
return (_jsx("div", { className: "rounded-md border border-border p-4", children: _jsxs("div", { className: "mx-auto max-w-sm", children: [content, _jsx("p", { className: "mt-2 text-center text-xs text-muted-foreground", children: "Click to play in lightbox" })] }) }));
|
|
18
|
+
}
|
|
19
|
+
return (_jsx("div", { className: "rounded-md border border-border p-4", children: content }));
|
|
20
|
+
}
|
|
21
|
+
//# sourceMappingURL=VideoPreview.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"VideoPreview.js","sourceRoot":"","sources":["../../../../src/views/page-builder/block-renderers/VideoPreview.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAGpC,MAAM,UAAU,YAAY,CAAC,EAAE,IAAI,EAAE,OAAO,GAAG,QAAQ,EAAqB;IAC1E,MAAM,MAAM,GAAG,IAAI,CAAC,MAA4B,CAAC;IACjD,MAAM,QAAQ,GAAG,IAAI,CAAC,QAA+B,CAAC;IACtD,MAAM,IAAI,GAAG,IAAI,CAAC,IAA2B,CAAC;IAE9C,MAAM,MAAM,GAAa;QACvB,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;QAC1B,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE;KACnB,CAAC,MAAM,CAAC,CAAC,CAAC,EAAe,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC;IAEvC,MAAM,OAAO,GAAG,CACd,eAAK,SAAS,EAAC,4FAA4F,aACxG,MAAM,CAAC,CAAC,CAAC,CACR,cAAK,GAAG,EAAE,MAAM,EAAE,GAAG,EAAC,EAAE,EAAC,SAAS,EAAC,6CAA6C,GAAG,CACpF,CAAC,CAAC,CAAC,CACF,cAAK,SAAS,EAAC,0BAA0B,GAAG,CAC7C,EACD,cAAK,SAAS,EAAC,+FAA+F,YAC5G,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAC,yBAAyB,GAAG,GAClD,EACL,MAAM,CAAC,MAAM,GAAG,CAAC,IAAI,CACpB,cAAK,SAAS,EAAC,2CAA2C,YACvD,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACrB,eAEE,SAAS,EAAC,sEAAsE,YAE/E,KAAK,IAHD,KAAK,CAIL,CACR,CAAC,GACE,CACP,IACG,CACP,CAAC;IAEF,IAAI,OAAO,KAAK,YAAY,EAAE,CAAC;QAC7B,OAAO,CACL,cAAK,SAAS,EAAC,iDAAiD,YAC9D,eAAK,SAAS,EAAC,wBAAwB,aACpC,MAAM,CAAC,CAAC,CAAC,CACR,cAAK,GAAG,EAAE,MAAM,EAAE,GAAG,EAAC,EAAE,EAAC,SAAS,EAAC,6CAA6C,GAAG,CACpF,CAAC,CAAC,CAAC,CACF,cAAK,SAAS,EAAC,0BAA0B,GAAG,CAC7C,EACD,cAAK,SAAS,EAAC,oEAAoE,YACjF,cAAK,SAAS,EAAC,iFAAiF,YAC9F,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAC,yBAAyB,GAAG,GAClD,GACF,IACF,GACF,CACP,CAAC;IACJ,CAAC;IAED,IAAI,OAAO,KAAK,UAAU,EAAE,CAAC;QAC3B,OAAO,CACL,cAAK,SAAS,EAAC,qCAAqC,YAClD,eAAK,SAAS,EAAC,kBAAkB,aAC9B,OAAO,EACR,YAAG,SAAS,EAAC,gDAAgD,0CAEzD,IACA,GACF,CACP,CAAC;IACJ,CAAC;IAED,OAAO,CACL,cAAK,SAAS,EAAC,qCAAqC,YACjD,OAAO,GACJ,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { ComponentType } from 'react';
|
|
2
|
+
export interface BlockPreviewProps {
|
|
3
|
+
data: Record<string, unknown>;
|
|
4
|
+
variant?: string;
|
|
5
|
+
}
|
|
6
|
+
export declare const blockRenderers: Record<string, ComponentType<BlockPreviewProps>>;
|
|
7
|
+
export { FallbackPreview } from './FallbackPreview.js';
|
|
8
|
+
export type { FallbackPreviewProps } from './FallbackPreview.js';
|
|
9
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/page-builder/block-renderers/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAY3C,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAW3E,CAAC;AAEF,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,YAAY,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { HeroPreview } from './HeroPreview.js';
|
|
3
|
+
import { TextPreview } from './TextPreview.js';
|
|
4
|
+
import { ImagePreview } from './ImagePreview.js';
|
|
5
|
+
import { CardsPreview } from './CardsPreview.js';
|
|
6
|
+
import { CTAPreview } from './CTAPreview.js';
|
|
7
|
+
import { VideoPreview } from './VideoPreview.js';
|
|
8
|
+
import { GalleryPreview } from './GalleryPreview.js';
|
|
9
|
+
import { FAQPreview } from './FAQPreview.js';
|
|
10
|
+
import { FormPreview } from './FormPreview.js';
|
|
11
|
+
import { CodePreview } from './CodePreview.js';
|
|
12
|
+
export const blockRenderers = {
|
|
13
|
+
hero: HeroPreview,
|
|
14
|
+
text: TextPreview,
|
|
15
|
+
image: ImagePreview,
|
|
16
|
+
cards: CardsPreview,
|
|
17
|
+
cta: CTAPreview,
|
|
18
|
+
video: VideoPreview,
|
|
19
|
+
gallery: GalleryPreview,
|
|
20
|
+
faq: FAQPreview,
|
|
21
|
+
form: FormPreview,
|
|
22
|
+
code: CodePreview,
|
|
23
|
+
};
|
|
24
|
+
export { FallbackPreview } from './FallbackPreview.js';
|
|
25
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/views/page-builder/block-renderers/index.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAGb,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAO/C,MAAM,CAAC,MAAM,cAAc,GAAqD;IAC9E,IAAI,EAAE,WAAW;IACjB,IAAI,EAAE,WAAW;IACjB,KAAK,EAAE,YAAY;IACnB,KAAK,EAAE,YAAY;IACnB,GAAG,EAAE,UAAU;IACf,KAAK,EAAE,YAAY;IACnB,OAAO,EAAE,cAAc;IACvB,GAAG,EAAE,UAAU;IACf,IAAI,EAAE,WAAW;IACjB,IAAI,EAAE,WAAW;CAClB,CAAC;AAEF,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { BlockNode } from '@actuate-media/cms-core';
|
|
2
|
+
export interface BlockRendererProps {
|
|
3
|
+
node: BlockNode;
|
|
4
|
+
selectedNodeId: string | null;
|
|
5
|
+
onSelectNode: (id: string | null) => void;
|
|
6
|
+
}
|
|
7
|
+
export declare function BlockRenderer({ node, selectedNodeId, onSelectNode }: BlockRendererProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
//# sourceMappingURL=BlockRenderer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BlockRenderer.d.ts","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/BlockRenderer.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAEzD,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,SAAS,CAAC;IAChB,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C;AAaD,wBAAgB,aAAa,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,YAAY,EAAE,EAAE,kBAAkB,2CAsCvF"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { Box, Type, Image, Layout, Star } from 'lucide-react';
|
|
5
|
+
const BLOCK_ICONS = {
|
|
6
|
+
hero: Star,
|
|
7
|
+
text: Type,
|
|
8
|
+
image: Image,
|
|
9
|
+
layout: Layout,
|
|
10
|
+
};
|
|
11
|
+
function getBlockLabel(blockType) {
|
|
12
|
+
return blockType.charAt(0).toUpperCase() + blockType.slice(1);
|
|
13
|
+
}
|
|
14
|
+
export function BlockRenderer({ node, selectedNodeId, onSelectNode }) {
|
|
15
|
+
const [hovered, setHovered] = useState(false);
|
|
16
|
+
const isSelected = selectedNodeId === node.id;
|
|
17
|
+
const blockType = node.settings.blockType;
|
|
18
|
+
const label = getBlockLabel(blockType);
|
|
19
|
+
const Icon = BLOCK_ICONS[blockType] ?? Box;
|
|
20
|
+
const handleClick = (e) => {
|
|
21
|
+
e.stopPropagation();
|
|
22
|
+
onSelectNode(node.id);
|
|
23
|
+
};
|
|
24
|
+
return (_jsxs("div", { "data-node-id": node.id, className: `relative min-h-[48px] transition-shadow ${isSelected
|
|
25
|
+
? 'ring-2 ring-primary ring-offset-2'
|
|
26
|
+
: hovered
|
|
27
|
+
? 'ring-1 ring-primary/50'
|
|
28
|
+
: ''}`, onClick: handleClick, onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), children: [(hovered || isSelected) && (_jsx("span", { className: "absolute -top-2 -left-1 text-xs px-1.5 py-0.5 bg-primary text-primary-foreground rounded font-medium z-10", children: label })), _jsxs("div", { className: "flex items-center justify-center gap-2 p-4 bg-muted/30 border border-dashed border-border rounded-md", children: [_jsx(Icon, { size: 16, className: "text-muted-foreground" }), _jsx("span", { className: "text-sm text-muted-foreground", children: label })] })] }));
|
|
29
|
+
}
|
|
30
|
+
//# sourceMappingURL=BlockRenderer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BlockRenderer.js","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/BlockRenderer.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAS9D,MAAM,WAAW,GAA+B;IAC9C,IAAI,EAAE,IAAI;IACV,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE,MAAM;CACf,CAAC;AAEF,SAAS,aAAa,CAAC,SAAiB;IACtC,OAAO,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AAChE,CAAC;AAED,MAAM,UAAU,aAAa,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,YAAY,EAAsB;IACtF,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,UAAU,GAAG,cAAc,KAAK,IAAI,CAAC,EAAE,CAAC;IAC9C,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC;IAC1C,MAAM,KAAK,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC;IACvC,MAAM,IAAI,GAAG,WAAW,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC;IAE3C,MAAM,WAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;QAC1C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,OAAO,CACL,+BACgB,IAAI,CAAC,EAAE,EACrB,SAAS,EAAE,2CACT,UAAU;YACR,CAAC,CAAC,mCAAmC;YACrC,CAAC,CAAC,OAAO;gBACP,CAAC,CAAC,wBAAwB;gBAC1B,CAAC,CAAC,EACR,EAAE,EACF,OAAO,EAAE,WAAW,EACpB,YAAY,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,EACpC,YAAY,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,aAEpC,CAAC,OAAO,IAAI,UAAU,CAAC,IAAI,CAC1B,eAAM,SAAS,EAAC,2GAA2G,YACxH,KAAK,GACD,CACR,EAED,eAAK,SAAS,EAAC,sGAAsG,aACnH,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAC,uBAAuB,GAAG,EACpD,eAAM,SAAS,EAAC,+BAA+B,YAAE,KAAK,GAAQ,IAC1D,IACF,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import type { PageNode } from '@actuate-media/cms-core';
|
|
2
|
+
export interface BuilderCanvasProps {
|
|
3
|
+
tree: PageNode;
|
|
4
|
+
selectedNodeId: string | null;
|
|
5
|
+
showGridOverlay: boolean;
|
|
6
|
+
deviceMode: 'desktop' | 'tablet' | 'mobile';
|
|
7
|
+
onSelectNode: (id: string | null) => void;
|
|
8
|
+
}
|
|
9
|
+
export declare function BuilderCanvas({ tree, selectedNodeId, showGridOverlay, deviceMode, onSelectNode, }: BuilderCanvasProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
//# sourceMappingURL=BuilderCanvas.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BuilderCanvas.d.ts","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/BuilderCanvas.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAGxD,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,QAAQ,CAAC;IACf,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,eAAe,EAAE,OAAO,CAAC;IACzB,UAAU,EAAE,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC5C,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C;AAQD,wBAAgB,aAAa,CAAC,EAC5B,IAAI,EACJ,cAAc,EACd,eAAe,EACf,UAAU,EACV,YAAY,GACb,EAAE,kBAAkB,2CA4CpB"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { LayoutGrid } from 'lucide-react';
|
|
4
|
+
import { SectionRenderer } from './SectionRenderer.js';
|
|
5
|
+
const DEVICE_CLASSES = {
|
|
6
|
+
desktop: 'w-full',
|
|
7
|
+
tablet: 'max-w-[768px] mx-auto',
|
|
8
|
+
mobile: 'max-w-[375px] mx-auto',
|
|
9
|
+
};
|
|
10
|
+
export function BuilderCanvas({ tree, selectedNodeId, showGridOverlay, deviceMode, onSelectNode, }) {
|
|
11
|
+
const handleCanvasClick = (e) => {
|
|
12
|
+
if (e.target === e.currentTarget) {
|
|
13
|
+
onSelectNode(null);
|
|
14
|
+
}
|
|
15
|
+
};
|
|
16
|
+
return (_jsxs("div", { className: "relative flex-1 overflow-auto bg-muted p-6", onClick: handleCanvasClick, children: [showGridOverlay && _jsx(GridOverlay, { deviceMode: deviceMode }), _jsxs("div", { className: `relative bg-background shadow-sm min-h-full ${DEVICE_CLASSES[deviceMode]}`, onClick: handleCanvasClick, children: [tree.children.map((child) => {
|
|
17
|
+
if (child.type === 'section') {
|
|
18
|
+
return (_jsx(SectionRenderer, { node: child, selectedNodeId: selectedNodeId, onSelectNode: onSelectNode }, child.id));
|
|
19
|
+
}
|
|
20
|
+
return null;
|
|
21
|
+
}), tree.children.length === 0 && (_jsxs("div", { className: "flex flex-col items-center justify-center min-h-[400px] text-center", children: [_jsx(LayoutGrid, { size: 32, className: "text-muted-foreground mb-3" }), _jsx("p", { className: "text-sm font-medium text-foreground mb-1", children: "No sections yet" }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Click \"Add Section\" below to start building your page" })] }))] })] }));
|
|
22
|
+
}
|
|
23
|
+
function GridOverlay({ deviceMode }) {
|
|
24
|
+
return (_jsx("div", { className: `pointer-events-none absolute inset-0 z-50 p-6 ${deviceMode !== 'desktop' ? 'flex justify-center' : ''}`, "aria-hidden": "true", children: _jsx("div", { className: `grid grid-cols-12 gap-4 h-full opacity-[0.08] ${DEVICE_CLASSES[deviceMode]}`, children: Array.from({ length: 12 }).map((_, i) => (_jsx("div", { className: "bg-primary h-full rounded-sm" }, i))) }) }));
|
|
25
|
+
}
|
|
26
|
+
//# sourceMappingURL=BuilderCanvas.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BuilderCanvas.js","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/BuilderCanvas.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAUvD,MAAM,cAAc,GAAqD;IACvE,OAAO,EAAE,QAAQ;IACjB,MAAM,EAAE,uBAAuB;IAC/B,MAAM,EAAE,uBAAuB;CAChC,CAAC;AAEF,MAAM,UAAU,aAAa,CAAC,EAC5B,IAAI,EACJ,cAAc,EACd,eAAe,EACf,UAAU,EACV,YAAY,GACO;IACnB,MAAM,iBAAiB,GAAG,CAAC,CAAmB,EAAE,EAAE;QAChD,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,aAAa,EAAE,CAAC;YACjC,YAAY,CAAC,IAAI,CAAC,CAAC;QACrB,CAAC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,eACE,SAAS,EAAC,4CAA4C,EACtD,OAAO,EAAE,iBAAiB,aAEzB,eAAe,IAAI,KAAC,WAAW,IAAC,UAAU,EAAE,UAAU,GAAI,EAE3D,eACE,SAAS,EAAE,+CAA+C,cAAc,CAAC,UAAU,CAAC,EAAE,EACtF,OAAO,EAAE,iBAAiB,aAEzB,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;wBAC3B,IAAI,KAAK,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;4BAC7B,OAAO,CACL,KAAC,eAAe,IAEd,IAAI,EAAE,KAAK,EACX,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,IAHrB,KAAK,CAAC,EAAE,CAIb,CACH,CAAC;wBACJ,CAAC;wBACD,OAAO,IAAI,CAAC;oBACd,CAAC,CAAC,EAED,IAAI,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,IAAI,CAC7B,eAAK,SAAS,EAAC,qEAAqE,aAClF,KAAC,UAAU,IAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAC,4BAA4B,GAAG,EAC/D,YAAG,SAAS,EAAC,0CAA0C,gCAAoB,EAC3E,YAAG,SAAS,EAAC,+BAA+B,wEAExC,IACA,CACP,IACG,IACF,CACP,CAAC;AACJ,CAAC;AAED,SAAS,WAAW,CAAC,EAAE,UAAU,EAAoD;IACnF,OAAO,CACL,cACE,SAAS,EAAE,iDACT,UAAU,KAAK,SAAS,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EACrD,EAAE,iBACU,MAAM,YAElB,cACE,SAAS,EAAE,iDAAiD,cAAc,CAAC,UAAU,CAAC,EAAE,YAEvF,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACxC,cAAa,SAAS,EAAC,8BAA8B,IAA3C,CAAC,CAA6C,CACzD,CAAC,GACE,GACF,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { ColumnNode } from '@actuate-media/cms-core';
|
|
2
|
+
export interface ColumnRendererProps {
|
|
3
|
+
node: ColumnNode;
|
|
4
|
+
selectedNodeId: string | null;
|
|
5
|
+
onSelectNode: (id: string | null) => void;
|
|
6
|
+
}
|
|
7
|
+
export declare function ColumnRenderer({ node, selectedNodeId, onSelectNode }: ColumnRendererProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
//# sourceMappingURL=ColumnRenderer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ColumnRenderer.d.ts","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/ColumnRenderer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAI1D,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,UAAU,CAAC;IACjB,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C;AAED,wBAAgB,cAAc,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,YAAY,EAAE,EAAE,mBAAmB,2CAwEzF"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { BlockRenderer } from './BlockRenderer.js';
|
|
5
|
+
import { ContainerRenderer } from './ContainerRenderer.js';
|
|
6
|
+
export function ColumnRenderer({ node, selectedNodeId, onSelectNode }) {
|
|
7
|
+
const [hovered, setHovered] = useState(false);
|
|
8
|
+
const isSelected = selectedNodeId === node.id;
|
|
9
|
+
const width = node.settings.width;
|
|
10
|
+
const isEmpty = node.children.length === 0;
|
|
11
|
+
const handleClick = (e) => {
|
|
12
|
+
e.stopPropagation();
|
|
13
|
+
onSelectNode(node.id);
|
|
14
|
+
};
|
|
15
|
+
return (_jsxs("div", { "data-node-id": node.id, className: `relative transition-shadow ${isSelected
|
|
16
|
+
? 'ring-2 ring-primary ring-offset-2'
|
|
17
|
+
: hovered
|
|
18
|
+
? 'ring-1 ring-primary/50'
|
|
19
|
+
: ''}`, style: {
|
|
20
|
+
gridColumn: `span ${width}`,
|
|
21
|
+
padding: node.settings.padding,
|
|
22
|
+
background: node.settings.background,
|
|
23
|
+
}, onClick: handleClick, onMouseEnter: (e) => {
|
|
24
|
+
e.stopPropagation();
|
|
25
|
+
setHovered(true);
|
|
26
|
+
}, onMouseLeave: () => setHovered(false), children: [(hovered || isSelected) && (_jsxs("span", { className: "absolute -top-2 -left-1 text-xs px-1.5 py-0.5 bg-primary text-primary-foreground rounded font-medium z-10", children: ["Col ", width] })), isEmpty ? (_jsx("div", { className: "flex items-center justify-center min-h-[64px] border-2 border-dashed border-border rounded-md text-sm text-muted-foreground", children: "Empty column" })) : (_jsx("div", { className: "flex flex-col gap-2", children: node.children.map((child) => {
|
|
27
|
+
if (child.type === 'block') {
|
|
28
|
+
return (_jsx(BlockRenderer, { node: child, selectedNodeId: selectedNodeId, onSelectNode: onSelectNode }, child.id));
|
|
29
|
+
}
|
|
30
|
+
if (child.type === 'container') {
|
|
31
|
+
return (_jsx(ContainerRenderer, { node: child, selectedNodeId: selectedNodeId, onSelectNode: onSelectNode }, child.id));
|
|
32
|
+
}
|
|
33
|
+
return null;
|
|
34
|
+
}) }))] }));
|
|
35
|
+
}
|
|
36
|
+
//# sourceMappingURL=ColumnRenderer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ColumnRenderer.js","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/ColumnRenderer.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAQ3D,MAAM,UAAU,cAAc,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,YAAY,EAAuB;IACxF,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,UAAU,GAAG,cAAc,KAAK,IAAI,CAAC,EAAE,CAAC;IAC9C,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;IAClC,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC;IAE3C,MAAM,WAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;QAC1C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,OAAO,CACL,+BACgB,IAAI,CAAC,EAAE,EACrB,SAAS,EAAE,8BACT,UAAU;YACR,CAAC,CAAC,mCAAmC;YACrC,CAAC,CAAC,OAAO;gBACP,CAAC,CAAC,wBAAwB;gBAC1B,CAAC,CAAC,EACR,EAAE,EACF,KAAK,EAAE;YACL,UAAU,EAAE,QAAQ,KAAK,EAAE;YAC3B,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,OAAO;YAC9B,UAAU,EAAE,IAAI,CAAC,QAAQ,CAAC,UAAU;SACrC,EACD,OAAO,EAAE,WAAW,EACpB,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YAClB,CAAC,CAAC,eAAe,EAAE,CAAC;YACpB,UAAU,CAAC,IAAI,CAAC,CAAC;QACnB,CAAC,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,aAEpC,CAAC,OAAO,IAAI,UAAU,CAAC,IAAI,CAC1B,gBAAM,SAAS,EAAC,2GAA2G,qBACpH,KAAK,IACL,CACR,EAEA,OAAO,CAAC,CAAC,CAAC,CACT,cAAK,SAAS,EAAC,6HAA6H,6BAEtI,CACP,CAAC,CAAC,CAAC,CACF,cAAK,SAAS,EAAC,qBAAqB,YACjC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;oBAC3B,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;wBAC3B,OAAO,CACL,KAAC,aAAa,IAEZ,IAAI,EAAE,KAAK,EACX,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,IAHrB,KAAK,CAAC,EAAE,CAIb,CACH,CAAC;oBACJ,CAAC;oBACD,IAAI,KAAK,CAAC,IAAI,KAAK,WAAW,EAAE,CAAC;wBAC/B,OAAO,CACL,KAAC,iBAAiB,IAEhB,IAAI,EAAE,KAAK,EACX,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,IAHrB,KAAK,CAAC,EAAE,CAIb,CACH,CAAC;oBACJ,CAAC;oBACD,OAAO,IAAI,CAAC;gBACd,CAAC,CAAC,GACE,CACP,IACG,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { ContainerNode } from '@actuate-media/cms-core';
|
|
2
|
+
export interface ContainerRendererProps {
|
|
3
|
+
node: ContainerNode;
|
|
4
|
+
selectedNodeId: string | null;
|
|
5
|
+
onSelectNode: (id: string | null) => void;
|
|
6
|
+
}
|
|
7
|
+
export declare function ContainerRenderer({ node, selectedNodeId, onSelectNode }: ContainerRendererProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
//# sourceMappingURL=ContainerRenderer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ContainerRenderer.d.ts","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/ContainerRenderer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAG7D,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,aAAa,CAAC;IACpB,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C;AAED,wBAAgB,iBAAiB,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,YAAY,EAAE,EAAE,sBAAsB,2CA0D/F"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { RowRenderer } from './RowRenderer.js';
|
|
5
|
+
export function ContainerRenderer({ node, selectedNodeId, onSelectNode }) {
|
|
6
|
+
const [hovered, setHovered] = useState(false);
|
|
7
|
+
const isSelected = selectedNodeId === node.id;
|
|
8
|
+
const maxWidth = node.settings.maxWidth ?? '1200px';
|
|
9
|
+
const alignment = node.settings.alignment ?? 'center';
|
|
10
|
+
const padding = node.settings.padding;
|
|
11
|
+
const marginMap = {
|
|
12
|
+
left: '0 auto 0 0',
|
|
13
|
+
center: '0 auto',
|
|
14
|
+
right: '0 0 0 auto',
|
|
15
|
+
};
|
|
16
|
+
const handleClick = (e) => {
|
|
17
|
+
e.stopPropagation();
|
|
18
|
+
onSelectNode(node.id);
|
|
19
|
+
};
|
|
20
|
+
return (_jsxs("div", { "data-node-id": node.id, className: `relative transition-shadow ${isSelected
|
|
21
|
+
? 'ring-2 ring-primary ring-offset-2'
|
|
22
|
+
: hovered
|
|
23
|
+
? 'ring-1 ring-primary/50'
|
|
24
|
+
: ''}`, style: {
|
|
25
|
+
maxWidth,
|
|
26
|
+
margin: marginMap[alignment] ?? '0 auto',
|
|
27
|
+
padding,
|
|
28
|
+
}, onClick: handleClick, onMouseEnter: (e) => {
|
|
29
|
+
e.stopPropagation();
|
|
30
|
+
setHovered(true);
|
|
31
|
+
}, onMouseLeave: () => setHovered(false), children: [(hovered || isSelected) && (_jsx("span", { className: "absolute -top-2 -left-1 text-xs px-1.5 py-0.5 bg-primary text-primary-foreground rounded font-medium z-10", children: "Container" })), _jsx("div", { className: "flex flex-col gap-4", children: node.children.map((row) => (_jsx(RowRenderer, { node: row, selectedNodeId: selectedNodeId, onSelectNode: onSelectNode }, row.id))) })] }));
|
|
32
|
+
}
|
|
33
|
+
//# sourceMappingURL=ContainerRenderer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ContainerRenderer.js","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/ContainerRenderer.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAQ/C,MAAM,UAAU,iBAAiB,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,YAAY,EAA0B;IAC9F,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,UAAU,GAAG,cAAc,KAAK,IAAI,CAAC,EAAE,CAAC;IAC9C,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,IAAI,QAAQ,CAAC;IACpD,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS,IAAI,QAAQ,CAAC;IACtD,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC;IAEtC,MAAM,SAAS,GAA2B;QACxC,IAAI,EAAE,YAAY;QAClB,MAAM,EAAE,QAAQ;QAChB,KAAK,EAAE,YAAY;KACpB,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;QAC1C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,OAAO,CACL,+BACgB,IAAI,CAAC,EAAE,EACrB,SAAS,EAAE,8BACT,UAAU;YACR,CAAC,CAAC,mCAAmC;YACrC,CAAC,CAAC,OAAO;gBACP,CAAC,CAAC,wBAAwB;gBAC1B,CAAC,CAAC,EACR,EAAE,EACF,KAAK,EAAE;YACL,QAAQ;YACR,MAAM,EAAE,SAAS,CAAC,SAAS,CAAC,IAAI,QAAQ;YACxC,OAAO;SACR,EACD,OAAO,EAAE,WAAW,EACpB,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YAClB,CAAC,CAAC,eAAe,EAAE,CAAC;YACpB,UAAU,CAAC,IAAI,CAAC,CAAC;QACnB,CAAC,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,aAEpC,CAAC,OAAO,IAAI,UAAU,CAAC,IAAI,CAC1B,eAAM,SAAS,EAAC,2GAA2G,0BAEpH,CACR,EAED,cAAK,SAAS,EAAC,qBAAqB,YACjC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAC1B,KAAC,WAAW,IAEV,IAAI,EAAE,GAAG,EACT,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,IAHrB,GAAG,CAAC,EAAE,CAIX,CACH,CAAC,GACE,IACF,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { RowNode } from '@actuate-media/cms-core';
|
|
2
|
+
export interface RowRendererProps {
|
|
3
|
+
node: RowNode;
|
|
4
|
+
selectedNodeId: string | null;
|
|
5
|
+
onSelectNode: (id: string | null) => void;
|
|
6
|
+
}
|
|
7
|
+
export declare function RowRenderer({ node, selectedNodeId, onSelectNode }: RowRendererProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
//# sourceMappingURL=RowRenderer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RowRenderer.d.ts","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/RowRenderer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAGvD,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,OAAO,CAAC;IACd,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C;AAED,wBAAgB,WAAW,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,YAAY,EAAE,EAAE,gBAAgB,2CA2DnF"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { ColumnRenderer } from './ColumnRenderer.js';
|
|
5
|
+
export function RowRenderer({ node, selectedNodeId, onSelectNode }) {
|
|
6
|
+
const [hovered, setHovered] = useState(false);
|
|
7
|
+
const isSelected = selectedNodeId === node.id;
|
|
8
|
+
const gap = node.settings.gap ?? '16px';
|
|
9
|
+
const verticalAlign = node.settings.verticalAlign ?? 'stretch';
|
|
10
|
+
const alignMap = {
|
|
11
|
+
top: 'start',
|
|
12
|
+
center: 'center',
|
|
13
|
+
bottom: 'end',
|
|
14
|
+
stretch: 'stretch',
|
|
15
|
+
};
|
|
16
|
+
const handleClick = (e) => {
|
|
17
|
+
e.stopPropagation();
|
|
18
|
+
onSelectNode(node.id);
|
|
19
|
+
};
|
|
20
|
+
return (_jsxs("div", { "data-node-id": node.id, className: `relative transition-shadow ${isSelected
|
|
21
|
+
? 'ring-2 ring-primary ring-offset-2'
|
|
22
|
+
: hovered
|
|
23
|
+
? 'ring-1 ring-primary/50'
|
|
24
|
+
: ''}`, onClick: handleClick, onMouseEnter: (e) => {
|
|
25
|
+
e.stopPropagation();
|
|
26
|
+
setHovered(true);
|
|
27
|
+
}, onMouseLeave: () => setHovered(false), children: [(hovered || isSelected) && (_jsx("span", { className: "absolute -top-2 -left-1 text-xs px-1.5 py-0.5 bg-primary text-primary-foreground rounded font-medium z-10", children: "Row" })), _jsx("div", { className: "grid grid-cols-12", style: {
|
|
28
|
+
gap,
|
|
29
|
+
alignItems: alignMap[verticalAlign] ?? 'stretch',
|
|
30
|
+
}, children: node.children.map((col) => (_jsx(ColumnRenderer, { node: col, selectedNodeId: selectedNodeId, onSelectNode: onSelectNode }, col.id))) })] }));
|
|
31
|
+
}
|
|
32
|
+
//# sourceMappingURL=RowRenderer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RowRenderer.js","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/RowRenderer.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAQrD,MAAM,UAAU,WAAW,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,YAAY,EAAoB;IAClF,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,UAAU,GAAG,cAAc,KAAK,IAAI,CAAC,EAAE,CAAC;IAC9C,MAAM,GAAG,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,IAAI,MAAM,CAAC;IACxC,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,IAAI,SAAS,CAAC;IAE/D,MAAM,QAAQ,GAA2B;QACvC,GAAG,EAAE,OAAO;QACZ,MAAM,EAAE,QAAQ;QAChB,MAAM,EAAE,KAAK;QACb,OAAO,EAAE,SAAS;KACnB,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;QAC1C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,OAAO,CACL,+BACgB,IAAI,CAAC,EAAE,EACrB,SAAS,EAAE,8BACT,UAAU;YACR,CAAC,CAAC,mCAAmC;YACrC,CAAC,CAAC,OAAO;gBACP,CAAC,CAAC,wBAAwB;gBAC1B,CAAC,CAAC,EACR,EAAE,EACF,OAAO,EAAE,WAAW,EACpB,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YAClB,CAAC,CAAC,eAAe,EAAE,CAAC;YACpB,UAAU,CAAC,IAAI,CAAC,CAAC;QACnB,CAAC,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,aAEpC,CAAC,OAAO,IAAI,UAAU,CAAC,IAAI,CAC1B,eAAM,SAAS,EAAC,2GAA2G,oBAEpH,CACR,EAED,cACE,SAAS,EAAC,mBAAmB,EAC7B,KAAK,EAAE;oBACL,GAAG;oBACH,UAAU,EAAE,QAAQ,CAAC,aAAa,CAAC,IAAI,SAAS;iBACjD,YAEA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAC1B,KAAC,cAAc,IAEb,IAAI,EAAE,GAAG,EACT,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,IAHrB,GAAG,CAAC,EAAE,CAIX,CACH,CAAC,GACE,IACF,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { SectionNode } from '@actuate-media/cms-core';
|
|
2
|
+
export interface SectionRendererProps {
|
|
3
|
+
node: SectionNode;
|
|
4
|
+
selectedNodeId: string | null;
|
|
5
|
+
onSelectNode: (id: string | null) => void;
|
|
6
|
+
}
|
|
7
|
+
export declare function SectionRenderer({ node, selectedNodeId, onSelectNode }: SectionRendererProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
//# sourceMappingURL=SectionRenderer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SectionRenderer.d.ts","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/SectionRenderer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAI3D,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,WAAW,CAAC;IAClB,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C;AAED,wBAAgB,eAAe,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,YAAY,EAAE,EAAE,oBAAoB,2CAmF3F"}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { ContainerRenderer } from './ContainerRenderer.js';
|
|
5
|
+
import { RowRenderer } from './RowRenderer.js';
|
|
6
|
+
export function SectionRenderer({ node, selectedNodeId, onSelectNode }) {
|
|
7
|
+
const [hovered, setHovered] = useState(false);
|
|
8
|
+
const isSelected = selectedNodeId === node.id;
|
|
9
|
+
const handleClick = (e) => {
|
|
10
|
+
e.stopPropagation();
|
|
11
|
+
onSelectNode(node.id);
|
|
12
|
+
};
|
|
13
|
+
const backgroundStyle = {};
|
|
14
|
+
if (node.settings.background) {
|
|
15
|
+
backgroundStyle.backgroundColor = node.settings.background;
|
|
16
|
+
}
|
|
17
|
+
if (node.settings.backgroundImage) {
|
|
18
|
+
backgroundStyle.backgroundImage = `url(${node.settings.backgroundImage})`;
|
|
19
|
+
backgroundStyle.backgroundSize = 'cover';
|
|
20
|
+
backgroundStyle.backgroundPosition = 'center';
|
|
21
|
+
}
|
|
22
|
+
if (node.settings.backgroundGradient) {
|
|
23
|
+
backgroundStyle.backgroundImage = node.settings.backgroundGradient;
|
|
24
|
+
}
|
|
25
|
+
if (node.settings.paddingTop) {
|
|
26
|
+
backgroundStyle.paddingTop = node.settings.paddingTop;
|
|
27
|
+
}
|
|
28
|
+
if (node.settings.paddingBottom) {
|
|
29
|
+
backgroundStyle.paddingBottom = node.settings.paddingBottom;
|
|
30
|
+
}
|
|
31
|
+
if (node.settings.marginTop) {
|
|
32
|
+
backgroundStyle.marginTop = node.settings.marginTop;
|
|
33
|
+
}
|
|
34
|
+
if (node.settings.marginBottom) {
|
|
35
|
+
backgroundStyle.marginBottom = node.settings.marginBottom;
|
|
36
|
+
}
|
|
37
|
+
return (_jsxs("div", { "data-node-id": node.id, className: `relative w-full transition-shadow ${isSelected
|
|
38
|
+
? 'ring-2 ring-primary ring-offset-2'
|
|
39
|
+
: hovered
|
|
40
|
+
? 'ring-1 ring-primary/50'
|
|
41
|
+
: ''}`, style: backgroundStyle, onClick: handleClick, onMouseEnter: (e) => {
|
|
42
|
+
e.stopPropagation();
|
|
43
|
+
setHovered(true);
|
|
44
|
+
}, onMouseLeave: () => setHovered(false), children: [(hovered || isSelected) && (_jsx("span", { className: "absolute -top-2 -left-1 text-xs px-1.5 py-0.5 bg-primary text-primary-foreground rounded font-medium z-10", children: "Section" })), node.children.map((child) => {
|
|
45
|
+
if (child.type === 'container') {
|
|
46
|
+
return (_jsx(ContainerRenderer, { node: child, selectedNodeId: selectedNodeId, onSelectNode: onSelectNode }, child.id));
|
|
47
|
+
}
|
|
48
|
+
if (child.type === 'row') {
|
|
49
|
+
return (_jsx(RowRenderer, { node: child, selectedNodeId: selectedNodeId, onSelectNode: onSelectNode }, child.id));
|
|
50
|
+
}
|
|
51
|
+
return null;
|
|
52
|
+
})] }));
|
|
53
|
+
}
|
|
54
|
+
//# sourceMappingURL=SectionRenderer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SectionRenderer.js","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/SectionRenderer.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAQ/C,MAAM,UAAU,eAAe,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,YAAY,EAAwB;IAC1F,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,UAAU,GAAG,cAAc,KAAK,IAAI,CAAC,EAAE,CAAC;IAE9C,MAAM,WAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;QAC1C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,MAAM,eAAe,GAAwB,EAAE,CAAC;IAChD,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;QAC7B,eAAe,CAAC,eAAe,GAAG,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC;IAC7D,CAAC;IACD,IAAI,IAAI,CAAC,QAAQ,CAAC,eAAe,EAAE,CAAC;QAClC,eAAe,CAAC,eAAe,GAAG,OAAO,IAAI,CAAC,QAAQ,CAAC,eAAe,GAAG,CAAC;QAC1E,eAAe,CAAC,cAAc,GAAG,OAAO,CAAC;QACzC,eAAe,CAAC,kBAAkB,GAAG,QAAQ,CAAC;IAChD,CAAC;IACD,IAAI,IAAI,CAAC,QAAQ,CAAC,kBAAkB,EAAE,CAAC;QACrC,eAAe,CAAC,eAAe,GAAG,IAAI,CAAC,QAAQ,CAAC,kBAAkB,CAAC;IACrE,CAAC;IACD,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;QAC7B,eAAe,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC;IACxD,CAAC;IACD,IAAI,IAAI,CAAC,QAAQ,CAAC,aAAa,EAAE,CAAC;QAChC,eAAe,CAAC,aAAa,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC;IAC9D,CAAC;IACD,IAAI,IAAI,CAAC,QAAQ,CAAC,SAAS,EAAE,CAAC;QAC5B,eAAe,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC;IACtD,CAAC;IACD,IAAI,IAAI,CAAC,QAAQ,CAAC,YAAY,EAAE,CAAC;QAC/B,eAAe,CAAC,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC;IAC5D,CAAC;IAED,OAAO,CACL,+BACgB,IAAI,CAAC,EAAE,EACrB,SAAS,EAAE,qCACT,UAAU;YACR,CAAC,CAAC,mCAAmC;YACrC,CAAC,CAAC,OAAO;gBACP,CAAC,CAAC,wBAAwB;gBAC1B,CAAC,CAAC,EACR,EAAE,EACF,KAAK,EAAE,eAAe,EACtB,OAAO,EAAE,WAAW,EACpB,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YAClB,CAAC,CAAC,eAAe,EAAE,CAAC;YACpB,UAAU,CAAC,IAAI,CAAC,CAAC;QACnB,CAAC,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,aAEpC,CAAC,OAAO,IAAI,UAAU,CAAC,IAAI,CAC1B,eAAM,SAAS,EAAC,2GAA2G,wBAEpH,CACR,EAEA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;gBAC3B,IAAI,KAAK,CAAC,IAAI,KAAK,WAAW,EAAE,CAAC;oBAC/B,OAAO,CACL,KAAC,iBAAiB,IAEhB,IAAI,EAAE,KAAK,EACX,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,IAHrB,KAAK,CAAC,EAAE,CAIb,CACH,CAAC;gBACJ,CAAC;gBACD,IAAI,KAAK,CAAC,IAAI,KAAK,KAAK,EAAE,CAAC;oBACzB,OAAO,CACL,KAAC,WAAW,IAEV,IAAI,EAAE,KAAK,EACX,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,IAHrB,KAAK,CAAC,EAAE,CAIb,CACH,CAAC;gBACJ,CAAC;gBACD,OAAO,IAAI,CAAC;YACd,CAAC,CAAC,IACE,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,YAAY,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/views/page-builder/canvas/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@actuate-media/cms-admin",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.7.0",
|
|
4
4
|
"repository": {
|
|
5
5
|
"type": "git",
|
|
6
6
|
"url": "https://github.com/actuate-media/actuatecms.git",
|
|
@@ -58,8 +58,10 @@
|
|
|
58
58
|
"react-dom": "^19.2.0",
|
|
59
59
|
"recharts": "^3.8.1",
|
|
60
60
|
"sonner": "^2.0.7",
|
|
61
|
-
"tailwind-merge": "^3.5.0"
|
|
62
|
-
|
|
61
|
+
"tailwind-merge": "^3.5.0"
|
|
62
|
+
},
|
|
63
|
+
"peerDependencies": {
|
|
64
|
+
"@actuate-media/cms-core": ">=0.1.0"
|
|
63
65
|
},
|
|
64
66
|
"devDependencies": {
|
|
65
67
|
"@tailwindcss/cli": "^4.0.0",
|
|
@@ -67,7 +69,8 @@
|
|
|
67
69
|
"@types/react-dom": "^19.0.0",
|
|
68
70
|
"tailwindcss": "^4.0.0",
|
|
69
71
|
"typescript": "^5.7.0",
|
|
70
|
-
"vitest": "^3.0.0"
|
|
72
|
+
"vitest": "^3.0.0",
|
|
73
|
+
"@actuate-media/cms-core": "0.9.0"
|
|
71
74
|
},
|
|
72
75
|
"scripts": {
|
|
73
76
|
"build": "tsc --project tsconfig.json && npx @tailwindcss/cli -i src/styles/build-input.css -o dist/actuate-admin.css --minify",
|