@elementor/editor-controls 4.1.0-711 → 4.1.0-713

package/dist/index.d.mts

@@ -2,6 +2,7 @@ import * as React$1 from 'react';
 import { RefObject, ReactNode, FC, PropsWithChildren, ComponentProps, Dispatch, SetStateAction, ComponentType } from 'react';
 import { SxProps, SelectProps, UnstableColorFieldProps, StackProps, ToggleButtonProps, PopupState, Theme, FormLabelProps, Grid, TextFieldProps } from '@elementor/ui';
 import { StringPropValue, PropTypeUtil, PropValue, PropKey, LinkPropValue, TransformablePropValue, PropType, CreateOptions, SizePropValue } from '@elementor/editor-props';
+import * as _emotion_styled from '@emotion/styled';
 import { StyleDefinitionState } from '@elementor/editor-styles';
 import { EditorProps, EditorView } from '@tiptap/pm/view';
 import { Editor } from '@tiptap/react';
@@ -28,25 +29,25 @@ declare const TextControl: ControlComponent$1<({ placeholder, error, inputValue,
     ariaLabel?: string;
 }) => React$1.JSX.Element>;
 
-type Props$9 = {
+type Props$b = {
     placeholder?: string;
     ariaLabel?: string;
 };
-declare const TextAreaControl: ControlComponent$1<({ placeholder, ariaLabel }: Props$9) => React$1.JSX.Element>;
+declare const TextAreaControl: ControlComponent$1<({ placeholder, ariaLabel }: Props$b) => React$1.JSX.Element>;
 
 declare const lengthUnits: readonly ["px", "%", "em", "rem", "vw", "vh", "ch"];
 declare const angleUnits: readonly ["deg", "rad", "grad", "turn"];
 declare const timeUnits: readonly ["s", "ms"];
 declare const defaultExtendedOptions: readonly ["auto", "custom"];
-type LengthUnit = (typeof lengthUnits)[number];
-type AngleUnit = (typeof angleUnits)[number];
-type TimeUnit = (typeof timeUnits)[number];
+type LengthUnit$1 = (typeof lengthUnits)[number];
+type AngleUnit$1 = (typeof angleUnits)[number];
+type TimeUnit$1 = (typeof timeUnits)[number];
 type ExtendedOption = (typeof defaultExtendedOptions)[number];
-type Unit = LengthUnit | AngleUnit | TimeUnit;
-declare function isUnitExtendedOption(unit: Unit | ExtendedOption): unit is ExtendedOption;
+type Unit$1 = LengthUnit$1 | AngleUnit$1 | TimeUnit$1;
+declare function isUnitExtendedOption(unit: Unit$1 | ExtendedOption): unit is ExtendedOption;
 
-type SizeVariant = 'length' | 'angle' | 'time';
-type UnitProps<T extends readonly Unit[]> = {
+type SizeVariant$1 = 'length' | 'angle' | 'time';
+type UnitProps<T extends readonly Unit$1[]> = {
     units?: T;
     defaultUnit?: T[number];
 };
@@ -61,18 +62,18 @@ type BaseSizeControlProps = {
     id?: string;
     ariaLabel?: string;
 };
-type LengthSizeControlProps = BaseSizeControlProps & UnitProps<LengthUnit[]> & {
+type LengthSizeControlProps = BaseSizeControlProps & UnitProps<LengthUnit$1[]> & {
     variant: 'length';
 };
-type AngleSizeControlProps = BaseSizeControlProps & UnitProps<AngleUnit[]> & {
+type AngleSizeControlProps = BaseSizeControlProps & UnitProps<AngleUnit$1[]> & {
     variant: 'angle';
 };
-type TimeSizeControlProps = BaseSizeControlProps & UnitProps<TimeUnit[]> & {
+type TimeSizeControlProps = BaseSizeControlProps & UnitProps<TimeUnit$1[]> & {
     variant: 'time';
 };
 type SizeControlProps = LengthSizeControlProps | AngleSizeControlProps | TimeSizeControlProps;
 declare const SizeControl: ControlComponent$1<({ variant, defaultUnit, units, placeholder, startIcon, anchorRef, extendedOptions, disableCustom, min, enablePropTypeUnits, id, ariaLabel, }: Omit<SizeControlProps, "variant"> & {
-    variant?: SizeVariant;
+    variant?: SizeVariant$1;
 }) => React$1.JSX.Element>;
 
 declare const StrokeControl: ControlComponent$1<() => React$1.JSX.Element>;
@@ -115,12 +116,12 @@ type ChipsControlProps = {
 };
 declare const ChipsControl: ControlComponent$1<({ options }: ChipsControlProps) => React$1.JSX.Element>;
 
-type Props$8 = Partial<Omit<UnstableColorFieldProps, 'value' | 'onChange'>> & {
+type Props$a = Partial<Omit<UnstableColorFieldProps, 'value' | 'onChange'>> & {
     propTypeUtil?: PropTypeUtil<string, string>;
     anchorEl?: HTMLElement | null;
     id?: string;
 };
-declare const ColorControl: ControlComponent$1<({ propTypeUtil, anchorEl, slotProps, id, ...props }: Props$8) => React$1.JSX.Element>;
+declare const ColorControl: ControlComponent$1<({ propTypeUtil, anchorEl, slotProps, id, ...props }: Props$a) => React$1.JSX.Element>;
 
 type RenderContentProps = {
     size: ToggleButtonProps['size'];
@@ -132,9 +133,15 @@ type ToggleButtonGroupItem<TValue> = {
     renderContent: ({ size }: RenderContentProps) => React$1.ReactNode;
     showTooltip?: boolean;
 };
+declare const StyledToggleButtonGroup: _emotion_styled.StyledComponent<any, {}, {
+    ref?: React$1.Ref<any> | undefined;
+}>;
+declare const StyledToggleButton: _emotion_styled.StyledComponent<any, {}, {
+    ref?: React$1.Ref<any> | undefined;
+}>;
 type ExclusiveValue<TValue> = TValue;
 type NonExclusiveValue<TValue> = TValue[];
-type Props$7<TValue> = {
+type Props$9<TValue> = {
     disabled?: boolean;
     justify?: StackProps['justifyContent'];
     size?: ToggleButtonProps['size'];
@@ -151,10 +158,10 @@ type Props$7<TValue> = {
     value: ExclusiveValue<TValue>;
     onChange: (value: ExclusiveValue<TValue>) => void;
 });
-declare const ToggleButtonGroupUi: <TValue>(props: Props$7<TValue> & {
+declare const ToggleButtonGroupUi: <TValue>(props: Props$9<TValue> & {
     ref?: React$1.Ref<HTMLDivElement>;
 }) => React$1.ReactElement;
-declare const ControlToggleButtonGroup: <TValue>(props: Props$7<TValue>) => React$1.JSX.Element;
+declare const ControlToggleButtonGroup: <TValue>(props: Props$9<TValue>) => React$1.JSX.Element;
 
 type ToggleControlProps<T extends PropValue> = {
     options: Array<ToggleButtonGroupItem<T> & {
@@ -185,22 +192,22 @@ type Item$1 = {
     bind: PropKey;
 };
 type EqualUnequalItems = [Item$1, Item$1, Item$1, Item$1];
-type Props$6<TMultiPropType extends string, TPropValue extends MultiSizePropValue> = {
+type Props$8<TMultiPropType extends string, TPropValue extends MultiSizePropValue> = {
     label: string;
     icon: ReactNode;
     tooltipLabel: string;
     items: EqualUnequalItems;
     multiSizePropTypeUtil: PropTypeUtil<TMultiPropType, TPropValue>;
 };
-declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$6<TMultiPropType, TPropValue>): React$1.JSX.Element;
+declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$8<TMultiPropType, TPropValue>): React$1.JSX.Element;
 
-type Props$5 = {
+type Props$7 = {
     label: string;
     isSiteRtl?: boolean;
     extendedOptions?: ExtendedOption[];
     min?: number;
 };
-declare const LinkedDimensionsControl: ({ label, isSiteRtl, extendedOptions, min }: Props$5) => React$1.JSX.Element;
+declare const LinkedDimensionsControl: ({ label, isSiteRtl, extendedOptions, min }: Props$7) => React$1.JSX.Element;
 
 type FontCategory = {
     label: string;
@@ -253,7 +260,7 @@ type ControlProps<TControlProps = unknown> = TControlProps & {
     };
 };
 
-type Props$4 = ControlProps<{
+type Props$6 = ControlProps<{
     queryOptions: {
         params: Record<string, unknown>;
         url: string;
@@ -265,21 +272,21 @@ type Props$4 = ControlProps<{
     ariaLabel?: string;
 }>;
 type DestinationProp = LinkPropValue['value']['destination'];
-declare const LinkControl: ControlComponent$1<(props: Props$4) => React$1.JSX.Element>;
+declare const LinkControl: ControlComponent$1<(props: Props$6) => React$1.JSX.Element>;
 
 type SelectOption = {
     label: string;
     value: StringPropValue['value'];
     disabled?: boolean;
 };
-type Props$3 = {
+type Props$5 = {
     options: SelectOption[];
     onChange?: (newValue: string | null, previousValue: string | null | undefined) => void;
     fallbackLabels?: Record<string, string>;
 };
-declare const HtmlTagControl: ControlComponent$1<({ options, onChange, fallbackLabels }: Props$3) => React$1.JSX.Element>;
+declare const HtmlTagControl: ControlComponent$1<({ options, onChange, fallbackLabels }: Props$5) => React$1.JSX.Element>;
 
-type Props$2 = {
+type Props$4 = {
     queryOptions: {
         params: Record<string, unknown>;
         url: string;
@@ -290,7 +297,7 @@ type Props$2 = {
     onSetValue?: (value: DestinationProp | null) => void;
     ariaLabel?: string;
 };
-declare const QueryControl: ControlComponent$1<(props: Props$2) => React$1.JSX.Element>;
+declare const QueryControl: ControlComponent$1<(props: Props$4) => React$1.JSX.Element>;
 
 declare const GapControl: ({ label }: {
     label: string;
@@ -408,47 +415,6 @@ declare const InlineEditingControl: ControlComponent$1<({ sx, attributes, props,
 
 declare const EmailFormActionControl: ControlComponent$1<() => React$1.JSX.Element>;
 
-declare const ControlFormLabel: (props: FormLabelProps) => React$1.JSX.Element;
-
-declare const DisplayConditionsControl: ControlComponent$1<() => React$1.JSX.Element>;
-
-declare const AttributesControl: ControlComponent$1<() => React$1.JSX.Element>;
-
-type PromotionTrackingData = {
-    target_name: string;
-    target_location?: 'widget_panel' | 'variables_manager';
-    location_l1?: string;
-    location_l2?: 'style' | 'general' | 'interactions';
-};
-declare const trackViewPromotion: (data: PromotionTrackingData) => void;
-declare const trackUpgradePromotionClick: (data: PromotionTrackingData) => void;
-
-type V4PromotionData = {
-    title: string;
-    content: string;
-    image: string;
-    ctaUrl: string;
-};
-type V4PromotionKey = 'displayConditions' | 'customCss' | 'attributes';
-
-type PromotionTriggerProps = {
-    promotionKey: V4PromotionKey;
-    children?: ReactNode;
-    trackingData: PromotionTrackingData;
-};
-type PromotionTriggerRef = {
-    toggle: () => void;
-};
-declare const PromotionTrigger: React$1.ForwardRefExoticComponent<PromotionTriggerProps & React$1.RefAttributes<PromotionTriggerRef>>;
-
-type ClearIconButtonProps = {
-    onClick?: () => void;
-    tooltipText: React$1.ReactNode;
-    disabled?: boolean;
-    size?: 'tiny' | 'small' | 'medium' | 'large';
-};
-declare const ClearIconButton: ({ tooltipText, onClick, disabled, size }: ClearIconButtonProps) => React$1.JSX.Element;
-
 type Action = {
     type: string;
     payload?: object;
@@ -504,6 +470,67 @@ type EnhancedPropKeyContextValue<T, P> = PropKeyContextValue<T, P> & {
 declare function useBoundProp<T extends PropValue = PropValue, P extends PropType = PropType>(): EnhancedPropKeyContextValue<T, P>;
 declare function useBoundProp<TKey extends string, TValue extends PropValue>(propTypeUtil: PropTypeUtil<TKey, TValue>): UseBoundProp<TValue>;
 
+type LengthUnit = 'px' | '%' | 'em' | 'rem' | 'vw' | 'vh' | 'ch';
+type AngleUnit = 'deg' | 'rad' | 'grad' | 'turn';
+type TimeUnit = 's' | 'ms';
+type ExtendedSizeOption = 'auto' | 'custom';
+type Unit = LengthUnit | AngleUnit | TimeUnit;
+type SizeUnit$1 = Unit | ExtendedSizeOption;
+type SizeVariant = 'length' | 'angle' | 'time';
+type SetSizeValue<T> = (value: T, options?: CreateOptions, meta?: SetValueMeta) => void;
+
+type Props$3 = {
+    placeholder?: string;
+    variant?: SizeVariant;
+    anchorRef?: RefObject<HTMLDivElement | null>;
+    startIcon?: React$1.ReactNode;
+    ariaLabel?: string;
+    min?: number;
+    id?: string;
+};
+declare const UnstableSizeControl: ControlComponent$1<({ variant, placeholder: propPlaceholder, anchorRef, startIcon, ariaLabel, min }: Props$3) => React$1.JSX.Element>;
+
+declare const ControlFormLabel: (props: FormLabelProps) => React$1.JSX.Element;
+
+declare const DisplayConditionsControl: ControlComponent$1<() => React$1.JSX.Element>;
+
+declare const AttributesControl: ControlComponent$1<() => React$1.JSX.Element>;
+
+type PromotionTrackingData = {
+    target_name: string;
+    target_location?: 'widget_panel' | 'variables_manager';
+    location_l1?: string;
+    location_l2?: 'style' | 'general' | 'interactions';
+};
+declare const trackViewPromotion: (data: PromotionTrackingData) => void;
+declare const trackUpgradePromotionClick: (data: PromotionTrackingData) => void;
+
+type V4PromotionData = {
+    title: string;
+    content: string;
+    image: string;
+    ctaUrl: string;
+};
+type V4PromotionKey = 'displayConditions' | 'customCss' | 'attributes';
+
+type PromotionTriggerProps = {
+    promotionKey: V4PromotionKey;
+    children?: ReactNode;
+    trackingData: PromotionTrackingData;
+};
+type PromotionTriggerRef = {
+    toggle: () => void;
+};
+declare const PromotionTrigger: React$1.ForwardRefExoticComponent<PromotionTriggerProps & React$1.RefAttributes<PromotionTriggerRef>>;
+
+type ClearIconButtonProps = {
+    onClick?: () => void;
+    tooltipText: React$1.ReactNode;
+    disabled?: boolean;
+    size?: 'tiny' | 'small' | 'medium' | 'large';
+};
+declare const ClearIconButton: ({ tooltipText, onClick, disabled, size }: ClearIconButtonProps) => React$1.JSX.Element;
+
 type AnchorEl = HTMLElement | null;
 type RepeaterItem<T> = {
     disabled?: boolean;
@@ -621,20 +648,63 @@ type InlineEditorToolbarProps = {
 };
 declare const InlineEditorToolbar: ({ editor, elementId, sx }: InlineEditorToolbarProps) => React$1.JSX.Element;
 
-type Props$1<TValue> = {
+type Props$2<TValue> = {
     value: TValue;
-    units: Unit[];
-    defaultUnit?: Unit;
+    units: Unit$1[];
+    defaultUnit?: Unit$1;
     onChange: (value: TValue) => void;
     onBlur?: (event: React$1.FocusEvent<HTMLInputElement>) => void;
     disabled?: boolean;
     InputProps?: TextFieldProps['InputProps'];
     startIcon?: React$1.ReactNode;
 };
-declare const UnstableSizeField: <T extends SizePropValue["value"]>({ value, InputProps, onChange, onBlur, units, defaultUnit, startIcon, }: Props$1<T>) => React$1.JSX.Element;
+declare const UnstableSizeField: <T extends SizePropValue["value"]>({ value, InputProps, onChange, onBlur, units, defaultUnit, startIcon, }: Props$2<T>) => React$1.JSX.Element;
 
 declare const NumberInput: React$1.ForwardRefExoticComponent<(Omit<_mui_material.FilledTextFieldProps, "ref"> | Omit<_mui_material.OutlinedTextFieldProps, "ref"> | Omit<_mui_material.StandardTextFieldProps, "ref">) & React$1.RefAttributes<unknown>>;
 
+type UnitSelectorProps<T extends string> = {
+    options: T[];
+    value: T;
+    onSelect: (value: T) => void;
+    isActive: boolean;
+    menuItemsAttributes?: {
+        [key in T]?: Record<string, unknown>;
+    };
+    optionLabelOverrides?: {
+        [key in T]?: React$1.ReactNode;
+    };
+    disabled?: boolean;
+};
+
+type SizeFieldProps<TValue extends SizePropValue['value'], TUnit extends SizeUnit$1> = {
+    units: TUnit[];
+    value: TValue | null;
+    placeholder?: string;
+    defaultUnit?: SizeUnit$1;
+    startIcon?: React$1.ReactNode;
+    setValue: SetSizeValue<TValue>;
+    onBlur?: (event: React$1.FocusEvent<HTMLInputElement>) => void;
+    onKeyDown?: (event: React$1.KeyboardEvent<HTMLInputElement>) => void;
+    onUnitChange?: (unit: SizeUnit$1) => void;
+    disabled?: boolean;
+    focused?: boolean;
+    ariaLabel?: string;
+    min?: number;
+    InputProps?: TextFieldProps['InputProps'];
+    unitSelectorProps?: Partial<UnitSelectorProps<TUnit>>;
+};
+
+type SizeValue = SizePropValue['value'];
+type SizeUnit = SizePropValue['value']['unit'];
+type Props$1 = SizeFieldProps<SizeValue, SizeUnit> & {
+    anchorRef?: RefObject<HTMLDivElement | null>;
+    isUnitActive?: boolean;
+    SizeFieldWrapper?: React$1.ComponentType<{
+        children: React$1.ReactNode;
+    }>;
+};
+declare const SizeComponent: ({ anchorRef, isUnitActive, SizeFieldWrapper, ...sizeFieldProps }: Props$1) => React$1.JSX.Element;
+
 type AnyComponentType = ComponentType<any>;
 declare const brandSymbol: unique symbol;
 type ControlComponent$1<TComponent extends AnyComponentType = AnyComponentType> = TComponent & {
@@ -738,4 +808,4 @@ declare function useTypingBuffer(options?: UseTypingBufferOptions): {
     startsWith: (haystack: string, needle: string) => boolean;
 };
 
-export { type AdornmentComponent, type AngleUnit, AspectRatioControl, AttributesControl, BackgroundControl, BoxShadowRepeaterControl, ChipsControl, ClearIconButton, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent$1 as ControlComponent, ControlFormLabel, type ControlReplacement, ControlReplacementsProvider, ControlToggleButtonGroup, DateTimeControl, DisplayConditionsControl, EmailFormActionControl, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedOption, FilterRepeaterControl, type FontCategory, FontFamilyControl, GapControl, HtmlTagControl, ImageControl, InlineEditingControl, InlineEditor, InlineEditorToolbar, type InlineEditorToolbarProps, ItemSelector, type ItemsActionPayload, KeyValueControl, type LengthUnit, LinkControl, LinkedDimensionsControl, NumberControl, NumberInput, PopoverContent, PopoverGridContainer, PositionControl, type PromotionTrackingData, PromotionTrigger, type PromotionTriggerRef, PropKeyProvider, PropProvider, type PropProviderProps, QueryControl, RepeatableControl, Repeater, type RepeaterItem, SelectControl, SelectControlWrapper, type SetRepeaterValuesMeta, type SetValue, type SetValueMeta, SizeControl, StrokeControl, SvgMediaControl, SwitchControl, TextAreaControl, TextControl, type TimeUnit, type ToggleButtonGroupItem, ToggleButtonGroupUi, ToggleControl, type ToggleControlProps, TransformRepeaterControl, TransformSettingsControl, TransitionRepeaterControl, type Unit, UnstableSizeField, UrlControl, type UseTypingBufferOptions, type V4PromotionData, type V4PromotionKey, VideoMediaControl, createControl, createControlReplacementsRegistry, enqueueFont, getControlReplacements, injectIntoRepeaterItemActions, injectIntoRepeaterItemIcon, injectIntoRepeaterItemLabel, isUnitExtendedOption, registerControlReplacement, trackUpgradePromotionClick, trackViewPromotion, transitionProperties, transitionsItemsList, useBoundProp, useControlActions, useControlReplacement, useFontFamilies, useSyncExternalState, useTypingBuffer };
+export { type AdornmentComponent, type AngleUnit$1 as AngleUnit, AspectRatioControl, AttributesControl, BackgroundControl, BoxShadowRepeaterControl, ChipsControl, ClearIconButton, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent$1 as ControlComponent, ControlFormLabel, type ControlReplacement, ControlReplacementsProvider, ControlToggleButtonGroup, DateTimeControl, DisplayConditionsControl, EmailFormActionControl, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedOption, FilterRepeaterControl, type FontCategory, FontFamilyControl, GapControl, HtmlTagControl, ImageControl, InlineEditingControl, InlineEditor, InlineEditorToolbar, type InlineEditorToolbarProps, ItemSelector, type ItemsActionPayload, KeyValueControl, type LengthUnit$1 as LengthUnit, LinkControl, LinkedDimensionsControl, NumberControl, NumberInput, PopoverContent, PopoverGridContainer, PositionControl, type PromotionTrackingData, PromotionTrigger, type PromotionTriggerRef, PropKeyProvider, PropProvider, type PropProviderProps, QueryControl, RepeatableControl, Repeater, type RepeaterItem, SelectControl, SelectControlWrapper, type SetRepeaterValuesMeta, type SetValue, type SetValueMeta, SizeComponent, SizeControl, StrokeControl, StyledToggleButton, StyledToggleButtonGroup, SvgMediaControl, SwitchControl, TextAreaControl, TextControl, type TimeUnit$1 as TimeUnit, type ToggleButtonGroupItem, ToggleButtonGroupUi, ToggleControl, type ToggleControlProps, TransformRepeaterControl, TransformSettingsControl, TransitionRepeaterControl, type Unit$1 as Unit, UnstableSizeControl, UnstableSizeField, UrlControl, type UseTypingBufferOptions, type V4PromotionData, type V4PromotionKey, VideoMediaControl, createControl, createControlReplacementsRegistry, enqueueFont, getControlReplacements, injectIntoRepeaterItemActions, injectIntoRepeaterItemIcon, injectIntoRepeaterItemLabel, isUnitExtendedOption, registerControlReplacement, trackUpgradePromotionClick, trackViewPromotion, transitionProperties, transitionsItemsList, useBoundProp, useControlActions, useControlReplacement, useFontFamilies, useSyncExternalState, useTypingBuffer };