@measured/puck 0.21.0-canary.ec77dd9f → 0.21.0-canary.ece26d91

package/dist/{walk-tree-CkSoNBF7.d.ts → actions-ONhOkrvf.d.ts}

@@ -1,10 +1,185 @@
-import { ReactElement, CSSProperties, ReactNode, JSX } from 'react';
+import { ReactElement, CSSProperties, ReactNode, ElementType, JSX } from 'react';
+import { EditorStateSnapshot, Editor, Extensions } from '@tiptap/react';
+import { BlockquoteOptions } from '@tiptap/extension-blockquote';
+import { BoldOptions } from '@tiptap/extension-bold';
+import { CodeOptions } from '@tiptap/extension-code';
+import { CodeBlockOptions } from '@tiptap/extension-code-block';
+import { HardBreakOptions } from '@tiptap/extension-hard-break';
+import { HeadingOptions } from '@tiptap/extension-heading';
+import { HorizontalRuleOptions } from '@tiptap/extension-horizontal-rule';
+import { ItalicOptions } from '@tiptap/extension-italic';
+import { LinkOptions } from '@tiptap/extension-link';
+import { BulletListOptions, ListItemOptions, ListKeymapOptions, OrderedListOptions } from '@tiptap/extension-list';
+import { ParagraphOptions } from '@tiptap/extension-paragraph';
+import { StrikeOptions } from '@tiptap/extension-strike';
+import { TextAlignOptions } from '@tiptap/extension-text-align';
+import { UnderlineOptions } from '@tiptap/extension-underline';
 
 type ItemSelector = {
     index: number;
     zone?: string;
 };
 
+declare const defaultEditorState: (ctx: EditorStateSnapshot, readOnly: boolean) => {
+    isAlignLeft?: undefined;
+    canAlignLeft?: undefined;
+    isAlignCenter?: undefined;
+    canAlignCenter?: undefined;
+    isAlignRight?: undefined;
+    canAlignRight?: undefined;
+    isAlignJustify?: undefined;
+    canAlignJustify?: undefined;
+    isBold?: undefined;
+    canBold?: undefined;
+    isItalic?: undefined;
+    canItalic?: undefined;
+    isUnderline?: undefined;
+    canUnderline?: undefined;
+    isStrike?: undefined;
+    canStrike?: undefined;
+    isInlineCode?: undefined;
+    canInlineCode?: undefined;
+    isBulletList?: undefined;
+    canBulletList?: undefined;
+    isOrderedList?: undefined;
+    canOrderedList?: undefined;
+    isCodeBlock?: undefined;
+    canCodeBlock?: undefined;
+    isBlockquote?: undefined;
+    canBlockquote?: undefined;
+    canHorizontalRule?: undefined;
+} | {
+    isAlignLeft: boolean;
+    canAlignLeft: boolean;
+    isAlignCenter: boolean;
+    canAlignCenter: boolean;
+    isAlignRight: boolean;
+    canAlignRight: boolean;
+    isAlignJustify: boolean;
+    canAlignJustify: boolean;
+    isBold: boolean;
+    canBold: boolean;
+    isItalic: boolean;
+    canItalic: boolean;
+    isUnderline: boolean;
+    canUnderline: boolean;
+    isStrike: boolean;
+    canStrike: boolean;
+    isInlineCode: boolean;
+    canInlineCode: boolean;
+    isBulletList: boolean;
+    canBulletList: boolean;
+    isOrderedList: boolean;
+    canOrderedList: boolean;
+    isCodeBlock: boolean;
+    canCodeBlock: boolean;
+    isBlockquote: boolean;
+    canBlockquote: boolean;
+    canHorizontalRule: boolean;
+};
+
+type RichTextSelector = (ctx: EditorStateSnapshot, readOnly: boolean) => Partial<Record<string, boolean>>;
+type DefaultEditorState = ReturnType<typeof defaultEditorState>;
+type EditorState<Selector extends RichTextSelector = RichTextSelector> = DefaultEditorState & ReturnType<Selector> & Record<string, boolean | undefined>;
+
+interface PuckRichTextOptions {
+    /**
+     * If set to false, the blockquote extension will not be registered
+     * @example blockquote: false
+     */
+    blockquote: Partial<BlockquoteOptions> | false;
+    /**
+     * If set to false, the bold extension will not be registered
+     * @example bold: false
+     */
+    bold: Partial<BoldOptions> | false;
+    /**
+     * If set to false, the bulletList extension will not be registered
+     * @example bulletList: false
+     */
+    bulletList: Partial<BulletListOptions> | false;
+    /**
+     * If set to false, the code extension will not be registered
+     * @example code: false
+     */
+    code: Partial<CodeOptions> | false;
+    /**
+     * If set to false, the codeBlock extension will not be registered
+     * @example codeBlock: false
+     */
+    codeBlock: Partial<CodeBlockOptions> | false;
+    /**
+     * If set to false, the document extension will not be registered
+     * @example document: false
+     */
+    document: false;
+    /**
+     * If set to false, the hardBreak extension will not be registered
+     * @example hardBreak: false
+     */
+    hardBreak: Partial<HardBreakOptions> | false;
+    /**
+     * If set to false, the heading extension will not be registered
+     * @example heading: false
+     */
+    heading: Partial<HeadingOptions> | false;
+    /**
+     * If set to false, the horizontalRule extension will not be registered
+     * @example horizontalRule: false
+     */
+    horizontalRule: Partial<HorizontalRuleOptions> | false;
+    /**
+     * If set to false, the italic extension will not be registered
+     * @example italic: false
+     */
+    italic: Partial<ItalicOptions> | false;
+    /**
+     * If set to false, the listItem extension will not be registered
+     * @example listItem: false
+     */
+    listItem: Partial<ListItemOptions> | false;
+    /**
+     * If set to false, the listItemKeymap extension will not be registered
+     * @example listKeymap: false
+     */
+    listKeymap: Partial<ListKeymapOptions> | false;
+    /**
+     * If set to false, the link extension will not be registered
+     * @example link: false
+     */
+    link: Partial<LinkOptions> | false;
+    /**
+     * If set to false, the orderedList extension will not be registered
+     * @example orderedList: false
+     */
+    orderedList: Partial<OrderedListOptions> | false;
+    /**
+     * If set to false, the paragraph extension will not be registered
+     * @example paragraph: false
+     */
+    paragraph: Partial<ParagraphOptions> | false;
+    /**
+     * If set to false, the strike extension will not be registered
+     * @example strike: false
+     */
+    strike: Partial<StrikeOptions> | false;
+    /**
+     * If set to false, the text extension will not be registered
+     * @example text: false
+     */
+    text: false;
+    /**
+     * If set to false, the textAlign extension will not be registered
+     * @example text: false
+     */
+    textAlign: Partial<TextAlignOptions> | false;
+    /**
+     * If set to false, the underline extension will not be registered
+     * @example underline: false
+     */
+    underline: Partial<UnderlineOptions> | false;
+}
+
 type FieldOption = {
     label: string;
     value: string | number | boolean | undefined | null | object;
@@ -41,6 +216,28 @@ interface RadioField extends BaseField {
     type: "radio";
     options: FieldOptions;
 }
+interface RichtextField<UserSelector extends RichTextSelector = RichTextSelector> extends BaseField {
+    type: "richtext";
+    contentEditable?: boolean;
+    initialHeight?: CSSProperties["height"];
+    options?: Partial<PuckRichTextOptions>;
+    renderMenu?: (props: {
+        children: ReactNode;
+        editor: Editor | null;
+        editorState: EditorState<UserSelector> | null;
+        readOnly: boolean;
+    }) => ReactNode;
+    renderInlineMenu?: (props: {
+        children: ReactNode;
+        editor: Editor | null;
+        editorState: EditorState<UserSelector> | null;
+        readOnly: boolean;
+    }) => ReactNode;
+    tiptap?: {
+        selector?: UserSelector;
+        extensions?: Extensions;
+    };
+}
 interface ArrayField<Props extends {
     [key: string]: any;
 }[] = {
@@ -53,7 +250,7 @@ interface ArrayField<Props extends {
         } ? Field<Props[0][SubPropName], UserField> | UserField : Field<Props[0][SubPropName], UserField>;
     };
     defaultItemProps?: Props[0] | ((index: number) => Props[0]);
-    getItemSummary?: (item: Props[0], index?: number) => string;
+    getItemSummary?: (item: Props[0], index?: number) => ReactNode;
     max?: number;
     min?: number;
 }
@@ -80,7 +277,7 @@ type ExternalFieldWithAdaptor<Props extends any = {
     placeholder?: string;
     adaptor: Adaptor<any, any, Props>;
     adaptorParams?: object;
-    getItemSummary: (item: NotUndefined<Props>, index?: number) => string;
+    getItemSummary: (item: NotUndefined<Props>, index?: number) => ReactNode;
 };
 type CacheOpts = {
     enabled?: boolean;
@@ -97,7 +294,7 @@ interface ExternalField<Props extends any = {
     }) => Promise<any[] | null>;
     mapProp?: (value: any) => Props;
     mapRow?: (value: any) => Record<string, string | number | ReactElement>;
-    getItemSummary?: (item: NotUndefined<Props>, index?: number) => string;
+    getItemSummary?: (item: NotUndefined<Props>, index?: number) => ReactNode;
     showSearch?: boolean;
     renderFooter?: (props: {
         items: any[];
@@ -125,7 +322,7 @@ interface SlotField extends BaseField {
     allow?: string[];
     disallow?: string[];
 }
-type Field<ValueType = any, UserField extends {} = {}> = TextField | NumberField | TextareaField | SelectField | RadioField | ArrayField<ValueType extends {
+type Field<ValueType = any, UserField extends {} = {}> = TextField | RichtextField | NumberField | TextareaField | SelectField | RadioField | ArrayField<ValueType extends {
     [key: string]: any;
 }[] ? ValueType : never, UserField> | ObjectField<ValueType, UserField> | ExternalField<ValueType> | ExternalFieldWithAdaptor<ValueType> | CustomField<ValueType> | SlotField;
 type Fields<ComponentProps extends DefaultComponentProps = DefaultComponentProps, UserField extends {} = {}> = {
@@ -146,9 +343,10 @@ type DropZoneProps = {
     allow?: string[];
     disallow?: string[];
     style?: CSSProperties;
-    minEmptyHeight?: number;
+    minEmptyHeight?: CSSProperties["minHeight"] | number;
     className?: string;
     collisionAxis?: DragAxis;
+    as?: ElementType;
 };
 
 type PuckContext = {
@@ -239,6 +437,7 @@ UserField extends BaseField = {}> = {
         permissions: Partial<Permissions>;
         appState: AppState;
         lastData: DataShape | null;
+        parent: ComponentData | null;
     }) => Promise<Partial<Permissions>> | Partial<Permissions>;
     metadata?: ComponentMetadata;
 } & ComponentConfigExtensions;
@@ -362,6 +561,7 @@ type UiState = {
     };
     field: {
         focus?: string | null;
+        metadata?: Record<string, any>;
     };
 };
 type AppState<UserData extends Data = Data> = {
@@ -551,6 +751,7 @@ type Slot<Props extends {
     [K in keyof Props]: ComponentDataOptionalId<Props[K], K extends string ? K : never>;
 }[keyof Props][];
 type WithSlotProps<Target extends Record<string, any>, Components extends DefaultComponents = DefaultComponents, SlotType extends Content<Components> = Content<Components>> = WithDeepSlots<Target, SlotType>;
+type RichText = string | ReactNode;
 
 type InsertAction = {
     type: "insert";
@@ -618,30 +819,4 @@ type PuckAction = {
     recordHistory?: boolean;
 } & (ReorderAction | InsertAction | MoveAction | ReplaceAction | ReplaceRootAction | RemoveAction | DuplicateAction | SetAction | SetDataAction | SetUiAction | RegisterZoneAction | UnregisterZoneAction);
 
-type MigrationOptions<UserConfig extends Config> = {
-    migrateDynamicZonesForComponent?: {
-        [ComponentName in keyof UserConfig["components"]]: (props: WithId<UserGenerics<UserConfig>["UserProps"][ComponentName]>, zones: Record<string, Content>) => ComponentData["props"];
-    };
-};
-declare function migrate<UserConfig extends Config = Config>(data: Data, config?: UserConfig, migrationOptions?: MigrationOptions<UserConfig>): Data;
-
-type PropTransform<Components extends DefaultComponents = DefaultComponents, RootProps extends DefaultComponentProps = DefaultRootFieldProps> = Partial<{
-    [ComponentName in keyof Components]: (props: Components[ComponentName] & {
-        [key: string]: any;
-    }) => Components[ComponentName];
-} & {
-    root: (props: RootProps & {
-        [key: string]: any;
-    }) => RootProps;
-}>;
-declare function transformProps<Components extends DefaultComponents = DefaultComponents, RootProps extends DefaultComponentProps = DefaultRootFieldProps>(data: Partial<Data>, propTransforms: PropTransform<Components, RootProps>, config?: Config): Data;
-
-declare function resolveAllData<Components extends DefaultComponents = DefaultComponents, RootProps extends Record<string, any> = DefaultRootFieldProps>(data: Partial<Data>, config: Config, metadata?: Metadata, onResolveStart?: (item: ComponentData) => void, onResolveEnd?: (item: ComponentData) => void): Promise<Data<Components, RootProps>>;
-
-type WalkTreeOptions = {
-    parentId: string;
-    propName: string;
-};
-declare function walkTree<T extends ComponentData | RootData | G["UserData"], UserConfig extends Config = Config, G extends UserGenerics<UserConfig> = UserGenerics<UserConfig>>(data: T, config: UserConfig, callbackFn: (data: Content, options: WalkTreeOptions) => Content | null | void): T;
-
-export { type MappedItem as $, type AppState as A, type ArrayState as B, type Config as C, type DropZoneProps as D, type SlotComponent as E, type Fields as F, type PuckComponent as G, type History as H, type IframeConfig as I, type ComponentConfigExtensions as J, type RootConfig as K, type DefaultComponents as L, type Metadata as M, type ExtractConfigParams as N, type Overrides as O, type Permissions as P, type ConfigParams as Q, type RootDataWithProps as R, type Slot as S, type ComponentConfigParams as T, type UserGenerics as U, type Viewports as V, type WithSlotProps as W, type BaseData as X, type RootDataWithoutProps as Y, type RootData as Z, type ComponentDataOptionalId as _, type ComponentData as a, type ComponentDataMap as a0, type Content as a1, type PuckMetadata as a2, type ComponentMetadata as a3, type FieldMetadata as a4, type BaseField as a5, type TextField as a6, type NumberField as a7, type TextareaField as a8, type SelectField as a9, type RadioField as aa, type ArrayField as ab, type ObjectField as ac, type Adaptor as ad, type ExternalFieldWithAdaptor as ae, type CacheOpts as af, type ExternalField as ag, type CustomFieldRender as ah, type CustomField as ai, type SlotField as aj, type PuckContext as ak, type DefaultRootFieldProps as al, type DefaultRootRenderProps as am, type DefaultRootProps as an, type DefaultComponentProps as ao, type WithId as ap, type WithPuckProps as aq, type AsFieldProps as ar, type WithChildren as as, type ExtractField as at, type PuckAction as b, type ResolveDataTrigger as c, type Plugin as d, type UiState as e, type ComponentConfig as f, type FieldTransforms as g, type Field as h, type FieldProps as i, type Data as j, type OnAction as k, type InitialHistory as l, migrate as m, type ItemSelector as n, type Direction as o, type DragAxis as p, type Viewport as q, resolveAllData as r, type FieldTransformFnParams as s, transformProps as t, type FieldTransformFn as u, overrideKeys as v, walkTree as w, type OverrideKey as x, type FieldRenderFunctions as y, type ItemWithId as z };
+export { type BaseData as $, type AppState as A, type FieldTransformFn as B, type Config as C, type Data as D, overrideKeys as E, type Fields as F, type OverrideKey as G, type History as H, type IframeConfig as I, type FieldRenderFunctions as J, type ItemWithId as K, type ArrayState as L, type Metadata as M, type SlotComponent as N, type OnAction as O, type PrivateAppState as P, type PuckComponent as Q, type RootData as R, type Slot as S, type ComponentConfigExtensions as T, type UserGenerics as U, type Viewports as V, type WithId as W, type RootConfig as X, type ExtractConfigParams as Y, type ConfigParams as Z, type ComponentConfigParams as _, type PuckAction as a, type RootDataWithoutProps as a0, type ComponentDataOptionalId as a1, type MappedItem as a2, type ComponentDataMap as a3, type PuckMetadata as a4, type ComponentMetadata as a5, type FieldMetadata as a6, type BaseField as a7, type TextField as a8, type NumberField as a9, type TextareaField as aa, type SelectField as ab, type RadioField as ac, type ArrayField as ad, type ObjectField as ae, type Adaptor as af, type ExternalFieldWithAdaptor as ag, type CacheOpts as ah, type ExternalField as ai, type CustomFieldRender as aj, type CustomField as ak, type SlotField as al, type PuckContext as am, type DefaultRootRenderProps as an, type DefaultRootProps as ao, type WithPuckProps as ap, type AsFieldProps as aq, type WithChildren as ar, type ExtractField as as, type Content as b, type ComponentData as c, type DefaultComponents as d, type DefaultComponentProps as e, type DefaultRootFieldProps as f, type Permissions as g, type RootDataWithProps as h, type ResolveDataTrigger as i, type Plugin as j, type Overrides as k, type UiState as l, type ComponentConfig as m, type FieldTransforms as n, type RichtextField as o, type Field as p, type FieldProps as q, type DropZoneProps as r, type InitialHistory as s, type ItemSelector as t, type WithSlotProps as u, type RichText as v, type Direction as w, type DragAxis as x, type Viewport as y, type FieldTransformFnParams as z };

package/dist/chunk-2Q4PACDA.mjs

@@ -0,0 +1,111 @@
+import {
+  styles_module_default
+} from "./chunk-CSSRLPHM.mjs";
+import {
+  LoadedRichTextMenuInner
+} from "./chunk-BSDEIOEK.mjs";
+import {
+  useAppStore,
+  useAppStoreApi
+} from "./chunk-DAQLMM2T.mjs";
+import {
+  get_class_name_factory_default
+} from "./chunk-Y2EFNT5P.mjs";
+import {
+  __spreadValues,
+  init_react_import
+} from "./chunk-M6W7YEVX.mjs";
+
+// components/RichTextEditor/components/EditorInner.tsx
+init_react_import();
+import {
+  memo,
+  useCallback
+} from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var getClassName = get_class_name_factory_default("RichTextEditor", styles_module_default);
+var EditorInner = memo(
+  ({
+    children,
+    menu,
+    readOnly = false,
+    field,
+    inline = false,
+    editor,
+    id
+  }) => {
+    const { initialHeight } = field;
+    const isActive = useAppStore(
+      (s) => {
+        var _a;
+        return ((_a = s.currentRichText) == null ? void 0 : _a.id) === id && inline === s.currentRichText.inline;
+      }
+    );
+    const appStoreApi = useAppStoreApi();
+    const handleHotkeyCapture = useCallback(
+      (event) => {
+        var _a, _b;
+        if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === "i") {
+          event.stopPropagation();
+          event.preventDefault();
+          (_b = editor == null ? void 0 : (_a = editor.commands).toggleItalic) == null ? void 0 : _b.call(_a);
+        }
+      },
+      [editor]
+    );
+    const handleBlur = useCallback(
+      (e) => {
+        var _a, _b;
+        const targetInMenu = !!((_b = (_a = e.relatedTarget) == null ? void 0 : _a.closest) == null ? void 0 : _b.call(
+          _a,
+          "[data-puck-rte-menu]"
+        ));
+        if (e.relatedTarget && !targetInMenu) {
+          appStoreApi.setState({
+            currentRichText: null
+          });
+        } else {
+          e.stopPropagation();
+        }
+      },
+      [appStoreApi]
+    );
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: getClassName({
+          editor: !inline,
+          inline,
+          isActive,
+          disabled: readOnly
+        }),
+        style: inline ? {} : { height: initialHeight != null ? initialHeight : 192, overflowY: "auto" },
+        onKeyDownCapture: handleHotkeyCapture,
+        onBlur: handleBlur,
+        children: [
+          !inline && /* @__PURE__ */ jsx("div", { className: getClassName("menu"), children: menu }),
+          children
+        ]
+      }
+    );
+  }
+);
+EditorInner.displayName = "EditorInner";
+
+// components/RichTextMenu/index.tsx
+init_react_import();
+import { lazy, Suspense } from "react";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var LoadedRichTextMenuFull = lazy(
+  () => import("./full-BEMDJKDS.mjs").then((m) => ({
+    default: m.LoadedRichTextMenuFull
+  }))
+);
+var LoadedRichTextMenu = (props) => {
+  return /* @__PURE__ */ jsx2(Suspense, { fallback: /* @__PURE__ */ jsx2(LoadedRichTextMenuInner, __spreadValues({}, props)), children: /* @__PURE__ */ jsx2(LoadedRichTextMenuFull, __spreadValues({}, props)) });
+};
+
+export {
+  EditorInner,
+  LoadedRichTextMenu
+};

package/dist/chunk-62AAYNXG.mjs

@@ -0,0 +1,63 @@
+import {
+  Heading1,
+  Heading2,
+  Heading3,
+  Heading4,
+  Heading5,
+  Heading6
+} from "./chunk-DAQLMM2T.mjs";
+import {
+  init_react_import
+} from "./chunk-M6W7YEVX.mjs";
+
+// components/RichTextMenu/controls/HeadingSelect/use-options.ts
+init_react_import();
+import { useMemo } from "react";
+var optionNodes = {
+  h1: { label: "Heading 1", icon: Heading1 },
+  h2: { label: "Heading 2", icon: Heading2 },
+  h3: { label: "Heading 3", icon: Heading3 },
+  h4: { label: "Heading 4", icon: Heading4 },
+  h5: { label: "Heading 5", icon: Heading5 },
+  h6: { label: "Heading 6", icon: Heading6 }
+};
+var useHeadingOptions = (fieldOptions) => {
+  var _a;
+  let blockOptions = [];
+  if ((fieldOptions == null ? void 0 : fieldOptions.heading) !== false) {
+    if (!((_a = fieldOptions == null ? void 0 : fieldOptions.heading) == null ? void 0 : _a.levels)) {
+      blockOptions = ["h1", "h2", "h3", "h4", "h5", "h6"];
+    } else {
+      if (fieldOptions == null ? void 0 : fieldOptions.heading.levels.includes(1)) {
+        blockOptions.push("h1");
+      }
+      if (fieldOptions == null ? void 0 : fieldOptions.heading.levels.includes(2)) {
+        blockOptions.push("h2");
+      }
+      if (fieldOptions == null ? void 0 : fieldOptions.heading.levels.includes(3)) {
+        blockOptions.push("h3");
+      }
+      if (fieldOptions == null ? void 0 : fieldOptions.heading.levels.includes(4)) {
+        blockOptions.push("h4");
+      }
+      if (fieldOptions == null ? void 0 : fieldOptions.heading.levels.includes(5)) {
+        blockOptions.push("h5");
+      }
+      if (fieldOptions == null ? void 0 : fieldOptions.heading.levels.includes(6)) {
+        blockOptions.push("h6");
+      }
+    }
+  }
+  return useMemo(
+    () => blockOptions.map((item) => ({
+      value: item,
+      label: optionNodes[item].label,
+      icon: optionNodes[item].icon
+    })),
+    [blockOptions]
+  );
+};
+
+export {
+  useHeadingOptions
+};