@delmaredigital/payload-puck 0.2.0 → 0.3.1

package/dist/fields/MarginField.js

@@ -0,0 +1,233 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * MarginField - Custom Puck field for component margin/spacing control
+ *
+ * Similar to PaddingField but specifically for outer margin.
+ * Provides:
+ * - 4 number inputs for top/right/bottom/left
+ * - Link/unlink toggle button (when linked, all values sync)
+ * - Unit selector (px, rem)
+ */
+import { useCallback, memo } from 'react';
+import { Link, Unlink } from 'lucide-react';
+// =============================================================================
+// Default Value
+// =============================================================================
+const DEFAULT_VALUE = {
+    top: 0,
+    right: 0,
+    bottom: 0,
+    left: 0,
+    unit: 'px',
+    linked: true,
+};
+// =============================================================================
+// Styles
+// =============================================================================
+const styles = {
+    container: {
+        display: 'flex',
+        flexDirection: 'column',
+        gap: '12px',
+    },
+    header: {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+    },
+    label: {
+        fontSize: '14px',
+        fontWeight: 500,
+        color: 'var(--theme-elevation-800)',
+    },
+    linkButton: {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        width: '28px',
+        height: '28px',
+        padding: 0,
+        border: '1px solid var(--theme-elevation-150)',
+        borderRadius: '4px',
+        backgroundColor: 'var(--theme-bg)',
+        color: 'var(--theme-elevation-500)',
+        cursor: 'pointer',
+    },
+    linkButtonActive: {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        width: '28px',
+        height: '28px',
+        padding: 0,
+        border: '1px solid var(--theme-elevation-800)',
+        borderRadius: '4px',
+        backgroundColor: 'var(--theme-elevation-800)',
+        color: 'var(--theme-bg)',
+        cursor: 'pointer',
+    },
+    grid: {
+        display: 'grid',
+        gridTemplateColumns: '1fr 1fr',
+        gap: '8px',
+        padding: '8px',
+        backgroundColor: 'var(--theme-elevation-50)',
+        borderRadius: '6px',
+    },
+    inputRow: {
+        display: 'flex',
+        alignItems: 'center',
+        gap: '8px',
+    },
+    inputLabel: {
+        fontSize: '10px',
+        textTransform: 'uppercase',
+        letterSpacing: '0.05em',
+        color: 'var(--theme-elevation-500)',
+        width: '24px',
+        textAlign: 'right',
+        flexShrink: 0,
+    },
+    input: {
+        height: '28px',
+        width: '100%',
+        padding: '0 4px',
+        textAlign: 'center',
+        fontSize: '14px',
+        fontFamily: 'monospace',
+        border: '1px solid var(--theme-elevation-150)',
+        borderRadius: '4px',
+        backgroundColor: 'var(--theme-input-bg)',
+        color: 'var(--theme-elevation-800)',
+    },
+    footer: {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        flexWrap: 'wrap',
+        gap: '8px',
+    },
+    unitGroup: {
+        display: 'flex',
+        alignItems: 'center',
+        gap: '8px',
+    },
+    unitLabel: {
+        fontSize: '12px',
+        color: 'var(--theme-elevation-500)',
+    },
+    unitButtons: {
+        display: 'flex',
+        gap: '4px',
+    },
+    unitButton: {
+        height: '28px',
+        padding: '0 10px',
+        fontSize: '12px',
+        fontFamily: 'monospace',
+        border: '1px solid var(--theme-elevation-150)',
+        borderRadius: '4px',
+        backgroundColor: 'var(--theme-bg)',
+        color: 'var(--theme-elevation-500)',
+        cursor: 'pointer',
+    },
+    unitButtonActive: {
+        height: '28px',
+        padding: '0 10px',
+        fontSize: '12px',
+        fontFamily: 'monospace',
+        border: '1px solid var(--theme-elevation-800)',
+        borderRadius: '4px',
+        backgroundColor: 'var(--theme-elevation-800)',
+        color: 'var(--theme-bg)',
+        cursor: 'pointer',
+    },
+    summary: {
+        fontSize: '12px',
+        fontFamily: 'monospace',
+        color: 'var(--theme-elevation-500)',
+    },
+};
+// =============================================================================
+// MarginField Component
+// =============================================================================
+function MarginFieldInner({ value, onChange, label, readOnly, showUnits = true, }) {
+    // Use default if no value
+    const currentValue = value || DEFAULT_VALUE;
+    // Use explicit linked state from value, default to true if not set
+    const isLinked = currentValue.linked ?? true;
+    // Handle individual side change
+    const handleSideChange = useCallback((side, newValue) => {
+        if (isLinked) {
+            // When linked, update all sides
+            onChange({
+                ...currentValue,
+                top: newValue,
+                right: newValue,
+                bottom: newValue,
+                left: newValue,
+                linked: true,
+            });
+        }
+        else {
+            // When unlinked, update only the specific side
+            onChange({
+                ...currentValue,
+                [side]: newValue,
+                linked: false,
+            });
+        }
+    }, [currentValue, onChange, isLinked]);
+    // Handle link toggle
+    const handleLinkToggle = useCallback(() => {
+        if (isLinked) {
+            // Unlinking - keep current values but mark as unlinked
+            onChange({
+                ...currentValue,
+                linked: false,
+            });
+        }
+        else {
+            // Linking - set all sides to the top value and mark as linked
+            onChange({
+                ...currentValue,
+                top: currentValue.top,
+                right: currentValue.top,
+                bottom: currentValue.top,
+                left: currentValue.top,
+                linked: true,
+            });
+        }
+    }, [currentValue, onChange, isLinked]);
+    // Handle unit change
+    const handleUnitChange = useCallback((unit) => {
+        onChange({
+            ...currentValue,
+            unit,
+        });
+    }, [currentValue, onChange]);
+    // Render a single side input - compact horizontal layout
+    const renderSideInput = (side, sideLabel) => (_jsxs("div", { style: styles.inputRow, children: [_jsx("label", { style: styles.inputLabel, children: sideLabel.charAt(0) }), _jsx("input", { type: "number", min: 0, value: currentValue[side], onChange: (e) => handleSideChange(side, parseInt(e.target.value, 10) || 0), disabled: readOnly, style: styles.input })] }));
+    return (_jsxs("div", { className: "puck-field", style: styles.container, children: [_jsxs("div", { style: styles.header, children: [label && (_jsx("label", { style: styles.label, children: label })), !readOnly && (_jsx("button", { type: "button", onClick: handleLinkToggle, style: isLinked ? styles.linkButtonActive : styles.linkButton, title: isLinked ? 'Click to unlink (set sides individually)' : 'Click to link (all sides same value)', children: isLinked ? (_jsx(Link, { style: { width: '16px', height: '16px' } })) : (_jsx(Unlink, { style: { width: '16px', height: '16px' } })) }))] }), _jsxs("div", { style: styles.grid, children: [renderSideInput('top', 'Top'), renderSideInput('right', 'Right'), renderSideInput('bottom', 'Bottom'), renderSideInput('left', 'Left')] }), showUnits && !readOnly && (_jsxs("div", { style: styles.footer, children: [_jsxs("div", { style: styles.unitGroup, children: [_jsx("label", { style: styles.unitLabel, children: "Unit:" }), _jsx("div", { style: styles.unitButtons, children: ['px', 'rem'].map((unit) => {
+                                    const isActive = currentValue.unit === unit;
+                                    return (_jsx("button", { type: "button", onClick: () => handleUnitChange(unit), style: isActive ? styles.unitButtonActive : styles.unitButton, children: unit }, unit));
+                                }) })] }), _jsx("span", { style: styles.summary, children: isLinked
+                            ? `${currentValue.top}${currentValue.unit}`
+                            : `${currentValue.top} ${currentValue.right} ${currentValue.bottom} ${currentValue.left}${currentValue.unit}` })] }))] }));
+}
+export const MarginField = memo(MarginFieldInner);
+// =============================================================================
+// Field Configuration Factory
+// =============================================================================
+/**
+ * Creates a Puck field configuration for margin/spacing
+ */
+export function createMarginField(config) {
+    return {
+        type: 'custom',
+        label: config.label,
+        render: ({ value, onChange, readOnly }) => (_jsx(MarginField, { value: value, onChange: onChange, label: config.label, readOnly: readOnly, showUnits: config.showUnits })),
+    };
+}
+//# sourceMappingURL=MarginField.js.map

package/dist/fields/MarginField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarginField.js","sourceRoot":"","sources":["../../src/fields/MarginField.tsx"],"names":[],"mappings":"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"}

package/dist/fields/MediaField.d.ts

@@ -0,0 +1,33 @@
+/**
+ * MediaField - Custom Puck field for selecting Payload CMS media
+ *
+ * This component provides a media picker that integrates with Payload's
+ * media collection, allowing users to browse and select images.
+ */
+import React from 'react';
+import type { CustomField } from '@measured/puck';
+export interface MediaReference {
+    id: string | number;
+    url: string;
+    alt?: string;
+    width?: number;
+    height?: number;
+}
+interface MediaFieldProps {
+    value: MediaReference | null;
+    onChange: (value: MediaReference | null) => void;
+    label?: string;
+    readOnly?: boolean;
+    apiEndpoint?: string;
+}
+declare function MediaFieldInner({ value, onChange, label, readOnly, apiEndpoint, }: MediaFieldProps): import("react/jsx-runtime").JSX.Element;
+export declare const MediaField: React.MemoExoticComponent<typeof MediaFieldInner>;
+/**
+ * Creates a Puck field configuration for media selection
+ */
+export declare function createMediaField(config: {
+    label?: string;
+    apiEndpoint?: string;
+}): CustomField<MediaReference | null>;
+export {};
+//# sourceMappingURL=MediaField.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MediaField.d.ts","sourceRoot":"","sources":["../../src/fields/MediaField.tsx"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,KAAqE,MAAM,OAAO,CAAA;AACzF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAOjD,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;IACnB,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB;AAED,UAAU,eAAe;IACvB,KAAK,EAAE,cAAc,GAAG,IAAI,CAAA;IAC5B,QAAQ,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAA;IAChD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAgaD,iBAAS,eAAe,CAAC,EACvB,KAAK,EACL,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,WAA0B,GAC3B,EAAE,eAAe,2CA6mBjB;AAGD,eAAO,MAAM,UAAU,mDAAwB,CAAA;AAM/C;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE;IACvC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,GAAG,WAAW,CAAC,cAAc,GAAG,IAAI,CAAC,CAcrC"}