@elementor/editor-controls 1.0.0 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/CHANGELOG.md +60 -0
  2. package/dist/index.d.mts +78 -41
  3. package/dist/index.d.ts +78 -41
  4. package/dist/index.js +875 -617
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +713 -467
  7. package/dist/index.mjs.map +1 -1
  8. package/package.json +11 -11
  9. package/src/components/font-family-selector.tsx +50 -174
  10. package/src/components/popover-content.tsx +3 -11
  11. package/src/components/repeater.tsx +27 -11
  12. package/src/components/text-field-popover.tsx +3 -3
  13. package/src/controls/aspect-ratio-control.tsx +20 -2
  14. package/src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-position.tsx +2 -2
  15. package/src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-size.tsx +2 -2
  16. package/src/controls/background-control/background-overlay/background-overlay-repeater-control.tsx +9 -4
  17. package/src/controls/box-shadow-repeater-control.tsx +2 -2
  18. package/src/controls/equal-unequal-sizes-control.tsx +3 -9
  19. package/src/controls/filter-repeater-control.tsx +186 -0
  20. package/src/controls/font-family-control/font-family-control.tsx +6 -2
  21. package/src/controls/gap-control.tsx +3 -3
  22. package/src/controls/image-control.tsx +22 -35
  23. package/src/controls/key-value-control.tsx +119 -0
  24. package/src/controls/link-control.tsx +3 -1
  25. package/src/controls/linked-dimensions-control.tsx +3 -3
  26. package/src/controls/number-control.tsx +3 -3
  27. package/src/controls/position-control.tsx +109 -0
  28. package/src/controls/repeatable-control.tsx +119 -0
  29. package/src/controls/size-control.tsx +11 -9
  30. package/src/controls/stroke-control.tsx +2 -2
  31. package/src/controls/svg-media-control.tsx +0 -2
  32. package/src/hooks/use-repeatable-control-context.ts +24 -0
  33. package/src/index.ts +6 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,65 @@
1
1
  # @elementor/editor-controls
2
2
 
3
+ ## 1.2.0
4
+
5
+ ### Minor Changes
6
+
7
+ - ab6ad10: Adds support for css filter property, blur and brightness only.
8
+ - a0ff6bc: Reset value button position fix, input reset fix for aspect ratio control
9
+ - bfe6b0b: Update the width settings for the popover selection list.
10
+ - 125de7b: Show placeholders in Number control
11
+ - 9bbd4e3: Ensure repeatable control works with key-value control
12
+ - d85ca8c: Update the popover styling for version 3.30.
13
+
14
+ ### Patch Changes
15
+
16
+ - 0b32e5c: Removed % units from blur css filter.
17
+ - 16df763: Add changed prop name to atomic element setting history
18
+ - 6c6f0d6: Standardize style field layout and add `propDisplayName` prop to `StylesField`
19
+ - Updated dependencies [e953081]
20
+ - Updated dependencies [ab6ad10]
21
+ - Updated dependencies [c91168a]
22
+ - Updated dependencies [bfe6b0b]
23
+ - Updated dependencies [ea388a1]
24
+ - Updated dependencies [16df763]
25
+ - Updated dependencies [d85ca8c]
26
+ - @elementor/utils@0.5.0
27
+ - @elementor/editor-props@0.15.0
28
+ - @elementor/editor-ui@0.13.0
29
+ - @elementor/editor-elements@0.8.7
30
+ - @elementor/editor-v1-adapters@0.12.1
31
+ - @elementor/wp-media@0.6.1
32
+ - @elementor/editor-responsive@0.13.6
33
+
34
+ ## 1.1.0
35
+
36
+ ### Minor Changes
37
+
38
+ - 9ccd243: Opacity control is added to the style tab
39
+ - 17b73ab: Update `@elementor/ui` version.
40
+ - aa176b8: Create a KeyValue Control
41
+ - 3daa1c9: Extract font family content list to a standalone component inside the Editor UI package.
42
+ - 40d00c2: Implement the Popover Menu List inside the Dynamic Tags and the Variables.
43
+ - d5e9011: Implement the Popover Search component inside the Dynamic Tags, Font Families and the Variables.
44
+ - 30a6d95: Added repeatable control type
45
+ - f37c325: Extract the popover scrollable content box to a standalone component inside the Editor UI package.
46
+ - 20d04f2: Added object position custom control
47
+
48
+ ### Patch Changes
49
+
50
+ - Updated dependencies [da0c4ca]
51
+ - Updated dependencies [17b73ab]
52
+ - Updated dependencies [7a4178f]
53
+ - Updated dependencies [8e18905]
54
+ - Updated dependencies [3daa1c9]
55
+ - Updated dependencies [40d00c2]
56
+ - Updated dependencies [d5e9011]
57
+ - Updated dependencies [f37c325]
58
+ - Updated dependencies [20d04f2]
59
+ - @elementor/editor-ui@0.12.0
60
+ - @elementor/editor-props@0.14.0
61
+ - @elementor/editor-elements@0.8.6
62
+
3
63
  ## 1.0.0
4
64
 
5
65
  ### Major Changes
package/dist/index.d.mts CHANGED
@@ -1,5 +1,5 @@
1
- import * as React from 'react';
2
- import { MutableRefObject, ReactNode, ComponentType, PropsWithChildren } from 'react';
1
+ import * as React$1 from 'react';
2
+ import { RefObject, ReactNode, FC, PropsWithChildren, ComponentType } from 'react';
3
3
  import { StringPropValue, PropTypeUtil, PropValue, PropKey, SizePropValue, PropType, CreateOptions } from '@elementor/editor-props';
4
4
  import { UnstableColorFieldProps, ToggleButtonProps, StackProps, FormLabelProps } from '@elementor/ui';
5
5
  import * as _elementor_locations from '@elementor/locations';
@@ -9,19 +9,18 @@ type ImageControlProps = {
9
9
  label: string;
10
10
  value: string;
11
11
  }[];
12
- resolutionLabel?: string;
13
12
  showMode?: 'all' | 'media' | 'sizes';
14
13
  };
15
- declare const ImageControl: ControlComponent<({ sizes, resolutionLabel, showMode }: ImageControlProps) => React.JSX.Element>;
14
+ declare const ImageControl: ControlComponent<({ sizes, showMode }: ImageControlProps) => React$1.JSX.Element>;
16
15
 
17
16
  declare const TextControl: ControlComponent<({ placeholder }: {
18
17
  placeholder?: string;
19
- }) => React.JSX.Element>;
18
+ }) => React$1.JSX.Element>;
20
19
 
21
20
  type Props$6 = {
22
21
  placeholder?: string;
23
22
  };
24
- declare const TextAreaControl: ControlComponent<({ placeholder }: Props$6) => React.JSX.Element>;
23
+ declare const TextAreaControl: ControlComponent<({ placeholder }: Props$6) => React$1.JSX.Element>;
25
24
 
26
25
  declare const defaultUnits: readonly ["px", "%", "em", "rem", "vw", "vh"];
27
26
  declare const defaultExtendedOptions: readonly ["auto", "custom"];
@@ -30,17 +29,20 @@ type ExtendedOption = (typeof defaultExtendedOptions)[number];
30
29
 
31
30
  type SizeControlProps = {
32
31
  placeholder?: string;
33
- startIcon?: React.ReactNode;
32
+ startIcon?: React$1.ReactNode;
34
33
  units?: Unit[];
35
34
  extendedOptions?: ExtendedOption[];
36
35
  disableCustom?: boolean;
37
- anchorRef?: MutableRefObject<HTMLElement | undefined>;
36
+ anchorRef?: RefObject<HTMLDivElement | null>;
37
+ defaultUnit?: Unit;
38
38
  };
39
- declare const SizeControl: ControlComponent<(props: SizeControlProps) => React.JSX.Element>;
39
+ declare const SizeControl: ControlComponent<(props: SizeControlProps) => React$1.JSX.Element>;
40
40
 
41
- declare const StrokeControl: ControlComponent<() => React.JSX.Element>;
41
+ declare const StrokeControl: ControlComponent<() => React$1.JSX.Element>;
42
42
 
43
- declare const BoxShadowRepeaterControl: ControlComponent<() => React.JSX.Element>;
43
+ declare const BoxShadowRepeaterControl: ControlComponent<() => React$1.JSX.Element>;
44
+
45
+ declare const FilterRepeaterControl: ControlComponent<() => React$1.JSX.Element>;
44
46
 
45
47
  type Props$5 = {
46
48
  options: Array<{
@@ -50,13 +52,13 @@ type Props$5 = {
50
52
  }>;
51
53
  onChange?: (newValue: string | null, previousValue: string | null | undefined) => void;
52
54
  };
53
- declare const SelectControl: ControlComponent<({ options, onChange }: Props$5) => React.JSX.Element>;
55
+ declare const SelectControl: ControlComponent<({ options, onChange }: Props$5) => React$1.JSX.Element>;
54
56
 
55
57
  type Props$4 = Partial<Omit<UnstableColorFieldProps, 'value' | 'onChange'>> & {
56
58
  propTypeUtil?: PropTypeUtil<string, string>;
57
59
  anchorEl?: HTMLElement | null;
58
60
  };
59
- declare const ColorControl: ControlComponent<({ propTypeUtil, anchorEl, slotProps, ...props }: Props$4) => React.JSX.Element>;
61
+ declare const ColorControl: ControlComponent<({ propTypeUtil, anchorEl, slotProps, ...props }: Props$4) => React$1.JSX.Element>;
60
62
 
61
63
  type RenderContentProps = {
62
64
  size: ToggleButtonProps['size'];
@@ -64,7 +66,7 @@ type RenderContentProps = {
64
66
  type ToggleButtonGroupItem<TValue> = {
65
67
  value: TValue;
66
68
  label: string;
67
- renderContent: ({ size }: RenderContentProps) => React.ReactNode;
69
+ renderContent: ({ size }: RenderContentProps) => React$1.ReactNode;
68
70
  showTooltip?: boolean;
69
71
  };
70
72
  type ExclusiveValue<TValue> = TValue;
@@ -85,7 +87,7 @@ type Props$3<TValue> = {
85
87
  value: ExclusiveValue<TValue>;
86
88
  onChange: (value: ExclusiveValue<TValue>) => void;
87
89
  });
88
- declare const ControlToggleButtonGroup: <TValue>({ justify, size, value, onChange, items, maxItems, exclusive, fullWidth, disabled, }: Props$3<TValue>) => React.JSX.Element;
90
+ declare const ControlToggleButtonGroup: <TValue>({ justify, size, value, onChange, items, maxItems, exclusive, fullWidth, disabled, }: Props$3<TValue>) => React$1.JSX.Element;
89
91
 
90
92
  type ToggleControlProps<T extends PropValue> = {
91
93
  options: Array<ToggleButtonGroupItem<T> & {
@@ -96,15 +98,15 @@ type ToggleControlProps<T extends PropValue> = {
96
98
  exclusive?: boolean;
97
99
  maxItems?: number;
98
100
  };
99
- declare const ToggleControl: ControlComponent<({ options, fullWidth, size, exclusive, maxItems, }: ToggleControlProps<StringPropValue["value"]>) => React.JSX.Element>;
101
+ declare const ToggleControl: ControlComponent<({ options, fullWidth, size, exclusive, maxItems, }: ToggleControlProps<StringPropValue["value"]>) => React$1.JSX.Element>;
100
102
 
101
- declare const NumberControl: ControlComponent<({ placeholder, max, min, step, shouldForceInt, }: {
103
+ declare const NumberControl: ControlComponent<({ placeholder: labelPlaceholder, max, min, step, shouldForceInt, }: {
102
104
  placeholder?: string;
103
105
  max?: number;
104
106
  min?: number;
105
107
  step?: number;
106
108
  shouldForceInt?: boolean;
107
- }) => React.JSX.Element>;
109
+ }) => React$1.JSX.Element>;
108
110
 
109
111
  type MultiSizePropValue = Record<PropKey, SizePropValue>;
110
112
  type Item = {
@@ -120,13 +122,13 @@ type Props$2<TMultiPropType extends string, TPropValue extends MultiSizePropValu
120
122
  items: EqualUnequalItems;
121
123
  multiSizePropTypeUtil: PropTypeUtil<TMultiPropType, TPropValue>;
122
124
  };
123
- declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$2<TMultiPropType, TPropValue>): React.JSX.Element;
125
+ declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$2<TMultiPropType, TPropValue>): React$1.JSX.Element;
124
126
 
125
127
  declare const LinkedDimensionsControl: ControlComponent<({ label, isSiteRtl, extendedOptions, }: {
126
128
  label: string;
127
129
  isSiteRtl?: boolean;
128
130
  extendedOptions?: ExtendedOption[];
129
- }) => React.JSX.Element>;
131
+ }) => React$1.JSX.Element>;
130
132
 
131
133
  type FontCategory = {
132
134
  label: string;
@@ -134,12 +136,13 @@ type FontCategory = {
134
136
  };
135
137
  type FontFamilyControlProps = {
136
138
  fontFamilies: FontCategory[];
139
+ sectionWidth: number;
137
140
  };
138
- declare const FontFamilyControl: ControlComponent<({ fontFamilies }: FontFamilyControlProps) => React.JSX.Element>;
141
+ declare const FontFamilyControl: ControlComponent<({ fontFamilies, sectionWidth }: FontFamilyControlProps) => React$1.JSX.Element>;
139
142
 
140
143
  declare const UrlControl: ControlComponent<({ placeholder }: {
141
144
  placeholder?: string;
142
- }) => React.JSX.Element>;
145
+ }) => React$1.JSX.Element>;
143
146
 
144
147
  type ControlProps<TControlProps = unknown> = TControlProps & {
145
148
  context: {
@@ -155,32 +158,66 @@ type Props$1 = ControlProps<{
155
158
  allowCustomValues?: boolean;
156
159
  minInputLength?: number;
157
160
  placeholder?: string;
161
+ label?: string;
158
162
  }>;
159
- declare const LinkControl: ControlComponent<(props: Props$1) => React.JSX.Element>;
163
+ declare const LinkControl: ControlComponent<(props: Props$1) => React$1.JSX.Element>;
160
164
 
161
165
  declare const GapControl: ControlComponent<({ label }: {
162
166
  label: string;
163
- }) => React.JSX.Element>;
167
+ }) => React$1.JSX.Element>;
164
168
 
165
169
  declare const AspectRatioControl: ControlComponent<({ label }: {
166
170
  label: string;
167
- }) => React.JSX.Element>;
171
+ }) => React$1.JSX.Element>;
172
+
173
+ declare const SvgMediaControl: ControlComponent<() => React$1.JSX.Element>;
174
+
175
+ declare const BackgroundControl: ControlComponent<() => React$1.JSX.Element>;
176
+
177
+ declare const SwitchControl: ControlComponent<() => React$1.JSX.Element>;
178
+
179
+ type ChildControlConfig = {
180
+ component: React.ComponentType;
181
+ props?: Record<string, unknown>;
182
+ propTypeUtil: PropTypeUtil<string, any>;
183
+ label?: string;
184
+ };
168
185
 
169
- declare const SvgMediaControl: ControlComponent<() => React.JSX.Element>;
186
+ type RepeatableControlProps = {
187
+ label: string;
188
+ repeaterLabel: string;
189
+ childControlConfig: ChildControlConfig;
190
+ showDuplicate?: boolean;
191
+ showToggle?: boolean;
192
+ initialValues?: object;
193
+ patternLabel?: string;
194
+ placeholder?: string;
195
+ };
196
+ declare const RepeatableControl: ControlComponent<({ repeaterLabel, childControlConfig, showDuplicate, showToggle, initialValues, patternLabel, placeholder, }: RepeatableControlProps) => React$1.JSX.Element | null>;
197
+
198
+ type KeyValueControlProps = {
199
+ keyName?: string;
200
+ valueName?: string;
201
+ regexKey?: string;
202
+ regexValue?: string;
203
+ validationErrorMessage?: string;
204
+ };
205
+ declare const KeyValueControl: ControlComponent<(props?: KeyValueControlProps) => React$1.JSX.Element>;
170
206
 
171
- declare const BackgroundControl: ControlComponent<() => React.JSX.Element>;
207
+ declare const PositionControl: () => React$1.JSX.Element;
172
208
 
173
- declare const SwitchControl: ControlComponent<() => React.JSX.Element>;
209
+ declare const PopoverContent: FC<PropsWithChildren<StackProps>>;
174
210
 
175
- declare const ControlFormLabel: (props: FormLabelProps) => React.JSX.Element;
211
+ declare const ControlFormLabel: (props: FormLabelProps) => React$1.JSX.Element;
176
212
 
177
213
  type FontFamilySelectorProps = {
178
214
  fontFamilies: FontCategory[];
179
215
  fontFamily: string | null;
180
216
  onFontFamilyChange: (fontFamily: string) => void;
181
217
  onClose: () => void;
218
+ sectionWidth: number;
182
219
  };
183
- declare const FontFamilySelector: ({ fontFamilies, fontFamily, onFontFamilyChange, onClose, }: FontFamilySelectorProps) => React.JSX.Element;
220
+ declare const FontFamilySelector: ({ fontFamilies, fontFamily, onFontFamilyChange, onClose, sectionWidth, }: FontFamilySelectorProps) => React$1.JSX.Element;
184
221
 
185
222
  type AnyComponentType = ComponentType<any>;
186
223
  declare const brandSymbol: unique symbol;
@@ -190,13 +227,13 @@ type ControlComponent<TComponent extends AnyComponentType = AnyComponentType> =
190
227
 
191
228
  type ControlActionsItems = Array<{
192
229
  id: string;
193
- MenuItem: React.ComponentType;
230
+ MenuItem: React$1.ComponentType;
194
231
  }>;
195
232
  type ControlActionsContext = {
196
233
  items: ControlActionsItems;
197
234
  };
198
235
  type ControlActionsProviderProps = PropsWithChildren<ControlActionsContext>;
199
- declare const ControlActionsProvider: ({ children, items }: ControlActionsProviderProps) => React.JSX.Element;
236
+ declare const ControlActionsProvider: ({ children, items }: ControlActionsProviderProps) => React$1.JSX.Element;
200
237
  declare const useControlActions: () => ControlActionsContext;
201
238
 
202
239
  type SetValueMeta = {
@@ -210,9 +247,9 @@ type PropContext<T extends PropValue, P extends PropType> = {
210
247
  placeholder?: T;
211
248
  disabled?: boolean;
212
249
  };
213
- declare const PropContext: React.Context<PropContext<PropValue, PropType> | null>;
214
- type PropProviderProps<T extends PropValue, P extends PropType> = React.PropsWithChildren<PropContext<T, P>>;
215
- declare const PropProvider: <T extends PropValue, P extends PropType>({ children, value, setValue, propType, placeholder, disabled, }: PropProviderProps<T, P>) => React.JSX.Element;
250
+ declare const PropContext: React$1.Context<PropContext<PropValue, PropType> | null>;
251
+ type PropProviderProps<T extends PropValue, P extends PropType> = React$1.PropsWithChildren<PropContext<T, P>>;
252
+ declare const PropProvider: <T extends PropValue, P extends PropType>({ children, value, setValue, propType, placeholder, disabled, }: PropProviderProps<T, P>) => React$1.JSX.Element;
216
253
 
217
254
  type PropKeyContextValue<T, P> = {
218
255
  bind: PropKey;
@@ -223,10 +260,10 @@ type PropKeyContextValue<T, P> = {
223
260
  path: PropKey[];
224
261
  disabled?: boolean;
225
262
  };
226
- type PropKeyProviderProps = React.PropsWithChildren<{
263
+ type PropKeyProviderProps = React$1.PropsWithChildren<{
227
264
  bind: PropKey;
228
265
  }>;
229
- declare const PropKeyProvider: ({ children, bind }: PropKeyProviderProps) => React.JSX.Element;
266
+ declare const PropKeyProvider: ({ children, bind }: PropKeyProviderProps) => React$1.JSX.Element;
230
267
 
231
268
  type UseBoundProp<TValue extends PropValue> = {
232
269
  bind: PropKey;
@@ -251,7 +288,7 @@ type ConditionArgs = {
251
288
  type Props = PropsWithChildren<{
252
289
  replacements: ControlReplacement[];
253
290
  }>;
254
- declare const ControlReplacementsProvider: ({ replacements, children }: Props) => React.JSX.Element;
291
+ declare const ControlReplacementsProvider: ({ replacements, children }: Props) => React$1.JSX.Element;
255
292
  declare const createControlReplacementsRegistry: () => {
256
293
  registerControlReplacement: (replacement: ControlReplacement) => void;
257
294
  getControlReplacements: () => ControlReplacement[];
@@ -265,9 +302,9 @@ type ControlAdornmentsContext = {
265
302
  items?: ControlAdornmentsItems;
266
303
  };
267
304
  type ControlAdornmentsProviderProps = PropsWithChildren<ControlAdornmentsContext>;
268
- declare const ControlAdornmentsProvider: ({ children, items }: ControlAdornmentsProviderProps) => React.JSX.Element;
305
+ declare const ControlAdornmentsProvider: ({ children, items }: ControlAdornmentsProviderProps) => React$1.JSX.Element;
269
306
 
270
- declare function ControlAdornments(): React.JSX.Element | null;
307
+ declare function ControlAdornments(): React$1.JSX.Element | null;
271
308
 
272
309
  declare const injectIntoRepeaterItemIcon: (args: _elementor_locations.ReplaceableInjectArgs<{
273
310
  value: PropValue;
@@ -284,4 +321,4 @@ type UseInternalStateOptions<TValue> = {
284
321
  };
285
322
  declare const useSyncExternalState: <TValue>({ external, setExternal, persistWhen, fallback, }: UseInternalStateOptions<TValue>) => readonly [TValue, (setter: ((value: TValue) => TValue) | TValue) => void];
286
323
 
287
- export { AspectRatioControl, BackgroundControl, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent, ControlFormLabel, ControlReplacementsProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedOption, type FontCategory, FontFamilyControl, FontFamilySelector, GapControl, ImageControl, LinkControl, LinkedDimensionsControl, NumberControl, PropKeyProvider, PropProvider, type PropProviderProps, SelectControl, type SetValue, SizeControl, StrokeControl, SvgMediaControl, SwitchControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, type ToggleControlProps, UrlControl, createControlReplacementsRegistry, injectIntoRepeaterItemIcon, injectIntoRepeaterItemLabel, useBoundProp, useControlActions, useSyncExternalState };
324
+ export { AspectRatioControl, BackgroundControl, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent, ControlFormLabel, ControlReplacementsProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedOption, FilterRepeaterControl, type FontCategory, FontFamilyControl, FontFamilySelector, GapControl, ImageControl, KeyValueControl, LinkControl, LinkedDimensionsControl, NumberControl, PopoverContent, PositionControl, PropKeyProvider, PropProvider, type PropProviderProps, RepeatableControl, SelectControl, type SetValue, SizeControl, StrokeControl, SvgMediaControl, SwitchControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, type ToggleControlProps, type Unit, UrlControl, createControlReplacementsRegistry, injectIntoRepeaterItemIcon, injectIntoRepeaterItemLabel, useBoundProp, useControlActions, useSyncExternalState };
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import * as React from 'react';
2
- import { MutableRefObject, ReactNode, ComponentType, PropsWithChildren } from 'react';
1
+ import * as React$1 from 'react';
2
+ import { RefObject, ReactNode, FC, PropsWithChildren, ComponentType } from 'react';
3
3
  import { StringPropValue, PropTypeUtil, PropValue, PropKey, SizePropValue, PropType, CreateOptions } from '@elementor/editor-props';
4
4
  import { UnstableColorFieldProps, ToggleButtonProps, StackProps, FormLabelProps } from '@elementor/ui';
5
5
  import * as _elementor_locations from '@elementor/locations';
@@ -9,19 +9,18 @@ type ImageControlProps = {
9
9
  label: string;
10
10
  value: string;
11
11
  }[];
12
- resolutionLabel?: string;
13
12
  showMode?: 'all' | 'media' | 'sizes';
14
13
  };
15
- declare const ImageControl: ControlComponent<({ sizes, resolutionLabel, showMode }: ImageControlProps) => React.JSX.Element>;
14
+ declare const ImageControl: ControlComponent<({ sizes, showMode }: ImageControlProps) => React$1.JSX.Element>;
16
15
 
17
16
  declare const TextControl: ControlComponent<({ placeholder }: {
18
17
  placeholder?: string;
19
- }) => React.JSX.Element>;
18
+ }) => React$1.JSX.Element>;
20
19
 
21
20
  type Props$6 = {
22
21
  placeholder?: string;
23
22
  };
24
- declare const TextAreaControl: ControlComponent<({ placeholder }: Props$6) => React.JSX.Element>;
23
+ declare const TextAreaControl: ControlComponent<({ placeholder }: Props$6) => React$1.JSX.Element>;
25
24
 
26
25
  declare const defaultUnits: readonly ["px", "%", "em", "rem", "vw", "vh"];
27
26
  declare const defaultExtendedOptions: readonly ["auto", "custom"];
@@ -30,17 +29,20 @@ type ExtendedOption = (typeof defaultExtendedOptions)[number];
30
29
 
31
30
  type SizeControlProps = {
32
31
  placeholder?: string;
33
- startIcon?: React.ReactNode;
32
+ startIcon?: React$1.ReactNode;
34
33
  units?: Unit[];
35
34
  extendedOptions?: ExtendedOption[];
36
35
  disableCustom?: boolean;
37
- anchorRef?: MutableRefObject<HTMLElement | undefined>;
36
+ anchorRef?: RefObject<HTMLDivElement | null>;
37
+ defaultUnit?: Unit;
38
38
  };
39
- declare const SizeControl: ControlComponent<(props: SizeControlProps) => React.JSX.Element>;
39
+ declare const SizeControl: ControlComponent<(props: SizeControlProps) => React$1.JSX.Element>;
40
40
 
41
- declare const StrokeControl: ControlComponent<() => React.JSX.Element>;
41
+ declare const StrokeControl: ControlComponent<() => React$1.JSX.Element>;
42
42
 
43
- declare const BoxShadowRepeaterControl: ControlComponent<() => React.JSX.Element>;
43
+ declare const BoxShadowRepeaterControl: ControlComponent<() => React$1.JSX.Element>;
44
+
45
+ declare const FilterRepeaterControl: ControlComponent<() => React$1.JSX.Element>;
44
46
 
45
47
  type Props$5 = {
46
48
  options: Array<{
@@ -50,13 +52,13 @@ type Props$5 = {
50
52
  }>;
51
53
  onChange?: (newValue: string | null, previousValue: string | null | undefined) => void;
52
54
  };
53
- declare const SelectControl: ControlComponent<({ options, onChange }: Props$5) => React.JSX.Element>;
55
+ declare const SelectControl: ControlComponent<({ options, onChange }: Props$5) => React$1.JSX.Element>;
54
56
 
55
57
  type Props$4 = Partial<Omit<UnstableColorFieldProps, 'value' | 'onChange'>> & {
56
58
  propTypeUtil?: PropTypeUtil<string, string>;
57
59
  anchorEl?: HTMLElement | null;
58
60
  };
59
- declare const ColorControl: ControlComponent<({ propTypeUtil, anchorEl, slotProps, ...props }: Props$4) => React.JSX.Element>;
61
+ declare const ColorControl: ControlComponent<({ propTypeUtil, anchorEl, slotProps, ...props }: Props$4) => React$1.JSX.Element>;
60
62
 
61
63
  type RenderContentProps = {
62
64
  size: ToggleButtonProps['size'];
@@ -64,7 +66,7 @@ type RenderContentProps = {
64
66
  type ToggleButtonGroupItem<TValue> = {
65
67
  value: TValue;
66
68
  label: string;
67
- renderContent: ({ size }: RenderContentProps) => React.ReactNode;
69
+ renderContent: ({ size }: RenderContentProps) => React$1.ReactNode;
68
70
  showTooltip?: boolean;
69
71
  };
70
72
  type ExclusiveValue<TValue> = TValue;
@@ -85,7 +87,7 @@ type Props$3<TValue> = {
85
87
  value: ExclusiveValue<TValue>;
86
88
  onChange: (value: ExclusiveValue<TValue>) => void;
87
89
  });
88
- declare const ControlToggleButtonGroup: <TValue>({ justify, size, value, onChange, items, maxItems, exclusive, fullWidth, disabled, }: Props$3<TValue>) => React.JSX.Element;
90
+ declare const ControlToggleButtonGroup: <TValue>({ justify, size, value, onChange, items, maxItems, exclusive, fullWidth, disabled, }: Props$3<TValue>) => React$1.JSX.Element;
89
91
 
90
92
  type ToggleControlProps<T extends PropValue> = {
91
93
  options: Array<ToggleButtonGroupItem<T> & {
@@ -96,15 +98,15 @@ type ToggleControlProps<T extends PropValue> = {
96
98
  exclusive?: boolean;
97
99
  maxItems?: number;
98
100
  };
99
- declare const ToggleControl: ControlComponent<({ options, fullWidth, size, exclusive, maxItems, }: ToggleControlProps<StringPropValue["value"]>) => React.JSX.Element>;
101
+ declare const ToggleControl: ControlComponent<({ options, fullWidth, size, exclusive, maxItems, }: ToggleControlProps<StringPropValue["value"]>) => React$1.JSX.Element>;
100
102
 
101
- declare const NumberControl: ControlComponent<({ placeholder, max, min, step, shouldForceInt, }: {
103
+ declare const NumberControl: ControlComponent<({ placeholder: labelPlaceholder, max, min, step, shouldForceInt, }: {
102
104
  placeholder?: string;
103
105
  max?: number;
104
106
  min?: number;
105
107
  step?: number;
106
108
  shouldForceInt?: boolean;
107
- }) => React.JSX.Element>;
109
+ }) => React$1.JSX.Element>;
108
110
 
109
111
  type MultiSizePropValue = Record<PropKey, SizePropValue>;
110
112
  type Item = {
@@ -120,13 +122,13 @@ type Props$2<TMultiPropType extends string, TPropValue extends MultiSizePropValu
120
122
  items: EqualUnequalItems;
121
123
  multiSizePropTypeUtil: PropTypeUtil<TMultiPropType, TPropValue>;
122
124
  };
123
- declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$2<TMultiPropType, TPropValue>): React.JSX.Element;
125
+ declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$2<TMultiPropType, TPropValue>): React$1.JSX.Element;
124
126
 
125
127
  declare const LinkedDimensionsControl: ControlComponent<({ label, isSiteRtl, extendedOptions, }: {
126
128
  label: string;
127
129
  isSiteRtl?: boolean;
128
130
  extendedOptions?: ExtendedOption[];
129
- }) => React.JSX.Element>;
131
+ }) => React$1.JSX.Element>;
130
132
 
131
133
  type FontCategory = {
132
134
  label: string;
@@ -134,12 +136,13 @@ type FontCategory = {
134
136
  };
135
137
  type FontFamilyControlProps = {
136
138
  fontFamilies: FontCategory[];
139
+ sectionWidth: number;
137
140
  };
138
- declare const FontFamilyControl: ControlComponent<({ fontFamilies }: FontFamilyControlProps) => React.JSX.Element>;
141
+ declare const FontFamilyControl: ControlComponent<({ fontFamilies, sectionWidth }: FontFamilyControlProps) => React$1.JSX.Element>;
139
142
 
140
143
  declare const UrlControl: ControlComponent<({ placeholder }: {
141
144
  placeholder?: string;
142
- }) => React.JSX.Element>;
145
+ }) => React$1.JSX.Element>;
143
146
 
144
147
  type ControlProps<TControlProps = unknown> = TControlProps & {
145
148
  context: {
@@ -155,32 +158,66 @@ type Props$1 = ControlProps<{
155
158
  allowCustomValues?: boolean;
156
159
  minInputLength?: number;
157
160
  placeholder?: string;
161
+ label?: string;
158
162
  }>;
159
- declare const LinkControl: ControlComponent<(props: Props$1) => React.JSX.Element>;
163
+ declare const LinkControl: ControlComponent<(props: Props$1) => React$1.JSX.Element>;
160
164
 
161
165
  declare const GapControl: ControlComponent<({ label }: {
162
166
  label: string;
163
- }) => React.JSX.Element>;
167
+ }) => React$1.JSX.Element>;
164
168
 
165
169
  declare const AspectRatioControl: ControlComponent<({ label }: {
166
170
  label: string;
167
- }) => React.JSX.Element>;
171
+ }) => React$1.JSX.Element>;
172
+
173
+ declare const SvgMediaControl: ControlComponent<() => React$1.JSX.Element>;
174
+
175
+ declare const BackgroundControl: ControlComponent<() => React$1.JSX.Element>;
176
+
177
+ declare const SwitchControl: ControlComponent<() => React$1.JSX.Element>;
178
+
179
+ type ChildControlConfig = {
180
+ component: React.ComponentType;
181
+ props?: Record<string, unknown>;
182
+ propTypeUtil: PropTypeUtil<string, any>;
183
+ label?: string;
184
+ };
168
185
 
169
- declare const SvgMediaControl: ControlComponent<() => React.JSX.Element>;
186
+ type RepeatableControlProps = {
187
+ label: string;
188
+ repeaterLabel: string;
189
+ childControlConfig: ChildControlConfig;
190
+ showDuplicate?: boolean;
191
+ showToggle?: boolean;
192
+ initialValues?: object;
193
+ patternLabel?: string;
194
+ placeholder?: string;
195
+ };
196
+ declare const RepeatableControl: ControlComponent<({ repeaterLabel, childControlConfig, showDuplicate, showToggle, initialValues, patternLabel, placeholder, }: RepeatableControlProps) => React$1.JSX.Element | null>;
197
+
198
+ type KeyValueControlProps = {
199
+ keyName?: string;
200
+ valueName?: string;
201
+ regexKey?: string;
202
+ regexValue?: string;
203
+ validationErrorMessage?: string;
204
+ };
205
+ declare const KeyValueControl: ControlComponent<(props?: KeyValueControlProps) => React$1.JSX.Element>;
170
206
 
171
- declare const BackgroundControl: ControlComponent<() => React.JSX.Element>;
207
+ declare const PositionControl: () => React$1.JSX.Element;
172
208
 
173
- declare const SwitchControl: ControlComponent<() => React.JSX.Element>;
209
+ declare const PopoverContent: FC<PropsWithChildren<StackProps>>;
174
210
 
175
- declare const ControlFormLabel: (props: FormLabelProps) => React.JSX.Element;
211
+ declare const ControlFormLabel: (props: FormLabelProps) => React$1.JSX.Element;
176
212
 
177
213
  type FontFamilySelectorProps = {
178
214
  fontFamilies: FontCategory[];
179
215
  fontFamily: string | null;
180
216
  onFontFamilyChange: (fontFamily: string) => void;
181
217
  onClose: () => void;
218
+ sectionWidth: number;
182
219
  };
183
- declare const FontFamilySelector: ({ fontFamilies, fontFamily, onFontFamilyChange, onClose, }: FontFamilySelectorProps) => React.JSX.Element;
220
+ declare const FontFamilySelector: ({ fontFamilies, fontFamily, onFontFamilyChange, onClose, sectionWidth, }: FontFamilySelectorProps) => React$1.JSX.Element;
184
221
 
185
222
  type AnyComponentType = ComponentType<any>;
186
223
  declare const brandSymbol: unique symbol;
@@ -190,13 +227,13 @@ type ControlComponent<TComponent extends AnyComponentType = AnyComponentType> =
190
227
 
191
228
  type ControlActionsItems = Array<{
192
229
  id: string;
193
- MenuItem: React.ComponentType;
230
+ MenuItem: React$1.ComponentType;
194
231
  }>;
195
232
  type ControlActionsContext = {
196
233
  items: ControlActionsItems;
197
234
  };
198
235
  type ControlActionsProviderProps = PropsWithChildren<ControlActionsContext>;
199
- declare const ControlActionsProvider: ({ children, items }: ControlActionsProviderProps) => React.JSX.Element;
236
+ declare const ControlActionsProvider: ({ children, items }: ControlActionsProviderProps) => React$1.JSX.Element;
200
237
  declare const useControlActions: () => ControlActionsContext;
201
238
 
202
239
  type SetValueMeta = {
@@ -210,9 +247,9 @@ type PropContext<T extends PropValue, P extends PropType> = {
210
247
  placeholder?: T;
211
248
  disabled?: boolean;
212
249
  };
213
- declare const PropContext: React.Context<PropContext<PropValue, PropType> | null>;
214
- type PropProviderProps<T extends PropValue, P extends PropType> = React.PropsWithChildren<PropContext<T, P>>;
215
- declare const PropProvider: <T extends PropValue, P extends PropType>({ children, value, setValue, propType, placeholder, disabled, }: PropProviderProps<T, P>) => React.JSX.Element;
250
+ declare const PropContext: React$1.Context<PropContext<PropValue, PropType> | null>;
251
+ type PropProviderProps<T extends PropValue, P extends PropType> = React$1.PropsWithChildren<PropContext<T, P>>;
252
+ declare const PropProvider: <T extends PropValue, P extends PropType>({ children, value, setValue, propType, placeholder, disabled, }: PropProviderProps<T, P>) => React$1.JSX.Element;
216
253
 
217
254
  type PropKeyContextValue<T, P> = {
218
255
  bind: PropKey;
@@ -223,10 +260,10 @@ type PropKeyContextValue<T, P> = {
223
260
  path: PropKey[];
224
261
  disabled?: boolean;
225
262
  };
226
- type PropKeyProviderProps = React.PropsWithChildren<{
263
+ type PropKeyProviderProps = React$1.PropsWithChildren<{
227
264
  bind: PropKey;
228
265
  }>;
229
- declare const PropKeyProvider: ({ children, bind }: PropKeyProviderProps) => React.JSX.Element;
266
+ declare const PropKeyProvider: ({ children, bind }: PropKeyProviderProps) => React$1.JSX.Element;
230
267
 
231
268
  type UseBoundProp<TValue extends PropValue> = {
232
269
  bind: PropKey;
@@ -251,7 +288,7 @@ type ConditionArgs = {
251
288
  type Props = PropsWithChildren<{
252
289
  replacements: ControlReplacement[];
253
290
  }>;
254
- declare const ControlReplacementsProvider: ({ replacements, children }: Props) => React.JSX.Element;
291
+ declare const ControlReplacementsProvider: ({ replacements, children }: Props) => React$1.JSX.Element;
255
292
  declare const createControlReplacementsRegistry: () => {
256
293
  registerControlReplacement: (replacement: ControlReplacement) => void;
257
294
  getControlReplacements: () => ControlReplacement[];
@@ -265,9 +302,9 @@ type ControlAdornmentsContext = {
265
302
  items?: ControlAdornmentsItems;
266
303
  };
267
304
  type ControlAdornmentsProviderProps = PropsWithChildren<ControlAdornmentsContext>;
268
- declare const ControlAdornmentsProvider: ({ children, items }: ControlAdornmentsProviderProps) => React.JSX.Element;
305
+ declare const ControlAdornmentsProvider: ({ children, items }: ControlAdornmentsProviderProps) => React$1.JSX.Element;
269
306
 
270
- declare function ControlAdornments(): React.JSX.Element | null;
307
+ declare function ControlAdornments(): React$1.JSX.Element | null;
271
308
 
272
309
  declare const injectIntoRepeaterItemIcon: (args: _elementor_locations.ReplaceableInjectArgs<{
273
310
  value: PropValue;
@@ -284,4 +321,4 @@ type UseInternalStateOptions<TValue> = {
284
321
  };
285
322
  declare const useSyncExternalState: <TValue>({ external, setExternal, persistWhen, fallback, }: UseInternalStateOptions<TValue>) => readonly [TValue, (setter: ((value: TValue) => TValue) | TValue) => void];
286
323
 
287
- export { AspectRatioControl, BackgroundControl, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent, ControlFormLabel, ControlReplacementsProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedOption, type FontCategory, FontFamilyControl, FontFamilySelector, GapControl, ImageControl, LinkControl, LinkedDimensionsControl, NumberControl, PropKeyProvider, PropProvider, type PropProviderProps, SelectControl, type SetValue, SizeControl, StrokeControl, SvgMediaControl, SwitchControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, type ToggleControlProps, UrlControl, createControlReplacementsRegistry, injectIntoRepeaterItemIcon, injectIntoRepeaterItemLabel, useBoundProp, useControlActions, useSyncExternalState };
324
+ export { AspectRatioControl, BackgroundControl, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent, ControlFormLabel, ControlReplacementsProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedOption, FilterRepeaterControl, type FontCategory, FontFamilyControl, FontFamilySelector, GapControl, ImageControl, KeyValueControl, LinkControl, LinkedDimensionsControl, NumberControl, PopoverContent, PositionControl, PropKeyProvider, PropProvider, type PropProviderProps, RepeatableControl, SelectControl, type SetValue, SizeControl, StrokeControl, SvgMediaControl, SwitchControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, type ToggleControlProps, type Unit, UrlControl, createControlReplacementsRegistry, injectIntoRepeaterItemIcon, injectIntoRepeaterItemLabel, useBoundProp, useControlActions, useSyncExternalState };