@delmaredigital/payload-puck 0.6.12 → 0.6.13

package/dist/fields/BorderField.js

@@ -9,33 +9,47 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * - Border radius input
  * - Border style selector (solid, dashed, dotted, none)
  * - Per-side toggles (top, right, bottom, left)
- */
-import { useCallback, memo } from 'react';
-import { X, ArrowUp, ArrowRight, ArrowDown, ArrowLeft, } from 'lucide-react';
-import { ColorPickerField } from './ColorPickerField';
+ */ import React, { useCallback, memo } from 'react';
+import { X, ArrowUp, ArrowRight, ArrowDown, ArrowLeft } from 'lucide-react';
+import { ColorPickerField } from './ColorPickerField.js';
 // =============================================================================
 // Default Value
 // =============================================================================
 const DEFAULT_VALUE = {
     width: 1,
-    color: { hex: '#e5e7eb', opacity: 100 }, // gray-200
+    color: {
+        hex: '#e5e7eb',
+        opacity: 100
+    },
     radius: 0,
     style: 'solid',
     sides: {
         top: true,
         right: true,
         bottom: true,
-        left: true,
-    },
+        left: true
+    }
 };
 // =============================================================================
 // Border Style Options
 // =============================================================================
 const BORDER_STYLES = [
-    { value: 'solid', label: 'Solid' },
-    { value: 'dashed', label: 'Dashed' },
-    { value: 'dotted', label: 'Dotted' },
-    { value: 'none', label: 'None' },
+    {
+        value: 'solid',
+        label: 'Solid'
+    },
+    {
+        value: 'dashed',
+        label: 'Dashed'
+    },
+    {
+        value: 'dotted',
+        label: 'Dotted'
+    },
+    {
+        value: 'none',
+        label: 'None'
+    }
 ];
 // =============================================================================
 // Styles
@@ -44,17 +58,17 @@ const styles = {
     container: {
         display: 'flex',
         flexDirection: 'column',
-        gap: '16px',
+        gap: '16px'
     },
     header: {
         display: 'flex',
         alignItems: 'center',
-        justifyContent: 'space-between',
+        justifyContent: 'space-between'
     },
     label: {
         fontSize: '14px',
         fontWeight: 500,
-        color: 'var(--theme-elevation-800)',
+        color: 'var(--theme-elevation-800)'
     },
     clearButton: {
         display: 'flex',
@@ -67,7 +81,7 @@ const styles = {
         borderRadius: '4px',
         backgroundColor: 'transparent',
         color: 'var(--theme-elevation-500)',
-        cursor: 'pointer',
+        cursor: 'pointer'
     },
     preview: {
         height: '64px',
@@ -75,25 +89,25 @@ const styles = {
         borderRadius: '6px',
         display: 'flex',
         alignItems: 'center',
-        justifyContent: 'center',
+        justifyContent: 'center'
     },
     previewText: {
         fontSize: '12px',
-        color: 'var(--theme-elevation-500)',
+        color: 'var(--theme-elevation-500)'
     },
     grid: {
         display: 'grid',
         gridTemplateColumns: '1fr 1fr',
-        gap: '12px',
+        gap: '12px'
     },
     inputGroup: {
         display: 'flex',
         flexDirection: 'column',
-        gap: '4px',
+        gap: '4px'
     },
     inputLabel: {
         fontSize: '12px',
-        color: 'var(--theme-elevation-500)',
+        color: 'var(--theme-elevation-500)'
     },
     input: {
         height: '32px',
@@ -103,7 +117,7 @@ const styles = {
         border: '1px solid var(--theme-elevation-150)',
         borderRadius: '4px',
         backgroundColor: 'var(--theme-input-bg)',
-        color: 'var(--theme-elevation-800)',
+        color: 'var(--theme-elevation-800)'
     },
     select: {
         height: '32px',
@@ -113,23 +127,23 @@ const styles = {
         borderRadius: '4px',
         backgroundColor: 'var(--theme-input-bg)',
         color: 'var(--theme-elevation-800)',
-        cursor: 'pointer',
+        cursor: 'pointer'
     },
     sidesSection: {
         display: 'flex',
         flexDirection: 'column',
-        gap: '8px',
+        gap: '8px'
     },
     sidesLabel: {
         fontSize: '12px',
-        color: 'var(--theme-elevation-500)',
+        color: 'var(--theme-elevation-500)'
     },
     sidesButtons: {
         display: 'flex',
         alignItems: 'center',
         justifyContent: 'center',
         flexWrap: 'wrap',
-        gap: '8px',
+        gap: '8px'
     },
     sideButton: {
         display: 'flex',
@@ -142,7 +156,7 @@ const styles = {
         borderRadius: '4px',
         backgroundColor: 'var(--theme-bg)',
         color: 'var(--theme-elevation-700)',
-        cursor: 'pointer',
+        cursor: 'pointer'
     },
     sideButtonActive: {
         display: 'flex',
@@ -155,76 +169,135 @@ const styles = {
         borderRadius: '4px',
         backgroundColor: 'var(--theme-elevation-800)',
         color: 'var(--theme-bg)',
-        cursor: 'pointer',
+        cursor: 'pointer'
     },
     sidesInfo: {
         fontSize: '10px',
         color: 'var(--theme-elevation-500)',
-        textAlign: 'center',
-    },
+        textAlign: 'center'
+    }
 };
 // =============================================================================
 // BorderField Component
 // =============================================================================
-function BorderFieldInner({ value, onChange, label, readOnly, }) {
+function BorderFieldInner({ value, onChange, label, readOnly }) {
     // Use default if no value
     const currentValue = value || DEFAULT_VALUE;
     // Handle width change
-    const handleWidthChange = useCallback((e) => {
+    const handleWidthChange = useCallback((e)=>{
         const newWidth = parseInt(e.target.value, 10) || 0;
         onChange({
             ...currentValue,
-            width: Math.max(0, newWidth),
+            width: Math.max(0, newWidth)
         });
-    }, [currentValue, onChange]);
+    }, [
+        currentValue,
+        onChange
+    ]);
     // Handle color change
-    const handleColorChange = useCallback((newColor) => {
+    const handleColorChange = useCallback((newColor)=>{
         onChange({
             ...currentValue,
-            color: newColor || { hex: '#000000', opacity: 100 },
+            color: newColor || {
+                hex: '#000000',
+                opacity: 100
+            }
         });
-    }, [currentValue, onChange]);
+    }, [
+        currentValue,
+        onChange
+    ]);
     // Handle radius change
-    const handleRadiusChange = useCallback((e) => {
+    const handleRadiusChange = useCallback((e)=>{
         const newRadius = parseInt(e.target.value, 10) || 0;
         onChange({
             ...currentValue,
-            radius: Math.max(0, newRadius),
+            radius: Math.max(0, newRadius)
         });
-    }, [currentValue, onChange]);
+    }, [
+        currentValue,
+        onChange
+    ]);
     // Handle style change
-    const handleStyleChange = useCallback((e) => {
+    const handleStyleChange = useCallback((e)=>{
         onChange({
             ...currentValue,
-            style: e.target.value,
+            style: e.target.value
         });
-    }, [currentValue, onChange]);
+    }, [
+        currentValue,
+        onChange
+    ]);
     // Handle side toggle
-    const handleSideToggle = useCallback((side) => {
+    const handleSideToggle = useCallback((side)=>{
         onChange({
             ...currentValue,
             sides: {
                 ...currentValue.sides,
-                [side]: !currentValue.sides[side],
-            },
+                [side]: !currentValue.sides[side]
+            }
         });
-    }, [currentValue, onChange]);
+    }, [
+        currentValue,
+        onChange
+    ]);
     // Handle clear
-    const handleClear = useCallback(() => {
+    const handleClear = useCallback(()=>{
         onChange(null);
-    }, [onChange]);
+    }, [
+        onChange
+    ]);
     // Check if all sides are enabled
-    const allSidesEnabled = currentValue.sides.top &&
-        currentValue.sides.right &&
-        currentValue.sides.bottom &&
-        currentValue.sides.left;
+    const allSidesEnabled = currentValue.sides.top && currentValue.sides.right && currentValue.sides.bottom && currentValue.sides.left;
     const sideConfig = [
-        { side: 'top', icon: ArrowUp, title: 'Top border' },
-        { side: 'right', icon: ArrowRight, title: 'Right border' },
-        { side: 'bottom', icon: ArrowDown, title: 'Bottom border' },
-        { side: 'left', icon: ArrowLeft, title: 'Left border' },
+        {
+            side: 'top',
+            icon: ArrowUp,
+            title: 'Top border'
+        },
+        {
+            side: 'right',
+            icon: ArrowRight,
+            title: 'Right border'
+        },
+        {
+            side: 'bottom',
+            icon: ArrowDown,
+            title: 'Bottom border'
+        },
+        {
+            side: 'left',
+            icon: ArrowLeft,
+            title: 'Left border'
+        }
     ];
-    return (_jsxs("div", { className: "puck-field", style: styles.container, children: [_jsxs("div", { style: styles.header, children: [label && (_jsx("label", { style: styles.label, children: label })), value && !readOnly && (_jsx("button", { type: "button", onClick: handleClear, style: styles.clearButton, title: "Clear border", children: _jsx(X, { style: { width: '16px', height: '16px' } }) }))] }), _jsx("div", { style: {
+    return /*#__PURE__*/ _jsxs("div", {
+        className: "puck-field",
+        style: styles.container,
+        children: [
+            /*#__PURE__*/ _jsxs("div", {
+                style: styles.header,
+                children: [
+                    label && /*#__PURE__*/ _jsx("label", {
+                        style: styles.label,
+                        children: label
+                    }),
+                    value && !readOnly && /*#__PURE__*/ _jsx("button", {
+                        type: "button",
+                        onClick: handleClear,
+                        style: styles.clearButton,
+                        title: "Clear border",
+                        children: /*#__PURE__*/ _jsx(X, {
+                            style: {
+                                width: '16px',
+                                height: '16px'
+                            }
+                        })
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsx("div", {
+                style: {
                     ...styles.preview,
                     borderWidth: currentValue.style !== 'none' ? `${currentValue.width}px` : 0,
                     borderStyle: currentValue.style,
@@ -234,32 +307,161 @@ function BorderFieldInner({ value, onChange, label, readOnly, }) {
                     borderRightWidth: currentValue.sides.right && currentValue.style !== 'none' ? `${currentValue.width}px` : 0,
                     borderBottomWidth: currentValue.sides.bottom && currentValue.style !== 'none' ? `${currentValue.width}px` : 0,
                     borderLeftWidth: currentValue.sides.left && currentValue.style !== 'none' ? `${currentValue.width}px` : 0,
-                    opacity: (currentValue.color?.opacity ?? 100) / 100,
-                }, children: _jsx("span", { style: styles.previewText, children: "Preview" }) }), _jsxs("div", { style: styles.grid, children: [_jsxs("div", { style: styles.inputGroup, children: [_jsx("label", { style: styles.inputLabel, children: "Width (px)" }), _jsx("input", { type: "number", min: 0, max: 20, value: currentValue.width, onChange: handleWidthChange, disabled: readOnly, style: styles.input })] }), _jsxs("div", { style: styles.inputGroup, children: [_jsx("label", { style: styles.inputLabel, children: "Style" }), _jsx("select", { value: currentValue.style, onChange: handleStyleChange, disabled: readOnly, style: styles.select, children: BORDER_STYLES.map((style) => (_jsx("option", { value: style.value, children: style.label }, style.value))) })] })] }), _jsxs("div", { style: styles.inputGroup, children: [_jsx("label", { style: styles.inputLabel, children: "Radius (px)" }), _jsx("input", { type: "number", min: 0, max: 100, value: currentValue.radius, onChange: handleRadiusChange, disabled: readOnly, style: styles.input })] }), _jsx(ColorPickerField, { value: currentValue.color, onChange: handleColorChange, label: "Color", readOnly: readOnly, showOpacity: true, presets: [
-                    { hex: '#000000', label: 'Black' },
-                    { hex: '#374151', label: 'Gray 700' },
-                    { hex: '#6b7280', label: 'Gray 500' },
-                    { hex: '#d1d5db', label: 'Gray 300' },
-                    { hex: '#e5e7eb', label: 'Gray 200' },
-                    { hex: '#3b82f6', label: 'Blue' },
-                    { hex: '#ef4444', label: 'Red' },
-                ] }), !readOnly && (_jsxs("div", { style: styles.sidesSection, children: [_jsx("label", { style: styles.sidesLabel, children: "Sides" }), _jsx("div", { style: styles.sidesButtons, children: sideConfig.map(({ side, icon: Icon, title }) => {
+                    opacity: (currentValue.color?.opacity ?? 100) / 100
+                },
+                children: /*#__PURE__*/ _jsx("span", {
+                    style: styles.previewText,
+                    children: "Preview"
+                })
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                style: styles.grid,
+                children: [
+                    /*#__PURE__*/ _jsxs("div", {
+                        style: styles.inputGroup,
+                        children: [
+                            /*#__PURE__*/ _jsx("label", {
+                                style: styles.inputLabel,
+                                children: "Width (px)"
+                            }),
+                            /*#__PURE__*/ _jsx("input", {
+                                type: "number",
+                                min: 0,
+                                max: 20,
+                                value: currentValue.width,
+                                onChange: handleWidthChange,
+                                disabled: readOnly,
+                                style: styles.input
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs("div", {
+                        style: styles.inputGroup,
+                        children: [
+                            /*#__PURE__*/ _jsx("label", {
+                                style: styles.inputLabel,
+                                children: "Style"
+                            }),
+                            /*#__PURE__*/ _jsx("select", {
+                                value: currentValue.style,
+                                onChange: handleStyleChange,
+                                disabled: readOnly,
+                                style: styles.select,
+                                children: BORDER_STYLES.map((style)=>/*#__PURE__*/ _jsx("option", {
+                                        value: style.value,
+                                        children: style.label
+                                    }, style.value))
+                            })
+                        ]
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                style: styles.inputGroup,
+                children: [
+                    /*#__PURE__*/ _jsx("label", {
+                        style: styles.inputLabel,
+                        children: "Radius (px)"
+                    }),
+                    /*#__PURE__*/ _jsx("input", {
+                        type: "number",
+                        min: 0,
+                        max: 100,
+                        value: currentValue.radius,
+                        onChange: handleRadiusChange,
+                        disabled: readOnly,
+                        style: styles.input
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsx(ColorPickerField, {
+                value: currentValue.color,
+                onChange: handleColorChange,
+                label: "Color",
+                readOnly: readOnly,
+                showOpacity: true,
+                presets: [
+                    {
+                        hex: '#000000',
+                        label: 'Black'
+                    },
+                    {
+                        hex: '#374151',
+                        label: 'Gray 700'
+                    },
+                    {
+                        hex: '#6b7280',
+                        label: 'Gray 500'
+                    },
+                    {
+                        hex: '#d1d5db',
+                        label: 'Gray 300'
+                    },
+                    {
+                        hex: '#e5e7eb',
+                        label: 'Gray 200'
+                    },
+                    {
+                        hex: '#3b82f6',
+                        label: 'Blue'
+                    },
+                    {
+                        hex: '#ef4444',
+                        label: 'Red'
+                    }
+                ]
+            }),
+            !readOnly && /*#__PURE__*/ _jsxs("div", {
+                style: styles.sidesSection,
+                children: [
+                    /*#__PURE__*/ _jsx("label", {
+                        style: styles.sidesLabel,
+                        children: "Sides"
+                    }),
+                    /*#__PURE__*/ _jsx("div", {
+                        style: styles.sidesButtons,
+                        children: sideConfig.map(({ side, icon: Icon, title })=>{
                             const isActive = currentValue.sides[side];
-                            return (_jsx("button", { type: "button", onClick: () => handleSideToggle(side), style: isActive ? styles.sideButtonActive : styles.sideButton, title: title, children: _jsx(Icon, { style: { width: '16px', height: '16px' } }) }, side));
-                        }) }), _jsx("p", { style: styles.sidesInfo, children: allSidesEnabled ? 'All sides' : 'Custom sides' })] }))] }));
+                            return /*#__PURE__*/ _jsx("button", {
+                                type: "button",
+                                onClick: ()=>handleSideToggle(side),
+                                style: isActive ? styles.sideButtonActive : styles.sideButton,
+                                title: title,
+                                children: /*#__PURE__*/ _jsx(Icon, {
+                                    style: {
+                                        width: '16px',
+                                        height: '16px'
+                                    }
+                                })
+                            }, side);
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx("p", {
+                        style: styles.sidesInfo,
+                        children: allSidesEnabled ? 'All sides' : 'Custom sides'
+                    })
+                ]
+            })
+        ]
+    });
 }
-export const BorderField = memo(BorderFieldInner);
+export const BorderField = /*#__PURE__*/ memo(BorderFieldInner);
 // =============================================================================
 // Field Configuration Factory
 // =============================================================================
 /**
  * Creates a Puck field configuration for border styling
- */
-export function createBorderField(config) {
+ */ export function createBorderField(config) {
     return {
         type: 'custom',
         label: config.label,
-        render: ({ value, onChange, readOnly }) => (_jsx(BorderField, { value: value, onChange: onChange, label: config.label, readOnly: readOnly })),
+        render: ({ value, onChange, readOnly })=>/*#__PURE__*/ _jsx(BorderField, {
+                value: value,
+                onChange: onChange,
+                label: config.label,
+                readOnly: readOnly
+            })
     };
 }
+
 //# sourceMappingURL=BorderField.js.map

package/dist/fields/BorderField.js.map

@@ -1 +1 @@
-{"version":3,"file":"BorderField.js","sourceRoot":"","sources":["../../src/fields/BorderField.tsx"],"names":[],"mappings":"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"}
+{"version":3,"sources":["../../src/fields/BorderField.tsx"],"sourcesContent":["'use client'\n\n/**\n * BorderField - Custom Puck field for border styling\n *\n * This component provides:\n * - Border width input (px)\n * - Border color picker (reuses ColorPickerField)\n * - Border radius input\n * - Border style selector (solid, dashed, dotted, none)\n * - Per-side toggles (top, right, bottom, left)\n */\n\nimport React, { useCallback, memo, type CSSProperties } from 'react'\nimport type { CustomField } from '@puckeditor/core'\nimport {\n  X,\n  ArrowUp,\n  ArrowRight,\n  ArrowDown,\n  ArrowLeft,\n} from 'lucide-react'\nimport { ColorPickerField } from './ColorPickerField.js'\nimport type { BorderValue, ColorValue } from './shared.js'\n\n// =============================================================================\n// Types\n// =============================================================================\n\ntype BorderStyle = 'none' | 'solid' | 'dashed' | 'dotted'\n\ninterface BorderFieldProps {\n  value: BorderValue | null\n  onChange: (value: BorderValue | null) => void\n  label?: string\n  readOnly?: boolean\n}\n\n// =============================================================================\n// Default Value\n// =============================================================================\n\nconst DEFAULT_VALUE: BorderValue = {\n  width: 1,\n  color: { hex: '#e5e7eb', opacity: 100 }, // gray-200\n  radius: 0,\n  style: 'solid',\n  sides: {\n    top: true,\n    right: true,\n    bottom: true,\n    left: true,\n  },\n}\n\n// =============================================================================\n// Border Style Options\n// =============================================================================\n\nconst BORDER_STYLES: Array<{ value: BorderStyle; label: string }> = [\n  { value: 'solid', label: 'Solid' },\n  { value: 'dashed', label: 'Dashed' },\n  { value: 'dotted', label: 'Dotted' },\n  { value: 'none', label: 'None' },\n]\n\n// =============================================================================\n// Styles\n// =============================================================================\n\nconst styles = {\n  container: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '16px',\n  } as CSSProperties,\n  header: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n  } as CSSProperties,\n  label: {\n    fontSize: '14px',\n    fontWeight: 500,\n    color: 'var(--theme-elevation-800)',\n  } as CSSProperties,\n  clearButton: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '24px',\n    height: '24px',\n    padding: 0,\n    border: 'none',\n    borderRadius: '4px',\n    backgroundColor: 'transparent',\n    color: 'var(--theme-elevation-500)',\n    cursor: 'pointer',\n  } as CSSProperties,\n  preview: {\n    height: '64px',\n    backgroundColor: 'var(--theme-elevation-50)',\n    borderRadius: '6px',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n  } as CSSProperties,\n  previewText: {\n    fontSize: '12px',\n    color: 'var(--theme-elevation-500)',\n  } as CSSProperties,\n  grid: {\n    display: 'grid',\n    gridTemplateColumns: '1fr 1fr',\n    gap: '12px',\n  } as CSSProperties,\n  inputGroup: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '4px',\n  } as CSSProperties,\n  inputLabel: {\n    fontSize: '12px',\n    color: 'var(--theme-elevation-500)',\n  } as CSSProperties,\n  input: {\n    height: '32px',\n    padding: '0 8px',\n    fontSize: '14px',\n    fontFamily: 'monospace',\n    border: '1px solid var(--theme-elevation-150)',\n    borderRadius: '4px',\n    backgroundColor: 'var(--theme-input-bg)',\n    color: 'var(--theme-elevation-800)',\n  } as CSSProperties,\n  select: {\n    height: '32px',\n    padding: '0 8px',\n    fontSize: '14px',\n    border: '1px solid var(--theme-elevation-150)',\n    borderRadius: '4px',\n    backgroundColor: 'var(--theme-input-bg)',\n    color: 'var(--theme-elevation-800)',\n    cursor: 'pointer',\n  } as CSSProperties,\n  sidesSection: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '8px',\n  } as CSSProperties,\n  sidesLabel: {\n    fontSize: '12px',\n    color: 'var(--theme-elevation-500)',\n  } as CSSProperties,\n  sidesButtons: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    flexWrap: 'wrap',\n    gap: '8px',\n  } as CSSProperties,\n  sideButton: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '32px',\n    height: '32px',\n    padding: 0,\n    border: '1px solid var(--theme-elevation-150)',\n    borderRadius: '4px',\n    backgroundColor: 'var(--theme-bg)',\n    color: 'var(--theme-elevation-700)',\n    cursor: 'pointer',\n  } as CSSProperties,\n  sideButtonActive: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '32px',\n    height: '32px',\n    padding: 0,\n    border: '1px solid var(--theme-elevation-800)',\n    borderRadius: '4px',\n    backgroundColor: 'var(--theme-elevation-800)',\n    color: 'var(--theme-bg)',\n    cursor: 'pointer',\n  } as CSSProperties,\n  sidesInfo: {\n    fontSize: '10px',\n    color: 'var(--theme-elevation-500)',\n    textAlign: 'center',\n  } as CSSProperties,\n}\n\n// =============================================================================\n// BorderField Component\n// =============================================================================\n\nfunction BorderFieldInner({\n  value,\n  onChange,\n  label,\n  readOnly,\n}: BorderFieldProps) {\n  // Use default if no value\n  const currentValue = value || DEFAULT_VALUE\n\n  // Handle width change\n  const handleWidthChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n    const newWidth = parseInt(e.target.value, 10) || 0\n    onChange({\n      ...currentValue,\n      width: Math.max(0, newWidth),\n    })\n  }, [currentValue, onChange])\n\n  // Handle color change\n  const handleColorChange = useCallback((newColor: ColorValue | null) => {\n    onChange({\n      ...currentValue,\n      color: newColor || { hex: '#000000', opacity: 100 },\n    })\n  }, [currentValue, onChange])\n\n  // Handle radius change\n  const handleRadiusChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n    const newRadius = parseInt(e.target.value, 10) || 0\n    onChange({\n      ...currentValue,\n      radius: Math.max(0, newRadius),\n    })\n  }, [currentValue, onChange])\n\n  // Handle style change\n  const handleStyleChange = useCallback((e: React.ChangeEvent<HTMLSelectElement>) => {\n    onChange({\n      ...currentValue,\n      style: e.target.value as BorderStyle,\n    })\n  }, [currentValue, onChange])\n\n  // Handle side toggle\n  const handleSideToggle = useCallback((side: 'top' | 'right' | 'bottom' | 'left') => {\n    onChange({\n      ...currentValue,\n      sides: {\n        ...currentValue.sides,\n        [side]: !currentValue.sides[side],\n      },\n    })\n  }, [currentValue, onChange])\n\n  // Handle clear\n  const handleClear = useCallback(() => {\n    onChange(null)\n  }, [onChange])\n\n  // Check if all sides are enabled\n  const allSidesEnabled = currentValue.sides.top &&\n    currentValue.sides.right &&\n    currentValue.sides.bottom &&\n    currentValue.sides.left\n\n  const sideConfig = [\n    { side: 'top' as const, icon: ArrowUp, title: 'Top border' },\n    { side: 'right' as const, icon: ArrowRight, title: 'Right border' },\n    { side: 'bottom' as const, icon: ArrowDown, title: 'Bottom border' },\n    { side: 'left' as const, icon: ArrowLeft, title: 'Left border' },\n  ]\n\n  return (\n    <div className=\"puck-field\" style={styles.container}>\n      {/* Header */}\n      <div style={styles.header}>\n        {label && (\n          <label style={styles.label}>{label}</label>\n        )}\n        {value && !readOnly && (\n          <button\n            type=\"button\"\n            onClick={handleClear}\n            style={styles.clearButton}\n            title=\"Clear border\"\n          >\n            <X style={{ width: '16px', height: '16px' }} />\n          </button>\n        )}\n      </div>\n\n      {/* Border preview */}\n      <div\n        style={{\n          ...styles.preview,\n          borderWidth: currentValue.style !== 'none' ? `${currentValue.width}px` : 0,\n          borderStyle: currentValue.style,\n          borderColor: currentValue.color?.hex || '#000000',\n          borderRadius: `${currentValue.radius}px`,\n          borderTopWidth: currentValue.sides.top && currentValue.style !== 'none' ? `${currentValue.width}px` : 0,\n          borderRightWidth: currentValue.sides.right && currentValue.style !== 'none' ? `${currentValue.width}px` : 0,\n          borderBottomWidth: currentValue.sides.bottom && currentValue.style !== 'none' ? `${currentValue.width}px` : 0,\n          borderLeftWidth: currentValue.sides.left && currentValue.style !== 'none' ? `${currentValue.width}px` : 0,\n          opacity: (currentValue.color?.opacity ?? 100) / 100,\n        }}\n      >\n        <span style={styles.previewText}>Preview</span>\n      </div>\n\n      {/* Width and Style row */}\n      <div style={styles.grid}>\n        {/* Width */}\n        <div style={styles.inputGroup as CSSProperties}>\n          <label style={styles.inputLabel}>Width (px)</label>\n          <input\n            type=\"number\"\n            min={0}\n            max={20}\n            value={currentValue.width}\n            onChange={handleWidthChange}\n            disabled={readOnly}\n            style={styles.input}\n          />\n        </div>\n\n        {/* Style */}\n        <div style={styles.inputGroup as CSSProperties}>\n          <label style={styles.inputLabel}>Style</label>\n          <select\n            value={currentValue.style}\n            onChange={handleStyleChange}\n            disabled={readOnly}\n            style={styles.select}\n          >\n            {BORDER_STYLES.map((style) => (\n              <option key={style.value} value={style.value}>\n                {style.label}\n              </option>\n            ))}\n          </select>\n        </div>\n      </div>\n\n      {/* Radius */}\n      <div style={styles.inputGroup as CSSProperties}>\n        <label style={styles.inputLabel}>Radius (px)</label>\n        <input\n          type=\"number\"\n          min={0}\n          max={100}\n          value={currentValue.radius}\n          onChange={handleRadiusChange}\n          disabled={readOnly}\n          style={styles.input}\n        />\n      </div>\n\n      {/* Color */}\n      <ColorPickerField\n        value={currentValue.color}\n        onChange={handleColorChange}\n        label=\"Color\"\n        readOnly={readOnly}\n        showOpacity={true}\n        presets={[\n          { hex: '#000000', label: 'Black' },\n          { hex: '#374151', label: 'Gray 700' },\n          { hex: '#6b7280', label: 'Gray 500' },\n          { hex: '#d1d5db', label: 'Gray 300' },\n          { hex: '#e5e7eb', label: 'Gray 200' },\n          { hex: '#3b82f6', label: 'Blue' },\n          { hex: '#ef4444', label: 'Red' },\n        ]}\n      />\n\n      {/* Per-side toggles */}\n      {!readOnly && (\n        <div style={styles.sidesSection as CSSProperties}>\n          <label style={styles.sidesLabel}>Sides</label>\n          <div style={styles.sidesButtons}>\n            {sideConfig.map(({ side, icon: Icon, title }) => {\n              const isActive = currentValue.sides[side]\n              return (\n                <button\n                  key={side}\n                  type=\"button\"\n                  onClick={() => handleSideToggle(side)}\n                  style={isActive ? styles.sideButtonActive : styles.sideButton}\n                  title={title}\n                >\n                  <Icon style={{ width: '16px', height: '16px' }} />\n                </button>\n              )\n            })}\n          </div>\n          <p style={styles.sidesInfo as CSSProperties}>\n            {allSidesEnabled ? 'All sides' : 'Custom sides'}\n          </p>\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport const BorderField = memo(BorderFieldInner)\n\n// =============================================================================\n// Field Configuration Factory\n// =============================================================================\n\n/**\n * Creates a Puck field configuration for border styling\n */\nexport function createBorderField(config: {\n  label?: string\n}): CustomField<BorderValue | null> {\n  return {\n    type: 'custom',\n    label: config.label,\n    render: ({ value, onChange, readOnly }) => (\n      <BorderField\n        value={value}\n        onChange={onChange}\n        label={config.label}\n        readOnly={readOnly}\n      />\n    ),\n  }\n}\n"],"names":["React","useCallback","memo","X","ArrowUp","ArrowRight","ArrowDown","ArrowLeft","ColorPickerField","DEFAULT_VALUE","width","color","hex","opacity","radius","style","sides","top","right","bottom","left","BORDER_STYLES","value","label","styles","container","display","flexDirection","gap","header","alignItems","justifyContent","fontSize","fontWeight","clearButton","height","padding","border","borderRadius","backgroundColor","cursor","preview","previewText","grid","gridTemplateColumns","inputGroup","inputLabel","input","fontFamily","select","sidesSection","sidesLabel","sidesButtons","flexWrap","sideButton","sideButtonActive","sidesInfo","textAlign","BorderFieldInner","onChange","readOnly","currentValue","handleWidthChange","e","newWidth","parseInt","target","Math","max","handleColorChange","newColor","handleRadiusChange","newRadius","handleStyleChange","handleSideToggle","side","handleClear","allSidesEnabled","sideConfig","icon","title","div","className","button","type","onClick","borderWidth","borderStyle","borderColor","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","span","min","disabled","map","option","showOpacity","presets","Icon","isActive","p","BorderField","createBorderField","config","render"],"mappings":"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"}

package/dist/fields/ColorPickerField.d.ts

@@ -10,7 +10,7 @@
  */
 import React from 'react';
 import type { CustomField } from '@puckeditor/core';
-import type { ColorValue } from './shared';
+import type { ColorValue } from './shared.js';
 interface ColorPickerFieldProps {
     value: ColorValue | null;
     onChange: (value: ColorValue | null) => void;
@@ -26,7 +26,7 @@ interface ColorPickerFieldProps {
  * Converts hex + opacity to rgba CSS string
  */
 export declare function colorToRgba(hex: string, opacity: number): string;
-declare function ColorPickerFieldInner({ value, onChange, label, readOnly, showOpacity, presets, }: ColorPickerFieldProps): import("react/jsx-runtime").JSX.Element;
+declare function ColorPickerFieldInner({ value, onChange, label, readOnly, showOpacity, presets, }: ColorPickerFieldProps): React.JSX.Element;
 export declare const ColorPickerField: React.MemoExoticComponent<typeof ColorPickerFieldInner>;
 /**
  * Creates a Puck field configuration for color selection

package/dist/fields/ColorPickerField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPickerField.d.ts","sourceRoot":"","sources":["../../src/fields/ColorPickerField.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,KAA0D,MAAM,OAAO,CAAA;AAC9E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAO1C,UAAU,qBAAqB;IAC7B,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,KAAK,IAAI,CAAA;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,OAAO,CAAC,EAAE,KAAK,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;CAChD;AAuBD;;GAEG;AACH,wBAAgB,WAAW,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAMhE;AAqKD,iBAAS,qBAAqB,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,WAAkB,EAClB,OAAO,GACR,EAAE,qBAAqB,2CAuLvB;AAED,eAAO,MAAM,gBAAgB,yDAA8B,CAAA;AAM3D;;GAEG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,EAAE;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,OAAO,CAAC,EAAE,KAAK,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;CAChD,GAAG,WAAW,CAAC,UAAU,GAAG,IAAI,CAAC,CAejC"}
+{"version":3,"file":"ColorPickerField.d.ts","sourceRoot":"","sources":["../../src/fields/ColorPickerField.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,KAA0D,MAAM,OAAO,CAAA;AAC9E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAO7C,UAAU,qBAAqB;IAC7B,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,KAAK,IAAI,CAAA;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,OAAO,CAAC,EAAE,KAAK,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;CAChD;AAuBD;;GAEG;AACH,wBAAgB,WAAW,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAMhE;AAqKD,iBAAS,qBAAqB,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,WAAkB,EAClB,OAAO,GACR,EAAE,qBAAqB,qBAuLvB;AAED,eAAO,MAAM,gBAAgB,yDAA8B,CAAA;AAM3D;;GAEG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,EAAE;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,OAAO,CAAC,EAAE,KAAK,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;CAChD,GAAG,WAAW,CAAC,UAAU,GAAG,IAAI,CAAC,CAejC"}