@wix/editor 1.562.0 → 1.563.0

package/dist/statics/index.js

@@ -638,9 +638,11 @@
       );
     }
     /**
-     * Retrieves the data item definitions declared in the component's manifest.
+     * Lists the data fields defined on the selected component's manifest.
      *
-     * @returns Data item definitions keyed by data item key.
+     * Each key in the result is a valid **`dataItemKey`** for `getData`, `setData`, and `getResolvedData`.
+     *
+     * @returns Definitions keyed by `dataItemKey`.
      *
      * @example
      * ```ts
@@ -679,19 +681,21 @@
       );
     }
     /**
-     * Retrieves the resolved value of a specific data item.
+     * Returns one data field from the selected component by **`dataItemKey`**.
+     *
+     * A **`dataItemKey`** is the property name of a data field in that component's manifest — the same names
+     * returned from `getDataDefinitions`. Example: `'heroImage'` for a field declared under `editorElement.data`.
      *
-     * Unlike {@link getData}, this method returns the fully resolved value
-     * for a single data item.
+     * `getData` returns all fields at once. This method returns only the field you name.
      *
-     * @param options - Object containing the `dataItemKey` to resolve.
-     * @returns Resolved value for the specified data item.
+     * @param options.dataItemKey - Key of the data field to read. Must exist on the component manifest.
+     * @returns Value for that data field.
      *
      * @example
      * ```ts
      * import { reactElements } from '@wix/editor';
      *
-     * const resolved = await reactElements.getResolvedData({
+     * const hero = await reactElements.getResolvedData({
      *   dataItemKey: 'heroImage',
      * });
      * ```
@@ -733,7 +737,7 @@
     /**
      * Retrieves the preset definitions declared in the component's manifest.
      *
-     * @returns Preset definitions keyed by preset key.
+     * @returns An object mapping each preset key to its definition.
      *
      * @example
      * ```ts
@@ -840,7 +844,7 @@
       );
     }
     /**
-     * Retrieves the currently active state for the component.
+     * Retrieves the active state for the component.
      *
      * @returns Key of the active state, or `null` if the default state is active.
      *
@@ -886,7 +890,7 @@
     /**
      * Retrieves the state definitions declared in the component's manifest.
      *
-     * @returns State definitions keyed by state key.
+     * @returns An object mapping each state key to its definition.
      *
      * @example
      * ```ts
@@ -935,22 +939,21 @@
       );
     }
     /**
-     * Opens the font picker for selecting a font family and weight.
+     * Opens the font picker for selecting a font family and weight from a custom panel.
      *
-     * Pass `styleItemKey` to bind the picker to a manifest style item,
-     * or pass manual options to handle the selection via callbacks.
+     * Pass `target` and `panelOptions` to position the popup next to the control that opened it.
+     * Use `onChange` / `onPreview` to handle the selection; the editor does not write to the manifest for you.
      *
-     * @param params - `styleItemKey` for manifest binding, or manual picker options.
+     * @param params - Picker options.
      * @returns Selected font family and weight, or `undefined` if dismissed.
      *
      * @example
      * ```ts
      * import { reactElements } from '@wix/editor';
      *
-     * const font = await reactElements.selectFont({ styleItemKey: 'headingFont' });
-     *
      * const font = await reactElements.selectFont({
      *   selectedFontFamily: { family: 'Arial', weight: '400' },
+     *   target: buttonRef.current,
      *   onChange: (value) => console.log('Selected:', value),
      * });
      * ```
@@ -972,21 +975,20 @@
       }
     }
     /**
-     * Opens the font family picker for selecting a font family without
-     * weight options. Works the same as {@link selectFont} but without
-     * the weight selector.
+     * Opens the font family picker without weight selection, from a custom panel.
+     *
+     * Same pattern as {@link selectFont}: `target`, `panelOptions`, and callbacks.
      *
-     * @param params - `styleItemKey` for manifest binding, or manual picker options.
+     * @param params - Picker options.
      * @returns Selected font family, or `undefined` if dismissed.
      *
      * @example
      * ```ts
      * import { reactElements } from '@wix/editor';
      *
-     * const font = await reactElements.selectFontFamily({ styleItemKey: 'bodyFont' });
-     *
      * const font = await reactElements.selectFontFamily({
      *   selectedFontFamily: { family: 'Helvetica', weight: '400' },
+     *   target: buttonRef.current,
      *   onChange: (value) => console.log('Selected:', value.family),
      * });
      * ```
@@ -1008,21 +1010,15 @@
       }
     }
     /**
-     * Opens the media picker for selecting images, videos, or other media
-     * from the Wix Media Manager.
-     *
-     * Pass `dataItemKey` to bind the picker to a manifest data item,
-     * or pass manual options to configure the picker.
+     * Opens the media picker for selecting images, videos, or other media from a custom panel.
      *
-     * @param params - `dataItemKey` for manifest binding, or manual picker options.
+     * @param params - Picker options.
      * @returns Selected media items.
      *
      * @example
      * ```ts
      * import { reactElements } from '@wix/editor';
      *
-     * const media = await reactElements.selectMedia({ dataItemKey: 'heroImage' });
-     *
      * const media = await reactElements.selectMedia({
      *   isMultiSelect: true,
      *   category: 'image',
@@ -1039,20 +1035,15 @@
       );
     }
     /**
-     * Opens the link picker for creating or editing a link.
-     *
-     * Pass `dataItemKey` to bind the picker to a manifest data item,
-     * or pass a `value` and optional `linkTypes` to configure manually.
+     * Opens the link picker for creating or editing a link from a custom panel.
      *
-     * @param params - `dataItemKey` for manifest binding, or manual picker options.
+     * @param params - Picker options.
      * @returns Selected link, or `null`/`undefined` if dismissed.
      *
      * @example
      * ```ts
      * import { reactElements } from '@wix/editor';
      *
-     * const link = await reactElements.selectLink({ dataItemKey: 'buttonLink' });
-     *
      * const link = await reactElements.selectLink({
      *   value: currentLink,
      *   options: { linkTypes: ['ExternalLink', 'PageLink'] },
@@ -1069,20 +1060,15 @@
       );
     }
     /**
-     * Opens the color picker for selecting a color.
-     *
-     * Pass `styleItemKey` to bind the picker to a manifest style item,
-     * or pass manual options to configure the picker.
+     * Opens the color picker for selecting a color from a custom panel.
      *
-     * @param params - `styleItemKey` for manifest binding, or manual picker options.
+     * @param params - Picker options.
      * @returns Selected color value, or `undefined` if dismissed.
      *
      * @example
      * ```ts
      * import { reactElements } from '@wix/editor';
      *
-     * const color = await reactElements.selectColor({ styleItemKey: 'backgroundColor' });
-     *
      * const color = await reactElements.selectColor({
      *   initialValue: '#ff0000',
      *   mode: ['solid', 'gradient'],
@@ -1132,13 +1118,9 @@
       );
     }
     /**
-     * Opens the font weight picker for selecting a font weight for a specified
-     * font family.
-     *
-     * Pass manifest style item keys to bind the picker, or pass manual
-     * options to handle the selection via callbacks.
+     * Opens the font weight picker for a specified font family, from a custom panel.
      *
-     * @param params - Manifest style item keys, or manual picker options.
+     * @param params - Picker options.
      * @returns Selected font weight.
      *
      * @example
@@ -1146,12 +1128,8 @@
      * import { reactElements } from '@wix/editor';
      *
      * const weight = await reactElements.selectFontWeight({
-     *   fontFamilyStyleItemKey: 'headingFontFamily',
-     *   fontWeightStyleItemKey: 'headingFontWeight',
-     * });
-     *
-     * const weight = await reactElements.selectFontWeight({
      *   fontFamily: { family: 'Arial', weight: '400' },
+     *   target: buttonRef.current,
      *   onChange: (value) => console.log('Selected weight:', value.weight),
      * });
      * ```
@@ -1168,11 +1146,9 @@
       };
     }
     /**
-     * Opens the text theme picker for selecting a predefined text theme
-     * (a combination of font and color from the site's theme).
+     * Opens the text theme picker from a custom panel — a site theme combination of font and color.
      *
-     * @param params - Text theme picker configuration.
-     * @param params.target - HTML element to anchor the picker to.
+     * @param params - Picker options. Pass `target` for the element in your panel that opened the picker.
      * @param params.initialValue - Initial font and color values.
      * @returns Selected text theme.
      *
@@ -1181,6 +1157,7 @@
      * import { reactElements } from '@wix/editor';
      *
      * const theme = await reactElements.selectTextTheme({
+     *   target: buttonRef.current,
      *   initialValue: { font: 'Heading 1', color: '#333' },
      * });
      * ```