@prenta/admin 0.98.1 → 1.0.0

package/src/views/page-builder/canvas/ContainerRenderer.tsx

@@ -1,67 +0,0 @@
-'use client'
-
-import { useState } from 'react'
-import type { ContainerNode } from '@prenta/core'
-import { RowRenderer } from './RowRenderer.js'
-
-export interface ContainerRendererProps {
-  node: ContainerNode
-  selectedNodeId: string | null
-  onSelectNode: (id: string | null) => void
-}
-
-export function ContainerRenderer({ node, selectedNodeId, onSelectNode }: ContainerRendererProps) {
-  const [hovered, setHovered] = useState(false)
-  const isSelected = selectedNodeId === node.id
-  const maxWidth = node.settings.maxWidth ?? '1200px'
-  const alignment = node.settings.alignment ?? 'center'
-  const padding = node.settings.padding
-
-  const marginMap: Record<string, string> = {
-    left: '0 auto 0 0',
-    center: '0 auto',
-    right: '0 0 0 auto',
-  }
-
-  const handleClick = (e: React.MouseEvent) => {
-    e.stopPropagation()
-    onSelectNode(node.id)
-  }
-
-  return (
-    <div
-      data-node-id={node.id}
-      className={`relative transition-shadow ${
-        isSelected ? 'ring-primary ring-2 ring-offset-2' : hovered ? 'ring-primary/50 ring-1' : ''
-      }`}
-      style={{
-        maxWidth,
-        margin: marginMap[alignment] ?? '0 auto',
-        padding,
-      }}
-      onClick={handleClick}
-      onMouseEnter={(e) => {
-        e.stopPropagation()
-        setHovered(true)
-      }}
-      onMouseLeave={() => setHovered(false)}
-    >
-      {(hovered || isSelected) && (
-        <span className="bg-primary text-primary-foreground absolute -top-2 -left-1 z-10 rounded px-1.5 py-0.5 text-xs font-medium">
-          Container
-        </span>
-      )}
-
-      <div className="flex flex-col gap-4">
-        {node.children.map((row) => (
-          <RowRenderer
-            key={row.id}
-            node={row}
-            selectedNodeId={selectedNodeId}
-            onSelectNode={onSelectNode}
-          />
-        ))}
-      </div>
-    </div>
-  )
-}

package/src/views/page-builder/canvas/RowRenderer.tsx

@@ -1,68 +0,0 @@
-'use client'
-
-import { useState } from 'react'
-import type { RowNode } from '@prenta/core'
-import { ColumnRenderer } from './ColumnRenderer.js'
-
-export interface RowRendererProps {
-  node: RowNode
-  selectedNodeId: string | null
-  onSelectNode: (id: string | null) => void
-}
-
-export function RowRenderer({ node, selectedNodeId, onSelectNode }: RowRendererProps) {
-  const [hovered, setHovered] = useState(false)
-  const isSelected = selectedNodeId === node.id
-  const gap = node.settings.gap ?? '16px'
-  const verticalAlign = node.settings.verticalAlign ?? 'stretch'
-
-  const alignMap: Record<string, string> = {
-    top: 'start',
-    center: 'center',
-    bottom: 'end',
-    stretch: 'stretch',
-  }
-
-  const handleClick = (e: React.MouseEvent) => {
-    e.stopPropagation()
-    onSelectNode(node.id)
-  }
-
-  return (
-    <div
-      data-node-id={node.id}
-      className={`relative transition-shadow ${
-        isSelected ? 'ring-primary ring-2 ring-offset-2' : hovered ? 'ring-primary/50 ring-1' : ''
-      }`}
-      onClick={handleClick}
-      onMouseEnter={(e) => {
-        e.stopPropagation()
-        setHovered(true)
-      }}
-      onMouseLeave={() => setHovered(false)}
-    >
-      {(hovered || isSelected) && (
-        <span className="bg-primary text-primary-foreground absolute -top-2 -left-1 z-10 rounded px-1.5 py-0.5 text-xs font-medium">
-          Row
-        </span>
-      )}
-
-      <div
-        className="grid grid-cols-12"
-        style={{
-          gap,
-          alignItems: alignMap[verticalAlign] ?? 'stretch',
-        }}
-      >
-        {node.children.map((col) => (
-          <ColumnRenderer
-            key={col.id}
-            node={col}
-            selectedNodeId={selectedNodeId}
-            onSelectNode={onSelectNode}
-          />
-        ))}
-      </div>
-    </div>
-  )
-}

package/src/views/page-builder/canvas/SectionRenderer.tsx

@@ -1,93 +0,0 @@
-'use client'
-
-import { useState } from 'react'
-import type { SectionNode } from '@prenta/core'
-import { ContainerRenderer } from './ContainerRenderer.js'
-import { RowRenderer } from './RowRenderer.js'
-
-export interface SectionRendererProps {
-  node: SectionNode
-  selectedNodeId: string | null
-  onSelectNode: (id: string | null) => void
-}
-
-export function SectionRenderer({ node, selectedNodeId, onSelectNode }: SectionRendererProps) {
-  const [hovered, setHovered] = useState(false)
-  const isSelected = selectedNodeId === node.id
-
-  const handleClick = (e: React.MouseEvent) => {
-    e.stopPropagation()
-    onSelectNode(node.id)
-  }
-
-  const backgroundStyle: React.CSSProperties = {}
-  if (node.settings.background) {
-    backgroundStyle.backgroundColor = node.settings.background
-  }
-  if (node.settings.backgroundImage) {
-    backgroundStyle.backgroundImage = `url(${node.settings.backgroundImage})`
-    backgroundStyle.backgroundSize = 'cover'
-    backgroundStyle.backgroundPosition = 'center'
-  }
-  if (node.settings.backgroundGradient) {
-    backgroundStyle.backgroundImage = node.settings.backgroundGradient
-  }
-  if (node.settings.paddingTop) {
-    backgroundStyle.paddingTop = node.settings.paddingTop
-  }
-  if (node.settings.paddingBottom) {
-    backgroundStyle.paddingBottom = node.settings.paddingBottom
-  }
-  if (node.settings.marginTop) {
-    backgroundStyle.marginTop = node.settings.marginTop
-  }
-  if (node.settings.marginBottom) {
-    backgroundStyle.marginBottom = node.settings.marginBottom
-  }
-
-  return (
-    <div
-      data-node-id={node.id}
-      className={`relative w-full transition-shadow ${
-        isSelected ? 'ring-primary ring-2 ring-offset-2' : hovered ? 'ring-primary/50 ring-1' : ''
-      }`}
-      style={backgroundStyle}
-      onClick={handleClick}
-      onMouseEnter={(e) => {
-        e.stopPropagation()
-        setHovered(true)
-      }}
-      onMouseLeave={() => setHovered(false)}
-    >
-      {(hovered || isSelected) && (
-        <span className="bg-primary text-primary-foreground absolute -top-2 -left-1 z-10 rounded px-1.5 py-0.5 text-xs font-medium">
-          Section
-        </span>
-      )}
-
-      {node.children.map((child) => {
-        if (child.type === 'container') {
-          return (
-            <ContainerRenderer
-              key={child.id}
-              node={child}
-              selectedNodeId={selectedNodeId}
-              onSelectNode={onSelectNode}
-            />
-          )
-        }
-        if (child.type === 'row') {
-          return (
-            <RowRenderer
-              key={child.id}
-              node={child}
-              selectedNodeId={selectedNodeId}
-              onSelectNode={onSelectNode}
-            />
-          )
-        }
-        return null
-      })}
-    </div>
-  )
-}

package/src/views/page-builder/canvas/index.ts

@@ -1,2 +0,0 @@
-export { BuilderCanvas } from './BuilderCanvas.js'
-export type { BuilderCanvasProps } from './BuilderCanvas.js'