@delmaredigital/payload-puck 0.6.12 → 0.6.13

package/dist/fields/ContentAlignmentField.js

@@ -5,27 +5,61 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  *
  * A d-pad style control for selecting content alignment within a container.
  * Works with both Flexbox (justify-content + align-items) and Grid (place-content).
- */
-import { useCallback, memo } from 'react';
+ */ import React, { useCallback, memo } from 'react';
 import { X } from 'lucide-react';
 // =============================================================================
 // Constants
 // =============================================================================
 const DEFAULT_ALIGNMENT = {
     horizontal: 'center',
-    vertical: 'center',
+    vertical: 'center'
 };
-/** Grid positions in order (row by row) */
-const POSITIONS = [
-    { h: 'start', v: 'start', label: 'top-left' },
-    { h: 'center', v: 'start', label: 'top-center' },
-    { h: 'end', v: 'start', label: 'top-right' },
-    { h: 'start', v: 'center', label: 'center-left' },
-    { h: 'center', v: 'center', label: 'center' },
-    { h: 'end', v: 'center', label: 'center-right' },
-    { h: 'start', v: 'end', label: 'bottom-left' },
-    { h: 'center', v: 'end', label: 'bottom-center' },
-    { h: 'end', v: 'end', label: 'bottom-right' },
+/** Grid positions in order (row by row) */ const POSITIONS = [
+    {
+        h: 'start',
+        v: 'start',
+        label: 'top-left'
+    },
+    {
+        h: 'center',
+        v: 'start',
+        label: 'top-center'
+    },
+    {
+        h: 'end',
+        v: 'start',
+        label: 'top-right'
+    },
+    {
+        h: 'start',
+        v: 'center',
+        label: 'center-left'
+    },
+    {
+        h: 'center',
+        v: 'center',
+        label: 'center'
+    },
+    {
+        h: 'end',
+        v: 'center',
+        label: 'center-right'
+    },
+    {
+        h: 'start',
+        v: 'end',
+        label: 'bottom-left'
+    },
+    {
+        h: 'center',
+        v: 'end',
+        label: 'bottom-center'
+    },
+    {
+        h: 'end',
+        v: 'end',
+        label: 'bottom-right'
+    }
 ];
 // =============================================================================
 // Styles
@@ -34,17 +68,17 @@ const styles = {
     container: {
         display: 'flex',
         flexDirection: 'column',
-        gap: '8px',
+        gap: '8px'
     },
     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',
@@ -57,12 +91,12 @@ const styles = {
         borderRadius: '4px',
         backgroundColor: 'transparent',
         color: 'var(--theme-elevation-500)',
-        cursor: 'pointer',
+        cursor: 'pointer'
     },
     gridContainer: {
         display: 'flex',
         justifyContent: 'center',
-        padding: '8px 0',
+        padding: '8px 0'
     },
     grid: {
         display: 'grid',
@@ -72,7 +106,7 @@ const styles = {
         padding: '4px',
         backgroundColor: 'var(--theme-elevation-100)',
         borderRadius: '8px',
-        border: '1px solid var(--theme-elevation-150)',
+        border: '1px solid var(--theme-elevation-150)'
     },
     cell: {
         width: '28px',
@@ -84,7 +118,7 @@ const styles = {
         display: 'flex',
         alignItems: 'center',
         justifyContent: 'center',
-        transition: 'all 0.15s ease',
+        transition: 'all 0.15s ease'
     },
     cellActive: {
         width: '28px',
@@ -96,27 +130,27 @@ const styles = {
         display: 'flex',
         alignItems: 'center',
         justifyContent: 'center',
-        transition: 'all 0.15s ease',
+        transition: 'all 0.15s ease'
     },
     cellHover: {
         borderColor: 'var(--theme-elevation-400)',
-        backgroundColor: 'var(--theme-elevation-50)',
+        backgroundColor: 'var(--theme-elevation-50)'
     },
     cellDisabled: {
         cursor: 'not-allowed',
-        opacity: 0.5,
+        opacity: 0.5
     },
     dot: {
         width: '8px',
         height: '8px',
         borderRadius: '50%',
-        backgroundColor: 'var(--theme-elevation-400)',
+        backgroundColor: 'var(--theme-elevation-400)'
     },
     dotActive: {
         width: '10px',
         height: '10px',
         borderRadius: '50%',
-        backgroundColor: 'var(--theme-bg)',
+        backgroundColor: 'var(--theme-bg)'
     },
     preview: {
         display: 'flex',
@@ -124,114 +158,160 @@ const styles = {
         justifyContent: 'center',
         gap: '8px',
         fontSize: '12px',
-        color: 'var(--theme-elevation-500)',
-    },
+        color: 'var(--theme-elevation-500)'
+    }
 };
 // =============================================================================
 // ContentAlignmentField Component
 // =============================================================================
-function ContentAlignmentFieldInner({ value, onChange, label = 'Content Alignment', readOnly, defaultValue = DEFAULT_ALIGNMENT, }) {
+function ContentAlignmentFieldInner({ value, onChange, label = 'Content Alignment', readOnly, defaultValue = DEFAULT_ALIGNMENT }) {
     const currentValue = value || defaultValue;
-    const handleCellClick = useCallback((horizontal, vertical) => {
-        if (readOnly)
-            return;
-        onChange({ horizontal, vertical });
-    }, [onChange, readOnly]);
-    const handleClear = useCallback(() => {
+    const handleCellClick = useCallback((horizontal, vertical)=>{
+        if (readOnly) return;
+        onChange({
+            horizontal,
+            vertical
+        });
+    }, [
+        onChange,
+        readOnly
+    ]);
+    const handleClear = useCallback(()=>{
         onChange(null);
-    }, [onChange]);
-    const isActive = (h, v) => currentValue.horizontal === h && currentValue.vertical === v;
+    }, [
+        onChange
+    ]);
+    const isActive = (h, v)=>currentValue.horizontal === h && currentValue.vertical === v;
     // Human-readable label for current position
-    const getPositionLabel = (h, v) => {
+    const getPositionLabel = (h, v)=>{
         const vLabel = v === 'start' ? 'Top' : v === 'end' ? 'Bottom' : 'Middle';
         const hLabel = h === 'start' ? 'Left' : h === 'end' ? 'Right' : 'Center';
-        if (h === 'center' && v === 'center')
-            return 'Center';
+        if (h === 'center' && v === 'center') return 'Center';
         return `${vLabel} ${hLabel}`;
     };
-    return (_jsxs("div", { className: "puck-field", style: styles.container, children: [_jsxs("div", { style: styles.header, children: [_jsx("label", { style: styles.label, children: label }), value && !readOnly && (_jsx("button", { type: "button", onClick: handleClear, style: styles.clearButton, title: "Reset to default", children: _jsx(X, { style: { width: '16px', height: '16px' } }) }))] }), _jsx("div", { style: styles.gridContainer, children: _jsx("div", { style: styles.grid, children: POSITIONS.map(({ h, v, label: posLabel }) => {
+    return /*#__PURE__*/ _jsxs("div", {
+        className: "puck-field",
+        style: styles.container,
+        children: [
+            /*#__PURE__*/ _jsxs("div", {
+                style: styles.header,
+                children: [
+                    /*#__PURE__*/ _jsx("label", {
+                        style: styles.label,
+                        children: label
+                    }),
+                    value && !readOnly && /*#__PURE__*/ _jsx("button", {
+                        type: "button",
+                        onClick: handleClear,
+                        style: styles.clearButton,
+                        title: "Reset to default",
+                        children: /*#__PURE__*/ _jsx(X, {
+                            style: {
+                                width: '16px',
+                                height: '16px'
+                            }
+                        })
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsx("div", {
+                style: styles.gridContainer,
+                children: /*#__PURE__*/ _jsx("div", {
+                    style: styles.grid,
+                    children: POSITIONS.map(({ h, v, label: posLabel })=>{
                         const active = isActive(h, v);
-                        return (_jsx("button", { type: "button", onClick: () => handleCellClick(h, v), disabled: readOnly, style: {
-                                ...(active ? styles.cellActive : styles.cell),
-                                ...(readOnly ? styles.cellDisabled : {}),
-                            }, title: getPositionLabel(h, v), "aria-label": getPositionLabel(h, v), "aria-pressed": active, children: _jsx("span", { style: active ? styles.dotActive : styles.dot }) }, posLabel));
-                    }) }) }), _jsx("div", { style: styles.preview, children: getPositionLabel(currentValue.horizontal, currentValue.vertical) })] }));
+                        return /*#__PURE__*/ _jsx("button", {
+                            type: "button",
+                            onClick: ()=>handleCellClick(h, v),
+                            disabled: readOnly,
+                            style: {
+                                ...active ? styles.cellActive : styles.cell,
+                                ...readOnly ? styles.cellDisabled : {}
+                            },
+                            title: getPositionLabel(h, v),
+                            "aria-label": getPositionLabel(h, v),
+                            "aria-pressed": active,
+                            children: /*#__PURE__*/ _jsx("span", {
+                                style: active ? styles.dotActive : styles.dot
+                            })
+                        }, posLabel);
+                    })
+                })
+            }),
+            /*#__PURE__*/ _jsx("div", {
+                style: styles.preview,
+                children: getPositionLabel(currentValue.horizontal, currentValue.vertical)
+            })
+        ]
+    });
 }
-export const ContentAlignmentField = memo(ContentAlignmentFieldInner);
+export const ContentAlignmentField = /*#__PURE__*/ memo(ContentAlignmentFieldInner);
 // =============================================================================
 // CSS Helper Utilities
 // =============================================================================
 /**
  * Convert ContentAlignmentValue to Flexbox CSS properties
  * Use this when the container is display: flex
- */
-export function alignmentToFlexCSS(alignment) {
-    if (!alignment)
-        return {};
+ */ export function alignmentToFlexCSS(alignment) {
+    if (!alignment) return {};
     const justifyMap = {
         start: 'flex-start',
         center: 'center',
-        end: 'flex-end',
+        end: 'flex-end'
     };
     const alignMap = {
         start: 'flex-start',
         center: 'center',
-        end: 'flex-end',
+        end: 'flex-end'
     };
     return {
         justifyContent: justifyMap[alignment.horizontal],
-        alignItems: alignMap[alignment.vertical],
+        alignItems: alignMap[alignment.vertical]
     };
 }
 /**
  * Convert ContentAlignmentValue to Grid CSS properties
  * Use this when the container is display: grid
- */
-export function alignmentToGridCSS(alignment) {
-    if (!alignment)
-        return {};
+ */ export function alignmentToGridCSS(alignment) {
+    if (!alignment) return {};
     const map = {
         start: 'start',
         center: 'center',
-        end: 'end',
+        end: 'end'
     };
     return {
         justifyContent: map[alignment.horizontal],
-        alignContent: map[alignment.vertical],
+        alignContent: map[alignment.vertical]
     };
 }
 /**
  * Convert ContentAlignmentValue to place-self CSS for grid items
  * Use this on individual items within a grid
- */
-export function alignmentToPlaceSelfCSS(alignment) {
-    if (!alignment)
-        return {};
+ */ export function alignmentToPlaceSelfCSS(alignment) {
+    if (!alignment) return {};
     const map = {
         start: 'start',
         center: 'center',
-        end: 'end',
+        end: 'end'
     };
     return {
-        placeSelf: `${map[alignment.vertical]} ${map[alignment.horizontal]}`,
+        placeSelf: `${map[alignment.vertical]} ${map[alignment.horizontal]}`
     };
 }
 /**
  * Get Tailwind classes for alignment
  * Returns both justify-* and items-* classes
- */
-export function alignmentToTailwind(alignment) {
-    if (!alignment)
-        return '';
+ */ export function alignmentToTailwind(alignment) {
+    if (!alignment) return '';
     const justifyMap = {
         start: 'justify-start',
         center: 'justify-center',
-        end: 'justify-end',
+        end: 'justify-end'
     };
     const alignMap = {
         start: 'items-start',
         center: 'items-center',
-        end: 'items-end',
+        end: 'items-end'
     };
     return `${justifyMap[alignment.horizontal]} ${alignMap[alignment.vertical]}`;
 }
@@ -244,12 +324,18 @@ export function alignmentToTailwind(alignment) {
  *   contentAlignment: createContentAlignmentField({ label: 'Align Content' }),
  * }
  * ```
- */
-export function createContentAlignmentField(config = {}) {
+ */ export function createContentAlignmentField(config = {}) {
     return {
         type: 'custom',
         label: config.label,
-        render: ({ value, onChange, readOnly }) => (_jsx(ContentAlignmentField, { value: value, onChange: onChange, label: config.label, readOnly: readOnly, defaultValue: config.defaultValue })),
+        render: ({ value, onChange, readOnly })=>/*#__PURE__*/ _jsx(ContentAlignmentField, {
+                value: value,
+                onChange: onChange,
+                label: config.label,
+                readOnly: readOnly,
+                defaultValue: config.defaultValue
+            })
     };
 }
+
 //# sourceMappingURL=ContentAlignmentField.js.map

package/dist/fields/ContentAlignmentField.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContentAlignmentField.js","sourceRoot":"","sources":["../../src/fields/ContentAlignmentField.tsx"],"names":[],"mappings":"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"}
+{"version":3,"sources":["../../src/fields/ContentAlignmentField.tsx"],"sourcesContent":["'use client'\n\n/**\n * ContentAlignmentField - Visual 3x3 grid selector for content positioning\n *\n * A d-pad style control for selecting content alignment within a container.\n * Works with both Flexbox (justify-content + align-items) and Grid (place-content).\n */\n\nimport React, { useCallback, memo, type CSSProperties } from 'react'\nimport type { CustomField } from '@puckeditor/core'\nimport { X } from 'lucide-react'\n\n// =============================================================================\n// Types\n// =============================================================================\n\n/** Horizontal alignment */\nexport type HorizontalAlign = 'start' | 'center' | 'end'\n\n/** Vertical alignment */\nexport type VerticalAlign = 'start' | 'center' | 'end'\n\n/** Combined alignment position (9 positions) */\nexport interface ContentAlignmentValue {\n  horizontal: HorizontalAlign\n  vertical: VerticalAlign\n}\n\n/** Position labels for accessibility */\nexport type PositionLabel =\n  | 'top-left' | 'top-center' | 'top-right'\n  | 'center-left' | 'center' | 'center-right'\n  | 'bottom-left' | 'bottom-center' | 'bottom-right'\n\ninterface ContentAlignmentFieldProps {\n  value: ContentAlignmentValue | null\n  onChange: (value: ContentAlignmentValue | null) => void\n  label?: string\n  readOnly?: boolean\n  /** Default alignment when null */\n  defaultValue?: ContentAlignmentValue\n}\n\n// =============================================================================\n// Constants\n// =============================================================================\n\nconst DEFAULT_ALIGNMENT: ContentAlignmentValue = {\n  horizontal: 'center',\n  vertical: 'center',\n}\n\n/** Grid positions in order (row by row) */\nconst POSITIONS: Array<{ h: HorizontalAlign; v: VerticalAlign; label: PositionLabel }> = [\n  { h: 'start', v: 'start', label: 'top-left' },\n  { h: 'center', v: 'start', label: 'top-center' },\n  { h: 'end', v: 'start', label: 'top-right' },\n  { h: 'start', v: 'center', label: 'center-left' },\n  { h: 'center', v: 'center', label: 'center' },\n  { h: 'end', v: 'center', label: 'center-right' },\n  { h: 'start', v: 'end', label: 'bottom-left' },\n  { h: 'center', v: 'end', label: 'bottom-center' },\n  { h: 'end', v: 'end', label: 'bottom-right' },\n]\n\n// =============================================================================\n// Styles\n// =============================================================================\n\nconst styles = {\n  container: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '8px',\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  gridContainer: {\n    display: 'flex',\n    justifyContent: 'center',\n    padding: '8px 0',\n  } as CSSProperties,\n  grid: {\n    display: 'grid',\n    gridTemplateColumns: 'repeat(3, 28px)',\n    gridTemplateRows: 'repeat(3, 28px)',\n    gap: '3px',\n    padding: '4px',\n    backgroundColor: 'var(--theme-elevation-100)',\n    borderRadius: '8px',\n    border: '1px solid var(--theme-elevation-150)',\n  } as CSSProperties,\n  cell: {\n    width: '28px',\n    height: '28px',\n    border: '1px solid var(--theme-elevation-200)',\n    borderRadius: '4px',\n    backgroundColor: 'var(--theme-bg)',\n    cursor: 'pointer',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    transition: 'all 0.15s ease',\n  } as CSSProperties,\n  cellActive: {\n    width: '28px',\n    height: '28px',\n    border: '2px solid var(--theme-elevation-800)',\n    borderRadius: '4px',\n    backgroundColor: 'var(--theme-elevation-800)',\n    cursor: 'pointer',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    transition: 'all 0.15s ease',\n  } as CSSProperties,\n  cellHover: {\n    borderColor: 'var(--theme-elevation-400)',\n    backgroundColor: 'var(--theme-elevation-50)',\n  } as CSSProperties,\n  cellDisabled: {\n    cursor: 'not-allowed',\n    opacity: 0.5,\n  } as CSSProperties,\n  dot: {\n    width: '8px',\n    height: '8px',\n    borderRadius: '50%',\n    backgroundColor: 'var(--theme-elevation-400)',\n  } as CSSProperties,\n  dotActive: {\n    width: '10px',\n    height: '10px',\n    borderRadius: '50%',\n    backgroundColor: 'var(--theme-bg)',\n  } as CSSProperties,\n  preview: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    gap: '8px',\n    fontSize: '12px',\n    color: 'var(--theme-elevation-500)',\n  } as CSSProperties,\n}\n\n// =============================================================================\n// ContentAlignmentField Component\n// =============================================================================\n\nfunction ContentAlignmentFieldInner({\n  value,\n  onChange,\n  label = 'Content Alignment',\n  readOnly,\n  defaultValue = DEFAULT_ALIGNMENT,\n}: ContentAlignmentFieldProps) {\n  const currentValue = value || defaultValue\n\n  const handleCellClick = useCallback(\n    (horizontal: HorizontalAlign, vertical: VerticalAlign) => {\n      if (readOnly) return\n      onChange({ horizontal, vertical })\n    },\n    [onChange, readOnly]\n  )\n\n  const handleClear = useCallback(() => {\n    onChange(null)\n  }, [onChange])\n\n  const isActive = (h: HorizontalAlign, v: VerticalAlign) =>\n    currentValue.horizontal === h && currentValue.vertical === v\n\n  // Human-readable label for current position\n  const getPositionLabel = (h: HorizontalAlign, v: VerticalAlign): string => {\n    const vLabel = v === 'start' ? 'Top' : v === 'end' ? 'Bottom' : 'Middle'\n    const hLabel = h === 'start' ? 'Left' : h === 'end' ? 'Right' : 'Center'\n    if (h === 'center' && v === 'center') return 'Center'\n    return `${vLabel} ${hLabel}`\n  }\n\n  return (\n    <div className=\"puck-field\" style={styles.container}>\n      {/* Header */}\n      <div style={styles.header}>\n        <label style={styles.label}>{label}</label>\n        {value && !readOnly && (\n          <button\n            type=\"button\"\n            onClick={handleClear}\n            style={styles.clearButton}\n            title=\"Reset to default\"\n          >\n            <X style={{ width: '16px', height: '16px' }} />\n          </button>\n        )}\n      </div>\n\n      {/* 3x3 Grid Selector */}\n      <div style={styles.gridContainer}>\n        <div style={styles.grid}>\n          {POSITIONS.map(({ h, v, label: posLabel }) => {\n            const active = isActive(h, v)\n            return (\n              <button\n                key={posLabel}\n                type=\"button\"\n                onClick={() => handleCellClick(h, v)}\n                disabled={readOnly}\n                style={{\n                  ...(active ? styles.cellActive : styles.cell),\n                  ...(readOnly ? styles.cellDisabled : {}),\n                }}\n                title={getPositionLabel(h, v)}\n                aria-label={getPositionLabel(h, v)}\n                aria-pressed={active}\n              >\n                <span style={active ? styles.dotActive : styles.dot} />\n              </button>\n            )\n          })}\n        </div>\n      </div>\n\n      {/* Current position label */}\n      <div style={styles.preview}>\n        {getPositionLabel(currentValue.horizontal, currentValue.vertical)}\n      </div>\n    </div>\n  )\n}\n\nexport const ContentAlignmentField = memo(ContentAlignmentFieldInner)\n\n// =============================================================================\n// CSS Helper Utilities\n// =============================================================================\n\n/**\n * Convert ContentAlignmentValue to Flexbox CSS properties\n * Use this when the container is display: flex\n */\nexport function alignmentToFlexCSS(\n  alignment: ContentAlignmentValue | null | undefined\n): React.CSSProperties {\n  if (!alignment) return {}\n\n  const justifyMap: Record<HorizontalAlign, string> = {\n    start: 'flex-start',\n    center: 'center',\n    end: 'flex-end',\n  }\n\n  const alignMap: Record<VerticalAlign, string> = {\n    start: 'flex-start',\n    center: 'center',\n    end: 'flex-end',\n  }\n\n  return {\n    justifyContent: justifyMap[alignment.horizontal],\n    alignItems: alignMap[alignment.vertical],\n  }\n}\n\n/**\n * Convert ContentAlignmentValue to Grid CSS properties\n * Use this when the container is display: grid\n */\nexport function alignmentToGridCSS(\n  alignment: ContentAlignmentValue | null | undefined\n): React.CSSProperties {\n  if (!alignment) return {}\n\n  const map: Record<HorizontalAlign | VerticalAlign, string> = {\n    start: 'start',\n    center: 'center',\n    end: 'end',\n  }\n\n  return {\n    justifyContent: map[alignment.horizontal],\n    alignContent: map[alignment.vertical],\n  }\n}\n\n/**\n * Convert ContentAlignmentValue to place-self CSS for grid items\n * Use this on individual items within a grid\n */\nexport function alignmentToPlaceSelfCSS(\n  alignment: ContentAlignmentValue | null | undefined\n): React.CSSProperties {\n  if (!alignment) return {}\n\n  const map: Record<HorizontalAlign | VerticalAlign, string> = {\n    start: 'start',\n    center: 'center',\n    end: 'end',\n  }\n\n  return {\n    placeSelf: `${map[alignment.vertical]} ${map[alignment.horizontal]}`,\n  }\n}\n\n/**\n * Get Tailwind classes for alignment\n * Returns both justify-* and items-* classes\n */\nexport function alignmentToTailwind(\n  alignment: ContentAlignmentValue | null | undefined\n): string {\n  if (!alignment) return ''\n\n  const justifyMap: Record<HorizontalAlign, string> = {\n    start: 'justify-start',\n    center: 'justify-center',\n    end: 'justify-end',\n  }\n\n  const alignMap: Record<VerticalAlign, string> = {\n    start: 'items-start',\n    center: 'items-center',\n    end: 'items-end',\n  }\n\n  return `${justifyMap[alignment.horizontal]} ${alignMap[alignment.vertical]}`\n}\n\n// =============================================================================\n// Field Configuration Factory\n// =============================================================================\n\ninterface CreateContentAlignmentFieldConfig {\n  label?: string\n  defaultValue?: ContentAlignmentValue\n}\n\n/**\n * Creates a Puck field configuration for content alignment\n *\n * @example\n * ```ts\n * fields: {\n *   contentAlignment: createContentAlignmentField({ label: 'Align Content' }),\n * }\n * ```\n */\nexport function createContentAlignmentField(\n  config: CreateContentAlignmentFieldConfig = {}\n): CustomField<ContentAlignmentValue | null> {\n  return {\n    type: 'custom',\n    label: config.label,\n    render: ({ value, onChange, readOnly }) => (\n      <ContentAlignmentField\n        value={value}\n        onChange={onChange}\n        label={config.label}\n        readOnly={readOnly}\n        defaultValue={config.defaultValue}\n      />\n    ),\n  }\n}\n"],"names":["React","useCallback","memo","X","DEFAULT_ALIGNMENT","horizontal","vertical","POSITIONS","h","v","label","styles","container","display","flexDirection","gap","header","alignItems","justifyContent","fontSize","fontWeight","color","clearButton","width","height","padding","border","borderRadius","backgroundColor","cursor","gridContainer","grid","gridTemplateColumns","gridTemplateRows","cell","transition","cellActive","cellHover","borderColor","cellDisabled","opacity","dot","dotActive","preview","ContentAlignmentFieldInner","value","onChange","readOnly","defaultValue","currentValue","handleCellClick","handleClear","isActive","getPositionLabel","vLabel","hLabel","div","className","style","button","type","onClick","title","map","posLabel","active","disabled","aria-label","aria-pressed","span","ContentAlignmentField","alignmentToFlexCSS","alignment","justifyMap","start","center","end","alignMap","alignmentToGridCSS","alignContent","alignmentToPlaceSelfCSS","placeSelf","alignmentToTailwind","createContentAlignmentField","config","render"],"mappings":"AAAA;;AAEA;;;;;CAKC,GAED,OAAOA,SAASC,WAAW,EAAEC,IAAI,QAA4B,QAAO;AAEpE,SAASC,CAAC,QAAQ,eAAc;AAiChC,gFAAgF;AAChF,YAAY;AACZ,gFAAgF;AAEhF,MAAMC,oBAA2C;IAC/CC,YAAY;IACZC,UAAU;AACZ;AAEA,yCAAyC,GACzC,MAAMC,YAAmF;IACvF;QAAEC,GAAG;QAASC,GAAG;QAASC,OAAO;IAAW;IAC5C;QAAEF,GAAG;QAAUC,GAAG;QAASC,OAAO;IAAa;IAC/C;QAAEF,GAAG;QAAOC,GAAG;QAASC,OAAO;IAAY;IAC3C;QAAEF,GAAG;QAASC,GAAG;QAAUC,OAAO;IAAc;IAChD;QAAEF,GAAG;QAAUC,GAAG;QAAUC,OAAO;IAAS;IAC5C;QAAEF,GAAG;QAAOC,GAAG;QAAUC,OAAO;IAAe;IAC/C;QAAEF,GAAG;QAASC,GAAG;QAAOC,OAAO;IAAc;IAC7C;QAAEF,GAAG;QAAUC,GAAG;QAAOC,OAAO;IAAgB;IAChD;QAAEF,GAAG;QAAOC,GAAG;QAAOC,OAAO;IAAe;CAC7C;AAED,gFAAgF;AAChF,SAAS;AACT,gFAAgF;AAEhF,MAAMC,SAAS;IACbC,WAAW;QACTC,SAAS;QACTC,eAAe;QACfC,KAAK;IACP;IACAC,QAAQ;QACNH,SAAS;QACTI,YAAY;QACZC,gBAAgB;IAClB;IACAR,OAAO;QACLS,UAAU;QACVC,YAAY;QACZC,OAAO;IACT;IACAC,aAAa;QACXT,SAAS;QACTI,YAAY;QACZC,gBAAgB;QAChBK,OAAO;QACPC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,cAAc;QACdC,iBAAiB;QACjBP,OAAO;QACPQ,QAAQ;IACV;IACAC,eAAe;QACbjB,SAAS;QACTK,gBAAgB;QAChBO,SAAS;IACX;IACAM,MAAM;QACJlB,SAAS;QACTmB,qBAAqB;QACrBC,kBAAkB;QAClBlB,KAAK;QACLU,SAAS;QACTG,iBAAiB;QACjBD,cAAc;QACdD,QAAQ;IACV;IACAQ,MAAM;QACJX,OAAO;QACPC,QAAQ;QACRE,QAAQ;QACRC,cAAc;QACdC,iBAAiB;QACjBC,QAAQ;QACRhB,SAAS;QACTI,YAAY;QACZC,gBAAgB;QAChBiB,YAAY;IACd;IACAC,YAAY;QACVb,OAAO;QACPC,QAAQ;QACRE,QAAQ;QACRC,cAAc;QACdC,iBAAiB;QACjBC,QAAQ;QACRhB,SAAS;QACTI,YAAY;QACZC,gBAAgB;QAChBiB,YAAY;IACd;IACAE,WAAW;QACTC,aAAa;QACbV,iBAAiB;IACnB;IACAW,cAAc;QACZV,QAAQ;QACRW,SAAS;IACX;IACAC,KAAK;QACHlB,OAAO;QACPC,QAAQ;QACRG,cAAc;QACdC,iBAAiB;IACnB;IACAc,WAAW;QACTnB,OAAO;QACPC,QAAQ;QACRG,cAAc;QACdC,iBAAiB;IACnB;IACAe,SAAS;QACP9B,SAAS;QACTI,YAAY;QACZC,gBAAgB;QAChBH,KAAK;QACLI,UAAU;QACVE,OAAO;IACT;AACF;AAEA,gFAAgF;AAChF,kCAAkC;AAClC,gFAAgF;AAEhF,SAASuB,2BAA2B,EAClCC,KAAK,EACLC,QAAQ,EACRpC,QAAQ,mBAAmB,EAC3BqC,QAAQ,EACRC,eAAe5C,iBAAiB,EACL;IAC3B,MAAM6C,eAAeJ,SAASG;IAE9B,MAAME,kBAAkBjD,YACtB,CAACI,YAA6BC;QAC5B,IAAIyC,UAAU;QACdD,SAAS;YAAEzC;YAAYC;QAAS;IAClC,GACA;QAACwC;QAAUC;KAAS;IAGtB,MAAMI,cAAclD,YAAY;QAC9B6C,SAAS;IACX,GAAG;QAACA;KAAS;IAEb,MAAMM,WAAW,CAAC5C,GAAoBC,IACpCwC,aAAa5C,UAAU,KAAKG,KAAKyC,aAAa3C,QAAQ,KAAKG;IAE7D,4CAA4C;IAC5C,MAAM4C,mBAAmB,CAAC7C,GAAoBC;QAC5C,MAAM6C,SAAS7C,MAAM,UAAU,QAAQA,MAAM,QAAQ,WAAW;QAChE,MAAM8C,SAAS/C,MAAM,UAAU,SAASA,MAAM,QAAQ,UAAU;QAChE,IAAIA,MAAM,YAAYC,MAAM,UAAU,OAAO;QAC7C,OAAO,GAAG6C,OAAO,CAAC,EAAEC,QAAQ;IAC9B;IAEA,qBACE,MAACC;QAAIC,WAAU;QAAaC,OAAO/C,OAAOC,SAAS;;0BAEjD,MAAC4C;gBAAIE,OAAO/C,OAAOK,MAAM;;kCACvB,KAACN;wBAAMgD,OAAO/C,OAAOD,KAAK;kCAAGA;;oBAC5BmC,SAAS,CAACE,0BACT,KAACY;wBACCC,MAAK;wBACLC,SAASV;wBACTO,OAAO/C,OAAOW,WAAW;wBACzBwC,OAAM;kCAEN,cAAA,KAAC3D;4BAAEuD,OAAO;gCAAEnC,OAAO;gCAAQC,QAAQ;4BAAO;;;;;0BAMhD,KAACgC;gBAAIE,OAAO/C,OAAOmB,aAAa;0BAC9B,cAAA,KAAC0B;oBAAIE,OAAO/C,OAAOoB,IAAI;8BACpBxB,UAAUwD,GAAG,CAAC,CAAC,EAAEvD,CAAC,EAAEC,CAAC,EAAEC,OAAOsD,QAAQ,EAAE;wBACvC,MAAMC,SAASb,SAAS5C,GAAGC;wBAC3B,qBACE,KAACkD;4BAECC,MAAK;4BACLC,SAAS,IAAMX,gBAAgB1C,GAAGC;4BAClCyD,UAAUnB;4BACVW,OAAO;gCACL,GAAIO,SAAStD,OAAOyB,UAAU,GAAGzB,OAAOuB,IAAI;gCAC5C,GAAIa,WAAWpC,OAAO4B,YAAY,GAAG,CAAC,CAAC;4BACzC;4BACAuB,OAAOT,iBAAiB7C,GAAGC;4BAC3B0D,cAAYd,iBAAiB7C,GAAGC;4BAChC2D,gBAAcH;sCAEd,cAAA,KAACI;gCAAKX,OAAOO,SAAStD,OAAO+B,SAAS,GAAG/B,OAAO8B,GAAG;;2BAZ9CuB;oBAeX;;;0BAKJ,KAACR;gBAAIE,OAAO/C,OAAOgC,OAAO;0BACvBU,iBAAiBJ,aAAa5C,UAAU,EAAE4C,aAAa3C,QAAQ;;;;AAIxE;AAEA,OAAO,MAAMgE,sCAAwBpE,KAAK0C,4BAA2B;AAErE,gFAAgF;AAChF,uBAAuB;AACvB,gFAAgF;AAEhF;;;CAGC,GACD,OAAO,SAAS2B,mBACdC,SAAmD;IAEnD,IAAI,CAACA,WAAW,OAAO,CAAC;IAExB,MAAMC,aAA8C;QAClDC,OAAO;QACPC,QAAQ;QACRC,KAAK;IACP;IAEA,MAAMC,WAA0C;QAC9CH,OAAO;QACPC,QAAQ;QACRC,KAAK;IACP;IAEA,OAAO;QACL1D,gBAAgBuD,UAAU,CAACD,UAAUnE,UAAU,CAAC;QAChDY,YAAY4D,QAAQ,CAACL,UAAUlE,QAAQ,CAAC;IAC1C;AACF;AAEA;;;CAGC,GACD,OAAO,SAASwE,mBACdN,SAAmD;IAEnD,IAAI,CAACA,WAAW,OAAO,CAAC;IAExB,MAAMT,MAAuD;QAC3DW,OAAO;QACPC,QAAQ;QACRC,KAAK;IACP;IAEA,OAAO;QACL1D,gBAAgB6C,GAAG,CAACS,UAAUnE,UAAU,CAAC;QACzC0E,cAAchB,GAAG,CAACS,UAAUlE,QAAQ,CAAC;IACvC;AACF;AAEA;;;CAGC,GACD,OAAO,SAAS0E,wBACdR,SAAmD;IAEnD,IAAI,CAACA,WAAW,OAAO,CAAC;IAExB,MAAMT,MAAuD;QAC3DW,OAAO;QACPC,QAAQ;QACRC,KAAK;IACP;IAEA,OAAO;QACLK,WAAW,GAAGlB,GAAG,CAACS,UAAUlE,QAAQ,CAAC,CAAC,CAAC,EAAEyD,GAAG,CAACS,UAAUnE,UAAU,CAAC,EAAE;IACtE;AACF;AAEA;;;CAGC,GACD,OAAO,SAAS6E,oBACdV,SAAmD;IAEnD,IAAI,CAACA,WAAW,OAAO;IAEvB,MAAMC,aAA8C;QAClDC,OAAO;QACPC,QAAQ;QACRC,KAAK;IACP;IAEA,MAAMC,WAA0C;QAC9CH,OAAO;QACPC,QAAQ;QACRC,KAAK;IACP;IAEA,OAAO,GAAGH,UAAU,CAACD,UAAUnE,UAAU,CAAC,CAAC,CAAC,EAAEwE,QAAQ,CAACL,UAAUlE,QAAQ,CAAC,EAAE;AAC9E;AAWA;;;;;;;;;CASC,GACD,OAAO,SAAS6E,4BACdC,SAA4C,CAAC,CAAC;IAE9C,OAAO;QACLxB,MAAM;QACNlD,OAAO0E,OAAO1E,KAAK;QACnB2E,QAAQ,CAAC,EAAExC,KAAK,EAAEC,QAAQ,EAAEC,QAAQ,EAAE,iBACpC,KAACuB;gBACCzB,OAAOA;gBACPC,UAAUA;gBACVpC,OAAO0E,OAAO1E,KAAK;gBACnBqC,UAAUA;gBACVC,cAAcoC,OAAOpC,YAAY;;IAGvC;AACF"}

package/dist/fields/DimensionsField.d.ts

@@ -11,7 +11,7 @@
  */
 import React from 'react';
 import type { CustomField } from '@puckeditor/core';
-import type { DimensionsValue } from './shared';
+import type { DimensionsValue } from './shared.js';
 interface DimensionsFieldProps {
     value: DimensionsValue | null;
     onChange: (value: DimensionsValue | null) => void;
@@ -24,7 +24,7 @@ interface DimensionsFieldProps {
     /** Start with advanced mode expanded (default: false) */
     defaultAdvancedMode?: boolean;
 }
-declare function DimensionsFieldInner({ value, onChange, label, readOnly, showHeightControls, showMinControls, defaultAdvancedMode, }: DimensionsFieldProps): import("react/jsx-runtime").JSX.Element;
+declare function DimensionsFieldInner({ value, onChange, label, readOnly, showHeightControls, showMinControls, defaultAdvancedMode, }: DimensionsFieldProps): React.JSX.Element;
 export declare const DimensionsField: React.MemoExoticComponent<typeof DimensionsFieldInner>;
 interface CreateDimensionsFieldConfig {
     label?: string;

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

@@ -1 +1 @@
-{"version":3,"file":"DimensionsField.d.ts","sourceRoot":"","sources":["../../src/fields/DimensionsField.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AAEH,OAAO,KAA0D,MAAM,OAAO,CAAA;AAC9E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAYnD,OAAO,KAAK,EACV,eAAe,EAKhB,MAAM,UAAU,CAAA;AAOjB,UAAU,oBAAoB;IAC5B,KAAK,EAAE,eAAe,GAAG,IAAI,CAAA;IAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,GAAG,IAAI,KAAK,IAAI,CAAA;IACjD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,2CAA2C;IAC3C,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,yDAAyD;IACzD,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,yDAAyD;IACzD,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B;AAobD,iBAAS,oBAAoB,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,kBAAyB,EACzB,eAAsB,EACtB,mBAA2B,GAC5B,EAAE,oBAAoB,2CAubtB;AAED,eAAO,MAAM,eAAe,wDAA6B,CAAA;AAMzD,UAAU,2BAA2B;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,2CAA2C;IAC3C,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,yDAAyD;IACzD,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,yDAAyD;IACzD,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CACnC,MAAM,GAAE,2BAAgC,GACvC,WAAW,CAAC,eAAe,GAAG,IAAI,CAAC,CAgBrC"}
+{"version":3,"file":"DimensionsField.d.ts","sourceRoot":"","sources":["../../src/fields/DimensionsField.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AAEH,OAAO,KAA0D,MAAM,OAAO,CAAA;AAC9E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAYnD,OAAO,KAAK,EACV,eAAe,EAKhB,MAAM,aAAa,CAAA;AAOpB,UAAU,oBAAoB;IAC5B,KAAK,EAAE,eAAe,GAAG,IAAI,CAAA;IAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,GAAG,IAAI,KAAK,IAAI,CAAA;IACjD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,2CAA2C;IAC3C,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,yDAAyD;IACzD,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,yDAAyD;IACzD,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B;AAobD,iBAAS,oBAAoB,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,kBAAyB,EACzB,eAAsB,EACtB,mBAA2B,GAC5B,EAAE,oBAAoB,qBAubtB;AAED,eAAO,MAAM,eAAe,wDAA6B,CAAA;AAMzD,UAAU,2BAA2B;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,2CAA2C;IAC3C,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,yDAAyD;IACzD,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,yDAAyD;IACzD,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CACnC,MAAM,GAAE,2BAAgC,GACvC,WAAW,CAAC,eAAe,GAAG,IAAI,CAAC,CAgBrC"}