@delmaredigital/payload-puck 0.6.10 → 0.6.13

package/dist/components/interactive/Card.js

@@ -1,15 +1,19 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { shadowField, shadowMap, cn, marginValueToCSS, paddingValueToCSS, backgroundValueToCSS, borderValueToCSS, dimensionsValueToCSS, transformValueToCSS, } from '../../fields/shared';
-import { AnimatedWrapper } from '../AnimatedWrapper';
-import { createMarginField } from '../../fields/MarginField';
-import { createPaddingField } from '../../fields/PaddingField';
-import { createResetField } from '../../fields/ResetField';
-import { createBackgroundField } from '../../fields/BackgroundField';
-import { createBorderField } from '../../fields/BorderField';
-import { createDimensionsField } from '../../fields/DimensionsField';
-import { createAlignmentField } from '../../fields/AlignmentField';
-import { createAnimationField } from '../../fields/AnimationField';
-import { createTransformField } from '../../fields/TransformField';
+/**
+ * Card Component - Puck Configuration
+ *
+ * Content card with image, heading, and text.
+ */ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { shadowField, shadowMap, cn, marginValueToCSS, paddingValueToCSS, backgroundValueToCSS, borderValueToCSS, dimensionsValueToCSS, transformValueToCSS } from '../../fields/shared.js';
+import { AnimatedWrapper } from '../AnimatedWrapper.js';
+import { createMarginField } from '../../fields/MarginField.js';
+import { createPaddingField } from '../../fields/PaddingField.js';
+import { createResetField } from '../../fields/ResetField.js';
+import { createBackgroundField } from '../../fields/BackgroundField.js';
+import { createBorderField } from '../../fields/BorderField.js';
+import { createDimensionsField } from '../../fields/DimensionsField.js';
+import { createAlignmentField } from '../../fields/AlignmentField.js';
+import { createAnimationField } from '../../fields/AnimationField.js';
+import { createTransformField } from '../../fields/TransformField.js';
 // Default content padding for card (replaces hardcoded p-4)
 const DEFAULT_CONTENT_PADDING = {
     top: 16,
@@ -17,7 +21,7 @@ const DEFAULT_CONTENT_PADDING = {
     bottom: 16,
     left: 16,
     unit: 'px',
-    linked: true,
+    linked: true
 };
 const defaultProps = {
     image: null,
@@ -33,54 +37,87 @@ const defaultProps = {
     alignment: null,
     transform: null,
     animation: null,
-    contentPadding: DEFAULT_CONTENT_PADDING, // Default 16px padding, visible in editor
+    contentPadding: DEFAULT_CONTENT_PADDING
 };
 export const CardConfig = {
     label: 'Card',
     fields: {
-        _reset: createResetField({ defaultProps }),
+        _reset: createResetField({
+            defaultProps
+        }),
         image: {
             type: 'object',
             label: 'Image',
             objectFields: {
-                id: { type: 'text', label: 'Media ID' },
-                url: { type: 'text', label: 'URL' },
-                alt: { type: 'text', label: 'Alt Text' },
-            },
+                id: {
+                    type: 'text',
+                    label: 'Media ID'
+                },
+                url: {
+                    type: 'text',
+                    label: 'URL'
+                },
+                alt: {
+                    type: 'text',
+                    label: 'Alt Text'
+                }
+            }
         },
         heading: {
             type: 'text',
-            label: 'Heading',
+            label: 'Heading'
         },
         text: {
             type: 'textarea',
-            label: 'Text',
+            label: 'Text'
         },
         link: {
             type: 'text',
-            label: 'Link URL',
+            label: 'Link URL'
         },
         openInNewTab: {
             type: 'radio',
             label: 'Open in New Tab',
             options: [
-                { label: 'Yes', value: true },
-                { label: 'No', value: false },
-            ],
+                {
+                    label: 'Yes',
+                    value: true
+                },
+                {
+                    label: 'No',
+                    value: false
+                }
+            ]
         },
         shadow: shadowField,
-        background: createBackgroundField({ label: 'Background' }),
-        border: createBorderField({ label: 'Border' }),
-        dimensions: createDimensionsField({ label: 'Dimensions' }),
-        alignment: createAlignmentField({ label: 'Alignment' }),
-        transform: createTransformField({ label: 'Transform' }),
-        animation: createAnimationField({ label: 'Animation' }),
+        background: createBackgroundField({
+            label: 'Background'
+        }),
+        border: createBorderField({
+            label: 'Border'
+        }),
+        dimensions: createDimensionsField({
+            label: 'Dimensions'
+        }),
+        alignment: createAlignmentField({
+            label: 'Alignment'
+        }),
+        transform: createTransformField({
+            label: 'Transform'
+        }),
+        animation: createAnimationField({
+            label: 'Animation'
+        }),
         // Spacing (grouped at bottom)
-        margin: createMarginField({ label: 'Margin' }),
-        contentPadding: createPaddingField({ label: 'Content Padding' }),
+        margin: createMarginField({
+            label: 'Margin'
+        }),
+        contentPadding: createPaddingField({
+            label: 'Content Padding'
+        })
     },
     defaultProps,
-    render: ({ image, heading, text, link, openInNewTab, shadow, background, dimensions, alignment, margin, border, transform, animation, contentPadding }) => {
+    render: ({ image, heading, text, link, openInNewTab, shadow, background, dimensions, alignment, margin, border, transform, animation, contentPadding })=>{
         // Check if border has radius, if so don't apply rounded-lg
         const hasBorderRadius = border?.radius && border.radius > 0;
         const cardClasses = cn('overflow-hidden transition-all bg-card', !hasBorderRadius && 'rounded-lg', shadowMap[shadow] || '', link && 'hover:shadow-lg cursor-pointer');
@@ -104,7 +141,7 @@ export const CardConfig = {
         // Card background styles from BackgroundValue
         const backgroundStyles = backgroundValueToCSS(background);
         const cardStyle = {
-            ...backgroundStyles,
+            ...backgroundStyles
         };
         // Note: bg-card class handles default background (theme-aware)
         // Apply border to card
@@ -118,11 +155,66 @@ export const CardConfig = {
         if (contentPaddingCSS) {
             contentStyle.padding = contentPaddingCSS;
         }
-        const cardContent = (_jsxs("div", { className: cardClasses, style: cardStyle, children: [image?.url ? (_jsx("div", { className: "relative aspect-video w-full overflow-hidden", children: _jsx("img", { src: image.url, alt: image.alt || heading || '', className: "w-full h-full object-cover" }) })) : (_jsx("div", { className: "aspect-video w-full bg-muted flex items-center justify-center", children: _jsx("span", { className: "text-muted-foreground", children: "No image" }) })), _jsxs("div", { style: contentStyle, children: [heading && (_jsx("h3", { className: "text-lg font-semibold text-foreground mb-2", children: heading })), text && _jsx("p", { className: "text-muted-foreground text-sm", children: text })] })] }));
+        const cardContent = /*#__PURE__*/ _jsxs("div", {
+            className: cardClasses,
+            style: cardStyle,
+            children: [
+                image?.url ? /*#__PURE__*/ _jsx("div", {
+                    className: "relative aspect-video w-full overflow-hidden",
+                    children: /*#__PURE__*/ _jsx("img", {
+                        src: image.url,
+                        alt: image.alt || heading || '',
+                        className: "w-full h-full object-cover"
+                    })
+                }) : /*#__PURE__*/ _jsx("div", {
+                    className: "aspect-video w-full bg-muted flex items-center justify-center",
+                    children: /*#__PURE__*/ _jsx("span", {
+                        className: "text-muted-foreground",
+                        children: "No image"
+                    })
+                }),
+                /*#__PURE__*/ _jsxs("div", {
+                    style: contentStyle,
+                    children: [
+                        heading && /*#__PURE__*/ _jsx("h3", {
+                            className: "text-lg font-semibold text-foreground mb-2",
+                            children: heading
+                        }),
+                        text && /*#__PURE__*/ _jsx("p", {
+                            className: "text-muted-foreground text-sm",
+                            children: text
+                        })
+                    ]
+                })
+            ]
+        });
         if (link) {
-            return (_jsx(AnimatedWrapper, { animation: animation, children: _jsx("div", { className: alignmentClasses, children: _jsx("a", { href: link, target: openInNewTab ? '_blank' : undefined, rel: openInNewTab ? 'noopener noreferrer' : undefined, className: "block", style: wrapperStyle, children: cardContent }) }) }));
+            return /*#__PURE__*/ _jsx(AnimatedWrapper, {
+                animation: animation,
+                children: /*#__PURE__*/ _jsx("div", {
+                    className: alignmentClasses,
+                    children: /*#__PURE__*/ _jsx("a", {
+                        href: link,
+                        target: openInNewTab ? '_blank' : undefined,
+                        rel: openInNewTab ? 'noopener noreferrer' : undefined,
+                        className: "block",
+                        style: wrapperStyle,
+                        children: cardContent
+                    })
+                })
+            });
         }
-        return (_jsx(AnimatedWrapper, { animation: animation, children: _jsx("div", { className: alignmentClasses, children: _jsx("div", { style: wrapperStyle, children: cardContent }) }) }));
-    },
+        return /*#__PURE__*/ _jsx(AnimatedWrapper, {
+            animation: animation,
+            children: /*#__PURE__*/ _jsx("div", {
+                className: alignmentClasses,
+                children: /*#__PURE__*/ _jsx("div", {
+                    style: wrapperStyle,
+                    children: cardContent
+                })
+            })
+        });
+    }
 };
+
 //# sourceMappingURL=Card.js.map

package/dist/components/interactive/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/components/interactive/Card.tsx"],"names":[],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/interactive/Card.tsx"],"sourcesContent":["/**\n * Card Component - Puck Configuration\n *\n * Content card with image, heading, and text.\n */\n\nimport type { ComponentConfig } from '@puckeditor/core'\nimport {\n  shadowField,\n  shadowMap,\n  cn,\n  marginValueToCSS,\n  paddingValueToCSS,\n  backgroundValueToCSS,\n  borderValueToCSS,\n  dimensionsValueToCSS,\n  transformValueToCSS,\n  type PaddingValue,\n  type BackgroundValue,\n  type BorderValue,\n  type DimensionsValue,\n  type AnimationValue,\n  type TransformValue,\n} from '../../fields/shared.js'\nimport { AnimatedWrapper } from '../AnimatedWrapper.js'\nimport { createMarginField } from '../../fields/MarginField.js'\nimport { createPaddingField } from '../../fields/PaddingField.js'\nimport { createResetField } from '../../fields/ResetField.js'\nimport { createBackgroundField } from '../../fields/BackgroundField.js'\nimport { createBorderField } from '../../fields/BorderField.js'\nimport { createDimensionsField } from '../../fields/DimensionsField.js'\nimport { createAlignmentField, type Alignment } from '../../fields/AlignmentField.js'\nimport { createAnimationField } from '../../fields/AnimationField.js'\nimport { createTransformField } from '../../fields/TransformField.js'\nimport type { MediaReference } from '../../fields/MediaField.js'\n\n// Default content padding for card (replaces hardcoded p-4)\nconst DEFAULT_CONTENT_PADDING: PaddingValue = {\n  top: 16,\n  right: 16,\n  bottom: 16,\n  left: 16,\n  unit: 'px',\n  linked: true,\n}\n\nexport interface CardProps {\n  image: MediaReference | null\n  heading: string\n  text: string\n  link: string\n  openInNewTab: boolean\n  shadow: string\n  margin: PaddingValue | null\n  background: BackgroundValue | null\n  border: BorderValue | null\n  dimensions: DimensionsValue | null\n  alignment: Alignment | null\n  transform: TransformValue | null\n  animation: AnimationValue | null\n  contentPadding: PaddingValue | null // Renamed from customPadding for clarity\n}\n\nconst defaultProps: CardProps = {\n  image: null,\n  heading: 'Card Heading',\n  text: 'Card description text goes here.',\n  link: '',\n  openInNewTab: false,\n  shadow: 'md',\n  margin: null,\n  background: null,\n  border: null,\n  dimensions: null,\n  alignment: null,\n  transform: null,\n  animation: null,\n  contentPadding: DEFAULT_CONTENT_PADDING, // Default 16px padding, visible in editor\n}\n\nexport const CardConfig: ComponentConfig = {\n  label: 'Card',\n  fields: {\n    _reset: createResetField({ defaultProps }),\n    image: {\n      type: 'object',\n      label: 'Image',\n      objectFields: {\n        id: { type: 'text', label: 'Media ID' },\n        url: { type: 'text', label: 'URL' },\n        alt: { type: 'text', label: 'Alt Text' },\n      },\n    },\n    heading: {\n      type: 'text',\n      label: 'Heading',\n    },\n    text: {\n      type: 'textarea',\n      label: 'Text',\n    },\n    link: {\n      type: 'text',\n      label: 'Link URL',\n    },\n    openInNewTab: {\n      type: 'radio',\n      label: 'Open in New Tab',\n      options: [\n        { label: 'Yes', value: true },\n        { label: 'No', value: false },\n      ],\n    },\n    shadow: shadowField,\n    background: createBackgroundField({ label: 'Background' }),\n    border: createBorderField({ label: 'Border' }),\n    dimensions: createDimensionsField({ label: 'Dimensions' }),\n    alignment: createAlignmentField({ label: 'Alignment' }),\n    transform: createTransformField({ label: 'Transform' }),\n    animation: createAnimationField({ label: 'Animation' }),\n    // Spacing (grouped at bottom)\n    margin: createMarginField({ label: 'Margin' }),\n    contentPadding: createPaddingField({ label: 'Content Padding' }),\n  },\n  defaultProps,\n  render: ({ image, heading, text, link, openInNewTab, shadow, background, dimensions, alignment, margin, border, transform, animation, contentPadding }) => {\n    // Check if border has radius, if so don't apply rounded-lg\n    const hasBorderRadius = border?.radius && border.radius > 0\n    const cardClasses = cn(\n      'overflow-hidden transition-all bg-card',\n      !hasBorderRadius && 'rounded-lg',\n      shadowMap[shadow] || '',\n      link && 'hover:shadow-lg cursor-pointer'\n    )\n\n    // Wrapper style for margin, dimensions, alignment, transform, animation\n    const wrapperStyle: React.CSSProperties = {}\n    const marginCSS = marginValueToCSS(margin)\n    if (marginCSS) {\n      wrapperStyle.margin = marginCSS\n    }\n    const dimensionsStyles = dimensionsValueToCSS(dimensions)\n    if (dimensionsStyles) {\n      Object.assign(wrapperStyle, dimensionsStyles)\n    }\n    const transformStyles = transformValueToCSS(transform)\n    if (transformStyles) {\n      Object.assign(wrapperStyle, transformStyles)\n    }\n\n    // Alignment classes for wrapper\n    const alignmentValue = alignment ?? 'left'\n    const alignmentClasses = cn(\n      'flex',\n      alignmentValue === 'left' && 'justify-start',\n      alignmentValue === 'center' && 'justify-center',\n      alignmentValue === 'right' && 'justify-end'\n    )\n\n    // Card background styles from BackgroundValue\n    const backgroundStyles = backgroundValueToCSS(background)\n    const cardStyle: React.CSSProperties = {\n      ...backgroundStyles,\n    }\n    // Note: bg-card class handles default background (theme-aware)\n    // Apply border to card\n    const borderStyles = borderValueToCSS(border)\n    if (borderStyles) {\n      Object.assign(cardStyle, borderStyles)\n    }\n\n    // Content section style with configurable padding\n    const contentStyle: React.CSSProperties = {}\n    const contentPaddingCSS = paddingValueToCSS(contentPadding)\n    if (contentPaddingCSS) {\n      contentStyle.padding = contentPaddingCSS\n    }\n\n    const cardContent = (\n      <div className={cardClasses} style={cardStyle}>\n        {/* Image */}\n        {image?.url ? (\n          <div className=\"relative aspect-video w-full overflow-hidden\">\n            {/* eslint-disable-next-line @next/next/no-img-element */}\n            <img\n              src={image.url}\n              alt={image.alt || heading || ''}\n              className=\"w-full h-full object-cover\"\n            />\n          </div>\n        ) : (\n          <div className=\"aspect-video w-full bg-muted flex items-center justify-center\">\n            <span className=\"text-muted-foreground\">No image</span>\n          </div>\n        )}\n\n        {/* Content */}\n        <div style={contentStyle}>\n          {heading && (\n            <h3 className=\"text-lg font-semibold text-foreground mb-2\">{heading}</h3>\n          )}\n          {text && <p className=\"text-muted-foreground text-sm\">{text}</p>}\n        </div>\n      </div>\n    )\n\n    if (link) {\n      return (\n        <AnimatedWrapper animation={animation}>\n          <div className={alignmentClasses}>\n            <a\n              href={link}\n              target={openInNewTab ? '_blank' : undefined}\n              rel={openInNewTab ? 'noopener noreferrer' : undefined}\n              className=\"block\"\n              style={wrapperStyle}\n            >\n              {cardContent}\n            </a>\n          </div>\n        </AnimatedWrapper>\n      )\n    }\n\n    return (\n      <AnimatedWrapper animation={animation}>\n        <div className={alignmentClasses}>\n          <div style={wrapperStyle}>{cardContent}</div>\n        </div>\n      </AnimatedWrapper>\n    )\n  },\n}\n"],"names":["shadowField","shadowMap","cn","marginValueToCSS","paddingValueToCSS","backgroundValueToCSS","borderValueToCSS","dimensionsValueToCSS","transformValueToCSS","AnimatedWrapper","createMarginField","createPaddingField","createResetField","createBackgroundField","createBorderField","createDimensionsField","createAlignmentField","createAnimationField","createTransformField","DEFAULT_CONTENT_PADDING","top","right","bottom","left","unit","linked","defaultProps","image","heading","text","link","openInNewTab","shadow","margin","background","border","dimensions","alignment","transform","animation","contentPadding","CardConfig","label","fields","_reset","type","objectFields","id","url","alt","options","value","render","hasBorderRadius","radius","cardClasses","wrapperStyle","marginCSS","dimensionsStyles","Object","assign","transformStyles","alignmentValue","alignmentClasses","backgroundStyles","cardStyle","borderStyles","contentStyle","contentPaddingCSS","padding","cardContent","div","className","style","img","src","span","h3","p","a","href","target","undefined","rel"],"mappings":"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"}

package/dist/components/interactive/Card.server.d.ts

@@ -6,9 +6,9 @@
  * Safe for use in server components.
  */
 import type { ComponentConfig } from '@puckeditor/core';
-import { type PaddingValue, type BackgroundValue, type BorderValue, type DimensionsValue, type AnimationValue, type TransformValue } from '../../fields/shared';
-import type { MediaReference } from '../../fields/MediaField';
-import type { Alignment } from '../../fields/AlignmentField';
+import { type PaddingValue, type BackgroundValue, type BorderValue, type DimensionsValue, type AnimationValue, type TransformValue } from '../../fields/shared.js';
+import type { MediaReference } from '../../fields/MediaField.js';
+import type { Alignment } from '../../fields/AlignmentField.js';
 export interface CardProps {
     image: MediaReference | null;
     heading: string;

package/dist/components/interactive/Card.server.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.server.d.ts","sourceRoot":"","sources":["../../../src/components/interactive/Card.server.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AACvD,OAAO,EASL,KAAK,YAAY,EACjB,KAAK,eAAe,EACpB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,qBAAqB,CAAA;AAE5B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AAC7D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAA;AAY5D,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,cAAc,GAAG,IAAI,CAAA;IAC5B,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,YAAY,EAAE,OAAO,CAAA;IACrB,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,YAAY,GAAG,IAAI,CAAA;IAC3B,UAAU,EAAE,eAAe,GAAG,IAAI,CAAA;IAClC,MAAM,EAAE,WAAW,GAAG,IAAI,CAAA;IAC1B,UAAU,EAAE,eAAe,GAAG,IAAI,CAAA;IAClC,SAAS,EAAE,SAAS,GAAG,IAAI,CAAA;IAC3B,SAAS,EAAE,cAAc,GAAG,IAAI,CAAA;IAChC,SAAS,EAAE,cAAc,GAAG,IAAI,CAAA;IAChC,cAAc,EAAE,YAAY,GAAG,IAAI,CAAA;CACpC;AAmBD,eAAO,MAAM,UAAU,EAAE,eAAe,CAAC,SAAS,CA8GjD,CAAA"}
+{"version":3,"file":"Card.server.d.ts","sourceRoot":"","sources":["../../../src/components/interactive/Card.server.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AACvD,OAAO,EASL,KAAK,YAAY,EACjB,KAAK,eAAe,EACpB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,wBAAwB,CAAA;AAE/B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAChE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAA;AAY/D,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,cAAc,GAAG,IAAI,CAAA;IAC5B,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,YAAY,EAAE,OAAO,CAAA;IACrB,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,YAAY,GAAG,IAAI,CAAA;IAC3B,UAAU,EAAE,eAAe,GAAG,IAAI,CAAA;IAClC,MAAM,EAAE,WAAW,GAAG,IAAI,CAAA;IAC1B,UAAU,EAAE,eAAe,GAAG,IAAI,CAAA;IAClC,SAAS,EAAE,SAAS,GAAG,IAAI,CAAA;IAC3B,SAAS,EAAE,cAAc,GAAG,IAAI,CAAA;IAChC,SAAS,EAAE,cAAc,GAAG,IAAI,CAAA;IAChC,cAAc,EAAE,YAAY,GAAG,IAAI,CAAA;CACpC;AAmBD,eAAO,MAAM,UAAU,EAAE,eAAe,CAAC,SAAS,CA8GjD,CAAA"}

package/dist/components/interactive/Card.server.js

@@ -1,6 +1,12 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { shadowMap, cn, marginValueToCSS, paddingValueToCSS, backgroundValueToCSS, borderValueToCSS, dimensionsValueToCSS, transformValueToCSS, } from '../../fields/shared';
-import { AnimatedWrapper } from '../AnimatedWrapper';
+/**
+ * Card Component - Server-safe Puck Configuration
+ *
+ * Content card with image, heading, and text.
+ * This version contains only the render function and types - no fields.
+ * Safe for use in server components.
+ */ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { shadowMap, cn, marginValueToCSS, paddingValueToCSS, backgroundValueToCSS, borderValueToCSS, dimensionsValueToCSS, transformValueToCSS } from '../../fields/shared.js';
+import { AnimatedWrapper } from '../AnimatedWrapper.js';
 // Default content padding for card (replaces hardcoded p-4)
 const DEFAULT_CONTENT_PADDING = {
     top: 16,
@@ -8,7 +14,7 @@ const DEFAULT_CONTENT_PADDING = {
     bottom: 16,
     left: 16,
     unit: 'px',
-    linked: true,
+    linked: true
 };
 const defaultProps = {
     image: null,
@@ -24,12 +30,12 @@ const defaultProps = {
     alignment: null,
     transform: null,
     animation: null,
-    contentPadding: DEFAULT_CONTENT_PADDING, // Default 16px padding
+    contentPadding: DEFAULT_CONTENT_PADDING
 };
 export const CardConfig = {
     label: 'Card',
     defaultProps,
-    render: ({ image, heading, text, link, openInNewTab, shadow, background, dimensions, alignment, margin, border, transform, animation, contentPadding }) => {
+    render: ({ image, heading, text, link, openInNewTab, shadow, background, dimensions, alignment, margin, border, transform, animation, contentPadding })=>{
         // Check if border has radius, if so don't apply rounded-lg
         const hasBorderRadius = border?.radius && border.radius > 0;
         const cardClasses = cn('overflow-hidden transition-all bg-card', !hasBorderRadius && 'rounded-lg', shadowMap[shadow] || '', link && 'hover:shadow-lg cursor-pointer');
@@ -53,7 +59,7 @@ export const CardConfig = {
         // Card background styles from BackgroundValue
         const backgroundStyles = backgroundValueToCSS(background);
         const cardStyle = {
-            ...backgroundStyles,
+            ...backgroundStyles
         };
         // Note: bg-card class handles default background (theme-aware)
         // Apply border to card
@@ -67,11 +73,66 @@ export const CardConfig = {
         if (contentPaddingCSS) {
             contentStyle.padding = contentPaddingCSS;
         }
-        const cardContent = (_jsxs("div", { className: cardClasses, style: cardStyle, children: [image?.url ? (_jsx("div", { className: "relative aspect-video w-full overflow-hidden", children: _jsx("img", { src: image.url, alt: image.alt || heading || '', className: "w-full h-full object-cover" }) })) : (_jsx("div", { className: "aspect-video w-full bg-muted flex items-center justify-center", children: _jsx("span", { className: "text-muted-foreground", children: "No image" }) })), _jsxs("div", { style: contentStyle, children: [heading && (_jsx("h3", { className: "text-lg font-semibold text-foreground mb-2", children: heading })), text && _jsx("p", { className: "text-muted-foreground text-sm", children: text })] })] }));
+        const cardContent = /*#__PURE__*/ _jsxs("div", {
+            className: cardClasses,
+            style: cardStyle,
+            children: [
+                image?.url ? /*#__PURE__*/ _jsx("div", {
+                    className: "relative aspect-video w-full overflow-hidden",
+                    children: /*#__PURE__*/ _jsx("img", {
+                        src: image.url,
+                        alt: image.alt || heading || '',
+                        className: "w-full h-full object-cover"
+                    })
+                }) : /*#__PURE__*/ _jsx("div", {
+                    className: "aspect-video w-full bg-muted flex items-center justify-center",
+                    children: /*#__PURE__*/ _jsx("span", {
+                        className: "text-muted-foreground",
+                        children: "No image"
+                    })
+                }),
+                /*#__PURE__*/ _jsxs("div", {
+                    style: contentStyle,
+                    children: [
+                        heading && /*#__PURE__*/ _jsx("h3", {
+                            className: "text-lg font-semibold text-foreground mb-2",
+                            children: heading
+                        }),
+                        text && /*#__PURE__*/ _jsx("p", {
+                            className: "text-muted-foreground text-sm",
+                            children: text
+                        })
+                    ]
+                })
+            ]
+        });
         if (link) {
-            return (_jsx(AnimatedWrapper, { animation: animation, children: _jsx("div", { className: alignmentClasses, children: _jsx("a", { href: link, target: openInNewTab ? '_blank' : undefined, rel: openInNewTab ? 'noopener noreferrer' : undefined, className: "block", style: wrapperStyle, children: cardContent }) }) }));
+            return /*#__PURE__*/ _jsx(AnimatedWrapper, {
+                animation: animation,
+                children: /*#__PURE__*/ _jsx("div", {
+                    className: alignmentClasses,
+                    children: /*#__PURE__*/ _jsx("a", {
+                        href: link,
+                        target: openInNewTab ? '_blank' : undefined,
+                        rel: openInNewTab ? 'noopener noreferrer' : undefined,
+                        className: "block",
+                        style: wrapperStyle,
+                        children: cardContent
+                    })
+                })
+            });
         }
-        return (_jsx(AnimatedWrapper, { animation: animation, children: _jsx("div", { className: alignmentClasses, children: _jsx("div", { style: wrapperStyle, children: cardContent }) }) }));
-    },
+        return /*#__PURE__*/ _jsx(AnimatedWrapper, {
+            animation: animation,
+            children: /*#__PURE__*/ _jsx("div", {
+                className: alignmentClasses,
+                children: /*#__PURE__*/ _jsx("div", {
+                    style: wrapperStyle,
+                    children: cardContent
+                })
+            })
+        });
+    }
 };
+
 //# sourceMappingURL=Card.server.js.map

package/dist/components/interactive/Card.server.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.server.js","sourceRoot":"","sources":["../../../src/components/interactive/Card.server.tsx"],"names":[],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/interactive/Card.server.tsx"],"sourcesContent":["/**\n * Card Component - Server-safe Puck Configuration\n *\n * Content card with image, heading, and text.\n * This version contains only the render function and types - no fields.\n * Safe for use in server components.\n */\n\nimport type { ComponentConfig } from '@puckeditor/core'\nimport {\n  shadowMap,\n  cn,\n  marginValueToCSS,\n  paddingValueToCSS,\n  backgroundValueToCSS,\n  borderValueToCSS,\n  dimensionsValueToCSS,\n  transformValueToCSS,\n  type PaddingValue,\n  type BackgroundValue,\n  type BorderValue,\n  type DimensionsValue,\n  type AnimationValue,\n  type TransformValue,\n} from '../../fields/shared.js'\nimport { AnimatedWrapper } from '../AnimatedWrapper.js'\nimport type { MediaReference } from '../../fields/MediaField.js'\nimport type { Alignment } from '../../fields/AlignmentField.js'\n\n// Default content padding for card (replaces hardcoded p-4)\nconst DEFAULT_CONTENT_PADDING: PaddingValue = {\n  top: 16,\n  right: 16,\n  bottom: 16,\n  left: 16,\n  unit: 'px',\n  linked: true,\n}\n\nexport interface CardProps {\n  image: MediaReference | null\n  heading: string\n  text: string\n  link: string\n  openInNewTab: boolean\n  shadow: string\n  margin: PaddingValue | null\n  background: BackgroundValue | null\n  border: BorderValue | null\n  dimensions: DimensionsValue | null\n  alignment: Alignment | null\n  transform: TransformValue | null\n  animation: AnimationValue | null\n  contentPadding: PaddingValue | null\n}\n\nconst defaultProps: CardProps = {\n  image: null,\n  heading: 'Card Heading',\n  text: 'Card description text goes here.',\n  link: '',\n  openInNewTab: false,\n  shadow: 'md',\n  margin: null,\n  background: null,\n  border: null,\n  dimensions: null,\n  alignment: null,\n  transform: null,\n  animation: null,\n  contentPadding: DEFAULT_CONTENT_PADDING, // Default 16px padding\n}\n\nexport const CardConfig: ComponentConfig<CardProps> = {\n  label: 'Card',\n  defaultProps,\n  render: ({ image, heading, text, link, openInNewTab, shadow, background, dimensions, alignment, margin, border, transform, animation, contentPadding }) => {\n    // Check if border has radius, if so don't apply rounded-lg\n    const hasBorderRadius = border?.radius && border.radius > 0\n    const cardClasses = cn(\n      'overflow-hidden transition-all bg-card',\n      !hasBorderRadius && 'rounded-lg',\n      shadowMap[shadow] || '',\n      link && 'hover:shadow-lg cursor-pointer'\n    )\n\n    // Wrapper style for margin, dimensions, alignment, transform, animation\n    const wrapperStyle: React.CSSProperties = {}\n    const marginCSS = marginValueToCSS(margin)\n    if (marginCSS) {\n      wrapperStyle.margin = marginCSS\n    }\n    const dimensionsStyles = dimensionsValueToCSS(dimensions)\n    if (dimensionsStyles) {\n      Object.assign(wrapperStyle, dimensionsStyles)\n    }\n    const transformStyles = transformValueToCSS(transform)\n    if (transformStyles) {\n      Object.assign(wrapperStyle, transformStyles)\n    }\n\n    // Alignment classes for wrapper\n    const alignmentValue = alignment ?? 'left'\n    const alignmentClasses = cn(\n      'flex',\n      alignmentValue === 'left' && 'justify-start',\n      alignmentValue === 'center' && 'justify-center',\n      alignmentValue === 'right' && 'justify-end'\n    )\n\n    // Card background styles from BackgroundValue\n    const backgroundStyles = backgroundValueToCSS(background)\n    const cardStyle: React.CSSProperties = {\n      ...backgroundStyles,\n    }\n    // Note: bg-card class handles default background (theme-aware)\n    // Apply border to card\n    const borderStyles = borderValueToCSS(border)\n    if (borderStyles) {\n      Object.assign(cardStyle, borderStyles)\n    }\n\n    // Content section style with configurable padding\n    const contentStyle: React.CSSProperties = {}\n    const contentPaddingCSS = paddingValueToCSS(contentPadding)\n    if (contentPaddingCSS) {\n      contentStyle.padding = contentPaddingCSS\n    }\n\n    const cardContent = (\n      <div className={cardClasses} style={cardStyle}>\n        {/* Image */}\n        {image?.url ? (\n          <div className=\"relative aspect-video w-full overflow-hidden\">\n            {/* eslint-disable-next-line @next/next/no-img-element */}\n            <img\n              src={image.url}\n              alt={image.alt || heading || ''}\n              className=\"w-full h-full object-cover\"\n            />\n          </div>\n        ) : (\n          <div className=\"aspect-video w-full bg-muted flex items-center justify-center\">\n            <span className=\"text-muted-foreground\">No image</span>\n          </div>\n        )}\n\n        {/* Content */}\n        <div style={contentStyle}>\n          {heading && (\n            <h3 className=\"text-lg font-semibold text-foreground mb-2\">{heading}</h3>\n          )}\n          {text && <p className=\"text-muted-foreground text-sm\">{text}</p>}\n        </div>\n      </div>\n    )\n\n    if (link) {\n      return (\n        <AnimatedWrapper animation={animation}>\n          <div className={alignmentClasses}>\n            <a\n              href={link}\n              target={openInNewTab ? '_blank' : undefined}\n              rel={openInNewTab ? 'noopener noreferrer' : undefined}\n              className=\"block\"\n              style={wrapperStyle}\n            >\n              {cardContent}\n            </a>\n          </div>\n        </AnimatedWrapper>\n      )\n    }\n\n    return (\n      <AnimatedWrapper animation={animation}>\n        <div className={alignmentClasses}>\n          <div style={wrapperStyle}>{cardContent}</div>\n        </div>\n      </AnimatedWrapper>\n    )\n  },\n}\n"],"names":["shadowMap","cn","marginValueToCSS","paddingValueToCSS","backgroundValueToCSS","borderValueToCSS","dimensionsValueToCSS","transformValueToCSS","AnimatedWrapper","DEFAULT_CONTENT_PADDING","top","right","bottom","left","unit","linked","defaultProps","image","heading","text","link","openInNewTab","shadow","margin","background","border","dimensions","alignment","transform","animation","contentPadding","CardConfig","label","render","hasBorderRadius","radius","cardClasses","wrapperStyle","marginCSS","dimensionsStyles","Object","assign","transformStyles","alignmentValue","alignmentClasses","backgroundStyles","cardStyle","borderStyles","contentStyle","contentPaddingCSS","padding","cardContent","div","className","style","url","img","src","alt","span","h3","p","a","href","target","undefined","rel"],"mappings":"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"}

package/dist/components/interactive/Divider.d.ts

@@ -4,7 +4,7 @@
  * Horizontal line separator with customizable style.
  */
 import type { ComponentConfig } from '@puckeditor/core';
-import { type PaddingValue, type ColorValue, type DimensionsValue, type AnimationValue, type TransformValue } from '../../fields/shared';
+import { type PaddingValue, type ColorValue, type DimensionsValue, type AnimationValue, type TransformValue } from '../../fields/shared.js';
 export interface DividerProps {
     style: string;
     color: ColorValue | null;

package/dist/components/interactive/Divider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Divider.d.ts","sourceRoot":"","sources":["../../../src/components/interactive/Divider.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AACvD,OAAO,EASL,KAAK,YAAY,EACjB,KAAK,UAAU,EACf,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,qBAAqB,CAAA;AAoB5B,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;IACxB,MAAM,EAAE,YAAY,GAAG,IAAI,CAAA;IAC3B,UAAU,EAAE,eAAe,GAAG,IAAI,CAAA;IAClC,SAAS,EAAE,cAAc,GAAG,IAAI,CAAA;IAChC,SAAS,EAAE,cAAc,GAAG,IAAI,CAAA;IAChC,aAAa,EAAE,YAAY,GAAG,IAAI,CAAA;CACnC;AAYD,eAAO,MAAM,aAAa,EAAE,eAqD3B,CAAA"}
+{"version":3,"file":"Divider.d.ts","sourceRoot":"","sources":["../../../src/components/interactive/Divider.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AACvD,OAAO,EASL,KAAK,YAAY,EACjB,KAAK,UAAU,EACf,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,wBAAwB,CAAA;AAoB/B,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;IACxB,MAAM,EAAE,YAAY,GAAG,IAAI,CAAA;IAC3B,UAAU,EAAE,eAAe,GAAG,IAAI,CAAA;IAClC,SAAS,EAAE,cAAc,GAAG,IAAI,CAAA;IAChC,SAAS,EAAE,cAAc,GAAG,IAAI,CAAA;IAChC,aAAa,EAAE,YAAY,GAAG,IAAI,CAAA;CACnC;AAYD,eAAO,MAAM,aAAa,EAAE,eAqD3B,CAAA"}

package/dist/components/interactive/Divider.js

@@ -1,13 +1,17 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { dividerStyleField, dividerStyleMap, cn, marginValueToCSS, paddingValueToCSS, colorValueToCSS, dimensionsValueToCSS, transformValueToCSS, } from '../../fields/shared';
-import { AnimatedWrapper } from '../AnimatedWrapper';
-import { createMarginField } from '../../fields/MarginField';
-import { createPaddingField } from '../../fields/PaddingField';
-import { createColorPickerField } from '../../fields/ColorPickerField';
-import { createDimensionsField } from '../../fields/DimensionsField';
-import { createAnimationField } from '../../fields/AnimationField';
-import { createTransformField } from '../../fields/TransformField';
-import { createResetField } from '../../fields/ResetField';
+/**
+ * Divider Component - Puck Configuration
+ *
+ * Horizontal line separator with customizable style.
+ */ import { jsx as _jsx } from "react/jsx-runtime";
+import { dividerStyleField, dividerStyleMap, cn, marginValueToCSS, paddingValueToCSS, colorValueToCSS, dimensionsValueToCSS, transformValueToCSS } from '../../fields/shared.js';
+import { AnimatedWrapper } from '../AnimatedWrapper.js';
+import { createMarginField } from '../../fields/MarginField.js';
+import { createPaddingField } from '../../fields/PaddingField.js';
+import { createColorPickerField } from '../../fields/ColorPickerField.js';
+import { createDimensionsField } from '../../fields/DimensionsField.js';
+import { createAnimationField } from '../../fields/AnimationField.js';
+import { createTransformField } from '../../fields/TransformField.js';
+import { createResetField } from '../../fields/ResetField.js';
 // Default padding with standard horizontal spacing (replaces hardcoded px-4)
 const DEFAULT_PADDING = {
     top: 0,
@@ -15,7 +19,7 @@ const DEFAULT_PADDING = {
     bottom: 0,
     left: 16,
     unit: 'px',
-    linked: false,
+    linked: false
 };
 const defaultProps = {
     style: 'solid',
@@ -24,26 +28,40 @@ const defaultProps = {
     dimensions: null,
     transform: null,
     animation: null,
-    customPadding: DEFAULT_PADDING, // Default 16px horizontal padding, visible in editor
+    customPadding: DEFAULT_PADDING
 };
 export const DividerConfig = {
     label: 'Divider',
     fields: {
-        _reset: createResetField({ defaultProps }),
+        _reset: createResetField({
+            defaultProps
+        }),
         style: dividerStyleField,
-        color: createColorPickerField({ label: 'Color' }),
-        dimensions: createDimensionsField({ label: 'Dimensions' }),
-        transform: createTransformField({ label: 'Transform' }),
-        animation: createAnimationField({ label: 'Animation' }),
+        color: createColorPickerField({
+            label: 'Color'
+        }),
+        dimensions: createDimensionsField({
+            label: 'Dimensions'
+        }),
+        transform: createTransformField({
+            label: 'Transform'
+        }),
+        animation: createAnimationField({
+            label: 'Animation'
+        }),
         // Spacing (grouped at bottom)
-        margin: createMarginField({ label: 'Margin' }),
-        customPadding: createPaddingField({ label: 'Padding' }),
+        margin: createMarginField({
+            label: 'Margin'
+        }),
+        customPadding: createPaddingField({
+            label: 'Padding'
+        })
     },
     defaultProps,
-    render: ({ style, color, dimensions, margin, transform, animation, customPadding }) => {
+    render: ({ style, color, dimensions, margin, transform, animation, customPadding })=>{
         const dimensionsStyles = dimensionsValueToCSS(dimensions);
         const wrapperStyle = {
-            ...dimensionsStyles,
+            ...dimensionsStyles
         };
         const marginCSS = marginValueToCSS(margin);
         if (marginCSS) {
@@ -59,10 +77,20 @@ export const DividerConfig = {
         }
         // Only set color if explicitly provided, otherwise use CSS variable
         const customColor = colorValueToCSS(color);
-        const hrStyle = customColor
-            ? { borderColor: customColor }
-            : undefined;
-        return (_jsx(AnimatedWrapper, { animation: animation, children: _jsx("div", { style: Object.keys(wrapperStyle).length > 0 ? wrapperStyle : undefined, children: _jsx("hr", { className: cn('border-t border-border', dividerStyleMap[style] || dividerStyleMap.solid), style: hrStyle }) }) }));
-    },
+        const hrStyle = customColor ? {
+            borderColor: customColor
+        } : undefined;
+        return /*#__PURE__*/ _jsx(AnimatedWrapper, {
+            animation: animation,
+            children: /*#__PURE__*/ _jsx("div", {
+                style: Object.keys(wrapperStyle).length > 0 ? wrapperStyle : undefined,
+                children: /*#__PURE__*/ _jsx("hr", {
+                    className: cn('border-t border-border', dividerStyleMap[style] || dividerStyleMap.solid),
+                    style: hrStyle
+                })
+            })
+        });
+    }
 };
+
 //# sourceMappingURL=Divider.js.map